Handle template loading better

src/components/ControlPanel.jsx

@@ -702,8 +702,8 @@ export default function ControlPanel({
       });
   };
   const createNewDiagram = (id) => {
-    localStorage.setItem("args", `${id}`);
+    const newWindow = window.open("/editor");
-    window.open("/editor", "_blank");
+    newWindow.name = "lt " + id;
   };
 
   const menu = {

src/pages/Templates.jsx

@@ -171,6 +171,10 @@ export default function Templates() {
     await db.templates.delete(id);
   };
 
+  const editTemplate = (id) => {
+    console.log(id);
+  };
+
   useEffect(() => {
     document.title = "Templates | drawDB";
   }, []);
@@ -253,7 +257,10 @@ export default function Templates() {
                         </div>
                       </div>
                       <div className="flex justify-around mt-2">
-                        <button className="w-full text-center flex justify-center items-center border rounded px-2 py-1 bg-white hover:bg-gray-200 transition-all duration-300 text-blue-500">
+                        <button
+                          className="w-full text-center flex justify-center items-center border rounded px-2 py-1 bg-white hover:bg-gray-200 transition-all duration-300 text-blue-500"
+                          onClick={() => editTemplate(c.id)}
+                        >
                           <i className="bi bi-pencil-fill"></i>
                           <div className="ms-1.5 font-semibold">Edit</div>
                         </button>

src/pages/editor.jsx

@@ -578,20 +578,27 @@ export default function Editor() {
         });
     };
 
-    const args = localStorage.getItem("args");
+    if (window.name == "") {
-    if (!args || args === "-1") {
+      console.log("Loading the latest diagram");
-      if (window.name === "") {
+      loadLatestDiagram();
-        console.log("Loading the latest diagram");
-        loadLatestDiagram();
-      } else {
-        const did = parseInt(window.name.split(" ")[1]);
-        loadDiagram(did);
-      }
     } else {
-      console.log("Loading template with id", args);
+      const name = window.name.split(" ");
-      localStorage.setItem("args", "-1");
+      const op = name[0];
+      const did = parseInt(name[1]);
+      switch (op) {
+        case "d": {
+          loadDiagram(did);
+          break;
+        }
+        case "lt": {
+          console.log("Loading template with id", did);
+          break;
+        }
+        default:
+          break;
+      }
     }
-
+    
     socket.connect();
 
     const onConnect = () => {