5430d8daa4
Co-authored-by: Julien Valverdé <julien.valverde@mailo.com> Reviewed-on: https://gitea:3000/Thilawyn/reffuse/pulls/1
57 lines
1.8 KiB
TypeScript
57 lines
1.8 KiB
TypeScript
import { Todo } from "@/domain"
|
|
import { Box, Card, Flex, IconButton, TextArea } from "@radix-ui/themes"
|
|
import { Effect } from "effect"
|
|
import { Delete } from "lucide-react"
|
|
import { useState } from "react"
|
|
import { R } from "../reffuse"
|
|
import { TodosState } from "../services"
|
|
|
|
|
|
export interface VTodoProps {
|
|
readonly index: number
|
|
readonly todo: Todo.Todo
|
|
}
|
|
|
|
export function VTodo({ index, todo }: VTodoProps) {
|
|
|
|
const runSync = R.useRunSync()
|
|
const editorMode = useState(false)
|
|
|
|
|
|
return (
|
|
<Box>
|
|
<Card>
|
|
<Flex direction="column" align="stretch" gap="1">
|
|
<TextArea
|
|
value={todo.content}
|
|
onChange={e => TodosState.TodosState.pipe(
|
|
Effect.flatMap(state => state.replace(
|
|
index,
|
|
Todo.Todo.make({ ...todo, content: e.target.value }, true),
|
|
)),
|
|
runSync,
|
|
)}
|
|
disabled={!editorMode}
|
|
/>
|
|
|
|
<Flex direction="row" justify="between" align="center">
|
|
<Box></Box>
|
|
|
|
<Flex direction="row" align="center" gap="1">
|
|
<IconButton
|
|
onClick={() => TodosState.TodosState.pipe(
|
|
Effect.flatMap(state => state.remove(index)),
|
|
runSync,
|
|
)}
|
|
>
|
|
<Delete />
|
|
</IconButton>
|
|
</Flex>
|
|
</Flex>
|
|
</Flex>
|
|
</Card>
|
|
</Box>
|
|
)
|
|
|
|
}
|