Error loading Kanban app

Please try refreshing the page.

\n \n \n `, 500);\n }\n});\n\n// Serve frontend assets\nstaticRouter.get(\"/kanban-frontend/*\", (c) => {\n return serveFile(c.req.path, import.meta.url);\n});\n\n// Serve shared utilities\nstaticRouter.get(\"/kanban-shared/*\", (c) => {\n return serveFile(c.req.path, import.meta.url);\n});\n\nexport default staticRouter;",[],[150,197,222],{"_106":230,"_98":231,"_151":232,"_153":198,"_154":137,"_155":233,"_157":158,"_108":234,"_103":190,"_160":180,"_162":235,"_163":25,"_164":-5,"_165":236,"_101":237},"a48a5bec-6dc4-11f0-ae93-0224a6c84d84","tasks.ts","9fa06316-6dc3-11f0-8a90-0224a6c84d84",50,["D",1753935178977],"import { Hono } from \"https://esm.sh/hono@4.0.0\";\nimport { \n getTasksByColumnId,\n getTaskById,\n createTask, \n updateTask, \n moveTask,\n deleteTask\n} from \"../database/queries.ts\";\nimport type { CreateTaskRequest, UpdateTaskRequest, MoveTaskRequest } from \"../../kanban-shared/types.ts\";\n\nconst tasksRouter = new Hono();\n\n// GET /api/columns/:columnId/tasks - Get tasks for a column\ntasksRouter.get(\"/columns/:columnId/tasks\", async (c) => {\n try {\n const columnId = parseInt(c.req.param(\"columnId\"));\n if (isNaN(columnId)) {\n return c.json({ error: \"Invalid column ID\" }, 400);\n }\n\n const tasks = await getTasksByColumnId(columnId);\n return c.json(tasks);\n } catch (error) {\n console.error(\"Error fetching tasks:\", error);\n return c.json({ error: \"Failed to fetch tasks\" }, 500);\n }\n});\n\n// POST /api/columns/:columnId/tasks - Create new task\ntasksRouter.post(\"/columns/:columnId/tasks\", async (c) => {\n try {\n const columnId = parseInt(c.req.param(\"columnId\"));\n if (isNaN(columnId)) {\n return c.json({ error: \"Invalid column ID\" }, 400);\n }\n\n const body: CreateTaskRequest = await c.req.json();\n \n if (!body.title?.trim()) {\n return c.json({ error: \"Task title is required\" }, 400);\n }\n\n // Validate priority if provided\n if (body.priority && !['low', 'medium', 'high'].includes(body.priority)) {\n return c.json({ error: \"Priority must be 'low', 'medium', or 'high'\" }, 400);\n }\n\n // Validate due_date if provided\n if (body.due_date) {\n const date = new Date(body.due_date);\n if (isNaN(date.getTime())) {\n return c.json({ error: \"Invalid due date format\" }, 400);\n }\n }\n\n const taskId = await createTask(\n columnId,\n body.title.trim(),\n body.description?.trim(),\n body.priority || 'medium',\n body.due_date,\n body.position\n );\n\n const newTask = await getTaskById(taskId);\n return c.json(newTask, 201);\n } catch (error) {\n console.error(\"Error creating task:\", error);\n return c.json({ error: \"Failed to create task\" }, 500);\n }\n});\n\n// PUT /api/tasks/:id - Update task\ntasksRouter.put(\"/tasks/:id\", async (c) => {\n try {\n const id = parseInt(c.req.param(\"id\"));\n if (isNaN(id)) {\n return c.json({ error: \"Invalid task ID\" }, 400);\n }\n\n const body: UpdateTaskRequest = await c.req.json();\n \n if (body.title !== undefined && !body.title.trim()) {\n return c.json({ error: \"Task title cannot be empty\" }, 400);\n }\n\n // Validate priority if provided\n if (body.priority && !['low', 'medium', 'high'].includes(body.priority)) {\n return c.json({ error: \"Priority must be 'low', 'medium', or 'high'\" }, 400);\n }\n\n // Validate due_date if provided\n if (body.due_date) {\n const date = new Date(body.due_date);\n if (isNaN(date.getTime())) {\n return c.json({ error: \"Invalid due date format\" }, 400);\n }\n }\n\n const success = await updateTask(\n id,\n body.title?.trim(),\n body.description?.trim(),\n body.priority,\n body.due_date\n );\n\n if (!success) {\n return c.json({ error: \"Task not found or no changes made\" }, 404);\n }\n\n const updatedTask = await getTaskById(id);\n return c.json(updatedTask);\n } catch (error) {\n console.error(\"Error updating task:\", error);\n return c.json({ error: \"Failed to update task\" }, 500);\n }\n});\n\n// PATCH /api/tasks/:id/move - Move task\ntasksRouter.patch(\"/tasks/:id/move\", async (c) => {\n try {\n const id = parseInt(c.req.param(\"id\"));\n if (isNaN(id)) {\n return c.json({ error: \"Invalid task ID\" }, 400);\n }\n\n const body: MoveTaskRequest = await c.req.json();\n \n if (typeof body.column_id !== 'number' || body.column_id < 1) {\n return c.json({ error: \"Valid column ID is required\" }, 400);\n }\n\n if (typeof body.position !== 'number' || body.position < 0) {\n return c.json({ error: \"Valid position is required\" }, 400);\n }\n\n const success = await moveTask(id, body.column_id, body.position);\n if (!success) {\n return c.json({ error: \"Task not found\" }, 404);\n }\n\n const updatedTask = await getTaskById(id);\n return c.json(updatedTask);\n } catch (error) {\n console.error(\"Error moving task:\", error);\n return c.json({ error: \"Failed to move task\" }, 500);\n }\n});\n\n// DELETE /api/tasks/:id - Delete task\ntasksRouter.delete(\"/tasks/:id\", async (c) => {\n try {\n const id = parseInt(c.req.param(\"id\"));\n if (isNaN(id)) {\n return c.json({ error: \"Invalid task ID\" }, 400);\n }\n\n const success = await deleteTask(id);\n if (!success) {\n return c.json({ error: \"Task not found\" }, 404);\n }\n\n return c.json({ message: \"Task deleted successfully\" });\n } catch (error) {\n console.error(\"Error deleting task:\", error);\n return c.json({ error: \"Failed to delete task\" }, 500);\n }\n});\n\nexport default tasksRouter;",[],[150,197,231],[150,197],{"_106":240,"_98":241,"_151":242,"_153":152,"_154":137,"_155":243,"_157":158,"_108":244,"_103":245,"_160":246,"_162":247,"_163":25,"_164":-5,"_165":248,"_101":249},"a47738be-6dc4-11f0-8c70-0224a6c84d84","index.ts","9f86e0a8-6dc3-11f0-adf3-0224a6c84d84",46,["D",1753935178860],2,"http","import { Hono } from \"https://esm.sh/hono@4.0.0\";\nimport { cors } from \"https://esm.sh/hono@4.0.0/cors\";\nimport { runMigrations, createDefaultBoard } from \"./database/migrations.ts\";\nimport { getAllBoards } from \"./database/queries.ts\";\nimport boardsRouter from \"./routes/boards.ts\";\nimport columnsRouter from \"./routes/columns.ts\";\nimport tasksRouter from \"./routes/tasks.ts\";\nimport staticRouter from \"./routes/static.ts\";\n\nconst app = new Hono();\n\n// Unwrap Hono errors to see original error details\napp.onError((err, c) => {\n throw err;\n});\n\n// Enable CORS for development\napp.use(\"/*\", cors({\n origin: \"*\",\n allowHeaders: [\"Content-Type\", \"Authorization\"],\n allowMethods: [\"GET\", \"POST\", \"PUT\", \"PATCH\", \"DELETE\", \"OPTIONS\"]\n}));\n\n// Initialize database on startup\nlet dbInitialized = false;\napp.use(\"*\", async (c, next) => {\n if (!dbInitialized) {\n console.log(\"Initializing Kanban database...\");\n await runMigrations();\n \n // Create default board if no boards exist\n const boards = await getAllBoards();\n if (boards.length === 0) {\n console.log(\"Creating default board...\");\n await createDefaultBoard();\n }\n \n dbInitialized = true;\n console.log(\"Kanban database initialized successfully\");\n }\n await next();\n});\n\n// API routes\napp.route(\"/api/boards\", boardsRouter);\napp.route(\"/api\", columnsRouter);\napp.route(\"/api\", tasksRouter);\n\n// Static file serving\napp.route(\"/\", staticRouter);\n\n// Health check endpoint\napp.get(\"/health\", (c) => {\n return c.json({ \n status: \"healthy\", \n timestamp: new Date().toISOString(),\n service: \"kanban-backend\"\n });\n});\n\n// 404 handler for API routes\napp.get(\"/api/*\", (c) => {\n return c.json({ error: \"API endpoint not found\" }, 404);\n});\n\n// This is the entry point for HTTP vals\nexport default app.fetch;",[],[150,241],[150],{"_106":252,"_98":253,"_151":254,"_153":-5,"_154":137,"_155":255,"_157":158,"_108":256,"_103":29,"_160":161,"_162":-5,"_163":25,"_164":-5,"_165":257,"_101":365},"9ed92c6a-6dc3-11f0-a3fc-0224a6c84d84","kanban-frontend","9ed92d32-6dc3-11f0-a3fc-0224a6c84d84",3,["D",1753934739949],[258,346,356],{"_106":259,"_98":260,"_151":261,"_153":254,"_154":137,"_155":262,"_157":158,"_108":263,"_103":29,"_160":161,"_162":-5,"_163":25,"_164":-5,"_165":264,"_101":345},"9efd65bc-6dc3-11f0-bd23-0224a6c84d84","components","9efd6666-6dc3-11f0-bd23-0224a6c84d84",6,["D",1753934740183],[265,274,283,292,301,309,318,327,336],{"_106":266,"_98":267,"_151":268,"_153":261,"_154":137,"_155":269,"_157":158,"_108":270,"_103":190,"_160":180,"_162":271,"_163":25,"_164":-5,"_165":272,"_101":273},"a44fe7f0-6dc4-11f0-b394-0224a6c84d84","App.tsx","9f8af1fc-6dc3-11f0-9266-0224a6c84d84",38,["D",1753935178572],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport type { Board, DaisyUITheme } from \"../../kanban-shared/types.ts\";\nimport BoardList from \"./BoardList.tsx\";\nimport BoardView from \"./BoardView.tsx\";\n\ninterface AppProps {\n initialData: {\n boards: Board[];\n timestamp: string;\n };\n}\n\nexport default function App({ initialData }: AppProps) {\n const [currentView, setCurrentView] = useState<'list' | 'board'>('list');\n const [selectedBoardId, setSelectedBoardId] = useState(null);\n const [boards, setBoards] = useState(initialData.boards);\n const [theme, setTheme] = useState('light');\n\n // Load theme from localStorage on mount\n useEffect(() => {\n const savedTheme = localStorage.getItem('kanban-theme') as DaisyUITheme;\n if (savedTheme) {\n setTheme(savedTheme);\n document.documentElement.setAttribute('data-theme', savedTheme);\n }\n }, []);\n\n // Theme switcher function\n const changeTheme = (newTheme: DaisyUITheme) => {\n setTheme(newTheme);\n document.documentElement.setAttribute('data-theme', newTheme);\n localStorage.setItem('kanban-theme', newTheme);\n };\n\n // Navigation functions\n const goToBoard = (boardId: number) => {\n setSelectedBoardId(boardId);\n setCurrentView('board');\n };\n\n const goToBoardList = () => {\n setCurrentView('list');\n setSelectedBoardId(null);\n };\n\n // Board management functions\n const refreshBoards = async () => {\n try {\n const response = await fetch('/api/boards');\n if (response.ok) {\n const updatedBoards = await response.json();\n setBoards(updatedBoards);\n }\n } catch (error) {\n console.error('Error refreshing boards:', error);\n }\n };\n\n const addBoard = (newBoard: Board) => {\n setBoards(prev => [newBoard, ...prev]);\n };\n\n const updateBoard = (updatedBoard: Board) => {\n setBoards(prev => prev.map(board => \n board.id === updatedBoard.id ? updatedBoard : board\n ));\n };\n\n const removeBoard = (boardId: number) => {\n setBoards(prev => prev.filter(board => board.id !== boardId));\n // If we're viewing the deleted board, go back to list\n if (selectedBoardId === boardId) {\n goToBoardList();\n }\n };\n\n // Popular themes for quick selection\n const popularThemes: DaisyUITheme[] = [\n 'light', 'dark', 'cupcake', 'corporate', 'synthwave', \n 'retro', 'cyberpunk', 'valentine', 'garden', 'forest',\n 'aqua', 'lofi', 'fantasy', 'dracula', 'luxury', 'night'\n ];\n\n return (\n

\n {/* Header with navigation and theme selector */}\n

\n {currentView === 'board' && (\n \n )}\n {currentView === 'list' && (\n

\n \n Kanban Boards\n

\n )}\n

\n \n

\n {currentView === 'board' && selectedBoardId && (\n

\n {boards.find(b => b.id === selectedBoardId)?.name || 'Board'}\n

\n )}\n

\n\n

\n {/* Theme selector dropdown */}\n

\n \n Theme\n \n

\n {popularThemes.map((themeName) => (\n changeTheme(themeName)}\n >\n

\n {themeName}\n

\n \n ))}\n

\n\n {/* Main content */}\n

\n {currentView === 'list' && (\n \n )}\n \n {currentView === 'board' && selectedBoardId && (\n \n )}\n

\n\n {/* Footer */}\n \n

\n );\n}",[],[253,260,267],{"_106":275,"_98":276,"_151":277,"_153":261,"_154":137,"_155":278,"_157":158,"_108":279,"_103":245,"_160":180,"_162":280,"_163":25,"_164":-5,"_165":281,"_101":282},"66f1c580-6dc5-11f0-a39e-0224a6c84d84","BoardForm.tsx","9f57e6f4-6dc3-11f0-bc4d-0224a6c84d84",56,["D",1753935505109],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0\";\nimport type { Board, CreateBoardRequest, UpdateBoardRequest } from \"../../kanban-shared/types.ts\";\n\ninterface BoardFormProps {\n board?: Board; // If provided, we're editing; otherwise creating\n onClose: () => void;\n onSuccess: (board: Board) => void;\n}\n\nexport default function BoardForm({ board, onClose, onSuccess }: BoardFormProps) {\n const [name, setName] = useState(board?.name || '');\n const [description, setDescription] = useState(board?.description || '');\n const [defaultColumns, setDefaultColumns] = useState(\n board ? [] : ['To Do', 'In Progress', 'Done'] // Only for new boards\n );\n const [isSubmitting, setIsSubmitting] = useState(false);\n const [error, setError] = useState('');\n\n const isEditing = !!board;\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n setError('');\n setIsSubmitting(true);\n\n try {\n if (isEditing) {\n // Update existing board\n const updateData: UpdateBoardRequest = {\n name: name.trim(),\n description: description.trim() || undefined\n };\n\n const response = await fetch(`/api/boards/${board.id}`, {\n method: 'PUT',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(updateData)\n });\n\n if (response.ok) {\n const updatedBoard = await response.json();\n onSuccess(updatedBoard);\n } else {\n try {\n const errorData = await response.json();\n setError(errorData.error || 'Failed to update board');\n } catch (parseError) {\n setError(`Server error (${response.status}): ${response.statusText}`);\n }\n }\n } else {\n // Create new board\n const createData: CreateBoardRequest = {\n name: name.trim(),\n description: description.trim() || undefined,\n defaultColumns: defaultColumns.filter(col => col.trim())\n };\n\n const response = await fetch('/api/boards', {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(createData)\n });\n\n if (response.ok) {\n const newBoard = await response.json();\n onSuccess(newBoard);\n } else {\n try {\n const errorData = await response.json();\n setError(errorData.error || 'Failed to create board');\n } catch (parseError) {\n setError(`Server error (${response.status}): ${response.statusText}`);\n }\n }\n }\n } catch (error) {\n console.error('Error submitting form:', error);\n setError(error instanceof Error ? error.message : 'Network error. Please try again.');\n } finally {\n setIsSubmitting(false);\n }\n };\n\n const addColumn = () => {\n setDefaultColumns([...defaultColumns, '']);\n };\n\n const updateColumn = (index: number, value: string) => {\n const updated = [...defaultColumns];\n updated[index] = value;\n setDefaultColumns(updated);\n };\n\n const removeColumn = (index: number) => {\n setDefaultColumns(defaultColumns.filter((_, i) => i !== index));\n };\n\n return (\n

\n \n {isEditing ? 'Edit Board' : 'Create New Board'}\n

\n\n

\n {/* Board Name */}\n

\n \n Board Name *\n \n setName(e.target.value)}\n required\n maxLength={100}\n />\n

\n\n {/* Board Description */}\n

\n \n Description\n \n setDescription(e.target.value)}\n maxLength={500}\n />\n

\n\n {/* Default Columns (only for new boards) */}\n {!isEditing && (\n

\n \n Default Columns\n You can add more columns later\n \n \n

\n {defaultColumns.map((column, index) => (\n

\n updateColumn(index, e.target.value)}\n maxLength={50}\n />\n {defaultColumns.length > 1 && (\n removeColumn(index)}\n className=\"btn btn-ghost btn-sm text-error\"\n >\n \n \n )}\n

\n ))}\n \n {defaultColumns.length < 6 && (\n \n \n Add Column\n \n )}\n

\n )}\n\n {/* Error Message */}\n {error && (\n

\n \n {error}\n

\n )}\n\n {/* Form Actions */}\n

\n \n Cancel\n \n \n {isSubmitting && }\n \n {isEditing ? 'Update Board' : 'Create Board'}\n \n

\n );\n}",[],[253,260,276],{"_106":284,"_98":285,"_151":286,"_153":261,"_154":137,"_155":287,"_157":158,"_108":288,"_103":190,"_160":180,"_162":289,"_163":25,"_164":-5,"_165":290,"_101":291},"a46e67c0-6dc4-11f0-9a8c-0224a6c84d84","BoardList.tsx","9f605b4a-6dc3-11f0-986d-0224a6c84d84",44,["D",1753935178795],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0\";\nimport type { Board } from \"../../kanban-shared/types.ts\";\nimport BoardForm from \"./BoardForm.tsx\";\n\ninterface BoardListProps {\n boards: Board[];\n onSelectBoard: (boardId: number) => void;\n onBoardCreated: (board: Board) => void;\n onBoardUpdated: (board: Board) => void;\n onBoardDeleted: (boardId: number) => void;\n onRefresh: () => void;\n}\n\nexport default function BoardList({\n boards,\n onSelectBoard,\n onBoardCreated,\n onBoardUpdated,\n onBoardDeleted,\n onRefresh\n}: BoardListProps) {\n const [showCreateForm, setShowCreateForm] = useState(false);\n const [editingBoard, setEditingBoard] = useState(null);\n const [deletingBoard, setDeletingBoard] = useState(null);\n const [searchTerm, setSearchTerm] = useState('');\n\n // Filter boards based on search term\n const filteredBoards = boards.filter(board =>\n board.name.toLowerCase().includes(searchTerm.toLowerCase()) ||\n (board.description && board.description.toLowerCase().includes(searchTerm.toLowerCase()))\n );\n\n const handleDeleteBoard = async (board: Board) => {\n try {\n const response = await fetch(`/api/boards/${board.id}`, {\n method: 'DELETE'\n });\n\n if (response.ok) {\n onBoardDeleted(board.id);\n setDeletingBoard(null);\n } else {\n const error = await response.json();\n alert(`Error deleting board: ${error.error}`);\n }\n } catch (error) {\n console.error('Error deleting board:', error);\n alert('Failed to delete board. Please try again.');\n }\n };\n\n const formatDate = (dateString: string) => {\n return new Date(dateString).toLocaleDateString('en-US', {\n year: 'numeric',\n month: 'short',\n day: 'numeric'\n });\n };\n\n return (\n

\n {/* Header with search and create button */}\n

\n \n \n \n setSearchTerm(e.target.value)}\n />\n

\n \n

\n \n \n \n \n setShowCreateForm(true)}\n className=\"btn btn-primary\"\n >\n \n New Board\n \n

\n\n {/* Boards grid */}\n {filteredBoards.length === 0 ? (\n

\n {boards.length === 0 ? (\n

\n \n

\n No boards yet\n

\n Create your first kanban board to start organizing your tasks\n

\n setShowCreateForm(true)}\n className=\"btn btn-primary\"\n >\n \n Create Your First Board\n \n

\n ) : (\n

\n \n

\n No boards found\n

\n Try adjusting your search terms\n

\n )}\n

\n ) : (\n

\n {filteredBoards.map((board) => (\n

onSelectBoard(board.id)}\n >\n {board.name}\n

\n \n

\n \n
\n \n
\n \n

\n \n {board.description && (\n

\n {board.description}\n

\n )}\n \n

\n Created {formatDate(board.created_at)}\n onSelectBoard(board.id)}\n className=\"btn btn-primary btn-xs\"\n >\n Open \n \n

\n ))}\n

\n )}\n\n {/* Create Board Modal */}\n {showCreateForm && (\n setShowCreateForm(false)}\n onSuccess={(board) => {\n onBoardCreated(board);\n setShowCreateForm(false);\n }}\n />\n )}\n\n {/* Edit Board Modal */}\n {editingBoard && (\n setEditingBoard(null)}\n onSuccess={(board) => {\n onBoardUpdated(board);\n setEditingBoard(null);\n }}\n />\n )}\n\n {/* Delete Confirmation Modal */}\n {deletingBoard && (\n

Delete Board

\n Are you sure you want to delete {deletingBoard.name}? \n This will also delete all columns and tasks in this board.\n

\n \n This action cannot be undone!\n

\n setDeletingBoard(null)}\n className=\"btn btn-ghost\"\n >\n Cancel\n \n handleDeleteBoard(deletingBoard)}\n className=\"btn btn-error\"\n >\n \n Delete Board\n \n

\n )}\n

\n );\n}",[],[253,260,285],{"_106":293,"_98":294,"_151":295,"_153":261,"_154":137,"_155":296,"_157":158,"_108":297,"_103":245,"_160":180,"_162":298,"_163":25,"_164":-5,"_165":299,"_101":300},"66e74470-6dc5-11f0-b734-0224a6c84d84","BoardView.tsx","9f2cdbc6-6dc3-11f0-9d55-0224a6c84d84",54,["D",1753935505078],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport type { Board, BoardWithColumns } from \"../../kanban-shared/types.ts\";\nimport KanbanBoard from \"./KanbanBoard.tsx\";\n\ninterface BoardViewProps {\n boardId: number;\n onBoardUpdated: (board: Board) => void;\n onBoardDeleted: (boardId: number) => void;\n onBack: () => void;\n}\n\nexport default function BoardView({ \n boardId, \n onBoardUpdated, \n onBoardDeleted, \n onBack \n}: BoardViewProps) {\n const [board, setBoard] = useState(null);\n const [loading, setLoading] = useState(true);\n const [error, setError] = useState(null);\n\n // Load board data\n const loadBoard = async () => {\n try {\n setLoading(true);\n setError(null);\n \n const response = await fetch(`/api/boards/${boardId}`);\n if (response.ok) {\n const boardData = await response.json();\n setBoard(boardData);\n } else if (response.status === 404) {\n setError('Board not found');\n } else {\n try {\n const errorData = await response.json();\n setError(errorData.error || 'Failed to load board');\n } catch (parseError) {\n setError(`Server error (${response.status}): ${response.statusText}`);\n }\n }\n } catch (error) {\n console.error('Error loading board:', error);\n setError(error instanceof Error ? error.message : 'Network error. Please check your connection.');\n } finally {\n setLoading(false);\n }\n };\n\n // Load board on mount and when boardId changes\n useEffect(() => {\n loadBoard();\n }, [boardId]);\n\n // Handle board updates from child components\n const handleBoardUpdate = (updatedBoard: BoardWithColumns) => {\n setBoard(updatedBoard);\n onBoardUpdated(updatedBoard);\n };\n\n // Handle board deletion\n const handleBoardDelete = () => {\n onBoardDeleted(boardId);\n onBack();\n };\n\n // Loading state\n if (loading) {\n return (\n

Loading board...

\n );\n }\n\n // Error state\n if (error) {\n return (\n

\n \n

\n Oops! Something went wrong\n

{error}

\n \n \n Back to Boards\n \n \n \n Try Again\n \n

\n );\n }\n\n // Board not found\n if (!board) {\n return (\n

\n \n

\n Board Not Found\n

\n The board you're looking for doesn't exist or may have been deleted.\n

\n \n \n Back to Boards\n \n

\n );\n }\n\n return (\n

\n {/* Board Header */}\n

\n {board.name}\n

\n {board.description && (\n

\n {board.description}\n

\n )}\n

\n \n

Columns

{board.columns.length}

Tasks

\n {board.columns.reduce((total, col) => total + col.tasks.length, 0)}\n

\n\n {/* Kanban Board */}\n

\n \n

\n );\n}",[],[253,260,294],{"_106":302,"_98":303,"_151":304,"_153":261,"_154":137,"_155":136,"_157":158,"_108":305,"_103":245,"_160":180,"_162":306,"_163":25,"_164":-5,"_165":307,"_101":308},"66ffe8c2-6dc5-11f0-9e00-0224a6c84d84","ColumnForm.tsx","9f3ee532-6dc3-11f0-8943-0224a6c84d84",["D",1753935505078],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0\";\nimport type { Column, CreateColumnRequest, UpdateColumnRequest } from \"../../kanban-shared/types.ts\";\n\ninterface ColumnFormProps {\n boardId: number;\n column?: Column; // If provided, we're editing; otherwise creating\n onClose: () => void;\n onSuccess: (column: Column) => void;\n}\n\nexport default function ColumnForm({ boardId, column, onClose, onSuccess }: ColumnFormProps) {\n const [name, setName] = useState(column?.name || '');\n const [color, setColor] = useState(column?.color || '#6b7280');\n const [isSubmitting, setIsSubmitting] = useState(false);\n const [error, setError] = useState('');\n\n const isEditing = !!column;\n\n // Predefined color options\n const colorOptions = [\n { name: 'Gray', value: '#6b7280' },\n { name: 'Red', value: '#ef4444' },\n { name: 'Orange', value: '#f59e0b' },\n { name: 'Yellow', value: '#eab308' },\n { name: 'Green', value: '#10b981' },\n { name: 'Blue', value: '#3b82f6' },\n { name: 'Indigo', value: '#6366f1' },\n { name: 'Purple', value: '#8b5cf6' },\n { name: 'Pink', value: '#ec4899' },\n ];\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n setError('');\n setIsSubmitting(true);\n\n try {\n if (isEditing) {\n // Update existing column\n const updateData: UpdateColumnRequest = {\n name: name.trim(),\n color: color\n };\n\n const response = await fetch(`/api/columns/${column.id}`, {\n method: 'PUT',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(updateData)\n });\n\n if (response.ok) {\n const updatedColumn = await response.json();\n onSuccess(updatedColumn);\n } else {\n try {\n const errorData = await response.json();\n setError(errorData.error || 'Failed to update column');\n } catch (parseError) {\n setError(`Server error (${response.status}): ${response.statusText}`);\n }\n }\n } else {\n // Create new column\n const createData: CreateColumnRequest = {\n name: name.trim(),\n color: color\n };\n\n const response = await fetch(`/api/boards/${boardId}/columns`, {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(createData)\n });\n\n if (response.ok) {\n const newColumn = await response.json();\n onSuccess(newColumn);\n } else {\n try {\n const errorData = await response.json();\n setError(errorData.error || 'Failed to create column');\n } catch (parseError) {\n setError(`Server error (${response.status}): ${response.statusText}`);\n }\n }\n }\n } catch (error) {\n console.error('Error submitting form:', error);\n setError(error instanceof Error ? error.message : 'Network error. Please try again.');\n } finally {\n setIsSubmitting(false);\n }\n };\n\n return (\n

\n \n {isEditing ? 'Edit Column' : 'Add New Column'}\n

\n\n

\n {/* Column Name */}\n

\n \n Column Name *\n \n setName(e.target.value)}\n required\n maxLength={50}\n />\n

\n\n {/* Column Color */}\n

\n \n Column Color\n \n \n {/* Color Preview */}\n

\n setColor(e.target.value)}\n className=\"w-full h-10 rounded cursor-pointer\"\n />\n

\n\n {/* Predefined Colors */}\n

\n {colorOptions.map((colorOption) => (\n setColor(colorOption.value)}\n className={`w-8 h-8 rounded border-2 transition-all ${\n color === colorOption.value \n ? 'border-primary scale-110' \n : 'border-base-300 hover:border-base-400'\n }`}\n style={{ backgroundColor: colorOption.value }}\n title={colorOption.name}\n />\n ))}\n

\n\n {/* Preview */}\n

\n \n Preview\n \n

\n {name || 'Column Name'}\n

\n\n {/* Error Message */}\n {error && (\n

\n \n {error}\n

\n )}\n\n {/* Form Actions */}\n

\n \n Cancel\n \n \n {isSubmitting && }\n \n {isEditing ? 'Update Column' : 'Add Column'}\n \n

\n );\n}",[],[253,260,303],{"_106":310,"_98":311,"_151":312,"_153":261,"_154":137,"_155":313,"_157":158,"_108":314,"_103":190,"_160":180,"_162":315,"_163":25,"_164":-5,"_165":316,"_101":317},"a4583676-6dc4-11f0-bde1-0224a6c84d84","KanbanBoard.tsx","9f390130-6dc3-11f0-8bc7-0224a6c84d84",40,["D",1753935178664],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0\";\nimport type { BoardWithColumns, Column } from \"../../kanban-shared/types.ts\";\nimport KanbanColumn from \"./KanbanColumn.tsx\";\nimport ColumnForm from \"./ColumnForm.tsx\";\n\ninterface KanbanBoardProps {\n board: BoardWithColumns;\n onBoardUpdate: (board: BoardWithColumns) => void;\n onBoardDelete: () => void;\n onRefresh: () => void;\n}\n\nexport default function KanbanBoard({ \n board, \n onBoardUpdate, \n onBoardDelete, \n onRefresh \n}: KanbanBoardProps) {\n const [showColumnForm, setShowColumnForm] = useState(false);\n const [editingColumn, setEditingColumn] = useState(null);\n\n // Handle column creation\n const handleColumnCreated = async (column: Column) => {\n // Refresh board data to get the updated state\n onRefresh();\n };\n\n // Handle column updates\n const handleColumnUpdated = async (column: Column) => {\n // Refresh board data to get the updated state\n onRefresh();\n };\n\n // Handle column deletion\n const handleColumnDeleted = async (columnId: number) => {\n // Refresh board data to get the updated state\n onRefresh();\n };\n\n // Handle task updates (passed down to columns)\n const handleTaskUpdate = () => {\n // Refresh board data when tasks are updated\n onRefresh();\n };\n\n return (\n

\n {/* Board Actions Bar */}\n

\n setShowColumnForm(true)}\n className=\"btn btn-primary btn-sm\"\n >\n \n Add Column\n \n \n \n \n \n

\n\n

\n {board.columns.length} columns • {board.columns.reduce((total, col) => total + col.tasks.length, 0)} tasks\n

\n\n {/* Kanban Columns */}\n

\n {board.columns.length === 0 ? (\n

\n \n

\n No columns yet\n

\n Add your first column to start organizing tasks\n

\n setShowColumnForm(true)}\n className=\"btn btn-primary\"\n >\n \n Add First Column\n \n

\n ) : (\n

\n {board.columns\n .sort((a, b) => a.position - b.position)\n .map((column) => (\n setEditingColumn(column)}\n onColumnDelete={() => handleColumnDeleted(column.id)}\n />\n ))}\n \n {/* Add Column Button */}\n

\n setShowColumnForm(true)}\n className=\"w-72 h-32 border-2 border-dashed border-base-300 rounded-lg bg-base-100 hover:bg-base-200 hover:border-primary transition-all duration-200 flex flex-col items-center justify-center text-base-content/50 hover:text-primary\"\n >\n \n Add Column\n \n

\n )}\n

\n\n {/* Create Column Modal */}\n {showColumnForm && (\n setShowColumnForm(false)}\n onSuccess={(column) => {\n handleColumnCreated(column);\n setShowColumnForm(false);\n }}\n />\n )}\n\n {/* Edit Column Modal */}\n {editingColumn && (\n setEditingColumn(null)}\n onSuccess={(column) => {\n handleColumnUpdated(column);\n setEditingColumn(null);\n }}\n />\n )}\n

\n );\n}",[],[253,260,311],{"_106":319,"_98":320,"_151":321,"_153":261,"_154":137,"_155":322,"_157":158,"_108":323,"_103":190,"_160":180,"_162":324,"_163":25,"_164":-5,"_165":325,"_101":326},"a4687e64-6dc4-11f0-80f4-0224a6c84d84","KanbanColumn.tsx","9f5c266a-6dc3-11f0-a3fc-0224a6c84d84",43,["D",1753935178754],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0\";\nimport type { ColumnWithTasks, Task } from \"../../kanban-shared/types.ts\";\nimport TaskCard from \"./TaskCard.tsx\";\nimport TaskForm from \"./TaskForm.tsx\";\n\ninterface KanbanColumnProps {\n column: ColumnWithTasks;\n onTaskUpdate: () => void;\n onColumnEdit: () => void;\n onColumnDelete: () => void;\n}\n\nexport default function KanbanColumn({ \n column, \n onTaskUpdate, \n onColumnEdit, \n onColumnDelete \n}: KanbanColumnProps) {\n const [showTaskForm, setShowTaskForm] = useState(false);\n const [editingTask, setEditingTask] = useState(null);\n const [deletingColumn, setDeletingColumn] = useState(false);\n\n // Handle task creation\n const handleTaskCreated = (task: Task) => {\n onTaskUpdate();\n setShowTaskForm(false);\n };\n\n // Handle task updates\n const handleTaskUpdated = (task: Task) => {\n onTaskUpdate();\n setEditingTask(null);\n };\n\n // Handle task deletion\n const handleTaskDeleted = () => {\n onTaskUpdate();\n };\n\n // Handle column deletion\n const handleDeleteColumn = async () => {\n try {\n const response = await fetch(`/api/columns/${column.id}`, {\n method: 'DELETE'\n });\n\n if (response.ok) {\n onColumnDelete();\n } else {\n const error = await response.json();\n alert(`Error deleting column: ${error.error}`);\n }\n } catch (error) {\n console.error('Error deleting column:', error);\n alert('Failed to delete column. Please try again.');\n }\n setDeletingColumn(false);\n };\n\n return (\n <>\n

\n {/* Column Header */}\n

\n
\n {column.name}\n

\n \n

\n \n
\n \n
\n \n

\n \n

\n {column.tasks.length} tasks\n setShowTaskForm(true)}\n className=\"btn btn-ghost btn-xs text-primary\"\n >\n \n \n

\n\n {/* Tasks Container */}\n

\n {column.tasks\n .sort((a, b) => a.position - b.position)\n .map((task) => (\n setEditingTask(task)}\n onDelete={handleTaskDeleted}\n onUpdate={onTaskUpdate}\n />\n ))}\n \n {column.tasks.length === 0 && (\n

\n \n

No tasks yet

\n setShowTaskForm(true)}\n className=\"btn btn-ghost btn-sm mt-2 text-primary\"\n >\n Add first task\n \n

\n )}\n

\n\n {/* Add Task Button */}\n

\n setShowTaskForm(true)}\n className=\"w-full btn btn-ghost btn-sm text-primary border-dashed border border-primary/30 hover:border-primary hover:bg-primary/10\"\n >\n \n Add Task\n \n

\n\n {/* Create Task Modal */}\n {showTaskForm && (\n setShowTaskForm(false)}\n onSuccess={handleTaskCreated}\n />\n )}\n\n {/* Edit Task Modal */}\n {editingTask && (\n setEditingTask(null)}\n onSuccess={handleTaskUpdated}\n />\n )}\n\n {/* Delete Column Confirmation */}\n {deletingColumn && (\n

Delete Column

\n Are you sure you want to delete the column {column.name}?\n

\n {column.tasks.length > 0 && (\n

\n \n

This column contains {column.tasks.length} task(s).

All tasks in this column will also be deleted.

\n )}\n

\n \n This action cannot be undone!\n

\n setDeletingColumn(false)}\n className=\"btn btn-ghost\"\n >\n Cancel\n \n \n \n Delete Column\n \n

\n )}\n \n );\n}",[],[253,260,320],{"_106":328,"_98":329,"_151":330,"_153":261,"_154":137,"_155":331,"_157":158,"_108":332,"_103":190,"_160":180,"_162":333,"_163":25,"_164":-5,"_165":334,"_101":335},"a462d2fc-6dc4-11f0-8a08-0224a6c84d84","TaskCard.tsx","9f337b52-6dc3-11f0-9346-0224a6c84d84",42,["D",1753935178573],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0\";\nimport type { Task } from \"../../kanban-shared/types.ts\";\n\ninterface TaskCardProps {\n task: Task;\n onEdit: () => void;\n onDelete: () => void;\n onUpdate: () => void;\n}\n\nexport default function TaskCard({ task, onEdit, onDelete, onUpdate }: TaskCardProps) {\n const [isDeleting, setIsDeleting] = useState(false);\n\n // Handle task deletion\n const handleDelete = async () => {\n try {\n const response = await fetch(`/api/tasks/${task.id}`, {\n method: 'DELETE'\n });\n\n if (response.ok) {\n onDelete();\n } else {\n const error = await response.json();\n alert(`Error deleting task: ${error.error}`);\n }\n } catch (error) {\n console.error('Error deleting task:', error);\n alert('Failed to delete task. Please try again.');\n }\n setIsDeleting(false);\n };\n\n // Get priority badge styling\n const getPriorityBadge = (priority: Task['priority']) => {\n switch (priority) {\n case 'high':\n return 'badge-error';\n case 'medium':\n return 'badge-warning';\n case 'low':\n return 'badge-success';\n default:\n return 'badge-ghost';\n }\n };\n\n // Get priority border styling\n const getPriorityBorder = (priority: Task['priority']) => {\n switch (priority) {\n case 'high':\n return 'priority-high';\n case 'medium':\n return 'priority-medium';\n case 'low':\n return 'priority-low';\n default:\n return '';\n }\n };\n\n // Format due date\n const formatDueDate = (dateString: string) => {\n const date = new Date(dateString);\n const now = new Date();\n const diffTime = date.getTime() - now.getTime();\n const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24));\n\n if (diffDays < 0) {\n return { text: `${Math.abs(diffDays)} days overdue`, class: 'text-error' };\n } else if (diffDays === 0) {\n return { text: 'Due today', class: 'text-warning' };\n } else if (diffDays === 1) {\n return { text: 'Due tomorrow', class: 'text-warning' };\n } else if (diffDays <= 7) {\n return { text: `Due in ${diffDays} days`, class: 'text-info' };\n } else {\n return { \n text: date.toLocaleDateString('en-US', { month: 'short', day: 'numeric' }), \n class: 'text-base-content/70' \n };\n }\n };\n\n const dueDate = task.due_date ? formatDueDate(task.due_date) : null;\n\n return (\n <>\n

\n {/* Task Header */}\n

\n {task.title}\n

\n \n

e.stopPropagation()}>\n

\n \n

\n \n
\n \n

\n\n {/* Task Description */}\n {task.description && (\n

\n {task.description}\n

\n )}\n\n {/* Task Footer */}\n

\n {/* Priority Badge */}\n

\n {task.priority}\n

\n\n {/* Due Date */}\n {dueDate && (\n

\n \n {dueDate.text}\n

\n )}\n

\n\n {/* Task Meta */}\n

\n Created {new Date(task.created_at).toLocaleDateString('en-US', { \n month: 'short', \n day: 'numeric' \n })}\n

\n\n {/* Delete Confirmation Modal */}\n {isDeleting && (\n

Delete Task

\n Are you sure you want to delete the task {task.title}?\n

\n \n This action cannot be undone!\n

\n setIsDeleting(false)}\n className=\"btn btn-ghost\"\n >\n Cancel\n \n \n \n Delete Task\n \n

\n )}\n \n );\n}",[],[253,260,329],{"_106":337,"_98":338,"_151":339,"_153":261,"_154":137,"_155":340,"_157":158,"_108":341,"_103":245,"_160":180,"_162":342,"_163":25,"_164":-5,"_165":343,"_101":344},"66eba042-6dc5-11f0-9097-0224a6c84d84","TaskForm.tsx","9f4cf60e-6dc3-11f0-a3fc-0224a6c84d84",55,["D",1753935505108],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0\";\nimport type { Task, CreateTaskRequest, UpdateTaskRequest, Priority } from \"../../kanban-shared/types.ts\";\n\ninterface TaskFormProps {\n columnId: number;\n task?: Task; // If provided, we're editing; otherwise creating\n onClose: () => void;\n onSuccess: (task: Task) => void;\n}\n\nexport default function TaskForm({ columnId, task, onClose, onSuccess }: TaskFormProps) {\n const [title, setTitle] = useState(task?.title || '');\n const [description, setDescription] = useState(task?.description || '');\n const [priority, setPriority] = useState(task?.priority || 'medium');\n const [dueDate, setDueDate] = useState(\n task?.due_date ? task.due_date.split('T')[0] : ''\n );\n const [isSubmitting, setIsSubmitting] = useState(false);\n const [error, setError] = useState('');\n\n const isEditing = !!task;\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n setError('');\n setIsSubmitting(true);\n\n try {\n if (isEditing) {\n // Update existing task\n const updateData: UpdateTaskRequest = {\n title: title.trim(),\n description: description.trim() || undefined,\n priority: priority,\n due_date: dueDate || undefined\n };\n\n const response = await fetch(`/api/tasks/${task.id}`, {\n method: 'PUT',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(updateData)\n });\n\n if (response.ok) {\n const updatedTask = await response.json();\n onSuccess(updatedTask);\n } else {\n try {\n const errorData = await response.json();\n setError(errorData.error || 'Failed to update task');\n } catch (parseError) {\n setError(`Server error (${response.status}): ${response.statusText}`);\n }\n }\n } else {\n // Create new task\n const createData: CreateTaskRequest = {\n title: title.trim(),\n description: description.trim() || undefined,\n priority: priority,\n due_date: dueDate || undefined\n };\n\n const response = await fetch(`/api/columns/${columnId}/tasks`, {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify(createData)\n });\n\n if (response.ok) {\n const newTask = await response.json();\n onSuccess(newTask);\n } else {\n try {\n const errorData = await response.json();\n setError(errorData.error || 'Failed to create task');\n } catch (parseError) {\n setError(`Server error (${response.status}): ${response.statusText}`);\n }\n }\n }\n } catch (error) {\n console.error('Error submitting form:', error);\n setError(error instanceof Error ? error.message : 'Network error. Please try again.');\n } finally {\n setIsSubmitting(false);\n }\n };\n\n // Get priority styling\n const getPriorityClass = (p: Priority) => {\n switch (p) {\n case 'high':\n return 'border-error bg-error/10 text-error';\n case 'medium':\n return 'border-warning bg-warning/10 text-warning';\n case 'low':\n return 'border-success bg-success/10 text-success';\n default:\n return 'border-base-300 bg-base-100 text-base-content';\n }\n };\n\n return (\n

\n \n {isEditing ? 'Edit Task' : 'Create New Task'}\n

\n\n

\n {/* Task Title */}\n

\n \n Task Title *\n \n setTitle(e.target.value)}\n required\n maxLength={200}\n />\n

\n\n {/* Task Description */}\n

\n \n Description\n \n setDescription(e.target.value)}\n maxLength={1000}\n />\n

\n\n {/* Priority and Due Date Row */}\n

\n {/* Priority */}\n

\n \n Priority\n \n

\n {(['low', 'medium', 'high'] as Priority[]).map((p) => (\n setPriority(p)}\n className={`btn btn-sm capitalize ${\n priority === p \n ? getPriorityClass(p) + ' border-2' \n : 'btn-ghost border border-base-300'\n }`}\n >\n {p}\n \n ))}\n

\n\n {/* Due Date */}\n

\n \n Due Date\n \n setDueDate(e.target.value)}\n min={new Date().toISOString().split('T')[0]}\n />\n

\n\n {/* Task Preview */}\n

\n \n Preview\n \n

\n {title || 'Task Title'}\n

\n {description && (\n

\n {description}\n

\n )}\n

\n {priority}\n

\n {dueDate && (\n

\n \n {new Date(dueDate).toLocaleDateString('en-US', { \n month: 'short', \n day: 'numeric' \n })}\n

\n )}\n

\n\n {/* Error Message */}\n {error && (\n

\n \n {error}\n

\n )}\n\n {/* Form Actions */}\n

\n \n Cancel\n \n \n {isSubmitting && }\n \n {isEditing ? 'Update Task' : 'Create Task'}\n \n

\n );\n}",[],[253,260,338],[253,260],{"_106":347,"_98":348,"_151":349,"_153":254,"_154":137,"_155":350,"_157":158,"_108":351,"_103":190,"_160":352,"_162":353,"_163":25,"_164":-5,"_165":354,"_101":355},"d0630652-6dc3-11f0-8fe4-0224a6c84d84","index.html","9ff03058-6dc3-11f0-a408-0224a6c84d84",33,["D",1753934823055],"file","\n\n\n \n \n Kanban Board\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n\n\n

\n \n

\n Loading Kanban Board...\n

\n\n \n \n \n \n \n\n",[],[253,348],{"_106":357,"_98":358,"_151":359,"_153":254,"_154":137,"_155":360,"_157":158,"_108":361,"_103":29,"_160":180,"_162":362,"_163":25,"_164":-5,"_165":363,"_101":364},"9f27f930-6dc3-11f0-8bc7-0224a6c84d84","index.tsx","9f27fa20-6dc3-11f0-8bc7-0224a6c84d84",9,["D",1753934740465],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0\";\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport App from \"./components/App.tsx\";\n\n// Get initial data injected by the server\nconst initialData = (window as any).__INITIAL_DATA__ || { boards: [], timestamp: new Date().toISOString() };\n\n// Create root and render app\nconst container = document.getElementById('root');\nif (container) {\n const root = createRoot(container);\n root.render();\n} else {\n console.error('Root container not found');\n}",[],[253,358],[253],{"_106":367,"_98":368,"_151":369,"_153":-5,"_154":137,"_155":370,"_157":158,"_108":371,"_103":29,"_160":161,"_162":-5,"_163":25,"_164":-5,"_165":372,"_101":382},"a4354c38-6dc4-11f0-b34f-0224a6c84d84","kanban-shared","a4354d1e-6dc4-11f0-b34f-0224a6c84d84",35,["D",1753935178438],[373],{"_106":374,"_98":375,"_151":376,"_153":369,"_154":137,"_155":377,"_157":158,"_108":378,"_103":190,"_160":180,"_162":379,"_163":25,"_164":-5,"_165":380,"_101":381},"a45daee4-6dc4-11f0-80f4-0224a6c84d84","types.ts","9f6e0dbc-6dc3-11f0-9430-0224a6c84d84",41,["D",1753935178532],"// Shared TypeScript interfaces for the Kanban app\n\nexport interface Board {\n id: number;\n name: string;\n description?: string;\n created_at: string;\n updated_at: string;\n}\n\nexport interface Column {\n id: number;\n board_id: number;\n name: string;\n position: number;\n color: string;\n created_at: string;\n updated_at: string;\n}\n\nexport interface Task {\n id: number;\n column_id: number;\n title: string;\n description?: string;\n priority: 'low' | 'medium' | 'high';\n due_date?: string;\n position: number;\n created_at: string;\n updated_at: string;\n}\n\nexport interface BoardWithColumns extends Board {\n columns: ColumnWithTasks[];\n}\n\nexport interface ColumnWithTasks extends Column {\n tasks: Task[];\n}\n\n// API Request/Response types\nexport interface CreateBoardRequest {\n name: string;\n description?: string;\n defaultColumns?: string[]; // Default column names to create\n}\n\nexport interface UpdateBoardRequest {\n name?: string;\n description?: string;\n}\n\nexport interface CreateColumnRequest {\n name: string;\n color?: string;\n position?: number;\n}\n\nexport interface UpdateColumnRequest {\n name?: string;\n color?: string;\n}\n\nexport interface MoveColumnRequest {\n position: number;\n}\n\nexport interface CreateTaskRequest {\n title: string;\n description?: string;\n priority?: 'low' | 'medium' | 'high';\n due_date?: string;\n position?: number;\n}\n\nexport interface UpdateTaskRequest {\n title?: string;\n description?: string;\n priority?: 'low' | 'medium' | 'high';\n due_date?: string;\n}\n\nexport interface MoveTaskRequest {\n column_id: number;\n position: number;\n}\n\n// Utility types\nexport type Priority = Task['priority'];\nexport type TaskStatus = 'todo' | 'in_progress' | 'done';\n\n// Theme types for DaisyUI\nexport type DaisyUITheme = \n | 'light' | 'dark' | 'cupcake' | 'bumblebee' | 'emerald' \n | 'corporate' | 'synthwave' | 'retro' | 'cyberpunk' \n | 'valentine' | 'halloween' | 'garden' | 'forest' \n | 'aqua' | 'lofi' | 'pastel' | 'fantasy' | 'wireframe' \n | 'black' | 'luxury' | 'dracula' | 'cmyk' | 'autumn' \n | 'business' | 'acid' | 'lemonade' | 'night' | 'coffee' | 'winter';",[],[368,375],[368],{"_106":384,"_98":385,"_151":386,"_153":-5,"_154":137,"_155":387,"_157":158,"_108":388,"_103":29,"_160":352,"_162":389,"_163":25,"_164":-5,"_165":390,"_101":391},"d0686480-6dc3-11f0-ae92-0224a6c84d84",".gitignore","d0686516-6dc3-11f0-ae92-0224a6c84d84",34,["D",1753934823059],".vt/state.json\n",[],[385],{"_106":393,"_98":394,"_151":395,"_153":-5,"_154":137,"_155":396,"_157":158,"_108":397,"_103":29,"_160":352,"_162":398,"_163":25,"_164":-5,"_165":399,"_101":400},"9f79ad34-6dc3-11f0-bc4d-0224a6c84d84",".vtignore","9f79ade8-6dc3-11f0-bc4d-0224a6c84d84",22,["D",1753934741002],".git\n.vscode\n.cursorrules\n.DS_Store\nnode_modules\nvendor",[],[394],{"_106":402,"_98":403,"_151":404,"_153":-5,"_154":137,"_155":405,"_157":158,"_108":406,"_103":29,"_160":352,"_162":407,"_163":25,"_164":-5,"_165":408,"_101":409},"9f64c522-6dc3-11f0-bc4d-0224a6c84d84","KANBAN_PLAN.md","9f64c5ae-6dc3-11f0-bc4d-0224a6c84d84",18,["D",1753934740864],"# Kanban App Plan\n\n## Overview\nA flexible kanban board application with multiple boards support, drag-and-drop functionality, and arbitrary column configuration, built for Val Town using React frontend and SQLite backend.\n\n## Features\n- **Core Kanban Features:**\n - Multiple kanban boards with custom names\n - Arbitrary number of columns per board with custom names\n - Create, edit, delete boards and columns\n - Create, edit, delete tasks\n - Drag and drop tasks between columns\n - Task priorities (Low, Medium, High)\n - Task descriptions and due dates\n\n- **UI/UX:**\n - Clean, responsive design using DaisyUI components\n - Theme switching with DaisyUI themes\n - Real-time updates when tasks are moved\n - Simple, intuitive interface following KISS principles [[memory:4516396]]\n\n## Technical Architecture\n\n### Project Structure\n```\n├── kanban-backend/\n│ ├── database/\n│ │ ├── migrations.ts # SQLite schema setup\n│ │ └── queries.ts # Database query functions\n│ ├── routes/\n│ │ ├── boards.ts # Board CRUD operations\n│ │ ├── columns.ts # Column CRUD operations\n│ │ ├── tasks.ts # Task CRUD operations\n│ │ └── static.ts # Static file serving\n│ └── index.ts # Main Hono app entry point\n├── kanban-frontend/\n│ ├── components/\n│ │ ├── App.tsx # Main app component\n│ │ ├── BoardList.tsx # List of all boards\n│ │ ├── BoardView.tsx # Single board view\n│ │ ├── KanbanBoard.tsx # Board container with columns\n│ │ ├── KanbanColumn.tsx # Individual columns\n│ │ ├── TaskCard.tsx # Task card component\n│ │ ├── TaskForm.tsx # Create/edit task form\n│ │ ├── BoardForm.tsx # Create/edit board form\n│ │ └── ColumnForm.tsx # Create/edit column form\n│ ├── index.html # Main HTML template\n│ ├── index.tsx # React entry point\n│ └── style.css # Custom styles (if needed)\n├── shared/\n│ └── types.ts # Shared TypeScript interfaces\n└── README.md\n```\n\n### Database Schema (SQLite)\n\n**Table Name Constants:**\n```ts\n// In migrations.ts - configurable table names\nconst BOARDS_TABLE = 'kanban_boards_v1';\nconst COLUMNS_TABLE = 'kanban_columns_v1';\nconst TASKS_TABLE = 'kanban_tasks_v1';\n```\n\n**Boards Table:**\n```sql\nCREATE TABLE IF NOT EXISTS ${BOARDS_TABLE} (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n name TEXT NOT NULL,\n description TEXT,\n created_at DATETIME DEFAULT CURRENT_TIMESTAMP,\n updated_at DATETIME DEFAULT CURRENT_TIMESTAMP\n);\n```\n\n**Columns Table:**\n```sql\nCREATE TABLE IF NOT EXISTS ${COLUMNS_TABLE} (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n board_id INTEGER NOT NULL,\n name TEXT NOT NULL,\n position INTEGER NOT NULL DEFAULT 0,\n color TEXT DEFAULT '#6b7280',\n created_at DATETIME DEFAULT CURRENT_TIMESTAMP,\n updated_at DATETIME DEFAULT CURRENT_TIMESTAMP,\n FOREIGN KEY (board_id) REFERENCES ${BOARDS_TABLE}(id) ON DELETE CASCADE\n);\n```\n\n**Tasks Table:**\n```sql\nCREATE TABLE IF NOT EXISTS ${TASKS_TABLE} (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n column_id INTEGER NOT NULL,\n title TEXT NOT NULL,\n description TEXT,\n priority TEXT NOT NULL DEFAULT 'medium',\n due_date TEXT,\n position INTEGER NOT NULL DEFAULT 0,\n created_at DATETIME DEFAULT CURRENT_TIMESTAMP,\n updated_at DATETIME DEFAULT CURRENT_TIMESTAMP,\n FOREIGN KEY (column_id) REFERENCES ${COLUMNS_TABLE}(id) ON DELETE CASCADE\n);\n```\n\n**Schema Details:**\n\n*Boards:*\n- `id`: Unique board identifier\n- `name`: Board name (required)\n- `description`: Optional board description\n- `created_at`, `updated_at`: Timestamps\n\n*Columns:*\n- `id`: Unique column identifier\n- `board_id`: Reference to parent board\n- `name`: Column name (required)\n- `position`: For ordering columns within board\n- `color`: Optional column color for theming\n- `created_at`, `updated_at`: Timestamps\n\n*Tasks:*\n- `id`: Unique task identifier\n- `column_id`: Reference to parent column\n- `title`: Task title (required)\n- `description`: Optional task description\n- `priority`: 'low', 'medium', 'high'\n- `due_date`: ISO date string (optional)\n- `position`: For ordering within columns\n- `created_at`, `updated_at`: Timestamps\n\n### API Endpoints (RESTful)\n\n**Boards API:**\n- `GET /api/boards` - Get all boards\n- `GET /api/boards/:id` - Get single board with columns and tasks\n- `POST /api/boards` - Create new board\n- `PUT /api/boards/:id` - Update board\n- `DELETE /api/boards/:id` - Delete board (cascades to columns and tasks)\n\n**Columns API:**\n- `GET /api/boards/:boardId/columns` - Get columns for a board\n- `POST /api/boards/:boardId/columns` - Create new column\n- `PUT /api/columns/:id` - Update column\n- `DELETE /api/columns/:id` - Delete column (cascades to tasks)\n- `PATCH /api/columns/:id/move` - Reorder column position\n\n**Tasks API:**\n- `GET /api/columns/:columnId/tasks` - Get tasks for a column\n- `POST /api/columns/:columnId/tasks` - Create new task\n- `PUT /api/tasks/:id` - Update task\n- `DELETE /api/tasks/:id` - Delete task\n- `PATCH /api/tasks/:id/move` - Move task (update column/position)\n\n**Static Files:**\n- `GET /` - Serve main HTML with initial data injection\n- `GET /kanban-frontend/*` - Serve frontend assets\n- `GET /shared/*` - Serve shared utilities\n\n### Frontend Components\n\n**App.tsx** - Main application container\n- DaisyUI theme management\n- Global state management\n- Error boundaries\n- Routing between board list and board view\n\n**BoardList.tsx** - List of all boards\n- Grid/list view of boards\n- Create new board button\n- Board search/filtering\n- Quick board actions\n\n**BoardView.tsx** - Single board view\n- Board header with name and actions\n- Navigation back to board list\n- Board settings and column management\n\n**KanbanBoard.tsx** - Board layout with columns\n- Dynamic column rendering based on board configuration\n- Drag and drop context\n- Add new column functionality\n- Column reordering\n\n**KanbanColumn.tsx** - Individual columns\n- Column header with task count and actions\n- Drop zone for tasks\n- Add task button\n- Column editing (name, color)\n- Column deletion\n\n**TaskCard.tsx** - Individual task representation\n- Draggable task card with DaisyUI styling\n- Priority indicators with badges\n- Due date display\n- Quick actions (edit, delete)\n\n**TaskForm.tsx** - Task creation/editing\n- DaisyUI modal or drawer\n- Form validation\n- Priority selection\n- Date picker for due dates\n\n**BoardForm.tsx** - Board creation/editing\n- DaisyUI modal for board details\n- Board name and description\n- Default columns setup\n\n**ColumnForm.tsx** - Column creation/editing\n- DaisyUI modal for column details\n- Column name and color picker\n- Position management\n\n### Technology Stack\n\n**Frontend:**\n- React 18.2.0 (pinned version)\n- DaisyUI for component styling and themes\n- TailwindCSS (included with DaisyUI)\n- React DnD or HTML5 drag/drop for task and column movement\n- Date-fns for date handling\n\n**Backend:**\n- Hono framework for API routes\n- SQLite for data persistence with configurable table names\n- Val Town standard utilities\n\n**Shared:**\n- TypeScript interfaces for type safety\n- Utility functions for data validation\n\n## Implementation Phases\n\n### Phase 1: Backend Foundation\n1. Set up Hono app with error handling\n2. Create SQLite schema with configurable table names\n3. Implement boards, columns, and tasks CRUD API endpoints\n4. Add static file serving for kanban-frontend\n\n### Phase 2: Frontend Core\n1. Set up React app with DaisyUI and proper imports\n2. Create board list and basic navigation\n3. Implement board view with dynamic columns\n4. Add basic task display and interactions\n\n### Phase 3: Board & Column Management\n1. Implement board creation and editing\n2. Add dynamic column creation and management\n3. Column reordering and customization\n4. Board navigation and routing\n\n### Phase 4: Drag & Drop\n1. Implement task drag and drop between columns\n2. Add column reordering functionality\n3. Position management for tasks and columns\n4. Smooth animations with DaisyUI transitions\n\n### Phase 5: Polish & Features\n1. Add DaisyUI theme switching\n2. Implement task priorities and due dates\n3. Add form validation and error handling\n4. Responsive design with DaisyUI utilities\n\n## Key Considerations\n\n**Val Town Specific:**\n- Use `https://esm.sh` for all imports\n- Pin React version to 18.2.0\n- Use proper JSX import source\n- Implement proper error boundaries\n- Use Val Town utilities for file serving\n- Prefix folders with `kanban-` for multi-app project structure\n\n**Performance:**\n- Minimize API calls with efficient state management\n- Use optimistic updates for better UX\n- Implement proper loading states\n- Efficient querying with proper foreign key relationships\n\n**User Experience:**\n- Follow DRY, KISS, YANGI principles [[memory:4516396]]\n- Intuitive drag and drop interactions for tasks and columns\n- Clear visual feedback for all actions\n- DaisyUI components for consistent, accessible design\n- Multiple theme support with DaisyUI\n\n**Data Integrity:**\n- Configurable table names for schema flexibility\n- Proper task and column positioning logic\n- Atomic operations for moves and reordering\n- Cascade deletes for data consistency\n- Input validation on both frontend and backend\n\n**Multi-Board Architecture:**\n- Flexible board creation with custom column configurations\n- Efficient data structure for arbitrary column counts\n- Board-specific settings and customizations\n- Scalable design for multiple board types\n\n## Future Enhancements (Optional)\n- Board templates for quick setup\n- Task assignments and collaboration\n- Task comments and history\n- Advanced search and filtering across boards\n- Export/import functionality\n- Real-time collaboration with WebSockets\n- Board sharing and permissions\n- Custom task fields and metadata\n\nThis plan provides a flexible, scalable foundation for a multi-board kanban app while maintaining simplicity and following Val Town best practices. The architecture supports arbitrary board and column configurations while keeping the codebase organized for future multi-app development.",[],[403],{"_106":411,"_98":412,"_151":413,"_153":-5,"_154":137,"_155":414,"_157":158,"_108":415,"_103":29,"_160":352,"_162":416,"_163":25,"_164":-5,"_165":417,"_101":418},"9f69d03a-6dc3-11f0-a181-0224a6c84d84","deno.json","9f69d0da-6dc3-11f0-a181-0224a6c84d84",19,["D",1753934740897],"{\n \"$schema\": \"https://raw.githubusercontent.com/denoland/deno/348900b8b79f4a434cab4c74b3bc8d4d2fa8ee74/cli/schemas/config-file.v1.json\",\n \"lock\": false,\n \"compilerOptions\": {\n \"noImplicitAny\": false,\n \"strict\": false,\n \"types\": [\n \"https://www.val.town/types/valtown.d.ts\"\n ],\n \"lib\": [\n \"dom\",\n \"dom.iterable\",\n \"dom.asynciterable\",\n \"deno.ns\",\n \"deno.unstable\"\n ]\n },\n \"lint\": {\n \"files\": {\n \"include\": [\n \"deno:/https/esm.town/**/*\"\n ]\n },\n \"rules\": {\n \"exclude\": [\n \"no-explicit-any\"\n ]\n }\n },\n \"node_modules_dir\": false,\n \"experimental\": {\n \"unstable-node-globals\": true,\n \"unstable-temporal\": true,\n \"unstable-worker-options\": true,\n \"unstable-sloppy-imports\": true\n }\n}",[],[412],{"_106":420,"_98":421,"_151":422,"_153":-5,"_154":137,"_155":423,"_157":158,"_108":424,"_103":190,"_160":352,"_162":425,"_163":25,"_164":-5,"_165":426,"_101":427},"a4497078-6dc4-11f0-9a8c-0224a6c84d84","kanban-README.md","9f748282-6dc3-11f0-b4ad-0224a6c84d84",37,["D",1753935178528],"# Kanban Board App\n\nA flexible, multi-board kanban application built for Val Town with React, DaisyUI, and SQLite.\n\n## Features\n\n### 🏗️ **Multi-Board Architecture**\n- Create unlimited kanban boards\n- Each board can have custom columns with arbitrary names and colors\n- Board search and filtering\n- Board descriptions and metadata\n\n### 📋 **Flexible Column Management**\n- Add/edit/delete columns dynamically\n- Custom column colors and names\n- Automatic position management\n- Visual column indicators\n\n### ✅ **Rich Task Management**\n- Create, edit, and delete tasks\n- Task priorities (Low, Medium, High) with visual indicators\n- Due dates with smart formatting\n- Task descriptions and metadata\n- Visual priority borders on task cards\n\n### 🎨 **Modern UI/UX**\n- Built with DaisyUI components\n- 25+ built-in themes (light, dark, cupcake, cyberpunk, etc.)\n- Responsive design for all screen sizes\n- Smooth animations and transitions\n- Intuitive drag-and-drop interface (coming soon)\n\n### 🛠️ **Technical Features**\n- SQLite backend with configurable table names\n- RESTful API with proper error handling\n- Real-time updates across the interface\n- Optimistic UI updates for better performance\n- Comprehensive form validation\n\n## Project Structure\n\n```\n├── kanban-backend/ # Hono API server\n│ ├── database/\n│ │ ├── migrations.ts # SQLite schema with configurable table names\n│ │ └── queries.ts # Database operations\n│ ├── routes/\n│ │ ├── boards.ts # Board CRUD operations\n│ │ ├── columns.ts # Column management\n│ │ ├── tasks.ts # Task operations\n│ │ └── static.ts # Static file serving\n│ └── index.ts # Main server entry point\n├── kanban-frontend/ # React frontend\n│ ├── components/\n│ │ ├── App.tsx # Main app with theme management\n│ │ ├── BoardList.tsx # Multi-board overview\n│ │ ├── BoardView.tsx # Single board container\n│ │ ├── KanbanBoard.tsx # Board with columns\n│ │ ├── KanbanColumn.tsx # Individual columns\n│ │ ├── TaskCard.tsx # Task cards with priorities\n│ │ ├── TaskForm.tsx # Task creation/editing\n│ │ ├── BoardForm.tsx # Board management\n│ │ └── ColumnForm.tsx # Column management\n│ ├── index.html # Main HTML with DaisyUI\n│ └── index.tsx # React entry point\n├── shared/\n│ └── types.ts # TypeScript interfaces\n└── README.md\n```\n\n## API Endpoints\n\n### Boards\n- `GET /api/boards` - Get all boards\n- `GET /api/boards/:id` - Get board with columns and tasks\n- `POST /api/boards` - Create new board\n- `PUT /api/boards/:id` - Update board\n- `DELETE /api/boards/:id` - Delete board\n\n### Columns\n- `GET /api/boards/:boardId/columns` - Get columns for board\n- `POST /api/boards/:boardId/columns` - Create column\n- `PUT /api/columns/:id` - Update column\n- `DELETE /api/columns/:id` - Delete column\n- `PATCH /api/columns/:id/move` - Reorder column\n\n### Tasks\n- `GET /api/columns/:columnId/tasks` - Get tasks for column\n- `POST /api/columns/:columnId/tasks` - Create task\n- `PUT /api/tasks/:id` - Update task\n- `DELETE /api/tasks/:id` - Delete task\n- `PATCH /api/tasks/:id/move` - Move task between columns\n\n## Database Schema\n\nThe app uses SQLite with three main tables:\n\n### Boards (`kanban_boards_v1`)\n- `id` - Primary key\n- `name` - Board name\n- `description` - Optional description\n- `created_at`, `updated_at` - Timestamps\n\n### Columns (`kanban_columns_v1`)\n- `id` - Primary key\n- `board_id` - Foreign key to boards\n- `name` - Column name\n- `position` - Display order\n- `color` - Column color\n- `created_at`, `updated_at` - Timestamps\n\n### Tasks (`kanban_tasks_v1`)\n- `id` - Primary key\n- `column_id` - Foreign key to columns\n- `title` - Task title\n- `description` - Optional description\n- `priority` - 'low', 'medium', 'high'\n- `due_date` - Optional due date\n- `position` - Display order within column\n- `created_at`, `updated_at` - Timestamps\n\n## Getting Started\n\n1. **Deploy to Val Town**: Copy the code to a new Val Town project\n2. **Database Setup**: The app automatically creates tables and a default board on first run\n3. **Access**: Visit your Val Town URL to start using the kanban app\n\n## Usage\n\n### Creating Your First Board\n1. Click \"New Board\" from the main dashboard\n2. Enter a board name and optional description\n3. Add default columns (or use the preset: To Do, In Progress, Done)\n4. Click \"Create Board\"\n\n### Managing Columns\n- Click \"Add Column\" to create new columns\n- Use the column menu (⋮) to edit or delete columns\n- Customize column colors for better organization\n\n### Working with Tasks\n- Click \"Add Task\" in any column\n- Set priority levels and due dates\n- Edit tasks by clicking on them\n- Use the task menu for additional options\n\n### Theme Customization\n- Click the \"Theme\" button in the header\n- Choose from 25+ DaisyUI themes\n- Your preference is automatically saved\n\n## Upcoming Features\n\n- [ ] Drag and drop for tasks and columns\n- [ ] Task assignments and collaboration\n- [ ] Board templates\n- [ ] Advanced search and filtering\n- [ ] Export/import functionality\n- [ ] Real-time collaboration\n\n## Technical Details\n\n- **Frontend**: React 18.2.0, DaisyUI, TailwindCSS\n- **Backend**: Hono framework, SQLite\n- **Platform**: Val Town (Deno runtime)\n- **Styling**: DaisyUI components with custom CSS\n- **Icons**: Font Awesome 6.5.1\n\nBuilt with ❤️ for Val Town following DRY, KISS, and YANGI principles.",[],[421],"files",[148,167,174,184,195,202,211,220,229,239,251,258,265,274,283,292,301,309,318,327,336,346,356,366,373,383,392,401,410,419],"counts",{"_432":29,"_433":190,"_434":29,"_435":29},"pulls","branches","forks","envVars","contents",[],{"_106":240,"_98":241,"_151":242,"_153":152,"_154":137,"_155":243,"_157":158,"_108":439,"_103":245,"_160":246,"_162":247,"_163":25,"_164":-5,"_101":440},["D",1753935178860],[150,241],"upstreamProject","upstreamBranch","emptyEnvVars","isNew","routes/_app.x.$handle.$name.code.$",{"_96":97,"_98":99,"_100":40,"_103":-7,"_101":102,"_104":447,"_146":451,"_428":542,"_352":543,"_436":545,"_546":-5,"_547":25,"_548":-5,"_549":-5,"_550":-5,"_551":552},{"_106":107,"_98":99,"_108":448,"_110":-5,"_111":25,"_112":113,"_114":-5,"_115":-5,"_12":116,"_117":-5,"_118":25,"_119":-5,"_120":29,"_14":121,"_122":123,"_124":123,"_125":126,"_127":126,"_128":126,"_129":123,"_130":123,"_19":449,"_134":450,"_145":25},["D",1753933199058],{"_96":97,"_132":133},{"_103":136,"_98":40,"_106":137,"_138":107,"_139":-5,"_140":-5,"_141":-5,"_142":-5,"_143":99,"_144":97},[452,482,521,527,530,533,536,539],{"_106":149,"_98":150,"_151":152,"_153":-5,"_154":137,"_155":156,"_157":158,"_108":159,"_103":29,"_160":161,"_162":-5,"_163":25,"_164":-5,"_165":453,"_101":481},[454,463,478],{"_106":168,"_98":169,"_151":170,"_153":152,"_154":137,"_155":171,"_157":158,"_108":172,"_103":29,"_160":161,"_162":-5,"_163":25,"_164":-5,"_165":455,"_101":462},[456,459],{"_106":175,"_98":176,"_151":177,"_153":170,"_154":137,"_155":178,"_157":158,"_108":179,"_103":29,"_160":180,"_162":181,"_163":25,"_164":-5,"_165":457,"_101":458},[],[150,169,176],{"_106":185,"_98":186,"_151":187,"_153":170,"_154":137,"_155":188,"_157":158,"_108":189,"_103":190,"_160":180,"_162":191,"_163":25,"_164":-5,"_165":460,"_101":461},[],[150,169,186],[150,169],{"_106":196,"_98":197,"_151":198,"_153":152,"_154":137,"_155":199,"_157":158,"_108":200,"_103":29,"_160":161,"_162":-5,"_163":25,"_164":-5,"_165":464,"_101":477},[465,468,471,474],{"_106":203,"_98":204,"_151":205,"_153":198,"_154":137,"_155":206,"_157":158,"_108":207,"_103":190,"_160":180,"_162":208,"_163":25,"_164":-5,"_165":466,"_101":467},[],[150,197,204],{"_106":212,"_98":213,"_151":214,"_153":198,"_154":137,"_155":215,"_157":158,"_108":216,"_103":190,"_160":180,"_162":217,"_163":25,"_164":-5,"_165":469,"_101":470},[],[150,197,213],{"_106":221,"_98":222,"_151":223,"_153":198,"_154":137,"_155":224,"_157":158,"_108":225,"_103":190,"_160":180,"_162":226,"_163":25,"_164":-5,"_165":472,"_101":473},[],[150,197,222],{"_106":230,"_98":231,"_151":232,"_153":198,"_154":137,"_155":233,"_157":158,"_108":234,"_103":190,"_160":180,"_162":235,"_163":25,"_164":-5,"_165":475,"_101":476},[],[150,197,231],[150,197],{"_106":240,"_98":241,"_151":242,"_153":152,"_154":137,"_155":243,"_157":158,"_108":244,"_103":245,"_160":246,"_162":247,"_163":25,"_164":-5,"_165":479,"_101":480},[],[150,241],[150],{"_106":252,"_98":253,"_151":254,"_153":-5,"_154":137,"_155":255,"_157":158,"_108":256,"_103":29,"_160":161,"_162":-5,"_163":25,"_164":-5,"_165":483,"_101":520},[484,514,517],{"_106":259,"_98":260,"_151":261,"_153":254,"_154":137,"_155":262,"_157":158,"_108":263,"_103":29,"_160":161,"_162":-5,"_163":25,"_164":-5,"_165":485,"_101":513},[486,489,492,495,498,501,504,507,510],{"_106":266,"_98":267,"_151":268,"_153":261,"_154":137,"_155":269,"_157":158,"_108":270,"_103":190,"_160":180,"_162":271,"_163":25,"_164":-5,"_165":487,"_101":488},[],[253,260,267],{"_106":275,"_98":276,"_151":277,"_153":261,"_154":137,"_155":278,"_157":158,"_108":279,"_103":245,"_160":180,"_162":280,"_163":25,"_164":-5,"_165":490,"_101":491},[],[253,260,276],{"_106":284,"_98":285,"_151":286,"_153":261,"_154":137,"_155":287,"_157":158,"_108":288,"_103":190,"_160":180,"_162":289,"_163":25,"_164":-5,"_165":493,"_101":494},[],[253,260,285],{"_106":293,"_98":294,"_151":295,"_153":261,"_154":137,"_155":296,"_157":158,"_108":297,"_103":245,"_160":180,"_162":298,"_163":25,"_164":-5,"_165":496,"_101":497},[],[253,260,294],{"_106":302,"_98":303,"_151":304,"_153":261,"_154":137,"_155":136,"_157":158,"_108":305,"_103":245,"_160":180,"_162":306,"_163":25,"_164":-5,"_165":499,"_101":500},[],[253,260,303],{"_106":310,"_98":311,"_151":312,"_153":261,"_154":137,"_155":313,"_157":158,"_108":314,"_103":190,"_160":180,"_162":315,"_163":25,"_164":-5,"_165":502,"_101":503},[],[253,260,311],{"_106":319,"_98":320,"_151":321,"_153":261,"_154":137,"_155":322,"_157":158,"_108":323,"_103":190,"_160":180,"_162":324,"_163":25,"_164":-5,"_165":505,"_101":506},[],[253,260,320],{"_106":328,"_98":329,"_151":330,"_153":261,"_154":137,"_155":331,"_157":158,"_108":332,"_103":190,"_160":180,"_162":333,"_163":25,"_164":-5,"_165":508,"_101":509},[],[253,260,329],{"_106":337,"_98":338,"_151":339,"_153":261,"_154":137,"_155":340,"_157":158,"_108":341,"_103":245,"_160":180,"_162":342,"_163":25,"_164":-5,"_165":511,"_101":512},[],[253,260,338],[253,260],{"_106":347,"_98":348,"_151":349,"_153":254,"_154":137,"_155":350,"_157":158,"_108":351,"_103":190,"_160":352,"_162":353,"_163":25,"_164":-5,"_165":515,"_101":516},[],[253,348],{"_106":357,"_98":358,"_151":359,"_153":254,"_154":137,"_155":360,"_157":158,"_108":361,"_103":29,"_160":180,"_162":362,"_163":25,"_164":-5,"_165":518,"_101":519},[],[253,358],[253],{"_106":367,"_98":368,"_151":369,"_153":-5,"_154":137,"_155":370,"_157":158,"_108":371,"_103":29,"_160":161,"_162":-5,"_163":25,"_164":-5,"_165":522,"_101":526},[523],{"_106":374,"_98":375,"_151":376,"_153":369,"_154":137,"_155":377,"_157":158,"_108":378,"_103":190,"_160":180,"_162":379,"_163":25,"_164":-5,"_165":524,"_101":525},[],[368,375],[368],{"_106":384,"_98":385,"_151":386,"_153":-5,"_154":137,"_155":387,"_157":158,"_108":388,"_103":29,"_160":352,"_162":389,"_163":25,"_164":-5,"_165":528,"_101":529},[],[385],{"_106":393,"_98":394,"_151":395,"_153":-5,"_154":137,"_155":396,"_157":158,"_108":397,"_103":29,"_160":352,"_162":398,"_163":25,"_164":-5,"_165":531,"_101":532},[],[394],{"_106":402,"_98":403,"_151":404,"_153":-5,"_154":137,"_155":405,"_157":158,"_108":406,"_103":29,"_160":352,"_162":407,"_163":25,"_164":-5,"_165":534,"_101":535},[],[403],{"_106":411,"_98":412,"_151":413,"_153":-5,"_154":137,"_155":414,"_157":158,"_108":415,"_103":29,"_160":352,"_162":416,"_163":25,"_164":-5,"_165":537,"_101":538},[],[412],{"_106":420,"_98":421,"_151":422,"_153":-5,"_154":137,"_155":423,"_157":158,"_108":424,"_103":190,"_160":352,"_162":425,"_163":25,"_164":-5,"_165":540,"_101":541},[],[421],[452,454,456,459,463,465,468,471,474,478,482,484,486,489,492,495,498,501,504,507,510,514,517,521,523,527,530,533,536,539],{"_106":240,"_98":241,"_151":242,"_153":152,"_154":137,"_155":243,"_157":158,"_108":439,"_103":245,"_160":246,"_162":247,"_163":25,"_164":-5,"_101":544},[150,241],[],"upstream","showCompareCallout","pull","ahead","behind","templates",[],"routes/_app","actionData","errors"]

Error loading Kanban app

\n \n {isEditing ? 'Edit Board' : 'Create New Board'}\n

\n No boards yet\n

\n No boards found\n

onSelectBoard(board.id)}\n >\n {board.name}\n

Delete Board

\n Oops! Something went wrong\n

\n Board Not Found\n

\n {board.name}\n

\n \n {isEditing ? 'Edit Column' : 'Add New Column'}\n

\n No columns yet\n

\n \n {column.name}\n

Delete Column

\n {task.title}\n

Delete Task

\n \n {isEditing ? 'Edit Task' : 'Create New Task'}\n

\n {title || 'Task Title'}\n

\n
\n {column.name}\n