@genesislcap/pbc-notify-ui 1.0.4 → 1.0.6

package/dist/esm/components/foundation-notification-dashboard/components/routes/tabs/email-user-route-management.js

@@ -0,0 +1,66 @@
+import { __decorate } from "tslib";
+import { customElement, FASTElement, html } from '@microsoft/fast-element';
+import { managementGridStyles } from '../../../styles/management.styles';
+const EMAIL_USER_ROUTE_COLUMNS = [
+    {
+        field: 'NOTIFY_ROUTE_ID',
+        headerName: 'Notify Route Id',
+        flex: 1
+    },
+    {
+        field: 'TOPIC_MATCH',
+        headerName: 'Topic Match',
+        flex: 1
+    },
+    {
+        field: 'GATEWAY_ID',
+        headerName: 'Gateway Id',
+        flex: 1
+    },
+    {
+        field: 'ENTITY_ID',
+        headerName: 'Entity Id',
+        flex: 1
+    },
+    {
+        field: 'ENTITY_ID_TYPE',
+        headerName: 'Entity Id Type',
+        flex: 1
+    },
+    {
+        field: 'RIGHT_CODE',
+        headerName: 'Right Code',
+        flex: 1
+    },
+    {
+        field: 'AUTH_CACHE_NAME',
+        headerName: 'Auth Cache Name',
+        flex: 1
+    },
+    {
+        field: 'EXCLUDE_SENDER',
+        headerName: 'Exclude Sender',
+        flex: 1,
+    },
+];
+let EmailUserRouteManagement = class EmailUserRouteManagement extends FASTElement {
+};
+EmailUserRouteManagement = __decorate([
+    customElement({
+        name: 'email-user-route-management',
+        template: html `
+    <div class="grid">
+      <entity-management
+        resourceName="ALL_EMAIL_USER_ROUTES"
+        createEvent="EVENT_EMAIL_USER_ROUTE_CREATE"
+        updateEvent="EVENT_EMAIL_USER_ROUTE_UPDATE"
+        deleteEvent="EVENT_EMAIL_USER_ROUTE_DELETE"
+        :columns=${() => [...EMAIL_USER_ROUTE_COLUMNS]}
+      >
+      </entity-management>
+    </div>
+  `,
+        styles: managementGridStyles,
+    })
+], EmailUserRouteManagement);
+export { EmailUserRouteManagement };

package/dist/esm/components/foundation-notification-dashboard/{management → components/routes/tabs}/log-route-management.js

@@ -1,18 +1,39 @@
 import { __decorate } from "tslib";
 import { customElement, FASTElement, html } from '@microsoft/fast-element';
-import { managementGridStyles } from './management.styles';
+import { managementGridStyles } from '../../../styles/management.styles';
+const LOG_ROUTE_MANAGEMENT_COLUMNS = [
+    {
+        field: 'NOTIFY_ROUTE_ID',
+        headerName: 'Notify Route Id',
+        flex: 1
+    },
+    {
+        field: 'TOPIC_MATCH',
+        headerName: 'Topic Match',
+        flex: 1
+    },
+    {
+        field: 'GATEWAY_ID',
+        headerName: 'Gateway Id',
+        flex: 1
+    },
+];
 let LogRouteManagement = class LogRouteManagement extends FASTElement {
 };
 LogRouteManagement = __decorate([
     customElement({
         name: 'log-route-management',
         template: html `
+    <div class="grid">
     <entity-management
       resourceName="ALL_LOG_ROUTES"
       createEvent="EVENT_LOG_ROUTE_CREATE"
       updateEvent="EVENT_LOG_ROUTE_UPDATE"
       deleteEvent="EVENT_LOG_ROUTE_DELETE"
-    ></entity-management>
+      :columns=${() => [...LOG_ROUTE_MANAGEMENT_COLUMNS]}
+    >
+    </entity-management>
+  </div>
   `,
         styles: managementGridStyles,
     })

package/dist/esm/components/foundation-notification-dashboard/{management → components/routes/tabs}/ms-teams-route-management.js

@@ -1,18 +1,44 @@
 import { __decorate } from "tslib";
 import { customElement, FASTElement, html } from '@microsoft/fast-element';
-import { managementGridStyles } from './management.styles';
+import { managementGridStyles } from '../../../styles/management.styles';
+const MS_TEAMS_ROUTE_MANAGEMENT_COLUMNS = [
+    {
+        field: 'NOTIFY_ROUTE_ID',
+        headerName: 'Notify Route Id',
+        flex: 1
+    },
+    {
+        field: 'TOPIC_MATCH',
+        headerName: 'Topic Match',
+        flex: 1
+    },
+    {
+        field: 'GATEWAY_ID',
+        headerName: 'Gateway Id',
+        flex: 1
+    },
+    {
+        field: 'URL',
+        headerName: 'Url',
+        flex: 1
+    },
+];
 let MSTeamsRouteManagement = class MSTeamsRouteManagement extends FASTElement {
 };
 MSTeamsRouteManagement = __decorate([
     customElement({
         name: 'ms-teams-route-management',
         template: html `
+    <div class="grid">
     <entity-management
       resourceName="ALL_MS_TEAMS_ROUTES"
       createEvent="EVENT_MS_TEAMS_ROUTE_CREATE"
       updateEvent="EVENT_MS_TEAMS_ROUTE_UPDATE"
       deleteEvent="EVENT_MS_TEAMS_ROUTE_DELETE"
-    ></entity-management>
+      :columns=${() => [...MS_TEAMS_ROUTE_MANAGEMENT_COLUMNS]}
+    >
+    </entity-management>
+  </div>
   `,
         styles: managementGridStyles,
     })

package/dist/esm/components/foundation-notification-dashboard/components/routes/tabs/screen-route-management.js

@@ -0,0 +1,76 @@
+import { __decorate } from "tslib";
+import { customElement, FASTElement, html } from '@microsoft/fast-element';
+import { managementGridStyles } from '../../../styles/management.styles';
+const SCREEN_ROUTE_MANAGEMENT_COLUMNS = [
+    {
+        field: 'NOTIFY_ROUTE_ID',
+        headerName: 'Notify Route Id',
+        flex: 1
+    },
+    {
+        field: 'TOPIC_MATCH',
+        headerName: 'Topic Match',
+        flex: 1
+    },
+    {
+        field: 'GATEWAY_ID',
+        headerName: 'Gateway Id',
+        flex: 1
+    },
+    {
+        field: 'ENTITY_ID',
+        headerName: 'Entity Id',
+        flex: 1
+    },
+    {
+        field: 'ENTITY_ID_TYPE',
+        headerName: 'Entity Id Type',
+        flex: 1
+    },
+    {
+        field: 'RIGHT_CODE',
+        headerName: 'Right Code',
+        flex: 1
+    },
+    {
+        field: 'AUTH_CACHE_NAME',
+        headerName: 'Auth Cache Name',
+        flex: 1
+    },
+    {
+        field: 'TTL',
+        headerName: 'TTL',
+        flex: 1
+    },
+    {
+        field: 'TTL_TIME_UNIT',
+        headerName: 'TTL Time Unit',
+        flex: 1
+    },
+    {
+        field: 'EXCLUDE_SENDER',
+        headerName: 'Exclude Sender',
+        flex: 1
+    },
+];
+let ScreenRouteManagement = class ScreenRouteManagement extends FASTElement {
+};
+ScreenRouteManagement = __decorate([
+    customElement({
+        name: 'screen-route-management',
+        template: html `
+  <div class="grid">
+    <entity-management
+      resourceName="ALL_SCREEN_ROUTES"
+      createEvent="EVENT_SCREEN_NOTIFY_ROUTE_CREATE"
+      updateEvent="EVENT_SCREEN_NOTIFY_ROUTE_UPDATE"
+      deleteEvent="EVENT_SCREEN_NOTIFY_ROUTE_DELETE"
+      :columns=${() => [...SCREEN_ROUTE_MANAGEMENT_COLUMNS]}
+    >
+    </entity-management>
+  </div>
+  `,
+        styles: managementGridStyles,
+    })
+], ScreenRouteManagement);
+export { ScreenRouteManagement };

package/dist/esm/components/foundation-notification-dashboard/components/rules/columns.js

@@ -0,0 +1,46 @@
+import { buttonCellRenderer } from "@genesislcap/foundation-entity-management";
+import { deleteIcon, editIcon } from "../../../../utils";
+export const RULE_MANAGEMENT_COLUMNS = (context) => [
+    {
+        field: 'NAME',
+        headerName: 'Name',
+        flex: 1
+    },
+    {
+        field: 'DESCRIPTION',
+        headerName: 'Description',
+        flex: 1
+    },
+    {
+        field: 'USER_NAME',
+        headerName: 'Username',
+        flex: 1
+    },
+    {
+        field: 'RULE_TABLE',
+        headerName: 'Table',
+        flex: 1
+    },
+    {
+        field: 'RULE_STATUS',
+        headerName: 'Status',
+        flex: 1
+    },
+    {
+        field: 'RULE_EXPRESSION',
+        headerName: 'Expression',
+        flex: 1
+    },
+    {
+        field: 'RESULT_EXPRESSION',
+        headerName: 'Result',
+        flex: 1
+    },
+    {
+        field: 'RULE_EXECUTION_STRATEGY',
+        headerName: 'Execution Strategy',
+        flex: 1,
+    },
+    buttonCellRenderer('Edit', (e) => context.editRule(e), editIcon),
+    buttonCellRenderer('Delete', (e) => context.deleteRule(e), deleteIcon)
+];

package/dist/esm/components/foundation-notification-dashboard/components/{rule-dialog → rules/rule-dialog}/rule-condition-builder/rule-condition-builder.js

@@ -1,9 +1,9 @@
 import { __awaiter, __decorate } from "tslib";
 import { customElement, FASTElement, observable } from '@microsoft/fast-element';
-import { SystemService } from '../../../../../services/system.service';
 import { ConditionBuilderStyles as styles } from './rule-condition-builder.styles';
 import { ConditionBuilderTemplate as template } from './rule-condition-builder.template';
 import { RIGHT_CRITERIA } from './rule-condition-builder.types';
+import { SystemService } from '../../../../../../services/system.service';
 const name = 'rule-condition-builder';
 let RuleConditionBuilder = class RuleConditionBuilder extends FASTElement {
     constructor() {

package/dist/esm/components/foundation-notification-dashboard/components/{rule-dialog → rules/rule-dialog}/rule-condition-builder/rule-condition-builder.template.js

@@ -1,8 +1,8 @@
 import { sync } from '@genesislcap/foundation-utils';
 import { html, repeat } from "@microsoft/fast-element";
 import { classNames } from '@microsoft/fast-web-utilities';
-import { ALL_LOGICAL_OPERATORS } from '../../../types/logical-operator';
 import { RIGHT_CRITERIA } from './rule-condition-builder.types';
+import { ALL_LOGICAL_OPERATORS } from '../../../../types/logical-operator';
 export const ConditionBuilderTemplate = html `
   <div class="condition-builder">
     <zero-select

package/dist/esm/components/foundation-notification-dashboard/components/{rule-dialog → rules/rule-dialog}/rule-dialog.js

@@ -1,20 +1,19 @@
 import { __awaiter, __decorate } from "tslib";
 import { customElement, FASTElement, observable } from '@microsoft/fast-element';
-import { NotifyService } from '../../../../services/notify.service';
-import { RuleService } from '../../../../services/rule.service';
-import { SystemService } from '../../../../services/system.service';
-import { EXPRESSION_TYPE_PLACEHOLDER } from '../../types/expression-type';
-import { LOGICAL_OPERATOR_EQUALS } from '../../types/logical-operator';
-import { RULE_EXECUTION_UNLIMITED } from '../../types/rule-execution-strategy';
-import { SEVERITY_INFORMATION } from '../../types/severity';
-import { createAssignment, createConditions, getAssignmentValue, UUIDGenerator } from '../template-dialog/template-dialog.utils';
-import { RIGHT_CRITERIA } from './rule-condition-builder';
-import { ruleDialogStyles as styles } from './rule-dialog.styles';
-import { ruleDialogTemplate as template } from './rule-dialog.template';
 import { RuleDialogMode } from './rule-dialog.types';
 import { showNotification } from '@genesislcap/foundation-notifications';
-import { humanize } from '../../../foundation-inbox/inbox.utils';
-const name = 'rule-dialog';
+import { RuleDialogTemplate } from './rule-dialog.template';
+import { RuleDialogStyles } from './rule-dialog.styles';
+import { RIGHT_CRITERIA } from './rule-condition-builder/rule-condition-builder.types';
+import { RULE_EXECUTION_UNLIMITED } from '../../../types/rule-execution-strategy';
+import { SEVERITY_INFORMATION } from '../../../types/severity';
+import { createAssignment, createConditions, getAssignmentValue, UUIDGenerator } from '../../templates/template-dialog/template-dialog.utils';
+import { EXPRESSION_TYPE_PLACEHOLDER } from '../../../types/expression-type';
+import { humanize } from '../../../../../utils';
+import { LOGICAL_OPERATOR_EQUALS } from '../../../types/logical-operator';
+import { NotifyService } from '../../../../../services/notify.service';
+import { RuleService } from '../../../../../services/rule.service';
+import { SystemService } from '../../../../../services/system.service';
 let RuleDialog = class RuleDialog extends FASTElement {
     constructor() {
         super(...arguments);
@@ -219,9 +218,9 @@ __decorate([
 ], RuleDialog.prototype, "resources", void 0);
 RuleDialog = __decorate([
     customElement({
-        name,
-        template,
-        styles,
+        name: 'rule-dialog',
+        template: RuleDialogTemplate,
+        styles: RuleDialogStyles,
     })
 ], RuleDialog);
 export { RuleDialog };

package/dist/esm/components/foundation-notification-dashboard/components/{rule-dialog → rules/rule-dialog}/rule-dialog.styles.js

@@ -1,21 +1,42 @@
 import { css } from '@microsoft/fast-element';
 const modalWidthPx = 940;
-export const ruleDialogStyles = css `
-  .template-dialog-header-title {
+const header = css `
+  zero-modal::part(top) {
+    padding: calc(var(--design-unit) * 4px);
+    border-bottom: calc(var(--stroke-width) * 1px) solid var(--neutral-stroke-divider-rest);
+  }
+
+  .rule-dialog-header-title {
     font-weight: bold;
     align-self: center;
   }
+`;
+const footer = css `
+  .rule-dialog-footer {
+    display: flex;
+    padding: calc(var(--design-unit) * 4px);
+  }
 
-  zero-button {
-    margin: 0px;
+  .rule-dialog-footer .content-row {
+    margin-left: auto;
+    margin-bottom: 0px;
+  }
+`;
+export const RuleDialogStyles = css `
+  ${header}
+  ${footer}
+
+  zero-modal::part(dialog) {
+    padding: 0;
+    background: var(--neutral-layer-4);
+    border: calc(var(--stroke-width) * 1px) solid var(--neutral-stroke-divider-rest);
   }
 
-  .template-dialog-content {
+  .rule-dialog-content {
     display: flex;
     justify-content: center;
     flex-direction: column;
     width: ${String(modalWidthPx)}px;
-    max-height: 800px;
     gap: calc(var(--design-unit) * 3px);
     padding: 0 calc(var(--design-unit) * 4px);
   }
@@ -25,18 +46,13 @@ export const ruleDialogStyles = css `
     gap: calc(var(--design-unit) * 3px);
   }
 
-  .col-4 {
-    display: grid;
-    grid-template-columns: repeat(2, calc(${String(modalWidthPx - 4 * 3)}px / 2));
-    gap: calc(var(--design-unit) * 3px);
-  }
-
   .control {
     display: flex;
     flex-direction: column;
     width: 100%;
     gap: calc(var(--design-unit) * 2px);
   }
+  
   .conditions {
     height: 150px;
     max-height: 200px;
@@ -49,39 +65,21 @@ export const ruleDialogStyles = css `
     overflow-y: scroll;
   }
 
-  .template-dialog-footer {
-    margin-top: calc(var(--design-unit) * 2px);
-    display: flex;
-    padding: calc(var(--design-unit) * 4px);
-  }
-
-  .template-dialog-footer .content-row {
-    margin-left: auto;
-    margin-bottom: 0px;
-  }
-
   .condition {
     gap: 0;
     flex-direction: column;
+    margin-bottom: 0px;
   }
 
-  zero-select {
-    min-width: auto;
-  }
-
-  zero-modal::part(dialog) {
-    padding: 0;
-    background: var(--neutral-layer-4);
-    border: calc(var(--stroke-width) * 1px) solid var(--neutral-stroke-divider-rest);
+  zero-button {
+    margin: 0px;
   }
 
-  zero-modal::part(top) {
-    padding: calc(var(--design-unit) * 4px);
-    border-bottom: calc(var(--stroke-width) * 1px) solid var(--neutral-stroke-divider-rest);
+  zero-select {
+    min-width: 0;
   }
 
-  zero-select::part(control) {
-    display: flex;
-    width: 100%;
+  zero-select::part(listbox) {
+    max-height: 160px;
   }
 `;

package/dist/esm/components/foundation-notification-dashboard/components/rules/rule-dialog/rule-dialog.template.js

@@ -0,0 +1,164 @@
+import { sync } from '@genesislcap/foundation-utils';
+import { html, ref, repeat } from "@microsoft/fast-element";
+import { ALL_RULE_EXECUTION_STRATEGIES } from '../../../types/rule-execution-strategy';
+import { ALL_SEVERITIES } from '../../../types/severity';
+import { eventDetail } from '../../../../../utils/eventDetail';
+export const RuleDialogTemplate = html `
+  <zero-modal
+    ${ref('dialog')}
+    class="rule-dialog"
+    :onCloseCallback=${(x) => () => x.close()}
+  >
+    <div slot="top" class="rule-dialog-header-title">
+      ${x => x.ruleDialogTitle}
+    </div>
+
+    <div class="rule-dialog-content">
+      <div class="content-row">
+        <div class="control">
+          <label>Name</label>
+          <zero-text-field
+            :value=${sync(x => x.name)}
+            autofocus
+            autocomplete="off"
+          >
+          </zero-text-field>
+        </div>
+
+        <div class="control">
+          <label>Description</label>
+          <zero-text-field
+            :value=${sync(x => x.description)}
+            autocomplete="off"
+          >
+          </zero-text-field>
+        </div>
+      </div>
+
+      <div class="content-row">
+        <div class="control">
+          <label>Resource</label>
+          <zero-select
+            :value=${sync(x => x.resource)}
+            position="below"
+          >
+            ${repeat(x => x.resources, html `
+                <zero-option value=${x => x}>${x => x}</zero-option>
+              `)}
+          </zero-select>
+        </div>
+
+        <div class="control">
+          <label>Table ID</label>
+          <zero-select
+            :value=${sync(x => x.tableId)}
+          >
+            ${repeat(x => x.resourceFields, html `
+                <zero-option value=${x => x.FIELD_NAME}>${x => x.FIELD_NAME}</zero-option>
+              `)}
+          </zero-select>
+        </div>
+
+        <div class="control">
+          <label>Topic</label>
+          <zero-select
+            :value=${sync(x => x.topic)}
+          >
+            ${repeat(x => x.topics, html `
+                <zero-option value=${x => x}>${x => x}</zero-option>
+              `)}
+          </zero-select>
+        </div>
+
+        <div class="control">
+          <label>Execution Strategy</label>
+          <zero-select
+            :value=${sync(x => x.executionStrategy)}
+          >
+            <options-datasource
+              value-field='value'
+              label-field='value'
+              option-element='zero-option'
+              :data=${_ => ALL_RULE_EXECUTION_STRATEGIES.map(value => ({ value, label: value }))}
+            >
+            </options-datasource>
+          </zero-select>
+        </div>
+      </div>
+
+      <div class="content-row">
+        <div class="control">
+          <label>Severity</label>
+          <zero-select
+            :value=${sync(x => x.severity)}
+          >
+            <options-datasource
+              value-field='value'
+              label-field='value'
+              option-element='zero-option'
+              :data=${_ => ALL_SEVERITIES.map(value => ({ value, label: value }))}
+            >
+            </options-datasource>
+          </zero-select>
+        </div>
+
+        <div class="control">
+          <label>Header</label>
+          <zero-text-field
+            :value=${sync(x => x.header)}
+            autocomplete="off"
+          >
+          </zero-text-field>
+        </div>
+      </div>
+
+      <div class="content-row">
+        <div class="control">
+          <label>Message</label>
+          <zero-text-field
+            :value=${sync(x => x.message)}
+            autocomplete="off"
+          >
+          </zero-text-field>
+        </div>
+      </div>
+
+      <div class="control">
+        <label>Condition(s)</label>
+        <div class="conditions">
+          <div class="content-row condition">
+            ${repeat(x => x.conditions, html `
+                <rule-condition-builder
+                  :resource=${(x, c) => c.parent.resource}
+                  :condition=${x => x}
+                  @edit=${(x, c) => c.parent.editCondition(eventDetail(c))}
+                  @delete=${(x, c) => c.parent.deleteCondition(eventDetail(c))}
+                >
+                </rule-condition-builder>
+              `)}
+          </div>
+
+          <div class="content-row">
+            <zero-button
+              @click=${x => x.newCondition()}
+            >
+              <zero-icon name="plus"></zero-icon>
+              Condition
+            </zero-button>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="rule-dialog-footer">
+      <div class="content-row">
+        <zero-button
+          appearance="accent"
+          @click=${x => x.submit()}
+        >
+          Submit
+        </zero-button>
+      </div>
+    </div>
+  </zero-modal>
+`;