Add description

src/client/src/components/todos/add/addTodoForm.tsx

@@ -4,7 +4,7 @@ import { PrimaryButton } from "@src/components/common/buttons/primaryButton";
 import { TodoShortForm } from "@src/components/todos/collapsed/todoShortForm";
 
 export const AddTodoForm: FC<{
-  onAdd: (todoName: string, project: string) => void;
+  onAdd: (todoName: string, project: string, description: string) => void;
   onClose: () => void;
   project: string;
 }> = ({ onAdd, onClose, ...props }) => {
@@ -16,7 +16,7 @@ export const AddTodoForm: FC<{
     <form
       onSubmit={(e) => {
         e.preventDefault();
-        onAdd(todoName, project);
+        onAdd(todoName, project, todoDescription);
         setTodoName("");
         setTodoDescription("");
       }}

src/client/src/components/todos/addTodo.tsx

@@ -22,8 +22,8 @@ export function AddTodo(props: { project: string }) {
   return (
     <AddTodoForm
       project={props.project}
-      onAdd={(todoName, project) => {
-        createTodo(todoName, project);
+      onAdd={(todoName, project, description) => {
+        createTodo(todoName, project, description);
       }}
       onClose={() => setCollapsed(CollapsedState.collapsed)}
     />

src/client/src/components/todos/todoItem.tsx

@@ -29,7 +29,12 @@ export const TodoItem: FC<TodoItemProps> = (props) => {
               {props.todo.title}
             </a>
           </Link>
-          <div>
+          <div className="flex flex-row justify-between items-end">
+            <div>
+              {props.todo.description && (
+                  <div className="h-3 w-3 bg-gray-200 dark:bg-gray-900"/>
+              )}
+            </div>
             {props.displayProject && props.todo.project && (
               <div className="text-gray-500 text-xs text-right whitespace-nowrap place-self-end">
                 {props.todo.project}

src/client/src/core/entities/todo.tsx

@@ -9,6 +9,7 @@ export const StatusState: { done: Done; notDone: NotDone } = {
 export interface Todo {
   id: string;
   title: string;
+  description?: string;
   status: StatusState;
   project?: string;
 }

src/client/src/presentation/contexts/SocketContext.tsx

@@ -12,7 +12,7 @@ interface SocketContextProps {
   inboxTodos: Todo[];
   getTodos: () => void;
   getInboxTodos: () => void;
-  createTodo: (todoName: string, project: string) => void;
+  createTodo: (todoName: string, project: string, description: string) => void;
   updateTodo: (todoId: string, todoStatus: StatusState) => void;
   getTodoById(todoId: string): void;
   replaceTodo(todo: Todo): void;
@@ -24,7 +24,7 @@ export const SocketContext = createContext<SocketContextProps>({
   inboxTodos: [],
   getTodos: () => {},
   getInboxTodos: () => {},
-  createTodo: (todoName, project) => {},
+  createTodo: (todoName, project, description) => {},
   updateTodo: (todoId, todoStatus) => {},
   getTodoById(todoId: string) {},
   replaceTodo(todo: Todo) {},
@@ -89,8 +89,8 @@ export const SocketProvider: FC = (props) => {
         getInboxTodos: () => {
           conn.invoke("GetInboxTodos").catch(console.error);
         },
-        createTodo: (todoName, project) => {
-          conn.invoke("CreateTodo", todoName, project).catch(console.error);
+        createTodo: (todoName, project, description) => {
+          conn.invoke("CreateTodo", todoName, project, description).catch(console.error);
         },
         updateTodo: (todoId, todoStatus) => {
           conn.invoke("UpdateTodo", todoId, todoStatus).catch(console.error);

src/client/src/presentation/hooks/socketHooks.tsx

@@ -19,8 +19,8 @@ export const useCreateTodo = () => {
   const socketContext = useContext(SocketContext);
 
   return {
-    createTodo: (todoName: string, project: string) => {
-      socketContext.createTodo(todoName, project);
+    createTodo: (todoName: string, project: string, description: string) => {
+      socketContext.createTodo(todoName, project, description);
     },
   };
 };