From e80a83cf87eb79be4c2ac016d3c97709d41ee353 Mon Sep 17 00:00:00 2001 From: Fuwn Date: Wed, 24 Jan 2024 20:43:41 -0800 Subject: feat(identity): use global store --- src/lib/Home/LastActivity.svelte | 20 ++---------- src/lib/Tools/ActivityHistory/Grid.svelte | 20 ++---------- src/lib/Tools/ActivityHistory/Tool.svelte | 20 ++---------- src/lib/Tools/Wrapped/Tool.svelte | 34 ++++++-------------- src/lib/Tools/Wrapped/Top/Activity.svelte | 9 +++--- src/routes/+layout.svelte | 24 +++++--------- src/routes/+page.svelte | 34 +++++--------------- src/routes/completed/+page.svelte | 30 ++++------------- src/stores/identity.ts | 53 +++++++++++++++++++++++++++++++ src/stores/userIdentity.ts | 10 ------ 10 files changed, 98 insertions(+), 156 deletions(-) create mode 100644 src/stores/identity.ts delete mode 100644 src/stores/userIdentity.ts (limited to 'src') diff --git a/src/lib/Home/LastActivity.svelte b/src/lib/Home/LastActivity.svelte index ecad8d46..edb293d3 100644 --- a/src/lib/Home/LastActivity.svelte +++ b/src/lib/Home/LastActivity.svelte @@ -1,32 +1,18 @@ -{#if currentUserIdentity.id === -2} +{#if $userIdentity.id === -2}
Please log in to view this page.
-{:else if currentUserIdentity.id !== -1} - {#await selectedYear !== currentYear || useFullActivityHistory || new Date().getMonth() <= 6 ? fullActivityHistory(user, currentUserIdentity, selectedYear) : getActivityHistory(currentUserIdentity)} +{:else if $userIdentity.id !== -1} + {#await selectedYear !== currentYear || useFullActivityHistory || new Date().getMonth() <= 6 ? fullActivityHistory(user, $userIdentity, selectedYear) : getActivityHistory($userIdentity)} {@html nbsp(`Loading${useFullActivityHistory ? ' full-year' : ''} activity history ...`)} {:then activities} - {#await wrapped(user, currentUserIdentity, selectedYear)} + {#await wrapped(user, $userIdentity, selectedYear)} {@html nbsp('Loading user data ...')} @@ -604,7 +591,6 @@
import type { ActivityHistoryEntry } from '$lib/AniList/activity'; - import type { UserIdentity } from '$lib/AniList/identity'; + import identity from '$stores/identity'; import type { Wrapped } from '$lib/AniList/wrapped'; import proxy from '$lib/Utility/proxy'; export let wrapped: Wrapped; - export let identity: UserIdentity; export let year: number; export let activities: ActivityHistoryEntry[]; export let useFullActivityHistory: boolean; @@ -15,14 +14,14 @@
- + User Avatar
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 5c01cb98..3b243232 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -2,7 +2,7 @@ import { env } from '$env/dynamic/public'; import { userIdentity as getUserIdentity } from '$lib/AniList/identity'; import { onMount } from 'svelte'; - import userIdentity from '$stores/userIdentity'; + import userIdentity from '$stores/identity'; import settings from '$stores/settings'; import { browser } from '$app/environment'; import HeadTitle from '$lib/Home/HeadTitle.svelte'; @@ -27,11 +27,6 @@ $: i18nLocale.set($settings.displayLanguage); - let currentUserIdentity = { - name: '', - id: -1, - avatar: 'https://s4.anilist.co/file/anilistcdn/user/avatar/large/default.png' - }; const navigationOrder = ['/', '/completed', '/schedule', '/updates', '/tools', '/settings']; const previousPage: Readable = readable(null, (set) => { const unsubscribe = navigating.subscribe(($navigating) => { @@ -59,12 +54,7 @@ settings.get(); if (data.user !== undefined) { - if ($userIdentity === '') { - userIdentity.set(JSON.stringify(await getUserIdentity(data.user))); - } - - currentUserIdentity = JSON.parse($userIdentity); - currentUserIdentity.name = currentUserIdentity.name; + if ($userIdentity.id === -1) userIdentity.set(await getUserIdentity(data.user)); } }); @@ -88,7 +78,7 @@ | {#if data.user} - + {$locale().navigation.profile} {/if} @@ -111,8 +101,8 @@ {$locale().navigation.logOut} {#if data.user} - - Avatar + + Avatar {/if} {/if} @@ -122,7 +112,9 @@

- + {#if $userIdentity.id !== -1} + + {/if}

diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index 9d31b7a5..d3f7d5f9 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -1,10 +1,9 @@ @@ -51,8 +33,8 @@ {:else} {#if !$settings.disableUpcomingAnime}
- {#if currentUserIdentity.id != -1} - + {#if $userIdentity.id != -1} + {:else} @@ -67,8 +49,8 @@ {#if !$settings.disableAnime}
- {#if currentUserIdentity.id != -1} - + {#if $userIdentity.id != -1} + {:else} @@ -83,10 +65,10 @@ {#if !$settings.disableManga}
- {#if currentUserIdentity.id != -1} + {#if $userIdentity.id != -1} diff --git a/src/routes/completed/+page.svelte b/src/routes/completed/+page.svelte index 60549788..d1e0172f 100644 --- a/src/routes/completed/+page.svelte +++ b/src/routes/completed/+page.svelte @@ -1,7 +1,6 @@ @@ -41,8 +23,8 @@ Please log in to view due media. {:else}
- {#if currentUserIdentity.id != -1} - + {#if $userIdentity.id != -1} + {:else} @@ -51,10 +33,10 @@
- {#if currentUserIdentity.id != -1} + {#if $userIdentity.id != -1} diff --git a/src/stores/identity.ts b/src/stores/identity.ts new file mode 100644 index 00000000..765ce5b2 --- /dev/null +++ b/src/stores/identity.ts @@ -0,0 +1,53 @@ +import { browser } from '$app/environment'; +import type { UserIdentity } from '$lib/AniList/identity'; +import { writable } from 'svelte/store'; + +const defaultIdentity: UserIdentity = { + name: '', + id: -1, + avatar: 'https://s4.anilist.co/file/anilistcdn/user/avatar/large/default.png' +}; + +const createStore = () => { + const { subscribe, set, update } = writable( + JSON.parse( + browser + ? localStorage.getItem('identity') ?? JSON.stringify(defaultIdentity) + : JSON.stringify(defaultIdentity) + ) + ); + let state: UserIdentity; + + subscribe((value) => (state = value)); + + return { + subscribe, + set, + update, + reset: () => set(defaultIdentity), + get: () => { + const keys = Object.keys(defaultIdentity); + const identityKeys = Object.keys(state); + const updatedIdentity = { ...state }; + + for (const key of keys) + if (!identityKeys.includes(key)) + (updatedIdentity[key as keyof UserIdentity] as unknown) = + defaultIdentity[key as keyof UserIdentity]; + + if (browser) localStorage.setItem('identity', JSON.stringify(updatedIdentity)); + + return updatedIdentity; + }, + setKey: (key: keyof UserIdentity, value: unknown) => + update((identity) => ({ ...identity, [key]: value })) + }; +}; + +const identity = createStore(); + +identity.subscribe((value) => { + if (browser) localStorage.setItem('identity', JSON.stringify(value)); +}); + +export default identity; diff --git a/src/stores/userIdentity.ts b/src/stores/userIdentity.ts deleted file mode 100644 index 4b90358d..00000000 --- a/src/stores/userIdentity.ts +++ /dev/null @@ -1,10 +0,0 @@ -import { browser } from '$app/environment'; -import { writable } from 'svelte/store'; - -const userIdentity = writable(browser ? localStorage.getItem('userIdentity') ?? '' : ''); - -userIdentity.subscribe((value) => { - if (browser) localStorage.setItem('userIdentity', value); -}); - -export default userIdentity; -- cgit v1.2.3