feat(app): own workspace routing and inbox data

This commit is contained in:
2026-05-02 21:28:52 +00:00
parent 2c46552906
commit 4cb9d4a394
3 changed files with 37 additions and 7 deletions
+31 -1
View File
@@ -3,8 +3,25 @@ import { html, render } from '@design.estate/dees-element';
type TWorkspaceView = 'inbox' | 'compose' | 'sign' | 'audit' | 'developers' | 'templates' | 'team' | 'settings';
type TDocumentRow = {
id: string;
title: string;
status: 'awaiting' | 'signed' | 'draft' | 'declined';
recipients: Array<{ name: string; initials: string; signed: boolean }>;
updated: string;
sender: string;
pages: number;
deadline?: string;
};
const workspaceViews: TWorkspaceView[] = ['inbox', 'compose', 'sign', 'audit', 'developers', 'templates', 'team', 'settings'];
const appDocuments: TDocumentRow[] = [
{ id: 'app_doc_001', title: 'Platform Services Agreement - App-owned data', status: 'awaiting', recipients: [{ name: 'Sarah Chen', initials: 'SC', signed: true }, { name: 'David Park', initials: 'DP', signed: false }], updated: 'just now', sender: 'App Service', pages: 14, deadline: 'May 5' },
{ id: 'app_doc_002', title: 'Security Addendum - Catalog Integration', status: 'draft', recipients: [{ name: 'Philipp K.', initials: 'PK', signed: false }], updated: '12 min ago', sender: 'App Service', pages: 5 },
{ id: 'app_doc_003', title: 'Completed Vendor NDA - Signed from App', status: 'signed', recipients: [{ name: 'Lila Brooks', initials: 'LB', signed: true }, { name: 'Philipp K.', initials: 'PK', signed: true }], updated: '1h ago', sender: 'App Service', pages: 3 },
];
const isWorkspaceView = (view: string): view is TWorkspaceView => workspaceViews.includes(view as TWorkspaceView);
const viewFromLocation = (): TWorkspaceView => {
@@ -33,6 +50,18 @@ const handleViewChange = (event: Event) => {
}
};
const handleWorkspaceViewRequest = (event: Event) => {
const view = (event as CustomEvent<{ view?: TWorkspaceView }>).detail?.view;
if (!view || !isWorkspaceView(view)) return;
currentView = view;
const nextHash = `#${view}`;
if (globalThis.location.hash !== nextHash) {
globalThis.location.hash = view;
} else {
renderApp();
}
};
const handleRouteChange = () => {
if (routeChangeFrame !== null) {
globalThis.cancelAnimationFrame(routeChangeFrame);
@@ -67,7 +96,7 @@ const renderApp = () => {
height: 100vh;
}
</style>
<sdig-workspace accent="#3b82f6" density="comfortable" theme="dark" initialView=${currentView} .initialView=${currentView} view=${currentView} .view=${currentView}></sdig-workspace>
<sdig-workspace accent="#3b82f6" density="comfortable" theme="dark" initialView=${currentView} .initialView=${currentView} view=${currentView} .view=${currentView} .documents=${appDocuments}></sdig-workspace>
`,
appRoot!
);
@@ -76,6 +105,7 @@ const renderApp = () => {
const run = async () => {
createAppRoot();
document.body.addEventListener('view-change', handleViewChange);
document.body.addEventListener('workspace-view-request', handleWorkspaceViewRequest);
globalThis.addEventListener('popstate', handleRouteChange);
globalThis.addEventListener('hashchange', handleRouteChange);
renderApp();