fix: lift editor form state to parent so it persists across tab switches

This commit is contained in:
2026-03-22 00:19:49 +01:00
parent de41d2566c
commit 9d22027f23
6 changed files with 104 additions and 61 deletions

View File

@@ -6,7 +6,10 @@ import { updateAssistRulesAction } from '@/lib/actions/configuration';
interface AssistRulesEditorProps {
serverId: string;
config: AssistRules;
formData: AssistRules;
restart: boolean;
onFormDataChange: (data: AssistRules) => void;
onRestartChange: (restart: boolean) => void;
}
const assistFields = [
@@ -57,9 +60,7 @@ const assistFields = [
}
];
export function AssistRulesEditor({ serverId, config }: AssistRulesEditorProps) {
const [formData, setFormData] = useState<AssistRules>(config);
const [restart, setRestart] = useState(true);
export function AssistRulesEditor({ serverId, formData, restart, onFormDataChange, onRestartChange }: AssistRulesEditorProps) {
const [isSubmitting, setIsSubmitting] = useState(false);
const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
@@ -85,10 +86,10 @@ export function AssistRulesEditor({ serverId, config }: AssistRulesEditorProps)
};
const handleInputChange = (key: keyof AssistRules, value: string | number) => {
setFormData((prev) => ({
...prev,
onFormDataChange({
...formData,
[key]: typeof value === 'string' ? parseInt(value) : value
}));
});
};
return (
@@ -127,7 +128,7 @@ export function AssistRulesEditor({ serverId, config }: AssistRulesEditorProps)
<input
type="checkbox"
checked={restart}
onChange={(e) => setRestart(e.target.checked)}
onChange={(e) => onRestartChange(e.target.checked)}
className="h-4 w-4 rounded border-border bg-overlay accent-green focus:ring-1 focus:ring-blue"
/>
Restart server after saving

View File

@@ -6,12 +6,13 @@ import { updateConfigurationAction } from '@/lib/actions/configuration';
interface ConfigurationEditorProps {
serverId: string;
config: Configuration;
formData: Configuration;
restart: boolean;
onFormDataChange: (data: Configuration) => void;
onRestartChange: (restart: boolean) => void;
}
export function ConfigurationEditor({ serverId, config }: ConfigurationEditorProps) {
const [formData, setFormData] = useState<Configuration>(config);
const [restart, setRestart] = useState(true);
export function ConfigurationEditor({ serverId, formData, restart, onFormDataChange, onRestartChange }: ConfigurationEditorProps) {
const [isSubmitting, setIsSubmitting] = useState(false);
const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
@@ -37,10 +38,10 @@ export function ConfigurationEditor({ serverId, config }: ConfigurationEditorPro
};
const handleInputChange = (key: keyof Configuration, value: string | number) => {
setFormData((prev) => ({
...prev,
onFormDataChange({
...formData,
[key]: typeof value === 'string' ? parseInt(value) : value
}));
});
};
return (
@@ -111,7 +112,7 @@ export function ConfigurationEditor({ serverId, config }: ConfigurationEditorPro
<input
type="checkbox"
checked={restart}
onChange={(e) => setRestart(e.target.checked)}
onChange={(e) => onRestartChange(e.target.checked)}
className="h-4 w-4 rounded border-border bg-overlay accent-green focus:ring-1 focus:ring-blue"
/>
Restart server after saving

View File

@@ -6,7 +6,10 @@ import { updateEventConfigAction } from '@/lib/actions/configuration';
interface EventConfigEditorProps {
serverId: string;
config: EventConfig;
formData: EventConfig;
restart: boolean;
onFormDataChange: (data: EventConfig) => void;
onRestartChange: (restart: boolean) => void;
}
const sessionTypes = [
@@ -15,9 +18,7 @@ const sessionTypes = [
{ value: 'R', label: 'Race' }
];
export function EventConfigEditor({ serverId, config }: EventConfigEditorProps) {
const [formData, setFormData] = useState<EventConfig>(config);
const [restart, setRestart] = useState(true);
export function EventConfigEditor({ serverId, formData, restart, onFormDataChange, onRestartChange }: EventConfigEditorProps) {
const [isSubmitting, setIsSubmitting] = useState(false);
const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
@@ -49,15 +50,15 @@ export function EventConfigEditor({ serverId, config }: EventConfigEditorProps)
const handleInputChange = (key: keyof EventConfig, value: string | number) => {
if (key === 'sessions') return;
setFormData((prev) => ({
...prev,
onFormDataChange({
...formData,
[key]:
typeof formData[key] === 'number'
? typeof value === 'string'
? parseFloat(value) || 0
: value
: value
}));
});
};
const handleSessionChange = (index: number, field: keyof Session, value: string | number) => {
@@ -67,11 +68,7 @@ export function EventConfigEditor({ serverId, config }: EventConfigEditorProps)
[field]:
field === 'sessionType' ? value : typeof value === 'string' ? parseFloat(value) || 0 : value
};
setFormData((prev) => ({
...prev,
sessions: newSessions
}));
onFormDataChange({ ...formData, sessions: newSessions });
};
const addSession = () => {
@@ -82,18 +79,11 @@ export function EventConfigEditor({ serverId, config }: EventConfigEditorProps)
sessionType: 'P',
sessionDurationMinutes: 20
};
setFormData((prev) => ({
...prev,
sessions: [...prev.sessions, newSession]
}));
onFormDataChange({ ...formData, sessions: [...formData.sessions, newSession] });
};
const removeSession = (index: number) => {
setFormData((prev) => ({
...prev,
sessions: prev.sessions.filter((_, i) => i !== index)
}));
onFormDataChange({ ...formData, sessions: formData.sessions.filter((_, i) => i !== index) });
};
return (
@@ -412,7 +402,7 @@ export function EventConfigEditor({ serverId, config }: EventConfigEditorProps)
<input
type="checkbox"
checked={restart}
onChange={(e) => setRestart(e.target.checked)}
onChange={(e) => onRestartChange(e.target.checked)}
className="h-4 w-4 rounded border-border bg-overlay accent-green focus:ring-1 focus:ring-blue"
/>
Restart server after saving

View File

@@ -6,7 +6,10 @@ import { updateEventRulesAction } from '@/lib/actions/configuration';
interface EventRulesEditorProps {
serverId: string;
config: EventRules;
formData: EventRules;
restart: boolean;
onFormDataChange: (data: EventRules) => void;
onRestartChange: (restart: boolean) => void;
}
const numberFields = [
@@ -68,9 +71,7 @@ const booleanFields = [
}
];
export function EventRulesEditor({ serverId, config }: EventRulesEditorProps) {
const [formData, setFormData] = useState<EventRules>(config);
const [restart, setRestart] = useState(true);
export function EventRulesEditor({ serverId, formData, restart, onFormDataChange, onRestartChange }: EventRulesEditorProps) {
const [isSubmitting, setIsSubmitting] = useState(false);
const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
@@ -96,10 +97,7 @@ export function EventRulesEditor({ serverId, config }: EventRulesEditorProps) {
};
const handleInputChange = (key: keyof EventRules, value: string | number | boolean) => {
setFormData((prev) => ({
...prev,
[key]: value
}));
onFormDataChange({ ...formData, [key]: value });
};
return (
@@ -151,7 +149,7 @@ export function EventRulesEditor({ serverId, config }: EventRulesEditorProps) {
<input
type="checkbox"
checked={restart}
onChange={(e) => setRestart(e.target.checked)}
onChange={(e) => onRestartChange(e.target.checked)}
className="h-4 w-4 rounded border-border bg-overlay accent-green focus:ring-1 focus:ring-blue"
/>
Restart server after saving

View File

@@ -6,7 +6,10 @@ import { updateServerSettingsAction } from '@/lib/actions/configuration';
interface ServerSettingsEditorProps {
serverId: string;
config: ServerSettings;
formData: ServerSettings;
restart: boolean;
onFormDataChange: (data: ServerSettings) => void;
onRestartChange: (restart: boolean) => void;
}
const textFields = [
@@ -87,9 +90,7 @@ const selectFields = [
}
];
export function ServerSettingsEditor({ serverId, config }: ServerSettingsEditorProps) {
const [formData, setFormData] = useState<ServerSettings>(config);
const [restart, setRestart] = useState(true);
export function ServerSettingsEditor({ serverId, formData, restart, onFormDataChange, onRestartChange }: ServerSettingsEditorProps) {
const [isSubmitting, setIsSubmitting] = useState(false);
const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
@@ -115,10 +116,7 @@ export function ServerSettingsEditor({ serverId, config }: ServerSettingsEditorP
};
const handleInputChange = (key: keyof ServerSettings, value: string | number) => {
setFormData((prev) => ({
...prev,
[key]: value
}));
onFormDataChange({ ...formData, [key]: value });
};
return (
@@ -226,7 +224,7 @@ export function ServerSettingsEditor({ serverId, config }: ServerSettingsEditorP
<input
type="checkbox"
checked={restart}
onChange={(e) => setRestart(e.target.checked)}
onChange={(e) => onRestartChange(e.target.checked)}
className="h-4 w-4 rounded border-border bg-overlay accent-green focus:ring-1 focus:ring-blue"
/>
Restart server after saving