diff --git a/src/components/mental-health/mental-wellbeing.tsx b/src/components/mental-health/mental-wellbeing.tsx
index 8e2277b1b..702865322 100644
--- a/src/components/mental-health/mental-wellbeing.tsx
+++ b/src/components/mental-health/mental-wellbeing.tsx
@@ -38,6 +38,8 @@ import { queryKeys } from "@/lib/query-keys";
import { INSTRUMENTS, INSTRUMENT_ORDER } from "@/lib/mental-health/instruments";
import { PageHeader } from "@/components/ui/page-header";
import { ResponsiveSheet } from "@/components/ui/responsive-sheet";
+import { QueryErrorCard } from "@/components/ui/query-error-card";
+import { Skeleton } from "@/components/ui/skeleton";
import { AssessmentResult } from "./assessment-result";
import { CheckInWizard } from "./check-in-wizard";
@@ -63,7 +65,20 @@ export function MentalWellbeing() {
null,
);
- const { data: history } = useQuery({
+ // The three states are kept apart deliberately. This read carries the user's
+ // screening history; when it fails, `history` is undefined and every
+ // downstream consumer (`lastByInstrument`, the detail sheet's `rows`) sees an
+ // empty array — which used to render the instrument cards' "not taken yet"
+ // copy. On a mental-health surface that is not a missing error message, it is
+ // a false statement about the user's record: someone with months of
+ // assessments was told the assessments do not exist. Error is now rendered as
+ // error, loading as loading, and only a genuinely empty result as empty.
+ const {
+ data: history,
+ isPending: historyPending,
+ isError: historyError,
+ refetch: refetchHistory,
+ } = useQuery({
queryKey: queryKeys.mentalHealthAssessments(),
queryFn: () =>
apiGet<{ assessments: AssessmentRow[] }>(
@@ -131,18 +146,37 @@ export function MentalWellbeing() {
{t("mentalHealth.choosePrompt")}
-
- {INSTRUMENT_ORDER.map((id) => (
- -
- begin(id)}
- onOpenDetail={() => setDetailInstrument(id)}
- />
-
- ))}
-
+ {historyError ? (
+ void refetchHistory()}
+ />
+ ) : historyPending ? (
+
+ {INSTRUMENT_ORDER.map((id) => (
+ -
+
+
+ ))}
+
+ ) : (
+
+ {INSTRUMENT_ORDER.map((id) => (
+ -
+ begin(id)}
+ onOpenDetail={() => setDetailInstrument(id)}
+ />
+
+ ))}
+
+ )}
{/* 2026-07-17 UX/IA audit M9 — mood tracking, this screener surface,