fix: @dunglas review

Author: Gregcop1

src/generators/BaseGenerator.js

@@ -119,6 +119,28 @@ export default class {
     }
   }
 
+  getType(field) {
+    if (field.reference) {
+      return field.reference.title;
+    }
+
+    switch (field.range) {
+      case "http://www.w3.org/2001/XMLSchema#integer":
+      case "http://www.w3.org/2001/XMLSchema#decimal":
+        return "number";
+      case "http://www.w3.org/2001/XMLSchema#boolean":
+        return "boolean";
+      case "http://www.w3.org/2001/XMLSchema#date":
+      case "http://www.w3.org/2001/XMLSchema#dateTime":
+      case "http://www.w3.org/2001/XMLSchema#time":
+        return "Date";
+      case "http://www.w3.org/2001/XMLSchema#string":
+        return "string";
+    }
+
+    return "any";
+  }
+
   buildFields(fields) {
     return fields.map(field => ({
       ...field,

src/generators/NextGenerator.js

@@ -32,35 +32,39 @@ export default class NextGenerator extends BaseGenerator {
   checkDependencies(dir) {
     const dependencies = this.getTargetDependencies(dir);
 
-    if (dependencies.length) {
-      if (!dependencies.includes("@zeit/next-typescript")) {
-        console.log(
-          chalk.yellow(
-            "It seems next-typescript is not installed but generator needs typescript to work efficiently."
-          )
-        );
-      }
+    if (!dependencies.length) {
+      return;
+    }
 
-      if (!dependencies.includes("express")) {
-        console.log(
-          chalk.yellow(
-            "It seems express is not installed but generator needs a custom express server to work efficiently."
-          )
-        );
-      }
+    if (!dependencies.includes("@zeit/next-typescript")) {
+      console.log(
+        chalk.yellow(
+          "It seems next-typescript is not installed but generator needs typescript to work efficiently."
+        )
+      );
+    }
+
+    if (!dependencies.includes("express")) {
+      console.log(
+        chalk.yellow(
+          "It seems express is not installed but generator needs a custom express server to work efficiently."
+        )
+      );
     }
   }
 
   checkImports(directory, imports, extension = ".ts") {
     imports.forEach(({ file }) => {
       if (!fs.existsSync(directory + file + extension)) {
-        console.log(
-          chalk.yellow(
-            'An import for the file  "%s" has been generated but the file doesn\'t exists.'
-          ),
-          file
-        );
+        return;
       }
+
+      console.log(
+        chalk.yellow(
+          'An import for the file  "%s" has been generated but the file doesn\'t exists.'
+        ),
+        file
+      );
     });
   }
 
@@ -79,8 +83,8 @@ export default class NextGenerator extends BaseGenerator {
     console.log("Paste the following route to your server configuration file:");
     console.log(
       chalk.green(`
-server.get('/${lc}/:hash', (req, res) => {
-  return app.render(req, res, '/${lc}', { hash: req.params.hash })
+server.get('/${lc}/:id', (req, res) => {
+  return app.render(req, res, '/${lc}', { id: req.params.id })
 });
 `)
     );
@@ -155,73 +159,50 @@ server.get('/${lc}/:hash', (req, res) => {
     this.createEntrypoint(api.entrypoint, `${dir}/config/entrypoint.ts`);
   }
 
-  getType(field) {
-    if (field.reference) {
-      return field.reference.title;
-    }
-
-    switch (field.range) {
-      case "http://www.w3.org/2001/XMLSchema#integer":
-      case "http://www.w3.org/2001/XMLSchema#decimal":
-        return "number";
-      case "http://www.w3.org/2001/XMLSchema#boolean":
-        return "boolean";
-      case "http://www.w3.org/2001/XMLSchema#date":
-      case "http://www.w3.org/2001/XMLSchema#dateTime":
-      case "http://www.w3.org/2001/XMLSchema#time":
-        return "Date";
-      case "http://www.w3.org/2001/XMLSchema#string":
-        return "string";
-    }
-
-    return "any";
-  }
-
   getDescription(field) {
     return field.description ? field.description.replace(/"/g, "'") : "";
   }
 
   parseFields(resource) {
-    const fields = {};
-
-    for (let field of resource.writableFields) {
-      fields[field.name] = {
-        notrequired: !field.required,
-        name: field.name,
-        type: this.getType(field),
-        description: this.getDescription(field),
-        readonly: false,
-        reference: field.reference
-      };
-    }
-
-    for (let field of resource.readableFields) {
-      if (fields[field.name] !== undefined) {
-        continue;
+    const fields = [
+      ...resource.writableFields,
+      ...resource.readableFields
+    ].reduce((list, field) => {
+      if (list[field.name]) {
+        return list;
       }
 
-      fields[field.name] = {
-        notrequired: !field.required,
-        name: field.name,
-        type: this.getType(field),
-        description: this.getDescription(field),
-        readonly: true,
-        reference: field.reference
+      return {
+        ...list,
+        [field.name]: {
+          notrequired: !field.required,
+          name: field.name,
+          type: this.getType(field),
+          description: this.getDescription(field),
+          readonly: false,
+          reference: field.reference
+        }
       };
-    }
+    }, {});
 
     // Parse fields to add relevant imports, required for Typescript
     const fieldsArray = Object.values(fields);
-    const imports = {};
-
-    for (const field of fieldsArray) {
-      if (field.reference) {
-        imports[field.type] = {
-          type: field.type,
-          file: "./" + field.type
+    const imports = Object.values(fields).reduce(
+      (list, { reference, type }) => {
+        if (!reference) {
+          return list;
+        }
+
+        return {
+          ...list,
+          [type]: {
+            type,
+            file: "./" + type
+          }
         };
-      }
-    }
+      },
+      {}
+    );
 
     return { fields: fieldsArray, imports: Object.values(imports) };
   }

src/generators/TypescriptInterfaceGenerator.js

@@ -30,28 +30,6 @@ export default class TypescriptInterfaceGenerator extends BaseGenerator {
     );
   }
 
-  getType(field) {
-    if (field.reference) {
-      return field.reference.title;
-    }
-
-    switch (field.range) {
-      case "http://www.w3.org/2001/XMLSchema#integer":
-      case "http://www.w3.org/2001/XMLSchema#decimal":
-        return "number";
-      case "http://www.w3.org/2001/XMLSchema#boolean":
-        return "boolean";
-      case "http://www.w3.org/2001/XMLSchema#date":
-      case "http://www.w3.org/2001/XMLSchema#dateTime":
-      case "http://www.w3.org/2001/XMLSchema#time":
-        return "Date";
-      case "http://www.w3.org/2001/XMLSchema#string":
-        return "string";
-    }
-
-    return "any";
-  }
-
   getDescription(field) {
     return field.description ? field.description.replace(/"/g, "'") : "";
   }

templates/next/components/common/ReferenceLinks.tsx

@@ -20,11 +20,11 @@ export const ReferenceLinks: NextFunctionComponent<Props> = ({items, type, useIc
   }
 
   // to avoid routes like "/book/books/d4s5s1-qd5sd5d-qsd5qsd4sd" we prefer enconding it
-  const hash = btoa(items);
+  const id = btoa(items);
   const resourceName = type.toLowerCase();
 
   return (
-    <Link href={`/${resourceName}?hash=${hash}`} as={`/${resourceName}/${hash}`}><a>
+    <Link href={`/${resourceName}?id=${id}`} as={`/${resourceName}/${id}`}><a>
       {useIcon ? (
         <Fragment>
           <span className="fa fa-search" aria-hidden="true" />

templates/next/components/foo/List.tsx

@@ -6,7 +6,7 @@ interface Props {
   {{{name}}}: {{{ucf}}}[];
 }
 
-export const {{{ucf}}}List: NextFunctionComponent<Props> = ({ {{{name}}} }) => (
+export const List: NextFunctionComponent<Props> = ({ {{{name}}} }) => (
   <div>
     <h1>{{{ucf}}} List</h1>
     <table className="table table-responsive table-striped table-hover">

templates/next/components/foo/Show.tsx

@@ -7,7 +7,7 @@ interface Props {
   {{{lc}}}: {{{ucf}}};
 }
 
-export const {{{ucf}}}Show: NextFunctionComponent<Props> = ({ {{{lc}}} }) => (
+export const Show: NextFunctionComponent<Props> = ({ {{{lc}}} }) => (
   <div>
     <h1>Show { {{{lc}}}['@id'] }</h1>
     <table className="table table-responsive table-striped table-hover">

templates/next/pages/foo.tsx

@@ -1,24 +1,24 @@
 import { NextContext, NextFunctionComponent } from 'next';
 import { withRouter } from 'next/router';
-import { {{{ucf}}}Show } from '../components/{{{lc}}}/Show';
+import { Show } from '../components/{{{lc}}}/Show';
 import { {{{ucf}}} } from '../interfaces/{{{ucf}}}';
 import { atob, fetch } from '../utils/dataAccess';
 
 interface Props {
   {{{lc}}}: {{{ucf}}};
 };
 
-const {{{ucf}}}Page: NextFunctionComponent<Props> = ({ {{{lc}}} }) => {
+const Page: NextFunctionComponent<Props> = ({ {{{lc}}} }) => {
   return (
-    <{{{ucf}}}Show {{{lc}}}={ {{{lc}}} }/>
+    <Show {{{lc}}}={ {{{lc}}} }/>
   );
 };
 
-{{{ucf}}}Page.getInitialProps = async ({query}: NextContext) => {
-  const id = atob(query.hash as string);
+Page.getInitialProps = async ({query}: NextContext) => {
+  const id = atob(query.id as string);
   const {{{lc}}} = await fetch(id);
 
   return { {{{lc}}} };
 };
 
-export default withRouter({{{ucf}}}Page);
+export default withRouter(Page);

templates/next/pages/foos.tsx

@@ -1,5 +1,5 @@
 import { NextFunctionComponent } from 'next';
-import { {{{ucf}}}List } from '../components/{{{lc}}}/List';
+import { List } from '../components/{{{lc}}}/List';
 import { PagedCollection } from '../interfaces/Collection';
 import { {{{ucf}}} } from '../interfaces/{{{ucf}}}';
 import { fetch } from '../utils/dataAccess';
@@ -8,14 +8,14 @@ interface Props {
   collection: PagedCollection<{{{ucf}}}>;
 }
 
-const {{{ucf}}}sPage: NextFunctionComponent<Props> = ({collection}) => (
-  <{{{ucf}}}List {{{name}}}={collection['{{{hydraPrefix}}}member'] || []}/>
+const Page: NextFunctionComponent<Props> = ({collection}) => (
+  <List {{{name}}}={collection['{{{hydraPrefix}}}member'] || []}/>
 );
 
-{{{ucf}}}sPage.getInitialProps = async () => {
+Page.getInitialProps = async () => {
   const collection = await fetch('/{{{name}}}');
 
   return {collection};
 };
 
-export default {{{ucf}}}sPage;
+export default Page;

templates/next/utils/dataAccess.ts

@@ -69,8 +69,8 @@ export const normalize = (data: any) => {
   );
 }
 
-export const atob = (hash: string) => {
-  return typeof window !== 'undefined' ? window.atob(hash) : Buffer.from(hash, 'base64').toString('ascii');
+export const atob = (id: string) => {
+  return typeof window !== 'undefined' ? window.atob(id) : Buffer.from(id, 'base64').toString('ascii');
 }
 
 export const btoa = (str: string) => {