diff --git a/src/components/medications/scheduling/TimesOfDayChips.tsx b/src/components/medications/scheduling/TimesOfDayChips.tsx
index 3b01e87b3..b166b6293 100644
--- a/src/components/medications/scheduling/TimesOfDayChips.tsx
+++ b/src/components/medications/scheduling/TimesOfDayChips.tsx
@@ -46,6 +46,13 @@ export interface TimesOfDayChipsProps {
disabled?: boolean;
/** Translation namespace prefix. */
i18nPrefix?: string;
+ /**
+ * Render the built-in Morning / Noon / Evening / Night preset row.
+ * Default `true`. The wizard's Step 7 supplies its own icon-based
+ * preset row, so it passes `false` to avoid showing each suggested
+ * time twice (the icon chip from Step 7 and the labelled chip here).
+ */
+ showPresets?: boolean;
}
/** Preset table — wall-clock HH:mm and i18n suffix key. */
@@ -106,6 +113,7 @@ export function TimesOfDayChips({
maxChips = 8,
disabled = false,
i18nPrefix = "medications.scheduling.timesOfDay",
+ showPresets = true,
}: TimesOfDayChipsProps) {
const { t } = useTranslations();
const inputId = useId();
@@ -165,38 +173,40 @@ export function TimesOfDayChips({
aria-label={t(`${i18nPrefix}.label`)}
>
{/* Preset row */}
-
- {PRESETS.map(({ key, value: preset }) => {
- const isOn = sortedValue.includes(preset);
- const label = `${t(`${i18nPrefix}.presets.${key}`)} ${preset}`;
- return (
-
- );
- })}
-
+ {showPresets && (
+
+ {PRESETS.map(({ key, value: preset }) => {
+ const isOn = sortedValue.includes(preset);
+ const label = `${t(`${i18nPrefix}.presets.${key}`)} ${preset}`;
+ return (
+
+ );
+ })}
+
+ )}
{/* Chip list */}
{sortedValue.length === 0 ? (
@@ -225,7 +235,7 @@ export function TimesOfDayChips({
disabled={disabled}
aria-label={`${t(`${i18nPrefix}.remove`)} ${time}`}
onClick={() => onRemove(time)}
- className="focus-visible:ring-ring inline-flex h-7 w-7 items-center justify-center rounded-sm hover:bg-background focus-visible:outline-none focus-visible:ring-2 disabled:opacity-50"
+ className="focus-visible:ring-ring hover:bg-background inline-flex h-7 w-7 items-center justify-center rounded-sm focus-visible:ring-2 focus-visible:outline-none disabled:opacity-50"
data-slot="times-of-day-chip-remove"
>
diff --git a/src/components/medications/scheduling/__tests__/TimesOfDayChips.test.tsx b/src/components/medications/scheduling/__tests__/TimesOfDayChips.test.tsx
index 3e21c8193..61a5be8fe 100644
--- a/src/components/medications/scheduling/__tests__/TimesOfDayChips.test.tsx
+++ b/src/components/medications/scheduling/__tests__/TimesOfDayChips.test.tsx
@@ -143,4 +143,22 @@ describe(" — SSR render", () => {
expect(html).not.toContain('data-slot="times-of-day-presets"');
expect(html).toMatch(/value="09:30"/);
});
+
+ it("suppresses the built-in preset row when showPresets is false", () => {
+ // The wizard's Step 7 supplies its own icon-based preset row; passing
+ // showPresets={false} keeps each suggested time from rendering twice.
+ const html = render(
+ ,
+ );
+ expect(html).not.toContain('data-slot="times-of-day-presets"');
+ // The chip list (the actual selected values) still renders.
+ expect(html).toContain('data-slot="times-of-day-list"');
+ });
+
+ it("renders the preset row by default (showPresets defaults true)", () => {
+ const html = render(
+ ,
+ );
+ expect(html).toContain('data-slot="times-of-day-presets"');
+ });
});
diff --git a/src/components/medications/wizard/steps/Step7Times.tsx b/src/components/medications/wizard/steps/Step7Times.tsx
index 54784c074..507ce5fa5 100644
--- a/src/components/medications/wizard/steps/Step7Times.tsx
+++ b/src/components/medications/wizard/steps/Step7Times.tsx
@@ -77,6 +77,10 @@ export function Step7Times({ payload, applyPartial }: StepProps) {
value={payload.timesOfDay}
onChange={(timesOfDay) => applyPartial({ timesOfDay })}
maxChips={8}
+ // The icon-based preset row above already offers the four
+ // suggested times; suppress the chips' own labelled preset row so
+ // each suggestion isn't shown twice.
+ showPresets={false}
/>
);