Update version to 2.9.6, add overwriteAtom, and fix ImageFormatSelect button

renderer/atoms/userSettingsAtom.ts

@@ -26,3 +26,5 @@ export const noImageProcessingAtom = atomWithStorage<boolean>(
 );
 
 export const compressionAtom = atomWithStorage<number>("compression", 0);
+
+export const overwriteAtom = atomWithStorage("overwrite", false);

renderer/components/settings-tab/ImageFormatSelect.tsx

@@ -51,14 +51,12 @@ export function ImageFormatSelect({
             disabled={noImageProcessing}>
             JPG
           </button>
-          {/* WEBP
+          {/* WEBP */}
           <button
-            className={`btn ${
-              saveImageAs === "webp" && "btn-primary"
-            }`}
+            className={`btn ${saveImageAs === "webp" && "btn-primary"}`}
             onClick={() => setExportType("webp")}>
             WEBP
-          </button> */}
+          </button>
         </div>
       </div>
     </div>

renderer/components/settings-tab/OverwriteToggle.tsx

@@ -1,21 +1,9 @@
+import { overwriteAtom } from "@/atoms/userSettingsAtom";
+import { useAtom } from "jotai";
 import React, { useEffect } from "react";
 
-type OverwriteToggleProps = {
-  overwrite: boolean;
-  setOverwrite: (arg: any) => void;
-};
-
-const OverwriteToggle = ({ overwrite, setOverwrite }: OverwriteToggleProps) => {
-  useEffect(() => {
-    if (!localStorage.getItem("overwrite")) {
-      localStorage.setItem("overwrite", JSON.stringify(overwrite));
-    } else {
-      const currentlySavedOverwrite = localStorage.getItem("overwrite");
-      if (currentlySavedOverwrite) {
-        setOverwrite(currentlySavedOverwrite === "true");
-      }
-    }
-  }, []);
+const OverwriteToggle = () => {
+  const [overwrite, setOverwrite] = useAtom(overwriteAtom);
 
   return (
     <div className="flex flex-col gap-2">

renderer/components/settings-tab/index.tsx

@@ -12,6 +12,7 @@ import { useAtom, useAtomValue } from "jotai";
 import {
   customModelsPathAtom,
   noImageProcessingAtom,
+  overwriteAtom,
   scaleAtom,
 } from "../../atoms/userSettingsAtom";
 import { modelsListAtom } from "../../atoms/modelsListAtom";
@@ -33,8 +34,6 @@ interface IProps {
   gpuId: string;
   setGpuId: React.Dispatch<React.SetStateAction<string>>;
   logData: string[];
-  overwrite: boolean;
-  setOverwrite: (arg: any) => void;
   os: "linux" | "mac" | "win" | undefined;
   show: boolean;
   setShow: React.Dispatch<React.SetStateAction<boolean>>;
@@ -51,8 +50,6 @@ function SettingsTab({
   saveImageAs,
   setSaveImageAs,
   logData,
-  overwrite,
-  setOverwrite,
   os,
   show,
   setShow,
@@ -219,7 +216,7 @@ function SettingsTab({
         setRememberOutputFolder={setRememberOutputFolder}
       />
 
-      <OverwriteToggle overwrite={overwrite} setOverwrite={setOverwrite} />
+      <OverwriteToggle />
 
       {/* GPU ID INPUT */}
       <GpuIdInput gpuId={gpuId} handleGpuIdChange={handleGpuIdChange} />

renderer/pages/index.tsx

@@ -19,6 +19,7 @@ import {
   dontShowCloudModalAtom,
   noImageProcessingAtom,
   outputPathAtom,
+  overwriteAtom,
   progressAtom,
   scaleAtom,
 } from "../atoms/userSettingsAtom";
@@ -45,7 +46,7 @@ const Home = () => {
   const [version, setVersion] = useState("");
   const [batchFolderPath, setBatchFolderPath] = useState("");
   const [doubleUpscayl, setDoubleUpscayl] = useState(false);
-  const [overwrite, setOverwrite] = useState(false);
+  const overwrite = useAtomValue(overwriteAtom);
   const [upscaledBatchFolderPath, setUpscaledBatchFolderPath] = useState("");
   const [doubleUpscaylCounter, setDoubleUpscaylCounter] = useState(0);
   const [gpuId, setGpuId] = useState("");
@@ -262,15 +263,6 @@ const Home = () => {
   useEffect(() => {
     const rememberOutputFolder = localStorage.getItem("rememberOutputFolder");
     const lastOutputFolderPath = localStorage.getItem("lastOutputFolderPath");
-    // GET OVERWRITE
-    if (!localStorage.getItem("overwrite")) {
-      localStorage.setItem("overwrite", JSON.stringify(overwrite));
-    } else {
-      const currentlySavedOverwrite = localStorage.getItem("overwrite");
-      if (currentlySavedOverwrite) {
-        setOverwrite(currentlySavedOverwrite === "true");
-      }
-    }
     if (rememberOutputFolder === "true") {
       logit("🧠 Recalling Output Folder: ", lastOutputFolderPath);
       setOutputPath(lastOutputFolderPath);
@@ -584,8 +576,6 @@ const Home = () => {
             saveImageAs={saveImageAs}
             setSaveImageAs={setSaveImageAs}
             logData={logData}
-            overwrite={overwrite}
-            setOverwrite={setOverwrite}
             os={os}
             show={showCloudModal}
             setShow={setShowCloudModal}