添加API，读取数据库

app/(main)/(routes)/servers/[serverId]/page.tsx

@@ -0,0 +1,5 @@
+const ServerIdPage = async () => {
+  return <div>serveridpage</div>;
+};
+
+export default ServerIdPage;

app/api/servers/route.ts

@@ -0,0 +1,37 @@
+import { v4 as uuidv4 } from 'uuid';
+import { NextResponse } from 'next/server';
+import { MemberRole } from '@prisma/client';
+
+import { currentProfile } from '@/lib/current-profile';
+import { db } from '@/lib/db';
+
+export async function POST(req: Request) {
+  try {
+    const { name, imageUrl } = await req.json();
+    const profile = await currentProfile();
+
+    if (!profile) {
+      return new NextResponse('Unauthorized', { status: 401 });
+    }
+
+    const server = await db.server.create({
+      data: {
+        profileId: profile.id,
+        name,
+        imageUrl,
+        inviteCode: uuidv4(),
+        channels: {
+          create: [{ name: 'general', profileId: profile.id }],
+        },
+        members: {
+          create: [{ profileId: profile.id, role: MemberRole.ADMIN }],
+        },
+      },
+    });
+
+    return NextResponse.json(server);
+  } catch (error) {
+    console.log('[SERVERS_POST]', error);
+    return new NextResponse('Internal Error', { status: 500 });
+  }
+}

components/modals/initial-modal.tsx

@@ -1,5 +1,6 @@
 'use client';
 
+import axios from 'axios';
 import * as z from 'zod';
 import { zodResolver } from '@hookform/resolvers/zod';
 import { useForm } from 'react-hook-form';
@@ -24,6 +25,7 @@ import { Input } from '../ui/input';
 import { Button } from '../ui/button';
 import { useEffect, useState } from 'react';
 import { FileUpload } from '../file-uploader';
+import { useRouter } from 'next/navigation';
 
 const formSchema = z.object({
   name: z.string().min(1, {
@@ -36,6 +38,7 @@ const formSchema = z.object({
 
 export const InitialModal = () => {
   const [IsMounted, setIsMounted] = useState(false);
+  const router = useRouter();
 
   useEffect(() => {
     setIsMounted(true);
@@ -51,12 +54,16 @@ export const InitialModal = () => {
   const isLoading = form.formState.isSubmitting;
 
   const onSubmit = async (values: z.infer<typeof formSchema>) => {
-    console.log(values);
-  };
+    try {
+      await axios.post('/api/servers', values);
 
-  if (!IsMounted) {
-    return null;
-  }
+      form.reset();
+      router.refresh();
+      window.location.reload();
+    } catch (error) {
+      console.log(error);
+    }
+  };
 
   return (
     <Dialog open>

lib/current-profile.ts

@@ -0,0 +1,19 @@
+import { auth } from '@clerk/nextjs';
+
+import { db } from '@/lib/db';
+
+export const currentProfile = async () => {
+  const { userId } = auth();
+
+  if (!userId) {
+    return null;
+  }
+
+  const profile = await db.profile.findUnique({
+    where: {
+      userId,
+    },
+  });
+
+  return profile;
+};