"use client"; import React, { createContext, useContext, useRef, useState } from "react"; import type { DrawIoEmbedRef } from "react-drawio"; import { extractDiagramXML } from "@/app/extract_xml"; interface DiagramContextType { chartXML: string; latestSvg: string; diagramHistory: { svg: string; xml: string }[]; loadDiagram: (chart: string) => void; handleExport: () => void; resolverRef: React.MutableRefObject<((value: string) => void) | null>; drawioRef: React.MutableRefObject; handleDiagramExport: (data: any) => void; } const DiagramContext = createContext(undefined); export function DiagramProvider({ children }: { children: React.ReactNode }) { const [chartXML, setChartXML] = useState(""); const [latestSvg, setLatestSvg] = useState(""); const [diagramHistory, setDiagramHistory] = useState< { svg: string; xml: string }[] >([]); const drawioRef = useRef(null); const resolverRef = useRef<((value: string) => void) | null>(null); const handleExport = () => { if (drawioRef.current) { drawioRef.current.exportDiagram({ format: "xmlsvg", }); } }; const loadDiagram = (chart: string) => { if (drawioRef.current) { drawioRef.current.load({ xml: chart, }); } }; const handleDiagramExport = (data: any) => { const extractedXML = extractDiagramXML(data.data); setChartXML(extractedXML); setLatestSvg(data.data); setDiagramHistory((prev) => [ ...prev, { svg: data.data, xml: extractedXML, }, ]); if (resolverRef.current) { resolverRef.current(extractedXML); resolverRef.current = null; } }; return ( {children} ); } export function useDiagram() { const context = useContext(DiagramContext); if (context === undefined) { throw new Error("useDiagram must be used within a DiagramProvider"); } return context; }