if an item is checked, it increases the progres bar

Alforoan · Sep 6, 2024 · f8719a1 · f8719a1
1 parent cdc41fc
commit f8719a1
Show file tree

Hide file tree

Showing 4 changed files with 55 additions and 22 deletions.
diff --git a/client/src/components/BoardComponent.tsx b/client/src/components/BoardComponent.tsx
@@ -31,9 +31,6 @@ const COLUMN_COLORS: Record<string, string> = {
 };
 
 const BoardComponent: React.FC = () => {
-  const [estimatedTimeTotal, setEstimatedTimeTotal] = useState(0);
-  const [completedTimeTotal, setCompletedTimeTotal] = useState(0);
-
   const [noTitleWarning, setNoTitleWarning] = useState(false);
 
   const {
@@ -42,6 +39,8 @@ const BoardComponent: React.FC = () => {
     setSelectedCard,
     handleUpdateCard,
     handlePostNewCard,
+    setEstimatedTimeTotal,
+    setCompletedTimeTotal
   } = useBoard();
 
   const { isTemplate } = useTemplates();
@@ -53,14 +52,43 @@ const BoardComponent: React.FC = () => {
           (sum, card) => sum + (card.details.timeEstimate || 0),
           0
         ) || 0;
-      const completed =
+      const completedTimeCompletedColumn =
+        selectedBoard.cards
+          ?.filter(
+            (card) =>
+              card.column === Columns.completed
+          )
+          .reduce((sum, card) => sum + (card.details.timeEstimate || 0), 0) || 0;
+
+      const completedTimeInProgressColumn =
         selectedBoard.cards
-          ?.filter((card) => card.column === Columns.completed)
-          .reduce((sum, card) => sum + (card.details.timeEstimate || 0), 0) ||
-        0;
+          ?.filter(
+            (card) =>
+              card.column === Columns.inProgress
+          )
+          .reduce((sum, card) => {
+            const checkListArray = card?.details?.checklist || [];
+
+            const numOfCompletedCheckList = checkListArray.reduce(
+              (counter, checkList) => {
+                return checkList.checked ? counter + 1 : counter;
+              },
+              0
+            );
+
+            const timeEstimate = card?.details?.timeEstimate || 0;
+            const totalTime =
+              numOfCompletedCheckList > 0
+                ? (timeEstimate / checkListArray.length) *
+                  numOfCompletedCheckList
+                : 0;
+
+            return sum + totalTime;
+          }, 0) || 0;
+
 
       setEstimatedTimeTotal(total);
-      setCompletedTimeTotal(completed);
+      setCompletedTimeTotal(completedTimeCompletedColumn + completedTimeInProgressColumn);
     }
   }, [selectedBoard!, handlePostNewCard]);
 
@@ -479,8 +507,6 @@ const BoardComponent: React.FC = () => {
                 </DragDropContext>
               </Flex>
               <ProgressBar
-                estimatedTimeTotal={estimatedTimeTotal}
-                completedTimeTotal={completedTimeTotal}
               />
             </Box>
           )}

diff --git a/client/src/components/CheckboxItem.tsx b/client/src/components/CheckboxItem.tsx
@@ -71,13 +71,16 @@ const CheckboxItem: React.FC<CheckboxItemProps> = ({
       );
 
       const isAllChecked = areAllCardsChecked(updatedChecklist);
-      console.log({isAllChecked});
 
       if(isAllChecked){
         const updatedCard = {
           ...selectedCard,
-          column: Columns.completed
-        }
+          column: Columns.completed,
+          details: {
+            ...selectedCard.details,
+            checklist: updatedChecklist,
+          },
+        };
         console.log({updatedCard});
         handleUpdateCard(updatedCard, isTemplate);
       }else{

diff --git a/client/src/components/ProgressBar.tsx b/client/src/components/ProgressBar.tsx
@@ -1,16 +1,11 @@
 import { Box, Text } from "@chakra-ui/react";
+import { useBoard } from '../context/BoardContext';
 
 import React from "react";
 
-interface ProgressBarProps {
-  estimatedTimeTotal: number;
-  completedTimeTotal: number;
-}
+const ProgressBar: React.FC = () => {
+  const { completedTimeTotal, estimatedTimeTotal } = useBoard();
 
-const ProgressBar: React.FC<ProgressBarProps> = ({
-  estimatedTimeTotal,
-  completedTimeTotal,
-}) => {
   const progress =
     estimatedTimeTotal > 0
       ? (completedTimeTotal / estimatedTimeTotal) * 100

diff --git a/client/src/context/BoardContext.tsx b/client/src/context/BoardContext.tsx
@@ -48,6 +48,10 @@ interface BoardContextType {
   isLoading: boolean;
   setIsLoading: (isLoading: boolean) => void;
   handleAddAIBoard: (topic: string, cards: Card[]) => void;
+  completedTimeTotal: number;
+  setCompletedTimeTotal: (completedTimeTotal: number) => void;
+  estimatedTimeTotal: number;
+  setEstimatedTimeTotal: (estimatedTimeTotal: number) => void;
 }
 
 const BoardContext = createContext<BoardContextType | undefined>(undefined);
@@ -67,8 +71,9 @@ export const BoardProvider = ({ children }: { children: ReactNode }) => {
   const [searchInput, setSearchInput] = useState<string>("");
   const [searchedBoards, setSearchedBoards] = useState<Board[]>([]);
   const [currentPage, setCurrentPage] = useState<string>("Home");
-
+  const [completedTimeTotal, setCompletedTimeTotal] = useState<number>(0);
   const [isSearching, setIsSearching] = useState<boolean>(false);
+  const [estimatedTimeTotal, setEstimatedTimeTotal] = useState<number>(0);
 
   const { incrementDownloads } = useIncrementDownloads();
 
@@ -221,6 +226,10 @@ export const BoardProvider = ({ children }: { children: ReactNode }) => {
         isLoading,
         setIsLoading,
         handleAddAIBoard,
+        completedTimeTotal,
+        setCompletedTimeTotal,
+        estimatedTimeTotal,
+        setEstimatedTimeTotal,
       }}
     >
       {children}