@fayz-ai/plugin-tasks 0.1.1

package/src/components/TaskDetail.tsx

@@ -0,0 +1,184 @@
+import React, { useState, useEffect, useCallback } from 'react'
+import { ArrowLeft, Trash2, Calendar, ChevronDown } from 'lucide-react'
+import { useTasksStore } from '../TasksContext'
+import { useTranslation } from '@fayz-ai/core'
+import { TaskPriorityBadge } from './TaskPriorityBadge'
+import { TaskLabelBadges } from './TaskLabelBadge'
+import { TaskQuickAdd } from './TaskQuickAdd'
+import { TaskCard } from './TaskCard'
+import type { Task, TaskStatus, TaskPriority } from '../types'
+import { TASK_STATUSES, TASK_PRIORITIES } from '../types'
+
+const STATUS_DOT: Record<TaskStatus, string> = {
+  todo: 'bg-muted-foreground',
+  in_progress: 'bg-info',
+  done: 'bg-success',
+  cancelled: 'bg-muted-foreground/60',
+}
+
+function formatDate(iso: string): string {
+  return new Date(iso).toLocaleDateString(undefined, { month: 'short', day: 'numeric' })
+}
+
+export function TaskDetail({ taskId }: { taskId: string }) {
+  const t = useTranslation()
+  const tasks = useTasksStore((s) => s.tasks)
+  const selectTask = useTasksStore((s) => s.selectTask)
+  const updateTask = useTasksStore((s) => s.updateTask)
+  const deleteTask = useTasksStore((s) => s.deleteTask)
+
+  const task = tasks.find((tt) => tt.id === taskId)
+
+  const [title, setTitle] = useState('')
+  const [description, setDescription] = useState('')
+  const [subtasks, setSubtasks] = useState<Task[]>([])
+
+  useEffect(() => {
+    if (task) {
+      setTitle(task.title)
+      setDescription(task.description ?? '')
+    }
+  }, [task])
+
+  useEffect(() => { setSubtasks([]) }, [taskId])
+
+  const handleTitleBlur = useCallback(() => {
+    if (task && title.trim() && title !== task.title) {
+      updateTask(task.id, { title: title.trim() })
+    }
+  }, [task, title, updateTask])
+
+  const handleDescriptionBlur = useCallback(() => {
+    if (task && description !== (task.description ?? '')) {
+      updateTask(task.id, { description: description || null })
+    }
+  }, [task, description, updateTask])
+
+  const handleDelete = useCallback(() => {
+    if (task && confirm(t('tasks.detail.deleteConfirm'))) {
+      deleteTask(task.id)
+    }
+  }, [task, deleteTask, t])
+
+  if (!task) {
+    return (
+      <div className="flex flex-col items-center justify-center py-8 text-muted-foreground">
+        <p className="text-sm">Task not found</p>
+        <button type="button" onClick={() => selectTask(null)} className="mt-2 text-xs text-primary hover:underline">
+          {t('tasks.detail.back')}
+        </button>
+      </div>
+    )
+  }
+
+  return (
+    <div className="space-y-3">
+      {/* Back + title row */}
+      <div className="flex items-center gap-2">
+        <button
+          type="button"
+          onClick={() => selectTask(null)}
+          className="flex h-7 w-7 shrink-0 items-center justify-center rounded-md text-muted-foreground hover:bg-muted hover:text-foreground transition-colors"
+        >
+          <ArrowLeft className="h-4 w-4" />
+        </button>
+        <input
+          type="text"
+          value={title}
+          onChange={(e) => setTitle(e.target.value)}
+          onBlur={handleTitleBlur}
+          onKeyDown={(e) => { if (e.key === 'Enter') e.currentTarget.blur() }}
+          className="flex-1 bg-transparent text-sm font-semibold outline-none"
+        />
+      </div>
+
+      {/* Inline property chips */}
+      <div className="flex flex-wrap items-center gap-1.5">
+        {/* Status chip */}
+        <div className="relative">
+          <select
+            value={task.status}
+            onChange={(e) => updateTask(task.id, { status: e.target.value as TaskStatus })}
+            className="appearance-none rounded-full border bg-background pl-5 pr-6 py-1 text-xs font-medium cursor-pointer hover:border-primary/40 transition-colors"
+          >
+            {TASK_STATUSES.map((s) => (
+              <option key={s} value={s}>{t(`tasks.status.${s}`)}</option>
+            ))}
+          </select>
+          <span className={`absolute left-2 top-1/2 -translate-y-1/2 h-2 w-2 rounded-full ${STATUS_DOT[task.status]}`} />
+          <ChevronDown className="absolute right-1.5 top-1/2 -translate-y-1/2 h-3 w-3 text-muted-foreground pointer-events-none" />
+        </div>
+
+        {/* Priority chip */}
+        <div className="relative">
+          <select
+            value={task.priority}
+            onChange={(e) => updateTask(task.id, { priority: e.target.value as TaskPriority })}
+            className="appearance-none rounded-full border bg-background pl-2 pr-6 py-1 text-xs font-medium cursor-pointer hover:border-primary/40 transition-colors"
+          >
+            {TASK_PRIORITIES.map((p) => (
+              <option key={p} value={p}>{t(`tasks.priority.${p}`)}</option>
+            ))}
+          </select>
+          <ChevronDown className="absolute right-1.5 top-1/2 -translate-y-1/2 h-3 w-3 text-muted-foreground pointer-events-none" />
+        </div>
+
+        {/* Due date chip */}
+        <div className="relative">
+          <input
+            type="date"
+            value={task.dueDate ?? ''}
+            onChange={(e) => updateTask(task.id, { dueDate: e.target.value || null })}
+            className="appearance-none rounded-full border bg-background pl-6 pr-2 py-1 text-xs font-medium cursor-pointer hover:border-primary/40 transition-colors w-[120px]"
+          />
+          <Calendar className="absolute left-2 top-1/2 -translate-y-1/2 h-3 w-3 text-muted-foreground pointer-events-none" />
+        </div>
+
+        {/* Labels */}
+        {task.labels.length > 0 && <TaskLabelBadges labelIds={task.labels} max={3} />}
+      </div>
+
+      {/* Description */}
+      <textarea
+        value={description}
+        onChange={(e) => setDescription(e.target.value)}
+        onBlur={handleDescriptionBlur}
+        placeholder={t('tasks.detail.descriptionPlaceholder')}
+        rows={3}
+        className="w-full rounded-input border border-input  bg-card shadow-[inset_0_1px_0_rgb(0_0_0_/0.06)] px-3 py-2 text-xs outline-none resize-none placeholder:text-muted-foreground/50 leading-relaxed"
+      />
+
+      {/* Subtasks */}
+      <div>
+        <p className="text-[10px] font-semibold text-muted-foreground uppercase tracking-wider mb-1">
+          {t('tasks.detail.subtasks')}
+        </p>
+        <div className="rounded-md border overflow-hidden">
+          <TaskQuickAdd parentId={task.id} />
+          {subtasks.length > 0 && (
+            <div className="divide-y">
+              {subtasks.map((st) => (
+                <TaskCard key={st.id} task={st} />
+              ))}
+            </div>
+          )}
+        </div>
+      </div>
+
+      {/* Footer: timestamps + delete */}
+      <div className="flex items-center justify-between pt-2 border-t">
+        <span className="text-[10px] text-muted-foreground">
+          {formatDate(task.createdAt)} · {t('tasks.detail.updated')} {formatDate(task.updatedAt)}
+        </span>
+        <button
+          type="button"
+          onClick={handleDelete}
+          className="inline-flex items-center gap-1 text-[11px] text-muted-foreground hover:text-destructive transition-colors"
+        >
+          <Trash2 className="h-3 w-3" />
+          {t('tasks.detail.delete')}
+        </button>
+      </div>
+    </div>
+  )
+}

package/src/components/TaskLabelBadge.tsx

@@ -0,0 +1,37 @@
+import React from 'react'
+import { useTasksStore } from '../TasksContext'
+
+export function TaskLabelBadge({ labelId }: { labelId: string }) {
+  const labels = useTasksStore((s) => s.labels)
+  const label = labels.find((l) => l.id === labelId)
+  if (!label) return null
+
+  return (
+    <span
+      className="inline-flex items-center rounded-full px-2 py-0.5 text-[10px] font-medium leading-none"
+      style={{
+        backgroundColor: label.color + '20',
+        color: label.color,
+      }}
+    >
+      {label.name}
+    </span>
+  )
+}
+
+export function TaskLabelBadges({ labelIds, max = 2 }: { labelIds: string[]; max?: number }) {
+  if (labelIds.length === 0) return null
+  const visible = labelIds.slice(0, max)
+  const overflow = labelIds.length - max
+
+  return (
+    <span className="inline-flex items-center gap-1">
+      {visible.map((id) => (
+        <TaskLabelBadge key={id} labelId={id} />
+      ))}
+      {overflow > 0 && (
+        <span className="text-[10px] text-muted-foreground">+{overflow}</span>
+      )}
+    </span>
+  )
+}

package/src/components/TaskPriorityBadge.tsx

@@ -0,0 +1,21 @@
+import React from 'react'
+import { AlertTriangle, ArrowUp, ArrowDown, Minus } from 'lucide-react'
+import type { TaskPriority } from '../types'
+
+const PRIORITY_CONFIG: Record<TaskPriority, { color: string; bg: string; icon: React.ComponentType<{ className?: string }> }> = {
+  low: { color: 'text-muted-foreground', bg: 'bg-muted', icon: ArrowDown },
+  medium: { color: 'text-info-soft-foreground', bg: 'bg-info-soft', icon: Minus },
+  high: { color: 'text-warning-soft-foreground', bg: 'bg-warning-soft', icon: ArrowUp },
+  urgent: { color: 'text-destructive-soft-foreground', bg: 'bg-destructive-soft', icon: AlertTriangle },
+}
+
+export function TaskPriorityBadge({ priority, showLabel }: { priority: TaskPriority; showLabel?: boolean }) {
+  const cfg = PRIORITY_CONFIG[priority]
+  const Icon = cfg.icon
+  return (
+    <span className={`inline-flex items-center gap-1 rounded px-1.5 py-0.5 text-xs font-medium ${cfg.color} ${cfg.bg}`}>
+      <Icon className="h-3 w-3" />
+      {showLabel && <span className="capitalize">{priority}</span>}
+    </span>
+  )
+}

package/src/components/TaskQuickAdd.tsx

@@ -0,0 +1,42 @@
+import React, { useState, useCallback } from 'react'
+import { Plus } from 'lucide-react'
+import { useTasksStore, useTasksConfig } from '../TasksContext'
+import { useTranslation } from '@fayz-ai/core'
+import type { TaskPriority } from '../types'
+
+export function TaskQuickAdd({ parentId }: { parentId?: string | null }) {
+  const t = useTranslation()
+  const createTask = useTasksStore((s) => s.createTask)
+  const [title, setTitle] = useState('')
+  const [loading, setLoading] = useState(false)
+
+  const handleSubmit = useCallback(async (e: React.FormEvent) => {
+    e.preventDefault()
+    const trimmed = title.trim()
+    if (!trimmed || loading) return
+    setLoading(true)
+    try {
+      await createTask({
+        title: trimmed,
+        parentId: parentId ?? null,
+      })
+      setTitle('')
+    } finally {
+      setLoading(false)
+    }
+  }, [title, loading, createTask, parentId])
+
+  return (
+    <form onSubmit={handleSubmit} className="flex items-center gap-2 px-3 py-2 border-b">
+      <Plus className="h-4 w-4 shrink-0 text-muted-foreground" />
+      <input
+        type="text"
+        value={title}
+        onChange={(e) => setTitle(e.target.value)}
+        placeholder={parentId ? t('tasks.detail.addSubtask') : t('tasks.quickAdd.placeholder')}
+        className="flex-1 bg-transparent text-sm outline-none placeholder:text-muted-foreground/60"
+        disabled={loading}
+      />
+    </form>
+  )
+}

package/src/components/TaskStatusGroup.tsx

@@ -0,0 +1,44 @@
+import React, { useState } from 'react'
+import { ChevronDown, ChevronRight } from 'lucide-react'
+import { useTranslation } from '@fayz-ai/core'
+import { TaskCard } from './TaskCard'
+import type { Task, TaskStatus } from '../types'
+
+const STATUS_COLORS: Record<TaskStatus, string> = {
+  todo: 'bg-muted-foreground',
+  in_progress: 'bg-info',
+  done: 'bg-success',
+  cancelled: 'bg-muted-foreground/60',
+}
+
+export function TaskStatusGroup({ status, tasks }: { status: TaskStatus; tasks: Task[] }) {
+  const t = useTranslation()
+  const [collapsed, setCollapsed] = useState(status === 'cancelled')
+
+  if (tasks.length === 0) return null
+
+  const Chevron = collapsed ? ChevronRight : ChevronDown
+
+  return (
+    <div className="space-y-0.5">
+      <button
+        type="button"
+        onClick={() => setCollapsed(!collapsed)}
+        className="flex w-full items-center gap-2 px-3 py-1.5 text-xs font-semibold text-muted-foreground uppercase tracking-wider hover:text-foreground transition-colors"
+      >
+        <span className={`h-2 w-2 rounded-full ${STATUS_COLORS[status]}`} />
+        <span>{t(`tasks.status.${status}`)}</span>
+        <span className="text-[10px] font-normal">({tasks.length})</span>
+        <Chevron className="ml-auto h-3.5 w-3.5" />
+      </button>
+
+      {!collapsed && (
+        <div>
+          {tasks.map((task) => (
+            <TaskCard key={task.id} task={task} />
+          ))}
+        </div>
+      )}
+    </div>
+  )
+}

package/src/components/TasksDrawer.tsx

@@ -0,0 +1,94 @@
+import React from 'react'
+import {
+  Sheet, SheetContent, SheetHeader, SheetBody, SheetTitle, SheetDescription,
+} from '@fayz-ai/ui'
+import { useTasksStore } from '../TasksContext'
+import { useTranslation } from '@fayz-ai/core'
+import { TasksFilterBar } from './TasksFilterBar'
+import { TaskQuickAdd } from './TaskQuickAdd'
+import { TaskCard } from './TaskCard'
+import { TaskStatusGroup } from './TaskStatusGroup'
+import { TaskDetail } from './TaskDetail'
+import { ClipboardList } from 'lucide-react'
+import type { TaskStatus } from '../types'
+
+const STATUS_ORDER: TaskStatus[] = ['todo', 'in_progress', 'done', 'cancelled']
+
+export function TasksDrawer() {
+  const t = useTranslation()
+  const drawerOpen = useTasksStore((s) => s.drawerOpen)
+  const closeDrawer = useTasksStore((s) => s.closeDrawer)
+  const selectedTaskId = useTasksStore((s) => s.selectedTaskId)
+  const tasks = useTasksStore((s) => s.tasks)
+  const tasksLoading = useTasksStore((s) => s.tasksLoading)
+  const summary = useTasksStore((s) => s.summary)
+  const activeFilter = useTasksStore((s) => s.activeFilter)
+
+  // Group tasks by status
+  const grouped = React.useMemo(() => {
+    const map = new Map<TaskStatus, typeof tasks>()
+    for (const s of STATUS_ORDER) map.set(s, [])
+    for (const task of tasks) {
+      const group = map.get(task.status)
+      if (group) group.push(task)
+    }
+    return map
+  }, [tasks])
+
+  // Summary line
+  const summaryLine = React.useMemo(() => {
+    if (!summary) return ''
+    const parts: string[] = []
+    if (summary.overdue > 0) parts.push(`${summary.overdue} ${t('tasks.summary.overdue')}`)
+    if (summary.dueToday > 0) parts.push(`${summary.dueToday} ${t('tasks.summary.dueToday')}`)
+    return parts.join(' · ')
+  }, [summary, t])
+
+  return (
+    <Sheet open={drawerOpen} onOpenChange={(v) => { if (!v) closeDrawer() }}>
+      <SheetContent width="max-w-lg" overlay="dim">
+        <SheetHeader>
+          <SheetTitle>{t('tasks.drawer.title')}</SheetTitle>
+          <SheetDescription>
+            {summaryLine || t('tasks.drawer.subtitle')}
+          </SheetDescription>
+        </SheetHeader>
+
+        {!selectedTaskId && <TasksFilterBar />}
+        {!selectedTaskId && <TaskQuickAdd />}
+
+        <SheetBody className="px-0 py-0">
+          {selectedTaskId ? (
+            <div className="px-5 py-4">
+              <TaskDetail taskId={selectedTaskId} />
+            </div>
+          ) : tasksLoading && tasks.length === 0 ? (
+            <div className="flex items-center justify-center py-16">
+              <div className="h-5 w-5 animate-spin rounded-full border-2 border-primary border-t-transparent" />
+            </div>
+          ) : tasks.length === 0 ? (
+            <div className="flex flex-col items-center justify-center py-16 text-muted-foreground">
+              <ClipboardList className="h-10 w-10 mb-3 opacity-40" />
+              <p className="text-sm font-medium">{t('tasks.empty')}</p>
+              <p className="text-xs mt-1">{t('tasks.empty.description')}</p>
+            </div>
+          ) : activeFilter !== 'all' ? (
+            <div className="py-1">
+              {tasks.map((task) => (
+                <div key={task.id} className="px-2">
+                  <TaskCard task={task} />
+                </div>
+              ))}
+            </div>
+          ) : (
+            <div className="py-2 space-y-2">
+              {STATUS_ORDER.filter((s) => s !== 'cancelled' || (grouped.get(s)?.length ?? 0) > 0).map((status) => (
+                <TaskStatusGroup key={status} status={status} tasks={grouped.get(status) ?? []} />
+              ))}
+            </div>
+          )}
+        </SheetBody>
+      </SheetContent>
+    </Sheet>
+  )
+}

package/src/components/TasksFilterBar.tsx

@@ -0,0 +1,57 @@
+import React from 'react'
+import { useTasksStore } from '../TasksContext'
+import { useTranslation } from '@fayz-ai/core'
+import type { TaskStatus } from '../types'
+
+const FILTERS: Array<{ key: TaskStatus | 'all'; labelKey: string }> = [
+  { key: 'all', labelKey: 'tasks.filter.all' },
+  { key: 'todo', labelKey: 'tasks.filter.todo' },
+  { key: 'in_progress', labelKey: 'tasks.filter.inProgress' },
+  { key: 'done', labelKey: 'tasks.filter.done' },
+]
+
+export function TasksFilterBar() {
+  const t = useTranslation()
+  const activeFilter = useTasksStore((s) => s.activeFilter)
+  const setFilter = useTasksStore((s) => s.setFilter)
+  const summary = useTasksStore((s) => s.summary)
+
+  const getCount = (key: TaskStatus | 'all'): number | undefined => {
+    if (!summary) return undefined
+    switch (key) {
+      case 'all': return summary.total
+      case 'todo': return summary.todo
+      case 'in_progress': return summary.inProgress
+      case 'done': return summary.done
+      default: return undefined
+    }
+  }
+
+  return (
+    <div className="flex items-center gap-1 px-3 py-2 border-b overflow-x-auto">
+      {FILTERS.map(({ key, labelKey }) => {
+        const active = activeFilter === key
+        const count = getCount(key)
+        return (
+          <button
+            key={key}
+            type="button"
+            onClick={() => setFilter(key)}
+            className={`inline-flex items-center gap-1.5 rounded-full px-3 py-1 text-xs font-medium transition-colors whitespace-nowrap ${
+              active
+                ? 'bg-primary text-primary-foreground'
+                : 'text-muted-foreground hover:bg-muted hover:text-foreground'
+            }`}
+          >
+            {t(labelKey)}
+            {count != null && (
+              <span className={`text-[10px] ${active ? 'text-primary-foreground/80' : 'text-muted-foreground'}`}>
+                {count}
+              </span>
+            )}
+          </button>
+        )
+      })}
+    </div>
+  )
+}

package/src/components/TasksGeneralSettings.tsx

@@ -0,0 +1,29 @@
+import React from 'react'
+import { useTranslation } from '@fayz-ai/core'
+
+export function TasksGeneralSettings() {
+  const t = useTranslation()
+
+  return (
+    <div className="space-y-6">
+      <div>
+        <h3 className="text-sm font-semibold mb-1">{t('tasks.settings.general')}</h3>
+        <p className="text-xs text-muted-foreground mb-3">
+          {t('tasks.drawer.subtitle')}
+        </p>
+      </div>
+
+      <div className="space-y-4">
+        <div className="space-y-1.5">
+          <label className="text-sm font-medium">{t('tasks.settings.defaultPriority')}</label>
+          <select className="w-full max-w-xs rounded-input border border-input  bg-card shadow-[inset_0_1px_0_rgb(0_0_0_/0.06)] px-3 py-2 text-sm">
+            <option value="low">{t('tasks.priority.low')}</option>
+            <option value="medium" selected>{t('tasks.priority.medium')}</option>
+            <option value="high">{t('tasks.priority.high')}</option>
+            <option value="urgent">{t('tasks.priority.urgent')}</option>
+          </select>
+        </div>
+      </div>
+    </div>
+  )
+}

package/src/components/TasksTopbarButton.tsx

@@ -0,0 +1,64 @@
+import React, { useEffect } from 'react'
+import { CheckSquare } from 'lucide-react'
+import { Button } from '@fayz-ai/ui'
+import { cn } from '@fayz-ai/ui'
+import { TasksContextProvider, type ResolvedTasksConfig } from '../TasksContext'
+import { TasksDrawer } from './TasksDrawer'
+import type { TasksDataProvider } from '../data/types'
+import type { TasksUIState } from '../store'
+import { useStore, type StoreApi } from 'zustand'
+
+interface TasksTopbarWidgetProps {
+  config: {
+    tasksConfig: ResolvedTasksConfig
+    tasksProvider: TasksDataProvider
+    tasksStore: StoreApi<TasksUIState>
+  }
+}
+
+export function TasksTopbarButton({ config }: TasksTopbarWidgetProps) {
+  const { tasksConfig, tasksProvider, tasksStore } = config
+
+  return (
+    <TasksContextProvider config={tasksConfig} provider={tasksProvider} store={tasksStore}>
+      <TasksTopbarButtonInner store={tasksStore} />
+      <TasksDrawer />
+    </TasksContextProvider>
+  )
+}
+
+function TasksTopbarButtonInner({ store }: { store: StoreApi<TasksUIState> }) {
+  const toggleDrawer = useStore(store, (s) => s.toggleDrawer)
+  const fetchSummary = useStore(store, (s) => s.fetchSummary)
+  const summary = useStore(store, (s) => s.summary)
+
+  useEffect(() => {
+    fetchSummary()
+  }, [fetchSummary])
+
+  const pendingCount = summary ? summary.todo + summary.inProgress : 0
+
+  return (
+    <Button
+      variant="ghost"
+      size="icon"
+      className={cn('relative text-sidebar-foreground/70 hover:bg-sidebar/30 hover:text-sidebar-foreground')}
+      onClick={toggleDrawer}
+      aria-label="Tasks"
+    >
+      <CheckSquare className="h-5 w-5" />
+      {pendingCount > 0 && (
+        <span
+          className={cn(
+            'absolute -right-0.5 -top-0.5 flex items-center justify-center rounded-full bg-destructive text-destructive-foreground',
+            pendingCount > 9
+              ? 'h-5 min-w-5 px-1 text-[10px]'
+              : 'h-4 w-4 text-[10px]'
+          )}
+        >
+          {pendingCount > 99 ? '99+' : pendingCount}
+        </span>
+      )}
+    </Button>
+  )
+}

package/src/data/capability.test.ts

@@ -0,0 +1,43 @@
+// First end-to-end capability test for any Fayz plugin (FAY-1206).
+// Proves the data slice of the Plugin Capability Contract against the mock
+// provider: typed seed is present, writes persist and surface in queries and
+// the summary, and updates/deletes round-trip. This is the template other
+// plugins copy — see PLUGIN_PATTERNS.md → capability anatomy.
+import { describe, it, expect } from 'vitest'
+import { createMockTasksProvider } from './mock'
+
+describe('plugin-tasks capability · data slice (mock provider)', () => {
+  it('ships typed seed (labels are provisioned, not empty)', async () => {
+    const provider = createMockTasksProvider()
+    const labels = await provider.getLabels()
+    expect(labels).toHaveLength(4)
+    expect(labels.map((l) => l.name)).toContain('Bug')
+  })
+
+  it('persists a created task: it surfaces in queries and the summary', async () => {
+    const provider = createMockTasksProvider()
+    const before = await provider.getSummary()
+
+    const task = await provider.createTask({ title: 'Wire capability gate', status: 'todo', priority: 'high' })
+    expect(task.id).toBeTruthy()
+    expect(task.tenantId).toBe('mock')
+
+    const todo = await provider.getTasks({ status: 'todo' })
+    expect(todo.some((t) => t.id === task.id)).toBe(true)
+
+    const after = await provider.getSummary()
+    expect(after.total).toBe(before.total + 1)
+    expect(after.highPriority).toBe(before.highPriority + 1)
+  })
+
+  it('round-trips update and delete', async () => {
+    const provider = createMockTasksProvider()
+    const task = await provider.createTask({ title: 'temp' })
+
+    const moved = await provider.updateTask(task.id, { status: 'done' })
+    expect(moved.status).toBe('done')
+
+    await provider.deleteTask(task.id)
+    expect(await provider.getTaskById(task.id)).toBeNull()
+  })
+})