Clean up module outputFile calculation and move it to the specifications

Author: alfonso-noriega

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

@@ -59,6 +59,7 @@ export const CONFIG_EXTENSION_IDS: string[] = [
  * This class holds the public interface to interact with extensions
  */
 export class ExtensionInstance<TConfiguration extends BaseConfigType = BaseConfigType> {
+  outputFileName: string
   entrySourceFilePath: string
   devUUID: string
   localIdentifier: string
@@ -136,17 +137,6 @@ export class ExtensionInstance<TConfiguration extends BaseConfigType = BaseConfi
     return this.specification.appModuleFeatures(this.configuration)
   }
 
-  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`
-    }
-  }
-
   constructor(options: {
     configuration: TConfiguration
     configurationPath: string
@@ -165,6 +155,7 @@ export class ExtensionInstance<TConfiguration extends BaseConfigType = BaseConfi
     this.outputPath = this.directory
     this.uid = this.buildUIDFromStrategy()
     this.devUUID = `dev-${this.uid}`
+    this.outputFileName = this.specification.getOutputFileName?.(this) ?? ''
 
     if (this.features.includes('esbuild') || this.type === 'tax_calculation') {
       this.outputPath = joinPath(this.directory, 'dist', this.outputFileName)

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

@@ -54,13 +54,9 @@ export interface BuildAsset {
   static?: boolean
 }
 
-type BuildMode = 'copy_files' | 'theme' | 'function' | 'ui' | 'tax_calculation' | 'hosted_app_home' | 'none'
-
-interface BuildConfig {
-  mode: BuildMode
-  filePatterns?: string[]
-  ignoredFilePatterns?: string[]
-}
+type BuildConfig =
+  | {mode: 'ui' | 'theme' | 'function' | 'tax_calculation' | 'none' | 'hosted_app_home'}
+  | {mode: 'copy_files'; filePatterns: string[]; ignoredFilePatterns?: string[]}
 
 /**
  * Extension specification with all the needed properties and methods to load an extension.
@@ -79,6 +75,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,11 @@
+import {ExtensionInstance} from '../extension-instance.js'
 import {BaseSchema, MetafieldSchema} from '../schemas.js'
 import {createExtensionSpecification} from '../specification.js'
 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 +17,7 @@ const checkoutPostPurchaseSpec = createExtensionSpecification({
   schema: CheckoutPostPurchaseSchema,
   appModuleFeatures: (_) => ['ui_preview', 'cart_url', 'esbuild', 'single_js_entry_path'],
   buildConfig: {mode: 'ui'},
+  getOutputFileName: (extension: ExtensionInstance<CheckoutPostPurchaseConfigType>) => `${extension.handle}.js`,
   deployConfig: async (config, _) => {
     return {metafields: config.metafields ?? []}
   },

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

@@ -1,10 +1,12 @@
 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'
 
 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 +24,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>) => `${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,7 @@ const functionSpec = createExtensionSpecification({
   schema: FunctionExtensionSchema,
   appModuleFeatures: (_) => ['function'],
   buildConfig: {mode: 'function'},
+  getOutputFileName: (_extension: ExtensionInstance<FunctionConfigType>) => '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,22 @@
 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'
 
 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>) => `${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,14 @@
 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'
 
 const dependency = '@shopify/admin-ui-extensions'
 
+type ProductSubscriptionConfigType = zod.infer<typeof BaseSchema>
+
 const productSubscriptionSpec = createExtensionSpecification({
   identifier: 'product_subscription',
   additionalIdentifiers: ['subscription_management'],
@@ -13,6 +17,7 @@ const productSubscriptionSpec = createExtensionSpecification({
   schema: BaseSchema,
   appModuleFeatures: (_) => ['ui_preview', 'esbuild', 'single_js_entry_path'],
   buildConfig: {mode: 'ui'},
+  getOutputFileName: (extension: ExtensionInstance<ProductSubscriptionConfigType>) => `${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,13 @@
 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'
 
 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 +31,7 @@ const spec = createExtensionSpecification({
   schema: TaxCalculationsSchema,
   appModuleFeatures: (_) => [],
   buildConfig: {mode: 'tax_calculation'},
+  getOutputFileName: (extension: ExtensionInstance<TaxCalculationsConfigType>) => `${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,7 @@ const uiExtensionSpec = createExtensionSpecification({
   dependency,
   schema: UIExtensionSchema,
   buildConfig: {mode: 'ui'},
+  getOutputFileName: (extension: ExtensionInstance<UIExtensionConfigType>) => `${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,5 +1,6 @@
 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'
@@ -10,6 +11,7 @@ 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 +34,7 @@ const webPixelSpec = createExtensionSpecification({
   schema: WebPixelSchema,
   appModuleFeatures: (_) => ['esbuild', 'single_js_entry_path'],
   buildConfig: {mode: 'ui'},
+  getOutputFileName: (extension: ExtensionInstance<WebPixelConfigType>) => `${extension.handle}.js`,
   deployConfig: async (config, _) => {
     return {
       runtime_context: config.runtime_context,