All files / src/pages/flowsheet-page ProjectPage.tsx

100% Statements 4/4
50% Branches 1/2
100% Functions 0/0
100% Lines 4/4

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 65 66 67 68 69 70 71                                                    8906x 8906x 8906x   8906x                                                                                
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 { FlowsheetAccessProvider } from "@/ahuora-design-system/ui/accessControlled";
import { Separator } from "@/ahuora-design-system/ui/separator";
import { useFlowsheetSubscriptions } from "@/hooks/notifications/useFlowsheetSubscriptions.ts";
import { FeatureFlagCommands } from "../../commands/FeatureFlagCommands";
import { useSearchParam } from "../../hooks/searchParams";
import FlowsheetPage from "./FlowsheetPage";
import { DuplicateFlowsheetCommand } from "./flowsheet/DuplicateFlowsheetCommand";
import { GlobalShortcutInputBlocker } from "./flowsheet/GlobalShortcutInputBlocker";
import {
  CONTENT_MAP,
  ContentTypes,
  ViewTypes,
} from "./flowsheet/LeftSideBar/LeftSideBarTabDefinitions";
import LeftSideBarTabs from "./flowsheet/LeftSideBar/LeftSideBarTabs";
import SwitchViewCommands from "./flowsheet/LeftSideBar/SwitchViewCommands";
import { ResizableGroup } from "./flowsheet/Resizables";
import Summary from "./flowsheet/Summary/Summary";
import { MenuBar } from "./menuBar/MenuBar";
import PinchAnalysis from "./pinch-analysis/PinchAnalysis";
 
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}>
      <FlowsheetAccessProvider>
        <GlobalShortcutInputBlocker />
        <DuplicateFlowsheetCommand />
        <SwitchViewCommands onNavTabChange={setTab} />
        <FeatureFlagCommands />
        <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">
              {/* Keep the access provider at the project-page level so shared
                  controls in the menu bar and top-level pinch view stay in the
                  same flowsheet access scope as the main canvas page. */}
              <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>
      </FlowsheetAccessProvider>
    </DndProvider>
  );
};
 
export default memo(ProjectPage);