ensure suggested app names are valid

Author: craigmichaelmartin

packages/app/src/cli/commands/app/init.ts

@@ -7,6 +7,7 @@ import {validateFlavorValue, validateTemplateValue} from '../../services/init/va
 import {MinimalOrganizationApp, Organization, OrganizationApp} from '../../models/organization.js'
 import {appNamePrompt, createAsNewAppPrompt, selectAppPrompt} from '../../prompts/dev.js'
 import {searchForAppsByNameFactory} from '../../services/dev/prompt-helpers.js'
+import {isValidName} from '../../models/app/validation/common.js'
 import {Flags} from '@oclif/core'
 import {globalFlags} from '@shopify/cli-kit/node/cli'
 import {resolvePath, cwd} from '@shopify/cli-kit/node/path'
@@ -72,7 +73,8 @@ export default class Init extends AppCommand {
     validateFlavorValue(flags.template, flags.flavor)
 
     const inferredPackageManager = inferPackageManager(flags['package-manager'])
-    const name = flags.name ?? (await generateRandomNameForSubdirectory({suffix: 'app', directory: flags.path}))
+    const name =
+      flags.name ?? (await generateRandomNameForSubdirectory({suffix: 'app', directory: flags.path, isValidName}))
 
     // Force user authentication before prompting.
     let developerPlatformClient = selectDeveloperPlatformClient()

packages/app/src/cli/models/app/validation/common.ts

@@ -20,3 +20,9 @@ function isValidUrl(input: string, httpsOnly: boolean) {
 export function ensurePathStartsWithSlash(arg: unknown) {
   return typeof arg === 'string' && !arg.startsWith('/') ? `/${arg}` : arg
 }
+
+export const APP_NAME_MAX_LENGTH = 30
+
+export function isValidName(name: string): boolean {
+  return name.length <= APP_NAME_MAX_LENGTH
+}

packages/app/src/cli/prompts/dev.ts

@@ -3,6 +3,7 @@ import {Organization, MinimalOrganizationApp, OrganizationStore, MinimalAppIdent
 import {getTomls} from '../utilities/app/config/getTomls.js'
 import {setCachedCommandTomlMap} from '../services/local-storage.js'
 import {Paginateable} from '../utilities/developer-platform-client.js'
+import {APP_NAME_MAX_LENGTH} from '../models/app/validation/common.js'
 import {
   RenderAutocompleteOptions,
   renderAutocompletePrompt,
@@ -129,8 +130,8 @@ export async function appNamePrompt(currentName: string): Promise<string> {
       if (value.length === 0) {
         return "App name can't be empty"
       }
-      if (value.length > 30) {
-        return 'Enter a shorter name (30 character max.)'
+      if (value.length > APP_NAME_MAX_LENGTH) {
+        return `Enter a shorter name (${APP_NAME_MAX_LENGTH} character max.)`
       }
       if (value.includes('shopify')) {
         return 'Name can\'t contain "shopify." Enter another name.'

packages/cli-kit/src/public/node/fs.test.ts

@@ -218,6 +218,27 @@ describe('makeDirectoryWithRandomName', () => {
       expect(takeRandomFromArray).toHaveBeenCalledTimes(4)
     })
   })
+
+  test('rerolls the name if an invalid name is produced', async () => {
+    await inTemporaryDirectory(async (tmpDir) => {
+      // Given
+      vi.mocked(takeRandomFromArray).mockReturnValueOnce('invalid')
+      vi.mocked(takeRandomFromArray).mockReturnValueOnce('name')
+      vi.mocked(takeRandomFromArray).mockReturnValueOnce('valid')
+      vi.mocked(takeRandomFromArray).mockReturnValueOnce('name')
+
+      // When
+      const got = await generateRandomNameForSubdirectory({
+        suffix: 'app',
+        directory: tmpDir,
+        isValidName: (name: string) => name !== 'invalid-name-app',
+      })
+
+      // Then
+      expect(got).toEqual('valid-name-app')
+      expect(takeRandomFromArray).toHaveBeenCalledTimes(4)
+    })
+  })
 })
 
 describe('readFileSync', () => {

packages/cli-kit/src/public/node/fs.ts

@@ -468,8 +468,13 @@ interface GenerateRandomDirectoryOptions {
 
   /** Type of word to use for random name. */
   family?: RandomNameFamily
+
+  /** Criteria predicate for generated name */
+  isValidName?: (name: string) => boolean
 }
 
+const defaultIsValidName = () => true
+
 /**
  * It generates a random directory directory name for a sub-directory.
  * It ensures that the returned directory name doesn't exist.
@@ -479,14 +484,15 @@ interface GenerateRandomDirectoryOptions {
  */
 export async function generateRandomNameForSubdirectory(options: GenerateRandomDirectoryOptions): Promise<string> {
   const generated = `${getRandomName(options.family ?? 'business')}-${options.suffix}`
+
+  const validName = (options.isValidName ?? defaultIsValidName)(generated)
+  if (!validName) return generateRandomNameForSubdirectory(options)
+
   const randomDirectoryPath = joinPath(options.directory, generated)
   const isAppDirectoryTaken = await fileExists(randomDirectoryPath)
+  if (isAppDirectoryTaken) return generateRandomNameForSubdirectory(options)
 
-  if (isAppDirectoryTaken) {
-    return generateRandomNameForSubdirectory(options)
-  } else {
-    return generated
-  }
+  return generated
 }
 
 /**