fix: fixing stale state

src/main/events/index.ts

@@ -88,6 +88,7 @@ import "./themes/get-active-custom-theme";
 import "./themes/css-injector";
 import "./themes/close-editor-window";
 import "./themes/import-theme";
+import "./themes/toggle-custom-theme";
 import { isPortableVersion } from "@main/helpers";
 
 ipcMain.handle("ping", () => "pong");

src/main/events/themes/add-custom-theme.ts

@@ -1,12 +1,12 @@
 import { Theme } from "@types";
-import { themes } from "@main/level/sublevels/themes";
 import { registerEvent } from "../register-event";
+import { themesSublevel } from "@main/level";
 
 const addCustomTheme = async (
   _event: Electron.IpcMainInvokeEvent,
   theme: Theme
 ) => {
-  await themes.put(theme.id, theme);
+  await themesSublevel.put(theme.id, theme);
 };
 
 registerEvent("addCustomTheme", addCustomTheme);

src/main/events/themes/deeplink.ts

@@ -1,38 +0,0 @@
-// import { themes } from "@main/level/sublevels/themes";
-// import { WindowManager } from "@main/services";
-// import { Theme } from "@types";
-
-// export const handleDeepLinkTheme = async (
-//   themeName: string,
-//   authorCode: string
-// ) => {
-//   const theme: Theme = {
-//     id: crypto.randomUUID(),
-//     name: themeName,
-//     isActive: false,
-//     author: authorCode,
-//     authorName: "spectre",
-//     code: `https://hydrathemes.shop/themes/${themeName}.css`,
-//     createdAt: new Date(),
-//     updatedAt: new Date(),
-//   };
-
-//   await themes.put(theme.id, theme);
-
-//   const allThemes = await themes.values().all();
-//   const activeTheme = allThemes.find((theme: Theme) => theme.isActive);
-
-//   if (activeTheme) {
-//     await themes.put(activeTheme.id, {
-//       ...activeTheme,
-//       isActive: false,
-//     });
-//   }
-
-//   WindowManager.mainWindow?.webContents.send("css-injected", theme.code);
-
-//   await themes.put(theme.id, {
-//     ...theme,
-//     isActive: true,
-//   });
-// };

src/main/events/themes/delete-all-custom-themes.ts

@@ -1,9 +1,8 @@
-import { themes } from "@main/level/sublevels/themes";
+import { themesSublevel } from "@main/level";
 import { registerEvent } from "../register-event";
 
 const deleteAllCustomThemes = async (_event: Electron.IpcMainInvokeEvent) => {
-  console.log("sexo2");
+  await themesSublevel.clear();
-  await themes.clear();
 };
 
 registerEvent("deleteAllCustomThemes", deleteAllCustomThemes);

src/main/events/themes/delete-custom-theme.ts

@@ -1,11 +1,11 @@
-import { themes } from "@main/level/sublevels/themes";
+import { themesSublevel } from "@main/level";
 import { registerEvent } from "../register-event";
 
 const deleteCustomTheme = async (
   _event: Electron.IpcMainInvokeEvent,
   themeId: string
 ) => {
-  await themes.del(themeId);
+  await themesSublevel.del(themeId);
 };
 
 registerEvent("deleteCustomTheme", deleteCustomTheme);

src/main/events/themes/get-active-custom-theme.ts

@@ -1,10 +1,9 @@
+import { themesSublevel } from "@main/level";
 import { registerEvent } from "../register-event";
-import { themes } from "@main/level/sublevels/themes";
-import { Theme } from "@types";
 
 const getActiveCustomTheme = async () => {
-  const allThemes = await themes.values().all();
+  const allThemes = await themesSublevel.values().all();
-  return allThemes.find((theme: Theme) => theme.isActive);
+  return allThemes.find((theme) => theme.isActive);
 };
 
 registerEvent("getActiveCustomTheme", getActiveCustomTheme);

src/main/events/themes/get-all-custom-themes.ts

@@ -1,8 +1,8 @@
-import { themes } from "@main/level/sublevels/themes";
+import { themesSublevel } from "@main/level";
 import { registerEvent } from "../register-event";
 
 const getAllCustomThemes = async (_event: Electron.IpcMainInvokeEvent) => {
-  return await themes.values().all();
+  return themesSublevel.values().all();
 };
 
 registerEvent("getAllCustomThemes", getAllCustomThemes);

src/main/events/themes/get-custom-theme-by-id.ts

@@ -1,11 +1,11 @@
-import { themes } from "@main/level/sublevels/themes";
+import { themesSublevel } from "@main/level";
 import { registerEvent } from "../register-event";
 
 const getCustomThemeById = async (
   _event: Electron.IpcMainInvokeEvent,
   themeId: string
 ) => {
-  return await themes.get(themeId);
+  return themesSublevel.get(themeId);
 };
 
 registerEvent("getCustomThemeById", getCustomThemeById);

src/main/events/themes/update-custom-theme.ts

@@ -1,13 +1,22 @@
-import { themes } from "@main/level/sublevels/themes";
+import { themesSublevel } from "@main/level";
 import { registerEvent } from "../register-event";
-import { Theme } from "@types";
 
 const updateCustomTheme = async (
   _event: Electron.IpcMainInvokeEvent,
   themeId: string,
-  theme: Theme
+  code: string
 ) => {
-  await themes.put(themeId, theme);
+  const theme = await themesSublevel.get(themeId);
+
+  if (!theme) {
+    throw new Error("Theme not found");
+  }
+
+  await themesSublevel.put(themeId, {
+    ...theme,
+    code,
+    updatedAt: new Date(),
+  });
 };
 
 registerEvent("updateCustomTheme", updateCustomTheme);

src/main/level/sublevels/index.ts

@@ -3,3 +3,4 @@ export * from "./games";
 export * from "./game-shop-cache";
 export * from "./game-achievements";
 export * from "./keys";
+export * from "./themes";

src/main/level/sublevels/themes.ts

@@ -2,6 +2,6 @@ import type { Theme } from "@types";
 import { db } from "../level";
 import { levelKeys } from "./keys";
 
-export const themes = db.sublevel<string, Theme>(levelKeys.themes, {
+export const themesSublevel = db.sublevel<string, Theme>(levelKeys.themes, {
   valueEncoding: "json",
 });

src/preload/index.ts

@@ -355,11 +355,13 @@ contextBridge.exposeInMainWorld("electron", {
   deleteAllCustomThemes: () => ipcRenderer.invoke("deleteAllCustomThemes"),
   deleteCustomTheme: (themeId: string) =>
     ipcRenderer.invoke("deleteCustomTheme", themeId),
-  updateCustomTheme: (themeId: string, theme: Theme) =>
+  updateCustomTheme: (themeId: string, code: string) =>
-    ipcRenderer.invoke("updateCustomTheme", themeId, theme),
+    ipcRenderer.invoke("updateCustomTheme", themeId, code),
   getCustomThemeById: (themeId: string) =>
     ipcRenderer.invoke("getCustomThemeById", themeId),
   getActiveCustomTheme: () => ipcRenderer.invoke("getActiveCustomTheme"),
+  toggleCustomTheme: (themeId: string, isActive: boolean) =>
+    ipcRenderer.invoke("toggleCustomTheme", themeId, isActive),
   onImportTheme: (cb: (theme: string, author: string) => void) => {
     const listener = (
       _event: Electron.IpcRendererEvent,

src/renderer/src/declaration.d.ts

@@ -286,9 +286,10 @@ declare global {
     getAllCustomThemes: () => Promise<Theme[]>;
     deleteAllCustomThemes: () => Promise<void>;
     deleteCustomTheme: (themeId: string) => Promise<void>;
-    updateCustomTheme: (themeId: string, theme: Theme) => Promise<void>;
+    updateCustomTheme: (themeId: string, code: string) => Promise<void>;
     getCustomThemeById: (themeId: string) => Promise<Theme | null>;
     getActiveCustomTheme: () => Promise<Theme | null>;
+    toggleCustomTheme: (themeId: string, isActive: boolean) => Promise<void>;
     onImportTheme: (
       cb: (theme: string, author: string) => void
     ) => () => Electron.IpcRenderer;

src/renderer/src/hooks/use-feature.ts

@@ -1,4 +1,4 @@
-import { useEffect } from "react";
+import { useEffect, useState } from "react";
 
 enum Feature {
   CheckDownloadWritePermission = "CHECK_DOWNLOAD_WRITE_PERMISSION",
@@ -6,14 +6,21 @@ enum Feature {
 }
 
 export function useFeature() {
+  const [features, setFeatures] = useState<string[] | null>(null);
+
   useEffect(() => {
     window.electron.getFeatures().then((features) => {
       localStorage.setItem("features", JSON.stringify(features || []));
+      setFeatures(features || []);
     });
   }, []);
 
   const isFeatureEnabled = (feature: Feature) => {
+    if (!features) {
       const features = JSON.parse(localStorage.getItem("features") ?? "[]");
+      return features.includes(feature);
+    }
+
     return features.includes(feature);
   };
 

src/renderer/src/pages/settings/aparence/components/theme-card.tsx

@@ -29,20 +29,14 @@ export const ThemeCard = ({ theme, onListUpdated }: ThemeCardProps) => {
 
       if (activeTheme) {
         removeCustomCss();
-        await window.electron.updateCustomTheme(activeTheme.id, {
+        await window.electron.toggleCustomTheme(activeTheme.id, false);
-          ...activeTheme,
-          isActive: false,
-        });
       }
 
       if (currentTheme.code) {
         injectCustomCss(currentTheme.code);
       }
 
-      await window.electron.updateCustomTheme(currentTheme.id, {
+      await window.electron.toggleCustomTheme(currentTheme.id, true);
-        ...currentTheme,
-        isActive: true,
-      });
 
       onListUpdated();
     } catch (error) {
@@ -53,10 +47,7 @@ export const ThemeCard = ({ theme, onListUpdated }: ThemeCardProps) => {
   const handleUnsetTheme = async () => {
     try {
       removeCustomCss();
-      await window.electron.updateCustomTheme(theme.id, {
+      await window.electron.toggleCustomTheme(theme.id, false);
-        ...theme,
-        isActive: false,
-      });
 
       onListUpdated();
     } catch (error) {

src/renderer/src/pages/settings/aparence/modals/import-theme-modal.tsx

@@ -47,20 +47,14 @@ export const ImportThemeModal = ({
 
       if (activeTheme) {
         removeCustomCss();
-        await window.electron.updateCustomTheme(activeTheme.id, {
+        await window.electron.toggleCustomTheme(activeTheme.id, false);
-          ...activeTheme,
-          isActive: false,
-        });
       }
 
       if (currentTheme.code) {
         injectCustomCss(currentTheme.code);
       }
 
-      await window.electron.updateCustomTheme(currentTheme.id, {
+      await window.electron.toggleCustomTheme(currentTheme.id, true);
-        ...currentTheme,
-        isActive: true,
-      });
       onThemeImported();
       showSuccessToast(t("theme_imported"));
       onClose();

src/renderer/src/pages/theme-editor/theme-editor.tsx

@@ -31,13 +31,7 @@ export default function ThemeEditor() {
 
   const handleSave = useCallback(async () => {
     if (theme) {
-      const updatedTheme = {
+      await window.electron.updateCustomTheme(theme.id, code);
-        ...theme,
-        code: code,
-        updatedAt: new Date(),
-      };
-
-      await window.electron.updateCustomTheme(theme.id, updatedTheme);
       setHasUnsavedChanges(false);
 
       if (theme.isActive) {