xiaoju
f31c45db07
Implement client-side search functionality for the records list with real-time text highlighting. Users can now filter records by searching across command, device name, and record ID fields. Features: - Search input positioned above device filter buttons - Case-insensitive substring matching across command, device, and ID fields - Real-time highlighting of matched text with <mark> tags - Highlight component for reusable text highlighting logic - Optimized filtering with useMemo to prevent unnecessary recalculations - Distinct empty states: "No records yet" vs "No matches found" - Dark theme consistent styling with focus states - 14 comprehensive TDD tests ensuring feature correctness Technical implementation: - Highlight component uses regex for case-insensitive matching - Escapes special regex characters for safe query handling - Filtered results computed via useMemo with [records, searchQuery] dependencies - Integrates seamlessly with existing device filtering - Yellow highlight (#fbbf24) with dark text for visibility on dark theme Resolves issue #7 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>