Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 | 33x 1714x 1714x 1714x 1714x | import { Separator } from "@/ahuora-design-system/ui/separator";
import { useFlowsheetSubscriptions } from "@/hooks/notifications/useFlowsheetSubscriptions.ts";
import { Tabs, TabsContent } from "@radix-ui/react-tabs";
import { memo } from "react";
import { DndProvider } from "react-dnd";
import { HTML5Backend } from "react-dnd-html5-backend";
import { useSearchParam } from "../../hooks/searchParams";
import { DuplicateFlowsheetCommand } from "./flowsheet/DuplicateFlowsheetCommand";
import { GlobalShortcutInputBlocker } from "./flowsheet/GlobalShortcutInputBlocker";
import {
CONTENT_MAP,
ContentTypes,
ViewTypes,
} from "./flowsheet/LeftSideBar/LeftSideBarTabDefinitions";
import SwitchViewCommands from "./flowsheet/LeftSideBar/SwitchViewCommands";
import { ResizableGroup } from "./flowsheet/Resizables";
import FlowsheetPage from "./FlowsheetPage";
import { MenuBar } from "./menuBar/MenuBar";
import PinchAnalysis from "./pinch-analysis/PinchAnalysis";
import LeftSideBarTabs from "./flowsheet/LeftSideBar/LeftSideBarTabs";
import Summary from "./flowsheet/Summary/Summary";
const ProjectPage = () => {
// Set up flowsheet-level event handlers for websocket notifications
useFlowsheetSubscriptions();
const [tab, setTab] = useSearchParam("content", ContentTypes.unitOps);
const view = CONTENT_MAP[tab as ContentTypes] || ViewTypes.flowsheet;
return (
<DndProvider backend={HTML5Backend}>
<GlobalShortcutInputBlocker />
<DuplicateFlowsheetCommand />
<SwitchViewCommands onNavTabChange={setTab} />
<div className="flex flex-col h-screen w-screen">
<MenuBar />
<Separator />
<div className="flex flex-1 overflow-hidden">
<LeftSideBarTabs />
<Tabs value={view} className="flex-1 overflow-hidden">
{/* Group tab content */}
<TabsContent value={ViewTypes.flowsheet} className="h-full">
<ResizableGroup>
<FlowsheetPage />
</ResizableGroup>
</TabsContent>
<TabsContent value={ViewTypes.pinch} className="h-full">
<ResizableGroup>
<PinchAnalysis />
</ResizableGroup>
</TabsContent>
<TabsContent value={ViewTypes.summary} className="h-full">
<ResizableGroup>
<Summary />
</ResizableGroup>
</TabsContent>
</Tabs>
</div>
</div>
</DndProvider>
);
};
export default memo(ProjectPage);
|