From 07f4961f27be203aabcc50456eb76d6b23efb438 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marc-Andr=C3=A9=20Bombeck?= <mbombeck@gmail.com>
Date: Mon, 5 Oct 2026 08:11:09 +0200
Subject: [PATCH] fix(coach): label the quick-settings fields alike and give
 the lookback full width

The model fields carried the form label's colon and the lookback picker
an uppercase section-style label and a fit-content 36 px trigger. All four
fields now share one unadorned label and the full-width 44/40 px control.
---
 .../insights/coach-panel/coach-model-picker.tsx        |  7 ++++---
 src/components/insights/coach-panel/sources-rail.tsx   | 10 ++++------
 src/components/settings/ai/reasoning-effort-field.tsx  |  7 ++++++-
 3 files changed, 14 insertions(+), 10 deletions(-)

diff --git a/src/components/insights/coach-panel/coach-model-picker.tsx b/src/components/insights/coach-panel/coach-model-picker.tsx
index 079d99c96..b6eafe233 100644
--- a/src/components/insights/coach-panel/coach-model-picker.tsx
+++ b/src/components/insights/coach-panel/coach-model-picker.tsx
@@ -212,7 +212,7 @@ export function CoachModelPicker() {
   return (
     <div data-slot="coach-model-picker" className="flex flex-col gap-4">
       <div>
-        <Label htmlFor="coach-quick-provider">
+        <Label htmlFor="coach-quick-provider" noColon>
           {t("insights.coach.frame.provider")}
         </Label>
         <NativeSelect
@@ -241,7 +241,7 @@ export function CoachModelPicker() {
 
       {model.kind === "preset" ? (
         <div>
-          <Label htmlFor="coach-quick-model">
+          <Label htmlFor="coach-quick-model" noColon>
             {t("settings.ai.modelLabel")}
           </Label>
           <NativeSelect
@@ -284,6 +284,7 @@ export function CoachModelPicker() {
       {reasoning ? (
         <ReasoningEffortField
           id="coach-quick-reasoning"
+          noColon
           value={reasoning.value}
           onChange={(next) => patchProvider.mutate({ [reasoning.field]: next })}
         />
@@ -324,7 +325,7 @@ function GatewayModelField({
         if (changed) onSave(draft.trim() || null);
       }}
     >
-      <Label htmlFor="coach-quick-gateway-model">
+      <Label htmlFor="coach-quick-gateway-model" noColon>
         {t("settings.ai.modelLabel")}
       </Label>
       <div className="flex items-center gap-2">
diff --git a/src/components/insights/coach-panel/sources-rail.tsx b/src/components/insights/coach-panel/sources-rail.tsx
index 5e6dc6860..404da80a7 100644
--- a/src/components/insights/coach-panel/sources-rail.tsx
+++ b/src/components/insights/coach-panel/sources-rail.tsx
@@ -4,6 +4,7 @@ import { useState } from "react";
 import { Eye, Loader2, Target } from "lucide-react";
 import { toast } from "sonner";
 
+import { Label } from "@/components/ui/label";
 import { Switch } from "@/components/ui/switch";
 import {
   Select,
@@ -162,12 +163,9 @@ export function SourcesRail({ className, activeScopeLabel }: SourcesRailProps) {
           under the picker states what the Coach reads at this setting, with
           the numbers the server readers use. */}
       <div data-slot="coach-sources-window" className="flex flex-col gap-1">
-        <label
-          htmlFor="coach-sources-window-select"
-          className="text-muted-foreground text-xs font-medium tracking-wide uppercase"
-        >
+        <Label htmlFor="coach-sources-window-select" noColon>
           {t("insights.coach.lookback.label")}
-        </label>
+        </Label>
         <Select
           value={activeWindow}
           onValueChange={(v) => setWindow(v as CoachDefaultWindow)}
@@ -177,7 +175,7 @@ export function SourcesRail({ className, activeScopeLabel }: SourcesRailProps) {
             id="coach-sources-window-select"
             data-slot="coach-sources-window-trigger"
             size="default"
-            className="h-9 text-sm"
+            className="w-full text-sm"
             aria-describedby="coach-sources-window-detail"
           >
             <SelectValue />
diff --git a/src/components/settings/ai/reasoning-effort-field.tsx b/src/components/settings/ai/reasoning-effort-field.tsx
index b9bae533f..f4c814f49 100644
--- a/src/components/settings/ai/reasoning-effort-field.tsx
+++ b/src/components/settings/ai/reasoning-effort-field.tsx
@@ -16,15 +16,20 @@ export function ReasoningEffortField({
   id,
   value,
   onChange,
+  noColon = false,
 }: {
   id: string;
   value: ReasoningEffort | null;
   onChange: (next: ReasoningEffort | null) => void;
+  /** The Coach's quick settings label their fields without a colon. */
+  noColon?: boolean;
 }) {
   const { t } = useTranslations();
   return (
     <div>
-      <Label htmlFor={id}>{t("settings.ai.reasoning.label")}</Label>
+      <Label htmlFor={id} noColon={noColon}>
+        {t("settings.ai.reasoning.label")}
+      </Label>
       <NativeSelect
         id={id}
         value={value ?? ""}