Add total row

amitsingh-007 · Nov 9, 2024 · 751cfc4 · 751cfc4
1 parent 9692d72
commit 751cfc4
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 4 deletions.
diff --git a/src/app/dashboard-table.tsx b/src/app/dashboard-table.tsx
@@ -51,7 +51,7 @@ const DahsboardTable = () => {
       { enabled: !!user, refetchOnMount: true }
     );
 
-  const monthCardsData = useMemo(
+  const { monthCardsData, total } = useMemo(
     () => getMergedCardsData(cardsData, cardTransactions),
     [cardsData, cardTransactions]
   );
@@ -107,7 +107,7 @@ const DahsboardTable = () => {
             <TableBody>
               <TableRow>
                 <TableCell colSpan={4} className="p-0">
-                  <Skeleton className="rounded-none h-32 sm:h-96" />
+                  <Skeleton className="rounded-none h-60 sm:h-96" />
                 </TableCell>
               </TableRow>
             </TableBody>
@@ -152,6 +152,12 @@ const DahsboardTable = () => {
                   </TableRow>
                 );
               })}
+              <TableRow className="bg-muted/50">
+                <TableCell className="font-bold py-3 pl-9" colSpan={2}>
+                  Total
+                </TableCell>
+                <TableCell colSpan={2}> {getFormattedPrice(total)}</TableCell>
+              </TableRow>
             </TableBody>
           )}
         </Table>

diff --git a/src/app/utils.ts b/src/app/utils.ts
@@ -6,7 +6,7 @@ export const getMergedCardsData = (
   cardTransactions: Record<string, TCardTransaction> | undefined
 ) => {
   if (!cardsData) {
-    return [];
+    return { monthCardsData: [], total: 0 };
   }
   const cardTransactionMap = cardTransactions
     ? Object.entries(cardTransactions).reduce<Map<string, TCardTransaction>>(
@@ -18,9 +18,11 @@ export const getMergedCardsData = (
       )
     : new Map<string, TCardTransaction>();
 
-  return Object.entries(cardsData)
+  let total = 0;
+  const monthCardsData = Object.entries(cardsData)
     .map(([cardId, cardDetails]) => {
       const transaction = cardTransactionMap.get(cardId);
+      total += transaction?.amount || 0;
 
       return {
         cardId: cardId,
@@ -31,6 +33,7 @@ export const getMergedCardsData = (
     .sort(
       (a, b) => a.cardDetails.cardBillingDate - b.cardDetails.cardBillingDate
     );
+  return { monthCardsData, total };
 };
 
 export const getMergedTxnData = (