fix: can use under window blur

Signed-off-by: Innei <i@innei.in>

src/main/window.ts

@@ -80,12 +80,6 @@ export function createWindow(
     ...configs,
   })
 
-  window.webContents.executeJavaScript(
-    `((() => { globalThis.FEATURES = globalThis.FEATURES || []; globalThis.FEATURES['WINDOW_UNDER_BLUR'] = ${
-      !!baseWindowConfig.backgroundMaterial || !!baseWindowConfig.vibrancy
-    } })())`,
-  )
-
   function refreshBound(timeout = 0) {
     setTimeout(() => {
       const mainWindow = getMainWindow()

src/preload/index.d.ts

@@ -3,7 +3,7 @@ import type { ElectronAPI } from "@electron-toolkit/preload"
 declare global {
   interface Window {
     electron?: ElectronAPI
-    api: unknown
+    api?: { canWindowBlur: boolean }
     platform: NodeJS.Platform
   }
 }

src/preload/index.ts

@@ -1,8 +1,22 @@
+import os from "node:os"
+import { platform } from "node:process"
+
 import { electronAPI } from "@electron-toolkit/preload"
 import { contextBridge } from "electron"
 
+export const isMacOS = platform === "darwin"
+
+export const isWindows = platform === "win32"
+
+export const isLinux = platform === "linux"
+export const isWindows11 = isWindows && os.version().startsWith("Windows 11")
+
 // Custom APIs for renderer
-const api = {}
+const api = {
+  canWindowBlur:
+    process.platform === "darwin" ||
+    (process.platform === "win32" && isWindows11),
+}
 
 // Use `contextBridge` APIs to expose Electron APIs to
 // renderer only if context isolation is enabled, otherwise

src/renderer/src/components/ui/background/WindowUnderBlur.tsx

@@ -1,5 +1,6 @@
 import { useUISettingKey } from "@renderer/atoms/settings/ui"
 import { cn } from "@renderer/lib/utils"
+import { SYSTEM_CAN_UNDER_BLUR_WINDOW } from "@shared/constants"
 
 type Props = Component<
   React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>
@@ -21,7 +22,7 @@ const Win32Material: Props = ({ className, children, ...rest }) => (
     {children}
   </div>
 )
-export const WindowUnderBlur: Props = FEATURES.WINDOW_UNDER_BLUR ?
+export const WindowUnderBlur: Props = SYSTEM_CAN_UNDER_BLUR_WINDOW ?
     (props) => {
       const opaqueSidebar = useUISettingKey("opaqueSidebar")
       if (opaqueSidebar) {

src/renderer/src/modules/entry-column/layouts/EntryListHeader.tsx

@@ -222,6 +222,8 @@ const SwitchToMasonryButton = () => {
 const AppendTaildingDivider = ({ children }: { children: React.ReactNode }) => (
   <>
     {children}
-    {React.Children.count(children) > 1 && (<DividerVertical className="mx-2 w-px" />)}
+    {React.Children.toArray(children).filter(Boolean).length > 0 && (
+      <DividerVertical className="mx-2 w-px" />
+    )}
   </>
 )

src/shared/src/constants.ts

@@ -5,3 +5,7 @@ export const DEEPLINK_SCHEME = `${APP_PROTOCOL}://`
 
 // export const WEB_URL = import.meta.env.VITE_VERCEL_URL ?? import.meta.env.VITE_WEB_URL
 export const WEB_URL = env.VITE_WEB_URL
+
+export const SYSTEM_CAN_UNDER_BLUR_WINDOW = globalThis?.window?.electron ?
+  window.api?.canWindowBlur :
+  false

vite.config.ts

@@ -79,7 +79,6 @@ const vite = ({ mode }) => {
       process.env.ANALYZER && visualizer({ open: true }),
     ],
     define: {
-
       APP_VERSION: JSON.stringify(pkg.version),
       APP_NAME: JSON.stringify(pkg.name),
       APP_DEV_CWD: JSON.stringify(process.cwd()),
@@ -90,9 +89,6 @@ const vite = ({ mode }) => {
 
       DEBUG: process.env.DEBUG === "true",
       ELECTRON: "false",
-
-      // Proxy Electron Features
-      FEATURES: "{}",
     },
   })
 }
@@ -131,9 +127,9 @@ const devPrint = (): PluginOption => ({
     server.printUrls = () => {
       _printUrls()
       console.info(
-          `  ${green(
-            "➜",
-          )}  ${dim("Online debug")}: ${cyan("https://web.follow.is/__debug_proxy")}`,
+        `  ${green("➜")}  ${dim("Online debug")}: ${cyan(
+          "https://web.follow.is/__debug_proxy",
+        )}`,
       )
     }
   },