From 138af2321525f552981176aeb14c0a82422e5b05 Mon Sep 17 00:00:00 2001
From: sanju <sanjuraj57421@gmail.com>
Date: Thu, 24 Oct 2024 00:28:22 +0530
Subject: [PATCH] fix task entry behaviour issue

---
 client/src/components/TodoItem.tsx | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/client/src/components/TodoItem.tsx b/client/src/components/TodoItem.tsx
index aabd2dd..61daa03 100644
--- a/client/src/components/TodoItem.tsx
+++ b/client/src/components/TodoItem.tsx
@@ -1,5 +1,5 @@
 import { Badge, Box, Flex, Spinner, Text } from "@chakra-ui/react";
-import { FaCheckCircle } from "react-icons/fa";
+import { FaRegCircle,FaCheckCircle } from "react-icons/fa";
 import { MdDelete } from "react-icons/md";
 import { Todo } from "./TodoList";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
@@ -68,6 +68,7 @@ const TodoItem = ({ todo }: { todo: Todo }) => {
 				>
 					{todo.body}
 				</Text>
+				
 				{todo.completed && (
 					<Badge ml='1' colorScheme='green'>
 						Done
@@ -80,14 +81,18 @@ const TodoItem = ({ todo }: { todo: Todo }) => {
 				)}
 			</Flex>
 			<Flex gap={2} alignItems={"center"}>
-				<Box color={"green.500"} cursor={"pointer"} onClick={() => updateTodo()}>
-					{!isUpdating && <FaCheckCircle size={20} />}
+				<Box color={todo.completed? "green.500":"whiteAlpha.500"} cursor={"pointer"} onClick={() => updateTodo()}>
+					{!isUpdating && (todo.completed)?<FaCheckCircle size={20} />:<FaRegCircle size={20} />
+					
+					}
+		
 					{isUpdating && <Spinner size={"sm"} />}
 				</Box>
 				<Box color={"red.500"} cursor={"pointer"} onClick={() => deleteTodo()}>
 					{!isDeleting && <MdDelete size={25} />}
 					{isDeleting && <Spinner size={"sm"} />}
 				</Box>
+				
 			</Flex>
 		</Flex>
 	);