重构了translator，写了点数据库、后端api路由

src/app/login/page.tsx

@@ -1,25 +1,42 @@
 "use client";
 
 import LightButton from "@/components/buttons/LightButton";
-import ACard from "@/components/cards/ACard";
-import Input from "@/components/Input";
-import NavbarCenterWrapper from "@/components/NavbarCenterWrapper";
-import { useRef } from "react";
+import { Center } from "@/components/Center";
+import IMAGES from "@/config/images";
+import { signIn, useSession } from "next-auth/react";
+import Image from "next/image";
+import { useRouter, useSearchParams } from "next/navigation";
+import { useEffect } from "react";
 
-export default function Login() {
-  const usernameRef = useRef<HTMLInputElement>(null);
-  const passwordRef = useRef<HTMLInputElement>(null);
+export default function LoginPage() {
+  const session = useSession();
+  const router = useRouter();
+  const searchParams = useSearchParams();
+
+  useEffect(() => {
+    if (session.status === "authenticated") {
+      router.push(searchParams.get("redirect") || "/");
+    }
+  }, [session.status, router, searchParams]);
 
   return (
-    <NavbarCenterWrapper>
-      <ACard className="md:border-2 border-gray-200 flex items-center justify-center flex-col gap-8">
-        <h1 className="text-2xl md:text-4xl font-bold">Login</h1>
-        <form className="flex flex-col gap-2 md:text-xl">
-          <Input ref={usernameRef} placeholder="username" type="text" />
-          <Input ref={passwordRef} placeholder="password" type="password" />
-          <LightButton>Submit</LightButton>
-        </form>
-      </ACard>
-    </NavbarCenterWrapper>
+    <Center>
+      {session.status === "loading" ? (
+        <div>Loading...</div>
+      ) : (
+        <LightButton
+          className="flex flex-row p-2 gap-2"
+          onClick={() => signIn("github")}
+        >
+          <Image
+            src={IMAGES.github_mark}
+            alt="GitHub Logo"
+            width={32}
+            height={32}
+          />
+          <span>GitHub Login</span>
+        </LightButton>
+      )}
+    </Center>
   );
 }