blob: a6f324b14091f98b6e5820efb0f9af7591e550ea (
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
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
|
<script>
import LL from "$app/lib/i18n/i18n-svelte";
import {generate_random_hex_color} from "$shared/lib/colors";
import labels, {reload_labels, create_label_async} from "$app/lib/stores/labels";
import Dropdown from "$shared/components/dropdown.svelte";
let labelsError = "";
let loading = false;
let DropdownExports;
function reset() {
DropdownExports.reset();
console.log($LL.views.entryForm.labels._logReset());
}
function get_selected() {
return $labels.filter((c) => Object.hasOwn(c, "selected") && c.selected === true);
}
function select_label(id) {
DropdownExports.select(id);
}
function select_labels(ids) {
for (const id of ids) {
DropdownExports.select(id);
}
}
async function on_create({name}) {
loading = true;
const response = await create_label_async({
name: name,
color: generate_random_hex_color(),
});
loading = false;
if (response.ok) {
// Small pause to allow loading state to update everywhere.
setTimeout(() => select_label(response.data.id), 50);
}
}
export const functions = {
get_selected,
reset,
load_labels: reload_labels,
select_labels,
select_label,
};
</script>
<Dropdown
entries={$labels}
label="{$LL.views.entryForm.labels.labels()}"
maxlength="50"
createable={true}
placeholder="{$LL.views.entryForm.labels.placeholder()}"
multiple="{true}"
id="labels-search"
name="labels-search"
on_create_async={on_create}
noResultsText="{$LL.views.entryForm.labels.placeholder()}"
errorText="{labelsError}"
bind:this={DropdownExports}
{loading}
/>
|
