Prevent changes loss while editing Plan

This commit is contained in:
AG
2025-12-12 21:19:34 +02:00
parent 48da187660
commit c7f5c4048c

View File

@@ -203,10 +203,44 @@ const Plans: React.FC<PlansProps> = ({ lang }) => {
setIsEditing(true); setIsEditing(true);
}; };
// Persist draft to localStorage
useEffect(() => {
if (isEditing) {
const draft = {
editId,
name,
description,
steps
};
localStorage.setItem('gymflow_plan_draft', JSON.stringify(draft));
}
}, [isEditing, editId, name, description, steps]);
// Restore draft on mount
useEffect(() => {
const draftJson = localStorage.getItem('gymflow_plan_draft');
if (draftJson) {
try {
const draft = JSON.parse(draftJson);
// Only restore if we have valid data
if (draft.editId) {
setEditId(draft.editId);
setName(draft.name || '');
setDescription(draft.description || '');
setSteps(draft.steps || []);
setIsEditing(true);
}
} catch (e) {
console.error("Failed to parse plan draft", e);
}
}
}, []);
const handleSave = async () => { const handleSave = async () => {
if (!name.trim() || !editId) return; if (!name.trim() || !editId) return;
const newPlan: WorkoutPlan = { id: editId, name, description, steps }; const newPlan: WorkoutPlan = { id: editId, name, description, steps };
await savePlan(newPlan); await savePlan(newPlan);
localStorage.removeItem('gymflow_plan_draft');
setIsEditing(false); setIsEditing(false);
}; };
@@ -270,7 +304,12 @@ const Plans: React.FC<PlansProps> = ({ lang }) => {
return ( return (
<div className="h-full flex flex-col bg-surface"> <div className="h-full flex flex-col bg-surface">
<div className="px-4 py-3 bg-surface-container border-b border-outline-variant flex justify-between items-center shrink-0"> <div className="px-4 py-3 bg-surface-container border-b border-outline-variant flex justify-between items-center shrink-0">
<Button onClick={() => setIsEditing(false)} variant="ghost" size="icon"> <Button
onClick={() => {
setIsEditing(false);
localStorage.removeItem('gymflow_plan_draft');
}}
variant="ghost" size="icon">
<X size={20} /> <X size={20} />
</Button> </Button>
<h2 className="text-title-medium font-medium text-on-surface">{t('plan_editor', lang)}</h2> <h2 className="text-title-medium font-medium text-on-surface">{t('plan_editor', lang)}</h2>