diff --git a/client/src/components/Planner/DayPlanSidebar.test.tsx b/client/src/components/Planner/DayPlanSidebar.test.tsx
index 782bb6d71..e6aba3be1 100644
--- a/client/src/components/Planner/DayPlanSidebar.test.tsx
+++ b/client/src/components/Planner/DayPlanSidebar.test.tsx
@@ -370,6 +370,17 @@ describe('DayPlanSidebar', () => {
expect(onSelectDay).toHaveBeenCalledWith(10)
})
+ it('FE-PLANNER-DAYPLAN-209: clicking the selected day header again deselects it', async () => {
+ const user = userEvent.setup()
+ const day = buildDay({ id: 10, date: '2025-06-01', title: 'My Day' })
+ const onSelectDay = vi.fn()
+ const onDayDetail = vi.fn()
+ render()
+ await user.click(screen.getByText('My Day'))
+ expect(onSelectDay).toHaveBeenCalledWith(null)
+ expect(onDayDetail).toHaveBeenCalledWith(null)
+ })
+
it('FE-PLANNER-DAYPLAN-010: selectedDayId renders without error', () => {
const day = buildDay({ id: 10, date: '2025-06-01', title: 'My Day' })
render()
diff --git a/client/src/components/Planner/DayPlanSidebar.tsx b/client/src/components/Planner/DayPlanSidebar.tsx
index 2ce0f5d74..c6e4c17a2 100644
--- a/client/src/components/Planner/DayPlanSidebar.tsx
+++ b/client/src/components/Planner/DayPlanSidebar.tsx
@@ -65,7 +65,7 @@ interface DayPlanSidebarProps {
selectedAssignmentId: number | null
onSelectDay: (dayId: number | null, skipFit?: boolean) => void
onPlaceClick: (placeId: number | null, assignmentId?: number | null) => void
- onDayDetail: (day: Day) => void
+ onDayDetail: (day: Day | null) => void
accommodations?: Accommodation[]
onReorder: (dayId: number, orderedIds: number[]) => void
onReorderDays?: (orderedIds: number[]) => void
@@ -1579,7 +1579,8 @@ const DayPlanSidebar = React.memo(function DayPlanSidebar(props: DayPlanSidebarP
{ onSelectDay(day.id); if (onDayDetail) onDayDetail(day) }}
+ // Clicking the selected day again deselects it — same as the day panel's × (#2024).
+ onClick={() => { if (isSelected) { onSelectDay(null); if (onDayDetail) onDayDetail(null) } else { onSelectDay(day.id); if (onDayDetail) onDayDetail(day) } }}
onDragOver={e => { e.preventDefault(); if (dragOverDayId !== day.id) setDragOverDayId(day.id) }}
onDragLeave={e => { if (!e.currentTarget.contains(e.relatedTarget as Node | null)) setDragOverDayId(null) }}
onDrop={e => handleDropOnDay(e, day.id)}