|
| 1 | +import { produce } from "immer"; |
| 2 | +import { useCallback, useEffect, useMemo, useState } from "react"; |
| 3 | + |
| 4 | +import type { MinimalNetMetadata, SDCPN } from "../../src/core/types/sdcpn"; |
| 5 | +import { convertOldFormatToSDCPN } from "../../src/old-formats/convert-old-format"; |
| 6 | +import { Petrinaut } from "../../src/petrinaut"; |
| 7 | +import { |
| 8 | + isOldFormatInLocalStorage, |
| 9 | + type SDCPNInLocalStorage, |
| 10 | + useLocalStorageSDCPNs, |
| 11 | +} from "./app/use-local-storage-sdcpns"; |
| 12 | + |
| 13 | +export const DevApp = () => { |
| 14 | + const { storedSDCPNs, setStoredSDCPNs } = useLocalStorageSDCPNs(); |
| 15 | + |
| 16 | + const [currentNetId, setCurrentNetId] = useState<string | null>(null); |
| 17 | + |
| 18 | + const currentNet = useMemo(() => { |
| 19 | + if (!currentNetId) { |
| 20 | + return null; |
| 21 | + } |
| 22 | + return storedSDCPNs[currentNetId] ?? null; |
| 23 | + }, [currentNetId, storedSDCPNs]); |
| 24 | + |
| 25 | + const existingNets: MinimalNetMetadata[] = useMemo(() => { |
| 26 | + return Object.values(storedSDCPNs) |
| 27 | + .filter( |
| 28 | + (net): net is SDCPNInLocalStorage => !isOldFormatInLocalStorage(net), |
| 29 | + ) |
| 30 | + .map((net) => ({ |
| 31 | + netId: net.id, |
| 32 | + title: net.title, |
| 33 | + })); |
| 34 | + }, [storedSDCPNs]); |
| 35 | + |
| 36 | + const createNewNet = useCallback( |
| 37 | + (params: { |
| 38 | + petriNetDefinition: SDCPN; |
| 39 | + title: string; |
| 40 | + }) => { |
| 41 | + const newNet: SDCPNInLocalStorage = { |
| 42 | + id: `net-${Date.now()}`, |
| 43 | + title: params.title, |
| 44 | + sdcpn: params.petriNetDefinition, |
| 45 | + lastUpdated: new Date().toISOString(), |
| 46 | + }; |
| 47 | + |
| 48 | + setStoredSDCPNs((prev) => ({ ...prev, [newNet.id]: newNet })); |
| 49 | + setCurrentNetId(newNet.id); |
| 50 | + }, |
| 51 | + [setStoredSDCPNs], |
| 52 | + ); |
| 53 | + |
| 54 | + const loadPetriNet = useCallback((petriNetId: string) => { |
| 55 | + setCurrentNetId(petriNetId); |
| 56 | + }, []); |
| 57 | + |
| 58 | + const setTitle = useCallback( |
| 59 | + (title: string) => { |
| 60 | + if (!currentNetId) { |
| 61 | + return; |
| 62 | + } |
| 63 | + |
| 64 | + setStoredSDCPNs((prev) => |
| 65 | + produce(prev, (draft) => { |
| 66 | + if (draft[currentNetId] && "title" in draft[currentNetId]) { |
| 67 | + draft[currentNetId].title = title; |
| 68 | + } |
| 69 | + }), |
| 70 | + ); |
| 71 | + }, |
| 72 | + [currentNetId, setStoredSDCPNs], |
| 73 | + ); |
| 74 | + |
| 75 | + const mutatePetriNetDefinition = useCallback( |
| 76 | + (definitionMutationFn: (draft: SDCPN) => void) => { |
| 77 | + if (!currentNetId) { |
| 78 | + return; |
| 79 | + } |
| 80 | + |
| 81 | + setStoredSDCPNs((prev) => |
| 82 | + produce(prev, (draft) => { |
| 83 | + if (draft[currentNetId]) { |
| 84 | + draft[currentNetId].sdcpn = produce( |
| 85 | + draft[currentNetId].sdcpn, |
| 86 | + definitionMutationFn, |
| 87 | + ); |
| 88 | + } |
| 89 | + }), |
| 90 | + ); |
| 91 | + }, |
| 92 | + [currentNetId, setStoredSDCPNs], |
| 93 | + ); |
| 94 | + |
| 95 | + // Initialize with a default net if none exists |
| 96 | + useEffect(() => { |
| 97 | + const sdcpnsInStorage = Object.values(storedSDCPNs); |
| 98 | + |
| 99 | + const convertedNets: Record<string, SDCPNInLocalStorage> = {}; |
| 100 | + |
| 101 | + for (const sdcpnInStorage of sdcpnsInStorage) { |
| 102 | + if (!isOldFormatInLocalStorage(sdcpnInStorage)) { |
| 103 | + continue; |
| 104 | + } |
| 105 | + |
| 106 | + const convertedSdcpn = convertOldFormatToSDCPN(sdcpnInStorage.sdcpn); |
| 107 | + |
| 108 | + if (!convertedSdcpn) { |
| 109 | + throw new Error( |
| 110 | + "Couldn't convert old format to SDCPN, but should have been able to", |
| 111 | + ); |
| 112 | + } |
| 113 | + |
| 114 | + convertedNets[sdcpnInStorage.sdcpn.id] = { |
| 115 | + /** |
| 116 | + * The id and title used to be in the SDCPN definition itself, so we add them back here. |
| 117 | + * A legacy provision only which can probably be removed once 2025 is over. |
| 118 | + */ |
| 119 | + id: sdcpnInStorage.sdcpn.id, |
| 120 | + title: sdcpnInStorage.sdcpn.title, |
| 121 | + sdcpn: convertedSdcpn, |
| 122 | + lastUpdated: sdcpnInStorage.lastUpdated, |
| 123 | + }; |
| 124 | + } |
| 125 | + |
| 126 | + if (Object.keys(convertedNets).length > 0) { |
| 127 | + setStoredSDCPNs((existingSDCPNs) => ({ |
| 128 | + ...existingSDCPNs, |
| 129 | + ...convertedNets, |
| 130 | + })); |
| 131 | + return; |
| 132 | + } |
| 133 | + |
| 134 | + if (!sdcpnsInStorage[0]) { |
| 135 | + createNewNet({ |
| 136 | + petriNetDefinition: { |
| 137 | + places: [], |
| 138 | + transitions: [], |
| 139 | + types: [], |
| 140 | + parameters: [], |
| 141 | + differentialEquations: [], |
| 142 | + }, |
| 143 | + title: "New Process", |
| 144 | + }); |
| 145 | + } else if (isOldFormatInLocalStorage(sdcpnsInStorage[0])) { |
| 146 | + throw new Error( |
| 147 | + "Old format SDCPN found in storage, but should have been converted", |
| 148 | + ); |
| 149 | + } else if (!currentNetId) { |
| 150 | + setCurrentNetId(sdcpnsInStorage[0].id); |
| 151 | + } |
| 152 | + }, [currentNetId, createNewNet, setStoredSDCPNs, storedSDCPNs]); |
| 153 | + |
| 154 | + if (!currentNet || isOldFormatInLocalStorage(currentNet)) { |
| 155 | + return null; |
| 156 | + } |
| 157 | + |
| 158 | + return ( |
| 159 | + <div style={{ height: "100vh", width: "100vw" }}> |
| 160 | + <Petrinaut |
| 161 | + existingNets={existingNets} |
| 162 | + createNewNet={createNewNet} |
| 163 | + hideNetManagementControls={false} |
| 164 | + loadPetriNet={loadPetriNet} |
| 165 | + petriNetId={currentNetId} |
| 166 | + petriNetDefinition={currentNet.sdcpn} |
| 167 | + mutatePetriNetDefinition={mutatePetriNetDefinition} |
| 168 | + readonly={false} |
| 169 | + setTitle={setTitle} |
| 170 | + title={currentNet.title} |
| 171 | + /> |
| 172 | + </div> |
| 173 | + ); |
| 174 | +}; |
0 commit comments