fix: generated readmes (#946)

packages/create-gasket-app/lib/scaffold/actions/global-prompts.js

@@ -39,7 +39,11 @@ async function choosePackageManager(context, prompt) {
           name: 'packageManager',
           message: 'Which packager would you like to use?',
           type: 'list',
-          choices: [{ name: 'npm' }, { name: 'pnpm' }, { name: 'yarn' }]
+          choices: [
+            { name: 'npm' },
+            { name: 'pnpm' },
+            { name: 'yarn' }
+          ]
         }
       ])
     ).packageManager;
@@ -64,8 +68,13 @@ async function choosePackageManager(context, prompt) {
  */
 async function chooseTestPlugins(context, prompt) {
   const knownTestPlugins = {
-    unit: { mocha: '@gasket/plugin-mocha', jest: '@gasket/plugin-jest' },
-    integration: { cypress: '@gasket/plugin-cypress' }
+    unit: {
+      jest: '@gasket/plugin-jest',
+      mocha: '@gasket/plugin-mocha'
+    },
+    integration: {
+      cypress: '@gasket/plugin-cypress'
+    }
   };
 
   const testTypes = ['unit', 'integration'];

packages/gasket-plugin-nextjs/generator/markdown/app-router.md

@@ -1,6 +1,6 @@
 ### App Router
 
-This Gasket app uses Next.js 14 with the [App Router], which allows for intuitive, file-based routing within the app directory. The integration with Next.js 14 enhances development by leveraging features like automatic static optimization and server-side rendering, ensuring a scalable and efficient web application.
+This Gasket app uses Next.js 14 with [App Router] which allows for intuitive, file-based routing within the app directory. The integration with Next.js 14 enhances development by leveraging features like automatic static optimization and server-side rendering, ensuring a scalable and efficient web application.
 
 {{#if nextDevProxy}}
 ### Development Proxy

packages/gasket-plugin-nextjs/generator/markdown/custom-server.md

@@ -1,6 +1,6 @@
 ### Custom Server
 
-This Gasket app uses Next.js 14 with [Page Router] and a [Custom Server] implementation. The Custom Server allows for more control over the server environment, enabling advanced features like custom routing, middleware, and server-side rendering. This integration enhances development by providing a flexible and scalable solution for building web applications.
+This Gasket app uses Next.js 14 Page Router with a [Custom Server] implementation. The Custom Server allows for more control over the server environment, enabling advanced features like custom routing, middleware, and server-side rendering. This integration enhances development by providing a flexible and scalable solution for building web applications.
 
 {{#if typescript}}
 ### TypeScript & Custom Server
@@ -18,7 +18,7 @@ Here is an example TypeScript plugin:
 ```ts
 // plugins/my-cool-plugin.ts
 export default {
-  name: 'my-cool-plugin'
+  name: 'my-cool-plugin',
   hooks: {
     // hooks
   }

packages/gasket-plugin-nextjs/generator/markdown/pages-router.md → packages/gasket-plugin-nextjs/generator/markdown/page-router.md

@@ -1,6 +1,6 @@
 ### Page Router
 
-This Gasket app uses Next.js 14 with the Page Router, which relies on the traditional file-based routing within the pages directory. The integration with Next.js 14 leverages features like server-side rendering and static optimization, providing a streamlined development process and ensuring the app remains efficient and scalable.
+This Gasket app uses Next.js 14 with [Page Router] which relies on the traditional file-based routing within the pages directory. The integration with Next.js 14 leverages features like server-side rendering and static optimization, providing a streamlined development process and ensuring the app remains efficient and scalable.
 
 {{#if nextDevProxy}}
 ### Development Proxy

packages/gasket-plugin-nextjs/lib/create.js

@@ -27,6 +27,13 @@ async function createAppFiles({
   await readme.markdownFile(`${generatorDir}/markdown/${appStructure}.md`);
   if (nextServerType === 'customServer') {
     await readme.markdownFile(`${generatorDir}/markdown/custom-server.md`);
+    readme.link('Custom Server', 'https://nextjs.org/docs/pages/building-your-application/configuring/custom-server');
+  }
+
+  if (appStructure === 'app-router') {
+    readme.link('App Router', 'https://nextjs.org/docs/app');
+  } else {
+    readme.link('Page Router', 'https://nextjs.org/docs/pages');
   }
 }
 
@@ -201,11 +208,10 @@ module.exports = {
       nextServerType,
       nextDevProxy,
       typescript,
-      useAppRouter,
       hasGasketIntl
     } = context;
     const generatorDir = `${__dirname}/../generator`;
-    const appStructure = useAppRouter ? 'app-router' : 'pages-router';
+    const appStructure = nextServerType === 'appRouter' ? 'app-router' : 'page-router';
 
     await createAppFiles({ files, generatorDir, nextServerType, appStructure, typescript, readme });
     createTestFiles({ files, generatorDir, testPlugins, appStructure, typescript });

packages/gasket-plugin-nextjs/lib/prompt.js

@@ -9,9 +9,9 @@ async function promptNextServerType(context, prompt) {
         message: 'Which server type would you like to use?',
         type: 'list',
         choices: [
-          { name: 'App Router', value: 'appRouter' },
+          { name: 'Page Router w/ Custom Server', value: 'customServer' },
           { name: 'Page Router', value: 'pageRouter' },
-          { name: 'Page Router w/ Custom Server', value: 'customServer' }
+          { name: 'App Router', value: 'appRouter' }
         ]
       }
     ]);

packages/gasket-plugin-nextjs/test/create.test.js

@@ -13,9 +13,12 @@ describe('create hook', () => {
         has: jest.fn()
       },
       readme: {
-        markdownFile: jest.fn()
+        markdownFile: jest.fn(),
+        link: jest.fn()
+      },
+      files: {
+        add: jest.fn()
       },
-      files: { add: jest.fn() },
       gasketConfig: {
         add: jest.fn(),
         addPlugin: jest.fn()
@@ -40,12 +43,12 @@ describe('create hook', () => {
     it('adds pages router files', async function () {
       await create.handler({}, mockContext);
       expect(mockContext.files.add).toHaveBeenCalledWith(
-        `${root}/../generator/app/pages-router/**/!(*.ts|*.tsx)`
+        `${root}/../generator/app/page-router/**/!(*.ts|*.tsx)`
       );
     });
 
     it('adds app router files', async function () {
-      mockContext.useAppRouter = true;
+      mockContext.nextServerType = 'appRouter';
       await create.handler({}, mockContext);
       expect(mockContext.files.add).toHaveBeenCalledWith(
         `${root}/../generator/app/app-router/**/!(*.ts|*.tsx)`
@@ -56,23 +59,25 @@ describe('create hook', () => {
       mockContext.typescript = true;
       await create.handler({}, mockContext);
       expect(mockContext.files.add).toHaveBeenCalledWith(
-        `${root}/../generator/app/pages-router/**/!(*.js|.jsx)`
+        `${root}/../generator/app/page-router/**/!(*.js|.jsx)`
       );
     });
 
     it('adds partial markdown file for app-router', async function () {
-      mockContext.useAppRouter = true;
+      mockContext.nextServerType = 'appRouter';
       await create.handler({}, mockContext);
       expect(mockContext.readme.markdownFile).toHaveBeenCalledWith(
         `${root}/../generator/markdown/app-router.md`
       );
+      expect(mockContext.readme.link).toHaveBeenCalledWith('App Router', expect.any(String));
     });
 
     it('adds partial markdown file for page-router', async function () {
       await create.handler({}, mockContext);
       expect(mockContext.readme.markdownFile).toHaveBeenCalledWith(
-        `${root}/../generator/markdown/pages-router.md`
+        `${root}/../generator/markdown/page-router.md`
       );
+      expect(mockContext.readme.link).toHaveBeenCalledWith('Page Router', expect.any(String));
     });
 
     it('adds partial markdown file for custom server', async function () {
@@ -81,6 +86,9 @@ describe('create hook', () => {
       expect(mockContext.readme.markdownFile).toHaveBeenCalledWith(
         `${root}/../generator/markdown/custom-server.md`
       );
+
+      expect(mockContext.readme.link).toHaveBeenCalledWith('Custom Server', expect.any(String));
+      expect(mockContext.readme.link).toHaveBeenCalledWith('Page Router', expect.any(String));
     });
   });
 
@@ -90,17 +98,17 @@ describe('create hook', () => {
       mockContext.testPlugins = ['@gasket/mocha'];
       await create.handler({}, mockContext);
       expect(mockContext.files.add).toHaveBeenCalledWith(
-        `${root}/../generator/mocha/pages-router/*`,
-        `${root}/../generator/mocha/pages-router/**/!(*.ts|*.tsx)`
+        `${root}/../generator/mocha/page-router/*`,
+        `${root}/../generator/mocha/page-router/**/!(*.ts|*.tsx)`
       );
     });
 
     it('adds jest files', async function () {
       mockContext.testPlugins = ['@gasket/jest'];
       await create.handler({}, mockContext);
       expect(mockContext.files.add).toHaveBeenCalledWith(
-        `${root}/../generator/jest/pages-router/*`,
-        `${root}/../generator/jest/pages-router/**/!(*.ts|*.tsx)`
+        `${root}/../generator/jest/page-router/*`,
+        `${root}/../generator/jest/page-router/**/!(*.ts|*.tsx)`
       );
     });
 
@@ -113,27 +121,27 @@ describe('create hook', () => {
       );
     });
 
-    it('adds ts extenstion files', async function () {
+    it('adds ts extension files', async function () {
       mockContext.typescript = true;
       mockContext.testPlugins = ['@gasket/jest'];
       await create.handler({}, mockContext);
       expect(mockContext.files.add).toHaveBeenCalledWith(
-        `${root}/../generator/jest/pages-router/*`,
-        `${root}/../generator/jest/pages-router/**/!(*.js|*.jsx)`
+        `${root}/../generator/jest/page-router/*`,
+        `${root}/../generator/jest/page-router/**/!(*.js|*.jsx)`
       );
     });
 
     it('adds no files for no test plugins', async function () {
       mockContext.testPlugins = [];
       await create.handler({}, mockContext);
       expect(mockContext.files.add).not.toHaveBeenCalledWith(
-        `${root}/../generator/jest/pages-router/*`,
-        `${root}/../generator/jest/pages-router/**/!(*.js|*.jsx)`
+        `${root}/../generator/jest/page-router/*`,
+        `${root}/../generator/jest/page-router/**/!(*.js|*.jsx)`
       );
     });
 
     it('adds files for app-router', async function () {
-      mockContext.useAppRouter = true;
+      mockContext.nextServerType = 'appRouter';
       mockContext.testPlugins = ['@gasket/jest'];
       await create.handler({}, mockContext);
       expect(mockContext.files.add).toHaveBeenCalledWith(

packages/gasket-plugin-nextjs/test/prompt.test.js

@@ -89,9 +89,9 @@ describe('prompt hook', () => {
           message: 'Which server type would you like to use?',
           type: 'list',
           choices: [
-            { name: 'App Router', value: 'appRouter' },
+            { name: 'Page Router w/ Custom Server', value: 'customServer' },
             { name: 'Page Router', value: 'pageRouter' },
-            { name: 'Page Router w/ Custom Server', value: 'customServer' }
+            { name: 'App Router', value: 'appRouter' }
           ]
         }
       ]);

packages/gasket-preset-nextjs/generator/README.md

@@ -4,7 +4,7 @@
 
 ## Overview
 
-This application is built with [Gasket](https://gasket.dev/) and [Next.js](https://nextjs.org/). This application utilizes [EcmaScript Modules] and requires Node.js v20 or higher.
+This application is built with [Gasket] and [Next.js] utilizing [EcmaScript Modules] and requires Node.js v20 or higher.
 
 ## Getting Started
 
@@ -37,9 +37,8 @@ DEBUG={{{server}}}:* {{{localCmd}}} // {{{server}}} operations only
 {{{markdownCompile this}}}
 {{/each}}
 <!-- LINKS -->
-[App Router]: https://nextjs.org/docs/app
-[Page Router]: https://nextjs.org/docs/pages
-[Custom Server]: https://nextjs.org/docs/pages/building-your-application/configuring/custom-server
+[Gasket]: https://gasket.dev
+[Next.js]: https://nextjs.org
 [EcmaScript Modules]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules
 {{#each readme.links}}
 {{{this}}}