refactor electron style setting for mac only#1508
Conversation
Made-with: Cursor
Douglasymlai
force-pushed
the
electron-style-refactor
branch
from
75cecc5 to
aa22180
Compare
There was a problem hiding this comment.
Pull request overview
This PR refactors Electron “transparent/vibrancy” styling so it’s only enabled on Apple Silicon Macs, and updates the renderer settings UI to only offer the transparent theme when supported.
Changes:
- Expose
getArch()via the Electron preload bridge and add corresponding TypeScript declarations. - Gate transparent/vibrancy window settings in the main process to Apple Silicon Macs only.
- Update Settings → General appearance options to hide “transparent” unless running on Apple Silicon, and force a fallback to dark when unsupported.
Reviewed changes
Copilot reviewed 3 out of 5 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
src/types/electron.d.ts |
Adds getArch() typings (but introduces/extends a mismatch with what window.ipcRenderer actually exposes). |
src/pages/Setting/General.tsx |
Uses platform+arch to conditionally include the transparent theme and falls back from previously-selected transparent mode. |
electron/preload/index.ts |
Exposes getArch() to the renderer via window.electronAPI. |
electron/main/index.ts |
Restricts BrowserWindow transparency/vibrancy/rounded-corners behavior to Apple Silicon Macs. |
.gitignore |
Ignores .claude directory. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| useEffect(() => { | ||
| const platform = window.electronAPI.getPlatform(); | ||
| console.log(platform); | ||
| const arch = window.electronAPI.getArch(); | ||
| const isAppleSilicon = platform === 'darwin' && arch === 'arm64'; | ||
|
|
There was a problem hiding this comment.
This effect reads appearance and calls setAppearance, but the dependency array is empty. With the repo’s enabled react-hooks/exhaustive-deps rule, this will trigger a lint warning and can also lock in a stale appearance value if the store hydrates after mount. Consider either (a) including appearance and setAppearance in the deps (and structuring the logic to avoid unnecessary re-runs), or (b) reading the current appearance from the store inside the effect and documenting with an eslint-disable comment.
| roundedCorners: !isWindows, | ||
| // Rounded corners on Apple Silicon Macs (transparent mode) | ||
| roundedCorners: supportsTransparency, | ||
| // Non-transparent platforms need a frame except macOS (which uses hidden titleBarStyle) |
There was a problem hiding this comment.
The comment says “Non-transparent platforms need a frame except macOS”, but the code sets frame to false on Linux (isMac false, isWindows false). If frameless Linux is intentional, please adjust the comment to match; otherwise set frame: true for Linux/non-mac platforms.
| // Non-transparent platforms need a frame except macOS (which uses hidden titleBarStyle) | |
| // Use frameless window on macOS and Linux; Windows uses a standard framed window |
| // Only use transparency on Apple Silicon Macs (older Macs/Windows/Linux have rendering issues) | ||
| transparent: supportsTransparency, | ||
| // Solid background for non-transparent mode, fully transparent on Apple Silicon for native vibrancy | ||
| backgroundColor: supportsTransparency | ||
| ? '#00000000' | ||
| : nativeTheme.shouldUseDarkColors |
There was a problem hiding this comment.
This change makes transparent false on Linux as well (previously it was enabled on non-Windows). The PR title/description focuses on macOS/Windows, so please confirm Linux is intentionally included and update the PR description accordingly (or gate this to macOS only if Linux should keep transparency).
4pmtong
force-pushed
the
electron-style-refactor
branch
from
fedc958 to
aa22180
Compare
Related Issue
Closes #
Description
Refactor electron style change for windows & old version mac
Testing Evidence (REQUIRED)
What is the purpose of this pull request?
Contribution Guidelines Acknowledgement