mirror of
https://github.com/Studio-Saelix/sencho.git
synced 2026-08-26 02:06:49 +00:00
4c0efcb9a8
* feat(sidebar): §14 sidebar orchestration (filter chips, pinned rail, trailing column) - Add All / Up / Down / Updates filter chips with live counts; active chip filters the list; chip-filtered files computed in EditorLayout with useMemo - Surface the PINNED group with a 3px cyan left rail and glow via the sidebarPinnedGroupRail token; reuses the brand token already on the active row - Compact brand row from three stacked elements to a single 44px horizontal bar - Restructure StackRow trailing column as fixed slots: label dots (max 3 + +N overflow), update-dot | git-pending icon (priority order), kebab; add reserved invisible checkbox slot for PR2 bulk mode - Export statusText / statusColor from StackRow and reuse them in StackList remote-results section to remove the duplicate inline logic - Lift filterChip state and chip-filtered files to EditorLayout; remove filterChip from StackListProps to eliminate the dual-path redundancy - Remove unused labels param from buildGroups and the void labels workaround - Wrap filteredFiles in useMemo so filterCounts memo is not defeated on every render * fix(sidebar): move statusText and statusColor to stack-status-utils react-refresh/only-export-components requires component files to export only components. Move the two utility functions and StackRowStatus type to a dedicated stack-status-utils.ts so StackRow.tsx is a pure component module. Update StackList.tsx and EditorLayout.tsx to import from the new source directly.
31 lines
1.1 KiB
TypeScript
31 lines
1.1 KiB
TypeScript
import { cn } from '@/lib/utils';
|
|
|
|
export const sidebarRowBase = cn(
|
|
'relative flex items-center gap-2 w-full px-2 py-1.5 rounded-md mb-0.5',
|
|
'font-mono text-[13px] text-muted-foreground',
|
|
'hover:bg-glass-highlight hover:text-foreground',
|
|
'transition-colors group cursor-pointer',
|
|
);
|
|
|
|
export const sidebarRowActive = cn(
|
|
'bg-accent/[0.07] text-stat-value',
|
|
'after:content-[""] after:absolute after:left-[-12px] after:top-1 after:bottom-1',
|
|
'after:w-[3px] after:rounded-sm after:bg-brand',
|
|
'after:shadow-[0_0_6px_var(--brand)]',
|
|
);
|
|
|
|
export const sidebarGroupHeader = cn(
|
|
'flex items-center justify-between w-full px-2 pt-3 pb-1',
|
|
'text-[9px] leading-3 tracking-[0.22em] uppercase text-stat-subtitle',
|
|
'cursor-pointer select-none',
|
|
);
|
|
|
|
export const sidebarRowCheckboxSlot = 'shrink-0 w-4 h-4 opacity-0 pointer-events-none flex-shrink-0';
|
|
|
|
export const sidebarPinnedGroupRail = cn(
|
|
'relative before:absolute before:left-0 before:top-0 before:bottom-0',
|
|
'before:w-[3px] before:rounded-sm before:bg-brand',
|
|
'before:shadow-[0_0_6px_var(--brand)]',
|
|
'pl-[13px]',
|
|
);
|