added event todo list

app/(auth)/events/page.tsx

@@ -7,37 +7,40 @@ export default async function EventsPage() {
     console.log(allEvents)
 
     return (
-        <div>
-            Events
-            <div>
-                {allEvents.length == 0 ? (
-                    <>
-                        You don&apos;t have any events yet. <Link href={'/events/create'} className='underline'>Create One!</Link>
-                    </>
-                ) : (
-                    <table className='table-auto w-full'>
-                        <thead>
-                            <tr>
-                                <th>Event Name</th>
-                                <th>Event Date</th>
-                                <th>Created by</th>
-                            </tr>
-                        </thead>
-                        <tbody>
-                            {allEvents.map((item) => (
-                                <tr 
-                                    key={item.id}
-                                    className='text-center'
-                                >
-                                    <td className=''><Link href={`/events/${item.id}`}>{item.name}</Link></td>
-                                    <td className=''>{item.date?.toDateString()}</td>
-                                    <td className=''>{item.creatorId}</td>
-                                </tr>
-                            ))}
-                        </tbody>
-                    </table>
-                )}
+        <div className="max-w-7xl mx-auto px-4 py-10 space-y-6">
+            <div className="flex items-center justify-between">
+                <h1 className="text-3xl font-bold">Your Events</h1>
+                <Link href="/events/create" className="btn btn-primary">
+                    Create Event
+                </Link>
             </div>
+
+            {allEvents.length === 0 ? (
+                <p className="text-lg text-gray-600">
+                    You don&apos;t have any events yet.{' '}
+                    <Link href="/events/create" className="underline text-brand-primary-600">
+                        Create one!
+                    </Link>
+                </p>
+            ) : (
+                <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6">
+                    {allEvents.map(event => (
+                        <Link
+                            href={`/events/${event.id}`}
+                            key={event.id}
+                            className="block bg-white border border-gray-200 hover:shadow-md rounded-lg p-5 transition-all"
+                        >
+                            <h2 className="text-xl font-semibold mb-1">{event.name}</h2>
+                            <p className="text-sm text-gray-600">
+                                {event.date ? new Date(event.date).toLocaleDateString() : 'No date set'}
+                            </p>
+                            <p className="text-sm text-gray-400 mt-2">
+                                Created by: {event.creator?.username || 'Unknown'}
+                            </p>
+                        </Link>
+                    ))}
+                </div>
+            )}
         </div>
     )
 }

app/api/events/[eventId]/todo/[todoId]/route.ts

@@ -0,0 +1,49 @@
+// app/api/events/[eventId]/todos/[todoId]/route.ts
+import { NextRequest, NextResponse } from 'next/server';
+import { mutations } from '@/lib/mutations';
+import { getServerSession } from 'next-auth';
+import { authOptions } from '@/app/api/auth/[...nextauth]/route';
+
+export async function PATCH(
+    req: NextRequest,
+    { params }: { params: { todoId: string; eventId: string } }
+) {
+    const session = await getServerSession(authOptions);
+    if (!session?.user) {
+        return new NextResponse('Unauthorized', { status: 401 });
+    }
+
+    const { name, dueDate, complete } = await req.json();
+
+    try {
+        const updated = await mutations.updateEventTodo(params.todoId, {
+            name,
+            dueDate,
+            complete,
+        });
+
+        return NextResponse.json(updated);
+    } catch (error) {
+        console.error('[UPDATE_TODO]', error);
+        return new NextResponse('Failed to update todo', { status: 500 });
+    }
+}
+
+export async function DELETE(
+    _req: NextRequest,
+    { params }: { params: { todoId: string; eventId: string } }
+) {
+    const session = await getServerSession(authOptions);
+    if (!session?.user) {
+        return new NextResponse('Unauthorized', { status: 401 });
+    }
+
+    try {
+        await mutations.deleteEventTodo(params.todoId);
+        return new NextResponse(null, { status: 204 });
+    } catch (error) {
+        console.error('[DELETE_TODO]', error);
+        return new NextResponse('Failed to delete todo', { status: 500 });
+    }
+}
+

app/api/events/[eventId]/todo/route.ts

@@ -0,0 +1,33 @@
+// app/api/events/[eventId]/todos/route.ts
+import { NextRequest, NextResponse } from 'next/server';
+import { mutations } from '@/lib/mutations';
+import { getServerSession } from 'next-auth';
+import { authOptions } from '@/app/api/auth/[...nextauth]/route';
+
+export async function POST(
+  req: NextRequest,
+  { params }: { params: { eventId: string } }
+) {
+  const session = await getServerSession(authOptions);
+  if (!session?.user) {
+    return new NextResponse('Unauthorized', { status: 401 });
+  }
+
+  const { name, dueDate } = await req.json();
+
+  if (!name) {
+    return NextResponse.json({ message: 'Name is required' }, { status: 400 });
+  }
+
+  try {
+    const todo = await mutations.addTodoToEvent({
+      eventId: params.eventId,
+      name,
+      dueDate,
+    });
+    return NextResponse.json(todo);
+  } catch (error) {
+    console.error('[CREATE_TODO]', error);
+    return new NextResponse('Failed to create todo', { status: 500 });
+  }
+}