diff --git a/mobile/src/contexts/AuthProvider.tsx b/mobile/src/contexts/AuthProvider.tsx index ba836d2..67e2521 100644 --- a/mobile/src/contexts/AuthProvider.tsx +++ b/mobile/src/contexts/AuthProvider.tsx @@ -16,12 +16,18 @@ import { Linking } from 'react-native'; const AuthContext = createContext<{ currentUser: User | undefined; isSignedIn: boolean; - signIn: () => Promise; + requestSignIn: () => Promise; + signOut: () => Promise; token: string | undefined; }>({ currentUser: undefined, isSignedIn: false, - signIn: async () => { + requestSignIn: async () => { + throw new Error( + 'You need to add an AuthProvider to the top of your React tree.', + ); + }, + signOut: async () => { throw new Error( 'You need to add an AuthProvider to the top of your React tree.', ); @@ -43,7 +49,7 @@ type State = { type Action = | { type: 'initWitUser'; session: Session; user: User } | { type: 'initWithoutUser' } - | { type: 'signIn' } + | { type: 'signIn'; session: Session; user: User } | { type: 'signOut' }; const initialState: State = { @@ -55,13 +61,21 @@ const initialState: State = { function reducer(state: State, action: Action): State { switch (action.type) { case 'initWitUser': - return { isInitialized: true, session: action.session }; + return { + currentUser: action.user, + isInitialized: true, + session: action.session, + }; case 'initWithoutUser': - return { isInitialized: true, session: undefined }; + return { + currentUser: undefined, + isInitialized: true, + session: undefined, + }; case 'signIn': - return { ...state }; + return { ...state, currentUser: action.user, session: action.session }; case 'signOut': - return { ...state }; + return { ...state, session: undefined, currentUser: undefined }; } return state; } @@ -79,12 +93,32 @@ function AuthProviderContent({ children }: AuthProviderProps) { url, signIn: authKitSignIn, } = useSignIn({ - onSuccess: (res) => { - // setToken(res); + onSuccess: async (res) => { + const signInResponse = await fetch( + 'http://localhost:3000/api/auth/sign-in', + { + method: 'POST', + body: JSON.stringify({ + message: res.message, + nonce: res.nonce, + signature: res.signature, + }), + }, + ); + + if (signInResponse.ok) { + const { token, fid }: { token: string; fid: string } = + await signInResponse.json(); + + const { profile: user } = await fetchProfile({ fid }); + dispatch({ type: 'signIn', session: { token, fid }, user }); + } else { + alert('Sign in failed'); + } }, }); - const signIn = useCallback(async () => { + const requestSignIn = useCallback(async () => { if (!url) { throw new Error('Expected authkit to provide url'); } @@ -96,6 +130,10 @@ function AuthProviderContent({ children }: AuthProviderProps) { } }, [authKitSignIn, connect, url]); + const signOut = useCallback(async () => { + await fetch('http://localhost:3000/api/auth/sign-out', { method: 'POST' }); + }, []); + const init = useCallback(async () => { const persistedSessionJson = await SecureStore.getItemAsync('session'); @@ -132,7 +170,8 @@ function AuthProviderContent({ children }: AuthProviderProps) { value={{ currentUser: state.currentUser, isSignedIn: !!state.session, - signIn, + requestSignIn, + signOut, token: state.session?.token, }} > diff --git a/mobile/src/screens/FeedScreen.tsx b/mobile/src/screens/FeedScreen.tsx index f57e1de..2d8e3c6 100644 --- a/mobile/src/screens/FeedScreen.tsx +++ b/mobile/src/screens/FeedScreen.tsx @@ -1,4 +1,5 @@ import { Cast } from '@mobile/components/feed/Cast'; +import { useAuth } from '@mobile/contexts/AuthProvider'; import { useFeed, useFetchFeed } from '@mobile/hooks/data/feed'; import { buildScreen } from '@mobile/utils/buildScreen'; import { Cast as CastType } from '@shared/types/models'; @@ -10,18 +11,19 @@ function renderItem({ item }: { item: CastType }) { } export const FeedScreen = buildScreen(() => { - const { feed } = useFeed({ fid }); + const { currentUser } = useAuth(); + const { feed } = useFeed({ fid: currentUser!.fid }); const fetchFeed = useFetchFeed(); const [isRefreshing, setIsRefreshing] = useState(false); const onRefresh = useCallback(async () => { try { setIsRefreshing(true); - await fetchFeed({ fid }); + await fetchFeed({ fid: currentUser!.fid }); } finally { setIsRefreshing(false); } - }, [fetchFeed]); + }, [currentUser, fetchFeed]); return ( { - const { signIn } = useAuth(); + const { requestSignIn } = useAuth(); const [isSigningIn, setIsSigningIn] = useState(false); return ( @@ -15,7 +15,7 @@ export const LandingScreen = buildScreen(() => { setIsSigningIn(true); try { - await signIn(); + await requestSignIn(); } catch (error) { console.error(error); } finally { diff --git a/web/src/components/login/Login.tsx b/web/src/components/login/Login.tsx index 528a4bc..07e2d7d 100644 --- a/web/src/components/login/Login.tsx +++ b/web/src/components/login/Login.tsx @@ -9,7 +9,7 @@ import { import { useState } from 'react'; async function handleSuccess(res: StatusAPIResponse) { - const signInresponse = await fetch('/api/auth/sign-in', { + const signInResponse = await fetch('/api/auth/sign-in', { method: 'POST', body: JSON.stringify({ message: res.message, @@ -18,7 +18,7 @@ async function handleSuccess(res: StatusAPIResponse) { }), }); - if (signInresponse.ok) { + if (signInResponse.ok) { window.location.reload(); } else { alert('Sign in failed');