feat(windows): improve native Windows appearance and theme support (#1114)

Co-authored-by: Wendong-Fan <w3ndong.fan@gmail.com>
Co-authored-by: Wendong-Fan <133094783+Wendong-Fan@users.noreply.github.com>

Author: glowsenior

electron/main/index.ts

@@ -167,8 +167,13 @@ protocol.registerSchemesAsPrivileged([
 process.env.APP_ROOT = MAIN_DIST;
 process.env.VITE_PUBLIC = VITE_PUBLIC;
 
-// Disable system theme
-nativeTheme.themeSource = 'light';
+// Respect system theme on Windows, keep light theme on macOS for consistency
+const isWindows = process.platform === 'win32';
+if (isWindows) {
+  nativeTheme.themeSource = 'system'; // Respect Windows dark/light mode
+} else {
+  nativeTheme.themeSource = 'light'; // Keep existing behavior for macOS
+}
 
 // Set log level
 log.transports.console.level = 'info';
@@ -1281,22 +1286,37 @@ async function createWindow() {
     )}`
   );
 
+  // Platform-specific window configuration
+  // Windows: Use native frame for better native feel, solid background
+  // macOS: Use frameless with transparency and vibrancy effects
   win = new BrowserWindow({
     title: 'Eigent',
     width: 1200,
     height: 800,
     minWidth: 1050,
     minHeight: 650,
-    frame: false,
+    // Use native frame on Windows for better native integration
+    frame: isWindows ? true : false,
     show: false, // Don't show until content is ready to avoid white screen
-    transparent: true,
-    vibrancy: 'sidebar',
-    visualEffectState: 'active',
-    backgroundColor: '#f5f5f580',
+    // Only use transparency on macOS and Linux (not supported well on Windows)
+    transparent: !isWindows,
+    // macOS-only visual effects
+    vibrancy: isMac ? 'sidebar' : undefined,
+    visualEffectState: isMac ? 'active' : undefined,
+    // Solid background on Windows (respect dark/light mode), semi-transparent on macOS/Linux
+    backgroundColor: isWindows
+      ? (nativeTheme.shouldUseDarkColors ? '#1e1e1e' : '#ffffff')
+      : '#f5f5f580',
+    // macOS-specific title bar styling
     titleBarStyle: isMac ? 'hidden' : undefined,
     trafficLightPosition: isMac ? { x: 10, y: 10 } : undefined,
     icon: path.join(VITE_PUBLIC, 'favicon.ico'),
-    roundedCorners: true,
+    // Rounded corners on macOS and Linux (as original)
+    roundedCorners: !isWindows,
+    // Windows-specific options
+    ...(isWindows && {
+      autoHideMenuBar: true, // Hide menu bar on Windows for cleaner look
+    }),
     webPreferences: {
       // Use a dedicated partition for main window to isolate from webviews
       // This ensures main window's auth data (localStorage) is stored separately and persists across restarts

src/components/TopBar/index.tsx

@@ -368,7 +368,8 @@ function HeaderWin() {
 					</div>
 				)}
 			</div>
-			{platform !== "darwin" && (
+			{/* Custom window controls only for Linux (Windows and macOS use native controls) */}
+			{platform !== "darwin" && platform !== "win32" && (
 				<div
 					className="h-full flex items-center no-drag"
 					id="window-controls"

src/components/WindowControls/index.tsx

@@ -24,14 +24,17 @@ export default function WindowControls() {
 		const p = window.electronAPI.getPlatform();
 		setPlatform(p);
 
-		if (p === "darwin") {
+		// Hide custom controls on macOS (uses native traffic lights)
+		// and on Windows (now uses native frame with native controls)
+		if (p === "darwin" || p === "win32") {
 			if (controlsRef.current) {
 				controlsRef.current.style.display = "none";
 			}
 		}
 	}, []);
 
-	if (platform === "darwin") {
+	// Don't render custom controls on macOS or Windows (both use native controls)
+	if (platform === "darwin" || platform === "win32") {
 		return null;
 	}