@genesislcap/foundation-workspace 14.406.0-workspaces.7

package/src/workspace-manager/workspace-manager.ts

@@ -0,0 +1,420 @@
+import { Auth, Connect } from '@genesislcap/foundation-comms';
+import {
+  showNotificationDialog,
+  showNotificationToast,
+} from '@genesislcap/foundation-notifications';
+import { Modal } from '@genesislcap/foundation-ui';
+import { customElement, observable } from '@microsoft/fast-element';
+import { FoundationElement } from '@microsoft/fast-foundation';
+import {
+  LayoutRegistry,
+  GridRegistry,
+  FilterRegistry,
+  WorkspaceState,
+  type SavedWorkspace,
+  type SharedWorkspace,
+  type SavedGridSettings,
+} from '../workspace';
+import { WorkspaceManagerStyles as styles } from './workspace-manager.styles';
+import {
+  WORKSPACE_DESCRIPTION_MAX,
+  WorkspaceManagerTemplate as template,
+} from './workspace-manager.template';
+
+/**
+ * Workspace load mode.
+ * @alpha
+ */
+export type LoadMode = 'MY' | 'SHARED';
+
+/**
+ * Workspace persistence UI (save/load + share/delete shared workspaces).
+ * @alpha
+ */
+@customElement({
+  name: 'workspace-manager',
+  template,
+  styles,
+})
+export class WorkspaceManager extends FoundationElement {
+  @observable workspaceName: string = '';
+  @observable workspaceDescription: string = '';
+  @observable savedWorkspaces: SavedWorkspace[] = [];
+  @observable sharedWorkspaces: SharedWorkspace[] = [];
+  @observable isLoading: boolean = false;
+  @observable applyingWorkspace: boolean = false;
+  @observable loadMode: LoadMode = 'MY';
+  @observable saveModal: Modal;
+  @observable loadModal: Modal;
+  @observable saveMode: 'create' | 'overwrite' | 'shared' = 'create';
+  @observable selectedWorkspaceToOverwrite: string = '';
+  @observable workspaceToShare: string = '';
+  @observable dialogBoundary: HTMLElement;
+  @observable sharedWorkspaceDialogBoundary: HTMLElement;
+
+  @LayoutRegistry layoutRegistry: LayoutRegistry;
+  @GridRegistry gridRegistry: GridRegistry;
+  @FilterRegistry filterRegistry: FilterRegistry;
+  @WorkspaceState workspaceState: WorkspaceState;
+  @Connect connect: Connect;
+  @Auth auth: Auth;
+
+  @observable canShareWorkspace: boolean;
+
+  private sanitizeDescription(input: string): string {
+    const cleaned = (input ?? '')
+      // allow only letters, numbers and whitespace
+      .replace(/[^a-zA-Z0-9\s]/g, '')
+      // normalise whitespace
+      .replace(/\s+/g, ' ')
+      .trim();
+
+    return cleaned.slice(0, WORKSPACE_DESCRIPTION_MAX);
+  }
+
+  updateWorkspaceDescription(raw: string): void {
+    this.workspaceDescription = this.sanitizeDescription(raw);
+  }
+
+  private setDescriptionFromSelectedWorkspace(): void {
+    const name = this.selectedWorkspaceToOverwrite?.trim();
+
+    if (!name) {
+      this.workspaceDescription = '';
+      return;
+    }
+
+    const existing = this.savedWorkspaces.find((w) => w.name === name);
+    this.workspaceDescription = this.sanitizeDescription(existing?.description ?? '');
+  }
+
+  async connectedCallback(): Promise<void> {
+    super.connectedCallback();
+    await this.refreshSavedWorkspaces();
+    await this.refreshSharedWorkspaces();
+    this.canShareWorkspace = this.auth.currentUser.hasPermission('SHARE_WORKSPACE');
+  }
+
+  async refreshSavedWorkspaces(): Promise<void> {
+    this.isLoading = true;
+    try {
+      this.savedWorkspaces = await this.workspaceState.getSavedWorkspaces();
+    } catch (error) {
+      console.error('Failed to load saved workspaces', error);
+      this.savedWorkspaces = [];
+    } finally {
+      this.isLoading = false;
+    }
+  }
+
+  async refreshSharedWorkspaces(): Promise<void> {
+    try {
+      const response: any = await this.connect.request('REQ_SHARED_WORKSPACES');
+      const rows: any[] = response?.REPLY || [];
+      this.sharedWorkspaces = rows.map((row: any) => ({
+        id: row.SHARED_WORKSPACE_ID,
+        name: row.WORKSPACE_NAME,
+        userName: row.USER_NAME,
+        description: row.DESCRIPTION ?? undefined,
+        createdOn: row.CREATED_ON,
+        modifiedOn: row.MODIFIED_ON,
+        data: row.WORKSPACE_DATA,
+      }));
+    } catch (error) {
+      this.notifyError(`REQ_SHARED_WORKSPACES ${JSON.stringify(error)}`);
+      console.error('Failed to load shared workspaces', error);
+      this.sharedWorkspaces = [];
+    }
+  }
+
+  private notifyError(body = 'Error'): void {
+    showNotificationToast(
+      { title: 'Error', body, iconName: 'bell', toast: { type: 'error', autoClose: false } },
+      'rapid',
+    );
+  }
+
+  async saveWorkspace(): Promise<void> {
+    const workspaceName =
+      this.saveMode === 'overwrite'
+        ? this.selectedWorkspaceToOverwrite.trim()
+        : this.workspaceName.trim();
+
+    if (!workspaceName) {
+      console.error('workspace-manager: workspace name is required');
+      return;
+    }
+
+    try {
+      const layoutConfigs = this.layoutRegistry.getLayoutsConfigs();
+      const gridSettings: SavedGridSettings[] = this.gridRegistry.getAllGridsSettings();
+      const filterValues = this.filterRegistry.getAllFiltersValues();
+      await this.workspaceState.saveWorkspace(
+        workspaceName,
+        layoutConfigs,
+        gridSettings,
+        filterValues,
+        this.workspaceDescription.trim() || undefined,
+      );
+      this.workspaceName = '';
+      this.workspaceDescription = '';
+      this.closeSaveDialog();
+      await this.refreshSavedWorkspaces();
+      console.log('Workspace saved successfully');
+    } catch (error) {
+      console.error('Failed to save workspace', error);
+    }
+  }
+
+  private async applyWorkspace(workspace: SavedWorkspace): Promise<void> {
+    if (workspace.filters && workspace.filters.length > 0) {
+      this.filterRegistry.applyFiltersValues(workspace.filters);
+    }
+    if (workspace.layouts && workspace.layouts.length > 0) {
+      await this.layoutRegistry.applySavedLayouts(workspace.layouts);
+    }
+    if (workspace.grids && workspace.grids.length > 0) {
+      await this.gridRegistry.applyAllGridsSettings(workspace.grids);
+    }
+  }
+
+  async loadWorkspace(workspaceName: string): Promise<void> {
+    try {
+      this.applyingWorkspace = true;
+      const workspace = await this.workspaceState.loadWorkspace(workspaceName);
+      if (workspace) {
+        await this.applyWorkspace(workspace);
+        this.closeLoadDialog();
+        console.log('Workspace loaded successfully');
+      } else {
+        console.warn('Workspace not found:', workspaceName);
+      }
+    } catch (error) {
+      this.applyingWorkspace = false;
+      console.error('Failed to load workspace', error);
+    }
+    this.applyingWorkspace = false;
+  }
+
+  private async requestSharedWorkspace(SHARED_WORKSPACE_ID: string): Promise<any[]> {
+    try {
+      const response = await this.connect.request('REQ_LOAD_SHARED_WORKSPACE', {
+        REQUEST: { SHARED_WORKSPACE_ID },
+      });
+      return response.REPLY || [];
+    } catch (e) {
+      console.error(e);
+    }
+  }
+
+  async loadSharedWorkspace(shared: {
+    id: string;
+    name: string;
+    userName: string;
+    createdOn?: string | number;
+    modifiedOn?: string | number;
+    data: string;
+  }): Promise<void> {
+    try {
+      this.applyingWorkspace = true;
+      const sharedData = await this.requestSharedWorkspace(shared.id);
+      if (!sharedData?.length) {
+        console.warn('workspace has no data');
+        return;
+      }
+      const dataJoined = sharedData.map((d) => d.WORKSPACE_DATA).join('');
+      const workspace: SavedWorkspace = JSON.parse(dataJoined);
+      await this.applyWorkspace(workspace);
+      this.closeLoadDialog();
+      console.log('Shared workspace loaded successfully');
+    } catch (error) {
+      console.error('Failed to load shared workspace', error);
+    }
+    this.applyingWorkspace = false;
+  }
+
+  async deleteWorkspace(workspaceName: string): Promise<void> {
+    try {
+      await this.workspaceState.deleteWorkspace(workspaceName);
+      await this.refreshSavedWorkspaces();
+      console.log('Workspace deleted successfully');
+    } catch (error) {
+      console.error('Failed to delete workspace', error);
+    }
+  }
+
+  private showDeleteConfirmation(
+    title: string,
+    body: string,
+    actionFunction: () => void,
+    dialogBoundary: HTMLElement,
+  ): void {
+    showNotificationDialog(
+      {
+        title,
+        body,
+        dialog: {
+          confirmingActions: [{ label: 'Delete', action: actionFunction }],
+          dismissingAction: { label: 'Cancel' },
+        },
+      },
+      'rapid',
+      dialogBoundary,
+    );
+  }
+
+  confirmDeleteWorkspace(workspaceName: string): void {
+    const trimmedName = workspaceName?.trim();
+    if (!trimmedName) return;
+    this.showDeleteConfirmation(
+      'Delete workspace',
+      `Are you sure you want to delete the workspace "${trimmedName}"? This action cannot be undone.`,
+      () => this.deleteWorkspace(trimmedName),
+      this.dialogBoundary,
+    );
+  }
+
+  async modifySharedWorkspace(sharedWorkspace: SharedWorkspace): Promise<void> {
+    try {
+      const layouts = this.layoutRegistry.getLayoutsConfigs();
+      const grids: SavedGridSettings[] = this.gridRegistry.getAllGridsSettings();
+      const filters = this.filterRegistry.getAllFiltersValues();
+
+      const baseWorkspace = await this.workspaceState.loadWorkspace(sharedWorkspace.name);
+      const description =
+        this.sanitizeDescription(baseWorkspace?.description ?? sharedWorkspace.description ?? '') ||
+        undefined;
+
+      const workspace: SavedWorkspace = {
+        name: sharedWorkspace.name,
+        username: sharedWorkspace.userName,
+        description,
+        layouts,
+        grids,
+        filters,
+        savedAt: new Date().toISOString(),
+      };
+
+      const response = await this.connect.commitEvent('EVENT_SHARED_WORKSPACE_MODIFY', {
+        VALIDATE: false,
+        DETAILS: {
+          WORKSPACE_NAME: sharedWorkspace.name,
+          WORKSPACE_DATA: JSON.stringify(workspace),
+          WORKSPACE_DESCRIPTION: description ?? null,
+        },
+      });
+
+      if (response.MESSAGE_TYPE == 'EVENT_ACK') {
+        this.closeSaveDialog();
+      }
+    } catch (e) {
+      this.notifyError(`EVENT_SHARED_WORKSPACE_MODIFY ${JSON.stringify(e)}`);
+      console.error(e);
+    }
+  }
+
+  async deleteSharedWorkspace(sharedWorkspace: SharedWorkspace): Promise<void> {
+    try {
+      const response = await this.connect.commitEvent('EVENT_SHARED_WORKSPACE_DELETE', {
+        VALIDATE: false,
+        DETAILS: { WORKSPACE_NAME: sharedWorkspace.name },
+      });
+      if (response.MESSAGE_TYPE == 'EVENT_ACK') {
+        this.closeSaveDialog();
+        await this.refreshSharedWorkspaces();
+      }
+    } catch (e) {
+      this.notifyError(`EVENT_SHARED_WORKSPACE_DELETE ${JSON.stringify(e)}`);
+      console.error(e);
+    }
+  }
+
+  confirmDeleteSharedWorkspace(sharedWorkspace: SharedWorkspace): void {
+    if (!sharedWorkspace?.name) return;
+    this.showDeleteConfirmation(
+      'Delete shared workspace',
+      `Are you sure you want to delete the shared workspace "${sharedWorkspace.name}"? This action cannot be undone.`,
+      () => this.deleteSharedWorkspace(sharedWorkspace),
+      this.sharedWorkspaceDialogBoundary,
+    );
+  }
+
+  async shareExistingWorkspace(workspaceName: string): Promise<void> {
+    const name = workspaceName?.trim();
+    if (!name) return;
+    try {
+      const workspace = await this.workspaceState.loadWorkspace(name);
+      if (!workspace) {
+        console.warn('Workspace not found for sharing:', name);
+        return;
+      }
+      const response = await this.connect.commitEvent('EVENT_SHARED_WORKSPACE_INSERT', {
+        VALIDATE: false,
+        DETAILS: {
+          WORKSPACE_NAME: workspace.name,
+          WORKSPACE_DATA: JSON.stringify(workspace),
+          WORKSPACE_DESCRIPTION: workspace.description ?? null,
+        },
+      });
+      if (response.MESSAGE_TYPE == 'EVENT_ACK') {
+        console.log('Workspace shared successfully');
+        this.closeSaveDialog();
+        await this.refreshSharedWorkspaces();
+      } else if (response.MESSAGE_TYPE == 'EVENT_NACK') {
+        console.warn('Failed to share workspace', response);
+        this.closeSaveDialog();
+      }
+    } catch (error) {
+      console.error('Failed to share workspace', error);
+    }
+  }
+
+  async openSaveDialog(): Promise<void> {
+    await this.refreshSavedWorkspaces();
+    this.saveModal.show();
+    this.workspaceName = '';
+    this.workspaceDescription = '';
+    this.saveMode = 'create';
+    this.selectedWorkspaceToOverwrite = '';
+    this.workspaceToShare = '';
+  }
+
+  isWorkspaceExisting(workspaceName: string): boolean {
+    return this.savedWorkspaces.some((p) => p.name.toLowerCase() === workspaceName.toLowerCase());
+  }
+
+  saveModeChanged(oldValue: string, newValue: string): void {
+    if (newValue === 'create') {
+      this.selectedWorkspaceToOverwrite = '';
+      this.workspaceDescription = '';
+    } else if (newValue === 'overwrite') {
+      this.workspaceName = '';
+      this.setDescriptionFromSelectedWorkspace();
+    } else if (newValue === 'shared') {
+      this.workspaceName = '';
+      this.selectedWorkspaceToOverwrite = '';
+      this.workspaceDescription = '';
+    }
+  }
+
+  selectedWorkspaceToOverwriteChanged(oldValue: string, newValue: string): void {
+    if (this.saveMode === 'overwrite') {
+      this.setDescriptionFromSelectedWorkspace();
+    }
+  }
+
+  openLoadDialog(): void {
+    this.refreshSharedWorkspaces();
+    this.loadModal.show();
+  }
+
+  closeSaveDialog(): void {
+    this.saveModal.close();
+    this.workspaceName = '';
+    this.workspaceDescription = '';
+  }
+
+  closeLoadDialog(): void {
+    this.loadModal.close();
+  }
+}