You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 

42 lines
1.3 KiB

"use client";
import { useEffect } from "react";
import { ReactFlowProvider } from "@xyflow/react";
import { Header } from "@/components/Header";
import { WorkflowCanvas } from "@/components/WorkflowCanvas";
import { FloatingActionBar } from "@/components/FloatingActionBar";
import { AnnotationModal } from "@/components/AnnotationModal";
import { useWorkflowStore } from "@/store/workflowStore";
export default function Home() {
const initializeAutoSave = useWorkflowStore(
(state) => state.initializeAutoSave
);
const cleanupAutoSave = useWorkflowStore((state) => state.cleanupAutoSave);
useEffect(() => {
initializeAutoSave();
return () => cleanupAutoSave();
}, [initializeAutoSave, cleanupAutoSave]);
useEffect(() => {
const handleBeforeUnload = (e: BeforeUnloadEvent) => {
if (useWorkflowStore.getState().hasUnsavedChanges) {
e.preventDefault();
}
};
window.addEventListener("beforeunload", handleBeforeUnload);
return () => window.removeEventListener("beforeunload", handleBeforeUnload);
}, []);
return (
<ReactFlowProvider>
<div className="h-screen flex flex-col">
<Header />
<WorkflowCanvas />
<FloatingActionBar />
<AnnotationModal />
</div>
</ReactFlowProvider>
);
}