Skip to main content

Naming Conventions

Keywords

Code generators matches following patterns in AST identifiers (while renaming and inlining the templates):

  • Entity - name of generated entity (e.g. customers)

  • EntityById - name of detail query for entity (e.g. useCustomerQuery)

  • InsertEntity - name of insert mutation for entity (e.g. useInsertCustomersMutation)

  • UpdateEntity - name of update mutation for entity (e.g. useUpdateCustomersMutation)

  • FIELD - field from GraphQL schema (e.g. first_name)

  • columns - generated datagrid columns (list view)

  • HEADER_NAME - header name of the column (e.g. First name)

  • fields - fields for object relationships

  • FormatEntityField - react component for type formatting, attributes: value - field, label - label for field

File name convention

Pages

Typical CRUD pages import Entity Components:

  • templates/src/pages/entity/index.tsx - list (filter, sort)
  • templates/src/pages/entity/[id].tsx - detail by id

Generator can handle also other page

  • templates/src/pages/blank/index.tsx blank & without API query (useful totoal custom content)
  • templates/src/pages/landing-xy/index.tsx static content without API query (useful for information content ala landing pages)
  • templates/src/pages/dashboard/index.tsx with graphql query that contains multiple query roots (WIP)

Entity List/Array Components

API:

  • EntityListContainer - container for list component for accessing the server API, (src/components/entities/Entity)

Views: (visualisation without server API calls):

  • EntityTable - readonly array relationship, (src/components/entities/Entity)

  • EntityDataTable - datagrid for desktop devices (src/components/entities/Entity)

  • EntityGraph - readonly array relationship, (src/components/entities/Entity)

  • EntityCalendar - readonly array relationship, (src/components/entities/Entity)

  • EntityList - list for mobile devices, (src/components/entities/Entity)

  • EntityCardList - card list, (src/components/entities/Entity)

Entity Detail Components

API:

  • EntityCrudContainer - container for detail component, (src/components/entities/Entity)

Views: (visualisation without server API calls):

  • EntityFormView - view for detail, (src/components/entities/Entity)

  • EntityFormTable - array relationship formular, (src/components/entities/Entity)

  • EntityForm - object relationship formular, (src/components/entities/Entity)

  • EntityShow - object relationship readonly, (src/components/entities/Entity)

Format Field

Primitive fields can have different view based on data type. Generator inlines components/templates (src/components/fields/typography, src/components/fields/chips or src/components/fields/contains):

  • BooleanFormat.tsx

  • DateFormat.tsx

  • DateTimeFormat.tsx

  • DefaultFormat.tsx

  • TimeFormat.tsx

If the field is relation to the entity then the generator inlines following code:

  • ArraFormat.tsx

  • ObjectFormat.tsx

Common files

There are common files that can be customize per project and does not have notion of an Entity (renaming feature of the generator):

  • FormCard - card component to split tables in detail, (src/components/entities)

  • LookupDialog - lookup for object relationship, (src/components/entities)

  • DeleteDialog - delete dialog, (src/components/entities)