brian/wanderer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixes serverside pb auth

Browse Source
This commit is contained in:
Christian Beutel
2024-02-27 00:19:17 +01:00
parent 275874fba9
commit 9b7a4adadf
13 changed files with 39 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
web/src/app.html
View File

@@ -1,12 +1,21 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head>
<meta charset="utf-8" /> <head>
<link rel="icon" href="%sveltekit.assets%/favicon.png" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <link rel="icon" href="%sveltekit.assets%/favicon.png" />
%sveltekit.head% <meta name="viewport" content="width=device-width, initial-scale=1" />
</head> <script>
<body data-sveltekit-preload-data="hover"> localStorage.theme === 'dark' ||
<div style="display: contents">%sveltekit.body%</div> (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)
</body> ? document.documentElement.classList.add('dark')
</html> : document.documentElement.classList.add('light');
</script>
%sveltekit.head%
</head>
<body data-sveltekit-preload-data="hover">
<div style="display: contents">%sveltekit.body%</div>
</body>
</html>

2
web/src/css/theme.css
View File

@@ -7,6 +7,7 @@
--content: 0, 0, 0; --content: 0, 0, 0;
--input-background: 249, 250, 251; --input-background: 249, 250, 251;
--input-background-error: 254, 242, 242;
--input-border: 209, 213, 219; --input-border: 209, 213, 219;
--input-border-focus: 36, 39, 52; --input-border-focus: 36, 39, 52;
--input-ring: 148, 163, 184; --input-ring: 148, 163, 184;
@@ -32,6 +33,7 @@
--content: 255, 255, 255; --content: 255, 255, 255;
--input-background: 36, 39, 52; --input-background: 36, 39, 52;
--input-background-error: 69, 10, 10;
--input-border: 43, 46, 61; --input-border: 43, 46, 61;
--input-border-focus: 108, 115, 150; --input-border-focus: 108, 115, 150;
--input-ring: 108, 115, 150; --input-ring: 108, 115, 150;

6
web/src/hooks.server.ts
View File

@@ -1,9 +1,7 @@
import { createInstance } from '$lib/pocketbase' import { createInstance, pb } from '$lib/pocketbase'
import type { Handle } from '@sveltejs/kit' import type { Handle } from '@sveltejs/kit'
export const handle: Handle = async ({ event, resolve }) => { export const handle: Handle = async ({ event, resolve }) => {
const pb = createInstance()
// load the store data from the request cookie string // load the store data from the request cookie string
pb.authStore.loadFromCookie(event.request.headers.get('cookie') || '') pb.authStore.loadFromCookie(event.request.headers.get('cookie') || '')
try { try {
@@ -15,7 +13,7 @@ export const handle: Handle = async ({ event, resolve }) => {
// clear the auth store on failed refresh // clear the auth store on failed refresh
pb.authStore.clear() pb.authStore.clear()
} }
event.locals.pb = pb event.locals.pb = pb
event.locals.user = pb.authStore.model event.locals.user = pb.authStore.model

2
web/src/lib/components/base/button.svelte
View File

@@ -11,7 +11,7 @@
</script> </script>
<button <button
class={extraClasses} class="{extraClasses} flex items-center justify-center"
class:btn-primary={primary} class:btn-primary={primary}
class:btn-secondary={secondary} class:btn-secondary={secondary}
class:btn-large={large} class:btn-large={large}

2
web/src/lib/components/base/text_field.svelte
View File

@@ -27,7 +27,7 @@
{name} {name}
class="bg-input-background border border-input-border rounded-md p-3 transition-colors focus:border-input-border-focus focus:outline-none focus:ring-0 w-full {extraClasses}" class="bg-input-background border border-input-border rounded-md p-3 transition-colors focus:border-input-border-focus focus:outline-none focus:ring-0 w-full {extraClasses}"
class:border-red-400={error.length > 0} class:border-red-400={error.length > 0}
class:bg-red-50={error.length > 0} class:bg-input-background-error={error.length > 0}
{autocomplete} {autocomplete}
use:typeAction use:typeAction
bind:value bind:value

5
web/src/lib/stores/theme_store.ts
View File

@@ -6,7 +6,10 @@ type Theme = "dark" | "light"
export const theme: Writable<Theme> = writable(browser && localStorage.getItem("theme") as Theme || "light" ); export const theme: Writable<Theme> = writable(browser && localStorage.getItem("theme") as Theme || "light" );
export function toggleTheme() { export function toggleTheme() {
const newTheme = get(theme) === "light" ? "dark" : "light"; const currentTheme = get(theme);
const newTheme = currentTheme === "light" ? "dark" : "light";
document.documentElement.classList.remove(currentTheme)
document.documentElement.classList.add(newTheme)
theme.set(newTheme) theme.set(newTheme)
localStorage.setItem("theme", newTheme); localStorage.setItem("theme", newTheme);
} }

13
web/src/routes/+layout.svelte
View File

@@ -2,7 +2,6 @@
import Toast from "$lib/components/base/toast.svelte"; import Toast from "$lib/components/base/toast.svelte";
import Footer from "$lib/components/footer.svelte"; import Footer from "$lib/components/footer.svelte";
import NavBar from "$lib/components/nav_bar.svelte"; import NavBar from "$lib/components/nav_bar.svelte";
import { theme } from "$lib/stores/theme_store";
import "@fortawesome/fontawesome-free/css/all.min.css"; import "@fortawesome/fontawesome-free/css/all.min.css";
import "../css/app.css"; import "../css/app.css";
import "../css/components.css"; import "../css/components.css";
@@ -10,12 +9,10 @@
</script> </script>
<svelte:head> <svelte:head>
<title> | wanderer</title> <title>| wanderer</title>
</svelte:head> </svelte:head>
<div class="theme {$theme}"> <NavBar></NavBar>
<NavBar></NavBar> <Toast></Toast>
<Toast></Toast> <slot />
<slot />
<Footer></Footer> <Footer></Footer>
</div>

2
web/src/routes/+page.svelte
View File

@@ -130,7 +130,7 @@
class="grid grid-cols-1 lg:grid-cols-2 justify-items-center gap-8 py-8" class="grid grid-cols-1 lg:grid-cols-2 justify-items-center gap-8 py-8"
> >
{#each $categories as category} {#each $categories as category}
<a href="/trails?category={category.id}"> <a href="/trails?category={category.id}" data-sveltekit-preload-data="off">
<CategoryCard {category}></CategoryCard> <CategoryCard {category}></CategoryCard>
</a> </a>
{/each} {/each}

2
web/src/routes/trail/edit/[id]/+page.ts
View File

@@ -1,6 +1,6 @@
import { Trail } from "$lib/models/trail"; import { Trail } from "$lib/models/trail";
import { categories_index } from "$lib/stores/category_store"; import { categories_index } from "$lib/stores/category_store";
import { trail, trails_show } from "$lib/stores/trail_store"; import { trails_show } from "$lib/stores/trail_store";
import { error, type Load } from "@sveltejs/kit"; import { error, type Load } from "@sveltejs/kit";
export const load: Load = async ({ params }) => { export const load: Load = async ({ params }) => {

2
web/src/routes/trail/view/[id]/+page.svelte
View File

@@ -274,7 +274,7 @@
<button <button
class="leaflet-control fa fa-{mapFullScreen class="leaflet-control fa fa-{mapFullScreen
? 'minimize' ? 'minimize'
: 'maximize'} rounded-full text-lg bg-white px-[14px] py-2 hover:bg-gray-100" : 'maximize'} rounded-full text-lg bg-white text-black px-[14px] py-2 hover:bg-gray-100"
style="cursor: pointer !important" style="cursor: pointer !important"
on:click={() => toggleMapFullScreen()} on:click={() => toggleMapFullScreen()}
></button> ></button>

6
web/src/routes/trail/view/[id]/+page.ts
View File

@@ -2,9 +2,5 @@ import { trails_show } from "$lib/stores/trail_store";
import type { Load } from "@sveltejs/kit"; import type { Load } from "@sveltejs/kit";
export const load: Load = async ({ params }) => { export const load: Load = async ({ params }) => {
try { await trails_show(params.id!, true)
await trails_show(params.id!, true)
}catch(e) {
}
}; };

BIN
web/static/imgs/empty_state.webp
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 781 KiB

After

Width:  |  Height:  |  Size: 284 KiB

1
web/tailwind.config.js
View File

@@ -12,6 +12,7 @@ export default {
'secondary-hover': 'rgba(var(--secondary-hover))', 'secondary-hover': 'rgba(var(--secondary-hover))',
'input-background': 'rgba(var(--input-background))', 'input-background': 'rgba(var(--input-background))',
'input-background-error': 'rgba(var(--input-background-error))',
'input-border': 'rgba(var(--input-border))', 'input-border': 'rgba(var(--input-border))',
'input-border-focus': 'rgba(var(--input-border-focus))', 'input-border-focus': 'rgba(var(--input-border-focus))',
'input-ring': 'rgba(var(--input-ring))', 'input-ring': 'rgba(var(--input-ring))',