Fix saving subtasks on edit (#806)

This commit is contained in:
Chris 2026-01-31 08:29:44 +02:00 committed by GitHub
parent e7f23bcff8
commit 2f13d0d4a7
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 84 additions and 196 deletions

View file

@ -10,6 +10,7 @@ interface TaskSubtasksSectionProps {
subtasks: Task[];
onSubtasksChange: (subtasks: Task[]) => void;
onSubtaskUpdate?: (subtask: Task) => Promise<void>;
onSave?: (subtasks: Task[]) => void;
}
const TaskSubtasksSection: React.FC<TaskSubtasksSectionProps> = ({
@ -17,6 +18,7 @@ const TaskSubtasksSection: React.FC<TaskSubtasksSectionProps> = ({
subtasks,
onSubtasksChange,
onSubtaskUpdate,
onSave,
}) => {
const [newSubtaskName, setNewSubtaskName] = useState('');
const [isLoading] = useState(false);
@ -28,7 +30,6 @@ const TaskSubtasksSection: React.FC<TaskSubtasksSectionProps> = ({
const scrollToBottom = () => {
setTimeout(() => {
// Find the modal's scrollable container
const modalScrollContainer = document.querySelector(
'.absolute.inset-0.overflow-y-auto'
);
@ -49,24 +50,24 @@ const TaskSubtasksSection: React.FC<TaskSubtasksSectionProps> = ({
status: 'not_started',
priority: 'low',
today: false,
parent_task_id: parentTaskId, // Set the parent task ID immediately
// Mark as new for backend processing
parent_task_id: parentTaskId,
isNew: true,
// Also keep for UI purposes
_isNew: true,
completed_at: null,
} as Task;
onSubtasksChange([...subtasks, newSubtask]);
const updatedSubtasks = [...subtasks, newSubtask];
onSubtasksChange(updatedSubtasks);
setNewSubtaskName('');
// Only scroll when adding new subtask, not when toggling completion
scrollToBottom();
onSave?.(updatedSubtasks);
};
const handleDeleteSubtask = (index: number) => {
const updatedSubtasks = subtasks.filter((_, i) => i !== index);
onSubtasksChange(updatedSubtasks);
onSave?.(updatedSubtasks);
};
const handleKeyPress = (e: React.KeyboardEvent) => {
@ -93,10 +94,8 @@ const TaskSubtasksSection: React.FC<TaskSubtasksSectionProps> = ({
return {
...subtask,
name: editingName.trim(),
// Backend flags
isNew: isNew,
isEdited: isEdited,
// UI flags
_isNew: isNew,
_isEdited: isEdited,
};
@ -107,6 +106,7 @@ const TaskSubtasksSection: React.FC<TaskSubtasksSectionProps> = ({
onSubtasksChange(updatedSubtasks);
setEditingIndex(null);
setEditingName('');
onSave?.(updatedSubtasks);
};
const handleCancelEdit = () => {
@ -130,7 +130,6 @@ const TaskSubtasksSection: React.FC<TaskSubtasksSectionProps> = ({
...subtask,
status: newStatus,
completed_at: isDone ? null : new Date().toISOString(),
// Mark for backend update if it has an ID (existing subtask)
_statusChanged: hasId,
};
}
@ -141,7 +140,6 @@ const TaskSubtasksSection: React.FC<TaskSubtasksSectionProps> = ({
return (
<div ref={subtasksSectionRef} className="space-y-3">
{/* Existing Subtasks */}
{isLoading ? (
<div className="text-sm text-gray-500 dark:text-gray-400">
{t('loading.subtasks', 'Loading subtasks...')}
@ -171,7 +169,6 @@ const TaskSubtasksSection: React.FC<TaskSubtasksSectionProps> = ({
(subtask as any).isNew
)
) {
// Existing subtask - use API for immediate toggle, then update callback
try {
const updatedSubtask =
await toggleTaskCompletion(
@ -187,7 +184,6 @@ const TaskSubtasksSection: React.FC<TaskSubtasksSectionProps> = ({
);
}
} else {
// New subtask or no callback - handle locally
handleToggleNewSubtaskCompletion(
index
);
@ -245,7 +241,6 @@ const TaskSubtasksSection: React.FC<TaskSubtasksSectionProps> = ({
.isNew
)
) {
// Existing subtask - use API for immediate toggle, then update callback
try {
const updatedSubtask =
await toggleTaskCompletion(
@ -261,7 +256,6 @@ const TaskSubtasksSection: React.FC<TaskSubtasksSectionProps> = ({
);
}
} else {
// New subtask or no callback - handle locally
handleToggleNewSubtaskCompletion(
index
);
@ -287,16 +281,6 @@ const TaskSubtasksSection: React.FC<TaskSubtasksSectionProps> = ({
)}
>
{subtask.name}
{(subtask as any)._isNew && (
<span className="ml-2 text-xs text-blue-500 dark:text-blue-400">
(new)
</span>
)}
{(subtask as any)._isEdited && (
<span className="ml-2 text-xs text-orange-500 dark:text-orange-400">
(edited)
</span>
)}
</span>
</div>
<button
@ -320,7 +304,6 @@ const TaskSubtasksSection: React.FC<TaskSubtasksSectionProps> = ({
</div>
)}
{/* Add New Subtask */}
<div className="flex items-center space-x-2">
<input
ref={addInputRef}