AI Task List

"use client";

import Component from "@/components/ui/ai-task-list";

export default function DemoOne() {
  return (
    <div className="flex min-h-[440px] w-full items-center justify-center bg-background p-10">
      <div className="w-full max-w-lg rounded-2xl border bg-card p-6 shadow-sm">
        <Component
          label="Migrating the billing module"
          tasks={[
            {
              id: "read",
              label: "Read the current schema",
              note: "6 files",
              status: "done",
            },
            {
              id: "plan",
              label: "Plan the column moves",
              status: "done",
              children: [
                { id: "p1", label: "Map invoices.total", status: "done" },
                { id: "p2", label: "Map invoices.currency", status: "done" },
              ],
            },
            {
              id: "write",
              label: "Write the migration",
              note: "in progress",
              status: "running",
            },
            { id: "test", label: "Run the test suite", status: "pending" },
            {
              id: "deploy",
              label: "Deploy to staging",
              note: "blocked on tests",
              status: "failed",
            },
          ]}
        />
      </div>
    </div>
  );
}