issue #60

- 일정 목록 조회 1차 구현
- 일정 당일 목록 조회 1차 구현

src/ui/component/schedule/SchedulePopover.tsx

@@ -0,0 +1,73 @@
+import { PopoverContent } from '@/components/ui/popover';
+import { useEffect, useState } from 'react';
+import { ScheduleCreateContent } from './content/ScheduleCreateContent';
+import { ScheduleListContent } from './content/ScheduleListContent';
+
+interface ScheduleSheetProps {
+  date: Date | undefined;
+  open: boolean;
+  popoverSide: 'left' | 'right';
+  popoverAlign: 'start' | 'end';
+}
+
+export const SchedulePopover = ({ date, open, popoverSide, popoverAlign }: ScheduleSheetProps) => {
+  const [mode, setMode] = useState<'list' | 'create' | 'detail' | 'update'>('list');
+
+  useEffect(() => {
+    if (!open) {
+      setTimeout(() => {
+        setMode('list');
+      }, 150);
+    }
+  }, [open]);
+
+  const DetailContent = () => {
+    return (
+      <div>
+        Detail
+      </div>
+    )
+  }
+
+  const UpdateContent = () => {
+    return (
+      <div>
+        Update
+      </div>
+    )
+  }
+
+  const SchedulePopoverContent = () => {
+    switch(mode) {
+      case 'list':
+        return <ScheduleListContent 
+          setMode={setMode}
+          date={date}
+          popoverAlign={popoverAlign}
+          popoverSide={popoverSide}
+          open={open}
+        />
+      case 'create':
+        return <ScheduleCreateContent
+          setMode={setMode}
+          date={date}
+          popoverAlign={popoverAlign}
+          popoverSide={popoverSide}
+          open={open}
+        />
+      case 'detail':
+        return <DetailContent />
+      case 'update':
+        return <UpdateContent />
+    }
+  }
+
+  return (
+    <PopoverContent
+      className="rounded-xl xl:w-[calc(100vw/4)] xl:max-w-[480px] min-w-[384px] min-h-[125px] h-[calc(100vh/2.3)]"
+      align={popoverAlign} side={popoverSide}
+    >
+      {<SchedulePopoverContent />}
+    </PopoverContent>
+  )
+}