feat(desktop): settings + theme + command palette + better preview states#3
Closed
feat(desktop): settings + theme + command palette + better preview states#3
Conversation
- IconButton: compact square button for toolbar/topbar use, with focus ring and disabled state aligned to existing Button. - Tooltip: pure-CSS tooltip with 400ms hover delay (no JS, no Radix). - Tokens: add --color-toast-success, --color-toast-error, --color-overlay for both light and dark palettes. Tier 1 only: no Radix, no animation libs. Signed-off-by: Haoqing Wang <haoqing@users.noreply.github.com>
…ates Reshape the renderer so the app feels like a real product even before any AI call succeeds. All Tier 1, no new prod deps. Added: - TopBar with breadcrumb + 3 icon-buttons (palette / theme / settings), using the macOS hiddenInset drag region. - Settings overlay with 4 tabs: Models (stub), Appearance (theme picker), Storage (config file path), Advanced (placeholder). - CommandPalette overlay (Cmd+K) with 4 actions: New Design, Toggle Theme, Open Settings, Export (stub). - ThemeToggle: persists to localStorage; index.html bootstraps the `.dark` class inline before React mounts to avoid FOUC. - ToastViewport (Zustand-backed, auto-dismiss 4s, stack bottom-right) surfacing generation success and errors. - PreviewPane with three explicit states: EmptyState (chips populate the prompt input), LoadingState (CSS shimmer), ErrorState (Retry + Copy Error card). - useKeyboard hook: central keymap registry on plain addEventListener. Cmd+Enter sends, Cmd+, opens Settings, Cmd+K opens palette, Esc closes overlays. - Sidebar extracted from App.tsx; App.tsx is now a slim composition. Store gains: theme, settingsOpen, commandPaletteOpen, toasts, lastError, plus retryLastPrompt + clearError. No silent fallbacks: every error path pushes a toast and surfaces in ErrorState. All UI uses var(--color-*) tokens; no hex literals; no new hardcoded px sizes added. Signed-off-by: Haoqing Wang <haoqing@users.noreply.github.com>
Collaborator
Author
|
Superseded by v2 (clean cherry-pick on top of latest main). See 3-v2 PR. |
3 tasks
hqhq1025
added a commit
that referenced
this pull request
Apr 22, 2026
…opencode banner) Three round-4 items closed at once — they all touch the import UX but are small, so one commit keeps the diff readable: 1. (#3) parseDotEnv malformed-line warnings. The old parser silently dropped `GEMINI_API_KEY value` (space instead of `=`) with zero signal. Split into parseDotEnvLines (returns {vars, skipped}) + parseDotEnv (thin wrapper preserving the old signature). In readGeminiCliConfig, scan each file's skipped lines for anything that LOOKS like a GEMINI_API_KEY declaration but is missing `=` and surface a targeted warning — works even when the key eventually resolves from shell env, so the user knows their .env line is broken. 2. (#4) detectChatgptSubscription test coverage. Export the function and accept an optional `authPath` test-seam param. Four tests cover: chatgpt auth_mode → true, other auth_mode → false, ENOENT → false (silent), malformed JSON → false (loud, goes through the new logger call from the prior commit). 3. (#5) opencode banner shows provider names, not just a count. Before: "OpenCode config detected — import 4 providers?" left the user guessing WHICH four. Now: "OpenCode detected — import 4 providers (OpenCode · Anthropic, OpenCode · OpenAI, OpenCode · Google +1 more)?". Providers ride along in the banner state as `providerLabels: string[]`. No functional regression; 779 → 787 desktop tests (+8). Signed-off-by: hqhq1025 <1506751656@qq.com>
6 tasks
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Reshapes the renderer so the app feels like a real product before any AI call returns. Strictly Tier 1 — no Radix, no react-hotkeys, no react-toastify, no framer-motion, no new prod deps. CSS animations and
addEventListeneronly.UX improvements
wt/onboarding), Appearance (light/dark theme picker), Storage (shows~/.config/open-codesign/config.toml), Advanced (placeholder).Cmd+Kopens; 4 actions (New Design, Toggle Theme, Open Settings, Export — Export is a stub toast); arrow-key + Enter navigation.<script>inindex.htmlapplies the.darkclass before React mounts to avoid FOUC.Cmd/Ctrl+Entersends prompt,Cmd+,opens Settings,Cmd+Kopens palette,Esccloses overlays. All wired through a singleuseKeyboardregistry.App.tsx;App.tsxis now a thin composition of TopBar + Sidebar + PreviewPane + overlays.IconButtonand pure-CSSTooltip(400ms hover delay viatransition-delay) inpackages/ui.--color-toast-success,--color-toast-error,--color-overlayfor both light and dark palettes.Compliance
lucide-react(already a dep) is used for new icons.pnpm -r typecheck.pnpm lint(Biome).pnpm -r testgreen.apps/desktop/src/main/**,preload/index.ts,renderer/src/onboarding/**, or any package owned by other worktrees.Test plan
pnpm install && pnpm -r typecheck && pnpm lint && pnpm -r testgreenpnpm --filter @open-codesign/desktop devbootsCmd+,opens Settings;Cmd+Kopens palette;Cmd+EntersubmitsuseCodesignStore.setState({ errorMessage: 'boom' })shows ErrorState with Retry + Copy