<script lang="ts">
	/* eslint svelte/no-at-html-tags: "off" */

	import { chapterDatabase } from '$lib/Media/chapters';
	import manga from '../../stores/manga';
	import anime from '../../stores/anime';
	import settings from '../../stores/settings';
	import SettingToggle from '$lib/Settings/SettingToggle.svelte';
	import SettingHint from '$lib/Settings/SettingHint.svelte';
	import { pruneAllManga } from '$lib/Media/manga';

	export let data;

	const pruneUnresolved = async () => {
		const unresolved = await chapterDatabase.chapters.where('chapters').equals(-1).toArray();
		const ids = unresolved.map((m) => m.id);

		manga.set('');
		anime.set('');
		await chapterDatabase.chapters.bulkDelete(ids);
	};
</script>

{#if data.user === undefined}
	Please log in to modify settings.
{:else}
	<details open>
		<summary>RSS Feeds</summary>

		<a
			href={'#'}
			on:click={() =>
				navigator.clipboard.writeText(
					`https://due.moe/feeds/activity-notifications?token=${data.user.accessToken}`
				)}
		>
			Click to copy AniList notifications RSS feed URL and token
		</a>
		<SettingHint lineBreak>Do not share this link with <b>anyone</b>!</SettingHint>
	</details>

	<p />

	<details open>
		<summary>Display</summary>

		<SettingToggle setting={'forceLightTheme'} on={'Use preferred'} off={'Force light'}>
			theme
		</SettingToggle>
		<SettingToggle
			setting={'linkToAniList'}
			on={'Link anime to LiveChart.me'}
			off={'Link anime to AniList'}
		/>
		<SettingToggle setting={'displayPausedMedia'} on={'Hide'} off={'Show'}>
			paused media
		</SettingToggle>
		<SettingToggle
			setting={'limitListHeight'}
			on={'Display full list area'}
			off={'Limit list area to screen'}
			sectionBreak
			disabled
		/>

		<p />

		<SettingToggle setting={'showCompletedAnime'} on={'Hide'} off={'Show'}>
			completed anime
		</SettingToggle>
		<SettingHint>Completed anime = anime on your lists which have finished airing</SettingHint>

		<p />

		<SettingToggle setting={'displayUnresolved'} on={'Hide'} off={'Show'}>unresolved</SettingToggle>
		<SettingHint>Displays unresolved chapter counts as "?"</SettingHint>

		<p />

		<SettingToggle setting={'displayNotStarted'} on={'Hide'} off={'Show'}>
			media with zero progress
		</SettingToggle>
		<SettingHint>
			May cause <a href="https://en.wikipedia.org/wiki/Rate_limiting" target="_blank">
				rate-limiting
			</a> depending on how much releasing manga are on your lists
		</SettingHint>

		<p />

		<SettingToggle setting={'closeAnimeByDefault'} on={'Expand'} off={'Close'}>
			anime panel by default
		</SettingToggle>
		<SettingToggle setting={'closeMangaByDefault'} on={'Expand'} off={'Close'}>
			manga panel by default
		</SettingToggle>
		<SettingToggle setting={'sortByDifference'}>
			Sort anime by {@html !$settings.sortByDifference
				? 'difference between last watched and next episode'
				: 'days left until next episode'}
		</SettingToggle>
	</details>

	<p />

	<details open>
		<summary>Calculation</summary>

		<SettingToggle setting={'roundDownChapters'} on={'Maintain'} off={'Round down'}>
			chapters
		</SettingToggle>
		<SettingHint>
			50/50.6 would {@html $settings.roundDownChapters ? '<b>not</b>' : ''} be due
		</SettingHint>
	</details>

	<p />

	<details open>
		<summary>Cache</summary>

		<a href={'#'} on:click={pruneUnresolved}>Re-cache <b>ALL</b> unresolved manga</a>

		<p />

		<a href={'#'} on:click={pruneAllManga}>Re-cache <b>ALL</b> manga</a>
		<SettingHint lineBreak>Force a re-cache of all cached manga chapter counts</SettingHint>

		<p />

		<span>Re-cache <b>ALL</b> media keys every</span>
		<input type="number" bind:value={$settings.cacheMinutes} min="1" max="60" placeholder="30" />
		minutes
		<SettingHint lineBreak>Media keys = your cached list data</SettingHint>

		<p />

		<span>Re-cache <b>ALL</b> manga chapter counts every</span>
		<input
			type="number"
			bind:value={$settings.cacheMangaMinutes}
			min="1"
			max="1440"
			placeholder="60"
		/>
		minutes
		<SettingHint lineBreak>
			Low values may cause <a href="https://en.wikipedia.org/wiki/Rate_limiting" target="_blank">
				rate-limiting
			</a> depending on the amount of releasing manga are on your lists
		</SettingHint>
	</details>

	<p />

	<details open>
		<summary>Reset Settings</summary>

		<a href={'#'} on:click={settings.reset}>Reset <b>ALL</b> settings</a>
		<SettingHint lineBreak>
			Resets all settings present on this page to their default values
		</SettingHint>

		<p />

		<a href={'#'} on:click={() => localStorage.clear()}>Clear <code>localStorage</code> </a>
		<SettingHint lineBreak>
			Doesn't break anything, but resets all settings and clears all key caches. Recommended after
			updates
		</SettingHint>
	</details>
{/if}

<p />

<hr />

<p>
	Have feedback or suggestions? Send a private message to
	<a href="https://anilist.co/user/fuwn" target="_blank">@fuwn</a> on AniList!
</p>
