Workspaces

src/apps/officer-web/Screens/Dashboard/Home/index.tsx

@@ -1,26 +1,52 @@
-import { Workspace, createWorkspaceDefaults } from '@/components/Workspace';
 import { useUserState } from '@/state/useUserState';
-import { ChatLauncher } from './ChatLauncher';
-import { FileBrowserWidget as FileBrowser } from '@/Screens/Dashboard/Files';
-import { ChatHistoryWidget as ChatHistory } from '@/Screens/Dashboard/ChatHistory';
-import { Catalog } from 'sounds';
+import { WorkspaceView } from '@/components/Workspace';
+import type { LayoutNode } from '@/components/Workspace';
+import { widgetRegistry } from '@/Screens/Dashboard/Workspaces/widget-registry';
 
-const WIDGET_IDS = ['chat-launcher', 'file-browser', 'chat-history', 'sound-library'] as const;
-const DEFAULTS = createWorkspaceDefaults([...WIDGET_IDS]);
+const DEFAULT_HOME_LAYOUT: LayoutNode = {
+  type: 'group',
+  id: 'home-root',
+  direction: 'horizontal',
+  children: [
+    {
+      size: 50,
+      node: {
+        type: 'group',
+        id: 'home-left',
+        direction: 'vertical',
+        children: [
+          { size: 50, node: { type: 'panel', id: 'home-tl', widgetType: 'chat-launcher' } },
+          { size: 50, node: { type: 'panel', id: 'home-bl', widgetType: 'file-browser' } },
+        ],
+      },
+    },
+    {
+      size: 50,
+      node: {
+        type: 'group',
+        id: 'home-right',
+        direction: 'vertical',
+        children: [
+          { size: 50, node: { type: 'panel', id: 'home-tr', widgetType: 'chat-history' } },
+          { size: 50, node: { type: 'panel', id: 'home-br', widgetType: 'sound-library' } },
+        ],
+      },
+    },
+  ],
+};
 
 export const HomeScreen = () => {
-  const [state, setState] = useUserState('home-layout', DEFAULTS);
+  const [layout, setLayout] = useUserState<LayoutNode>('home-workspace-layout', DEFAULT_HOME_LAYOUT);
 
   return (
-    <Workspace
-      widgets={{
-        'chat-launcher': <ChatLauncher />,
-        'file-browser': <FileBrowser />,
-        'chat-history': <ChatHistory />,
-        'sound-library': <Catalog />,
-      }}
-      state={state}
-      onChange={setState}
-    />
+    <div className="h-full w-full">
+      <WorkspaceView
+        workspace={null}
+        name="Home"
+        layout={layout}
+        onLayoutChange={setLayout}
+        registry={widgetRegistry}
+      />
+    </div>
   );
 };