Merge pull request #493 from VictoriaShyika/276-autosave

473: Added autosave to Jumpstart
weareunderdesign · Dec 7, 2023 · 0132af5 · 0132af5
2 parents 6bcf530 + 847b02f
commit 0132af5
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 1 deletion.
diff --git a/src/_ref/cmdk.ref/Jumpstart.csv b/src/_ref/cmdk.ref/Jumpstart.csv
@@ -4,4 +4,5 @@ Open,folder,Open a folder,o,Projects
 Guide,help,Learn something,g,Help
 Support,person,Get some help,,Help
 Community,people,Talk with people,,Help
-Theme,,Switch themes,m,Settings
+Theme,,Switch themes,m,Settings
+Autosave,,Switch autosave,,Settings
diff --git a/src/pages/main/MainPage.tsx b/src/pages/main/MainPage.tsx
@@ -804,6 +804,9 @@ export default function MainPage() {
       case "Turn into":
         onTurnInto();
         break;
+      case "Autosave":
+        onToggleAutoSave();
+        break;
       default:
         return;
     }
@@ -1174,6 +1177,11 @@ export default function MainPage() {
     }
   }, [theme]);
 
+  const [autoSave, setAutoSave] = useState(false);
+  const onToggleAutoSave = () => {
+    setAutoSave(!autoSave);
+  };
+
   // web-tab close event handler
   useEffect(() => {
     let changed = false;
@@ -1539,6 +1547,7 @@ export default function MainPage() {
 
                                 // keep modal open when toogling theme or go "Add" menu from "Actions" menu
                                 command.Name !== "Theme" &&
+                                  command.Name !== "Autosave" &&
                                   command.Name !== "Add" &&
                                   command.Name !== "Turn into" &&
                                   dispatch(setCmdkOpen(false));
@@ -1617,6 +1626,23 @@ export default function MainPage() {
                                         <span className="text-m">{theme}</span>
                                       </div>
                                     </>
+                                  ) : command.Name === "Autosave" ? (
+                                    <>
+                                      <div className="padding-xs">
+                                        <div className="radius-m icon-xs align-center background-tertiary"></div>
+                                      </div>
+                                      <div className="gap-s align-center">
+                                        <span className="text-m opacity-m">
+                                          Autosave
+                                        </span>
+                                        <span className="text-s opacity-m">
+                                          /
+                                        </span>
+                                        <span className="text-m">
+                                          {autoSave ? "On" : "Off"}
+                                        </span>
+                                      </div>
+                                    </>
                                   ) : (
                                     <>
                                       <div className="padding-xs">