From 6defca2111c302d61257798ddfd09251b4424775 Mon Sep 17 00:00:00 2001
From: lfjnascimento <luiz.nascimento@profusion.mobi>
Date: Thu, 12 Sep 2024 11:20:43 -0300
Subject: [PATCH 1/2] fix: memoization on TestsTable

---
 dashboard/src/components/Table/TestsTable.tsx | 38 +++++++++----------
 1 file changed, 19 insertions(+), 19 deletions(-)

diff --git a/dashboard/src/components/Table/TestsTable.tsx b/dashboard/src/components/Table/TestsTable.tsx
index 93762ca9d..614b75c4b 100644
--- a/dashboard/src/components/Table/TestsTable.tsx
+++ b/dashboard/src/components/Table/TestsTable.tsx
@@ -1,6 +1,6 @@
 import { useNavigate, useSearch } from '@tanstack/react-router';
 
-import { useMemo } from 'react';
+import { useCallback, useMemo } from 'react';
 
 import { useIntl, FormattedMessage } from 'react-intl';
 
@@ -45,20 +45,23 @@ const TestsTable = ({ treeId }: ITestsTable): JSX.Element => {
     usePagination(data_len, ITEMS_PER_PAGE);
   const intl = useIntl();
 
-  const onClickFilter = (filter: TestsTableFilter): void => {
-    navigate({
-      search: previousParams => {
-        return {
-          ...previousParams,
-          tableFilter: {
-            bootsTable: previousParams.tableFilter.bootsTable,
-            buildsTable: previousParams.tableFilter.buildsTable,
-            testsTable: filter,
-          },
-        };
-      },
-    });
-  };
+  const onClickFilter = useCallback(
+    (filter: TestsTableFilter): void => {
+      navigate({
+        search: previousParams => {
+          return {
+            ...previousParams,
+            tableFilter: {
+              bootsTable: previousParams.tableFilter.bootsTable,
+              buildsTable: previousParams.tableFilter.buildsTable,
+              testsTable: filter,
+            },
+          };
+        },
+      });
+    },
+    [navigate],
+  );
 
   const filters = useMemo(
     () => [
@@ -151,10 +154,7 @@ const TestsTable = ({ treeId }: ITestsTable): JSX.Element => {
   return (
     <div className="flex flex-col gap-6">
       <div className="flex flex-row justify-between">
-        <TableStatusFilter
-          onClickTest={(filter: TestsTableFilter) => onClickFilter(filter)}
-          filters={filters}
-        />
+        <TableStatusFilter onClickTest={onClickFilter} filters={filters} />
         {tableInfoElement}
       </div>
       <Accordion type="test" items={filteredData ?? []} />

From 61876d47340491f35d5b15587b19cc037bc44bf5 Mon Sep 17 00:00:00 2001
From: lfjnascimento <luiz.nascimento@profusion.mobi>
Date: Thu, 12 Sep 2024 11:21:13 -0300
Subject: [PATCH 2/2] fix: use GroupedTestStatus in every test tables

---
 dashboard/src/components/Accordion/Accordion.tsx             | 4 ++--
 dashboard/src/pages/BuildDetails/BuildDetailsTestSection.tsx | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/dashboard/src/components/Accordion/Accordion.tsx b/dashboard/src/components/Accordion/Accordion.tsx
index 0838ced42..30375555f 100644
--- a/dashboard/src/components/Accordion/Accordion.tsx
+++ b/dashboard/src/components/Accordion/Accordion.tsx
@@ -14,7 +14,7 @@ import ColoredCircle from '@/components/ColoredCircle/ColoredCircle';
 
 import { ItemType } from '@/components/ListingItem/ListingItem';
 
-import { TestStatus } from '@/components/Status/Status';
+import { GroupedTestStatus } from '@/components/Status/Status';
 
 import HeaderWithInfo from '@/pages/TreeDetails/Tabs/HeaderWithInfo';
 
@@ -189,7 +189,7 @@ const AccordionTestsTrigger = ({
     <>
       <TableCell>{triggerInfo.path_group}</TableCell>
       <TableCell className="flex flex-row gap-1">
-        <TestStatus
+        <GroupedTestStatus
           pass={triggerInfo.pass_tests}
           done={triggerInfo.done_tests}
           miss={triggerInfo.miss_tests}
diff --git a/dashboard/src/pages/BuildDetails/BuildDetailsTestSection.tsx b/dashboard/src/pages/BuildDetails/BuildDetailsTestSection.tsx
index a1338ee0a..30be8058d 100644
--- a/dashboard/src/pages/BuildDetails/BuildDetailsTestSection.tsx
+++ b/dashboard/src/pages/BuildDetails/BuildDetailsTestSection.tsx
@@ -11,7 +11,7 @@ import { TableCell, TableRow } from '@/components/ui/table';
 import { useBuildTests } from '@/api/buildTests';
 import { usePagination } from '@/hooks/usePagination';
 import { MessagesKey } from '@/locales/messages';
-import { TestStatus } from '@/components/Status/Status';
+import { GroupedTestStatus } from '@/components/Status/Status';
 
 interface IBuildDetailsTestSection {
   buildId: string;
@@ -67,7 +67,7 @@ const BuildDetailsTestSection = ({
       <TableRow key={test.path_group}>
         <TableCell onClick={onClickName}>{test.path_group}</TableCell>
         <TableCell className="flex flex-row gap-1">
-          <TestStatus
+          <GroupedTestStatus
             pass={test.pass_tests}
             done={test.done_tests}
             miss={test.miss_tests}