Prevent creating duplicates when loading from gist

src/components/EditorHeader/Modal/Modal.jsx

@@ -388,7 +388,9 @@ export default function Modal({
           ((modal === MODAL.IMG || modal === MODAL.CODE) && !exportData.data) ||
           (modal === MODAL.SAVEAS && saveAsTitle === "") ||
           (modal === MODAL.IMPORT_SRC && importSource.src === ""),
+        hidden: modal === MODAL.SHARE,
       }}
+      hasCancel={modal !== MODAL.SHARE}
       cancelText={t("cancel")}
       width={getModalWidth(modal)}
       bodyStyle={{

src/components/EditorHeader/Modal/Share.jsx

@@ -9,6 +9,7 @@ import {
   useDiagram,
   useEnums,
   useNotes,
+  useTransform,
   useTypes,
 } from "../../../hooks";
 import { databases } from "../../../data/databases";
@@ -22,6 +23,7 @@ export default function Share({ title }) {
   const { areas } = useAreas();
   const { types } = useTypes();
   const { enums } = useEnums();
+  const { transform } = useTransform();
 
   const userToken = localStorage.getItem("github_token");
   const octokit = useMemo(() => {
@@ -44,8 +46,19 @@ export default function Share({ title }) {
       ...(databases[database].hasTypes && { types: types }),
       ...(databases[database].hasEnums && { enums: enums }),
       title: title,
+      transform: transform,
     });
-  }, [areas, notes, tables, relationships, database, title, enums, types]);
+  }, [
+    areas,
+    notes,
+    tables,
+    relationships,
+    database,
+    title,
+    enums,
+    types,
+    transform,
+  ]);
 
   const updateGist = useCallback(async () => {
     setLoading(true);

src/components/Workspace.jsx

@@ -37,6 +37,7 @@ export const IdContext = createContext({ gistId: "" });
 export default function WorkSpace() {
   const [id, setId] = useState(0);
   const [gistId, setGistId] = useState("");
+  const [loadedFromGistId, setLoadedFromGistId] = useState("");
   const [title, setTitle] = useState("Untitled Diagram");
   const [resize, setResize] = useState(false);
   const [width, setWidth] = useState(340);
@@ -98,6 +99,7 @@ export default function WorkSpace() {
             todos: tasks,
             pan: transform.pan,
             zoom: transform.zoom,
+            loadedFromGistId: loadedFromGistId,
             ...(databases[database].hasEnums && { enums: enums }),
             ...(databases[database].hasTypes && { types: types }),
           })
@@ -121,6 +123,7 @@ export default function WorkSpace() {
             gistId: gistId ?? "",
             pan: transform.pan,
             zoom: transform.zoom,
+            loadedFromGistId: loadedFromGistId,
             ...(databases[database].hasEnums && { enums: enums }),
             ...(databases[database].hasTypes && { types: types }),
           })
@@ -166,6 +169,7 @@ export default function WorkSpace() {
     database,
     enums,
     gistId,
+    loadedFromGistId,
   ]);
 
   const load = useCallback(async () => {
@@ -182,6 +186,7 @@ export default function WorkSpace() {
             }
             setId(d.id);
             setGistId(d.gistId);
+            setLoadedFromGistId(d.loadedFromGistId);
             setTitle(d.name);
             setTables(d.tables);
             setRelationships(d.references);
@@ -218,6 +223,7 @@ export default function WorkSpace() {
             }
             setId(diagram.id);
             setGistId(diagram.gistId);
+            setLoadedFromGistId(diagram.loadedFromGistId);
             setTitle(diagram.name);
             setTables(diagram.tables);
             setRelationships(diagram.references);
@@ -323,6 +329,13 @@ export default function WorkSpace() {
 
   const loadFromGist = useCallback(
     async (shareId) => {
+      const d = await db.diagrams.get({ loadedFromGistId: shareId });
+      if (d) {
+        window.name = "d " + d.id;
+      } else {
+        window.name = "";
+      }
+
       try {
         const res = await octokit.request(`GET /gists/${shareId}`, {
           gist_id: shareId,
@@ -332,14 +345,16 @@ export default function WorkSpace() {
         });
         const diagramSrc = res.data.files["share.json"].content;
         const d = JSON.parse(diagramSrc);
-        console.log(d);
-        window.name = "";
+        setUndoStack([]);
+        setRedoStack([]);
+        setLoadedFromGistId(shareId);
         setDatabase(d.database);
         setTitle(d.title);
         setTables(d.tables);
         setRelationships(d.relationships);
         setNotes(d.notes);
         setAreas(d.subjectAreas);
+        setTransform(d.transform);
         if (databases[d.database].hasTypes) {
           setTypes(d.types ?? []);
         }
@@ -359,6 +374,9 @@ export default function WorkSpace() {
       setRelationships,
       setTables,
       setTypes,
+      setTransform,
+      setRedoStack,
+      setUndoStack,
     ],
   );
 

src/data/db.js

@@ -3,8 +3,8 @@ import { templateSeeds } from "./seeds";
 
 export const db = new Dexie("drawDB");
 
-db.version(5).stores({
-  diagrams: "++id, lastModified",
+db.version(6).stores({
+  diagrams: "++id, lastModified, &loadedFromGistId",
   templates: "++id, custom",
 });