+
-
{task.title}
+ {isEditing ? (
+
+ ) : (
+
+ {task.title}
+
+ )}
{formattedDate}
diff --git a/web/components/routes/task/TaskList.tsx b/web/components/routes/task/TaskList.tsx
index 8478dae3..83d68470 100644
--- a/web/components/routes/task/TaskList.tsx
+++ b/web/components/routes/task/TaskList.tsx
@@ -1,20 +1,21 @@
import React from "react"
-import { ListOfTasks, Task } from "@/lib/schema/tasks"
+import { Task } from "@/lib/schema/tasks"
import { TaskItem } from "./TaskItem"
interface TaskListProps {
- tasks?: ListOfTasks
+ tasks: Task[]
onUpdateTask: (taskId: string, updates: Partial
) => void
+ onDeleteTask: (taskId: string) => void
}
-export const TaskList: React.FC = ({ tasks, onUpdateTask }) => {
+export const TaskList: React.FC = ({ tasks, onUpdateTask, onDeleteTask }) => {
return (
{tasks?.map(
task =>
task?.id && (
-
-
+
)
)}
diff --git a/web/components/routes/task/TaskRoute.tsx b/web/components/routes/task/TaskRoute.tsx
index a2efe5ec..9a3278fd 100644
--- a/web/components/routes/task/TaskRoute.tsx
+++ b/web/components/routes/task/TaskRoute.tsx
@@ -5,11 +5,28 @@ import { Task } from "@/lib/schema/tasks"
import { TaskList } from "./TaskList"
import { TaskForm } from "./TaskForm"
import { LaIcon } from "@/components/custom/la-icon"
+import { isToday, isFuture } from "date-fns"
+import { useTaskActions } from "./new-task-actions"
+import { ID } from "jazz-tools"
-export const TaskRoute: React.FC = () => {
+interface TaskRouteProps {
+ filter?: "today" | "upcoming"
+}
+
+export const TaskRoute: React.FC = ({ filter }) => {
const { me } = useAccount({ root: { tasks: [] } })
const tasks = me?.root.tasks
- console.log(tasks, "tasks here")
+ const { deleteTask } = useTaskActions()
+
+ const filteredTasks = tasks?.filter(task => {
+ if (!task) return false
+ if (filter === "today") {
+ return task.status !== "done" && task.dueDate && isToday(task.dueDate)
+ } else if (filter === "upcoming") {
+ return task.status !== "done" && task.dueDate && isFuture(task.dueDate)
+ }
+ return true
+ })
const updateTask = (taskId: string, updates: Partial) => {
if (me?.root?.tasks) {
@@ -20,14 +37,26 @@ export const TaskRoute: React.FC = () => {
}
}
+ const onDeleteTask = (taskId: string) => {
+ if (me) {
+ deleteTask(me, taskId as ID)
+ }
+ }
+
return (
-
Current Tasks
+
+ {filter === "today" ? "Today's Tasks" : filter === "upcoming" ? "Upcoming Tasks" : "All Tasks"}
+
-
-
+
+
task !== null) || []}
+ onUpdateTask={updateTask}
+ onDeleteTask={onDeleteTask}
+ />
)
}
diff --git a/web/components/routes/task/TodayTaskRoute.tsx b/web/components/routes/task/TodayTaskRoute.tsx
new file mode 100644
index 00000000..d2e4f8a0
--- /dev/null
+++ b/web/components/routes/task/TodayTaskRoute.tsx
@@ -0,0 +1,15 @@
+import { TaskRoute } from "@/components/routes/task/TaskRoute"
+import { currentUser } from "@clerk/nextjs/server"
+import { notFound } from "next/navigation"
+import { get } from "ronin"
+
+export default async function TodayTasksPage() {
+ const user = await currentUser()
+ const flag = await get.featureFlag.with.name("TASK")
+
+ if (!user?.emailAddresses.some(email => flag?.emails.includes(email.emailAddress))) {
+ notFound()
+ }
+
+ return
+}
diff --git a/web/components/routes/task/UpcomingTaskRoute.tsx b/web/components/routes/task/UpcomingTaskRoute.tsx
new file mode 100644
index 00000000..2ab33656
--- /dev/null
+++ b/web/components/routes/task/UpcomingTaskRoute.tsx
@@ -0,0 +1,15 @@
+import { TaskRoute } from "@/components/routes/task/TaskRoute"
+import { currentUser } from "@clerk/nextjs/server"
+import { notFound } from "next/navigation"
+import { get } from "ronin"
+
+export default async function UpcomingTasksPage() {
+ const user = await currentUser()
+ const flag = await get.featureFlag.with.name("TASK")
+
+ if (!user?.emailAddresses.some(email => flag?.emails.includes(email.emailAddress))) {
+ notFound()
+ }
+
+ return
+}
diff --git a/web/components/routes/task/new-task-actions.ts b/web/components/routes/task/new-task-actions.ts
new file mode 100644
index 00000000..484a8dbb
--- /dev/null
+++ b/web/components/routes/task/new-task-actions.ts
@@ -0,0 +1,62 @@
+import { useCallback } from "react"
+import { toast } from "sonner"
+import { LaAccount } from "@/lib/schema"
+import { Task, ListOfTasks } from "@/lib/schema/tasks"
+import { ID } from "jazz-tools"
+
+export const useTaskActions = () => {
+ const newTask = useCallback((me: LaAccount): Task | null => {
+ if (!me.root) {
+ console.error("User root is not initialized")
+ return null
+ }
+
+ if (!me.root.tasks) {
+ me.root.tasks = ListOfTasks.create([], { owner: me })
+ }
+
+ const newTask = Task.create(
+ {
+ title: "",
+ description: "",
+ status: "todo",
+ createdAt: new Date(),
+ updatedAt: new Date()
+ },
+ { owner: me._owner }
+ )
+
+ me.root.tasks.push(newTask)
+ return newTask
+ }, [])
+
+ const deleteTask = useCallback((me: LaAccount, taskId: ID): void => {
+ if (!me.root?.tasks) return
+
+ const index = me.root.tasks.findIndex(item => item?.id === taskId)
+ if (index === -1) {
+ toast.error("Task not found")
+ return
+ }
+
+ const task = me.root.tasks[index]
+ if (!task) {
+ toast.error("Task data is invalid")
+ return
+ }
+
+ try {
+ me.root.tasks.splice(index, 1)
+
+ toast.success("Task deleted", {
+ position: "bottom-right",
+ description: `${task.title} has been deleted.`
+ })
+ } catch (error) {
+ console.error("Failed to delete task", error)
+ toast.error("Failed to delete task")
+ }
+ }, [])
+
+ return { newTask, deleteTask }
+}
diff --git a/web/components/ui/date-picker.tsx b/web/components/ui/date-picker.tsx
new file mode 100644
index 00000000..6885577d
--- /dev/null
+++ b/web/components/ui/date-picker.tsx
@@ -0,0 +1,32 @@
+import * as React from "react"
+import { format } from "date-fns"
+import { Calendar as CalendarIcon } from "lucide-react"
+import { cn } from "@/lib/utils"
+import { Button } from "@/components/ui/button"
+import { Calendar } from "@/components/ui/calendar"
+import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover"
+
+interface DatePickerProps {
+ date: Date | undefined
+ onDateChange: (date: Date | undefined) => void
+ className?: string
+}
+
+export function DatePicker({ date, onDateChange, className }: DatePickerProps) {
+ return (
+
+
+
+
+
+
+
+
+ )
+}
diff --git a/web/lib/schema/tasks.ts b/web/lib/schema/tasks.ts
index 71cf643f..e5cb9c2a 100644
--- a/web/lib/schema/tasks.ts
+++ b/web/lib/schema/tasks.ts
@@ -6,6 +6,7 @@ export class Task extends CoMap {
status = co.literal("todo", "in_progress", "done")
createdAt = co.encoded(Encoders.Date)
updatedAt = co.encoded(Encoders.Date)
+ dueDate = co.optional.encoded(Encoders.Date)
}
export class ListOfTasks extends CoList.Of(co.ref(Task)) {}