Merge pull request #6380 from Shopify/theme-graphql-event-logging

add more event logging around graphql requests for theme commands

Author: EvilGenius13

packages/cli-kit/src/public/node/themes/api.ts

@@ -28,7 +28,7 @@ import {adminRequestDoc} from '../api/admin.js'
 import {AdminSession} from '../session.js'
 import {AbortError} from '../error.js'
 import {outputDebug} from '../output.js'
-import {recordTiming} from '../analytics.js'
+import {recordTiming, recordEvent, recordError} from '../analytics.js'
 
 export type ThemeParams = Partial<Pick<Theme, 'name' | 'role' | 'processing' | 'src'>>
 export type AssetParams = Pick<ThemeAsset, 'key'> & Partial<Pick<ThemeAsset, 'value' | 'attachment'>>
@@ -41,6 +41,7 @@ const THEME_API_NETWORK_BEHAVIOUR: RequestModeInput = {
 
 export async function fetchTheme(id: number, session: AdminSession): Promise<Theme | undefined> {
   const gid = composeThemeGid(id)
+  recordEvent('theme-api:fetch-theme')
 
   try {
     const {theme} = await adminRequestDoc({
@@ -61,21 +62,23 @@ export async function fetchTheme(id: number, session: AdminSession): Promise<The
     }
 
     // eslint-disable-next-line no-catch-all/no-catch-all
-  } catch (_error) {
+  } catch (error) {
     /**
      * Consumers of this and other theme APIs in this file expect either a theme
      * or `undefined`.
      *
      * Error handlers should not inspect GraphQL error messages directly, as
      * they are internationalized.
      */
+    recordError(error)
     outputDebug(`Error fetching theme with ID: ${id}`)
   }
 }
 
 export async function fetchThemes(session: AdminSession): Promise<Theme[]> {
   const themes: Theme[] = []
   let after: string | null = null
+  recordEvent('theme-api:fetch-themes')
 
   while (true) {
     // eslint-disable-next-line no-await-in-loop
@@ -111,6 +114,7 @@ export async function fetchThemes(session: AdminSession): Promise<Theme[]> {
 
 export async function themeCreate(params: ThemeParams, session: AdminSession): Promise<Theme | undefined> {
   const themeSource = params.src ?? SkeletonThemeCdn
+  recordEvent('theme-api:create-theme')
   const {themeCreate} = await adminRequestDoc({
     query: ThemeCreate,
     session,
@@ -130,7 +134,7 @@ export async function themeCreate(params: ThemeParams, session: AdminSession): P
   const {theme, userErrors} = themeCreate
   if (userErrors.length) {
     const userErrors = themeCreate.userErrors.map((error) => error.message).join(', ')
-    throw new AbortError(userErrors)
+    throw recordError(new AbortError(userErrors))
   }
 
   if (!theme) {
@@ -147,6 +151,7 @@ export async function themeCreate(params: ThemeParams, session: AdminSession): P
 export async function fetchThemeAssets(id: number, filenames: Key[], session: AdminSession): Promise<ThemeAsset[]> {
   const assets: ThemeAsset[] = []
   let after: string | null = null
+  recordEvent('theme-api:fetch-assets')
 
   while (true) {
     // eslint-disable-next-line no-await-in-loop
@@ -191,6 +196,7 @@ export async function fetchThemeAssets(id: number, filenames: Key[], session: Ad
 export async function deleteThemeAssets(id: number, filenames: Key[], session: AdminSession): Promise<Result[]> {
   const batchSize = 50
   const results: Result[] = []
+  recordEvent('theme-api:delete-assets')
 
   for (let i = 0; i < filenames.length; i += batchSize) {
     const batch = filenames.slice(i, i + batchSize)
@@ -220,6 +226,7 @@ export async function deleteThemeAssets(id: number, filenames: Key[], session: A
     if (userErrors.length > 0) {
       userErrors.forEach((error) => {
         if (error.filename) {
+          recordError(`Asset deletion failed for ${error.filename}: ${error.message}`)
           results.push({
             key: error.filename,
             success: false,
@@ -242,6 +249,7 @@ export async function bulkUploadThemeAssets(
   session: AdminSession,
 ): Promise<Result[]> {
   const results: Result[] = []
+  recordEvent('theme-api:bulk-upload-assets')
   for (let i = 0; i < assets.length; i += 50) {
     const chunk = assets.slice(i, i + 50)
     const files = prepareFilesForUpload(chunk)
@@ -314,6 +322,7 @@ function processUploadResults(uploadResults: ThemeFilesUpsertMutation): Result[]
     if (!error.filename) {
       unexpectedGraphQLError(`Error uploading theme files: ${error.message}`)
     }
+    recordError(`Asset upload failed for ${error.filename}: ${error.message}`)
     results.push({
       key: error.filename,
       success: false,
@@ -328,6 +337,7 @@ function processUploadResults(uploadResults: ThemeFilesUpsertMutation): Result[]
 export async function fetchChecksums(id: number, session: AdminSession): Promise<Checksum[]> {
   const checksums: Checksum[] = []
   let after: string | null = null
+  recordEvent('theme-api:fetch-checksums')
 
   while (true) {
     // eslint-disable-next-line no-await-in-loop
@@ -341,7 +351,7 @@ export async function fetchChecksums(id: number, session: AdminSession): Promise
 
     if (!response?.theme?.files?.nodes || !response?.theme?.files?.pageInfo) {
       const userErrors = response.theme?.files?.userErrors.map((error) => error.filename).join(', ')
-      throw new AbortError(`Failed to fetch checksums for: ${userErrors}`)
+      throw recordError(new AbortError(`Failed to fetch checksums for: ${userErrors}`))
     }
 
     const {nodes, pageInfo} = response.theme.files
@@ -367,6 +377,7 @@ export async function themeUpdate(id: number, params: ThemeParams, session: Admi
   if (name) {
     input.name = name
   }
+  recordEvent('theme-api:update-theme')
 
   const {themeUpdate} = await adminRequestDoc({
     query: ThemeUpdate,
@@ -382,7 +393,7 @@ export async function themeUpdate(id: number, params: ThemeParams, session: Admi
   const {theme, userErrors} = themeUpdate
   if (userErrors.length) {
     const userErrors = themeUpdate.userErrors.map((error) => error.message).join(', ')
-    throw new AbortError(userErrors)
+    throw recordError(new AbortError(userErrors))
   }
 
   if (!theme) {
@@ -398,6 +409,7 @@ export async function themeUpdate(id: number, params: ThemeParams, session: Admi
 }
 
 export async function themePublish(id: number, session: AdminSession): Promise<Theme | undefined> {
+  recordEvent('theme-api:publish-theme')
   const {themePublish} = await adminRequestDoc({
     query: ThemePublish,
     session,
@@ -412,7 +424,7 @@ export async function themePublish(id: number, session: AdminSession): Promise<T
   const {theme, userErrors} = themePublish
   if (userErrors.length) {
     const userErrors = themePublish.userErrors.map((error) => error.message).join(', ')
-    throw new AbortError(userErrors)
+    throw recordError(new AbortError(userErrors))
   }
 
   if (!theme) {
@@ -428,6 +440,7 @@ export async function themePublish(id: number, session: AdminSession): Promise<T
 }
 
 export async function themeDelete(id: number, session: AdminSession): Promise<boolean | undefined> {
+  recordEvent('theme-api:delete-theme')
   const {themeDelete} = await adminRequestDoc({
     query: ThemeDelete,
     session,
@@ -442,7 +455,7 @@ export async function themeDelete(id: number, session: AdminSession): Promise<bo
   const {deletedThemeId, userErrors} = themeDelete
   if (userErrors.length) {
     const userErrors = themeDelete.userErrors.map((error) => error.message).join(', ')
-    throw new AbortError(userErrors)
+    throw recordError(new AbortError(userErrors))
   }
 
   if (!deletedThemeId) {
@@ -465,6 +478,7 @@ export async function themeDuplicate(
   session: AdminSession,
 ): Promise<ThemeDuplicateResult> {
   let requestId: string | undefined
+  recordEvent('theme-api:duplicate-theme')
 
   const {themeDuplicate} = await adminRequestDoc({
     query: ThemeDuplicate,
@@ -481,6 +495,7 @@ export async function themeDuplicate(
 
   if (!themeDuplicate) {
     // An unexpected error occurred during the GraphQL request execution
+    recordError('Failed to duplicate theme')
     return {
       theme: undefined,
       userErrors: [{message: 'Failed to duplicate theme'}],
@@ -521,6 +536,7 @@ export async function themeDuplicate(
 }
 
 export async function metafieldDefinitionsByOwnerType(type: MetafieldOwnerType, session: AdminSession) {
+  recordEvent('theme-api:fetch-metafield-definitions')
   const {metafieldDefinitions} = await adminRequestDoc({
     query: MetafieldDefinitionsByOwnerType,
     session,
@@ -540,6 +556,7 @@ export async function metafieldDefinitionsByOwnerType(type: MetafieldOwnerType,
 }
 
 export async function passwordProtected(session: AdminSession): Promise<boolean> {
+  recordEvent('theme-api:check-password-protection')
   const {onlineStore} = await adminRequestDoc({
     query: OnlineStorePasswordProtection,
     session,
@@ -554,7 +571,7 @@ export async function passwordProtected(session: AdminSession): Promise<boolean>
 }
 
 function unexpectedGraphQLError(message: string): never {
-  throw new AbortError(message)
+  throw recordError(new AbortError(message))
 }
 
 function themeGid(id: number): string {
@@ -583,7 +600,7 @@ export async function parseThemeFileContent(
         return {attachment: Buffer.from(arrayBuffer).toString('base64')}
       } catch (error) {
         // Raise error if we can't download the file
-        throw new AbortError(`Error downloading content from URL: ${body.url}`)
+        throw recordError(new AbortError(`Error downloading content from URL: ${body.url}`))
       }
   }
 }