diff --git a/srcs/requirements/svelte/api_front/src/pages/SplashPage.svelte b/srcs/requirements/svelte/api_front/src/pages/SplashPage.svelte index 64566078..ad1be730 100644 --- a/srcs/requirements/svelte/api_front/src/pages/SplashPage.svelte +++ b/srcs/requirements/svelte/api_front/src/pages/SplashPage.svelte @@ -3,30 +3,70 @@ import { push } from "svelte-spa-router"; import { onMount } from 'svelte'; import { loginStatus } from '../stores/loginStatusStore.js'; + import { userStore, userLogout } from '../stores/loginStatusStore.js'; + // go over agian in detail to make sure this actually does what you want // it needs some work, seems confused a lot of the time... onMount(async () => { console.log('SplashPage testing if logged in') + // let user = await fetch('http://transcendance:8080/api/v2/user') + // .then((resp) => resp.json()) + // if (user) { + // if (!user.isEnabledTwoFactorAuth) { + // loginStatus.update( (old) => ({...old, tfa: true}) ); + // } + // // because the User will only exist if they're logged in to 42? + // loginStatus.update( (old) => ({...old, fortyTwo: true}) ); + // if (user.isEnabledTwoFactorAuth && $loginStatus.tfa) + // push('/profile'); + // // They have to click Login if using tfa and tfa no already done + // } + + // hold on, maybe this is all i need? let user = await fetch('http://transcendance:8080/api/v2/user') - .then((resp) => resp.json()) - if (user) { - if (!user.isEnabledTwoFactorAuth) { - loginStatus.update( (old) => ({...old, tfa: true}) ); - } - // because the User will only exist if they're logged in to 42? - loginStatus.update( (old) => ({...old, fortyTwo: true}) ); - if (user.isEnabledTwoFactorAuth && $loginStatus.tfa) - push('/profile'); - // They have to click Login if using tfa and tfa no already done + .then((resp) => resp.json()) + // .then((data) => void userStore.set(data)) // this returns void so local var user is undefined... + // .catch( userLogout(); ) + // yea ok i don't know how to use catch... + + // userStore.set(user); + // console.log('user in userStore'); + // console.log($userStore); + // console.log('now user in the local var'); + // console.log(user); + // if (user && user.statusCode && user.statusCode === 403) { + // console.log('user not logged in') + // } + // if (user && user.username) { + // console.log('we have a user'); + // } + + + // to clean up local storage... as a precaution + // this condition isn't good enough... + if (user && user.statusCode && user.statusCode === 403) { + console.log('on mount no user, returned status code 403 so logging out of userStore') + userLogout(); // which i think should delete any previous local storage } + + // in theory now we should be logged in... }); - const login = async() => { - window.location.href = 'http://transcendance:8080/api/v2/auth'; - // await fetch ('http://transcendance:8080/api/v2/auth'); + const login = async() => { + window.location.href = 'http://transcendance:8080/api/v2/auth'; + // await fetch ('http://transcendance:8080/api/v2/auth'); console.log('you are now logged in'); - loginStatus.allTrue(); + + // ok giving our new local storage and store combo a go + // what i need is to set the store to the user when this button get's pressed + // since there's no apparent return i guess i'll just fetch the user? + + await fetch('http://transcendance:8080/api/v2/user') + .then((resp) => resp.json()) + .then((data) => void userStore.set(data)); + + // loginStatus.allTrue(); // this is redundant if TFA is on because they would only get back here after going through the TFA which sets it to True // $loginStatus.tfa = true; // also it doesn't do anything cuz no .update() @@ -34,41 +74,43 @@ // push('/profile'); // idk why this doesn't work, seems really weird, maybe it's an awit thing? // Maybe it would be better to do it in the Backend? - } + } +// i could prolly put this in it's own compoent, i seem to use it in several places... or maybe just some JS? like no need for html const logout = async() => { await fetch('http://transcendance:8080/api/v2/auth/logout', { method: 'POST', }); - loginStatus.allFalse() + // loginStatus.allFalse() + userLogout(); }; - +

Potato Pong

-

Welcome to
Potato Pong
diff --git a/srcs/requirements/svelte/api_front/src/pages/TmpTestPage.svelte b/srcs/requirements/svelte/api_front/src/pages/TmpTestPage.svelte new file mode 100644 index 00000000..3f18e60e --- /dev/null +++ b/srcs/requirements/svelte/api_front/src/pages/TmpTestPage.svelte @@ -0,0 +1,8 @@ + + + +

you made it to test

\ No newline at end of file diff --git a/srcs/requirements/svelte/api_front/src/pieces/Header.svelte b/srcs/requirements/svelte/api_front/src/pieces/Header.svelte index 41627def..e2cc2c5f 100644 --- a/srcs/requirements/svelte/api_front/src/pieces/Header.svelte +++ b/srcs/requirements/svelte/api_front/src/pieces/Header.svelte @@ -2,6 +2,7 @@ import { push } from "svelte-spa-router"; import { location } from 'svelte-spa-router'; import { loginStatus } from "../stores/loginStatusStore.js"; + import { userStore, userLogout } from "../stores/loginStatusStore.js"; import active from 'svelte-spa-router/active' // or i could leave them all and not display if they're active? @@ -13,6 +14,7 @@ method: 'POST', }); console.log('clicked logout header') + userLogout(); // $loginStatus = false; push('/'); diff --git a/srcs/requirements/svelte/api_front/src/routes/primaryRoutes.js b/srcs/requirements/svelte/api_front/src/routes/primaryRoutes.js index fd9ba911..aba904fd 100644 --- a/srcs/requirements/svelte/api_front/src/routes/primaryRoutes.js +++ b/srcs/requirements/svelte/api_front/src/routes/primaryRoutes.js @@ -7,6 +7,10 @@ import { loginStatus } from "../stores/loginStatusStore"; import { wrap } from 'svelte-spa-router/wrap' import { get } from 'svelte/store'; +import TestPage from '../pages/TmpTestPage.svelte'; +import { userStore, userLogout } from "../stores/loginStatusStore"; + + // "/article/:title": Article, // this is how you would do parameters! // "/": LoginPage, @@ -85,6 +89,21 @@ import { get } from 'svelte/store'; export const primaryRoutes = { "/": SplashPage, + '/test': wrap({ + component: TestPage, + conditions: [ + (detail) => { + const user = get(userStore); + // console.log(fortyTwo); + // console.log(tfa); + // return true; + if (user) + return true; + else + return false; + } + ] + }), '/2fa': TwoFactorAuthentication, "/profile": ProfilePage, "/profile/*": ProfilePage, diff --git a/srcs/requirements/svelte/api_front/src/stores/loginStatusStore.js b/srcs/requirements/svelte/api_front/src/stores/loginStatusStore.js index 8ea5a8a7..98a32894 100644 --- a/srcs/requirements/svelte/api_front/src/stores/loginStatusStore.js +++ b/srcs/requirements/svelte/api_front/src/stores/loginStatusStore.js @@ -42,16 +42,16 @@ export const loginStatus = createLoginStatus(); let _user = localStorage.getItem('42User'); -export const store = writable(_user ? JSON.parse(_user) : null); // we start with no user, but go get one if one exists +export const userStore = writable(_user ? JSON.parse(_user) : null); // we start with no user, but go get one if one exists // ok so this will happen no matter what, basically we are telling it what to do if the store containing the user changes -store.subscribe((value) => { +userStore.subscribe((value) => { if (value) localStorage.setItem('42User', JSON.stringify(value)); else localStorage.removeItem('42User'); // for logout }); -export const logout = () => store.set(null); +export const userLogout = () => userStore.set(null); // ok this is the part where i need to use our API rather than Auth // export async function signUp(username, password, email) {