Fix page generator with custom context (#669)

Co-authored-by: Rafael Nunes <rafaelgnds@gmail.com> (patch)

packages/cli/src/commands/generate.ts

@@ -173,18 +173,27 @@ export class Generate extends Command {
     }
   }
 
-  getModelNameAndContext(modelName: string, context?: string): {model: string; context: string} {
+  getModelNameAndContext(modelName: string, context?: string): {model: string; context?: string} {
     const modelSegments = modelName.split(/[\\/]/)
-    const contextSegments = (context || '').split(/[\\/]/)
+
     if (modelSegments.length > 1) {
       return {
         model: modelSegments[modelSegments.length - 1],
         context: path.join(...modelSegments.slice(0, modelSegments.length - 1)),
       }
     }
+
+    if (Boolean(context)) {
+      const contextSegments = (context as string).split(/[\\/]/)
+
+      return {
+        model: modelName,
+        context: path.join(...contextSegments),
+      }
+    }
+
     return {
       model: modelName,
-      context: path.join(...contextSegments),
     }
   }
 

packages/cli/test/commands/generate.test.ts

@@ -2,24 +2,50 @@ import {Generate} from '../../src/commands/generate'
 import * as path from 'path'
 
 describe('`generate` command', () => {
-  it('properly extracts context from arguments', () => {
+  describe('#getModelNameAndContext', () => {
-    const getModelNameAndContext = Generate.prototype.getModelNameAndContext
+    it('properly extracts context from arguments', () => {
-    expect(getModelNameAndContext('tasks', 'admin')).toEqual({
+      const getModelNameAndContext = Generate.prototype.getModelNameAndContext
-      model: 'tasks',
+      expect(getModelNameAndContext('admin/tasks')).toEqual({
-      context: 'admin',
+        model: 'tasks',
+        context: 'admin',
+      })
+
+      expect(getModelNameAndContext('admin/projects/tasks')).toEqual({
+        model: 'tasks',
+        context: path.join('admin', 'projects'),
+      })
+
+      // this should fail on windows if generic filesystem-specific code makes it in
+      expect(getModelNameAndContext('admin\\projects\\tasks')).toEqual({
+        model: 'tasks',
+        context: path.join('admin', 'projects'),
+      })
     })
-    expect(getModelNameAndContext('admin/tasks')).toEqual({
+
-      model: 'tasks',
+    describe('when passing context', () => {
-      context: 'admin',
+      it('returns both model and context in their own field', () => {
-    })
+        const getModelNameAndContext = Generate.prototype.getModelNameAndContext
-    expect(getModelNameAndContext('admin/projects/tasks')).toEqual({
+        expect(getModelNameAndContext('tasks', 'admin')).toEqual({
-      model: 'tasks',
+          model: 'tasks',
-      context: path.join('admin', 'projects'),
+          context: 'admin',
-    })
+        })
-    // this should fail on windows if generic filesystem-specific code makes it in
+      })
-    expect(getModelNameAndContext('admin\\projects\\tasks')).toEqual({
+
-      model: 'tasks',
+      it('returns context undefined if not set', () => {
-      context: path.join('admin', 'projects'),
+        const getModelNameAndContext = Generate.prototype.getModelNameAndContext
+        expect(getModelNameAndContext('tasks')).toEqual({
+          model: 'tasks',
+          context: undefined,
+        })
+      })
+
+      it('returns context undefined if empty string', () => {
+        const getModelNameAndContext = Generate.prototype.getModelNameAndContext
+        expect(getModelNameAndContext('tasks', '')).toEqual({
+          model: 'tasks',
+          context: undefined,
+        })
+      })
     })
   })
 })

packages/generator/src/generators/page-generator.ts

@@ -41,12 +41,17 @@ export class PageGenerator extends Generator<PageGeneratorOptions> {
       modelNames: this.options.modelNames,
       ModelName: this.options.ModelName,
       ModelNames: this.options.ModelNames,
+      modelNamesPath: this.getModelNamesPath(),
     }
   }
 
-  getTargetDirectory() {
+  getModelNamesPath() {
     const context = this.options.context ? `${this.options.context}/` : ''
+    return context + this.options.modelNames
+  }
+
+  getTargetDirectory() {
     const parent = this.options.parentModels ? `${this.options.parentModels}/__parentModelParam__/` : ''
-    return `app/${context}${this.options.modelNames}/pages/${parent}${this.options.modelNames}`
+    return `app/${this.getModelNamesPath()}/pages/${parent}${this.options.modelNames}`
   }
 }

packages/generator/templates/page/__modelIdParam__.tsx

@@ -1,7 +1,7 @@
 import React, {Suspense} from 'react'
 import {Head, Link, useRouter, useQuery, useParam} from 'blitz'
-import get__ModelName__ from 'app/__modelNames__/queries/get__ModelName__'
+import get__ModelName__ from 'app/__modelNamesPath__/queries/get__ModelName__'
-import delete__ModelName__ from 'app/__modelNames__/mutations/delete__ModelName__'
+import delete__ModelName__ from 'app/__modelNamesPath__/mutations/delete__ModelName__'
 
 export const __ModelName__: React.FC = () => {
   const router = useRouter()

packages/generator/templates/page/__modelIdParam__/edit.tsx

@@ -1,8 +1,8 @@
 import React, {Suspense} from 'react'
 import {Head, Link, useRouter, useQuery, useParam} from 'blitz'
-import get__ModelName__ from 'app/__modelNames__/queries/get__ModelName__'
+import get__ModelName__ from 'app/__modelNamesPath__/queries/get__ModelName__'
-import update__ModelName__ from 'app/__modelNames__/mutations/update__ModelName__'
+import update__ModelName__ from 'app/__modelNamesPath__/mutations/update__ModelName__'
-import __ModelName__Form from 'app/__modelNames__/components/__ModelName__Form'
+import __ModelName__Form from 'app/__modelNamesPath__/components/__ModelName__Form'
 
 export const Edit__ModelName__: React.FC = () => {
   const router = useRouter()

packages/generator/templates/page/index.tsx

@@ -4,7 +4,7 @@ if (process.env.parentModel) {
 } else {
   import {Head, Link, useQuery} from 'blitz'
 }
-import get__ModelNames__ from 'app/__modelNames__/queries/get__ModelNames__'
+import get__ModelNames__ from 'app/__modelNamesPath__/queries/get__ModelNames__'
 
 export const __ModelNames__List: React.FC = () => {
   if (process.env.parentModel) {

packages/generator/templates/page/new.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import {Head, Link, useRouter, useParam} from 'blitz'
-import create__ModelName__ from 'app/__modelNames__/mutations/create__ModelName__'
+import create__ModelName__ from 'app/__modelNamesPath__/mutations/create__ModelName__'
-import __ModelName__Form from 'app/__modelNames__/components/__ModelName__Form'
+import __ModelName__Form from 'app/__modelNamesPath__/components/__ModelName__Form'
 
 const New__ModelName__Page: React.FC = () => {
   const router = useRouter()

packages/generator/test/generators/page-generator.test.ts

@@ -0,0 +1,98 @@
+import {PageGenerator} from '../../src/generators/page-generator'
+
+describe('PageGenerator', () => {
+  const generator = new PageGenerator({
+    ModelName: 'project',
+    ModelNames: 'projects',
+    modelName: 'project',
+    modelNames: 'projects',
+  })
+
+  describe('#getModelNamesPath', () => {
+    it('returns path only with default modelNames', () => {
+      expect(generator.getModelNamesPath()).toEqual('projects')
+    })
+
+    describe('when generator has context option', () => {
+      const generator = new PageGenerator({
+        ModelName: 'project',
+        ModelNames: 'projects',
+        modelName: 'project',
+        modelNames: 'projects',
+        context: 'marketing',
+      })
+
+      it('returns path with context as prefix', () => {
+        expect(generator.getModelNamesPath()).toEqual('marketing/projects')
+      })
+    })
+  })
+
+  describe('#getTemplateValues', () => {
+    it('returns object with correct template values', async () => {
+      const values = await generator.getTemplateValues()
+      expect(values).toEqual({
+        ModelName: 'project',
+        ModelNames: 'projects',
+        ParentModel: undefined,
+        ParentModels: undefined,
+        modelNamesPath: 'projects',
+        modelId: 'projectId',
+        modelIdParam: '[projectId]',
+        modelName: 'project',
+        modelNames: 'projects',
+        parentModel: undefined,
+        parentModelId: '',
+        parentModelParam: '',
+        parentModels: undefined,
+      })
+    })
+
+    describe('when generator has context option', () => {
+      const generator = new PageGenerator({
+        ModelName: 'project',
+        ModelNames: 'projects',
+        modelName: 'project',
+        modelNames: 'projects',
+        context: 'marketing',
+      })
+
+      it('returns path with context as prefix', async () => {
+        const values = await generator.getTemplateValues()
+        expect(values).toEqual(
+          expect.objectContaining({
+            modelNamesPath: 'marketing/projects',
+          }),
+        )
+      })
+    })
+
+    describe('when generator has parent option', () => {
+      const generator = new PageGenerator({
+        ModelName: 'project',
+        ModelNames: 'projects',
+        modelName: 'project',
+        modelNames: 'projects',
+        context: 'marketing',
+        parentModel: 'board',
+        parentModels: 'boards',
+        ParentModel: 'board',
+        ParentModels: 'boards',
+      })
+
+      it('returns path with context as prefix', async () => {
+        const values = await generator.getTemplateValues()
+        expect(values).toEqual(
+          expect.objectContaining({
+            parentModelId: 'boardId',
+            parentModelParam: '[boardId]',
+            parentModel: 'board',
+            parentModels: 'boards',
+            ParentModel: 'board',
+            ParentModels: 'boards',
+          }),
+        )
+      })
+    })
+  })
+})