Release the React Router template

Author: byrichardpowell

packages/app/src/cli/prompts/init/init.test.ts

@@ -28,23 +28,23 @@ describe('init', () => {
     // Then
     expect(renderSelectPrompt).toHaveBeenCalledWith({
       choices: [
-        {label: 'Build a Remix app (recommended)', value: 'remix'},
+        {label: 'Build a React Router app (recommended)', value: 'reactRouter'},
         {label: 'Build an extension-only app', value: 'none'},
       ],
       message: 'Get started building your app:',
-      defaultValue: 'remix',
+      defaultValue: 'reactRouter',
     })
     expect(got).toEqual({...options, ...answers, templateType: 'none', globalCLIResult})
   })
 
   test('it renders branches for templates that have them', async () => {
     const answers = {
-      template: 'https://github.com/Shopify/shopify-app-template-remix#javascript',
+      template: 'https://github.com/Shopify/shopify-app-template-react-router#javascript',
     }
     const options: InitOptions = {}
 
     // Given
-    vi.mocked(renderSelectPrompt).mockResolvedValueOnce('remix')
+    vi.mocked(renderSelectPrompt).mockResolvedValueOnce('reactRouter')
     vi.mocked(renderSelectPrompt).mockResolvedValueOnce('javascript')
 
     // When
@@ -53,19 +53,19 @@ describe('init', () => {
     // Then
     expect(renderSelectPrompt).toHaveBeenCalledWith({
       choices: [
-        {label: 'Build a Remix app (recommended)', value: 'remix'},
+        {label: 'Build a React Router app (recommended)', value: 'reactRouter'},
         {label: 'Build an extension-only app', value: 'none'},
       ],
       message: 'Get started building your app:',
-      defaultValue: 'remix',
+      defaultValue: 'reactRouter',
     })
     expect(renderSelectPrompt).toHaveBeenCalledWith({
       choices: [
         {label: 'JavaScript', value: 'javascript'},
         {label: 'TypeScript', value: 'main'},
       ],
-      message: 'For your Remix template, which language do you want?',
+      message: 'For your React Router template, which language do you want?',
     })
-    expect(got).toEqual({...options, ...answers, templateType: 'remix', globalCLIResult})
+    expect(got).toEqual({...options, ...answers, templateType: 'reactRouter', globalCLIResult})
   })
 })

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

@@ -31,9 +31,21 @@ interface Template {
 // Eventually this list should be taken from a remote location
 // That way we don't have to update the CLI every time we add a template
 export const templates = {
+  reactRouter: {
+    url: 'https://github.com/Shopify/shopify-app-template-react-router',
+    label: 'Build a React Router app (recommended)',
+    visible: true,
+    branches: {
+      prompt: 'For your React Router template, which language do you want?',
+      options: {
+        javascript: {branch: 'javascript', label: 'JavaScript'},
+        typescript: {branch: 'main', label: 'TypeScript'},
+      },
+    },
+  } as Template,
   remix: {
     url: 'https://github.com/Shopify/shopify-app-template-remix',
-    label: 'Build a Remix app (recommended)',
+    label: 'Build a Remix app',
     visible: true,
     branches: {
       prompt: 'For your Remix template, which language do you want?',
@@ -72,14 +84,14 @@ type PredefinedTemplate = keyof typeof templates
 const allTemplates = Object.keys(templates) as Readonly<PredefinedTemplate[]>
 export const visibleTemplates = allTemplates.filter((key) => templates[key].visible) as Readonly<PredefinedTemplate[]>
 
-const templateOptionsInOrder = ['remix', 'none'] as const
+const templateOptionsInOrder = ['reactRouter', 'none'] as const
 
 const init = async (options: InitOptions): Promise<InitOutput> => {
   let template = options.template
   const flavor = options.flavor
 
   const defaults = {
-    template: templates.remix.url,
+    template: templates.reactRouter.url,
   } as const
 
   if (!template) {