web auth working

web/src/app/api/auth/sign-in/route.ts

@@ -1,4 +1,6 @@
-import { createAppClient, viemConnector } from '@farcaster/auth-kit';
+import { createAppClient, viemConnector } from '@farcaster/auth-client';
+import { setCurrentUser } from '@lib/auth/setCurrentUser';
+import { randomUUID } from 'crypto';
 import { NextResponse } from 'next/server';
 
 type RequestBody = {
@@ -21,16 +23,16 @@ export async function POST(request: Request) {
     signature,
   });
 
-  if (!verifyResult.success) {
-    return NextResponse.json(verifyResult.error || 'Sign in failed', {
+  if (verifyResult.isError) {
+    return NextResponse.json(verifyResult.error?.message || 'Sign in failed', {
       status: 401,
     });
   }
 
-  const token = window.crypto.randomUUID();
+  const token = randomUUID();
+  const fid = verifyResult.fid.toString();
 
-  return NextResponse.json({
-    id: verifyResult.fid.toString(),
-    token,
-  });
+  setCurrentUser({ token, fid });
+
+  return NextResponse.json({ fid, token });
 }

web/src/app/api/auth/sign-out/route.ts

@@ -0,0 +1,7 @@
+import { clearCurrentUser } from '@lib/auth/clearCurrentUser';
+import { NextResponse } from 'next/server';
+
+export async function POST() {
+  clearCurrentUser();
+  return NextResponse.json({ success: true });
+}

web/src/app/page.tsx

@@ -1,16 +1,17 @@
+import { FeedPage } from '@components/feed/FeedPage';
 import { LandingPage } from '@components/landing/LandingPage';
+import { getCurrentUser } from '@lib/auth/getCurrentUser';
 
 export default async function Home() {
-  // if (session) {
-  //   const {
-  //     user: { fid },
-  //   } = session;
-  //   return (
-  //     <div>
-  //       <FeedPage fid={fid} />
-  //     </div>
-  //   );
-  // }
+  const user = await getCurrentUser();
+
+  if (user) {
+    return (
+      <div>
+        <FeedPage user={user} />
+      </div>
+    );
+  }
 
   return <LandingPage />;
 }

web/src/components/feed/FeedPage.tsx

@@ -1,16 +1,15 @@
-import { Feed } from "@components/feed/Feed";
-import { Nav } from "@components/nav/Nav";
-import { Profile } from "@components/profile/Profile";
-import { getFeed } from "@lib/services/feed";
-import { getProfile } from "@lib/services/user";
+import { Feed } from '@components/feed/Feed';
+import { Nav } from '@components/nav/Nav';
+import { Profile } from '@components/profile/Profile';
+import { getFeed } from '@lib/services/feed';
+import { User } from '@shared/types/models';
 
 type FeedPageProps = {
-  fid: string;
+  user: User;
 };
 
-export async function FeedPage({ fid }: FeedPageProps) {
-  const feed = await getFeed({ fid });
-  const user = await getProfile({ fid });
+export async function FeedPage({ user }: FeedPageProps) {
+  const feed = await getFeed({ fid: user.fid });
 
   return (
     <div className="container m-auto max-w-[660px] border-x border-gray-200">

web/src/components/login/Login.tsx

@@ -9,15 +9,20 @@ import {
 import { useState } from 'react';
 
 async function handleSuccess(res: StatusAPIResponse) {
-  await fetch('/api/auth/sign-in', {
+  const signInresponse = await fetch('/api/auth/sign-in', {
     method: 'POST',
     body: JSON.stringify({
       message: res.message,
+      nonce: res.nonce,
       signature: res.signature,
     }),
   });
 
-  window.location.reload();
+  if (signInresponse.ok) {
+    window.location.reload();
+  } else {
+    alert('Sign in failed');
+  }
 }
 
 export default function Login() {
@@ -39,5 +44,3 @@ export default function Login() {
     </AuthKitProvider>
   );
 }
-
-function Button() {}

web/src/components/logout/Logout.tsx

@@ -1,13 +1,14 @@
 'use client';
 
-import { signOut } from 'next-auth/react';
-
 export default function Logout() {
   return (
     <button
       type="button"
       className="bg-fc-purple cursor-pointer rounded px-4 py-2 text-white"
-      onClick={() => signOut()}
+      onClick={async () => {
+        await fetch('/api/auth/sign-out');
+        window.location.reload();
+      }}
     >
       Sign out
     </button>

web/src/lib/auth/clearCurrentUser.ts

@@ -0,0 +1,14 @@
+import { cookies } from 'next/headers';
+
+import { getTokenFromCookieOrHeader } from './getTokenFromCookieOrHeader';
+import { tokenKey, tokens } from './shared';
+
+export function clearCurrentUser() {
+  const token = getTokenFromCookieOrHeader();
+
+  cookies().delete(tokenKey);
+
+  if (token) {
+    delete tokens[token];
+  }
+}

web/src/lib/auth/getCurrentUser.ts

@@ -0,0 +1,21 @@
+import { getProfile } from '@lib/services/user';
+import { User } from '@shared/types/models';
+
+import { getTokenFromCookieOrHeader } from './getTokenFromCookieOrHeader';
+import { tokens } from './shared';
+
+export async function getCurrentUser(): Promise<User | null> {
+  const token = getTokenFromCookieOrHeader();
+
+  if (!token) {
+    return null;
+  }
+
+  const fid = tokens[token];
+
+  if (!fid) {
+    return null;
+  }
+
+  return getProfile({ fid });
+}

web/src/lib/auth/getTokenFromCookieOrHeader.ts

@@ -0,0 +1,7 @@
+import { cookies, headers } from 'next/headers';
+
+import { tokenKey } from './shared';
+
+export function getTokenFromCookieOrHeader(): string | null {
+  return cookies().get(tokenKey)?.value || headers().get(tokenKey);
+}

web/src/lib/auth/setCurrentUser.ts

@@ -0,0 +1,8 @@
+import { cookies } from 'next/headers';
+
+import { tokenKey, tokens } from './shared';
+
+export function setCurrentUser({ token, fid }: { token: string; fid: string }) {
+  cookies().set(tokenKey, token, { secure: true });
+  tokens[token] = fid;
+}

web/src/lib/auth/shared.ts

@@ -0,0 +1,2 @@
+export const tokenKey = 'token';
+export const tokens: Record<string, string> = {};