aboutsummaryrefslogtreecommitdiff
path: root/web/pw-server/src/lib/components/navbar
diff options
context:
space:
mode:
authorIlion Beyst <ilion.beyst@gmail.com>2022-11-04 07:17:59 +0100
committerIlion Beyst <ilion.beyst@gmail.com>2022-11-04 07:31:29 +0100
commitd3845eb85fc8f75562a6e121c5e437763ffeea63 (patch)
tree2687a24ae62e62ad7d4fad12830fd403eb8472a0 /web/pw-server/src/lib/components/navbar
parent698ae8d15e4b231ecaa0d168c2c4d5d941b06fdd (diff)
downloadplanetwars.dev-d3845eb85fc8f75562a6e121c5e437763ffeea63.tar.xz
planetwars.dev-d3845eb85fc8f75562a6e121c5e437763ffeea63.zip
integrate UserControls into main navbar
Diffstat (limited to 'web/pw-server/src/lib/components/navbar')
-rw-r--r--web/pw-server/src/lib/components/navbar/UserControls.svelte88
1 files changed, 0 insertions, 88 deletions
diff --git a/web/pw-server/src/lib/components/navbar/UserControls.svelte b/web/pw-server/src/lib/components/navbar/UserControls.svelte
deleted file mode 100644
index 184a40a..0000000
--- a/web/pw-server/src/lib/components/navbar/UserControls.svelte
+++ /dev/null
@@ -1,88 +0,0 @@
-<script lang="ts">
- import { get_session_token, clear_session_token } from "$lib/auth";
- import { currentUser } from "$lib/stores/current_user";
-
- import { onMount } from "svelte";
-
- onMount(async () => {
- // TODO: currentUser won't be set if the navbar component is not created.
- const session_token = get_session_token();
- if (!session_token) {
- return;
- }
-
- let response = await fetch("/api/users/me", {
- method: "GET",
- headers: {
- "Content-Type": "application/json",
- Authorization: `Bearer ${session_token}`,
- },
- });
-
- if (!response.ok) {
- throw response.statusText;
- }
-
- const user = await response.json();
- currentUser.set(user);
- });
-
- function signOut() {
- // TODO: destroy session on server
- currentUser.set(null);
- clear_session_token();
- }
-</script>
-
-<div class="user-controls">
- {#if $currentUser}
- <a class="current-user-name" href="/users/{$currentUser['username']}">
- {$currentUser["username"]}
- </a>
- <!-- svelte-ignore a11y-click-events-have-key-events -->
- <div class="sign-out" on:click={signOut}>Sign out</div>
- {:else}
- <a class="account-href" href="/login">Sign in</a>
- <a class="account-href" href="/register">Sign up</a>
- {/if}
-</div>
-
-<style lang="scss">
- @mixin navbar-item {
- font-size: 18px;
- font-family: Helvetica, sans-serif;
- padding: 4px 8px;
- font-weight: 400;
- }
-
- .account-href {
- @include navbar-item;
- color: #eee;
- text-decoration: none;
- }
-
- .current-user-name {
- @include navbar-item;
- text-decoration: none;
- color: #fff;
- }
-
- .sign-out {
- @include navbar-item;
- color: #ccc;
- cursor: pointer;
- }
-
- .user-controls {
- display: flex;
- align-items: center;
- }
-
- // TODO: pretty hacky
- @media screen and (max-width: 600px) {
- .user-controls {
- flex-direction: column;
- align-items: flex-start;
- }
- }
-</style>