sam/mercury
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

add frontend auth middleware, embed user data in frontend html

Browse source
This commit is contained in:
sam 2023-09-04 17:32:45 +02:00
parent d8cb8c8fa8
commit 0fa769a248
Signed by: sam
GPG key ID: B4EF20DDE721CAA1
12 changed files with 265 additions and 42 deletions
Download patch file Download diff file Expand all files Collapse all files

89
frontend/src/App.svelte
View file

@ -1,47 +1,64 @@
<script lang="ts">
import svelteLogo from './assets/svelte.svg'
import viteLogo from './assets/vite.svg'
import Counter from './lib/Counter.svelte'
import { onMount } from "svelte";
import svelteLogo from "./assets/svelte.svg";
import viteLogo from "./assets/vite.svg";
import Counter from "./lib/Counter.svelte";
import type { MeAccount } from "./lib/api/account";
let account: MeAccount | null = null;
onMount(() => {
const accountData = document.getElementById("accountData");
account = JSON.parse(accountData.innerHTML) as MeAccount;
});
</script>
<main>
<div>
<a href="https://vitejs.dev" target="_blank" rel="noreferrer">
<img src={viteLogo} class="logo" alt="Vite Logo" />
</a>
<a href="https://svelte.dev" target="_blank" rel="noreferrer">
<img src={svelteLogo} class="logo svelte" alt="Svelte Logo" />
</a>
</div>
<h1>Vite + Svelte + Go</h1>
<div>
<a href="https://vitejs.dev" target="_blank" rel="noreferrer">
<img src={viteLogo} class="logo" alt="Vite Logo" />
</a>
<a href="https://svelte.dev" target="_blank" rel="noreferrer">
<img src={svelteLogo} class="logo svelte" alt="Svelte Logo" />
</a>
</div>
<h1>Vite + Svelte + Go</h1>
<div class="card">
<Counter />
</div>
<div class="card">
<Counter />
</div>
<p>
Check out <a href="https://github.com/sveltejs/kit#readme" target="_blank" rel="noreferrer">SvelteKit</a>, the official Svelte app framework powered by Vite!
</p>
<p>
Check out <a
href="https://github.com/sveltejs/kit#readme"
target="_blank"
rel="noreferrer">SvelteKit</a
>, the official Svelte app framework powered by Vite!
</p>
<p class="read-the-docs">
Click on the Vite and Svelte logos to learn more
</p>
{#if account}
<p>
Username: {account.username}, ID: {account.id}
</p>
{/if}
<p class="read-the-docs">Click on the Vite and Svelte logos to learn more</p>
</main>
<style>
.logo {
height: 6em;
padding: 1.5em;
will-change: filter;
transition: filter 300ms;
}
.logo:hover {
filter: drop-shadow(0 0 2em #646cffaa);
}
.logo.svelte:hover {
filter: drop-shadow(0 0 2em #ff3e00aa);
}
.read-the-docs {
color: #888;
}
.logo {
height: 6em;
padding: 1.5em;
will-change: filter;
transition: filter 300ms;
}
.logo:hover {
filter: drop-shadow(0 0 2em #646cffaa);
}
.logo.svelte:hover {
filter: drop-shadow(0 0 2em #ff3e00aa);
}
.read-the-docs {
color: #888;
}
</style>

9
frontend/src/lib/api/account.ts Normal file
View file

@ -0,0 +1,9 @@
export interface Account {
id: string;
username: string;
domain: string | null;
}
export interface MeAccount extends Account {
email: string;
}