@genesislcap/blank-app-seed 3.20.5 → 3.22.0

package/.genx/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@genesislcap/blank-app-seed-config",
   "description": "Genesis Blank App Seed Configuration",
-  "version": "3.20.5",
+  "version": "3.22.0",
   "license": "Apache-2.0",
   "scripts": {
     "lint": "eslint .",

package/.genx/static.js

@@ -54,6 +54,13 @@ const DIR_TEMPLATE_BY_FRAMEWORK = {
   [FRAMEWORK_ANGULAR_ALIAS]: DIRS_MAP.get(DIR_TEMPLATE_ANGULAR_ALIAS),
 };
 
+const COMPONENT_TYPE = {
+  'entity-manager': 'manager',
+  'grid-pro': 'grid',
+  'smart-form': 'form',
+  'chart': 'chart'
+}
+
 const TEXTS = {
   INTRO_API_HOST:
     'You can override the default Genesis server URL used during local developent.',
@@ -77,6 +84,7 @@ const TEXTS = {
 };
 
 module.exports = {
+  COMPONENT_TYPE,
   FRAMEWORK_WEB_COMPONENTS_ALIAS,
   FRAMEWORK_ANGULAR_ALIAS,
   FRAMEWORK_REACT_ALIAS,

package/.genx/templates/angular/chart.hbs

@@ -1,9 +1,21 @@
-<rapid-g2plot-chart
-  type="{{ config.type }}"
-  [config]="tile{{ config.index }}.chartConfig"
->
-  <chart-datasource
-    resourceName="{{ config.resourceName }}"
-    server-fields="{{ config.xField }} {{ config.yField }}"
-  ></chart-datasource>
-</rapid-g2plot-chart>
+<section style="height: 100%; width: 100%;">
+  <ng-container *ngIf="hasUserPermission('{{config.permissions.viewRight}}'); else notPermitted{{ config.index }}">
+    <rapid-g2plot-chart
+      type="{{ config.type }}"
+      [config]="tile{{ config.index }}.chartConfig"
+    >
+      <chart-datasource
+        resourceName="{{ config.resourceName }}"
+        server-fields="{{ config.xField }} {{ config.yField }}"
+      ></chart-datasource>
+    </rapid-g2plot-chart>
+  </ng-container>
+
+  <ng-template #notPermitted{{ config.index }}>
+    <app-error-message
+      style="width: 100%; height: 100%; display: flex; justify-content: center; align-items: center;"
+      elementType="h3"
+      message="You do not have access to view this component.">
+    </app-error-message>
+  </ng-template>
+</section>

package/.genx/templates/angular/entityManager.hbs

@@ -1,45 +1,57 @@
-<entity-management
-    design-system-prefix="rapid"
-    enable-row-flashing
-    enable-cell-flashing
-    {{#if config.title}}
-    title="{{ config.title }}"
-    {{/if}}
-    resourceName="{{ config.resourceName }}"
-    {{#if config.createEvent}}
-    createEvent="{{ config.createEvent }}"
-    {{#if config.createFormUiSchema}}
-    [createFormUiSchema]="tile{{ config.index }}.createFormUiSchema"
-    {{/if}}
-    {{/if}}
-    {{#if config.updateEvent}}
-    updateEvent="{{ config.updateEvent }}"
-    {{#if config.updateFormUiSchema}}
-    [updateFormUiSchema]="tile{{ config.index }}.updateFormUiSchema"
-    {{/if}}
-    {{/if}}
-    {{#if config.deleteEvent}}
-    deleteEvent="{{ config.deleteEvent }}"
-    {{/if}}
-    {{#if config.gridOptions}}
-    [gridOptions]="{{ config.gridOptions }}"
-    {{/if}}
-    {{#if config.snapshot}}
-    [datasourceConfig]="{ isSnapshot: {{ config.snapshot }} }"
-    {{/if}}
-    {{#if config.reqrep}}
-    [datasourceConfig]="tile{{ config.index }}.reqrep"
-    {{/if}}
-    {{#if config.columns}}
-    [columns]="tile{{ config.index }}.columns"
-    {{/if}}
-    {{#if config.modalPosition}}
-    modal-position="{{ config.modalPosition }}"
-    {{/if}}
-    {{#if config.sizeColumnsToFit}}
-    size-columns-to-fit
-    {{/if}}
-    {{#if config.enableSearchBar}}
-    enable-search-bar
-    {{/if}}
-></entity-management>
+<section style="height: 100%; width: 100%;">
+  <ng-container *ngIf="hasUserPermission('{{config.permissions.viewRight}}'); else notPermitted{{ config.index }}">
+    <entity-management
+      design-system-prefix="rapid"
+      enable-row-flashing
+      enable-cell-flashing
+      {{#if config.title}}
+      title="{{ config.title }}"
+      {{/if}}
+      resourceName="{{ config.resourceName }}"
+      {{#if config.createEvent}}
+      [createEvent]="hasUserPermission('{{config.permissions.updateRight}}') ? '{{ config.createEvent }}' : undefined"
+      {{#if config.createFormUiSchema}}
+      [createFormUiSchema]="tile{{ config.index }}.createFormUiSchema"
+      {{/if}}
+      {{/if}}
+      {{#if config.updateEvent}}
+      [updateEvent]="hasUserPermission('{{config.permissions.updateRight}}') ? '{{ config.updateEvent }}' : undefined"
+      {{#if config.updateFormUiSchema}}
+      [updateFormUiSchema]="tile{{ config.index }}.updateFormUiSchema"
+      {{/if}}
+      {{/if}}
+      {{#if config.deleteEvent}}
+      [deleteEvent]="hasUserPermission('{{config.permissions.updateRight}}') ? '{{ config.deleteEvent }}' : undefined"
+      {{/if}}
+      {{#if config.gridOptions}}
+      [gridOptions]="{{ config.gridOptions }}"
+      {{/if}}
+      {{#if config.snapshot}}
+      [datasourceConfig]="{ isSnapshot: {{ config.snapshot }} }"
+      {{/if}}
+      {{#if config.reqrep}}
+      [datasourceConfig]="tile{{ config.index }}.reqrep"
+      {{/if}}
+      {{#if config.columns}}
+      [columns]="tile{{ config.index }}.columns"
+      {{/if}}
+      {{#if config.modalPosition}}
+      modal-position="{{ config.modalPosition }}"
+      {{/if}}
+      {{#if config.sizeColumnsToFit}}
+      size-columns-to-fit
+      {{/if}}
+      {{#if config.enableSearchBar}}
+      enable-search-bar
+      {{/if}}
+    ></entity-management>
+  </ng-container>
+
+  <ng-template #notPermitted{{ config.index }}>
+    <app-error-message
+      style="width: 100%; height: 100%; display: flex; justify-content: center; align-items: center;"
+      elementType="h3"
+      message="You do not have access to view this component.">
+    </app-error-message>
+  </ng-template>
+</section>

package/.genx/templates/angular/form.hbs

@@ -1,8 +1,21 @@
-<foundation-form
-  design-system-prefix="rapid"
-  resourceName="{{config.resourceName}}"
-  {{#if config.uischema}}
-  [uischema]="tile{{ config.index }}.uischema"
-  {{/if}}
->
-</foundation-form>
+<section style="height: 100%; width: 100%;">
+  <ng-container *ngIf="hasUserPermission('{{config.permissions.updateRight}}'); else notPermitted{{ config.index }}">
+    <foundation-form
+      design-system-prefix="rapid"
+      resourceName="{{config.resourceName}}"
+      {{#if config.uischema}}
+      [uischema]="tile{{ config.index }}.uischema"
+      {{/if}}
+    >
+    </foundation-form>
+  </ng-container>
+  
+  <ng-template #notPermitted{{ config.index }}>
+    <app-error-message
+      style="width: 100%; height: 100%; display: flex; justify-content: center; align-items: center;"
+      elementType="h3"
+      message="You do not have access to view this component.">
+    </app-error-message>
+  </ng-template>
+</section>
+

package/.genx/templates/angular/grid.hbs

@@ -1,18 +1,30 @@
-<rapid-grid-pro
-  enable-row-flashing
-  enable-cell-flashing
-  >
-  <grid-pro-genesis-datasource
-    resource-name="{{config.resourceName}}"
-    {{#if config.snapshot}}
-    isSnapshot="{{config.snapshot}}"
-    {{/if}}
-    {{#if config.reqrep}}
-    [datasourceConfig]="tile{{ config.index }}.reqrep"
-    {{/if}}
-    {{#if config.gridOptions}}
-    [deferredGridOptions]="tile{{ config.index }}.gridOptions"
-    {{/if}}
-  >
-  </grid-pro-genesis-datasource>
-</rapid-grid-pro>
+<section style="height: 100%; width: 100%;">
+  <ng-container *ngIf="hasUserPermission('{{config.permissions.viewRight}}'); else notPermitted{{ config.index }}">
+    <rapid-grid-pro
+      enable-row-flashing
+      enable-cell-flashing
+      >
+      <grid-pro-genesis-datasource
+        resource-name="{{config.resourceName}}"
+        {{#if config.snapshot}}
+        isSnapshot="{{config.snapshot}}"
+        {{/if}}
+        {{#if config.reqrep}}
+        [datasourceConfig]="tile{{ config.index }}.reqrep"
+        {{/if}}
+        {{#if config.gridOptions}}
+        [deferredGridOptions]="tile{{ config.index }}.gridOptions"
+        {{/if}}
+      >
+      </grid-pro-genesis-datasource>
+    </rapid-grid-pro>
+  </ng-container>
+
+  <ng-template #notPermitted{{ config.index }}>
+    <app-error-message
+      style="width: 100%; height: 100%; display: flex; justify-content: center; align-items: center;"
+      elementType="h3"
+      message="You do not have access to view this component.">
+    </app-error-message>
+  </ng-template>
+</section>

package/.genx/templates/angular/route.hbs

@@ -1,13 +1,14 @@
-import {Component, CUSTOM_ELEMENTS_SCHEMA} from '@angular/core';
-import {CommonModule} from '@angular/common';
-{{#if route.tiles}}
-import { getDateFormatter, getNumberFormatter } from '../../utils';
-{{/if}}
+import { Component, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { User, getUser } from '@genesislcap/foundation-user';
+import { getDateFormatter, getNumberFormatter, getViewUpdateRightComponent } from '../../utils';
+import { ErrorMessageComponent } from '../../components/error-message/error-message.component';
 
 @Component({
   selector: 'app-{{pascalCase route.name}}',
   standalone: true,
   imports: [
+    ErrorMessageComponent,
     CommonModule,
   ],
   schemas: [CUSTOM_ELEMENTS_SCHEMA],
@@ -15,6 +16,8 @@ import { getDateFormatter, getNumberFormatter } from '../../utils';
   styleUrls: ['./{{kebabCase route.name}}.component.css'],
 })
 export class {{pascalCase route.name}}Component {
+  hasUserPermission = (permissionCode: string) => getViewUpdateRightComponent(getUser(), permissionCode);
+  
   {{#each route.tiles}}
   tile{{this.config.index}} = { {{#if this.config.createFormUiSchema}}
     "createFormUiSchema": {{{ this.config.createFormUiSchema }}},{{/if}}{{#if this.config.updateFormUiSchema}}

package/.genx/templates/web-components/component/component.column.defs.hbs

@@ -0,0 +1,6 @@
+import { ColDef } from '@ag-grid-community/core';
+import { getDateFormatter, getNumberFormatter{{#if route.FDC3EventHandlersEnabled}}, sendEventOnChannel{{/if}} } from '../../../utils';
+
+{{#if tile.config.columns}}
+export const columnDefs: ColDef[] = {{{ tile.config.columns }}}
+{{/if}}

package/.genx/templates/web-components/component/component.create.form.hbs

@@ -0,0 +1,8 @@
+import { UiSchema } from '@genesislcap/foundation-forms';
+
+{{#if tile.config.createFormUiSchema}}
+export const createFormSchema: UiSchema = {{{ tile.config.createFormUiSchema }}}
+{{/if}}
+{{#if tile.config.uischema}}
+export const createFormSchema: UiSchema = {{{ tile.config.uischema }}}
+{{/if}}

package/.genx/templates/web-components/component/component.gridOptions.hbs

@@ -0,0 +1,6 @@
+import { GridOptionsConfig } from '@genesislcap/rapid-grid-pro';
+import { getDateFormatter, getNumberFormatter{{#if route.FDC3EventHandlersEnabled}}, sendEventOnChannel{{/if}} } from '../../../utils';
+
+{{#if tile.config.gridOptions}}
+export const gridOptions: GridOptionsConfig = {{{ tile.config.gridOptions }}}
+{{/if}}

package/.genx/templates/web-components/component/component.hbs

@@ -0,0 +1,13 @@
+import { User } from '@genesislcap/foundation-user';
+import { customElement, GenesisElement } from '@genesislcap/web-core';
+import { {{pascalCase tile.title}}Styles as styles } from './{{kebabCase tile.title}}.styles';
+import { {{pascalCase tile.title}}Template as template } from './{{kebabCase tile.title}}.template';
+
+@customElement({
+  name: '{{kebabCase tile.componentName}}',
+  template,
+  styles,
+})
+export class {{pascalCase tile.componentName}} extends GenesisElement {
+  @User user: User;
+}

package/.genx/templates/web-components/component/component.index.hbs

@@ -0,0 +1 @@
+export * from './{{kebabCase tile.title}}';

package/.genx/templates/web-components/component/component.styles.hbs

@@ -0,0 +1,7 @@
+import { css } from '@genesislcap/web-core';
+
+export const {{pascalCase tile.title}}Styles = css`
+  :host {
+    /* insert css styles here */
+  }
+`;

package/.genx/templates/web-components/component/component.template.hbs

@@ -0,0 +1,23 @@
+import { html, whenElse } from '@genesislcap/web-core';
+import { getViewUpdateRightComponent } from '../../../utils';
+import type { {{pascalCase tile.componentName}} } from './{{kebabCase tile.title}}';
+{{#if tile.config.createFormUiSchema}}
+import { createFormSchema } from './{{kebabCase tile.title}}.create.form.schema';
+{{/if}}
+{{#if tile.config.uischema}}
+import { createFormSchema } from './{{kebabCase tile.title}}.create.form.schema';
+{{/if}}
+{{#if tile.config.updateFormUiSchema}}
+import { updateFormSchema } from './{{kebabCase tile.title}}.update.form.schema';
+{{/if}}
+{{#if tile.config.columns}}
+import { columnDefs } from './{{kebabCase tile.title}}.column.defs';
+{{/if}}
+{{#if tile.config.gridOptions}}
+import { gridOptions } from './{{kebabCase tile.title}}.gridOptions';
+{{/if}}
+
+
+export const {{pascalCase tile.title}}Template = html<{{pascalCase tile.componentName}}>`
+    {{> (lookup tile 'type') tile}}
+`;

package/.genx/templates/web-components/component/component.update.form.hbs

@@ -0,0 +1,5 @@
+import { UiSchema } from '@genesislcap/foundation-forms';
+
+{{#if tile.config.updateFormUiSchema}}
+export const updateFormSchema: UiSchema = {{{ tile.config.updateFormUiSchema }}}
+{{/if}}

package/.genx/templates/web-components/entityManager.hbs

@@ -12,26 +12,20 @@ ${whenElse(
             {{#if config.createEvent}}
             createEvent="${(x) => getViewUpdateRightComponent(x.user, '{{config.permissions.updateRight}}', '{{ config.createEvent }}')}"
             {{#if config.createFormUiSchema}}
-            :createFormUiSchema=${() => (
-                {{{ config.createFormUiSchema }}}
-            )}
+            :createFormUiSchema=${() => createFormSchema }
             {{/if}}
             {{/if}}
             {{#if config.updateEvent}}
             updateEvent="${(x) => getViewUpdateRightComponent(x.user, '{{config.permissions.updateRight}}', '{{ config.updateEvent }}')}"
             {{#if config.updateFormUiSchema}}
-            :updateFormUiSchema=${() => (
-                {{{ config.updateFormUiSchema }}}
-            )}
+            :updateFormUiSchema=${() => updateFormSchema}
             {{/if}}
             {{/if}}
             {{#if config.deleteEvent}}
             deleteEvent="${(x) => getViewUpdateRightComponent(x.user, '{{config.permissions.updateRight}}', '{{ config.deleteEvent }}')}"
             {{/if}}
             {{#if config.gridOptions}}
-            :gridOptions=${() => (
-            {{{config.gridOptions}}}
-            )}
+            :gridOptions=${() => gridOptions }
             {{/if}}
             {{#if config.snapshot}}
             :datasourceConfig=${() => ({isSnapshot: {{ config.snapshot }} })}
@@ -40,7 +34,7 @@ ${whenElse(
             :datasourceConfig=${() => ({pollingInterval: 5000 })}
             {{/if}}
             {{#if config.columns}}
-            :columns=${() => {{{ config.columns }}} }
+            :columns=${() => columnDefs }
             {{/if}}
             {{#if config.modalPosition}}
             modal-position="{{ config.modalPosition }}"
@@ -54,6 +48,6 @@ ${whenElse(
         ></entity-management>
     `,
     html`
-        <not-permitted-component></not-permitted-component>
+      <not-permitted-component></not-permitted-component>
     `,
 )}

package/.genx/templates/web-components/form.hbs

@@ -5,9 +5,7 @@ ${whenElse(
         design-system-prefix="rapid"
         resourceName="{{config.resourceName}}"
         {{#if config.uischema}}
-        :uischema=${() => (
-          {{{config.uischema}}}
-        )}
+        :uischema=${() => createFormSchema }
         {{/if}}
       >
       </foundation-form>

package/.genx/templates/web-components/grid.hbs

@@ -14,9 +14,7 @@ ${whenElse(
           :datasourceConfig=${() => ({pollingInterval: 5000 })}
           {{/if}}
           {{#if config.gridOptions}}
-          :deferredGridOptions=${() => (
-            {{{config.gridOptions}}}
-          )}
+          :deferredGridOptions=${() => gridOptions}
           {{/if}}
         >
         </grid-pro-genesis-datasource>

package/.genx/templates/web-components/gridLayout.hbs

@@ -0,0 +1,30 @@
+<rapid-layout-region type="horizontal">
+    <rapid-layout-region type="vertical">
+    {{#each route.tiles}}
+        {{#ifEquals @index 0}}
+        <rapid-layout-item title="{{../title}}">
+            <{{kebabCase ../componentName}}></{{kebabCase ../componentName}}>
+        </rapid-layout-item>
+        {{/ifEquals}}
+        {{#ifEquals @index 1}}
+        <rapid-layout-item title="{{../title}}">
+            <{{kebabCase ../componentName}}></{{kebabCase ../componentName}}>
+        </rapid-layout-item>
+        {{/ifEquals}}
+    {{/each}}
+    </rapid-layout-region>
+    <rapid-layout-region type="vertical">
+    {{#each route.tiles}}
+        {{#ifEquals @index 2}}
+        <rapid-layout-item title="{{../title}}">
+            <{{kebabCase ../componentName}}></{{kebabCase ../componentName}}>
+        </rapid-layout-item>
+        {{/ifEquals}}
+        {{#ifEquals @index 3}}
+        <rapid-layout-item title="{{../title}}">
+            <{{kebabCase ../componentName}}></{{kebabCase ../componentName}}>
+        </rapid-layout-item>
+        {{/ifEquals}}
+    {{/each}}
+    </rapid-layout-region>
+</rapid-layout-region>

package/.genx/templates/web-components/horizontalLayout.hbs

@@ -0,0 +1,7 @@
+<rapid-layout-region>
+    {{#each route.tiles}}
+    <rapid-layout-item title="{{this.title}}">
+        <{{kebabCase this.componentName}}></{{kebabCase this.componentName}}>
+    </rapid-layout-item>
+    {{/each}}
+</rapid-layout-region>

package/.genx/templates/web-components/route.template.hbs

@@ -1,7 +1,13 @@
 import { isDev } from '@genesislcap/foundation-utils';
-import { html, whenElse } from '@genesislcap/web-core';
-import { getDateFormatter, getNumberFormatter, getViewUpdateRightComponent{{#if route.FDC3EventHandlersEnabled}}, sendEventOnChannel{{/if}} } from '../../utils';
+import { html } from '@genesislcap/web-core';
 import type { {{pascalCase route.name}} } from './{{kebabCase route.name}}';
+{{#each route.tiles}}
+import { {{pascalCase this.componentName}} } from './{{kebabCase this.title}}-{{this.componentType}}';
+{{/each}}
+
+{{#each route.tiles}}
+{{pascalCase this.componentName}};
+{{/each}}
 
 export const {{pascalCase route.name}}Template = html<{{pascalCase route.name}}>`
   {{#if route.tiles}}

package/.genx/templates/web-components/tabsLayout.hbs

@@ -0,0 +1,7 @@
+<rapid-layout-region type="tabs">
+    {{#each route.tiles}}
+    <rapid-layout-item title="{{this.title}}">
+        <{{kebabCase this.componentName}}></{{kebabCase this.componentName}}>
+    </rapid-layout-item>
+    {{/each}}
+</rapid-layout-region>

package/.genx/utils/formatRouteData.js

@@ -4,6 +4,7 @@ const {
 } = require('./gridSerializers');
 const formatJSONValue = require('./formatJSONValue');
 const getLayoutType = require('./getLayoutType');
+const { COMPONENT_TYPE } = require('../static');
 
 const formatRouteData = (route) => {
   const layoutKey = route?.layoutKey || `${route.name}_${Date.now()}`;
@@ -15,6 +16,8 @@ const formatRouteData = (route) => {
   );
   const tiles = route.tiles?.map((tile, index) => {
     const config = tile.config || {};
+    const componentType = COMPONENT_TYPE[tile.type];
+    const componentName = `${route.name}-${tile.title.replace(/[^0-9a-z]/gi, '')}-${componentType}`;
     const {
       gridOptions,
       createFormUiSchema,
@@ -25,6 +28,8 @@ const formatRouteData = (route) => {
 
     return {
       ...tile,
+      componentName,
+      componentType,
       config: {
         ...config,
         index,

package/.genx/utils/generateRoute.js

@@ -1,5 +1,6 @@
 const { resolve } = require('node:path');
 const makeDirectory = require('./makeDirectory');
+const generateTile = require('./generateTile');
 const {
   FRAMEWORK_WEB_COMPONENTS_ALIAS,
   FRAMEWORK_ANGULAR_ALIAS,
@@ -59,6 +60,13 @@ const generateRoute = (route, { changeCase, writeFileWithData }, framework) => {
       resolve(__dirname, source),
     );
   });
+
+  // Remove condition after adding changes for angular
+  if (framework === FRAMEWORK_WEB_COMPONENTS_ALIAS && route?.tiles?.length) {
+    route.tiles.forEach((tile) => {
+      generateTile(tile, route, { changeCase, writeFileWithData }, framework);
+    });
+  }
 };
 
 module.exports = generateRoute;