diff --git a/src/app/medications/__tests__/list-view-toggle.test.tsx b/src/app/medications/__tests__/list-view-toggle.test.tsx
index 305737dd9..418e65477 100644
--- a/src/app/medications/__tests__/list-view-toggle.test.tsx
+++ b/src/app/medications/__tests__/list-view-toggle.test.tsx
@@ -111,29 +111,22 @@ describe("/medications — view renders from the persisted preference", () => {
expect(html).not.toContain("
]*aria-pressed="true"|aria-pressed="true"[^>]*data-slot="medications-view-cards"/,
- );
- expect(html).toMatch(
- /data-slot="medications-view-table"[^>]*aria-pressed="false"|aria-pressed="false"[^>]*data-slot="medications-view-table"/,
- );
+ // v1.16.11 — the view choice lives in /settings/medications only;
+ // the page header carries no toggle.
+ expect(html).not.toContain('data-slot="medications-view-cards"');
});
it("renders the table for view=table", () => {
const html = renderPage({ version: 1, view: "table", order: [] });
expect(html).toContain("
]*aria-pressed="true"|aria-pressed="true"[^>]*data-slot="medications-view-table"/,
- );
+ expect(html).not.toContain('data-slot="medications-view-table"');
});
it("links the header customize glyph to /settings/medications", () => {
- // v1.16.10 — same entry-point logic as the dashboard and insights
- // headers: the Settings2 ghost icon is a plain link to the page's
- // settings section (view preference + manual order live there).
+ // v1.16.11 — same entry-point logic as the dashboard and insights
+ // headers: one wrench ghost icon linking to the page's settings
+ // section (view preference + manual order live there).
const html = renderPage({ version: 1, view: "cards", order: [] });
expect(html).toContain('href="/settings/medications"');
expect(html).toContain('aria-label="Customize medications"');
diff --git a/src/app/medications/page.tsx b/src/app/medications/page.tsx
index dcd1a4e54..edd1de3a8 100644
--- a/src/app/medications/page.tsx
+++ b/src/app/medications/page.tsx
@@ -15,7 +15,6 @@ import {
MedicationTable,
MedicationTableSkeleton,
} from "@/components/medications/medication-table";
-import { MedicationViewToggle } from "@/components/medications/medication-view-toggle";
import { Button } from "@/components/ui/button";
import { Card, CardContent } from "@/components/ui/card";
import {
@@ -26,7 +25,7 @@ import {
} from "@/components/ui/dropdown-menu";
import { EmptyState } from "@/components/ui/empty-state";
import { Skeleton } from "@/components/ui/skeleton";
-import { CheckCircle2, Loader2, Pill, Plus, Settings2 } from "lucide-react";
+import { CheckCircle2, Loader2, Pill, Plus, Wrench } from "lucide-react";
import { apiGet } from "@/lib/api/api-fetch";
import { useMedicationListLayout } from "@/lib/queries/use-medication-list-layout";
import { applyMedicationOrder } from "@/lib/medications/medication-order";
@@ -154,8 +153,7 @@ export default function MedicationsPage() {
// manual medication order, server-side per user
// (`GET`/`PUT /api/medications/layout`). The toggle writes
// optimistically; the order editor lives at /settings/medications.
- const { layout, isLayoutLoading, setView } =
- useMedicationListLayout(isAuthenticated);
+ const { layout, isLayoutLoading } = useMedicationListLayout(isAuthenticated);
useEffect(() => {
if (shouldOpenFromUrl) {
@@ -264,14 +262,12 @@ export default function MedicationsPage() {
- {/* v1.16.10 — card ⇄ table view toggle, persisted server-side
- per user. The Settings2 glyph next to it is the customize
- shortcut to /settings/medications (view preference + the
- manual-order editor), exactly like the dashboard and
- insights headers link to their settings sections, in the
- same slot (left of the add button) and with the same
- responsive 44-px mobile tap floor. */}
-
+ {/* v1.16.11 — the wrench is the one customize entry point:
+ it links to /settings/medications, which owns the view
+ preference (cards ⇄ table) and the manual-order editor.
+ Same glyph, slot (left of the add button) and responsive
+ 44-px mobile tap floor as the dashboard and insights
+ headers. */}
{/* v1.14.0 — the "Add" button is now a choice: log an intake
diff --git a/src/components/dashboard/dashboard-header.tsx b/src/components/dashboard/dashboard-header.tsx
index 51c48967f..d46f4a6d5 100644
--- a/src/components/dashboard/dashboard-header.tsx
+++ b/src/components/dashboard/dashboard-header.tsx
@@ -14,7 +14,7 @@
*/
import { useMemo } from "react";
import Link from "next/link";
-import { Activity, Pill, Plus, Settings2, Waves } from "lucide-react";
+import { Activity, Pill, Plus, Waves, Wrench } from "lucide-react";
import { Button } from "@/components/ui/button";
import {
DropdownMenu,
@@ -114,7 +114,7 @@ export function DashboardHeader({
aria-label={t("dashboard.customizeDashboard")}
title={t("dashboard.customizeDashboard")}
>
-
+
diff --git a/src/components/insights/insights-tab-strip.tsx b/src/components/insights/insights-tab-strip.tsx
index adbea4c47..f54d00086 100644
--- a/src/components/insights/insights-tab-strip.tsx
+++ b/src/components/insights/insights-tab-strip.tsx
@@ -9,7 +9,7 @@ import {
ChevronRight,
Loader2,
RefreshCw,
- Settings2,
+ Wrench,
} from "lucide-react";
import { toast } from "sonner";
@@ -806,7 +806,7 @@ function InsightsTabStripImpl({
"focus-visible:ring-ring/50 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none",
)}
>
-
+
)}
{onRegenerate && (
diff --git a/src/components/medications/medication-table.tsx b/src/components/medications/medication-table.tsx
index 9cd4658fd..8ba319e71 100644
--- a/src/components/medications/medication-table.tsx
+++ b/src/components/medications/medication-table.tsx
@@ -262,7 +262,12 @@ export function MedicationTable({
}
return (
-
+ // `overflow-hidden` is load-bearing: the sticky name column paints
+ // an opaque `bg-card` cell background that would otherwise square
+ // off the wrapper's rounded corners on the left edge. Horizontal
+ // scrolling lives on the inner table-container (`overflow-x-auto`),
+ // so clipping here costs nothing.
+
{t("medications.tableCaption")}
@@ -636,7 +641,10 @@ function MedicationTableRowItem({
*/
export function MedicationTableSkeleton({ rows = 4 }: { rows?: number }) {
return (
-