Season view: filter the editor to a year (#54)

"Change the garlic bed to cucumbers this year" has a year in it, and pansy had
no notion of one — the editor showed whatever is currently planted, full stop.

The data has always supported seasons: plantings carry planted_at and
removed_at, and "clear bed" soft-removes rather than deleting. A season is a
date range over data that already exists. No schema change, and specifically no
seasons table — it would duplicate what the dates already say and create a
second source of truth about when something was in the ground.

?year=YYYY on /full returns every plop whose [planted_at, removed_at] interval
overlapped that calendar year, so garlic planted in October and pulled the
following July appears in BOTH years, which is what actually happened. Undated
plantings appear in every year: everything that predates this feature has a null
planted_at, and a rule that excluded them would empty every existing garden the
moment a year was selected. Without the param /full behaves exactly as before —
the existing tests pass unchanged, which was the point of doing it this way.

Widening to past plops means widening the referenced-plant lookup with it.
A plant pulled last July isn't active, but its plops still have to render with
the right icon and colour, so ListReferencedPlants takes an includeRemoved flag
that tracks the same switch.

A past season is READ-ONLY, gated at the single canEdit the palette, inspector,
nudging, placement and drag handles all key off. Editing the past by accident is
the failure mode this feature introduces, so the state is stated in a banner
rather than implied by a dropdown you set a while ago, with the way back to the
live garden next to it.

The season is a separate query under its own key. The optimistic mutations all
patch gardenFullKey(gardenId); folding a year into that key would let them write
into whichever season happened to be on screen. Read-only views never need that
machinery, and keeping them out of it means they can't accidentally join it.

The year selector offers only years the garden holds data for, plus the current
one. A free numeric field invites a typo, and a typo'd year produces a
confidently empty garden that reads as data loss rather than a mistake — the
server bounds the year for the same reason.

Closes #54

Co-Authored-By: Claude Opus 4.8 (1M context) <[email protected]>
Claude-Session: https://claude.ai/code/session_01H3zbym8Doka2d7D48maSgZ

web/src/editor/SeasonPicker.tsx

@@ -0,0 +1,69 @@
+import { cn } from '@/lib/cn'
+
+/**
+ * Which season the canvas is showing.
+ *
+ * "Now" is the live, editable garden — what is in the ground today. A year is a
+ * read-only view of everything whose time in the ground overlapped that calendar
+ * year, plops since removed included. They are genuinely different questions:
+ * "what's growing" versus "what did I grow", and only the first one is editable.
+ *
+ * Only years the garden holds data for are offered. A free numeric field invites
+ * a typo, and a typo'd year produces a confidently empty garden that reads as
+ * data loss rather than a mistake.
+ */
+export function SeasonPicker({
+  years,
+  value,
+  onChange,
+}: {
+  years: number[]
+  value: number | null
+  onChange: (year: number | null) => void
+}) {
+  if (years.length === 0) return null
+  return (
+    <label className="flex items-center gap-1.5 text-xs text-muted">
+      <span>Season</span>
+      <select
+        value={value ?? ''}
+        onChange={(e) => onChange(e.target.value === '' ? null : Number(e.target.value))}
+        className={cn(
+          'rounded-md border border-border bg-surface px-1.5 py-1 text-xs text-fg outline-none',
+          'focus-visible:ring-2 focus-visible:ring-accent/40',
+        )}
+      >
+        <option value="">Now</option>
+        {years.map((y) => (
+          <option key={y} value={y}>
+            {y}
+          </option>
+        ))}
+      </select>
+    </label>
+  )
+}
+
+/**
+ * The banner that stops you thinking you're looking at now. Editing the past by
+ * accident is the failure mode this whole feature introduces, so the state is
+ * stated rather than implied by a dropdown you set a while ago — with the way
+ * back to the live garden right next to it.
+ */
+export function SeasonBanner({ year, onExit }: { year: number; onExit: () => void }) {
+  return (
+    <div className="flex flex-wrap items-center gap-2 rounded-lg border border-amber-500/40 bg-amber-500/10 px-2 py-1.5 text-sm">
+      <span className="font-medium text-amber-800 dark:text-amber-300">Viewing {year}</span>
+      <span className="text-xs text-amber-800/80 dark:text-amber-300/80">
+        read-only, including plantings since removed
+      </span>
+      <button
+        type="button"
+        onClick={onExit}
+        className="ml-auto rounded px-1.5 py-0.5 text-xs font-medium text-amber-900 underline outline-none hover:no-underline focus-visible:ring-2 focus-visible:ring-accent/40 dark:text-amber-200"
+      >
+        Back to now
+      </button>
+    </div>
+  )
+}