@genesislcap/blank-app-seed 3.13.1 → 3.14.0

package/.genx/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@genesislcap/blank-app-seed-config",
   "description": "Genesis Blank App Seed Configuration",
-  "version": "3.13.1",
+  "version": "3.14.0",
   "license": "Apache-2.0",
   "genxSeedConfig": {
     "exclude": [

package/.genx/templates/chart.hbs

@@ -1,18 +1,26 @@
-<rapid-g2plot-chart
-  type="{{ config.type }}"
-  :config="${(x) => ({
-    {{#ifEquals config.type "pie"}}
-      radius: 0.75,
-      angleField: 'value',
-      colorField: 'groupBy',
-    {{else}}
-     xField: 'groupBy',
-     yField: 'value',
-    {{/ifEquals}}
-  })}"
->
-  <chart-datasource
-    resourceName="{{ config.resourceName }}"
-    server-fields="{{ config.xField }} {{ config.yField }}"
-  ></chart-datasource>
-</rapid-g2plot-chart>
+${whenElse(
+    (x) => getViewUpdateRightComponent(x.user, '{{config.permissions.viewRight}}'),
+    html`
+      <rapid-g2plot-chart
+        type="{{ config.type }}"
+        :config="${(x) => ({
+          {{#ifEquals config.type "pie"}}
+            radius: 0.75,
+            angleField: 'value',
+            colorField: 'groupBy',
+          {{else}}
+          xField: 'groupBy',
+          yField: 'value',
+          {{/ifEquals}}
+        })}"
+      >
+        <chart-datasource
+          resourceName="{{ config.resourceName }}"
+          server-fields="{{ config.xField }} {{ config.yField }}"
+        ></chart-datasource>
+      </rapid-g2plot-chart>
+    `,
+    html`
+        <not-permitted-component></not-permitted-component>
+    `,
+)}

package/.genx/templates/entityManager.hbs

@@ -1,51 +1,59 @@
-<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=${() => (
-        {{{ config.createFormUiSchema }}}
-    )}
-    {{/if}}
-    {{/if}}
-    {{#if config.updateEvent}}
-    updateEvent="{{ config.updateEvent }}"
-    {{#if config.updateFormUiSchema}}
-    :updateFormUiSchema=${() => (
-        {{{ config.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=${() => ({pollingInterval: 5000 })}
-    {{/if}}
-    {{#if config.columns}}
-    :columns=${() => {{{ config.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>
+${whenElse(
+    (x) => getViewUpdateRightComponent(x.user, '{{config.permissions.viewRight}}'),
+    html`
+        <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="${(x) => getViewUpdateRightComponent(x.user, '{{config.permissions.updateRight}}', '{{ config.createEvent }}')}"
+            {{#if config.createFormUiSchema}}
+            :createFormUiSchema=${() => (
+                {{{ config.createFormUiSchema }}}
+            )}
+            {{/if}}
+            {{/if}}
+            {{#if config.updateEvent}}
+            updateEvent="${(x) => getViewUpdateRightComponent(x.user, '{{config.permissions.updateRight}}', '{{ config.updateEvent }}')}"
+            {{#if config.updateFormUiSchema}}
+            :updateFormUiSchema=${() => (
+                {{{ config.updateFormUiSchema }}}
+            )}
+            {{/if}}
+            {{/if}}
+            {{#if config.deleteEvent}}
+            deleteEvent="${(x) => getViewUpdateRightComponent(x.user, '{{config.permissions.updateRight}}', '{{ config.deleteEvent }}')}"
+            {{/if}}
+            {{#if config.gridOptions}}
+            :gridOptions=${() => (
+            {{{config.gridOptions}}}
+            )}
+            {{/if}}
+            {{#if config.snapshot}}
+            :datasourceConfig=${() => ({isSnapshot: {{ config.snapshot }} })}
+            {{/if}}
+            {{#if config.reqrep}}
+            :datasourceConfig=${() => ({pollingInterval: 5000 })}
+            {{/if}}
+            {{#if config.columns}}
+            :columns=${() => {{{ config.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>
+    `,
+    html`
+        <not-permitted-component></not-permitted-component>
+    `,
+)}

package/.genx/templates/form.hbs

@@ -1,10 +1,18 @@
-<foundation-form
-  design-system-prefix="rapid"
-  resourceName="{{config.resourceName}}"
-  {{#if config.uischema}}
-  :uischema=${() => (
-    {{{config.uischema}}}
-  )}
-  {{/if}}
->
-</foundation-form>
+${whenElse(
+    (x) => getViewUpdateRightComponent(x.user, '{{config.permissions.viewRight}}'),
+    html`
+      <foundation-form
+        design-system-prefix="rapid"
+        resourceName="{{config.resourceName}}"
+        {{#if config.uischema}}
+        :uischema=${() => (
+          {{{config.uischema}}}
+        )}
+        {{/if}}
+      >
+      </foundation-form>
+    `,
+    html`
+        <not-permitted-component></not-permitted-component>
+    `,
+)}

package/.genx/templates/grid.hbs

@@ -1,20 +1,28 @@
-<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=${() => ({pollingInterval: 5000 })}
-    {{/if}}
-    {{#if config.gridOptions}}
-    :deferredGridOptions=${() => (
-      {{{config.gridOptions}}}
-    )}
-    {{/if}}
-  >
-  </grid-pro-genesis-datasource>
-</rapid-grid-pro>
+${whenElse(
+    (x) => getViewUpdateRightComponent(x.user, '{{config.permissions.viewRight}}'),
+    html`
+      <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=${() => ({pollingInterval: 5000 })}
+          {{/if}}
+          {{#if config.gridOptions}}
+          :deferredGridOptions=${() => (
+            {{{config.gridOptions}}}
+          )}
+          {{/if}}
+        >
+        </grid-pro-genesis-datasource>
+      </rapid-grid-pro>
+    `,
+    html`
+        <not-permitted-component></not-permitted-component>
+    `,
+)}

package/.genx/templates/route.hbs

@@ -1,3 +1,4 @@
+import { User } from '@genesislcap/foundation-user';
 import { customElement, GenesisElement } from '@genesislcap/web-core';
 import { {{pascalCase route.name}}Styles as styles } from './{{kebabCase route.name}}.styles';
 import { {{pascalCase route.name}}Template as template } from './{{kebabCase route.name}}.template';
@@ -8,6 +9,8 @@ import { {{pascalCase route.name}}Template as template } from './{{kebabCase rou
   styles,
 })
 export class {{pascalCase route.name}} extends GenesisElement {
+  @User user: User;
+
   constructor() {
     super();
   }

package/.genx/templates/route.template.hbs

@@ -1,5 +1,5 @@
-import { html } from '@genesislcap/web-core';
-import { getDateFormatter, getNumberFormatter{{#if route.FDC3EventHandlersEnabled}}, sendEventOnChannel{{/if}} } from '../../utils';
+import { html, whenElse } from '@genesislcap/web-core';
+import { getDateFormatter, getNumberFormatter, getViewUpdateRightComponent{{#if route.FDC3EventHandlersEnabled}}, sendEventOnChannel{{/if}} } from '../../utils';
 import type { {{pascalCase route.name}} } from './{{kebabCase route.name}}';
 
 export const {{pascalCase route.name}}Template = html<{{pascalCase route.name}}>`

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## [3.14.0](https://github.com/genesiscommunitysuccess/blank-app-seed/compare/v3.13.1...v3.14.0) (2024-06-17)
+
+
+### Features
+
+* handle component view/update permissions GENC-470 (#257) 7c3c3b6
+
 ## [3.13.1](https://github.com/genesiscommunitysuccess/blank-app-seed/compare/v3.13.0...v3.13.1) (2024-06-17)
 
 

package/client/package.json

@@ -105,6 +105,7 @@
     "@genesislcap/foundation-store": "{{versions.UI}}",
     "@genesislcap/foundation-ui": "{{versions.UI}}",
     "@genesislcap/foundation-utils": "{{versions.UI}}",
+    "@genesislcap/foundation-user": "{{versions.UI}}",
     "@genesislcap/foundation-zero": "{{versions.UI}}",
     "@genesislcap/foundation-zero-grid-pro": "{{versions.UI}}",
     "@genesislcap/g2plot-chart": "{{versions.UI}}",
@@ -129,6 +130,7 @@
     "@genesislcap/foundation-store": "{{versions.UI}}",
     "@genesislcap/foundation-ui": "{{versions.UI}}",
     "@genesislcap/foundation-utils": "{{versions.UI}}",
+    "@genesislcap/foundation-user": "{{versions.UI}}",
     "@genesislcap/foundation-zero": "{{versions.UI}}",
     "@genesislcap/foundation-zero-grid-pro": "{{versions.UI}}",
     "@genesislcap/g2plot-chart": "{{versions.UI}}",

package/client/src/components/components.ts

@@ -8,6 +8,7 @@ import { zeroGridComponents } from '@genesislcap/foundation-zero-grid-pro';
 import { g2plotChartsComponents } from '@genesislcap/g2plot-chart';
 import * as rapidDesignSystem from '@genesislcap/rapid-design-system';
 import { rapidGridComponents } from '@genesislcap/rapid-grid-pro';
+import { NotPermittedComponent } from './not-permitted-component';
 
 /**
  * Ensure tree shaking doesn't remove these.
@@ -15,6 +16,7 @@ import { rapidGridComponents } from '@genesislcap/rapid-grid-pro';
 FoundationRouter;
 EntityManagement;
 Form;
+NotPermittedComponent;
 
 /**
  * registerComponents.

package/client/src/components/not-permitted-component/index.ts

@@ -0,0 +1 @@
+export * from './not-permitted-component';

package/client/src/components/not-permitted-component/not-permitted-component.styles.ts

@@ -0,0 +1,13 @@
+import { css } from '@genesislcap/web-core';
+import { errorMessageStyles, mixinScreen } from '../../styles';
+
+export const notPermittedComponentStyles = css`
+  ${errorMessageStyles}
+
+  :host {
+    ${mixinScreen('flex')}
+
+    align-items: center;
+    justify-content: center;
+  }
+`;

package/client/src/components/not-permitted-component/not-permitted-component.template.ts

@@ -0,0 +1,6 @@
+import { html } from '@genesislcap/web-core';
+import type { NotPermittedComponent } from './not-permitted-component';
+
+export const notPermittedComponentTemplate = html<NotPermittedComponent>`
+  <h3 class="error-message">You do not have access to view this component.</h3>
+`;

package/client/src/components/not-permitted-component/not-permitted-component.ts

@@ -0,0 +1,14 @@
+import { customElement, GenesisElement } from '@genesislcap/web-core';
+import { notPermittedComponentStyles as styles } from './not-permitted-component.styles';
+import { notPermittedComponentTemplate as template } from './not-permitted-component.template';
+
+@customElement({
+  name: 'not-permitted-component',
+  template,
+  styles,
+})
+export class NotPermittedComponent extends GenesisElement {
+  constructor() {
+    super();
+  }
+}

package/client/src/routes/not-found/not-found.styles.ts

@@ -1,15 +1,13 @@
 import { css } from '@genesislcap/web-core';
-import { mixinScreen } from '../../styles';
+import { errorMessageStyles, mixinScreen } from '../../styles';
 
 export const NotFoundStyles = css`
+  ${errorMessageStyles}
+
   :host {
     ${mixinScreen('flex')}
 
     align-items: center;
     justify-content: center;
   }
-
-  h1 {
-    color: var(--neutral-foreground-rest);
-  }
 `;

package/client/src/routes/not-found/not-found.template.ts

@@ -2,5 +2,5 @@ import { html } from '@genesislcap/web-core';
 import type { NotFound } from './not-found';
 
 export const NotFoundTemplate = html<NotFound>`
-  <h1>Not found! 404</h1>
+  <h1 class="error-message">Not found! 404</h1>
 `;

package/client/src/routes/not-permitted/not-permitted.styles.ts

@@ -1,16 +1,13 @@
 import { css } from '@genesislcap/web-core';
-import { mixinScreen } from '../../styles';
+import { errorMessageStyles, mixinScreen } from '../../styles';
 
 export const NotPermittedStyles = css`
+  ${errorMessageStyles}
+
   :host {
     ${mixinScreen('flex')}
 
     align-items: center;
     justify-content: center;
   }
-
-  h1 {
-    text-align: center;
-    color: var(--neutral-foreground-rest);
-  }
 `;

package/client/src/routes/not-permitted/not-permitted.template.ts

@@ -2,7 +2,7 @@ import { html } from '@genesislcap/web-core';
 import type { NotPermitted } from './not-permitted';
 
 export const NotPermittedTemplate = html<NotPermitted>`
-  <h1>
+  <h1 class="error-message">
     You do not have permission to access this part of the application, please contact your
     administrator.
   </h1>

package/client/src/styles/styles.ts

@@ -1,4 +1,5 @@
-import { css } from '@genesislcap/web-core';
+import { errorColor } from '@genesislcap/rapid-design-system';
+import { css, neutralLayer4 } from '@genesislcap/web-core';
 import { mixinCardTitle } from './typography';
 
 export const stylesCardHeading = css`
@@ -7,6 +8,21 @@ export const stylesCardHeading = css`
   }
 `;
 
+export const errorMessageStyles = css`
+  .error-message {
+    color: var(--neutral-foreground-rest);
+    background-color: ${neutralLayer4};
+    border-color: ${errorColor};
+    border-radius: 7px;
+    border-style: solid;
+    border-width: 4px;
+    padding: 5px;
+    margin: 15px;
+    text-align: center;
+    width: fit-content;
+  }
+`;
+
 export const mixinScreen = (display: string = 'block') => `
   contain: content;
   display: ${display};

package/client/src/utils/index.ts

@@ -1,3 +1,4 @@
 export * from './fdc3';
 export * from './formatters';
 export * from './logger';
+export * from './permissions';

package/client/src/utils/permissions.ts

@@ -0,0 +1,7 @@
+import { User } from '@genesislcap/foundation-user';
+
+export const getViewUpdateRightComponent = (
+  user: User,
+  right: string,
+  event: string | boolean = true,
+) => (!right || user.hasPermission(right) ? event : '');

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@genesislcap/blank-app-seed",
   "description": "Genesis Blank App Seed",
-  "version": "3.13.1",
+  "version": "3.14.0",
   "license": "Apache-2.0",
   "scripts": {
     "release": "semantic-release"