anki/ts/graphs/GraphsPage.svelte
Henrik Giesel 30bbbaf00b
Use eslint for sorting our imports (#1637)
* Make eslint sort our imports

* fix missing deps in eslint rule (dae)

Caught on Linux due to the stricter sandboxing

* Remove exports-last eslint rule (for now?)

* Adjust browserslist settings

- We use ResizeObserver which is not supported in browsers like KaiOS,
  Baidu or Android UC

* Raise minimum iOS version 13.4

- It's the first version that supports ResizeObserver

* Apply new eslint rules to sort imports
2022-02-04 18:36:34 +10:00

62 lines
1.6 KiB
Svelte

<!--
Copyright: Ankitects Pty Ltd and contributors
License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
-->
<script lang="ts">
import type { SvelteComponentDev } from "svelte/internal";
import { writable } from "svelte/store";
import { bridgeCommand } from "../lib/bridgecommand";
import { pageTheme } from "../sveltelib/theme";
import WithGraphData from "./WithGraphData.svelte";
export let initialSearch: string;
export let initialDays: number;
const search = writable(initialSearch);
const days = writable(initialDays);
export let graphs: typeof SvelteComponentDev[];
export let controller: typeof SvelteComponentDev | null;
function browserSearch(event: CustomEvent) {
bridgeCommand(`browserSearch: ${$search} ${event.detail.query}`);
}
</script>
<div>
<WithGraphData
{search}
{days}
let:loading
let:sourceData
let:preferences
let:revlogRange
>
{#if controller}
<svelte:component this={controller} {search} {days} {loading} />
{/if}
{#if sourceData && preferences && revlogRange}
{#each graphs as graph}
<svelte:component
this={graph}
{sourceData}
{preferences}
{revlogRange}
nightMode={$pageTheme.isDark}
on:search={browserSearch}
/>
{/each}
{/if}
</WithGraphData>
</div>
<style lang="scss">
div {
@media only screen and (max-width: 600px) {
font-size: 12px;
}
}
</style>