implement currentUser store
This commit is contained in:
parent
6ab8db31c3
commit
2b5a80a032
3 changed files with 14 additions and 10 deletions
|
@ -1,11 +1,11 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { get_session_token } from "$lib/auth";
|
import { get_session_token } from "$lib/auth";
|
||||||
|
import { currentUser } from "$lib/stores/current_user";
|
||||||
|
|
||||||
import { onMount } from "svelte";
|
import { onMount } from "svelte";
|
||||||
|
|
||||||
let user = null;
|
|
||||||
|
|
||||||
onMount(async () => {
|
onMount(async () => {
|
||||||
|
// TODO: currentUser won't be set if the navbar component is not created.
|
||||||
const session_token = get_session_token();
|
const session_token = get_session_token();
|
||||||
if (!session_token) {
|
if (!session_token) {
|
||||||
return;
|
return;
|
||||||
|
@ -23,19 +23,20 @@
|
||||||
throw response.statusText;
|
throw response.statusText;
|
||||||
}
|
}
|
||||||
|
|
||||||
user = await response.json();
|
const user = await response.json();
|
||||||
|
currentUser.set(user);
|
||||||
});
|
});
|
||||||
|
|
||||||
function signOut() {
|
function signOut() {
|
||||||
// TODO: destroy session on server
|
// TODO: destroy session on server
|
||||||
user = null;
|
currentUser.set(null);
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div class="user-controls">
|
<div class="user-controls">
|
||||||
{#if user}
|
{#if $currentUser}
|
||||||
<div class="current-user-name">
|
<div class="current-user-name">
|
||||||
{user["username"]}
|
{$currentUser["username"]}
|
||||||
</div>
|
</div>
|
||||||
<div class="sign-out" on:click={signOut}>Sign out</div>
|
<div class="sign-out" on:click={signOut}>Sign out</div>
|
||||||
{:else}
|
{:else}
|
||||||
|
|
3
web/pw-server/src/lib/stores/current_user.ts
Normal file
3
web/pw-server/src/lib/stores/current_user.ts
Normal file
|
@ -0,0 +1,3 @@
|
||||||
|
import { writable } from "svelte/store";
|
||||||
|
|
||||||
|
export const currentUser = writable(null);
|
|
@ -1,6 +1,7 @@
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { get_session_token, set_session_token } from "$lib/auth";
|
import { get_session_token, set_session_token } from "$lib/auth";
|
||||||
import { goto } from "$app/navigation";
|
import { goto } from "$app/navigation";
|
||||||
|
import { currentUser } from "$lib/stores/current_user";
|
||||||
|
|
||||||
let username: string | undefined;
|
let username: string | undefined;
|
||||||
let password: string | undefined;
|
let password: string | undefined;
|
||||||
|
@ -24,7 +25,8 @@
|
||||||
let token = response.headers.get("Token");
|
let token = response.headers.get("Token");
|
||||||
set_session_token(token);
|
set_session_token(token);
|
||||||
|
|
||||||
let user = await response.json();
|
const user = await response.json();
|
||||||
|
currentUser.set(user);
|
||||||
|
|
||||||
goto("/");
|
goto("/");
|
||||||
}
|
}
|
||||||
|
@ -35,7 +37,6 @@
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
<div class="page-card">
|
<div class="page-card">
|
||||||
<div class="page-card-content">
|
<div class="page-card-content">
|
||||||
<h1 class="page-card-header">Sign in</h1>
|
<h1 class="page-card-header">Sign in</h1>
|
||||||
|
@ -49,7 +50,6 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
@import "src/styles/account_forms.scss";
|
@import "src/styles/account_forms.scss";
|
||||||
</style>
|
</style>
|
||||||
|
|
Loading…
Reference in a new issue