feat(stores): settings store for all settings

1 files changed, 27 insertions, 39 deletions

diff --git a/src/routes/settings/+page.svelte b/src/routes/settings/+page.svelte
index f1ea627f..c2af5e5e 100644
--- a/src/routes/settings/+page.svelte
+++ b/src/routes/settings/+page.svelte
@@ -1,17 +1,12 @@
 <script lang="ts">
 	/* eslint svelte/no-at-html-tags: "off" */
 
-	import displayUnresolved from '../../stores/displayUnresolved';
-	import closeAnimeByDefault from '../../stores/closeAnimeByDefault';
-	import closeMangaByDefault from '../../stores/closeMangaByDefault';
 	import { chapterDatabase } from '$lib/chapterDatabase';
 	import cacheMangaMinutes from '../../stores/cacheMangaMinutes';
 	import cacheMinutes from '../../stores/cacheMinutes';
-	import roundDownChapters from '../../stores/roundDownChapters';
-	import sortByDifference from '../../stores/sortByDifference';
-	import displayNotStarted from '../../stores/displayNotStarted';
 	import manga from '../../stores/manga';
 	import anime from '../../stores/anime';
+	import settings from '../../stores/settings';
 
 	export let data;
 
@@ -30,15 +25,6 @@
 		manga.set('');
 		await chapterDatabase.chapters.bulkDelete(ids);
 	};
-	const resetSettings = () => {
-		displayUnresolved.set('false');
-		roundDownChapters.set('true');
-		closeAnimeByDefault.set('false');
-		closeMangaByDefault.set('false');
-		sortByDifference.set('true');
-		cacheMinutes.set('30');
-		cacheMangaMinutes.set('60');
-	};
 </script>
 
 <a href="/">Home</a>
@@ -53,10 +39,10 @@
 	<a
 		href={'#'}
 		on:click={() =>
-			$displayUnresolved === 'true'
-				? displayUnresolved.set('false')
-				: displayUnresolved.set('true')}
-		>{$displayUnresolved === 'true' ? 'Hide' : 'Show'} unresolved</a
+			$settings.displayUnresolved === true
+				? settings.setKey('displayUnresolved', false)
+				: settings.setKey('displayUnresolved', true)}
+		>{$settings.displayUnresolved === true ? 'Hide' : 'Show'} unresolved</a
 	>
 	<br />
 	<small style="opacity: 50%;">Displays unresolved chapter counts as "?"</small>
@@ -66,10 +52,10 @@
 	<a
 		href={'#'}
 		on:click={() =>
-			$displayNotStarted === 'true'
-				? displayNotStarted.set('false')
-				: displayNotStarted.set('true')}
-		>{$displayNotStarted === 'true' ? 'Hide' : 'Show'} media with zero progress</a
+			$settings.displayNotStarted === true
+				? settings.setKey('displayNotStarted', false)
+				: settings.setKey('displayNotStarted', true)}
+		>{$settings.displayNotStarted === true ? 'Hide' : 'Show'} media with zero progress</a
 	>
 	<br />
 	<small style="opacity: 50%;"
@@ -82,10 +68,10 @@
 	<a
 		href={'#'}
 		on:click={() =>
-			$closeAnimeByDefault === 'true'
-				? closeAnimeByDefault.set('false')
-				: closeAnimeByDefault.set('true')}
-		>{$closeAnimeByDefault === 'true' ? 'Expand' : 'Close'} anime panel by default</a
+			$settings.closeAnimeByDefault === true
+				? settings.setKey('closeAnimeByDefault', false)
+				: settings.setKey('closeAnimeByDefault', true)}
+		>{$settings.closeAnimeByDefault === true ? 'Expand' : 'Close'} anime panel by default</a
 	>
 
 	<br />
@@ -93,10 +79,10 @@
 	<a
 		href={'#'}
 		on:click={() =>
-			$closeMangaByDefault === 'true'
-				? closeMangaByDefault.set('false')
-				: closeMangaByDefault.set('true')}
-		>{$closeMangaByDefault === 'true' ? 'Expand' : 'Close'} manga panel by default</a
+			$settings.closeMangaByDefault === true
+				? settings.setKey('closeMangaByDefault', false)
+				: settings.setKey('closeMangaByDefault', true)}
+		>{$settings.closeMangaByDefault === true ? 'Expand' : 'Close'} manga panel by default</a
 	>
 
 	<br />
@@ -104,8 +90,10 @@
 	<a
 		href={'#'}
 		on:click={() =>
-			$sortByDifference === 'true' ? sortByDifference.set('false') : sortByDifference.set('true')}
-		>Sort anime by {@html $sortByDifference === 'false'
+			$settings.sortByDifference === true
+				? settings.setKey('sortByDifference', false)
+				: settings.setKey('sortByDifference', true)}
+		>Sort anime by {@html $settings.sortByDifference === false
 			? 'difference between last watched and next episode'
 			: 'days left until next episode'}</a
 	>
@@ -115,14 +103,14 @@
 	<a
 		href={'#'}
 		on:click={() =>
-			$roundDownChapters === 'true'
-				? roundDownChapters.set('false')
-				: roundDownChapters.set('true')}
-		>{$roundDownChapters === 'false' ? 'Round down' : 'Maintain'} chapters</a
+			$settings.roundDownChapters === true
+				? settings.setKey('roundDownChapters', false)
+				: settings.setKey('roundDownChapters', true)}
+		>{$settings.roundDownChapters === false ? 'Round down' : 'Maintain'} chapters</a
 	>
 	<br />
 	<small style="opacity: 50%;"
-		>50/50.6 would {@html $roundDownChapters === 'true' ? '<b>not</b>' : ''} be due</small
+		>50/50.6 would {@html $settings.roundDownChapters === true ? '<b>not</b>' : ''} be due</small
 	>
 
 	<h2>Cache</h2>
@@ -151,7 +139,7 @@
 
 	<h2>Reset</h2>
 
-	<a href={'#'} on:click={resetSettings}>Reset <b>ALL</b> settings</a>
+	<a href={'#'} on:click={settings.reset}>Reset <b>ALL</b> settings</a>
 
 	<p />