jennie/ghostguild-org
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(admin-events): switch edit-mode load to useFetch

Browse source 
Top-level $fetch in <script setup> does not forward auth cookies to the
SSR request, so requireAdmin rejected and the form hydrated empty.
Client refetch then triggered hydration mismatches; in dev the
description textarea stayed DOM-empty and the browser's native required
validation blocked saves.

Switch to useFetch (SSR-aware, forwards cookies). Mirror the
admin/members/[id].vue pattern: extract populateEditForm, call it with
the initial payload, watch for client-side updates.
This commit is contained in:
Jennie Robinson Faber 2026-05-18 23:18:55 +01:00
parent 13c72b5ee0
commit 790f44b4e9
1 changed files with 60 additions and 54 deletions
Download patch file Download diff file Expand all files Collapse all files

24
app/pages/admin/events/create.vue
View file

@ -708,13 +708,9 @@ const onSeriesSelect = () => {
}
};
// Check if we're editing an event
if (route.query.edit) {
try {
const response = await $fetch(`/api/admin/events/${route.query.edit}`);
const event = response.data;
if (event) {
function populateEditForm(payload) {
const event = payload?.data;
if (!event) return;
editingEvent.value = event;
Object.assign(eventForm, {
title: event.title,
@ -760,9 +756,19 @@ if (route.query.edit) {
);
}
}
} catch (error) {
console.error("Failed to load event for editing:", error);
// useFetch forwards auth cookies to SSR; $fetch did not, leaving the
// SSR-rendered form empty and triggering hydration mismatches that left
// required textareas DOM-empty in dev.
if (route.query.edit) {
const { data: editEvent, error: editError } = await useFetch(
`/api/admin/events/${route.query.edit}`,
);
if (editError.value) {
console.error("Failed to load event for editing:", editError.value);
}
if (editEvent.value) populateEditForm(editEvent.value);
watch(editEvent, populateEditForm, { immediate: false });
}
// Check if we're duplicating an event