diff --git a/src/app/workspaces/[workspaceId]/calendar/page.tsx b/src/app/workspaces/[workspaceId]/calendar/page.tsx
index f2b8bdf..a46e435 100644
--- a/src/app/workspaces/[workspaceId]/calendar/page.tsx
+++ b/src/app/workspaces/[workspaceId]/calendar/page.tsx
@@ -6,8 +6,24 @@ interface WorkspaceCalendarPageProps {
}>;
}
+function getSeoulTodayIsoDate() {
+ const formatter = new Intl.DateTimeFormat('en-CA', {
+ timeZone: 'Asia/Seoul',
+ year: 'numeric',
+ month: '2-digit',
+ day: '2-digit',
+ });
+ const parts = formatter.formatToParts(new Date());
+ const year = parts.find((part) => part.type === 'year')?.value;
+ const month = parts.find((part) => part.type === 'month')?.value;
+ const day = parts.find((part) => part.type === 'day')?.value;
+
+ return `${year}-${month}-${day}`;
+}
+
export default async function WorkspaceCalendarPage({ params }: WorkspaceCalendarPageProps) {
const { workspaceId } = await params;
+ const initialSelectedDate = getSeoulTodayIsoDate();
- return ;
+ return ;
}
diff --git a/src/features/manage-calendar/model/calendar-utils.ts b/src/features/manage-calendar/model/calendar-utils.ts
index 5bd02e2..05ebde8 100644
--- a/src/features/manage-calendar/model/calendar-utils.ts
+++ b/src/features/manage-calendar/model/calendar-utils.ts
@@ -4,7 +4,7 @@ export interface CalendarDayCell {
isCurrentMonth: boolean;
}
-function formatIsoDate(date: Date) {
+export function formatIsoDate(date: Date) {
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0');
const day = String(date.getDate()).padStart(2, '0');
@@ -16,6 +16,11 @@ export function createCalendarMonthLabel(currentMonth: Date) {
return `${currentMonth.getFullYear()}년 ${currentMonth.getMonth() + 1}월`;
}
+export function createCalendarMonthStart(isoDate: string) {
+ const [year, month] = isoDate.split('-').map(Number);
+ return new Date(year, month - 1, 1);
+}
+
export function createCalendarMonthGrid(currentMonth: Date): CalendarDayCell[] {
const year = currentMonth.getFullYear();
const monthIndex = currentMonth.getMonth();
@@ -34,7 +39,3 @@ export function createCalendarMonthGrid(currentMonth: Date): CalendarDayCell[] {
};
});
}
-
-export function getInitialCalendarDate() {
- return new Date(2025, 6, 1);
-}
diff --git a/src/features/manage-calendar/ui/CalendarView.tsx b/src/features/manage-calendar/ui/CalendarView.tsx
index 240f94a..a85a5b3 100644
--- a/src/features/manage-calendar/ui/CalendarView.tsx
+++ b/src/features/manage-calendar/ui/CalendarView.tsx
@@ -15,13 +15,14 @@ import {
} from '@/entities/calendar-event';
import { plusJakartaSans } from '@/shared/lib/fonts';
import {
+ createCalendarMonthStart,
createCalendarMonthGrid,
createCalendarMonthLabel,
- getInitialCalendarDate,
} from '../model/calendar-utils';
interface CalendarViewProps {
workspaceId: string;
+ initialSelectedDate: string;
}
const weekdayLabels = ['일', '월', '화', '수', '목', '금', '토'] as const;
@@ -66,14 +67,16 @@ function formatSelectedDateLabel(isoDate: string) {
return `${year}년 ${Number(month)}월 ${Number(day)}일`;
}
-export function CalendarView({ workspaceId }: CalendarViewProps) {
+export function CalendarView({ workspaceId, initialSelectedDate }: CalendarViewProps) {
const calendarEventsQuery = useCalendarEventsByWorkspaceId(workspaceId);
const createCalendarEventMutation = useCreateCalendarEvent(workspaceId);
const deleteCalendarEventMutation = useDeleteCalendarEvent(workspaceId);
const updateCalendarEventMutation = useUpdateCalendarEvent(workspaceId);
const calendarEvents = calendarEventsQuery.data ?? [];
- const [currentMonth, setCurrentMonth] = useState(getInitialCalendarDate);
- const [selectedDate, setSelectedDate] = useState('2025-07-30');
+ const [currentMonth, setCurrentMonth] = useState(() =>
+ createCalendarMonthStart(initialSelectedDate),
+ );
+ const [selectedDate, setSelectedDate] = useState(initialSelectedDate);
const [isAddEventOpen, setIsAddEventOpen] = useState(false);
const [formValues, setFormValues] = useState(defaultFormValues);
const [hasSubmitted, setHasSubmitted] = useState(false);
@@ -227,7 +230,7 @@ export function CalendarView({ workspaceId }: CalendarViewProps) {
onClick={() => setSelectedDate(cell.isoDate)}
className={`hover:bg-brand-soft/30 relative min-h-[98px] border-r border-b border-[rgba(91,78,232,0.1)] px-[8px] pt-[5px] pb-[8px] text-left align-top transition sm:min-h-[108px] ${
(index + 1) % 7 === 0 ? 'border-r-0' : ''
- } ${isSelected ? 'bg-[rgba(238,240,251,0.6)]' : ''}`}
+ } ${isSelected ? 'bg-brand/12' : ''}`}
>
;
+export default function CalendarPage({ workspaceId, initialSelectedDate }: CalendarPageProps) {
+ return ;
}