feat(frontend): add task inactivate and delete actions

Extend the local task store with active state, inactivation, and hard delete support.

Update the edit task page and tests so inactive tasks are hidden from normal lists and task lifecycle actions are available from the details view.
This commit is contained in:
2026-03-27 00:58:58 -03:00
parent 6538c1783d
commit 766b13fbb2
6 changed files with 225 additions and 16 deletions

View File

@@ -3,8 +3,10 @@ import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
import { Link, useNavigate, useParams } from 'react-router-dom'
import { getEntity } from '../api/entitiesApi'
import {
deleteTask,
generateTaskPreview,
getTask,
inactivateTask,
updateTask,
type EmailLookback,
} from '../api/tasksApi'
@@ -93,6 +95,18 @@ const DEFAULT_TASK_FORM: TaskFormState = {
emailLookback: 'last_week',
}
async function invalidateTaskQueries(
queryClient: ReturnType<typeof useQueryClient>,
entityId: string,
taskId: string
) {
await Promise.all([
queryClient.invalidateQueries({ queryKey: ['entity-tasks', entityId] }),
queryClient.invalidateQueries({ queryKey: ['entity-task', taskId] }),
queryClient.invalidateQueries({ queryKey: ['entity-tasks'] }),
])
}
export default function EditTaskPage() {
const { entityId = '', taskId = '' } = useParams()
const navigate = useNavigate()
@@ -138,8 +152,23 @@ export default function EditTaskPage() {
emailLookback: data.emailLookback,
}),
onSuccess: async () => {
await queryClient.invalidateQueries({ queryKey: ['entity-tasks', entityId] })
await queryClient.invalidateQueries({ queryKey: ['entity-task', taskId] })
await invalidateTaskQueries(queryClient, entityId, taskId)
navigate(`/entities/${entityId}`)
},
})
const inactivateTaskMutation = useMutation({
mutationFn: () => inactivateTask(taskId),
onSuccess: async () => {
await invalidateTaskQueries(queryClient, entityId, taskId)
navigate(`/entities/${entityId}`)
},
})
const deleteTaskMutation = useMutation({
mutationFn: () => deleteTask(taskId),
onSuccess: async () => {
await invalidateTaskQueries(queryClient, entityId, taskId)
navigate(`/entities/${entityId}`)
},
})
@@ -386,6 +415,22 @@ export default function EditTaskPage() {
</div>
<div className="flex justify-end gap-3 pb-8">
<button
type="button"
onClick={() => inactivateTaskMutation.mutate()}
disabled={!task.active || inactivateTaskMutation.isPending || deleteTaskMutation.isPending}
className="mr-auto rounded-md border border-amber-700 px-4 py-2 text-sm text-amber-200 hover:border-amber-500 disabled:opacity-50"
>
{inactivateTaskMutation.isPending ? 'Inactivating…' : 'Inactivate'}
</button>
<button
type="button"
onClick={() => deleteTaskMutation.mutate()}
disabled={deleteTaskMutation.isPending || inactivateTaskMutation.isPending}
className="rounded-md border border-red-800 px-4 py-2 text-sm text-red-200 hover:border-red-600 disabled:opacity-50"
>
{deleteTaskMutation.isPending ? 'Deleting…' : 'Delete'}
</button>
<button
type="button"
onClick={() => navigate(`/entities/${entityId}`)}