fix: start the quick controls from the selected day's own hours

"Opens later at" and "closes earlier at" were prefilled with 14:00 and
16:00 — arbitrary values, wrong on most days, which left the preview
showing hours nobody had asked for until both fields were corrected.
They now start from the day's real opening and closing, so any
adjustment is relative to what that day actually is.

A day with a lunch break is bounded by its first opening and its last
closing, which is what these two actions act on.

Changing the date changes the hours the times are relative to, so a
value typed for Tuesday must not survive into Thursday. The fields live
in a component keyed on the date and React resets them by remounting —
the React compiler rightly refuses an effect that writes state back, and
it is the clearer arrangement anyway.

The end-to-end test picks a trading day rather than assuming today is
one. The first version guarded the assertions behind a visibility check,
which would have passed in silence on exactly the days the controls
matter least.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_012cSY9pVhZmJUKNN7wf1Myd

app/admin/exceptions/ExceptionsManager.tsx

@@ -2,7 +2,7 @@
 
 import { useState, useTransition } from 'react';
 
-import { earlyClosing, lateOpening } from '@/lib/schedule/exceptions';
+import { earlyClosing, lateOpening, usualBounds } from '@/lib/schedule/exceptions';
 import type { ExceptionKind, Slot } from '@/lib/schedule/types';
 
 import { deleteException, saveException, saveExceptionRange } from './actions';
@@ -144,16 +144,10 @@ function QuickPanel({
   run: (work: () => Promise<{ ok: true } | { ok: false; error: string }>, success: string) => void;
 }) {
   const [date, setDate] = useState(today);
-  const [openFrom, setOpenFrom] = useState('14:00');
-  const [closeAt, setCloseAt] = useState('16:00');
 
   const day = days.find((candidate) => candidate.date === date) ?? days[0];
   const isToday = day?.date === today;
-  const usualSlots = day?.usualSlots ?? [];
-  const isOpenThatDay = usualSlots.length > 0;
-
-  const lateResult = lateOpening(usualSlots, openFrom);
-  const earlyResult = earlyClosing(usualSlots, closeAt);
+  const isOpenThatDay = (day?.usualSlots.length ?? 0) > 0;
 
   function apply(slots: Slot[], note: string, success: string) {
     if (!day) {
@@ -214,54 +208,11 @@ function QuickPanel({
           {isToday ? 'Fermé aujourd’hui' : `Fermé ${when}`}
         </button>
 
-        {isOpenThatDay ? (
-          <>
-            <div className="flex flex-wrap items-center gap-2">
-              <button
-                type="button"
-                disabled={pending || lateResult.length === 0}
-                onClick={() =>
-                  apply(lateResult, `Ouverture à ${openFrom}`, `Ouverture repoussée à ${openFrom}.`)
-                }
-                className="rounded-[var(--radius-md)] border border-[var(--line-strong)] px-4 py-2.5 transition-colors hover:bg-[var(--surface-muted)] disabled:opacity-40"
-              >
-                Ouvre plus tard, à
-              </button>
-              <input
-                type="time"
-                aria-label="Nouvelle heure d’ouverture"
-                value={openFrom}
-                onChange={(event) => setOpenFrom(event.target.value)}
-                className="rounded-[var(--radius-sm)] border border-[var(--line-strong)] bg-[var(--surface)] px-2 py-2 text-base tabular-nums"
-              />
-              <span className="text-sm text-[var(--ink-muted)]">
-                → {lateResult.length === 0 ? 'fermé' : summarise(lateResult)}
-              </span>
-            </div>
-
-            <div className="flex flex-wrap items-center gap-2">
-              <button
-                type="button"
-                disabled={pending || earlyResult.length === 0}
-                onClick={() =>
-                  apply(earlyResult, `Fermeture à ${closeAt}`, `Fermeture avancée à ${closeAt}.`)
-                }
-                className="rounded-[var(--radius-md)] border border-[var(--line-strong)] px-4 py-2.5 transition-colors hover:bg-[var(--surface-muted)] disabled:opacity-40"
-              >
-                Ferme plus tôt, à
-              </button>
-              <input
-                type="time"
-                aria-label="Nouvelle heure de fermeture"
-                value={closeAt}
-                onChange={(event) => setCloseAt(event.target.value)}
-                className="rounded-[var(--radius-sm)] border border-[var(--line-strong)] bg-[var(--surface)] px-2 py-2 text-base tabular-nums"
-              />
-              <span className="text-sm text-[var(--ink-muted)]">
-                → {earlyResult.length === 0 ? 'fermé' : summarise(earlyResult)}
-              </span>
-            </div>
-          </>
+        {isOpenThatDay && day ? (
+          // Keyed on the date: changing the day changes the hours these times
+          // are relative to, and React resets the fields by remounting rather
+          // than by an effect writing state back.
+          <AdjustHours key={day.date} day={day} pending={pending} apply={apply} />
         ) : (
           <p className="text-sm text-[var(--ink-muted)]">
             La boutique est déjà fermée {when}&nbsp;: pour une ouverture exceptionnelle, utilisez le
@@ -350,3 +301,77 @@ function RangePanel({
 function summarise(slots: Slot[]): string {
   return slots.map((slot) => `${slot.open} – ${slot.close}`).join(' · ');
 }
+
+/**
+ * "Opens later at" and "closes earlier at", for one day.
+ *
+ * The fields start from the day's own hours. An arbitrary 14:00 is wrong on
+ * most days and leaves the preview showing hours nobody asked for until both
+ * have been corrected.
+ */
+function AdjustHours({
+  day,
+  pending,
+  apply,
+}: {
+  day: SelectableDay;
+  pending: boolean;
+  apply: (slots: Slot[], note: string, success: string) => void;
+}) {
+  const bounds = usualBounds(day.usualSlots);
+  const [openFrom, setOpenFrom] = useState(bounds.open);
+  const [closeAt, setCloseAt] = useState(bounds.close);
+
+  const lateResult = lateOpening(day.usualSlots, openFrom);
+  const earlyResult = earlyClosing(day.usualSlots, closeAt);
+
+  return (
+    <>
+      <div className="flex flex-wrap items-center gap-2">
+        <button
+          type="button"
+          disabled={pending || lateResult.length === 0}
+          onClick={() =>
+            apply(lateResult, `Ouverture à ${openFrom}`, `Ouverture repoussée à ${openFrom}.`)
+          }
+          className="rounded-[var(--radius-md)] border border-[var(--line-strong)] px-4 py-2.5 transition-colors hover:bg-[var(--surface-muted)] disabled:opacity-40"
+        >
+          Ouvre plus tard, à
+        </button>
+        <input
+          type="time"
+          aria-label="Nouvelle heure d’ouverture"
+          value={openFrom}
+          onChange={(event) => setOpenFrom(event.target.value)}
+          className="rounded-[var(--radius-sm)] border border-[var(--line-strong)] bg-[var(--surface)] px-2 py-2 text-base tabular-nums"
+        />
+        <span className="text-sm text-[var(--ink-muted)]">
+          → {lateResult.length === 0 ? 'fermé' : summarise(lateResult)}
+        </span>
+      </div>
+
+      <div className="flex flex-wrap items-center gap-2">
+        <button
+          type="button"
+          disabled={pending || earlyResult.length === 0}
+          onClick={() =>
+            apply(earlyResult, `Fermeture à ${closeAt}`, `Fermeture avancée à ${closeAt}.`)
+          }
+          className="rounded-[var(--radius-md)] border border-[var(--line-strong)] px-4 py-2.5 transition-colors hover:bg-[var(--surface-muted)] disabled:opacity-40"
+        >
+          Ferme plus tôt, à
+        </button>
+        <input
+          type="time"
+          aria-label="Nouvelle heure de fermeture"
+          value={closeAt}
+          onChange={(event) => setCloseAt(event.target.value)}
+          className="rounded-[var(--radius-sm)] border border-[var(--line-strong)] bg-[var(--surface)] px-2 py-2 text-base tabular-nums"
+        />
+        <span className="text-sm text-[var(--ink-muted)]">
+          → {earlyResult.length === 0 ? 'fermé' : summarise(earlyResult)}
+        </span>
+      </div>
+    </>
+  );
+}