feat: init kanban

2026-01-10 15:23:49 +00:00
parent 7551235267
commit 5b31958775
9 changed files with 190 additions and 58 deletions
@@ -0,0 +1,83 @@
+'use client';
+
+import { useState, FormEvent } from 'react';
+import {
+  AlertDialog,
+  AlertDialogContent,
+  AlertDialogHeader,
+  AlertDialogTitle,
+  AlertDialogFooter,
+  AlertDialogCancel,
+} from '@/components/ui/alert-dialog';
+import { Field, FieldLabel } from '@/components/ui/field';
+import { Input } from '@/components/ui/input';
+import { Textarea } from '@/components/ui/textarea';
+import { Button } from '@/components/ui/button';
+
+interface TaskCreateDialogProps {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  onSubmit: (title: string, description: string) => void;
+}
+
+export function TaskCreateDialog({
+  open,
+  onOpenChange,
+  onSubmit,
+}: TaskCreateDialogProps) {
+  const [title, setTitle] = useState('');
+  const [description, setDescription] = useState('');
+
+  const handleSubmit = (e: FormEvent) => {
+    e.preventDefault();
+    if (title.trim()) {
+      onSubmit(title.trim(), description.trim());
+      setTitle('');
+      setDescription('');
+      onOpenChange(false);
+    }
+  };
+
+  const handleCancel = () => {
+    setTitle('');
+    setDescription('');
+    onOpenChange(false);
+  };
+
+  return (
+    <AlertDialog open={open} onOpenChange={onOpenChange}>
+      <AlertDialogContent size="default">
+        <AlertDialogHeader>
+          <AlertDialogTitle>Create Task</AlertDialogTitle>
+        </AlertDialogHeader>
+        <form onSubmit={handleSubmit} className="space-y-4">
+          <Field>
+            <FieldLabel>Title</FieldLabel>
+            <Input
+              autoFocus
+              required
+              placeholder="Enter task title..."
+              value={title}
+              onChange={(e) => setTitle(e.target.value)}
+            />
+          </Field>
+          <Field>
+            <FieldLabel>Description</FieldLabel>
+            <Textarea
+              placeholder="Enter task description (optional)..."
+              value={description}
+              onChange={(e) => setDescription(e.target.value)}
+              rows={3}
+            />
+          </Field>
+          <AlertDialogFooter>
+            <AlertDialogCancel type="button" onClick={handleCancel}>
+              Cancel
+            </AlertDialogCancel>
+            <Button type="submit">Create</Button>
+          </AlertDialogFooter>
+        </form>
+      </AlertDialogContent>
+    </AlertDialog>
+  );
+}