Merge pull request #80 from jphacks/fix/fetch

バックエンドからデータを取得するようにした

task_yell/src/app/home/page.tsx

@@ -27,7 +27,16 @@ import {
 } from "@/components/ui/sheet";
 import { Switch } from "@/components/ui/switch";
 import { Textarea } from "@/components/ui/textarea";
+import { signOut } from "@/firebase/auth";
 import { auth } from "@/firebase/client-app";
+import { createEvent, readEvents } from "@/lib/events";
+import { Category, Priority } from "@/lib/types";
+import {
+  createWantTodo,
+  deleteWantTodo,
+  readWantTodos,
+  updateWantTodo,
+} from "@/lib/want-todo";
 import {
   AngleIcon,
   ListBulletIcon,
@@ -67,11 +76,8 @@ import {
 import { useRouter } from "next/navigation";
 import { useEffect, useMemo, useRef, useState } from "react";
 
-type Priority = "low" | "medium" | "high";
-type Category = "work" | "personal" | "shopping" | "health" | "other";
-
 type Todo = {
-  id: number;
+  id: string;
   text: string;
   completed: boolean;
   date: Date;
@@ -80,21 +86,21 @@ type Todo = {
 };
 
 type Event = {
-  id: number;
+  id: string;
   title: string;
-  start: Date;
-  end: Date;
+  start: Date | null;
+  end: Date | null;
   description: string;
   category: Category;
   priority: Priority;
-  location: string;
+  location: string | null;
   invitees: string;
   isTask: boolean;
   isLocked: boolean;
 };
 
 type StickyNote = {
-  id: number;
+  id: string;
   title: string;
 };
 
@@ -131,7 +137,7 @@ function EventCreator({
   const handleSave = () => {
     if (targetDate) {
       const newEvent: Event = {
-        id: Date.now(),
+        id: "",
         title,
         start: startTime,
         end: endTime,
@@ -150,13 +156,13 @@ function EventCreator({
   // 選択された日のスケジュールを描画する関数
   const renderDaySchedule = () => {
     // 選択された日のイベントをフィルタリング
-    const dayEvents = events.filter((event) =>
-      isSameDay(event.start, startTime),
+    const dayEvents = events.filter(
+      (event) => event.start && isSameDay(event.start, startTime),
     );
     const hours = Array.from({ length: 24 }, (_, i) => i);
 
-    const sortedEvents = dayEvents.sort(
-      (a, b) => a.start.getTime() - b.start.getTime(),
+    const sortedEvents = dayEvents.sort((a, b) =>
+      a.start && b.start ? a.start.getTime() - b.start.getTime() : 0,
     );
 
     return (
@@ -177,8 +183,13 @@ function EventCreator({
               <span className="w-12 text-xs text-gray-500">{`${hour.toString().padStart(2, "0")}:00`}</span>
               <div className="flex-1 relative">
                 {sortedEvents
-                  .filter((event) => getHours(event.start) === hour)
+                  .filter(
+                    (event) => event.start && getHours(event.start) === hour,
+                  )
                   .map((event, index) => {
+                    if (!event.start || !event.end) {
+                      return <></>;
+                    }
                     const startMinutes = event.start.getMinutes();
                     const duration =
                       (event.end.getTime() - event.start.getTime()) /
@@ -374,6 +385,32 @@ export default function Home() {
     auth.authStateReady().then(() => {
       if (!auth.currentUser) {
         router.push("/signin");
+      } else {
+        readEvents(auth.currentUser.uid).then((events) => {
+          setEvents(
+            events.map((event) => {
+              return {
+                ...event,
+                invitees: event.attendees.join(", "),
+                isTask: false,
+                isLocked: false,
+                category: event.category || "other",
+                priority: event.priority || "medium",
+              };
+            }),
+          );
+        });
+
+        readWantTodos(auth.currentUser.uid).then((todos) => {
+          setStickyNotes(
+            todos.map((todo) => {
+              return {
+                id: todo.id,
+                title: todo.title,
+              };
+            }),
+          );
+        });
       }
     });
   }, [router]);
@@ -393,42 +430,61 @@ export default function Home() {
     {
       icon: Bell,
       label: "通知",
-      onClick: () => setIsNotificationsOpen(!isNotificationsOpen),
+      onClick: () => {
+        return setIsNotificationsOpen(!isNotificationsOpen);
+      },
     },
     { icon: Users, label: "友達", onClick: () => console.log("友達") },
     {
       icon: Download,
       label: "インポート",
-      onClick: () => console.log("インポート"),
+      onClick: () => {
+        if (auth.currentUser) {
+          router.push(
+            `/api/auth/google-cal?userId=${encodeURIComponent(auth.currentUser.uid)}`,
+          );
+        }
+      },
     },
     {
       icon: LogOut,
       label: "ログアウト",
-      onClick: () => console.log("ログアウト"),
+      onClick: async () => {
+        await signOut();
+        router.refresh();
+      },
     },
   ];
 
-  const addStickyNote = () => {
+  const addStickyNote = async () => {
     if (newStickyNote.trim()) {
-      const newNote: StickyNote = { id: Date.now(), title: newStickyNote };
+      const newNote: StickyNote = { id: "", title: newStickyNote };
       setStickyNotes([...stickyNotes, newNote]);
       setNewStickyNote("");
+      if (auth.currentUser) {
+        await createWantTodo(auth.currentUser.uid, newNote);
+      }
     }
   };
 
   const editStickyNote = (note: StickyNote) => {
     setEditingStickyNote(note);
   };
 
-  const updateStickyNote = (updatedNote: StickyNote) => {
+  const updateStickyNote = async (updatedNote: StickyNote) => {
     const updatedNotes = stickyNotes.map((note) =>
       note.id === updatedNote.id ? updatedNote : note,
     );
     setStickyNotes(updatedNotes);
     setEditingStickyNote(null);
+    if (auth.currentUser) {
+      await updateWantTodo(auth.currentUser.uid, updatedNote.id, {
+        title: updatedNote.title,
+      });
+    }
   };
 
-  const deleteStickyNote = (id: number) => {
+  const deleteStickyNote = async (id: string) => {
     const noteToRemove = stickyNotes.find((note) => note.id === id);
     if (noteToRemove) {
       setRemovedStickyNote(noteToRemove);
@@ -437,12 +493,26 @@ export default function Home() {
     if (draggedStickyNote && draggedStickyNote.id === id) {
       setDraggedStickyNote(null);
     }
+    if (auth.currentUser) {
+      await deleteWantTodo(auth.currentUser.uid, id);
+    }
   };
 
-  const addEvent = (newEvent: Event) => {
+  const addEvent = async (newEvent: Event) => {
     setEvents([...events, newEvent]);
     setIsEventModalOpen(false);
     setRemovedStickyNote(null);
+    if (auth.currentUser) {
+      await createEvent(auth.currentUser.uid, {
+        ...newEvent,
+        attendees: newEvent.invitees
+          .split(",")
+          .map((invitee) => invitee.trim()),
+        category: newEvent.category,
+        priority: newEvent.priority,
+        reccurence: [],
+      });
+    }
   };
 
   const getDaysInMonth = (date: Date) => {
@@ -456,7 +526,8 @@ export default function Home() {
   };
 
   const getEventCountForDay = (day: Date) => {
-    return events.filter((event) => isSameDay(event.start, day)).length;
+    return events.filter((event) => event.start && isSameDay(event.start, day))
+      .length;
   };
 
   const getTaskIndicatorStyle = (todoCount: number, eventCount: number) => {
@@ -507,7 +578,9 @@ export default function Home() {
                 const isCurrentMonth = isSameMonth(day, currentMonth);
                 const dayItems = [
                   ...todos.filter((todo) => isSameDay(todo.date, day)),
-                  ...events.filter((event) => isSameDay(event.start, day)),
+                  ...events.filter(
+                    (event) => event.start && isSameDay(event.start, day),
+                  ),
                 ];
 
                 return (

task_yell/src/firebase/firestore.ts

@@ -24,7 +24,7 @@ export async function createData<T extends WithFieldValue<DocumentData>>(
 
 export async function readData<T>(collectionName: string): Promise<T[]> {
   const snapshot = await getDocs(collection(db, collectionName));
-  return snapshot.docs.map((doc) => ({ id: doc.id, ...doc.data() }) as T);
+  return snapshot.docs.map((doc) => ({ ...doc.data(), id: doc.id }) as T);
 }
 
 export async function readSingleData<T>(
@@ -33,7 +33,7 @@ export async function readSingleData<T>(
 ): Promise<T | null> {
   const docRef = doc(db, collectionName, id);
   const snapshot = await getDoc(docRef);
-  return snapshot.exists() ? (snapshot.data() as T) : null;
+  return snapshot.exists() ? { ...(snapshot.data() as T), id: id } : null;
 }
 
 export async function updateData<T>(

task_yell/src/lib/types.ts

@@ -1,27 +1,37 @@
+export type Priority = "low" | "medium" | "high";
+export type Category = "work" | "personal" | "shopping" | "health" | "other";
+
 export interface WantTodo {
+  id: string;
   title: string;
 }
 
 export interface Event {
+  id: string;
   title: string;
   description: string;
   attendees: string[];
   start: Date | null;
   end: Date | null;
-  importance: "high" | "medium" | "low";
-  location: FirebaseFirestore.GeoPoint | null;
+  priority: Priority | null;
+  category: Category | null;
+  location: string | null;
   reccurence: string[];
 }
 
 export interface Task {
+  id: string;
   title: string;
   description: string;
   due: Date;
   importance: "high" | "medium" | "low";
   reccurence: string[];
+  priority: Priority | null;
+  category: Category | null;
 }
 
 export interface Notification {
+  id: string;
   datetime: Date;
   type: "call" | "push";
   eventOrTaskRef: string;