feat(IssuesList): add a counter for unknown issues

Add a counter containing the number of failed tests with no linked issues. To do it, add an optional parameter to `IssuesList` that accept the number of total failed tests/builds/boots. If the parameter is not present the behavior of the Issues List is equal as it was before, otherwise it adds a new line to the list containing the number of unknown issues. Close #544
kernelci · Nov 22, 2024 · fdb5220 · fdb5220
1 parent b0f2d6a
commit fdb5220
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 1 deletion.
diff --git a/dashboard/src/components/Cards/IssuesList.tsx b/dashboard/src/components/Cards/IssuesList.tsx
@@ -13,10 +13,15 @@ import type { TIssue } from '@/types/general';
 
 interface IIssuesList {
   issues: TIssue[];
+  totalFails?: number;
   title: IBaseCard['title'];
 }
 
-const IssuesList = ({ issues, title }: IIssuesList): JSX.Element => {
+const IssuesList = ({
+  issues,
+  totalFails,
+  title,
+}: IIssuesList): JSX.Element => {
   const hasIssue = issues.length > 0;
 
   const titleElement = (
@@ -32,12 +37,14 @@ const IssuesList = ({ issues, title }: IIssuesList): JSX.Element => {
     </span>
   );
 
+  let knownLinkedIssues = 0;
   const contentElement = !hasIssue ? (
     <NoIssueFound />
   ) : (
     <DumbListingContent>
       {issues.map(issue => {
         const WrapperLink = issue.report_url ? Link : 'div';
+        knownLinkedIssues += issue.incidents_info.incidentsCount;
         return (
           <WrapperLink key={issue.id} to={issue.report_url} target="_blank">
             <ListingItem
@@ -49,6 +56,13 @@ const IssuesList = ({ issues, title }: IIssuesList): JSX.Element => {
           </WrapperLink>
         );
       })}
+      {totalFails !== undefined && (
+        <ListingItem
+          unknown={totalFails - knownLinkedIssues}
+          // TODO: Change this to alter the message according to the selected language
+          text={'Unknown'}
+        />
+      )}
     </DumbListingContent>
   );
 

diff --git a/dashboard/src/pages/TreeDetails/Tabs/Tests/TestsTab.tsx b/dashboard/src/pages/TreeDetails/Tabs/Tests/TestsTab.tsx
@@ -12,6 +12,8 @@ import BaseCard from '@/components/Cards/BaseCard';
 
 import type { TestsTableFilter } from '@/types/tree/TreeDetails';
 
+import { groupStatus } from '@/utils/status';
+
 import {
   DesktopGrid,
   InnerMobileGrid,
@@ -106,6 +108,16 @@ const TestsTab = ({ reqFilter }: TestsTabProps): JSX.Element => {
     );
   }
 
+  const failedCount = groupStatus({
+    doneCount: data.testStatusSummary.DONE ?? 0,
+    errorCount: data.testStatusSummary.ERROR ?? 0,
+    failCount: data.testStatusSummary.FAIL ?? 0,
+    missCount: data.testStatusSummary.MISS ?? 0,
+    passCount: data.testStatusSummary.PASS ?? 0,
+    skipCount: data.testStatusSummary.SKIP ?? 0,
+    nullCount: data.testStatusSummary.NULL ?? 0,
+  }).failedCount;
+
   return (
     <div className="flex flex-col gap-8 pt-4">
       <DesktopGrid>
@@ -125,6 +137,7 @@ const TestsTab = ({ reqFilter }: TestsTabProps): JSX.Element => {
           <MemoizedIssuesList
             title={<FormattedMessage id="global.issues" />}
             issues={data.testIssues}
+            totalFails={failedCount}
           />
         </div>
         <div>
@@ -154,6 +167,7 @@ const TestsTab = ({ reqFilter }: TestsTabProps): JSX.Element => {
             <MemoizedIssuesList
               title={<FormattedMessage id="global.issues" />}
               issues={data.testIssues}
+              totalFails={failedCount}
             />
           </div>
           <div>