fix: Guard EventEditorPage state initialization with loadedEventIdRef and key prop to prevent values resetting to defaults on edit
This commit is contained in:
Vendored
+1
-1
@@ -11,7 +11,7 @@
|
|||||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||||
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=JetBrains+Mono:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap" rel="stylesheet">
|
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=JetBrains+Mono:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap" rel="stylesheet">
|
||||||
<title>Schichtplaner — Veranstaltungsschichtpläne</title>
|
<title>Schichtplaner — Veranstaltungsschichtpläne</title>
|
||||||
<script type="module" crossorigin src="/assets/index-udMfIy9d.js"></script>
|
<script type="module" crossorigin src="/assets/index-Mp9FLWF3.js"></script>
|
||||||
<link rel="stylesheet" crossorigin href="/assets/index-B6pC8vGA.css">
|
<link rel="stylesheet" crossorigin href="/assets/index-B6pC8vGA.css">
|
||||||
</head>
|
</head>
|
||||||
<body class="bg-paper text-main font-sans antialiased min-h-screen">
|
<body class="bg-paper text-main font-sans antialiased min-h-screen">
|
||||||
|
|||||||
@@ -490,6 +490,7 @@ export default function App() {
|
|||||||
/>
|
/>
|
||||||
) : activeTab === 'event-editor' ? (
|
) : activeTab === 'event-editor' ? (
|
||||||
<EventEditorPage
|
<EventEditorPage
|
||||||
|
key={eventToEdit?.id || 'new-event'}
|
||||||
eventToEdit={eventToEdit}
|
eventToEdit={eventToEdit}
|
||||||
skills={skills}
|
skills={skills}
|
||||||
user={user}
|
user={user}
|
||||||
|
|||||||
@@ -1,10 +1,12 @@
|
|||||||
/* Hallmark · pre-emit critique: P5 H5 E5 S5 R5 V5 */
|
/* Hallmark · pre-emit critique: P5 H5 E5 S5 R5 V5 */
|
||||||
/* Hallmark · component: EventEditorPage · genre: editorial · theme: Atelier (Dark & Light) · studied-DNA: https://inihaus.de */
|
/* Hallmark · component: EventEditorPage · genre: editorial · theme: Atelier (Dark & Light) · studied-DNA: https://inihaus.de */
|
||||||
import React, { useState, useEffect } from 'react';
|
import React, { useState, useEffect, useRef } from 'react';
|
||||||
import { ArrowLeft, Calendar, Layers, Plus, Trash2, Edit3, CheckCircle2, AlertCircle, Users, UserCheck } from 'lucide-react';
|
import { ArrowLeft, Calendar, Layers, Plus, Trash2, Edit3, CheckCircle2, AlertCircle, Users, UserCheck } from 'lucide-react';
|
||||||
import { apiFetch } from '../api/client';
|
import { apiFetch } from '../api/client';
|
||||||
|
|
||||||
export default function EventEditorPage({ eventToEdit, skills, user, onBack, onSubmit, onDeleteEvent }) {
|
export default function EventEditorPage({ eventToEdit, skills, user, onBack, onSubmit, onDeleteEvent }) {
|
||||||
|
const loadedEventIdRef = useRef(undefined);
|
||||||
|
|
||||||
const [eventId, setEventId] = useState(eventToEdit?.id || null);
|
const [eventId, setEventId] = useState(eventToEdit?.id || null);
|
||||||
const [title, setTitle] = useState(eventToEdit?.title || '');
|
const [title, setTitle] = useState(eventToEdit?.title || '');
|
||||||
const [description, setDescription] = useState(eventToEdit?.description || '');
|
const [description, setDescription] = useState(eventToEdit?.description || '');
|
||||||
@@ -26,6 +28,12 @@ export default function EventEditorPage({ eventToEdit, skills, user, onBack, onS
|
|||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
fetchUsers();
|
fetchUsers();
|
||||||
|
|
||||||
|
const currentId = eventToEdit?.id || null;
|
||||||
|
|
||||||
|
// Only populate form fields if eventId changed or initial load
|
||||||
|
if (loadedEventIdRef.current !== currentId) {
|
||||||
|
loadedEventIdRef.current = currentId;
|
||||||
|
|
||||||
if (eventToEdit) {
|
if (eventToEdit) {
|
||||||
setEventId(eventToEdit.id);
|
setEventId(eventToEdit.id);
|
||||||
setTitle(eventToEdit.title || '');
|
setTitle(eventToEdit.title || '');
|
||||||
@@ -82,6 +90,7 @@ export default function EventEditorPage({ eventToEdit, skills, user, onBack, onS
|
|||||||
}
|
}
|
||||||
]);
|
]);
|
||||||
}
|
}
|
||||||
|
}
|
||||||
}, [eventToEdit]);
|
}, [eventToEdit]);
|
||||||
|
|
||||||
const fetchUsers = async () => {
|
const fetchUsers = async () => {
|
||||||
|
|||||||
Reference in New Issue
Block a user