fix save journal button and reactive city filtering by country
This commit is contained in:
@@ -27,7 +27,7 @@ export function initEntriesListener(uid) {
|
||||
}
|
||||
|
||||
export async function addEntry(data) {
|
||||
if (!_uid) return null;
|
||||
if (!_uid) throw new Error('Not logged in');
|
||||
const ref = await addDoc(collection(db, 'users', _uid, 'entries'), {
|
||||
...data,
|
||||
createdAt: serverTimestamp(),
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
<script>
|
||||
import { get } from 'svelte/store';
|
||||
import { journals, addJournal } from '../stores/journalStore.js';
|
||||
import { countryNames } from '../shared/countries.js';
|
||||
import SearchInput from '../shared/SearchInput.svelte';
|
||||
@@ -13,6 +12,13 @@
|
||||
|
||||
let { initialCountry = '', onBack, onSaved = onBack } = $props();
|
||||
|
||||
// ── Journal store (reactive) ────────────────────────────────────────
|
||||
let journalEntries = $state([]);
|
||||
$effect(() => {
|
||||
const unsub = journals.subscribe(v => { journalEntries = v; });
|
||||
return unsub;
|
||||
});
|
||||
|
||||
// ── Fields ─────────────────────────────────────────────────────────
|
||||
let cities = $state([]);
|
||||
let cityInput = $state('');
|
||||
@@ -55,8 +61,8 @@
|
||||
// otherwise show all known cities.
|
||||
let cityOptions = $derived(
|
||||
country.trim()
|
||||
? [...new Set(get(journals).filter(j => (j.location.country || '').toLowerCase() === country.trim().toLowerCase()).flatMap(e => e.location.cities))].sort()
|
||||
: [...new Set(get(journals).flatMap(e => e.location.cities))].sort()
|
||||
? [...new Set(journalEntries.filter(j => (j.location?.country || '').toLowerCase() === country.trim().toLowerCase()).flatMap(e => e.location?.cities ?? []))].sort()
|
||||
: [...new Set(journalEntries.flatMap(e => e.location?.cities ?? []))].sort()
|
||||
);
|
||||
|
||||
function addCity(val) {
|
||||
@@ -106,9 +112,11 @@
|
||||
|
||||
// ── Save ───────────────────────────────────────────────────────────
|
||||
let saving = $state(false);
|
||||
let saveError = $state('');
|
||||
|
||||
async function save() {
|
||||
saving = true;
|
||||
saveError = '';
|
||||
const memo = questions
|
||||
.map((q, i) => answers[i].trim() ? `Q: ${q.split('\n')[0]}\nA: ${answers[i].trim()}` : '')
|
||||
.filter(Boolean)
|
||||
@@ -125,8 +133,9 @@
|
||||
location: { cities, country },
|
||||
});
|
||||
onSaved();
|
||||
} catch {
|
||||
} catch (e) {
|
||||
saving = false;
|
||||
saveError = e?.message ?? 'Failed to save. Please try again.';
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -153,6 +162,7 @@
|
||||
<button class="save-btn" onclick={save} disabled={saving}>
|
||||
{saving ? 'Saving…' : 'Save trip'}
|
||||
</button>
|
||||
{#if saveError}<span class="save-err">{saveError}</span>{/if}
|
||||
{/if}
|
||||
</div>
|
||||
</header>
|
||||
@@ -326,6 +336,7 @@
|
||||
}
|
||||
.save-btn:hover { background: var(--accent-dark); border-color: var(--accent-dark); }
|
||||
.save-btn:disabled { opacity: 0.6; cursor: not-allowed; }
|
||||
.save-err { font-size: 12px; color: #ef4444; margin-top: 4px; display: block; text-align: right; }
|
||||
|
||||
/* scroll + form */
|
||||
.scroll { flex: 1; overflow-y: auto; }
|
||||
|
||||
Reference in New Issue
Block a user