Clean up module outputFile calculation and move it to the specifications

Author: alfonso-noriega

packages/app/src/cli/models/extensions/extension-instance.ts

@@ -137,14 +137,7 @@ export class ExtensionInstance<TConfiguration extends BaseConfigType = BaseConfi
   }
 
   get outputFileName() {
-    const mode = this.specification.buildConfig.mode
-    if (mode === 'copy_files' || mode === 'theme') {
-      return ''
-    } else if (mode === 'function') {
-      return 'index.wasm'
-    } else {
-      return `${this.handle}.js`
-    }
+    return basename(this.specification.getOutputFileName?.(this) ?? '')
   }
 
   constructor(options: {
@@ -162,19 +155,9 @@ export class ExtensionInstance<TConfiguration extends BaseConfigType = BaseConfi
     this.handle = this.buildHandle()
     this.localIdentifier = this.handle
     this.idEnvironmentVariableName = `SHOPIFY_${constantize(this.localIdentifier)}_ID`
-    this.outputPath = this.directory
+    this.outputPath = joinPath(this.directory, this.specification.getOutputFileName?.(this) ?? '')
     this.uid = this.buildUIDFromStrategy()
     this.devUUID = `dev-${this.uid}`
-
-    if (this.features.includes('esbuild') || this.type === 'tax_calculation') {
-      this.outputPath = joinPath(this.directory, 'dist', this.outputFileName)
-    }
-
-    if (this.isFunctionExtension) {
-      const config = this.configuration as unknown as FunctionConfigType
-      const defaultPath = joinPath('dist', 'index.wasm')
-      this.outputPath = joinPath(this.directory, config.build?.path ?? defaultPath)
-    }
   }
 
   get draftMessages() {
@@ -408,8 +391,7 @@ export class ExtensionInstance<TConfiguration extends BaseConfigType = BaseConfi
 
   getOutputPathForDirectory(directory: string, outputId?: string) {
     const id = this.getOutputFolderId(outputId)
-    const outputFile = this.outputFileName === '' ? '' : joinPath('dist', this.outputFileName)
-    return joinPath(directory, id, outputFile)
+    return joinPath(directory, id, this.specification.getOutputFileName?.(this) ?? '')
   }
 
   get singleTarget() {

packages/app/src/cli/models/extensions/specification.ts

@@ -72,6 +72,7 @@ export interface ExtensionSpecification<TConfiguration extends BaseConfigType =
   buildConfig: BuildConfig
   dependency?: string
   graphQLType?: string
+  getOutputFileName?: (extension: ExtensionInstance<TConfiguration>) => string
   getBundleExtensionStdinContent?: (config: TConfiguration) => {main: string; assets?: Asset[]}
   deployConfig?: (
     config: TConfiguration,

packages/app/src/cli/models/extensions/specifications/checkout_post_purchase.ts

@@ -1,9 +1,12 @@
+import {ExtensionInstance} from '../extension-instance.js'
 import {BaseSchema, MetafieldSchema} from '../schemas.js'
 import {createExtensionSpecification} from '../specification.js'
+import {joinPath} from '@shopify/cli-kit/node/path'
 import {zod} from '@shopify/cli-kit/node/schema'
 
 const dependency = '@shopify/post-purchase-ui-extensions'
 
+type CheckoutPostPurchaseConfigType = zod.infer<typeof CheckoutPostPurchaseSchema>
 const CheckoutPostPurchaseSchema = BaseSchema.extend({
   metafields: zod.array(MetafieldSchema).optional(),
 })
@@ -15,6 +18,8 @@ const checkoutPostPurchaseSpec = createExtensionSpecification({
   schema: CheckoutPostPurchaseSchema,
   appModuleFeatures: (_) => ['ui_preview', 'cart_url', 'esbuild', 'single_js_entry_path'],
   buildConfig: {mode: 'ui'},
+  getOutputFileName: (extension: ExtensionInstance<CheckoutPostPurchaseConfigType>) =>
+    joinPath('dist', `${extension.handle}.js`),
   deployConfig: async (config, _) => {
     return {metafields: config.metafields ?? []}
   },

packages/app/src/cli/models/extensions/specifications/checkout_ui_extension.ts

@@ -1,10 +1,13 @@
 import {createExtensionSpecification} from '../specification.js'
 import {BaseSchema, MetafieldSchema} from '../schemas.js'
 import {loadLocalesConfig} from '../../../utilities/extensions/locales-configuration.js'
+import {ExtensionInstance} from '../extension-instance.js'
 import {zod} from '@shopify/cli-kit/node/schema'
+import {joinPath} from '@shopify/cli-kit/node/path'
 
 const dependency = '@shopify/checkout-ui-extensions'
 
+type CheckoutConfigType = zod.infer<typeof CheckoutSchema>
 const CheckoutSchema = BaseSchema.extend({
   name: zod.string(),
   extension_points: zod.array(zod.string()).optional(),
@@ -22,6 +25,7 @@ const checkoutSpec = createExtensionSpecification({
   schema: CheckoutSchema,
   appModuleFeatures: (_) => ['ui_preview', 'cart_url', 'esbuild', 'single_js_entry_path', 'generates_source_maps'],
   buildConfig: {mode: 'ui'},
+  getOutputFileName: (extension: ExtensionInstance<CheckoutConfigType>) => joinPath('dist', `${extension.handle}.js`),
   deployConfig: async (config, directory) => {
     return {
       extension_points: config.extension_points,

packages/app/src/cli/models/extensions/specifications/function.ts

@@ -1,6 +1,7 @@
 import {createExtensionSpecification} from '../specification.js'
 import {BaseSchema} from '../schemas.js'
 import {loadLocalesConfig} from '../../../utilities/extensions/locales-configuration.js'
+import {ExtensionInstance} from '../extension-instance.js'
 import {zod} from '@shopify/cli-kit/node/schema'
 import {joinPath} from '@shopify/cli-kit/node/path'
 import {fileExists, readFile} from '@shopify/cli-kit/node/fs'
@@ -88,6 +89,8 @@ const functionSpec = createExtensionSpecification({
   schema: FunctionExtensionSchema,
   appModuleFeatures: (_) => ['function'],
   buildConfig: {mode: 'function'},
+  getOutputFileName: (extension: ExtensionInstance<FunctionConfigType>) =>
+    extension.configuration.build?.path ?? joinPath('dist', 'index.wasm'),
   deployConfig: async (config, directory, apiKey) => {
     let inputQuery: string | undefined
     const moduleId = randomUUID()

packages/app/src/cli/models/extensions/specifications/pos_ui_extension.ts

@@ -1,17 +1,23 @@
 import {getDependencyVersion} from '../../app/app.js'
 import {createExtensionSpecification} from '../specification.js'
 import {BaseSchema} from '../schemas.js'
+import {ExtensionInstance} from '../extension-instance.js'
 import {BugError} from '@shopify/cli-kit/node/error'
 import {zod} from '@shopify/cli-kit/node/schema'
+import {joinPath} from '@shopify/cli-kit/node/path'
 
 const dependency = '@shopify/retail-ui-extensions'
 
+type PosUIConfigType = zod.infer<typeof PosUISchema>
+const PosUISchema = BaseSchema.extend({name: zod.string()})
+
 const posUISpec = createExtensionSpecification({
   identifier: 'pos_ui_extension',
   dependency,
-  schema: BaseSchema.extend({name: zod.string()}),
+  schema: PosUISchema,
   appModuleFeatures: (_) => ['ui_preview', 'esbuild', 'single_js_entry_path'],
   buildConfig: {mode: 'ui'},
+  getOutputFileName: (extension: ExtensionInstance<PosUIConfigType>) => joinPath('dist', `${extension.handle}.js`),
   deployConfig: async (config, directory) => {
     const result = await getDependencyVersion(dependency, directory)
     if (result === 'not_found') throw new BugError(`Dependency ${dependency} not found`)

packages/app/src/cli/models/extensions/specifications/product_subscription.ts

@@ -1,10 +1,15 @@
 import {getDependencyVersion} from '../../app/app.js'
 import {createExtensionSpecification} from '../specification.js'
 import {BaseSchema} from '../schemas.js'
+import {ExtensionInstance} from '../extension-instance.js'
 import {BugError} from '@shopify/cli-kit/node/error'
+import {zod} from '@shopify/cli-kit/node/schema'
+import {joinPath} from '@shopify/cli-kit/node/path'
 
 const dependency = '@shopify/admin-ui-extensions'
 
+type ProductSubscriptionConfigType = zod.infer<typeof BaseSchema>
+
 const productSubscriptionSpec = createExtensionSpecification({
   identifier: 'product_subscription',
   additionalIdentifiers: ['subscription_management'],
@@ -13,6 +18,8 @@ const productSubscriptionSpec = createExtensionSpecification({
   schema: BaseSchema,
   appModuleFeatures: (_) => ['ui_preview', 'esbuild', 'single_js_entry_path'],
   buildConfig: {mode: 'ui'},
+  getOutputFileName: (extension: ExtensionInstance<ProductSubscriptionConfigType>) =>
+    joinPath('dist', `${extension.handle}.js`),
   deployConfig: async (_, directory) => {
     const result = await getDependencyVersion(dependency, directory)
     if (result === 'not_found') throw new BugError(`Dependency ${dependency} not found`)

packages/app/src/cli/models/extensions/specifications/tax_calculation.ts

@@ -1,11 +1,14 @@
 import {createExtensionSpecification} from '../specification.js'
 import {BaseSchema, MetafieldSchema} from '../schemas.js'
+import {ExtensionInstance} from '../extension-instance.js'
 import {zod} from '@shopify/cli-kit/node/schema'
+import {joinPath} from '@shopify/cli-kit/node/path'
 
 const CartLinePropertySchema = zod.object({
   key: zod.string(),
 })
 
+type TaxCalculationsConfigType = zod.infer<typeof TaxCalculationsSchema>
 const TaxCalculationsSchema = BaseSchema.extend({
   production_api_base_url: zod.string(),
   benchmark_api_base_url: zod.string().optional(),
@@ -29,6 +32,8 @@ const spec = createExtensionSpecification({
   schema: TaxCalculationsSchema,
   appModuleFeatures: (_) => [],
   buildConfig: {mode: 'tax_calculation'},
+  getOutputFileName: (extension: ExtensionInstance<TaxCalculationsConfigType>) =>
+    joinPath('dist', `${extension.handle}.js`),
   deployConfig: async (config, _) => {
     return {
       production_api_base_url: config.production_api_base_url,

packages/app/src/cli/models/extensions/specifications/ui_extension.ts

@@ -36,6 +36,7 @@ export interface BuildManifest {
 
 const missingExtensionPointsMessage = 'No extension targets defined, add a `targeting` field to your configuration'
 
+type UIExtensionConfigType = zod.infer<typeof UIExtensionSchema>
 export const UIExtensionSchema = BaseSchema.extend({
   name: zod.string(),
   type: zod.literal('ui_extension'),
@@ -102,6 +103,8 @@ const uiExtensionSpec = createExtensionSpecification({
   dependency,
   schema: UIExtensionSchema,
   buildConfig: {mode: 'ui'},
+  getOutputFileName: (extension: ExtensionInstance<UIExtensionConfigType>) =>
+    joinPath('dist', `${extension.handle}.js`),
   appModuleFeatures: (config) => {
     const basic: ExtensionFeature[] = ['ui_preview', 'esbuild', 'generates_source_maps']
     const needsCart =

packages/app/src/cli/models/extensions/specifications/web_pixel_extension.ts

@@ -1,15 +1,18 @@
 import {createExtensionSpecification} from '../specification.js'
 import {BaseSchema} from '../schemas.js'
+import {ExtensionInstance} from '../extension-instance.js'
 import {zod} from '@shopify/cli-kit/node/schema'
 import {AbortError} from '@shopify/cli-kit/node/error'
 import {fileSize} from '@shopify/cli-kit/node/fs'
+import {joinPath} from '@shopify/cli-kit/node/path'
 
 const kilobytes = 1024
 const BUNDLE_SIZE_LIMIT_KB = 128
 const BUNDLE_SIZE_LIMIT = BUNDLE_SIZE_LIMIT_KB * kilobytes
 
 const dependency = '@shopify/web-pixels-extension'
 
+type WebPixelConfigType = zod.infer<typeof WebPixelSchema>
 const WebPixelSchema = BaseSchema.extend({
   runtime_context: zod.string(),
   version: zod.string().optional(),
@@ -32,6 +35,7 @@ const webPixelSpec = createExtensionSpecification({
   schema: WebPixelSchema,
   appModuleFeatures: (_) => ['esbuild', 'single_js_entry_path'],
   buildConfig: {mode: 'ui'},
+  getOutputFileName: (extension: ExtensionInstance<WebPixelConfigType>) => joinPath('dist', `${extension.handle}.js`),
   deployConfig: async (config, _) => {
     return {
       runtime_context: config.runtime_context,