Merge pull request #26 from beebls/nightly

CSSLoader Desktop V1.2.0
DeckThemes · Mar 14, 2024 · cb0f56c · cb0f56c
2 parents 4f788c0 + d22aa09
commit cb0f56c
Show file tree

Hide file tree

Showing 15 changed files with 147 additions and 47 deletions.
diff --git a/ThemeTypes.ts b/ThemeTypes.ts
@@ -96,3 +96,7 @@ export interface StarredThemeList {
   total: number;
   items: PartialCSSThemeInfo[];
 }
+
+type ThemeErrorTitle = string;
+type ThemeErrorDescription = string;
+export type ThemeError = [ThemeErrorTitle, ThemeErrorDescription];
diff --git a/backend/pythonMethods/getLastLoadErrors.ts b/backend/pythonMethods/getLastLoadErrors.ts
@@ -0,0 +1,11 @@
+import { ThemeError } from "../../ThemeTypes";
+import { server } from "./server";
+export function getLastLoadErrors(): Promise<ThemeError[] | undefined> {
+  return server!
+    .callPluginMethod<{}, { fails: ThemeError[] }>("get_last_load_errors", {})
+    .then((data) => {
+      if (data.success) {
+        return data.result.fails;
+      }
+    });
+}
diff --git a/backend/pythonMethods/index.ts b/backend/pythonMethods/index.ts
@@ -14,3 +14,4 @@ export * from "./getBackendVersion";
 export * from "./generatePreset";
 export * from "./fetchThemePath";
 export * from "./generatePresetFromThemeNames";
+export * from "./getLastLoadErrors";
diff --git a/components/AppRoot.tsx b/components/AppRoot.tsx
@@ -42,7 +42,7 @@ export function AppRoot({ Component, pageProps }: AppProps) {
 
   return (
     // overflow-hidden rounded-b-lg
-    <div className="absolute top-0 left-0 right-0 bottom-0 overflow-hidden rounded-lg bg-base-6-dark">
+    <div className="absolute top-0 left-0 right-0 bottom-0 overflow-hidden bg-base-6-dark">
       <div className="relative top-8 overflow-hidden rounded-b-lg">
         <div
           ref={scrollableContainerRef}

diff --git a/components/ManageThemes/ThemeErrorsList.tsx b/components/ManageThemes/ThemeErrorsList.tsx
@@ -0,0 +1,24 @@
+import { themeContext } from "@contexts/themeContext";
+import { useContext } from "react";
+
+export function ThemeErrorsList() {
+  const { errors } = useContext(themeContext);
+  return (
+    <div className="flex w-full max-w-[960px] flex-col">
+      <h2 className="font-fancy mx-auto mb-4 w-full max-w-[960px] text-sm font-bold">Errors</h2>
+      <div className="flex flex-col gap-4">
+        {errors.map((e) => {
+          const [themeName, error] = e;
+          return (
+            <div className="w-full overflow-hidden rounded-xl border-2 border-borders-base1-dark transition hover:border-borders-base2-dark dark:bg-base-3-dark">
+              <div className="flex h-full w-full flex-col items-start bg-red-800/20 p-4 sm:flex-row sm:items-center sm:gap-4">
+                <span className="font-semibold">{themeName}</span>
+                <span>{error}</span>
+              </div>
+            </div>
+          );
+        })}
+      </div>
+    </div>
+  );
+}
diff --git a/components/Native/AppFrame.tsx b/components/Native/AppFrame.tsx
@@ -1,6 +1,16 @@
+import { osContext } from "@contexts/osContext";
+import { useContext } from "react";
+import { twMerge } from "tailwind-merge";
+
 export function AppFrame({ children }: { children: any }) {
+  const { maximized } = useContext(osContext);
   return (
-    <div className="cssloader-app-frame absolute inset-0 overflow-hidden rounded-lg border-x-[1px] border-b-[1px] border-[#2f2f2f]">
+    <div
+      className={twMerge(
+        "cssloader-app-frame absolute inset-0 overflow-hidden border-x-[1px] border-b-[1px] border-[#2f2f2f]",
+        maximized ? "rounded-none" : "rounded-lg"
+      )}
+    >
       {children}
     </div>
   );

diff --git a/components/Native/Titlebar.tsx b/components/Native/Titlebar.tsx
@@ -5,33 +5,26 @@ import {
   VscChromeMinimize,
   VscChromeRestore,
 } from "react-icons/vsc";
-import { useEffect, useState } from "react";
-import { useInterval } from "@hooks/useInterval";
+import { useContext } from "react";
 import Image from "next/image";
 import Link from "next/link";
 import * as Portal from "@radix-ui/react-portal";
+import { twMerge } from "tailwind-merge";
+import { osContext } from "@contexts/osContext";
 
 const Titlebar = () => {
-  const [maximized, setMaximized] = useState(false);
-  const [fullscreen, setFullscreen] = useState(false);
-
-  const tauriInterval = useInterval(() => {
-    appWindow.isMaximized().then(setMaximized);
-    appWindow.isFullscreen().then(setFullscreen);
-  }, 200);
-
-  useEffect(() => {
-    tauriInterval.start();
-    return tauriInterval.stop;
-  }, []);
+  const { fullscreen, maximized } = useContext(osContext);
 
   return (
     !fullscreen && (
       <>
         <Portal.Root style={{ pointerEvents: "all", cursor: "default" }}>
           <div
             data-tauri-drag-region
-            className="cssloader-titlebar fixed z-[2147483647] flex h-8 !cursor-default select-none flex-row overflow-hidden rounded-t-lg border-x-[1px] border-t-[1px] border-[#2f2f2f] bg-base-6-dark"
+            className={twMerge(
+              "cssloader-titlebar fixed z-[2147483647] flex h-8 !cursor-default select-none flex-row overflow-hidden border-x-[1px] border-t-[1px] border-[#2f2f2f] bg-base-6-dark",
+              maximized ? "rounded-t-none" : "rounded-t-lg"
+            )}
           >
             <div draggable={false} className="absolute top-0 left-0 flex h-full select-none">
               <Link

diff --git a/components/SingleTheme/ThemeToggle.tsx b/components/SingleTheme/ThemeToggle.tsx
@@ -126,7 +126,9 @@ export function ThemeToggle({
               }
               // Actually enabling the theme
               await setThemeState(data.name, switchValue);
-              await refreshThemes();
+
+              // Need to grab up to date data
+              const updatedThemes: Theme[] | undefined = await refreshThemes();
 
               // Dependency Toast
               if (data.dependencies.length > 0) {
@@ -153,24 +155,14 @@ export function ThemeToggle({
                 }
               }
 
-              if (!selectedPreset) return;
+              if (!selectedPreset || !updatedThemes) return;
               // This used to generate the new list of themes by the dependencies of the preset + or - the checked theme
               // However, since we added profiles, the list of enabled themes IS the list of dependencies, so this works
               await generatePresetFromThemeNames(
                 selectedPreset.name,
-                switchValue
-                  ? [
-                      ...themes
-                        .filter((e) => e.enabled && !e.flags.includes(Flags.isPreset))
-                        .map((e) => e.name),
-                      data.name,
-                    ]
-                  : themes
-                      .filter(
-                        (e) =>
-                          e.enabled && !e.flags.includes(Flags.isPreset) && e.name !== data.name
-                      )
-                      .map((e) => e.name)
+                updatedThemes
+                  .filter((e) => e.enabled && !e.flags.includes(Flags.isPreset))
+                  .map((e) => e.name)
               );
             }}
           />

diff --git a/contexts/osContext.ts b/contexts/osContext.ts
@@ -3,7 +3,11 @@ import { Dispatch, SetStateAction, createContext } from "react";
 export const osContext = createContext<{
   OS: string;
   isWindows: boolean;
+  maximized: boolean;
+  fullscreen: boolean;
 }>({
   OS: "",
   isWindows: false,
+  maximized: false,
+  fullscreen: false,
 });
diff --git a/contexts/themeContext.ts b/contexts/themeContext.ts
@@ -1,14 +1,18 @@
-import { Theme } from "ThemeTypes";
+import { Theme, ThemeError } from "ThemeTypes";
 import { createContext } from "react";
 
 export const themeContext = createContext<{
   themes: Theme[];
   setThemes: any;
   refreshThemes: any;
   selectedPreset: Theme | undefined;
+  errors: ThemeError[];
+  setErrors: any;
 }>({
   themes: [],
   setThemes: () => {},
   refreshThemes: () => {},
   selectedPreset: undefined,
+  errors: [],
+  setErrors: () => {},
 });
diff --git a/hooks/useVW.ts b/hooks/useVW.ts
@@ -1,6 +1,6 @@
-import { useState, useEffect } from "react";
+import { useState, useEffect, useSyncExternalStore } from "react";
 
-export function useVW() {
+export function useVW2() {
   const [vw, setVW] = useState(window.innerWidth);
 
   useEffect(() => {
@@ -23,3 +23,26 @@ export function useVW() {
 
   return vw;
 }
+
+function subscribe(callback: any) {
+  let timeoutId: NodeJS.Timeout;
+
+  function handleResize() {
+    clearTimeout(timeoutId);
+    timeoutId = setTimeout(() => {
+      callback();
+    }, 100);
+  }
+
+  window.addEventListener("resize", handleResize);
+  return () => window.removeEventListener("resize", handleResize);
+}
+function getSnapshot() {
+  return window.innerWidth;
+}
+
+export function useVW() {
+  const vw = useSyncExternalStore(subscribe, getSnapshot);
+  console.log(vw);
+  return vw;
+}
diff --git a/latest.json b/latest.json
@@ -1,15 +1,15 @@
 {
   "version": "1.1.0",
-  "notes": "Check Github for the release notes!",
-  "pub_date": "2023-09-19T00:25:37.723Z",
+  "notes": "Download the release for your platform below",
+  "pub_date": "2024-03-14T23:21:39.028Z",
   "platforms": {
     "linux-x86_64": {
-      "signature": "dW50cnVzdGVkIGNvbW1lbnQ6IHNpZ25hdHVyZSBmcm9tIHRhdXJpIHNlY3JldCBrZXkKUlVUR25UdTJ0dzN1MWwxN1djOHJJTkU3Q3RhMVRnTEdzb2JrV29yNThrbGVoZEsyRDFoaExDak0vSHB5YjUzUjk2eVkycHhJcUh5VHhzU3BpT1dyQmd6MTJSendxL3R0M0FNPQp0cnVzdGVkIGNvbW1lbnQ6IHRpbWVzdGFtcDoxNjk1MDgzMTI1CWZpbGU6Y3NzLWxvYWRlci1kZXNrdG9wXzEuMS4wX2FtZDY0LkFwcEltYWdlLnRhci5negpkb2FMTzJuS0FkclFtV2xtWVpKQVBCcGlwWDhjSVdKVm42dTRTOTVScmlSNFZYaHArU21XWG5iVy9KQkJWbEVuS0JIUVFTZW44em5UdmdrZlorNlhEdz09Cg==",
-      "url": "https://github.com/beebls/CSSLoader-Desktop/releases/download/v1.1.0/CSSLoader.Desktop_1.1.0.AppImage.tar.gz"
+      "signature": "dW50cnVzdGVkIGNvbW1lbnQ6IHNpZ25hdHVyZSBmcm9tIHRhdXJpIHNlY3JldCBrZXkKUlVUR25UdTJ0dzN1MWhlS1ZPUzUxNlI4NHQreGk4dEZEMDIxWXRkTkJNYXhrSjZZOTlNemIyeGxiem5iWmVFZG9ZN3JpY0NoSFU5TEJnTFJ0NFFPci9aV0NWVXhYdGFOcGdjPQp0cnVzdGVkIGNvbW1lbnQ6IHRpbWVzdGFtcDoxNzEwNDU4MzAwCWZpbGU6Y3NzLWxvYWRlci1kZXNrdG9wXzEuMS4wX2FtZDY0LkFwcEltYWdlLnRhci5negpRNnFKL2JJQjNDTFJOL1pTWUVnVHpESWE5RzNjdTB2c2lSdG5ma2RWVTB1Rm4wMDFIaWdndktILzNvd1pKemJmdnFzY2g0M29rekFGRzU3WEg3VzBCQT09Cg==",
+      "url": "https://github.com/beebls/CSSLoader-Desktop/releases/latest/download/CSSLoader.Desktop_.AppImage.tar.gz"
     },
     "windows-x86_64": {
-      "signature": "dW50cnVzdGVkIGNvbW1lbnQ6IHNpZ25hdHVyZSBmcm9tIHRhdXJpIHNlY3JldCBrZXkKUlVUR25UdTJ0dzN1MW1BdlRpNVhsQlo0bDZyZmpRTm4zdjZQSHpYU2VlbnJWdkFWaWNMRW41N3dVVnFJNEJrUjRjdTlSanhyVWd3Ly9rdlEzMzc4OWd5UWNIa3V0VEZ1SUF3PQp0cnVzdGVkIGNvbW1lbnQ6IHRpbWVzdGFtcDoxNjk1MDgzMTMzCWZpbGU6Q1NTTG9hZGVyIERlc2t0b3BfMS4xLjBfeDY0X2VuLVVTLm1zaS56aXAKNDE5TE9rV0wzU3h0OUhXQVRDOExZQkVmeXVxaUdpSnQ2cENmc1Jzb05iaUpEVFZvN2FEVkJqS2dMR1pFQi9CUzdpOEp3WmpyakxXNU5lVlNxVU9LRFE9PQo=",
-      "url": "https://github.com/beebls/CSSLoader-Desktop/releases/download/v1.1.0/CSSLoader.Desktop_1.1.0.msi.zip"
+      "signature": "dW50cnVzdGVkIGNvbW1lbnQ6IHNpZ25hdHVyZSBmcm9tIHRhdXJpIHNlY3JldCBrZXkKUlVUR25UdTJ0dzN1MXUzcmhCUHZSUitHdmpjeG4xeU0wdkxoZXZGRFVCVkR4YWFDOEZUR3BvNFlyTjB0RFRxS01ndkFhdkxnRGN2VGZaYUdSd09RaTcvcUo5ZnNOamFudFFjPQp0cnVzdGVkIGNvbW1lbnQ6IHRpbWVzdGFtcDoxNzEwNDU4NDk2CWZpbGU6Q1NTTG9hZGVyIERlc2t0b3BfMS4xLjBfeDY0X2VuLVVTLm1zaS56aXAKOEI2U1A5eW1NL2RHN2JPc0pZeGFicnhsOGZScEQ5SHFmZ1B6N1k5NjExbXZLTzZYVFdoRnZLeS9mSDlDNTFQRDhFOWV3aVdQbFpXUHlBSis2b3BwREE9PQo=",
+      "url": "https://github.com/beebls/CSSLoader-Desktop/releases/latest/download/CSSLoader.Desktop_.msi.zip"
     }
   }
 }
diff --git a/pages/_app.tsx b/pages/_app.tsx
@@ -1,6 +1,6 @@
 import "../styles/globals.css";
 import type { AppProps } from "next/app";
-import { Flags, Theme } from "../ThemeTypes";
+import { Flags, Theme, ThemeError } from "../ThemeTypes";
 import { useState, useEffect, useMemo, use } from "react";
 import "react-toastify/dist/ReactToastify.css";
 import {
@@ -14,6 +14,7 @@ import {
   getInstalledThemes,
   getOS,
   generatePresetFromThemeNames,
+  getLastLoadErrors,
   changePreset,
   getBackendVersion,
 } from "../backend";
@@ -28,6 +29,7 @@ import { useBasicAsyncEffect } from "@hooks/useBasicAsyncEffect";
 
 export default function App(AppProps: AppProps) {
   const [themes, setThemes] = useState<Theme[]>([]);
+  const [errors, setErrors] = useState<ThemeError[]>([]);
   // This is now undefined before the initial check, that way things can use dummyResult !== undefined to see if the app has properly loaded
   const [dummyResult, setDummyResult] = useState<boolean | undefined>(undefined);
   const [backendExists, setBackendExists] = useState<boolean>(false);
@@ -36,17 +38,36 @@ export default function App(AppProps: AppProps) {
   const [backendManifestVersion, setManifestVersion] = useState<number>(8);
   const [OS, setOS] = useState<string>("");
   const isWindows = useMemo(() => OS === "win32", [OS]);
+  const [maximized, setMaximized] = useState<boolean>(false);
+  const [fullscreen, setFullscreen] = useState<boolean>(false);
 
   const selectedPreset = useMemo(
     () => themes.find((e) => e.flags.includes(Flags.isPreset) && e.enabled),
     [themes]
   );
 
   useEffect(() => {
+    let unsubscribeToWindowChanges: () => void;
+
+    async function subscribeToWindowChanges() {
+      // why did you use a ssr framework in an app
+      const { appWindow } = await import("@tauri-apps/api/window");
+      unsubscribeToWindowChanges = await appWindow.onResized(() => {
+        appWindow.isMaximized().then(setMaximized);
+        appWindow.isFullscreen().then(setFullscreen);
+      });
+    }
+
+    subscribeToWindowChanges();
+
     // This sets OS and isWindows, which some other initializing logic then runs based on that result
     getOS().then(setOS);
     // This actually initializes the themes and such
     recheckDummy();
+
+    return () => {
+      unsubscribeToWindowChanges && unsubscribeToWindowChanges();
+    };
   }, []);
 
   useBasicAsyncEffect(async () => {
@@ -86,7 +107,7 @@ export default function App(AppProps: AppProps) {
     }
   }
 
-  async function refreshThemes(reset: boolean = false) {
+  async function refreshThemes(reset: boolean = false): Promise<Theme[] | undefined> {
     if (isWindows) await refreshBackendExists();
     await dummyFuncTest();
     const backendVer = await getBackendVersion();
@@ -98,10 +119,19 @@ export default function App(AppProps: AppProps) {
     if (data) {
       setThemes(data.sort());
     }
+    const errors = await getLastLoadErrors();
+    if (errors) {
+      setErrors(errors);
+    }
+
+    // Returning themes for preset thingy thingy
+    return data?.sort();
   }
 
   return (
-    <themeContext.Provider value={{ themes, setThemes, refreshThemes, selectedPreset }}>
+    <themeContext.Provider
+      value={{ themes, setThemes, errors, setErrors, refreshThemes, selectedPreset }}
+    >
       <backendStatusContext.Provider
         value={{
           dummyResult,
@@ -114,7 +144,7 @@ export default function App(AppProps: AppProps) {
           backendManifestVersion,
         }}
       >
-        <osContext.Provider value={{ OS, isWindows }}>
+        <osContext.Provider value={{ OS, isWindows, maximized, fullscreen }}>
           <FontContext>
             <AppFrame>
               <DynamicTitleBar />

diff --git a/pages/manage-themes.tsx b/pages/manage-themes.tsx
@@ -5,6 +5,7 @@ import { deleteTheme, downloadThemeFromUrl, toast } from "../backend";
 import { bulkThemeUpdateCheck } from "../logic";
 import { ManageThemeCard, YourProfilesList } from "../components";
 import { BiFolderOpen } from "react-icons/bi";
+import { ThemeErrorsList } from "@components/ManageThemes/ThemeErrorsList";
 
 export type LocalThemeStatus = "installed" | "outdated" | "local";
 
@@ -37,7 +38,7 @@ export default function ManageThemes() {
   }, [localThemeList]);
 
   return (
-    <main className="flex flex-1 flex-col items-center gap-8 px-4">
+    <main className="flex flex-1 flex-col items-center gap-8 px-4 pb-4">
       <div className="mt-6 w-full max-w-[960px]">
         <h2 className="font-fancy mb-4 text-lg font-bold">Theme Directory</h2>
         <button
@@ -74,6 +75,7 @@ export default function ManageThemes() {
         </div>
       </div>
       <YourProfilesList {...{ updateStatuses, uninstalling, handleUninstall, handleUpdate }} />
+      <ThemeErrorsList />
     </main>
   );
 }
diff --git a/src-tauri/tauri.conf.json b/src-tauri/tauri.conf.json
@@ -175,7 +175,9 @@
     "updater": {
       "active": true,
       "dialog": true,
-      "endpoints": ["https://raw.githubusercontent.com/beebls/CSSLoader-Desktop/main/latest.json"],
+      "endpoints": [
+        "https://raw.githubusercontent.com/DeckThemes/CSSLoader-Desktop/main/latest.json"
+      ],
       "pubkey": "dW50cnVzdGVkIGNvbW1lbnQ6IG1pbmlzaWduIHB1YmxpYyBrZXk6IEQ2RUUwREI3QjYzQjlEQzYKUldUR25UdTJ0dzN1MWdPaVZGbGhaWitmNUJKNkNQRUphd0tOdmR6MzNyMHQ3SHorNDcyRTNqS2MK"
     },
     "windows": [