feat: tags end-to-end (CRUD, photo membership, filter, sidebar UI)

The Tag model and photo_tags join table were already in place; this
fills in the rest — full backend CRUD, per-photo add/remove, list-
endpoint filtering, and a Tags section in the RightSidebar with
autocomplete-create.

Backend
- routers/tags.py rewritten from a 27-line stub:
    GET    /tags                — list with photo counts
    POST   /tags                — create (idempotent on name)
    PATCH  /tags/{id}           — rename / recolor
    DELETE /tags/{id}           — delete (FK cascades photo_tags)
- routers/photos.py:
    POST   /photos/{id}/tags    — add tag ids (idempotent)
    DELETE /photos/{id}/tags/{tag_id} — remove
    GET    /photos/{id}         — now returns a `tags` list alongside
                                  the existing PhotoResponse fields
                                  (fetched via the photo_tags join)
- list_photos applies the existing tag_ids query param: comma-
  separated, AND semantics, one IN-subquery per id since SQLite
  has no native set-contains-all.

Frontend
- New hooks/useTagsQuery.ts.
- services/api.ts: Tag interface, full tags client (list/create/
  update/delete), addToPhoto/removeFromPhoto helpers.
- filterStore: tagIds: string[] field, setTagIds, toggleTagId,
  hasActiveFilters update, filtersToParams sends tag_ids comma list.
- useFilterUrlSync round-trips ?tag_ids=… so tag-filtered views
  are bookmarkable.
- usePhotosQuery threads tagIds through.
- RightSidebar gains a new Tags section using a TagsEditor
  component:
    - shows existing tag chips with X to remove
    - autocomplete input that matches the user's typing against
      existing tag names
    - shows an inline "+ Create '<name>'" affordance when there's
      no exact match
    - Enter creates and attaches in one shot; Esc clears the input
    - existing colour values render as a tinted chip background
- FilterBar gets a Tags group (only rendered when there's at
  least one tag) with toggleable chips per tag.
- ActiveFilterChips shows "Tag: <name>" chips for each active
  tag id, looking up names lazily from the tags query.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

frontend/src/hooks/useFilterUrlSync.ts

@@ -71,6 +71,12 @@ function parseUrl(): Partial<FilterState> {
   const folderId = sp.get('folder_id')
   if (folderId) out.folderId = folderId
 
+  const tagIds = sp.get('tag_ids')
+  if (tagIds) {
+    const ids = tagIds.split(',').map((t) => t.trim()).filter(Boolean)
+    if (ids.length > 0) out.tagIds = ids
+  }
+
   const sortBy = sp.get('sort')
   if (sortBy && ALLOWED_SORT_FIELDS.includes(sortBy as SortField)) {
     out.sortBy = sortBy as SortField
@@ -95,6 +101,7 @@ function writeUrl(f: FilterState) {
   if (f.flag !== 'any') sp.set('flag', f.flag)
   if (f.heapId) sp.set('heap_id', f.heapId)
   if (f.folderId) sp.set('folder_id', f.folderId)
+  if (f.tagIds.length > 0) sp.set('tag_ids', f.tagIds.join(','))
   if (f.sortBy !== 'taken_at') sp.set('sort', f.sortBy)
   if (f.sortOrder !== 'desc') sp.set('order', f.sortOrder)
 

frontend/src/hooks/usePhotosQuery.ts

@@ -20,6 +20,7 @@ export function usePhotosQuery() {
   const flag = useFilterStore((s) => s.flag)
   const heapId = useFilterStore((s) => s.heapId)
   const folderId = useFilterStore((s) => s.folderId)
+  const tagIds = useFilterStore((s) => s.tagIds)
   const sortBy = useFilterStore((s) => s.sortBy)
   const sortOrder = useFilterStore((s) => s.sortOrder)
 
@@ -35,10 +36,11 @@ export function usePhotosQuery() {
         flag,
         heapId,
         folderId,
+        tagIds,
         sortBy,
         sortOrder,
       }),
-    [q, dateFrom, dateTo, mediaTypes, ratingMin, colorLabel, flag, heapId, folderId, sortBy, sortOrder]
+    [q, dateFrom, dateTo, mediaTypes, ratingMin, colorLabel, flag, heapId, folderId, tagIds, sortBy, sortOrder]
   )
 
   return useQuery({

frontend/src/hooks/useTagsQuery.ts

@@ -0,0 +1,12 @@
+import { useQuery } from '@tanstack/react-query'
+import { tags as tagsApi, type Tag } from '../services/api'
+
+export const TAGS_QUERY_KEY = ['tags'] as const
+
+export function useTagsQuery() {
+  return useQuery<Tag[]>({
+    queryKey: TAGS_QUERY_KEY,
+    queryFn: tagsApi.list,
+    staleTime: 30_000,
+  })
+}