cleanup

Author: charlesvien

apps/twig/src/renderer/components/KeyboardShortcutsSheet.tsx

@@ -5,6 +5,7 @@ import {
   getShortcutsByCategory,
   type ShortcutCategory,
 } from "@renderer/constants/keyboard-shortcuts";
+import { isMac } from "@utils/platform";
 import { useMemo } from "react";
 
 interface KeyboardShortcutsSheetProps {
@@ -134,8 +135,6 @@ export function KeyboardShortcutsList() {
 
 function SingleShortcutKeys({ keys }: { keys: string }) {
   const formatted = formatHotkey(keys);
-  const isMac =
-    typeof navigator !== "undefined" && /Mac/.test(navigator.platform);
 
   if (isMac) {
     return (

apps/twig/src/renderer/constants/keyboard-shortcuts.ts

@@ -1,3 +1,5 @@
+import { isMac } from "@utils/platform";
+
 export const SHORTCUTS = {
   COMMAND_MENU: "mod+k",
   NEW_TASK: "mod+n,mod+t",
@@ -189,9 +191,6 @@ export function getShortcutsByCategory(): Record<
 }
 
 export function formatHotkey(keys: string): string {
-  const isMac =
-    typeof navigator !== "undefined" && /Mac/.test(navigator.platform);
-
   // Get only the first hotkey if multiple are defined (e.g., "mod+1,mod+2,mod+3")
   // But handle edge case where comma is the actual key (e.g., "mod+,")
   let hotkey = keys;

apps/twig/src/renderer/features/command/components/CommandMenu.tsx

@@ -16,7 +16,7 @@ import { Flex, Text } from "@radix-ui/themes";
 import { track } from "@renderer/lib/analytics";
 import { useNavigationStore } from "@stores/navigationStore";
 import { useRegisteredFoldersStore } from "@stores/registeredFoldersStore";
-import { useThemeStore } from "@stores/themeStore";
+import { THEME_CYCLE_LABELS, useThemeStore } from "@stores/themeStore";
 import { useCallback, useEffect, useRef } from "react";
 import { useHotkeys } from "react-hotkeys-hook";
 import { ANALYTICS_EVENTS, type CommandMenuAction } from "@/types/analytics";
@@ -156,11 +156,7 @@ export function CommandMenu({ open, onOpenChange }: CommandMenuProps) {
                 {theme === "system" && (
                   <MoonIcon className="mr-3 h-3 w-3 text-gray-11" />
                 )}
-                <Text size="1">
-                  {theme === "dark" && "Switch to light mode"}
-                  {theme === "light" && "Switch to system theme"}
-                  {theme === "system" && "Switch to dark mode"}
-                </Text>
+                <Text size="1">{THEME_CYCLE_LABELS[theme]}</Text>
               </Command.Item>
               <Command.Item
                 value="Toggle left sidebar"

apps/twig/src/renderer/features/settings/components/sections/GeneralSettings.tsx

@@ -16,6 +16,7 @@ import {
 import { track } from "@renderer/lib/analytics";
 import { playCompletionSound } from "@renderer/lib/sounds";
 import { useSettingsStore as useTerminalSettingsStore } from "@stores/settingsStore";
+import { resolveIsDarkMode } from "@stores/themeStore";
 import type { ThemePreference } from "@stores/themeStore";
 import { useThemeStore } from "@stores/themeStore";
 import { useCallback, useEffect, useRef, useState } from "react";
@@ -112,7 +113,7 @@ export function GeneralSettings() {
         new_value: value,
         old_value: theme,
       });
-      if (value === "light" && cursorGlow) {
+      if (!resolveIsDarkMode(value) && cursorGlow) {
         setCursorGlow(false);
       }
       setTheme(value);

apps/twig/src/renderer/features/sidebar/components/ProjectSwitcher.tsx

@@ -29,6 +29,7 @@ import { trpcVanilla } from "@renderer/trpc/client";
 import { useQuery } from "@tanstack/react-query";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { getCloudUrlFromRegion } from "@/constants/oauth";
+import { isMac } from "@utils/platform";
 import "./ProjectSwitcher.css";
 
 export function ProjectSwitcher() {
@@ -276,7 +277,7 @@ export function ProjectSwitcher() {
                     <Flex align="center" justify="between" style={{ flex: 1 }}>
                       <Text size="1">Keyboard Shortcuts</Text>
                       <Text size="1" className="ml-4 text-gray-9">
-                        {navigator.platform.includes("Mac") ? "⌘/" : "Ctrl+/"}
+                        {isMac ? "⌘/" : "Ctrl+/"}
                       </Text>
                     </Flex>
                   </DropdownMenu.Item>
@@ -293,7 +294,7 @@ export function ProjectSwitcher() {
                   <Text size="1">Settings</Text>
                 </Flex>
                 <Text size="1" className="text-gray-9">
-                  {navigator.platform.includes("Mac") ? "⌘," : "Ctrl+,"}
+                  {isMac ? "⌘," : "Ctrl+,"}
                 </Text>
               </button>
 

apps/twig/src/renderer/features/terminal/services/TerminalManager.ts

@@ -3,6 +3,7 @@ import { FitAddon } from "@xterm/addon-fit";
 import { SerializeAddon } from "@xterm/addon-serialize";
 import { WebLinksAddon } from "@xterm/addon-web-links";
 import { Terminal as XTerm } from "@xterm/xterm";
+import { isMac } from "@utils/platform";
 import { logger } from "@/renderer/lib/logger";
 
 const log = logger.scope("terminal-manager");
@@ -111,7 +112,6 @@ function loadAddons(term: XTerm) {
 
 function attachKeyHandlers(term: XTerm) {
   term.attachCustomKeyEventHandler((event: KeyboardEvent) => {
-    const isMac = /Mac/.test(navigator.platform);
     const cmdOrCtrl = isMac ? event.metaKey : event.ctrlKey;
 
     if (event.key === "k" && cmdOrCtrl && event.type === "keydown") {

apps/twig/src/renderer/stores/themeStore.ts

@@ -17,7 +17,7 @@ type ThemeStore = ThemeStoreState & ThemeStoreActions;
 
 const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
 
-function resolveIsDarkMode(theme: ThemePreference): boolean {
+export function resolveIsDarkMode(theme: ThemePreference): boolean {
   if (theme === "system") {
     return mediaQuery.matches;
   }
@@ -26,6 +26,12 @@ function resolveIsDarkMode(theme: ThemePreference): boolean {
 
 const THEME_CYCLE: ThemePreference[] = ["dark", "light", "system"];
 
+export const THEME_CYCLE_LABELS: Record<ThemePreference, string> = {
+  dark: "Switch to light mode",
+  light: "Switch to system theme",
+  system: "Switch to dark mode",
+};
+
 export const useThemeStore = create<ThemeStore>()(
   persist(
     (set) => ({

apps/twig/src/renderer/utils/platform.ts

@@ -0,0 +1,2 @@
+export const isMac =
+  typeof navigator !== "undefined" && /Mac/.test(navigator.platform);