Fixed save for diagrams

src/components/ControlPanel.jsx

@@ -666,7 +666,20 @@ export default function ControlPanel({ diagramId, setDiagramId }) {
     del();
   };
   const save = () => {
-    db.diagrams.add({
+    if (diagramId === 0) {
+      db.diagrams
+        .add({
+          name: title,
+          lastModified: new Date(),
+          tables: tables,
+          references: relationships,
+          types: types,
+          notes: notes,
+          areas: areas,
+        })
+        .then((id) => setDiagramId(id));
+    } else {
+      db.diagrams.update(diagramId, {
         name: title,
         lastModified: new Date(),
         tables: tables,
@@ -675,6 +688,7 @@ export default function ControlPanel({ diagramId, setDiagramId }) {
         notes: notes,
         areas: areas,
       });
+    }
   };
   const open = () => setVisible(MODAL.OPEN);
   const saveDiagramAs = () => setVisible(MODAL.SAVEAS);
@@ -1091,7 +1105,7 @@ export default function ControlPanel({ diagramId, setDiagramId }) {
       case MODAL.IMPORT:
         return "Import diagram";
       case MODAL.CODE:
-        return "Export diagram";
+        return "Export source";
       case MODAL.IMG:
         return "Export image";
       case MODAL.RENAME:

src/pages/shortcuts.jsx

@@ -5,6 +5,13 @@ import { AutoComplete, Button } from "@douyinfe/semi-ui";
 import { IconSearch, IconSun, IconMoon } from "@douyinfe/semi-icons";
 
 const shortcuts = [
+  { shortcut: "CTRL+S", title: "Save diagram", description: "" },
+  { shortcut: "CTRL+Shift+S", title: "Save diagram as", description: "" },
+  {
+    shortcut: "CTRL+O",
+    title: "Open a diagram",
+    description: "Load a saved diagram",
+  },
   { shortcut: "CTRL+C", title: "Copy selected element", description: "" },
   { shortcut: "CTRL+V", title: "Paste selected element", description: "" },
   { shortcut: "CTRL+X", title: "Cut selected element", description: "" },
@@ -180,6 +187,14 @@ export default function Shortcuts() {
           </div>
         ))}
       </div>
+      <hr
+        className={`${
+          theme === "dark" ? "border-zinc-700" : "border-zinc-300"
+        } my-1`}
+      />
+      <div className="text-center text-sm py-3">
+        &copy; 2024 <strong>drawDB</strong> - All right reserved.
+      </div>
     </>
   );
 }