Add search, filters, and grouping to Library UI

[Copilot]

Summary

• Implemented Steam-like library management with search, filters, sorting, and grouping. Library now supports filtering by title search, platform, and recognition status, with sort options (name/platform/date) and grouping modes (none/platform/status).

Changes

UI Enhancements

• Search input with real-time title filtering
• Platform dropdown (dynamically populated from library items)
• Status filter (recognized vs unknown games based on manifest presence)
• Sort by name, platform, or date added
• Group by platform or recognition status with section headers
• "Clear Filters" button (shown when filters active)
• Live stats showing filtered/total game counts

Implementation Details

• Client-side filtering via useMemo hooks for performance
• URL query params for filter persistence (q, pf, sf, sort, group)
• TanStack Query integration for platform metadata from Crocdb API
• Follows existing BrowsePage patterns and design system

Files Modified

• apps/web/src/pages/LibraryPage.tsx: Added search/filter/sort/group logic (+304/-60)
• .gitignore: Excluded library test data directories

UI Layout

[Search Input] [Platform ▼] [Status ▼] [Sort ▼] [Group ▼] [Clear Filters]
Showing 15 of 42 games | [Scan Library]

With games present, filter controls appear in horizontal row above game grid.

Testing

• TypeScript compilation passes
• ESLint passes (no new warnings)
• CodeQL security scan: 0 vulnerabilities
• Automated code review: no issues

Checklist

• Added a semantic version comment to this PR using /semver: patch, /semver: minor, or /semver: major. (See template for examples)
• Confirmed workflows and automation updates (if any) have appropriate permissions.

Warning

Firewall rules blocked me from connecting to one or more addresses (expand for details)

I tried to connect to the following addresses, but was blocked by firewall rules:

• api.crocdb.net
  • Triggering command: /usr/local/bin/node /usr/local/bin/node --require /home/REDACTED/work/jacare/jacare/node_modules/tsx/dist/preflight.cjs --import file:///home/REDACTED/work/jacare/jacare/node_modules/tsx/dist/loader.mjs src/index.ts --global lib/node-gyp-bin/sh user.name (dns block)
  • Triggering command: /usr/local/bin/node /usr/local/bin/node --require /home/REDACTED/work/jacare/jacare/node_modules/tsx/dist/preflight.cjs --import file:///home/REDACTED/work/jacare/jacare/node_modules/tsx/dist/loader.mjs src/index.ts (dns block)
• https://storage.googleapis.com/chrome-for-testing-public/143.0.7499.4/linux64/chrome-headless-shell-linux64.zip
  • Triggering command: /usr/local/bin/node /usr/local/bin/node /home/REDACTED/work/jacare/jacare/node_modules/playwright-core/lib/server/registry/oopDownloadBrowserMain.js (http block)
• https://storage.googleapis.com/chrome-for-testing-public/143.0.7499.4/linux64/chrome-linux64.zip
  • Triggering command: /usr/local/bin/node /usr/local/bin/node /home/REDACTED/work/jacare/jacare/node_modules/playwright-core/lib/server/registry/oopDownloadBrowserMain.js (http block)

If you need me to access, download, or install something from one of these locations, you can either:

• Configure Actions setup steps to set up my environment, which run before the firewall is enabled
• Add the appropriate URLs or hosts to the custom allowlist in this repository's Copilot coding agent settings (admins only)

Original prompt

---

This section details on the original issue you should resolve

<issue_title>Library UI lacks search, filters, and categorisation</issue_title>
<issue_description>Library shows a flat list only. No search, filters, or grouping; becomes messy even with a small library.

Expected:

• Search by name
• Filters (platform, recognised/unknown)
• Basic categorisation/grouping</issue_description>

<agent_instructions>Implement a UI/UX that a retro gamer might expect from this, focus only on functionality dont need to change design colors etc. Just make sure to have all expected functionality from a library based on steam user experience</agent_instructions>

Comments on the Issue (you are @copilot in this section)

• Fixes Library UI lacks search, filters, and categorisation #93

---

💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.