init_richi/schichtplanung
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: Guard EventEditorPage state initialization with loadedEventIdRef and key prop to prevent values resetting to defaults on edit

Browse Source
This commit is contained in:
Richard
2026-07-31 12:20:37 +02:00
parent c295471827
commit 1a880d3452
3 changed files with 65 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/dist/index.html
Vendored
+1 -1
View File
@@ -11,7 +11,7 @@
<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">
<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">
</head>
<body class="bg-paper text-main font-sans antialiased min-h-screen">
frontend/src/App.jsx
+1
View File
@@ -490,6 +490,7 @@ export default function App() {
/>
) : activeTab === 'event-editor' ? (
<EventEditorPage
key={eventToEdit?.id || 'new-event'}
eventToEdit={eventToEdit}
skills={skills}
user={user}
frontend/src/pages/EventEditorPage.jsx
+63 -54
View File
@@ -1,10 +1,12 @@
/* Hallmark · pre-emit critique: P5 H5 E5 S5 R5 V5 */
/* 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 { apiFetch } from '../api/client';
export default function EventEditorPage({ eventToEdit, skills, user, onBack, onSubmit, onDeleteEvent }) {
const loadedEventIdRef = useRef(undefined);
const [eventId, setEventId] = useState(eventToEdit?.id || null);
const [title, setTitle] = useState(eventToEdit?.title || '');
const [description, setDescription] = useState(eventToEdit?.description || '');
@@ -26,61 +28,68 @@ export default function EventEditorPage({ eventToEdit, skills, user, onBack, onS
useEffect(() => {
fetchUsers();
if (eventToEdit) {
setEventId(eventToEdit.id);
setTitle(eventToEdit.title || '');
setDescription(eventToEdit.description || '');
setLocation(eventToEdit.location || '');
setStartDate(eventToEdit.start_date || new Date().toISOString().split('T')[0]);
setEndDate(eventToEdit.end_date || new Date().toISOString().split('T')[0]);
setCoManagerIds(
eventToEdit.co_managers ? eventToEdit.co_managers.map(u => (typeof u === 'object' ? u.id : u)) : []
);
const currentId = eventToEdit?.id || null;
if (eventToEdit.task_areas && eventToEdit.task_areas.length > 0) {
const formattedAreas = eventToEdit.task_areas.map(ta => ({
id: ta.id,
name: ta.name,
description: ta.description || '',
shifts: (ta.shifts || []).map(s => ({
id: s.id,
title: s.title,
date: s.date || eventToEdit.start_date,
start_time: s.start_time,
end_time: s.end_time,
max_participants: s.max_participants || 1,
required_skill_ids: s.required_skills ? s.required_skills.map(sk => (typeof sk === 'object' ? sk.id : sk)) : []
}))
}));
setTaskAreas(formattedAreas);
} else {
setTaskAreas([]);
}
} else {
setEventId(null);
setTitle('');
setDescription('');
setLocation('');
setStartDate(new Date().toISOString().split('T')[0]);
setEndDate(new Date().toISOString().split('T')[0]);
setCoManagerIds([]);
setTaskAreas([
{
name: 'Tresendienst',
description: 'Getränke- und Barverkauf',
shifts: [{ title: 'Schicht 1', start_time: '18:00', end_time: '22:00', max_participants: 2, required_skill_ids: [] }]
},
{
name: 'Essen kochen',
description: 'Zubereitung von Speisen',
shifts: [{ title: 'Frühschicht', start_time: '15:00', end_time: '19:00', max_participants: 3, required_skill_ids: [] }]
},
{
name: 'Aufbau & Aufräumen',
description: 'Tische, Stühle & Technik',
shifts: [{ title: 'Aufbau', start_time: '12:00', end_time: '15:00', max_participants: 4, required_skill_ids: [] }]
// Only populate form fields if eventId changed or initial load
if (loadedEventIdRef.current !== currentId) {
loadedEventIdRef.current = currentId;
if (eventToEdit) {
setEventId(eventToEdit.id);
setTitle(eventToEdit.title || '');
setDescription(eventToEdit.description || '');
setLocation(eventToEdit.location || '');
setStartDate(eventToEdit.start_date || new Date().toISOString().split('T')[0]);
setEndDate(eventToEdit.end_date || new Date().toISOString().split('T')[0]);
setCoManagerIds(
eventToEdit.co_managers ? eventToEdit.co_managers.map(u => (typeof u === 'object' ? u.id : u)) : []
);
if (eventToEdit.task_areas && eventToEdit.task_areas.length > 0) {
const formattedAreas = eventToEdit.task_areas.map(ta => ({
id: ta.id,
name: ta.name,
description: ta.description || '',
shifts: (ta.shifts || []).map(s => ({
id: s.id,
title: s.title,
date: s.date || eventToEdit.start_date,
start_time: s.start_time,
end_time: s.end_time,
max_participants: s.max_participants || 1,
required_skill_ids: s.required_skills ? s.required_skills.map(sk => (typeof sk === 'object' ? sk.id : sk)) : []
}))
}));
setTaskAreas(formattedAreas);
} else {
setTaskAreas([]);
}
]);
} else {
setEventId(null);
setTitle('');
setDescription('');
setLocation('');
setStartDate(new Date().toISOString().split('T')[0]);
setEndDate(new Date().toISOString().split('T')[0]);
setCoManagerIds([]);
setTaskAreas([
{
name: 'Tresendienst',
description: 'Getränke- und Barverkauf',
shifts: [{ title: 'Schicht 1', start_time: '18:00', end_time: '22:00', max_participants: 2, required_skill_ids: [] }]
},
{
name: 'Essen kochen',
description: 'Zubereitung von Speisen',
shifts: [{ title: 'Frühschicht', start_time: '15:00', end_time: '19:00', max_participants: 3, required_skill_ids: [] }]
},
{
name: 'Aufbau & Aufräumen',
description: 'Tische, Stühle & Technik',
shifts: [{ title: 'Aufbau', start_time: '12:00', end_time: '15:00', max_participants: 4, required_skill_ids: [] }]
}
]);
}
}
}, [eventToEdit]);