diff --git a/src/components/LichessButton.tsx b/src/components/LichessButton.tsx index 645c90e..648fc5f 100644 --- a/src/components/LichessButton.tsx +++ b/src/components/LichessButton.tsx @@ -3,7 +3,7 @@ import { useLichessOAuth } from "#/hooks/useLichessOAuth.ts"; const LichessButton = () => { const { lichessLogin, lichessLogout } = useLichessOAuth(); - const { user, setUser, logout } = useLichessUser(); + const { user } = useLichessUser(); const onClickHandler = () => { return user?.isLoggedIn ? lichessLogout() : lichessLogin(); diff --git a/src/context/LichessUserContext.tsx b/src/context/LichessUserContext.tsx index 26e8b16..809dc0c 100644 --- a/src/context/LichessUserContext.tsx +++ b/src/context/LichessUserContext.tsx @@ -1,12 +1,17 @@ +import { useServerFn } from "@tanstack/react-start"; + import { createContext, type Dispatch, type ReactNode, type SetStateAction, useContext, + useEffect, useState, } from "react"; +import { getSession } from "#/server/lichess.ts"; + interface ILichessUser { username: string; id: string; @@ -15,7 +20,7 @@ interface ILichessUser { interface ILichessUserContextType { user: ILichessUser | null; - setUser: Dispatch> + setUser: Dispatch>; } const LichessUserContext = createContext( @@ -24,8 +29,20 @@ const LichessUserContext = createContext( export const LichessUserProvider = ({ children }: { children: ReactNode }) => { const [user, setUser] = useState(null); + const getSessionFn = useServerFn(getSession); - // TODO useEffect to check and login user on mount + useEffect(() => { + (async () => { + const session = await getSessionFn(); + if (session) { + setUser({ + username: session.username, + id: session.id, + isLoggedIn: true, + }); + } + })(); + }, [getSessionFn]); return ( diff --git a/src/hooks/useLichessOAuth.ts b/src/hooks/useLichessOAuth.ts index 7cc4d03..1b37e2a 100644 --- a/src/hooks/useLichessOAuth.ts +++ b/src/hooks/useLichessOAuth.ts @@ -1,6 +1,13 @@ import { useServerFn } from "@tanstack/react-start"; import { useLichessUser } from "#/context/LichessUserContext.tsx"; -import { getToken, getUser, login, setSession, logout } from "#/server/lichess.ts"; +import { + getSession, + getToken, + getUser, + login, + logout, + setSession, +} from "#/server/lichess.ts"; interface ITokenData { access_token: string; @@ -12,10 +19,11 @@ export const useLichessOAuth = () => { const { setUser } = useLichessUser(); const loginFn = useServerFn(login); - const logoutFn = useServerFn(logout) + const logoutFn = useServerFn(logout); const accessTokenFn = useServerFn(getToken); const getUserFn = useServerFn(getUser); const setSessionFn = useServerFn(setSession); + const getSessionFn = useServerFn(getSession); const lichessAccessToken = async ({ code }: { code: string }) => { return accessTokenFn({ data: { code } }); @@ -50,11 +58,16 @@ export const useLichessOAuth = () => { setUser(null); }; + const getLichessSession = async () => { + return getSessionFn(); + }; + return { lichessLogin, lichessLogout, lichessAccessToken, getLichessUser, setLichessUser, + getLichessSession, }; }; diff --git a/src/server/lichess.ts b/src/server/lichess.ts index 6f3862f..2b2bc46 100644 --- a/src/server/lichess.ts +++ b/src/server/lichess.ts @@ -1,7 +1,11 @@ import { randomBytes } from "node:crypto"; import { redirect } from "@tanstack/react-router"; import { createServerFn } from "@tanstack/react-start"; -import { getCookie, setCookie, deleteCookie } from "@tanstack/react-start/server"; +import { + deleteCookie, + getCookie, + setCookie, +} from "@tanstack/react-start/server"; import { env } from "#/env.ts"; import { base64UrlEncode, sha256 } from "#/lib/encodeDecode.ts"; @@ -13,13 +17,12 @@ const getRedirectUri = () => ? `https://${env.LICHESS_CLIENT_ID}/callback` : "http://localhost:3000/callback"; -// TODO fix and check export const getSession = createServerFn({ method: "GET" }).handler( async () => { const session = getCookie("lichess-session"); if (!session) return null; try { - return JSON.parse(session) as { username: string }; + return JSON.parse(session) as { username: string; id: string }; } catch { return null; }