feat: PawWork brand chrome icon set v2 (issue #181 slice 3)#191
Conversation
There was a problem hiding this comment.
Code Review
This pull request standardizes icon usage across the application by replacing various custom SVG components and the SkillIcon component with a unified Icon component. It also updates icon naming conventions, refines the skill selection view layout to a three-column grid, and updates several i18n strings for better clarity. The review feedback highlights the use of hardcoded hex colors in the skill metadata, suggesting a shift toward Tailwind classes or semantic tokens to maintain consistency with the project's design system.
|
Warning Rate limit exceeded
Your organization is not enrolled in usage-based pricing. Contact your admin to enable usage-based pricing to continue reviews beyond the rate limit, or try again in 0 minutes and 12 seconds. ⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: Organization UI Review profile: ASSERTIVE Plan: Pro Plus Run ID: 📒 Files selected for processing (9)
📝 WalkthroughWalkthroughConsolidates local SVG icon implementations into a shared Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Possibly related issues
Possibly related PRs
Suggested labels
Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Comment |
There was a problem hiding this comment.
Actionable comments posted: 2
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
packages/app/src/pages/session/session-side-panel.tsx (1)
320-332:⚠️ Potential issue | 🟠 MajorUse
sidePanelTab()for shell active state (notactiveTab()).Line 320 and Line 331 compare against inner review/file tab state, so shell icon activation becomes incorrect (notably Terminal). Use shell tab state instead.
Proposed fix
- <RightPanelShellIcon icon={tab.icon} active={activeTab() === tab.value} /> + <RightPanelShellIcon icon={tab.icon} active={sidePanelTab() === tab.value} /> ... - <RightPanelShellIcon icon={tab.icon} active={activeTab() === tab.value} /> + <RightPanelShellIcon icon={tab.icon} active={sidePanelTab() === tab.value} />🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/app/src/pages/session/session-side-panel.tsx` around lines 320 - 332, The ShellTab/SortableShellTab children use activeTab() to decide icon state but should use the shell-specific state sidePanelTab(); update the active check passed to RightPanelShellIcon in both occurrences (inside ShellTab and inside SortableShellTab) to compare against sidePanelTab() instead of activeTab(), so the icon active prop reflects the side panel's selected tab (look for RightPanelShellIcon, ShellTab, SortableShellTab, activeTab(), and sidePanelTab() to apply the change); keep the onClose handler (view().sidePanel.closeTab) as-is.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@packages/app/src/components/session/pawwork-skill-meta.ts`:
- Around line 24-25: The metadata currently uses an inline style via the
homeIconStyle property; change it to use a Tailwind text color class instead by
removing the inline homeIconStyle and setting homeIconClass to a standard class
such as "text-violet-500" (or your chosen accent token) in the pawwork skill
metadata. Update any consumer code that reads homeIconStyle (e.g., icon
rendering in session components) to prefer homeIconClass for styling so
metadata-driven styling is consistent across components; ensure no other parts
still rely on homeIconStyle.
In `@packages/app/src/pages/layout/pawwork-sidebar.tsx`:
- Line 139: The Icon component is being used with names "pin" and "workspace"
that aren't registered in the icon registry; add definitions for these icons to
the UI icon registry (the icons map/registration in the Icon component module)
similar to the existing "review-active", "terminal-active", and "open-file"
entries. Define SVG paths (or import the SVGs) and register them under the keys
"pin" and "workspace" so <Icon name="pin" /> and <Icon name="workspace" />
resolve correctly; ensure the registration uses the same function/shape as the
existing icons to preserve size/props handling.
---
Outside diff comments:
In `@packages/app/src/pages/session/session-side-panel.tsx`:
- Around line 320-332: The ShellTab/SortableShellTab children use activeTab() to
decide icon state but should use the shell-specific state sidePanelTab(); update
the active check passed to RightPanelShellIcon in both occurrences (inside
ShellTab and inside SortableShellTab) to compare against sidePanelTab() instead
of activeTab(), so the icon active prop reflects the side panel's selected tab
(look for RightPanelShellIcon, ShellTab, SortableShellTab, activeTab(), and
sidePanelTab() to apply the change); keep the onClose handler
(view().sidePanel.closeTab) as-is.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: ASSERTIVE
Plan: Pro Plus
Run ID: eda624d9-801c-4702-bc63-9fd4294b1d1c
📒 Files selected for processing (8)
packages/app/src/components/prompt-input/workspace-chip.tsxpackages/app/src/components/session/pawwork-skill-meta.tspackages/app/src/components/session/session-new-view.tsxpackages/app/src/components/session/skill-icons.tsxpackages/app/src/i18n/en.tspackages/app/src/pages/layout/pawwork-sidebar.tsxpackages/app/src/pages/session/session-side-panel.tsxpackages/ui/src/components/icon.tsx
💤 Files with no reviewable changes (1)
- packages/app/src/components/session/skill-icons.tsx
📜 Review details
🧰 Additional context used
📓 Path-based instructions (1)
packages/app/**/*.{ts,tsx,js,jsx}
📄 CodeRabbit inference engine (packages/app/AGENTS.md)
Always prefer
createStoreover multiplecreateSignalcalls in SolidJS
Files:
packages/app/src/pages/layout/pawwork-sidebar.tsxpackages/app/src/components/session/session-new-view.tsxpackages/app/src/i18n/en.tspackages/app/src/components/session/pawwork-skill-meta.tspackages/app/src/pages/session/session-side-panel.tsxpackages/app/src/components/prompt-input/workspace-chip.tsx
🧠 Learnings (6)
📓 Common learnings
Learnt from: Astro-Han
Repo: Astro-Han/pawwork PR: 126
File: packages/ui/src/theme/context.tsx:11-16
Timestamp: 2026-04-22T09:32:52.535Z
Learning: In Astro-Han/pawwork (`packages/ui/src/theme/context.tsx` and related files), the renaming of localStorage theme keys from `opencode-*` to `pawwork-*` (THEME_ID, COLOR_SCHEME, THEME_CSS_LIGHT, THEME_CSS_DARK) is intentional and should NOT include a migration path from the old keys. Migrating would re-couple PawWork and OpenCode browser storage namespaces, which the PR is explicitly designed to avoid. A reset to the PawWork default theme on upgrade is acceptable by design.
Learnt from: Astro-Han
Repo: Astro-Han/pawwork PR: 180
File: packages/app/src/components/session/pawwork-skill-meta.ts:0-0
Timestamp: 2026-04-23T07:23:12.091Z
Learning: In Astro-Han/pawwork, when a design token does not yet exist for a specific accent/brand color (e.g., violet), the project preference is to use a standard Tailwind color class (e.g., `text-violet-500`) rather than introducing a new semantic token. This applies to `homeIconClass` values in `packages/app/src/components/session/pawwork-skill-meta.ts` and similar UI metadata files.
📚 Learning: 2026-04-22T09:32:52.535Z
Learnt from: Astro-Han
Repo: Astro-Han/pawwork PR: 126
File: packages/ui/src/theme/context.tsx:11-16
Timestamp: 2026-04-22T09:32:52.535Z
Learning: In Astro-Han/pawwork (`packages/ui/src/theme/context.tsx` and related files), the renaming of localStorage theme keys from `opencode-*` to `pawwork-*` (THEME_ID, COLOR_SCHEME, THEME_CSS_LIGHT, THEME_CSS_DARK) is intentional and should NOT include a migration path from the old keys. Migrating would re-couple PawWork and OpenCode browser storage namespaces, which the PR is explicitly designed to avoid. A reset to the PawWork default theme on upgrade is acceptable by design.
Applied to files:
packages/app/src/pages/layout/pawwork-sidebar.tsxpackages/app/src/components/session/pawwork-skill-meta.tspackages/app/src/components/prompt-input/workspace-chip.tsx
📚 Learning: 2026-04-23T07:23:12.091Z
Learnt from: Astro-Han
Repo: Astro-Han/pawwork PR: 180
File: packages/app/src/components/session/pawwork-skill-meta.ts:0-0
Timestamp: 2026-04-23T07:23:12.091Z
Learning: In Astro-Han/pawwork, when a design token does not yet exist for a specific accent/brand color (e.g., violet), the project preference is to use a standard Tailwind color class (e.g., `text-violet-500`) rather than introducing a new semantic token. This applies to `homeIconClass` values in `packages/app/src/components/session/pawwork-skill-meta.ts` and similar UI metadata files.
Applied to files:
packages/app/src/pages/layout/pawwork-sidebar.tsxpackages/app/src/components/session/session-new-view.tsxpackages/app/src/components/prompt-input/workspace-chip.tsx
📚 Learning: 2026-04-23T07:23:23.849Z
Learnt from: Astro-Han
Repo: Astro-Han/pawwork PR: 180
File: packages/app/src/components/session/session-new-view.tsx:13-18
Timestamp: 2026-04-23T07:23:23.849Z
Learning: In pawwork (Astro-Han/pawwork), prefer using `createStore` instead of multiple `createSignal` calls only when the signals represent **coupled** object state that is updated together (i.e., there is at least one shared batch-update site where the state is changed in the same transaction). If the state fields are **independent** and are mutated by separate handlers (e.g., one handler updates only `selectedSkill` while another updates only `mode`), keep them as individual `createSignal` calls—using `createStore` for truly independent fields adds boilerplate without behavioral benefit.
Applied to files:
packages/app/src/pages/layout/pawwork-sidebar.tsxpackages/app/src/components/session/session-new-view.tsxpackages/app/src/i18n/en.tspackages/app/src/components/session/pawwork-skill-meta.tspackages/app/src/pages/session/session-side-panel.tsxpackages/app/src/components/prompt-input/workspace-chip.tsx
📚 Learning: 2026-04-22T05:24:42.404Z
Learnt from: Astro-Han
Repo: Astro-Han/pawwork PR: 98
File: packages/desktop-electron/src/main/menu-labels.ts:1-2
Timestamp: 2026-04-22T05:24:42.404Z
Learning: In Astro-Han/pawwork, the app i18n layer (`packages/app/src/i18n/`) only contains `en.ts` and `zh.ts`, and `normalizeLocale` (in `packages/app/src/context/language.tsx`) only returns `"en"` or `"zh"`. The desktop `MenuLocale = "en" | "zh"` union in `packages/desktop-electron/src/main/menu-labels.ts` is intentionally limited to these two locales and is not a broader restriction — do not flag it as overly restrictive or suggest adding other locales.
Applied to files:
packages/app/src/i18n/en.ts
📚 Learning: 2026-04-23T07:23:12.091Z
Learnt from: Astro-Han
Repo: Astro-Han/pawwork PR: 180
File: packages/app/src/components/session/pawwork-skill-meta.ts:0-0
Timestamp: 2026-04-23T07:23:12.091Z
Learning: In Astro-Han/pawwork UI metadata components (e.g., files under `packages/app/src/components/session/`), when a semantic/design token for a specific accent/brand color (such as `violet`) does not exist yet, use the corresponding standard Tailwind color utility/class (e.g., `text-violet-500`) rather than introducing a new semantic token. Apply this specifically to `homeIconClass` values and similar metadata fields that currently expect a Tailwind class string.
Applied to files:
packages/app/src/components/session/pawwork-skill-meta.ts
🔇 Additional comments (4)
packages/app/src/i18n/en.ts (1)
592-597: Copy update looks good.These label changes are consistent with the new-session UX wording and keep key usage intact.
packages/app/src/components/prompt-input/workspace-chip.tsx (1)
64-67: Nice migration to sharedIconusage.This removes local SVG duplication and keeps icon rendering consistent with the rest of the UI layer.
Also applies to: 94-95, 111-112
packages/app/src/pages/session/session-side-panel.tsx (1)
352-353: Open-file icon swap is correct.This aligns the menu item glyph with its action and fixes the prior semantic mismatch.
packages/app/src/components/session/session-new-view.tsx (1)
26-27: Grid + shared icon migration looks solid.The layout and icon rendering changes are consistent with the intended skill-pill polish and shared icon architecture.
Also applies to: 36-48
|
Placeholder for inline review |
Astro-Han
left a comment
There was a problem hiding this comment.
Icon set v2 review - see inline comments
Astro-Han
left a comment
There was a problem hiding this comment.
Detailed icon-set review with inline comments, sorted by priority.
Summary:
- 3x P1 (pin icon affordance, hardcoded hex color, leaked impl detail)
- 4x P2 (color downgrade, active-variant coupling, grid i18n, same-line entry)
- 3x P3 (blank lines, label clarity, implicit size change)
f014308 to
453fe08
Compare
There was a problem hiding this comment.
Actionable comments posted: 1
♻️ Duplicate comments (3)
packages/app/src/components/session/pawwork-skill-meta.ts (1)
14-17:⚠️ Potential issue | 🟠 MajorAvoid inline hex styling in skill metadata; use
homeIconClassinstead.Line 39 hardcodes a color via
homeIconStyle, which diverges from the established metadata pattern and makes theme/searchability harder.Suggested change
-// Writing accent (`#8B5FBF`) lives as inline style because Tailwind v4 is -// configured with `--color-*: initial`, so palette utilities like -// `text-violet-500` resolve to no CSS variable and render black. export const pawworkSkillCards: readonly PawworkSkillCard[] = [ @@ { name: "writing-assistant", iconName: "pencil-line", homeIcon: "pencil-line", - homeIconClass: "", - homeIconStyle: { color: "#8B5FBF" }, + homeIconClass: "text-violet-500", titleKey: "session.new.card.writing.title", descriptionKey: "session.new.card.writing.description", }, ]Based on learnings: in
packages/app/src/components/session/*metadata, when no semantic accent token exists, prefer a standard Tailwind class (e.g.,text-violet-500) over inline style fields.Also applies to: 38-40
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/app/src/components/session/pawwork-skill-meta.ts` around lines 14 - 17, The pawworkSkillCards metadata contains an inline hex color in the homeIconStyle field (violates pattern); update the affected PawworkSkillCard entries to remove homeIconStyle and instead set homeIconClass to a standard Tailwind utility (e.g., "text-violet-500") so the accent uses a class token consistent with other metadata; ensure you update all entries that currently use homeIconStyle (search for homeIconStyle in pawworkSkillCards) and keep the rest of each card object unchanged.packages/app/src/pages/layout/pawwork-sidebar.tsx (1)
134-139:⚠️ Potential issue | 🟡 MinorRestore a stronger pinned-state visual signal.
At Line 134 and Line 139, pinned rows now use a subtler color (
text-text-strong) with the same pin glyph, which weakens quick scanability in mixed lists. Consider restoring brand-accent color for pinned rows (or using a distinct pin variant).Suggested tweak
classList={{ "inline-flex size-6 items-center justify-center rounded transition-colors": true, - "text-text-strong opacity-100 pointer-events-auto": isPinned(), + "text-accent-brand opacity-100 pointer-events-auto": isPinned(), "text-text-weak opacity-0 pointer-events-none group-hover/session:opacity-100 group-hover/session:pointer-events-auto group-focus-within/session:opacity-100 group-focus-within/session:pointer-events-auto hover:text-text-base": !isPinned(), }}🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/app/src/pages/layout/pawwork-sidebar.tsx` around lines 134 - 139, The pinned-row visual is too subtle: in pawwork-sidebar.tsx the class conditional that uses isPinned() currently applies "text-text-strong" which reduces scanability; update the pinned state styling to use your brand accent color (e.g., replace "text-text-strong" with the project's accent token like "text-accent" or "text-brand-accent") or swap to a distinct pin glyph variant (change Icon name="pin" to a filled/solid variant such as "pin-filled" or similar) so pinned rows are visually stronger and immediately scannable; update the conditional around isPinned() and the Icon usage accordingly.packages/app/src/components/session/session-new-view.tsx (1)
26-26:⚠️ Potential issue | 🟡 MinorMake the skill-pill grid degrade more safely on narrow widths.
At Line 26,
w-fitwithsm:grid-cols-3can still produce cramped/overflow behavior near small breakpoints and with longer localized labels.Suggested responsive fallback
-<div class="mt-8 grid w-fit max-w-[640px] grid-cols-1 gap-3 sm:grid-cols-3"> +<div class="mt-8 grid w-full max-w-[640px] grid-cols-1 gap-3 sm:grid-cols-2 md:grid-cols-3">🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/app/src/components/session/session-new-view.tsx` at line 26, The grid uses `w-fit` and `sm:grid-cols-3` which causes cramped/overflow at narrow breakpoints; update the wrapping div class in session-new-view.tsx to remove `w-fit`, use responsive columns like `grid-cols-1 sm:grid-cols-2 md:grid-cols-3` and keep `max-w-[640px]` so it can expand/contract smoothly, and ensure child pill elements (e.g., SkillPill) have `min-w-0` or `truncate` to prevent overflow; modify the div's class string and adjust the skill-pill component classes accordingly.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@packages/app/src/pages/session/session-side-panel.tsx`:
- Line 320: The shell icon active state is using the wrong selector
(activeTab()) causing incorrect highlighting; update the RightPanelShellIcon
usages (and any similar shell-icon components) to derive their active prop from
sidePanelTab() === tab.value instead of activeTab(), ensuring shell/tab icons
(e.g., Terminal, Review) reflect the shell-side-panel selection rather than file
sub-tab state.
---
Duplicate comments:
In `@packages/app/src/components/session/pawwork-skill-meta.ts`:
- Around line 14-17: The pawworkSkillCards metadata contains an inline hex color
in the homeIconStyle field (violates pattern); update the affected
PawworkSkillCard entries to remove homeIconStyle and instead set homeIconClass
to a standard Tailwind utility (e.g., "text-violet-500") so the accent uses a
class token consistent with other metadata; ensure you update all entries that
currently use homeIconStyle (search for homeIconStyle in pawworkSkillCards) and
keep the rest of each card object unchanged.
In `@packages/app/src/components/session/session-new-view.tsx`:
- Line 26: The grid uses `w-fit` and `sm:grid-cols-3` which causes
cramped/overflow at narrow breakpoints; update the wrapping div class in
session-new-view.tsx to remove `w-fit`, use responsive columns like `grid-cols-1
sm:grid-cols-2 md:grid-cols-3` and keep `max-w-[640px]` so it can
expand/contract smoothly, and ensure child pill elements (e.g., SkillPill) have
`min-w-0` or `truncate` to prevent overflow; modify the div's class string and
adjust the skill-pill component classes accordingly.
In `@packages/app/src/pages/layout/pawwork-sidebar.tsx`:
- Around line 134-139: The pinned-row visual is too subtle: in
pawwork-sidebar.tsx the class conditional that uses isPinned() currently applies
"text-text-strong" which reduces scanability; update the pinned state styling to
use your brand accent color (e.g., replace "text-text-strong" with the project's
accent token like "text-accent" or "text-brand-accent") or swap to a distinct
pin glyph variant (change Icon name="pin" to a filled/solid variant such as
"pin-filled" or similar) so pinned rows are visually stronger and immediately
scannable; update the conditional around isPinned() and the Icon usage
accordingly.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: ASSERTIVE
Plan: Pro Plus
Run ID: e029a5bd-7ec8-4142-b645-71e7c9e5b774
📒 Files selected for processing (8)
packages/app/src/components/prompt-input/workspace-chip.tsxpackages/app/src/components/session/pawwork-skill-meta.tspackages/app/src/components/session/session-new-view.tsxpackages/app/src/components/session/skill-icons.tsxpackages/app/src/i18n/en.tspackages/app/src/pages/layout/pawwork-sidebar.tsxpackages/app/src/pages/session/session-side-panel.tsxpackages/ui/src/components/icon.tsx
💤 Files with no reviewable changes (1)
- packages/app/src/components/session/skill-icons.tsx
📜 Review details
🧰 Additional context used
📓 Path-based instructions (1)
packages/app/**/*.{ts,tsx,js,jsx}
📄 CodeRabbit inference engine (packages/app/AGENTS.md)
Always prefer
createStoreover multiplecreateSignalcalls in SolidJS
Files:
packages/app/src/i18n/en.tspackages/app/src/pages/layout/pawwork-sidebar.tsxpackages/app/src/components/prompt-input/workspace-chip.tsxpackages/app/src/pages/session/session-side-panel.tsxpackages/app/src/components/session/session-new-view.tsxpackages/app/src/components/session/pawwork-skill-meta.ts
🧠 Learnings (8)
📓 Common learnings
Learnt from: Astro-Han
Repo: Astro-Han/pawwork PR: 126
File: packages/ui/src/theme/context.tsx:11-16
Timestamp: 2026-04-22T09:32:52.535Z
Learning: In Astro-Han/pawwork (`packages/ui/src/theme/context.tsx` and related files), the renaming of localStorage theme keys from `opencode-*` to `pawwork-*` (THEME_ID, COLOR_SCHEME, THEME_CSS_LIGHT, THEME_CSS_DARK) is intentional and should NOT include a migration path from the old keys. Migrating would re-couple PawWork and OpenCode browser storage namespaces, which the PR is explicitly designed to avoid. A reset to the PawWork default theme on upgrade is acceptable by design.
Learnt from: Astro-Han
Repo: Astro-Han/pawwork PR: 180
File: packages/app/src/components/session/pawwork-skill-meta.ts:0-0
Timestamp: 2026-04-23T07:23:12.091Z
Learning: In Astro-Han/pawwork, when a design token does not yet exist for a specific accent/brand color (e.g., violet), the project preference is to use a standard Tailwind color class (e.g., `text-violet-500`) rather than introducing a new semantic token. This applies to `homeIconClass` values in `packages/app/src/components/session/pawwork-skill-meta.ts` and similar UI metadata files.
📚 Learning: 2026-04-23T07:23:23.849Z
Learnt from: Astro-Han
Repo: Astro-Han/pawwork PR: 180
File: packages/app/src/components/session/session-new-view.tsx:13-18
Timestamp: 2026-04-23T07:23:23.849Z
Learning: In pawwork (Astro-Han/pawwork), prefer using `createStore` instead of multiple `createSignal` calls only when the signals represent **coupled** object state that is updated together (i.e., there is at least one shared batch-update site where the state is changed in the same transaction). If the state fields are **independent** and are mutated by separate handlers (e.g., one handler updates only `selectedSkill` while another updates only `mode`), keep them as individual `createSignal` calls—using `createStore` for truly independent fields adds boilerplate without behavioral benefit.
Applied to files:
packages/app/src/i18n/en.tspackages/app/src/pages/layout/pawwork-sidebar.tsxpackages/app/src/components/prompt-input/workspace-chip.tsxpackages/app/src/pages/session/session-side-panel.tsxpackages/app/src/components/session/session-new-view.tsxpackages/app/src/components/session/pawwork-skill-meta.ts
📚 Learning: 2026-04-22T09:32:52.535Z
Learnt from: Astro-Han
Repo: Astro-Han/pawwork PR: 126
File: packages/ui/src/theme/context.tsx:11-16
Timestamp: 2026-04-22T09:32:52.535Z
Learning: In Astro-Han/pawwork (`packages/ui/src/theme/context.tsx` and related files), the renaming of localStorage theme keys from `opencode-*` to `pawwork-*` (THEME_ID, COLOR_SCHEME, THEME_CSS_LIGHT, THEME_CSS_DARK) is intentional and should NOT include a migration path from the old keys. Migrating would re-couple PawWork and OpenCode browser storage namespaces, which the PR is explicitly designed to avoid. A reset to the PawWork default theme on upgrade is acceptable by design.
Applied to files:
packages/app/src/pages/layout/pawwork-sidebar.tsxpackages/app/src/components/prompt-input/workspace-chip.tsxpackages/app/src/components/session/pawwork-skill-meta.ts
📚 Learning: 2026-04-23T07:23:12.091Z
Learnt from: Astro-Han
Repo: Astro-Han/pawwork PR: 180
File: packages/app/src/components/session/pawwork-skill-meta.ts:0-0
Timestamp: 2026-04-23T07:23:12.091Z
Learning: In Astro-Han/pawwork, when a design token does not yet exist for a specific accent/brand color (e.g., violet), the project preference is to use a standard Tailwind color class (e.g., `text-violet-500`) rather than introducing a new semantic token. This applies to `homeIconClass` values in `packages/app/src/components/session/pawwork-skill-meta.ts` and similar UI metadata files.
Applied to files:
packages/app/src/pages/layout/pawwork-sidebar.tsxpackages/app/src/components/prompt-input/workspace-chip.tsxpackages/app/src/pages/session/session-side-panel.tsxpackages/app/src/components/session/session-new-view.tsx
📚 Learning: 2026-04-23T08:51:00.819Z
Learnt from: Astro-Han
Repo: Astro-Han/pawwork PR: 186
File: packages/opencode/test/plugin/workspace-adaptor.test.ts:139-144
Timestamp: 2026-04-23T08:51:00.819Z
Learning: In Astro-Han/pawwork (`packages/opencode/src/util/filesystem.ts`), the `Filesystem` utility does NOT expose a `remove` or `unlink` helper. The established repository pattern for auth.json teardown in tests (e.g. `provider.test.ts`, `amazon-bedrock.test.ts`, `workspace-adaptor.test.ts`) is to combine `Filesystem.write` with `node:fs/promises unlink`. Do not flag this mixed usage as inconsistent — it is the correct and intentional pattern.
Applied to files:
packages/app/src/pages/layout/pawwork-sidebar.tsxpackages/app/src/components/prompt-input/workspace-chip.tsx
📚 Learning: 2026-04-20T14:21:51.047Z
Learnt from: Astro-Han
Repo: Astro-Han/pawwork PR: 71
File: packages/app/src/components/session/session-status-connections.tsx:146-147
Timestamp: 2026-04-20T14:21:51.047Z
Learning: In the Astro-Han/pawwork repository (SolidJS app), `sync.data.config` is always initialized to `{}` at `packages/app/src/context/global-sync.tsx` line 71 and is never `undefined` at runtime. Non-optional property access like `sync.data.config.plugin` is intentional and consistent with the pattern used in `packages/app/src/components/status-popover-body.tsx` line 243. Do not flag `sync.data.config.plugin` as needing optional chaining.
Applied to files:
packages/app/src/pages/layout/pawwork-sidebar.tsx
📚 Learning: 2026-04-20T14:36:04.099Z
Learnt from: CR
Repo: Astro-Han/pawwork PR: 0
File: packages/app/e2e/AGENTS.md:0-0
Timestamp: 2026-04-20T14:36:04.099Z
Learning: Applies to packages/app/e2e/**/*.spec.ts : Use `data-component`, `data-action`, or semantic roles for selectors instead of CSS class names or IDs
Applied to files:
packages/app/src/components/session/session-new-view.tsxpackages/app/src/components/session/pawwork-skill-meta.ts
📚 Learning: 2026-04-23T07:23:12.091Z
Learnt from: Astro-Han
Repo: Astro-Han/pawwork PR: 180
File: packages/app/src/components/session/pawwork-skill-meta.ts:0-0
Timestamp: 2026-04-23T07:23:12.091Z
Learning: In Astro-Han/pawwork UI metadata components (e.g., files under `packages/app/src/components/session/`), when a semantic/design token for a specific accent/brand color (such as `violet`) does not exist yet, use the corresponding standard Tailwind color utility/class (e.g., `text-violet-500`) rather than introducing a new semantic token. Apply this specifically to `homeIconClass` values and similar metadata fields that currently expect a Tailwind class string.
Applied to files:
packages/app/src/components/session/pawwork-skill-meta.ts
🔇 Additional comments (7)
packages/app/src/pages/session/session-side-panel.tsx (2)
72-89: Good active-variant icon mapping for Review/Terminal.The
RightPanelShellIconupdate at Line 85 and Line 88 cleanly switches between base and-activeicon names and matches the available icon registry entries.
352-352: Open-file menu icon fix looks correct.Switching to
Icon name="open-file"at Line 352 is aligned with the stated duplication fix and improves semantic clarity.packages/app/src/pages/layout/pawwork-sidebar.tsx (1)
253-253: Good cleanup on search icon sizing.Line 253 dropping the explicit nested icon-size override keeps sizing consistent with shared button/icon defaults.
packages/app/src/components/prompt-input/workspace-chip.tsx (1)
64-67: Icon migration is clean and consistent.The switch to shared
Iconusage preserves behavior and styling while removing local SVG duplication.Also applies to: 94-112
packages/app/src/components/session/pawwork-skill-meta.ts (1)
4-12: Nice type-hardening for skill metadata.
PawworkSkillCardplusPawworkSkillName = PawworkSkillCard["name"]reduces drift between data and exported types.Also applies to: 45-45
packages/app/src/i18n/en.ts (1)
592-597: Copy update aligns with the PR’s home-skill label polish goal.No technical concerns in this i18n key update.
packages/app/src/components/session/session-new-view.tsx (1)
43-48: SharedIconadoption here looks good.The metadata-driven icon name/class/style wiring keeps the rendering path consistent with the new centralized icon set.
Replace 74 chrome icons in packages/ui/src/components/icon.tsx with PawWork-drawn SVGs (vtracer-traced from imagegen batches, single DNA). Add 6 new icons: chevron-up, plugin, automation, remote-control, schedule, key. sidebar-active uses upstream-style left-panel semi-transparent fill; dot-grid keeps the 3-horizontal-dot form. Carve-out: packages/ui/src/components/icon.tsx is now accept-HEAD on upstream sync (see project memory: UI 层重写 carve-out).
- Delete skill-icons.tsx; Skill cards now use <Icon name="..."> with
the v2 brand chrome set (doc-processing / bar-chart / pencil-line).
- Migrate workspace-chip inline SVGs to chrome Icon (workspace /
chevron-down / plus-small).
- Polish Skill pills: grid-cols-3 w-fit for equal-width pills,
20×20 icon (size="normal"), shorter native EN labels
("Process docs" / "Analyze data" / "Start writing").
- Pass active state to RightPanelShellIcon so Review / Terminal tabs render review-active / terminal-active when selected (previously both variants lived in icon.tsx but were unused). - Fix Add-tab dropdown's "Open file" menu item icon: was folder-add-left (duplicating Open-project's glyph), now open-file. - Remove the 20×20 magnifying-glass override on the sidebar search button so it matches the 16×16 of the new-session button (was 25% larger). Closes part of #181 (sidebar icon set alignment, slice 3 of 3).
453fe08 to
856cbf2
Compare
Summary
packages/uiwith 80 PawWork-drawn SVGs (74 rebranded + 6 new:chevron-up/plugin/automation/remote-control/schedule/key).skill-icons.tsx; Skill cards + workspace chip now use the shared<Icon>component.-activevariants; fix Open-file menu icon and sidebar search icon size mismatch.Closes part of #181 (slice 3: sidebar icon set alignment).
Test plan
bun turbo typecheck --filter=@opencode-ai/ui --filter=@opencode-ai/apppasses-activeglyph when selectedCarve-out note
packages/ui/src/components/icon.tsxis now accept-HEAD on upstream sync. When upstream introduces new icons or renames, add matching PawWork paths locally; do not replace the file wholesale.Summary by CodeRabbit
New Features
UI Improvements
Text Updates