no idea

src/apps/officer-web/Screens/Dashboard/Projects/ProjectScreen.tsx

@@ -0,0 +1,32 @@
+import { useParams, Navigate } from 'react-router';
+import { useProjectsState } from '@/state/useProjectsState';
+import { WorkspaceView, createDefaultLayout } from '@/components/Workspace';
+import type { LayoutNode, ProjectDefinition } from '@/components/Workspace';
+import { appRegistry } from '../Workspaces/app-registry';
+
+export const ProjectScreen = () => {
+  const { id } = useParams<{ id: string }>();
+  const [projects, , isLoaded] = useProjectsState<ProjectDefinition[]>('projects', []);
+  const project = projects.find((p) => p.id === id);
+
+  if (!isLoaded) return null;
+  if (!project) return <Navigate to="/projects" replace />;
+
+  return <ProjectScreenInner project={project} />;
+};
+
+const ProjectScreenInner = ({ project }: { project: ProjectDefinition }) => {
+  const [layout, setLayout] = useProjectsState<LayoutNode>(`proj-layout-${project.id}`, createDefaultLayout());
+  const workspace = { id: project.id, name: project.name, cwd: project.cwd };
+
+  return (
+    <div className="h-full w-full">
+      <WorkspaceView
+        workspace={workspace}
+        layout={layout}
+        onLayoutChange={setLayout}
+        registry={appRegistry}
+      />
+    </div>
+  );
+};