|
6 | 6 | import { Button, Form, InputText } from '$lib/elements/forms'; |
7 | 7 | import { addNotification } from '$lib/stores/notifications'; |
8 | 8 | import { sdk } from '$lib/stores/sdk'; |
9 | | - import { onMount } from 'svelte'; |
10 | 9 | import { team } from './store'; |
11 | 10 | import { Icon, Layout } from '@appwrite.io/pink-svelte'; |
12 | 11 | import { IconPlus } from '@appwrite.io/pink-icons-svelte'; |
|
16 | 15 | import { |
17 | 16 | normalizePrefs, |
18 | 17 | createPrefRow, |
| 18 | + createPrefRows, |
19 | 19 | isAddDisabled, |
| 20 | + parsePrefValue, |
20 | 21 | sanitizePrefs |
21 | 22 | } from '$lib/helpers/prefs'; |
22 | 23 |
|
| 24 | + $: { |
| 25 | + const originalNormalized = normalizePrefs(Object.entries($team?.prefs ?? {})); |
| 26 | +
|
| 27 | + if ( |
| 28 | + !prefs || |
| 29 | + (!hasUnsavedPrefsChanges && !deepEqual(lastPrefsNormalized, originalNormalized)) |
| 30 | + ) { |
| 31 | + prefs = createPrefRows($team?.prefs); |
| 32 | + lastPrefsNormalized = originalNormalized; |
| 33 | + hasUnsavedPrefsChanges = false; |
| 34 | + } |
| 35 | + } |
| 36 | +
|
23 | 37 | $: if (prefs) { |
24 | 38 | const currentNormalized = normalizePrefs(prefs); |
25 | 39 | const originalNormalized = normalizePrefs(Object.entries($team?.prefs ?? {})); |
|
29 | 43 |
|
30 | 44 | let prefs: PrefRow[] = null; |
31 | 45 | let arePrefsDisabled = true; |
32 | | -
|
33 | | - onMount(async () => { |
34 | | - const entries = Object.entries($team?.prefs ?? {}); |
35 | | - prefs = |
36 | | - entries.length > 0 |
37 | | - ? entries.map(([key, value]) => |
38 | | - createPrefRow(String(key ?? ''), String(value ?? '')) |
39 | | - ) |
40 | | - : [createPrefRow()]; |
41 | | - }); |
| 46 | + let hasUnsavedPrefsChanges = false; |
| 47 | + let lastPrefsNormalized: [string, string][] = []; |
42 | 48 |
|
43 | 49 | async function updatePrefs() { |
44 | 50 | try { |
|
47 | 53 | const updatedPrefs = |
48 | 54 | sanitizedPrefs.length === 0 |
49 | 55 | ? {} |
50 | | - : Object.fromEntries(sanitizedPrefs.map((pref) => [pref.key, pref.value])); |
| 56 | + : Object.fromEntries( |
| 57 | + sanitizedPrefs.map((pref) => [ |
| 58 | + pref.key, |
| 59 | + parsePrefValue(pref.value, $team?.prefs?.[pref.key]) |
| 60 | + ]) |
| 61 | + ); |
51 | 62 |
|
52 | 63 | await sdk |
53 | 64 | .forProject(page.params.region, page.params.project) |
54 | 65 | .teams.updatePrefs({ teamId: $team.$id, prefs: updatedPrefs }); |
55 | 66 | await invalidate(Dependencies.TEAM); |
| 67 | + hasUnsavedPrefsChanges = false; |
56 | 68 | arePrefsDisabled = true; |
57 | 69 |
|
58 | 70 | addNotification({ |
|
84 | 96 | value={pref.key} |
85 | 97 | on:input={(e) => { |
86 | 98 | pref.key = (e.currentTarget as HTMLInputElement).value; |
| 99 | + hasUnsavedPrefsChanges = true; |
87 | 100 | prefs = [...prefs]; |
88 | 101 | }} |
89 | 102 | placeholder="Enter key" |
|
95 | 108 | value={pref.value} |
96 | 109 | on:input={(e) => { |
97 | 110 | pref.value = (e.currentTarget as HTMLInputElement).value; |
| 111 | + hasUnsavedPrefsChanges = true; |
98 | 112 | prefs = [...prefs]; |
99 | 113 | }} |
100 | 114 | placeholder="Enter value" |
|
106 | 120 | disabled={(!pref.key || !pref.value) && index === 0} |
107 | 121 | on:click={() => { |
108 | 122 | prefs.splice(index, 1); |
| 123 | + hasUnsavedPrefsChanges = true; |
109 | 124 | prefs = [...prefs]; |
110 | 125 | }}> |
111 | 126 | <span class="icon-x" aria-hidden="true"></span> |
|
120 | 135 | disabled={isAddDisabled(prefs)} |
121 | 136 | on:click={() => { |
122 | 137 | if (!prefs) return; |
| 138 | + hasUnsavedPrefsChanges = true; |
123 | 139 | prefs = [...prefs, createPrefRow()]; |
124 | 140 | }}> |
125 | 141 | <Icon icon={IconPlus} slot="start" size="s" /> |
|
0 commit comments