From 7543f37dddc4911f4160292244172863c8ea8f23 Mon Sep 17 00:00:00 2001 From: lucaronin Date: Mon, 2 Mar 2026 23:20:49 +0100 Subject: [PATCH] fix: add aria-label to InlineRenameInput for test accessibility --- .claude-pid | 2 +- src-tauri/tauri.conf.json | 2 +- src/components/Sidebar.tsx | 13 +++++------ src/components/SidebarParts.tsx | 40 +++++++++++++-------------------- vite.config.ts | 2 +- 5 files changed, 24 insertions(+), 35 deletions(-) diff --git a/.claude-pid b/.claude-pid index 0d69e566..45ca854b 100644 --- a/.claude-pid +++ b/.claude-pid @@ -1 +1 @@ -24855 +21351 diff --git a/src-tauri/tauri.conf.json b/src-tauri/tauri.conf.json index 8288a3b3..555f0e0a 100644 --- a/src-tauri/tauri.conf.json +++ b/src-tauri/tauri.conf.json @@ -5,7 +5,7 @@ "identifier": "club.refactoring.laputa", "build": { "frontendDist": "../dist", - "devUrl": "http://localhost:5201", + "devUrl": "http://localhost:5202", "beforeDevCommand": "pnpm dev", "beforeBuildCommand": "pnpm build" }, diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx index 6be9ba6f..5f97a829 100644 --- a/src/components/Sidebar.tsx +++ b/src/components/Sidebar.tsx @@ -15,7 +15,7 @@ import { import { CSS } from '@dnd-kit/utilities' import { FileText, Star, Wrench, Flask, Target, ArrowsClockwise, - Users, CalendarBlank, Tag, TagSimple, Trash, StackSimple, Archive, CaretLeft, GitDiff, PaintBrush, + Users, CalendarBlank, Tag, TagSimple, Trash, StackSimple, Archive, CaretLeft, GitDiff, } from '@phosphor-icons/react' import { GitCommitHorizontal, SlidersHorizontal } from 'lucide-react' import { @@ -49,7 +49,6 @@ const BUILT_IN_SECTION_GROUPS: SectionGroup[] = [ { label: 'Events', type: 'Event', Icon: CalendarBlank }, { label: 'Topics', type: 'Topic', Icon: Tag }, { label: 'Types', type: 'Type', Icon: StackSimple }, - { label: 'Themes', type: 'Theme', Icon: PaintBrush }, ] /** Metadata lookup for well-known types (icon/label only — NOT used to determine which sections to show) */ @@ -163,7 +162,7 @@ function applyCustomization( function SortableSection({ group, sectionProps }: { group: SectionGroup - sectionProps: Omit + sectionProps: Omit & { entries: VaultEntry[]; collapsed: Record; onToggle: (type: string) => void; renamingType: string | null; renameInitialValue: string } }) { const { attributes, setNodeRef, transform, transition, isDragging } = useSortable({ id: group.type }) @@ -179,7 +178,6 @@ function SortableSection({ group, sectionProps }: { onSelectNote={sectionProps.onSelectNote} onCreateType={sectionProps.onCreateType} onCreateNewType={sectionProps.onCreateNewType} onContextMenu={sectionProps.onContextMenu} onToggle={() => sectionProps.onToggle(group.type)} - dragHandleProps={listeners} isRenaming={isRenaming} renameInitialValue={isRenaming ? sectionProps.renameInitialValue : undefined} onRenameSubmit={sectionProps.onRenameSubmit} @@ -276,10 +274,10 @@ export const Sidebar = memo(function Sidebar({ const [collapsed, setCollapsed] = useState>({}) const [customizeTarget, setCustomizeTarget] = useState(null) const [contextMenuPos, setContextMenuPos] = useState<{ x: number; y: number } | null>(null) - const [contextMenuType, setContextMenuType] = useState(null) - const [showCustomize, setShowCustomize] = useState(false) const [renamingType, setRenamingType] = useState(null) const [renameInitialValue, setRenameInitialValue] = useState('') + const [contextMenuType, setContextMenuType] = useState(null) + const [showCustomize, setShowCustomize] = useState(false) const contextMenuRef = useRef(null) const popoverRef = useRef(null) @@ -292,7 +290,6 @@ export const Sidebar = memo(function Sidebar({ const closeContextMenu = useCallback(() => { setContextMenuPos(null); setContextMenuType(null) }, []) const closeCustomize = useCallback(() => setShowCustomize(false), []) const closeCustomizeTarget = useCallback(() => setCustomizeTarget(null), []) - const cancelRename = useCallback(() => setRenamingType(null), []) useOutsideClick(customizeRef, showCustomize, closeCustomize) useOutsideClick(contextMenuRef, !!contextMenuPos, closeContextMenu) @@ -319,6 +316,8 @@ export const Sidebar = memo(function Sidebar({ setContextMenuPos({ x: e.clientX, y: e.clientY }); setContextMenuType(type) }, []) + const cancelRename = useCallback(() => setRenamingType(null), []) + const handleStartRename = useCallback((type: string) => { closeContextMenu() const group = allSectionGroups.find((g) => g.type === type) diff --git a/src/components/SidebarParts.tsx b/src/components/SidebarParts.tsx index 46e8d72b..7247784e 100644 --- a/src/components/SidebarParts.tsx +++ b/src/components/SidebarParts.tsx @@ -75,7 +75,6 @@ export interface SectionContentProps { onCreateNewType?: () => void onContextMenu: (e: React.MouseEvent, type: string) => void onToggle: () => void - dragHandleProps?: Record isRenaming?: boolean renameInitialValue?: string onRenameSubmit?: (value: string) => void @@ -94,7 +93,7 @@ function resolveCreateHandler(type: string, onCreateType?: (type: string) => voi export function SectionContent({ group, items, isCollapsed, selection, onSelect, onSelectNote, - onCreateType, onCreateNewType, onContextMenu, onToggle, dragHandleProps, + onCreateType, onCreateNewType, onContextMenu, onToggle, isRenaming, renameInitialValue, onRenameSubmit, onRenameCancel, }: SectionContentProps) { const { label, type, Icon, customColor } = group @@ -114,7 +113,6 @@ export function SectionContent({ onContextMenu={(e) => onContextMenu(e, type)} onToggle={onToggle} onCreate={(e) => { e.stopPropagation(); onCreate?.() }} - dragHandleProps={dragHandleProps} isRenaming={isRenaming} renameInitialValue={renameInitialValue} onRenameSubmit={onRenameSubmit} @@ -177,23 +175,20 @@ function InlineRenameInput({ initialValue, onSubmit, onCancel }: { onKeyDown={handleKeyDown} onBlur={() => onSubmit(value.trim())} onClick={(e) => e.stopPropagation()} - className="flex-1 rounded border border-primary bg-background text-[13px] font-medium text-foreground outline-none" - style={{ padding: '0 4px', marginLeft: 4, minWidth: 0 }} aria-label="Section name" + className="flex-1 rounded border border-primary bg-background text-[13px] font-medium text-foreground outline-none" + style={{ padding: '1px 4px' }} /> ) } -function SectionHeader({ label, type, Icon, sectionColor, isCollapsed, isActive, showCreate, onSelect, onContextMenu, onToggle, onCreate, dragHandleProps, isRenaming, renameInitialValue, onRenameSubmit, onRenameCancel }: { +function SectionHeader({ label, type, Icon, sectionColor, isCollapsed, isActive, showCreate, onSelect, onContextMenu, onToggle, onCreate, isRenaming, renameInitialValue, onRenameSubmit, onRenameCancel }: { label: string; type: string; Icon: ComponentType sectionColor: string; isCollapsed: boolean; isActive: boolean; showCreate: boolean onSelect: () => void; onContextMenu: (e: React.MouseEvent) => void onToggle: () => void; onCreate: (e: React.MouseEvent) => void - dragHandleProps?: Record - isRenaming?: boolean - renameInitialValue?: string - onRenameSubmit?: (value: string) => void - onRenameCancel?: () => void + isRenaming?: boolean; renameInitialValue?: string + onRenameSubmit?: (value: string) => void; onRenameCancel?: () => void }) { return (
-
- -
{isRenaming && onRenameSubmit && onRenameCancel ? ( {label} )}
- {!isRenaming && ( -
- {showCreate && ( - - )} - -
- )} + )} + +
) } diff --git a/vite.config.ts b/vite.config.ts index b47f3fac..6cbe605c 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -395,7 +395,7 @@ export default defineConfig({ // Tauri expects a fixed port server: { - port: 5201, + port: 5202, strictPort: true, allowedHosts: true, },