blob: 329b2595630a20cfba53f6c22452c64a6f7ca2f7 (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
|
<script lang="ts">
import { UpdateMode } from '$gql/graphql';
import { updateComics } from '$gql/Mutations';
import { getSelectionContext } from '$lib/selection/Selection.svelte';
import { toastFinally } from '$lib/Toasts';
import { fadeDefault } from '$lib/Transitions';
import { getContextClient } from '@urql/svelte';
import { fade } from 'svelte/transition';
const client = getContextClient();
const selection = getSelectionContext();
let { id }: { id: number } = $props();
function onclick(event: MouseEvent) {
event.preventDefault();
updateComics(client, {
ids: id,
input: { pages: { ids: selection.ids, options: { mode: UpdateMode.Add } } }
})
.then(() => selection.none())
.catch(toastFinally);
}
</script>
{#if selection.size > 0}
<div class="absolute left-1 top-1" transition:fade={fadeDefault}>
<button
type="button"
class="btn-blue rounded-full shadow-sm shadow-black"
title="Add to this comic"
aria-label="Add to this comic"
{onclick}
>
<span class="icon-base icon-[material-symbols--note-add]"></span>
</button>
</div>
{/if}
|
