diff --git a/client/src/components/Vacay/VacayCalendar.test.tsx b/client/src/components/Vacay/VacayCalendar.test.tsx
index de3d4616..74c16003 100644
--- a/client/src/components/Vacay/VacayCalendar.test.tsx
+++ b/client/src/components/Vacay/VacayCalendar.test.tsx
@@ -151,7 +151,7 @@ describe('VacayCalendar', () => {
expect(toggleEntry).toHaveBeenCalledWith('2025-01-01', 42)
})
- it('FE-COMP-VACAYCALENDAR-007: cell click blocked by public holiday', async () => {
+ it('FE-COMP-VACAYCALENDAR-007: cell click on public holiday toggles vacation entry', async () => {
const user = userEvent.setup()
const toggleEntry = vi.fn().mockResolvedValue(undefined)
@@ -168,10 +168,10 @@ describe('VacayCalendar', () => {
render()
- // Month 0, button emits '2025-01-01' which is a holiday
+ // Month 0, button emits '2025-01-01' which is a holiday — should still toggle vacation
await user.click(screen.getByText('click-0'))
- expect(toggleEntry).not.toHaveBeenCalled()
+ expect(toggleEntry).toHaveBeenCalledWith('2025-01-01', undefined)
})
it('FE-COMP-VACAYCALENDAR-008: cell click in company mode calls toggleCompanyHoliday', async () => {
diff --git a/client/src/components/Vacay/VacayCalendar.tsx b/client/src/components/Vacay/VacayCalendar.tsx
index 0dcf7511..252c0b90 100644
--- a/client/src/components/Vacay/VacayCalendar.tsx
+++ b/client/src/components/Vacay/VacayCalendar.tsx
@@ -60,11 +60,10 @@ export default function VacayCalendar() {
await toggleCompanyHoliday(dateStr)
return
}
- if (holidays[dateStr]) return
if (blockWeekends && isWeekend(dateStr, weekendDays)) return
if (companyHolidaysEnabled && companyHolidaySet.has(dateStr)) return
await toggleEntry(dateStr, selectedUserId || undefined)
- }, [companyMode, toggleEntry, toggleCompanyHoliday, holidays, companyHolidaySet, blockWeekends, companyHolidaysEnabled, selectedUserId])
+ }, [companyMode, toggleEntry, toggleCompanyHoliday, companyHolidaySet, blockWeekends, companyHolidaysEnabled, selectedUserId])
const selectedUser = users.find(u => u.id === selectedUserId)
diff --git a/client/src/components/Vacay/VacayMonthCard.tsx b/client/src/components/Vacay/VacayMonthCard.tsx
index 29aebe95..07b35732 100644
--- a/client/src/components/Vacay/VacayMonthCard.tsx
+++ b/client/src/components/Vacay/VacayMonthCard.tsx
@@ -54,6 +54,11 @@ export default function VacayMonthCard({
const pad = (n) => String(n).padStart(2, '0')
+ const todayStr = useMemo(() => {
+ const d = new Date()
+ return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`
+ }, [])
+
return (
@@ -85,7 +90,8 @@ export default function VacayMonthCard({
const holiday = holidays[dateStr]
const isCompany = companyHolidaysEnabled && companyHolidaySet.has(dateStr)
const dayEntries = entryMap[dateStr] || []
- const isBlocked = !!holiday || (weekend && blockWeekends) || (isCompany && !companyMode)
+ const isBlocked = (weekend && blockWeekends) || (isCompany && !companyMode)
+ const isToday = dateStr === todayStr
return (
)}
-
0 ? 700 : 500,
+ color: isToday
+ ? '#fff'
+ : dayEntries.length > 0
+ ? 'var(--text-primary)'
+ : holiday ? holiday.color
+ : weekend ? 'var(--text-faint)'
+ : 'var(--text-primary)',
+ ...(isToday ? {
+ display: 'inline-flex',
+ alignItems: 'center',
+ justifyContent: 'center',
+ width: 18,
+ height: 18,
+ borderRadius: '50%',
+ background: '#3b82f6',
+ } : {}),
}}>
{day}