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

@@ -1,6 +1,10 @@
import { beforeEach, describe, expect, it, vi } from 'vitest'
import {
createTask,
deleteTask,
getAllTasks,
getTask,
inactivateTask,
getTasksByEntity,
updateTask,
type EntityTaskResponse,
@@ -13,6 +17,7 @@ const taskOne: EntityTaskResponse = {
prompt: 'Summarize jokes',
scheduleCron: '0 9 * * 1',
emailLookback: 'last_week',
active: true,
createdAt: '2026-03-26T10:00:00Z',
}
@@ -23,6 +28,7 @@ const taskTwo: EntityTaskResponse = {
prompt: 'Escalate sandwich policy',
scheduleCron: '0 11 1 * *',
emailLookback: 'last_month',
active: false,
createdAt: '2026-03-26T11:00:00Z',
}
@@ -38,12 +44,66 @@ describe('tasksApi', () => {
await expect(getTask('task-1')).resolves.toEqual(taskOne)
})
it('should_returnInactiveTask_when_getTaskCalledWithInactiveId', async () => {
localStorage.setItem('condado:entity-tasks', JSON.stringify([taskOne, taskTwo]))
await expect(getTask('task-2')).resolves.toEqual(taskTwo)
})
it('should_returnTasksForEntity_when_getTasksByEntityCalled', async () => {
localStorage.setItem('condado:entity-tasks', JSON.stringify([taskOne, taskTwo]))
await expect(getTasksByEntity('entity-1')).resolves.toEqual([taskOne])
})
it('should_hideInactiveTasks_when_getAllTasksCalled', async () => {
localStorage.setItem('condado:entity-tasks', JSON.stringify([taskOne, taskTwo]))
await expect(getAllTasks()).resolves.toEqual([taskOne])
})
it('should_hideInactiveTasksForEntity_when_getTasksByEntityCalled', async () => {
localStorage.setItem(
'condado:entity-tasks',
JSON.stringify([
taskOne,
taskTwo,
{
...taskOne,
id: 'task-3',
active: false,
},
])
)
await expect(getTasksByEntity('entity-1')).resolves.toEqual([taskOne])
})
it('should_storeActiveTaskByDefault_when_createTaskCalled', async () => {
vi.spyOn(crypto, 'randomUUID').mockReturnValue('00000000-0000-0000-0000-000000000003')
const createdTask = await createTask({
entityId: 'entity-1',
name: 'Daily Check-in',
prompt: 'Ask about ceremonial coffee',
scheduleCron: '0 8 * * 1-5',
emailLookback: 'last_day',
})
expect(createdTask).toEqual(
expect.objectContaining({
id: '00000000-0000-0000-0000-000000000003',
active: true,
})
)
expect(JSON.parse(localStorage.getItem('condado:entity-tasks') ?? '[]')).toEqual([
expect.objectContaining({
id: '00000000-0000-0000-0000-000000000003',
active: true,
}),
])
})
it('should_updateStoredTask_when_updateTaskCalled', async () => {
localStorage.setItem('condado:entity-tasks', JSON.stringify([taskOne, taskTwo]))
@@ -73,4 +133,30 @@ describe('tasksApi', () => {
taskTwo,
])
})
it('should_markTaskInactive_when_inactivateTaskCalled', async () => {
localStorage.setItem('condado:entity-tasks', JSON.stringify([taskOne, taskTwo]))
const updatedTask = await inactivateTask('task-1')
expect(updatedTask).toEqual({
...taskOne,
active: false,
})
expect(JSON.parse(localStorage.getItem('condado:entity-tasks') ?? '[]')).toEqual([
{
...taskOne,
active: false,
},
taskTwo,
])
})
it('should_removeTask_when_deleteTaskCalled', async () => {
localStorage.setItem('condado:entity-tasks', JSON.stringify([taskOne, taskTwo]))
await deleteTask('task-1')
expect(JSON.parse(localStorage.getItem('condado:entity-tasks') ?? '[]')).toEqual([taskTwo])
})
})

View File

@@ -68,6 +68,7 @@ describe('CreateTaskPage', () => {
prompt: 'Talk about coffee',
scheduleCron: '0 8 * * 1-5',
emailLookback: 'last_week',
active: true,
createdAt: '2026-03-26T10:00:00Z',
})

View File

@@ -15,8 +15,10 @@ vi.mock('react-router-dom', async () => {
vi.mock('@/api/entitiesApi')
vi.mock('@/api/tasksApi')
function renderPage() {
const queryClient = new QueryClient({ defaultOptions: { queries: { retry: false } } })
const wrapper = ({ children }: { children: React.ReactNode }) => (
<QueryClientProvider client={new QueryClient({ defaultOptions: { queries: { retry: false } } })}>
<QueryClientProvider client={queryClient}>
<MemoryRouter initialEntries={['/entities/entity-1/tasks/task-1']}>
<Routes>
<Route path="/entities/:entityId/tasks/:taskId" element={children} />
@@ -25,6 +27,11 @@ const wrapper = ({ children }: { children: React.ReactNode }) => (
</QueryClientProvider>
)
render(<EditTaskPage />, { wrapper })
return { queryClient }
}
const mockEntity = {
id: 'entity-1',
name: 'Entity A',
@@ -44,6 +51,7 @@ const mockTask = {
prompt: 'Summarize jokes',
scheduleCron: '0 9 * * 1',
emailLookback: 'last_week' as const,
active: true,
createdAt: '2026-03-26T10:00:00Z',
}
@@ -51,11 +59,13 @@ describe('EditTaskPage', () => {
beforeEach(() => {
vi.mocked(entitiesApi.getEntity).mockResolvedValue(mockEntity)
vi.mocked(tasksApi.getTask).mockResolvedValue(mockTask)
vi.mocked(tasksApi.inactivateTask).mockResolvedValue({ ...mockTask, active: false })
vi.mocked(tasksApi.deleteTask).mockResolvedValue(undefined)
mockNavigate.mockClear()
})
it('should_renderPrefilledTaskForm_when_pageLoads', async () => {
render(<EditTaskPage />, { wrapper })
renderPage()
await screen.findByRole('link', { name: /back to entity a/i })
@@ -80,7 +90,8 @@ describe('EditTaskPage', () => {
emailLookback: 'last_day',
})
render(<EditTaskPage />, { wrapper })
const { queryClient } = renderPage()
const invalidateQueriesSpy = vi.spyOn(queryClient, 'invalidateQueries')
await screen.findByRole('link', { name: /back to entity a/i })
fireEvent.change(screen.getByLabelText(/task name/i), { target: { value: 'Daily Check-in' } })
@@ -119,6 +130,41 @@ describe('EditTaskPage', () => {
scheduleCron: '0 8 * * 1-5',
emailLookback: 'last_day',
})
expect(invalidateQueriesSpy).toHaveBeenCalledWith({ queryKey: ['entity-tasks', 'entity-1'] })
expect(invalidateQueriesSpy).toHaveBeenCalledWith({ queryKey: ['entity-task', 'task-1'] })
expect(invalidateQueriesSpy).toHaveBeenCalledWith({ queryKey: ['entity-tasks'] })
expect(mockNavigate).toHaveBeenCalledWith('/entities/entity-1')
})
})
it('should_inactivateTaskAndNavigateBack_when_inactivateClicked', async () => {
const { queryClient } = renderPage()
const invalidateQueriesSpy = vi.spyOn(queryClient, 'invalidateQueries')
await screen.findByRole('link', { name: /back to entity a/i })
fireEvent.click(screen.getByRole('button', { name: /inactivate/i }))
await waitFor(() => {
expect(tasksApi.inactivateTask).toHaveBeenCalledWith('task-1')
expect(invalidateQueriesSpy).toHaveBeenCalledWith({ queryKey: ['entity-tasks', 'entity-1'] })
expect(invalidateQueriesSpy).toHaveBeenCalledWith({ queryKey: ['entity-task', 'task-1'] })
expect(invalidateQueriesSpy).toHaveBeenCalledWith({ queryKey: ['entity-tasks'] })
expect(mockNavigate).toHaveBeenCalledWith('/entities/entity-1')
})
})
it('should_deleteTaskAndNavigateBack_when_deleteClicked', async () => {
const { queryClient } = renderPage()
const invalidateQueriesSpy = vi.spyOn(queryClient, 'invalidateQueries')
await screen.findByRole('link', { name: /back to entity a/i })
fireEvent.click(screen.getByRole('button', { name: /delete/i }))
await waitFor(() => {
expect(tasksApi.deleteTask).toHaveBeenCalledWith('task-1')
expect(invalidateQueriesSpy).toHaveBeenCalledWith({ queryKey: ['entity-tasks', 'entity-1'] })
expect(invalidateQueriesSpy).toHaveBeenCalledWith({ queryKey: ['entity-task', 'task-1'] })
expect(invalidateQueriesSpy).toHaveBeenCalledWith({ queryKey: ['entity-tasks'] })
expect(mockNavigate).toHaveBeenCalledWith('/entities/entity-1')
})
})

View File

@@ -42,6 +42,7 @@ describe('EntityDetailPage', () => {
prompt: 'Summarize jokes',
scheduleCron: '0 9 * * 1',
emailLookback: 'last_week',
active: true,
createdAt: '2026-03-26T10:00:00Z',
},
])

View File

@@ -9,6 +9,7 @@ export interface EntityTaskResponse {
prompt: string
scheduleCron: string
emailLookback: EmailLookback
active: boolean
createdAt: string
}
@@ -27,7 +28,12 @@ function readTasks(): EntityTaskResponse[] {
if (!raw) return []
try {
return JSON.parse(raw) as EntityTaskResponse[]
return (JSON.parse(raw) as Array<Omit<EntityTaskResponse, 'active'> & { active?: boolean }>).map(
(task) => ({
...task,
active: task.active ?? true,
})
)
} catch {
return []
}
@@ -61,12 +67,12 @@ export async function generateTaskPreview(data: EntityTaskCreateDto): Promise<st
/** Returns all scheduled tasks currently configured in local storage. */
export async function getAllTasks(): Promise<EntityTaskResponse[]> {
return readTasks()
return readTasks().filter((task) => task.active)
}
/** Returns scheduled tasks for a specific entity. */
export async function getTasksByEntity(entityId: string): Promise<EntityTaskResponse[]> {
return readTasks().filter((task) => task.entityId === entityId)
return readTasks().filter((task) => task.entityId === entityId && task.active)
}
/** Returns one scheduled task by identifier. */
@@ -80,6 +86,7 @@ export async function createTask(data: EntityTaskCreateDto): Promise<EntityTaskR
const task: EntityTaskResponse = {
...data,
id: crypto.randomUUID(),
active: true,
createdAt: new Date().toISOString(),
}
@@ -108,3 +115,26 @@ export async function updateTask(
writeTasks(current.map((task) => (task.id === taskId ? updatedTask : task)))
return updatedTask
}
/** Marks one scheduled task as inactive in local storage. */
export async function inactivateTask(taskId: string): Promise<EntityTaskResponse | null> {
const current = readTasks()
const existingTask = current.find((task) => task.id === taskId)
if (!existingTask) {
return null
}
const updatedTask: EntityTaskResponse = {
...existingTask,
active: false,
}
writeTasks(current.map((task) => (task.id === taskId ? updatedTask : task)))
return updatedTask
}
/** Deletes one scheduled task from local storage. */
export async function deleteTask(taskId: string): Promise<void> {
writeTasks(readTasks().filter((task) => task.id !== taskId))
}

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}`)}