@genesislcap/pbc-documents-ui 0.0.32 → 14.338.0

package/src/services/document.service.ts

@@ -0,0 +1,131 @@
+import { Auth, Connect } from '@genesislcap/foundation-comms';
+import { DI } from '@genesislcap/web-core';
+import { FileMetaType } from '../types';
+import { logger, showNotificationToast } from '../utils';
+
+export type UploadParams = {
+  file: File;
+  path: string;
+  fileMetaType: FileMetaType;
+};
+export type ReplaceParams = {
+  file: File;
+  fileStorageId: string;
+};
+
+export interface IDocumentService {
+  uploadDocument(params: UploadParams): Promise<Response>;
+  replaceDocument(params: ReplaceParams): Promise<Response>;
+  downloadDocument(documentId: string);
+  deleteDocument(documentId: string);
+}
+
+class DocumentServiceImpl implements IDocumentService {
+  constructor(
+    @Connect private connect: Connect,
+    @Auth private auth: Auth,
+  ) {}
+
+  async uploadDocument({ file, path, fileMetaType }: UploadParams) {
+    if (!file) {
+      logger.error('No file provided.');
+      return;
+    }
+
+    const headers = new Headers();
+    if (this.auth.loggedUserResult) {
+      headers.append('SESSION_AUTH_TOKEN', this.auth.loggedUserResult.authToken);
+    }
+    const formData = new FormData();
+    formData.append(file.name, file);
+    formData.append('SUB_DIR', path);
+    formData.append('FILE_TYPE', fileMetaType.toString());
+
+    return fetch('gwf/file-server/upload/', {
+      method: 'POST',
+      body: formData,
+      headers: headers,
+    });
+  }
+  async replaceDocument({ file, fileStorageId }: ReplaceParams): Promise<any> {
+    if (!file) {
+      logger.error('No file provided.');
+      return;
+    }
+
+    const headers = new Headers();
+    if (this.auth.loggedUserResult) {
+      headers.append('SESSION_AUTH_TOKEN', this.auth.loggedUserResult.authToken);
+    }
+    const formData = new FormData();
+    formData.append(file.name, file);
+    formData.append('FILE_STORAGE_ID', fileStorageId);
+
+    return fetch('gwf/file-server/replace/', {
+      method: 'POST',
+      body: formData,
+      headers: headers,
+    });
+  }
+
+  async deleteDocument(documentId: string) {
+    try {
+      const deleteResponse = await this.connect.commitEvent('EVENT_FILE_STORAGE_DELETE', {
+        DETAILS: {
+          FILE_STORAGE_ID: documentId,
+        },
+        IGNORE_WARNINGS: true,
+        VALIDATE: false,
+      });
+      if (deleteResponse.MESSAGE_TYPE === 'EVENT_ACK') {
+        showNotificationToast({
+          title: 'Delete Document',
+          body: `document was deleted successfully`,
+          toast: { type: 'success' as any },
+        });
+      } else {
+        const error = deleteResponse?.ERROR?.length ? deleteResponse.ERROR[0].TEXT : '';
+        showNotificationToast({
+          title: 'Delete Document',
+          body: `document was not deleted due to following error "${error}"`,
+          toast: { type: 'critical' as any },
+        });
+      }
+    } catch (err) {
+      logger.error(err);
+    }
+  }
+
+  downloadDocument(documentId: string) {
+    const headers = new Headers();
+    headers.append('SESSION_AUTH_TOKEN', sessionStorage.getItem('authToken'));
+
+    let filename = '';
+    fetch(`gwf/file-server/download?fileStorageId=${documentId}`, {
+      method: 'GET',
+      headers: headers,
+    })
+      .then((response) => {
+        const contentDispositionHeader = response.headers.get('Content-disposition');
+        filename = contentDispositionHeader.split(';')[1].split('filename')[1].split('=')[1].trim();
+        return response.blob();
+      })
+      .then((blob) => URL.createObjectURL(blob))
+      .then((url) => {
+        const a = document.createElement('a');
+        a.style.display = 'none';
+        a.href = url;
+        a.download = filename;
+        document.body.appendChild(a);
+        a.click();
+        window.URL.revokeObjectURL(url);
+      })
+      .catch((err) => {
+        logger.error(err);
+      });
+  }
+}
+
+export const IDocumentService = DI.createInterface<IDocumentService>((x) =>
+  x.singleton(DocumentServiceImpl),
+);

package/src/tags/index.ts

@@ -0,0 +1 @@
+export * from './tags';

package/src/tags/tags.ts

@@ -0,0 +1,79 @@
+import { tagFor } from '@genesislcap/foundation-ui';
+import { DI } from '@genesislcap/web-core';
+import { DocumentManagerConfig } from '../config/config';
+import { defaultTemplateOptions } from '../config/templates';
+
+/**
+ * It's important this file isn't referenced ahead of a `configure` call, otherwise these values may remain fixed at
+ * their defaults. Consumers must use the `/config` subpath to help avoid this. Files with references to tags should be
+ * lazily loaded. There is an alternative `getTags` utility at the end which could offer another approach, but direct
+ * tag exports and inline template references feel cleaner than having to convert all component `template` and `styles`
+ * exports to functions to call `getTags` on execution.
+ */
+
+/**
+ * @internal
+ */
+export const { templateOptions = defaultTemplateOptions } =
+  DI.getOrCreateDOMContainer().get(DocumentManagerConfig);
+
+/**
+ * @internal
+ */
+export const iconTag = tagFor(templateOptions.icon);
+
+/**
+ * @internal
+ */
+export const buttonTag = tagFor(templateOptions.button);
+
+/**
+ * @internal
+ */
+export const badgeTag = tagFor(templateOptions.badge);
+
+/**
+ * @internal
+ */
+export const progressTag = tagFor(templateOptions.progress);
+
+/**
+ * @internal
+ */
+export const searchBarTag = tagFor(templateOptions.searchBar);
+/**
+ * @internal
+ */
+export const treeViewTag = tagFor(templateOptions.treeView);
+/**
+ * @internal
+ */
+export const treeItemTag = tagFor(templateOptions.treeItem);
+/**
+ * @internal
+ */
+export const gridTag = tagFor(templateOptions.grid);
+/**
+ * @internal
+ */
+export const modalTag = tagFor(templateOptions.modal);
+/**
+ * @internal
+ */
+export const textInputTag = tagFor(templateOptions.textInput);
+/**
+ * @internal
+ */
+export const checkboxInputTag = tagFor(templateOptions.checkboxInput);
+/**
+ * @internal
+ */
+export const selectInputTag = tagFor(templateOptions.selectInput);
+/**
+ * @internal
+ */
+export const optionTag = tagFor(templateOptions.option);
+/**
+ * @internal
+ */
+export const multiSelectInputTag = tagFor(templateOptions.multiselect);

package/src/types/index.ts

@@ -0,0 +1,2 @@
+export * from './utils.types';
+export * from './main.types';

package/src/types/main.types.ts

@@ -0,0 +1,100 @@
+export enum ColumnFields {
+  FILE_STORAGE_ID = 'FILE_STORAGE_ID',
+  STORAGE_MANAGER = 'STORAGE_MANAGER',
+  FILE_NAME = 'FILE_NAME',
+  FILE_SIZE = 'FILE_SIZE',
+  MODIFIED_AT = 'MODIFIED_AT',
+  MODIFIED_BY = 'MODIFIED_BY',
+  CREATED_BY = 'CREATED_BY',
+  CREATED_AT = 'CREATED_AT',
+  LOCATION_DETAILS = 'LOCATION_DETAILS',
+  FILE_TYPE = 'FILE_TYPE',
+}
+
+export enum ColumnMetadata {
+  IS_DIR = 'IS_DIR',
+  DIR_PATH = 'DIR_PATH',
+}
+
+export const fileTypes = ['CSV', 'JPG', 'PNG', 'PDF'] as const;
+export type FileTypes = (typeof fileTypes)[number];
+
+export enum DIRECTORY {
+  ALL = 'ALL',
+  MY_FILES = 'MY_FILES',
+  ALL_TEMPLATES = 'ALL_TEMPLATES',
+  ALL_ASSETS = 'ALL_ASSETS',
+}
+
+export type Directories = {
+  id: DIRECTORY;
+  icon: any;
+  title: string;
+  selected: boolean;
+};
+
+type DataRowMetadata = {
+  [ColumnMetadata.IS_DIR]: boolean;
+  [ColumnMetadata.DIR_PATH]: string;
+};
+
+export enum FileMetaType {
+  'USER_DOCUMENT' = 'USER_DOCUMENT',
+  'DOCUMENT_TEMPLATE' = 'DOCUMENT_TEMPLATE',
+  'TEMPLATE_ASSET' = 'TEMPLATE_ASSET',
+}
+
+type _DataRow = {
+  [ColumnFields.FILE_STORAGE_ID]: string;
+  [ColumnFields.STORAGE_MANAGER]: string;
+  [ColumnFields.FILE_NAME]: string;
+  [ColumnFields.FILE_SIZE]: number;
+  [ColumnFields.MODIFIED_AT]: number;
+  [ColumnFields.MODIFIED_BY]: string;
+  [ColumnFields.CREATED_BY]: string;
+  [ColumnFields.CREATED_AT]: number;
+  [ColumnFields.LOCATION_DETAILS]: string;
+  [ColumnFields.FILE_TYPE]: FileMetaType;
+};
+
+export type DataRow = _DataRow & Partial<DataRowMetadata>;
+
+export enum DocManagerEvents {
+  RowCountChanged = 'row-count-changed',
+  HandleUploadStarted = 'handle-upload-started',
+  HandleReplaceStarted = 'handle-replace-started',
+  HandleFileDeleted = 'handle-file-deleted',
+  HandleFileUploaded = 'handle-file-uploaded',
+  HandleFileReplaced = 'handle-file-replaced',
+  HandleFileProcessError = 'handle-file-process-error',
+  InitFileDownload = 'init-file-download',
+  InitFileDelete = 'init-file-delete',
+  InitFileUpload = 'init-file-upload',
+  InitTemplateAssetLinking = 'init-template-asset-linking',
+  InitFileReplace = 'init-file-replace',
+}
+
+export type DocManagerEventDetailMap = {
+  [DocManagerEvents.RowCountChanged]: number;
+  [DocManagerEvents.HandleUploadStarted]: void;
+  [DocManagerEvents.HandleReplaceStarted]: void;
+  [DocManagerEvents.HandleFileProcessError]: void;
+  [DocManagerEvents.HandleFileDeleted]: void;
+  [DocManagerEvents.HandleFileUploaded]: void;
+  [DocManagerEvents.HandleFileReplaced]: void;
+  [DocManagerEvents.InitFileDownload]: DataRow[ColumnFields.FILE_STORAGE_ID];
+  [DocManagerEvents.InitFileDelete]: DataRow[ColumnFields.FILE_STORAGE_ID];
+  [DocManagerEvents.InitFileUpload]: string;
+  [DocManagerEvents.InitTemplateAssetLinking]: DataRow[ColumnFields.FILE_STORAGE_ID];
+  [DocManagerEvents.InitFileReplace]: {
+    FILE_STORAGE_ID: DataRow[ColumnFields.FILE_STORAGE_ID];
+    FILE_TYPE: DataRow[ColumnFields.FILE_TYPE];
+    LOCATION_DETAILS: DataRow[ColumnFields.LOCATION_DETAILS];
+  };
+};
+
+export enum FileUploadMode {
+  DISABLED = 'Disabled',
+  UPLOAD = 'Uploading',
+  REPLACE = 'Replacing',
+}

package/src/types/utils.types.ts

@@ -0,0 +1,7 @@
+export type TabulatorTree<DataRow> = Partial<DataRow> & {
+  _children?: Array<TabulatorTree<DataRow>>;
+};
+
+export type _TabulatorTree<DataRow> = {
+  [path: string]: Partial<DataRow> & { _children?: _TabulatorTree<DataRow> };
+};

package/src/typings.d.ts

@@ -0,0 +1 @@
+declare module 'foundationZero/ZeroDesignSystem';

package/src/utils/formatting.ts

@@ -0,0 +1,55 @@
+/**
+ * Number formatter, can be used directly on ag-grid columns as valueFormatter.
+ *
+ * @param minDP min decimal points
+ * @param maxDP max decimal points
+ */
+export function formatNumber(minDP = 2, maxDP = minDP) {
+  return (params) => {
+    if (!(params && typeof params.value === 'number')) return '';
+    const lang = (navigator && navigator.language) || 'en-GB';
+    return Intl.NumberFormat(lang, {
+      minimumFractionDigits: minDP,
+      maximumFractionDigits: maxDP,
+    }).format(params.value);
+  };
+}
+
+export const getFormattedDateTime = (dateTimeInMills) => {
+  if (!dateTimeInMills) return undefined;
+  const dateTime = new Date(dateTimeInMills);
+  return `${dateTime.toLocaleDateString()} ${dateTime.toLocaleTimeString()}`;
+};
+
+export const getFileType = (fileName: string): string => {
+  if (!fileName) return undefined;
+  const typeIndex = fileName.lastIndexOf('.');
+  return fileName.substring(typeIndex + 1).toUpperCase();
+};
+
+export const getFileColor = (fileType: string): string => {
+  switch (fileType) {
+    case 'CSV':
+      return '#63a103';
+    case 'JPG':
+    case 'PNG':
+      return '#8a98f5';
+    case 'PDF':
+      return '#f9644d';
+    default:
+      return '#ffffff';
+  }
+};
+
+export const formatBytes = (bytes, decimals = 2): string => {
+  if (!bytes) return undefined;
+  if (!+bytes) return '0 Bytes';
+
+  const k = 1000;
+  const dm = decimals < 0 ? 0 : decimals;
+  const sizes = ['Bytes', 'KB', 'MB', 'GB'];
+
+  const i = Math.floor(Math.log(bytes) / Math.log(k));
+
+  return `${parseFloat((bytes / Math.pow(k, i)).toFixed(dm))} ${sizes[i]}`;
+};

package/src/utils/index.ts

@@ -0,0 +1,4 @@
+export * from './logger';
+export * from './misc';
+export * from './notifications';
+export * from './styles';

package/src/utils/logger.ts

@@ -0,0 +1,3 @@
+import { createLogger } from '@genesislcap/foundation-logger';
+
+export const logger = createLogger('genesis-file-server');

package/src/utils/misc.ts

@@ -0,0 +1,11 @@
+import { MessageError } from '@genesislcap/foundation-comms';
+
+export const msgUnwrap = (res: unknown): string => {
+  if (typeof res !== 'object' || !('receivedMessage' in res))
+    return 'Unknown error, unable to parse error message';
+  return (
+    (res as { receivedMessage: { ERROR?: MessageError[] } }).receivedMessage.ERROR?.map(
+      ({ TEXT }) => TEXT,
+    ).join(', ') + '.'
+  );
+};

package/src/utils/notifications.ts

@@ -0,0 +1,6 @@
+import { getNotificationContainer, ToastStructure } from '@genesislcap/foundation-notifications';
+import { showNotificationToast as toast } from '@genesislcap/foundation-notifications';
+
+const container = getNotificationContainer('notify-container', 'rapid');
+
+export const showNotificationToast = (config: ToastStructure) => toast(config, 'rapid', container);

package/src/utils/styles.ts

@@ -0,0 +1,28 @@
+import { css } from '@genesislcap/web-core';
+import { modalTag } from '../tags';
+
+export const modalStyles = css`
+  ${modalTag}::part(dialog) {
+    width: 50%;
+    height: 50%;
+  }
+
+  ${modalTag}::part(content) {
+    width: 100%;
+    height: 100%;
+  }
+
+  ${modalTag}:not(:defined) {
+    visibility: hidden;
+  }
+`;
+
+export const titleStyles = css`
+  .title {
+    font-weight: 500;
+    font-size: var(--type-ramp-plus-2-font-size);
+    color: var(--neutral-foreground-rest);
+    text-align: left;
+    line-height: normal;
+  }
+`;

package/tsconfig.json

@@ -0,0 +1,29 @@
+{
+  "compilerOptions": {
+    "declarationDir": "./dist/dts",
+    "outDir": "./dist/esm",
+    "rootDir": "./src",
+    "allowJs": true,
+    "allowSyntheticDefaultImports": true,
+    "declaration": true,
+    "declarationMap": true,
+    "esModuleInterop": true,
+    "experimentalDecorators": true,
+    "importHelpers": true,
+    "lib": ["DOM", "ES2015", "ES2016", "ES2017"],
+    "module": "ESNext",
+    "moduleResolution": "node",
+    "noEmitOnError": true,
+    "noImplicitAny": false,
+    "preserveConstEnums": true,
+    "pretty": true,
+    "removeComments": true,
+    "resolveJsonModule": true,
+    "skipLibCheck": true,
+    "sourceMap": true,
+    "strictNullChecks": false,
+    "target": "ES2017"
+  },
+  "include": ["src/**/*"],
+  "exclude": ["node_modules", "dist", "build"]
+}

package/index.html

@@ -1,29 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="utf-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>{{htmlWebpackPlugin.options.title}}</title>
-  <style>
-      html,
-      body {
-        width: 100%;
-        height: 100%;
-        background: var(--neutral-layer-4);
-        padding: 0;
-        margin: 0;
-        overflow: clip;
-      }
-      :not(:defined) {
-        visibility: hidden;
-      }
-  </style>
-</head>
-<body>
-  <document-manager-sandbox></document-manager-sandbox>
-  {{#if insertEntryPoint}}
-    <script type="module" src="/src/sandbox.ts"></script>
-    <script type="module" src="/src/index.ts"></script>
-  {{/if}}
-</body>
-</html>

package/sonar-project.properties

@@ -1,5 +0,0 @@
-sonar.projectKey=genesislcap_genesis-file-server_client
-sonar.projectName=pbc-documents-ui
-sonar.organization=genesislcap
-sonar.host.url=https://sonarcloud.io
-sonar.sourceEncoding=UTF-8