removed the userStore, didn't make sense and now we don't even need to use local storage so no security vulnerability, cool, oh and everything still works

This commit is contained in:
Me
2022-12-07 18:49:31 +01:00
parent 6c3cad3b3d
commit 59bc893173
8 changed files with 27 additions and 59 deletions

View File

@@ -2,32 +2,19 @@
import Canvas from "../pieces/Canvas.svelte"; import Canvas from "../pieces/Canvas.svelte";
import { push } from "svelte-spa-router"; import { push } from "svelte-spa-router";
import { onMount } from 'svelte'; import { onMount } from 'svelte';
import { userStore, userLogout } from '../stores/loginStatusStore.js';
import { get } from "svelte/store"; import { get } from "svelte/store";
let user;
onMount(async () => { onMount(async () => {
// console.log('SplashPage testing if logged in') user = await fetch('http://transcendance:8080/api/v2/user')
// hold on, maybe this is all i need?
let user = await fetch('http://transcendance:8080/api/v2/user')
.then((resp) => resp.json()) .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...
// Testing Svelet get(store) // i mean i could do a failed to load user or some shit, maybe with a .catch or something? but atm why bother
// let tmp = get(userStore); console.log('User var');
// console.log('in SplashPage get(store)') console.log(user);
// console.log(tmp)
// 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) { // if (user && user.statusCode && user.statusCode === 403) {
// console.log('user not logged in') // console.log('user not logged in')
// } // }
@@ -39,24 +26,14 @@
// if (user === undefined) { // if (user === undefined) {
if (user && user.statusCode && user.statusCode === 403) { if (user && user.statusCode && user.statusCode === 403) {
console.log('on mount no user, returned status code 403 so logging out of userStore') 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 // userLogout(); // which i think should delete any previous local storage
} }
// in theory now we should be logged in...
}); });
const login = async() => { const login = async() => {
window.location.href = 'http://transcendance:8080/api/v2/auth'; window.location.href = 'http://transcendance:8080/api/v2/auth';
// await fetch ('http://transcendance:8080/api/v2/auth');
console.log('you are now logged in'); console.log('you are now logged in');
await fetch('http://transcendance:8080/api/v2/user')
.then((resp) => resp.json())
.then((data) => userStore.set(data));
// .then((data) => void userStore.set(data));
// decide if do this here on in backend
// push('/profile');
} }
// 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 // 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
@@ -65,8 +42,7 @@
await fetch('http://transcendance:8080/api/v2/auth/logout', { await fetch('http://transcendance:8080/api/v2/auth/logout', {
method: 'POST', method: 'POST',
}); });
// loginStatus.allFalse() user = undefined;
userLogout();
}; };
</script> </script>
@@ -75,7 +51,8 @@
<header class="grid-container"> <header class="grid-container">
<h1>Potato Pong</h1> <h1>Potato Pong</h1>
<nav> <nav>
{#if $userStore !== null} <!-- {#if user !== undefined} -->
{#if user && user.username}
<div on:click={ () => (push('/profile')) }>Profile</div> <div on:click={ () => (push('/profile')) }>Profile</div>
<div on:click={logout}>Logout</div> <div on:click={logout}>Logout</div>
{:else} {:else}

View File

@@ -1,8 +1,19 @@
<script lang="ts"> <script lang="ts">
import { replace } from "svelte-spa-router";
</script> </script>
<div class="wrapper">
<h1>You made it to Test</h1>
<button on:click={ () => (replace('/'))}>Go Home</button>
</div>
<h1>you made it to test</h1> <style>
div.wrapper{
display: flexbox;
align-items: center;
}
</style>

View File

@@ -1,7 +1,7 @@
<script lang="ts"> <script lang="ts">
import { onMount } from "svelte"; import { onMount } from "svelte";
import { push } from "svelte-spa-router"; import { push } from "svelte-spa-router";
import { userStore, userLogout } from "../stores/loginStatusStore"; import { userStore, userLogout } from "../../old_unused/loginStatusStore";
// onMount( async() => { // onMount( async() => {
// await fetch("http://transcendance:8080/api/v2/auth/2fa/generate", // await fetch("http://transcendance:8080/api/v2/auth/2fa/generate",
@@ -19,7 +19,6 @@
let qrCodeImg; let qrCodeImg;
let qrCode = ""; let qrCode = "";
let wrongCode = ""; let wrongCode = "";
// max try doesn't work if you reste the page
const fetchQrCodeImg = (async() => { const fetchQrCodeImg = (async() => {
await fetch("http://transcendance:8080/api/v2/auth/2fa/generate", await fetch("http://transcendance:8080/api/v2/auth/2fa/generate",
{ {
@@ -48,7 +47,6 @@
wrongCode = `Wrong code`; wrongCode = `Wrong code`;
} }
if (response.status === 200) { if (response.status === 200) {
// userLogout();
push('/profile'); push('/profile');
console.log('vaid Code for 2FA') console.log('vaid Code for 2FA')
} }
@@ -66,7 +64,6 @@
<!-- What the hell is data? ask Cherif --> <!-- What the hell is data? ask Cherif -->
<img src={qrCodeImg} alt="A QRCodeImg you must scan with google authenticator" id="qrcodeImg" /> <img src={qrCodeImg} alt="A QRCodeImg you must scan with google authenticator" id="qrcodeImg" />
<form on:submit|preventDefault={submitCode}> <form on:submit|preventDefault={submitCode}>
<!-- <label for="code">Input Code</label> -->
<input id="code" bind:value={qrCode} type="text" placeholder="Input Code"/> <input id="code" bind:value={qrCode} type="text" placeholder="Input Code"/>
<button type="submit">Send</button> <button type="submit">Send</button>
</form> </form>

View File

@@ -1,8 +1,5 @@
<script lang="ts"> <script lang="ts">
import { replace } from "svelte-spa-router"; import { replace } from "svelte-spa-router";
</script> </script>
<div class="wrapper"> <div class="wrapper">
@@ -17,10 +14,4 @@
align-items: center; align-items: center;
} }
button{
/* cursor: pointer;
font-weight: bold; */
/* rounder edges or something */
}
</style> </style>

View File

@@ -1,10 +1,7 @@
<script lang="ts"> <script lang="ts">
import Header from "../../pieces/Header.svelte"; import Header from "../../pieces/Header.svelte";
import Footer from "../../pieces/Footer.svelte"; import Router from "svelte-spa-router";
// import { createEventDispatcher } from "svelte";
import { push } from "svelte-spa-router";
import Router, { link } from "svelte-spa-router";
import { profileRoutes, prefix } from "../../routes/profileRoutes.js"; import { profileRoutes, prefix } from "../../routes/profileRoutes.js";
// let dispatch = createEventDispatcher(); // let dispatch = createEventDispatcher();

View File

@@ -6,8 +6,7 @@
import Button from '../../pieces/Button.svelte'; import Button from '../../pieces/Button.svelte';
let user; let user;
let avatar, postVar, newAvatar; let avatar, newAvatar;
// postVar means nothing can i get rid of it or do i need it to do something...
let uploadAvatarSuccess = false; let uploadAvatarSuccess = false;
// tbh i might not need this... // tbh i might not need this...

View File

@@ -1,7 +1,6 @@
<script lang="ts"> <script lang="ts">
import { push } from "svelte-spa-router"; import { push } from "svelte-spa-router";
import { location } from 'svelte-spa-router'; import { location } from 'svelte-spa-router';
import { userStore, userLogout } from "../stores/loginStatusStore.js";
import active from 'svelte-spa-router/active' import active from 'svelte-spa-router/active'
// or i could leave them all and not display if they're active? // or i could leave them all and not display if they're active?
@@ -11,11 +10,8 @@
await fetch('http://transcendance:8080/api/v2/auth/logout', { await fetch('http://transcendance:8080/api/v2/auth/logout', {
method: 'POST', method: 'POST',
}) })
.then( () => userLogout() ) // i think for TS reasons it has to be a func not direclty push('/') or whatever .then( () => push('/') ) // i think for TS reasons it has to be a func not direclty push('/') or whatever
.then( () => push('/') )
console.log('clicked logout header') console.log('clicked logout header')
// userLogout();
// push('/'); // replace?
}; };
</script> </script>