diff --git a/src/components/LichessButton.tsx b/src/components/LichessButton.tsx index 648fc5f..ffdc55b 100644 --- a/src/components/LichessButton.tsx +++ b/src/components/LichessButton.tsx @@ -1,8 +1,8 @@ import { useLichessUser } from "#/context/LichessUserContext.tsx"; -import { useLichessOAuth } from "#/hooks/useLichessOAuth.ts"; +import { useLichess } from "#/hooks/useLichess.ts"; const LichessButton = () => { - const { lichessLogin, lichessLogout } = useLichessOAuth(); + const { lichessLogin, lichessLogout } = useLichess(); const { user } = useLichessUser(); const onClickHandler = () => { diff --git a/src/components/LichessStudyUrlInput.tsx b/src/components/LichessStudyUrlInput.tsx new file mode 100644 index 0000000..9eb9fd1 --- /dev/null +++ b/src/components/LichessStudyUrlInput.tsx @@ -0,0 +1,5 @@ +const LichessStudyUrlInput = () => { + return ; +}; + +export default LichessStudyUrlInput; diff --git a/src/components/SelectLichessStudy.tsx b/src/components/SelectLichessStudy.tsx new file mode 100644 index 0000000..febe7d6 --- /dev/null +++ b/src/components/SelectLichessStudy.tsx @@ -0,0 +1,21 @@ +import { useLichess } from "#/hooks/useLichess.ts"; + +const SelectLichessStudy = () => { + const { getLichessUserStudies } = useLichess(); + + const onClickHandler = async () => { + await getLichessUserStudies(); + }; + + return ( + + ); +}; + +export default SelectLichessStudy; diff --git a/src/hooks/useLichessOAuth.ts b/src/hooks/useLichess.ts similarity index 75% rename from src/hooks/useLichessOAuth.ts rename to src/hooks/useLichess.ts index 51d51da..33e4f1c 100644 --- a/src/hooks/useLichessOAuth.ts +++ b/src/hooks/useLichess.ts @@ -6,6 +6,7 @@ import { getSession, getToken, getUser, + getUserStudies, login, logout, setSession, @@ -17,8 +18,8 @@ interface ITokenData { token_type: string; } -export const useLichessOAuth = () => { - const { setUser } = useLichessUser(); +export const useLichess = () => { + const { user, setUser } = useLichessUser(); const loginFn = useServerFn(login); const logoutFn = useServerFn(logout); @@ -26,6 +27,7 @@ export const useLichessOAuth = () => { const getUserFn = useServerFn(getUser); const setSessionFn = useServerFn(setSession); const getSessionFn = useServerFn(getSession); + const getUserStudiesFn = useServerFn(getUserStudies); const lichessAccessToken = async ({ code }: { code: string }) => { return accessTokenFn({ data: { code } }); @@ -34,11 +36,13 @@ export const useLichessOAuth = () => { const setLichessUser = async ({ username, id, + token, }: { username: string; id: string; + token: string; }) => { - await setSessionFn({ data: { username, id } }); + await setSessionFn({ data: { username, id, token } }); setUser({ username, id, isLoggedIn: true }); }; @@ -48,9 +52,7 @@ export const useLichessOAuth = () => { }); }; - const lichessLogin = async () => { - await loginFn(); - }; + const lichessLogin = async () => await loginFn(); const lichessLogout = async () => { await logoutFn(); @@ -70,12 +72,22 @@ export const useLichessOAuth = () => { (async () => { const tokenData = await lichessAccessToken({ code }); const userData = await getLichessUser({ tokenData }); - await setLichessUser({ username: userData.username, id: userData.id }); + + await setLichessUser({ + username: userData.username, + id: userData.id, + token: tokenData.access_token, + }); await navigate({ to: "/chessboard" }); })(); }, [navigate, code]); }; + const getLichessUserStudies = async () => { + if (!user) throw new Error("User not found"); + await getUserStudiesFn(); + }; + return { lichessLogin, lichessLogout, @@ -84,5 +96,6 @@ export const useLichessOAuth = () => { setLichessUser, getLichessSession, useLichessCallback, + getLichessUserStudies, }; }; diff --git a/src/pages/Callback.tsx b/src/pages/Callback.tsx index 045dacb..a3f7fd7 100644 --- a/src/pages/Callback.tsx +++ b/src/pages/Callback.tsx @@ -1,14 +1,14 @@ import { getRouteApi } from "@tanstack/react-router"; -import { useLichessOAuth } from "#/hooks/useLichessOAuth.ts"; +import { useLichess } from "#/hooks/useLichess.ts"; const routeApi = getRouteApi("/callback"); const Callback = () => { - const { useLichessCallback } = useLichessOAuth(); + const { useLichessCallback } = useLichess(); const { code } = routeApi.useSearch(); useLichessCallback({ code }).then(); - return