test hf signin

app/api/login/route.ts

@@ -0,0 +1,10 @@
+export async function GET(request: Request) {
+  console.log(process.env)
+  return Response.json(
+    {
+      redirect: `https://huggingface.co/oauth/authorize?redirect_uri=${process.env.REDIRECT_URI}&scope=openid%20profile&client_id=${process.env.CLIENT_ID}&state=${process.env.STATE}`,
+      status: 200,
+      ok: true
+    }
+  )
+}

components/main/index.tsx

@@ -30,6 +30,12 @@ export const Main = () => {
   const [category, setCategory] = useState<string>("community");
   const [advancedSettings, setAdvancedSettings] = useState<boolean>(false);
 
+  const openLogin = async () => {
+    const response = await fetch(`/api/login`);
+    const data = await response.json();
+    console.log(data);
+  };
+
   return (
     <main className="px-6 z-[2] relative max-w-[1722px] mx-auto">
       <div className="py-2 pl-2 pr-2 lg:pr-4 bg-black bg-opacity-30 backdrop-blur-sm lg:sticky lg:top-4 z-10 rounded-full">
@@ -38,15 +44,7 @@ export const Main = () => {
           <div className="items-center justify-center lg:justify-end gap-5 w-full mt-6 lg:mt-0 hidden lg:flex">
             {categories.map(({ key, label, icon, isLogged }) =>
               isLogged && !user ? (
-                <Button
-                  key={key}
-                  theme="white"
-                  onClick={() =>
-                    console.log(
-                      `https://huggingface.co/oauth/authorize?redirect_uri=${process.env.REDIRECT_URI}&scope=openid%20profile&client_id=${process.env.CLIENT_ID}&state=${process.env.STATE}`
-                    )
-                  }
-                >
+                <Button key={key} theme="white" onClick={openLogin}>
                   Sign in with Hugging Face
                 </Button>
               ) : (