aboutsummaryrefslogtreecommitdiff
path: root/src/routes
diff options
context:
space:
mode:
Diffstat (limited to 'src/routes')
-rw-r--r--src/routes/+error.svelte24
-rw-r--r--src/routes/+layout.svelte40
-rw-r--r--src/routes/reader/+page.svelte7
-rw-r--r--src/routes/tools/[tool]/+page.svelte15
-rw-r--r--src/routes/user/[user]/+page.svelte39
-rw-r--r--src/routes/user/[user]/badges/+page.svelte96
6 files changed, 120 insertions, 101 deletions
diff --git a/src/routes/+error.svelte b/src/routes/+error.svelte
index f822d521..8cef378a 100644
--- a/src/routes/+error.svelte
+++ b/src/routes/+error.svelte
@@ -3,17 +3,19 @@
import { closest } from '$lib/Error/path';
import Popup from '$lib/Layout/Popup.svelte';
- $: suggestion = closest($page.url.pathname.replace('/', ''), [
- 'birthdays',
- 'completed',
- 'schedule',
- 'hololive',
- 'settings',
- 'tools',
- 'updates',
- 'user',
- 'wrapped'
- ]);
+ let suggestion = $derived(
+ closest($page.url.pathname.replace('/', ''), [
+ 'birthdays',
+ 'completed',
+ 'schedule',
+ 'hololive',
+ 'settings',
+ 'tools',
+ 'updates',
+ 'user',
+ 'wrapped'
+ ])
+ );
</script>
<Popup>
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 08305788..5c08ec50 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -40,17 +40,25 @@
injectSpeedInsights();
injectAnalytics({ mode: dev ? 'development' : 'production' });
- export let data;
+ import type { AniListAuthorisation } from '$lib/Data/AniList/identity';
- let isHeaderVisible = true;
- let previousScrollPosition = 0;
+ interface Props {
+ data: { url: string; commit?: string; user?: AniListAuthorisation };
+ children: import('svelte').Snippet;
+ }
+
+ let { data, children }: Props = $props();
+ let isHeaderVisible = $state(true);
+ let previousScrollPosition = $state(0);
let notificationInterval: NodeJS.Timeout | undefined = undefined;
addMessages('en', english as unknown as LocaleDictionary);
addMessages('ja', japanese as unknown as LocaleDictionary);
init({ fallbackLocale: 'en', initialLocale: $settings.displayLanguage });
- $: i18nLocale.set($settings.displayLanguage);
+ $effect.pre(() => {
+ i18nLocale.set($settings.displayLanguage);
+ });
const navigationOrder = ['/', '/completed', '/schedule', '/updates', '/tools', '/settings'];
const previousPage: Readable<string | null> = readable(null, (set) => {
@@ -61,13 +69,15 @@
return () => unsubscribe();
});
- $: way = data.url.includes('/user')
- ? 200
- : $previousPage && $previousPage.includes('/user')
- ? -200
- : navigationOrder.indexOf(data.url) > navigationOrder.indexOf($previousPage ?? '/')
- ? 200
- : -200;
+ let way = $derived(
+ data.url.includes('/user')
+ ? 200
+ : $previousPage && $previousPage.includes('/user')
+ ? -200
+ : navigationOrder.indexOf(data.url) > navigationOrder.indexOf($previousPage ?? '/')
+ ? 200
+ : -200
+ );
const handleScroll = () => {
const currentScrollPosition = window.scrollY;
@@ -121,7 +131,7 @@
await userDatabase.users.where('id').below(0).delete();
- if (!(await userDatabase.users.get($userIdentity.id)) && $userIdentity.id > 0)
+ if (!(await userDatabase.users.get($userIdentity.id)) && $userIdentity.id > 0 && data.user)
await userDatabase.users.put({
id: $userIdentity.id,
user: data.user,
@@ -138,7 +148,7 @@
if (notificationInterval) clearInterval(notificationInterval);
});
- $: {
+ $effect(() => {
if ((data.url === '/' || data.url === '/completed' || data.url === '/schedule') && !$subsPlease)
fetch(root(`/api/subsplease?tz=${Intl.DateTimeFormat().resolvedOptions().timeZone}`))
.then((r) => r.json())
@@ -158,7 +168,7 @@
subsPlease.set(r);
});
- }
+ });
</script>
<HeadTitle />
@@ -260,7 +270,7 @@
<NotificationsProvider zIndex={5000}>
<Root {data} {way}>
{#if $userIdentity.id !== -1}
- <slot />
+ {@render children()}
{:else if data.url === '/settings'}
<Skeleton grid={true} count={1} height="10vh" />
<Skeleton grid={true} count={1} height="30vh" />
diff --git a/src/routes/reader/+page.svelte b/src/routes/reader/+page.svelte
index 775d3659..4cbc65aa 100644
--- a/src/routes/reader/+page.svelte
+++ b/src/routes/reader/+page.svelte
@@ -1,4 +1,4 @@
-<script>
+<script lang="ts">
import Notice from '$lib/Error/Notice.svelte';
import Message from '$lib/Loading/Message.svelte';
import MangaDexChapters from '$lib/Reader/Chapters/MangaDex.svelte';
@@ -6,9 +6,8 @@
import { decodeResource, fetchResource, identify, Resource } from '$lib/Reader/resource';
import InputTemplate from '$lib/Tools/InputTemplate.svelte';
- let submission = '';
-
- $: resourceIdentity = identify(submission);
+ let submission = $state('');
+ let resourceIdentity = $derived(identify(submission));
</script>
<InputTemplate field="Manga URL" bind:submission submitText="Read" preserveCase>
diff --git a/src/routes/tools/[tool]/+page.svelte b/src/routes/tools/[tool]/+page.svelte
index 68eb0c07..a4508ff9 100644
--- a/src/routes/tools/[tool]/+page.svelte
+++ b/src/routes/tools/[tool]/+page.svelte
@@ -21,17 +21,24 @@
import Tracker from '$lib/Tools/Tracker/Tool.svelte';
import BirthdaysTemplate from '$lib/Tools/BirthdaysTemplate.svelte';
- export let data;
+ import type { AniListAuthorisation } from '$lib/Data/AniList/identity';
- let tool = data.tool ?? 'default';
+ interface Props {
+ data: { tool?: string; user: AniListAuthorisation };
+ }
+
+ let { data }: Props = $props();
+ let tool = $derived(data.tool ?? 'default');
onMount(() => {
if (tool === 'default') goto(root('/tools'));
});
- $: suggestion = closest(tool, Object.keys(tools));
+ let suggestion = $derived(closest(tool, Object.keys(tools)));
- $: if (tool == 'girls') goto(root('/girls'));
+ $effect.pre(() => {
+ if (tool === 'girls') goto(root('/girls'));
+ });
</script>
<Picker bind:tool />
diff --git a/src/routes/user/[user]/+page.svelte b/src/routes/user/[user]/+page.svelte
index eeeebf91..ff86beae 100644
--- a/src/routes/user/[user]/+page.svelte
+++ b/src/routes/user/[user]/+page.svelte
@@ -23,12 +23,11 @@
import LinkedTooltip from '$lib/Tooltip/LinkedTooltip.svelte';
import { graphql } from '$houdini';
- export let data;
-
- $: ({ Profile } = data);
- $: preferences = $Profile.fetching
- ? undefined
- : ($Profile.data?.User?.preferences as Preferences | undefined);
+ let { data } = $props();
+ let Profile = $derived(data.Profile);
+ let preferences = $derived(
+ $Profile.fetching ? undefined : ($Profile.data?.User?.preferences as Preferences | undefined)
+ );
const setCategoriesQuery = graphql(`
mutation SetCategories($categories: [String!]!) {
@@ -102,20 +101,20 @@
}
`);
- $: userData = data.userData;
-
- let error = false;
- let schedule: ParseResult | undefined = undefined;
- let draggedCategory: string | null = null;
- let draggedOverCategory: string | null = null;
-
- $: displayBadges = (username: string, badges: number | string) =>
- $locale({
- values: {
- badges: badges,
- username
- }
- }).user.profile.badges;
+ let userData = $derived(data.userData);
+ let error = $state(false);
+ let schedule: ParseResult | undefined = $state(undefined);
+ let draggedCategory: string | null = $state(null);
+ let draggedOverCategory: string | null = $state(null);
+ let displayBadges = $derived(
+ (username: string, badges: number | string) =>
+ $locale({
+ values: {
+ badges: badges,
+ username
+ }
+ }).user.profile.badges
+ );
const handleDragStart = (
event: DragEvent & { currentTarget: EventTarget & HTMLDivElement },
diff --git a/src/routes/user/[user]/badges/+page.svelte b/src/routes/user/[user]/badges/+page.svelte
index 2dc11ca3..ef399628 100644
--- a/src/routes/user/[user]/badges/+page.svelte
+++ b/src/routes/user/[user]/badges/+page.svelte
@@ -26,32 +26,35 @@
import type { Preferences } from '../../../../graphql/user/$types';
import localforage from 'localforage';
- export let data;
-
- $: ({ BadgeWallUser } = data);
- $: preferences = $BadgeWallUser.fetching
- ? undefined
- : ($BadgeWallUser.data?.User?.preferences as Preferences | undefined);
-
- $: if (browser && preferences && preferences.badge_wall_css) {
- const sanitise = (css: string) =>
- css
- .replace(/\/\*[\s\S]*?\*\//g, '')
- .replace(/<\/?[^>]+(>|$)/g, '')
- .replace(
- /(expression|javascript|vbscript|onerror|onload|onclick|onmouseover|onmouseout|onmouseup|onmousedown|onkeydown|onkeyup|onkeypress|onblur|onfocus|onsubmit|onreset|onselect|onchange|ondblclick):/gi,
- ''
- )
- .replace(/(behaviour|behavior|moz-binding|content):/gi, '')
- .replace(/\s+/g, ' ')
- .trim();
- const style = document.createElement('style');
-
- style.dataset.badgeWall = 'true';
- style.innerHTML = sanitise(preferences.badge_wall_css);
-
- document.head.appendChild(style);
- }
+ let { data } = $props();
+ let BadgeWallUser = $derived(data.BadgeWallUser);
+ let preferences = $derived(
+ $BadgeWallUser.fetching
+ ? undefined
+ : ($BadgeWallUser.data?.User?.preferences as Preferences | undefined)
+ );
+
+ $effect.pre(() => {
+ if (browser && preferences && preferences.badge_wall_css) {
+ const sanitise = (css: string) =>
+ css
+ .replace(/\/\*[\s\S]*?\*\//g, '')
+ .replace(/<\/?[^>]+(>|$)/g, '')
+ .replace(
+ /(expression|javascript|vbscript|onerror|onload|onclick|onmouseover|onmouseout|onmouseup|onmousedown|onkeydown|onkeyup|onkeypress|onblur|onfocus|onsubmit|onreset|onselect|onchange|ondblclick):/gi,
+ ''
+ )
+ .replace(/(behaviour|behavior|moz-binding|content):/gi, '')
+ .replace(/\s+/g, ' ')
+ .trim();
+ const style = document.createElement('style');
+
+ style.dataset.badgeWall = 'true';
+ style.innerHTML = sanitise(preferences.badge_wall_css);
+
+ document.head.appendChild(style);
+ }
+ });
const updateBadgeQuery = graphql(`
mutation UpdateBadge(
@@ -178,27 +181,26 @@
image: string;
}
- let editMode = false;
- let importMode = false;
- let error: null | string;
- let awcPromise: Promise<Response>;
- let confirmDelete = 0;
- let confirmPrune = 0;
- let selectedBadge: IndexedBadge | undefined = undefined;
- let loadError: string | null = null;
- const isId = /^\d+$/.test(data.username);
- let importImages: ImportImage[] | undefined = undefined;
- let importLinks = false;
- let importCategory = '';
- let importReplies = false;
- let badger: Partial<User> | null;
- let migrateMode = false;
- let hideMode = false;
+ let editMode = $state(false);
+ let importMode = $state(false);
+ let error: null | string = $state(null);
+ let awcPromise: Promise<Response> | undefined = $state(undefined);
+ let confirmDelete = $state(0);
+ let confirmPrune = $state(0);
+ let selectedBadge: IndexedBadge | undefined = $state(undefined);
+ let loadError: string | null = $state(null);
+ let isId = $derived(/^\d+$/.test(data.username));
+ let importImages: ImportImage[] | undefined = $state(undefined);
+ let importLinks = $state(false);
+ let importCategory = $state('');
+ let importReplies = $state(false);
+ let badger: Partial<User> | null = $state(null);
+ let migrateMode = $state(false);
+ let hideMode = $state(false);
const authorised = authorisedJson.includes($identity.id);
- let noticeDismissed = false;
-
- $: categoryFilter = new URLSearchParams($page.url.searchParams).get('category');
- $: loadQueryParameter = new URLSearchParams($page.url.searchParams).get('load');
+ let noticeDismissed = $state(false);
+ let categoryFilter = $derived(new URLSearchParams($page.url.searchParams).get('category'));
+ let loadQueryParameter = $derived(new URLSearchParams($page.url.searchParams).get('load'));
type GroupedBadges = { [key: string]: IndexedBadge[] };
@@ -553,7 +555,7 @@
!editMode}
<div id="badges">
- {#if preferences && !preferences.hide_awc_badges}
+ {#if preferences && !preferences.hide_awc_badges && awcPromise}
<AWC {awcPromise} {categoryFilter} {isOwner} {preferences} />
{/if}