Refactor: Simplify statistics code

src/ElectronBackend/input/__tests__/importFromFile.test.ts

@@ -68,8 +68,8 @@ const inputFileContent: ParsedOpossumInputFile = {
   },
   config: {
     classifications: {
-      0: 'UNKNOWN',
-      1: 'CRITICAL',
+      0: 'GOOD',
+      1: 'BAD',
     },
   },
   externalAttributions: {
@@ -115,8 +115,8 @@ const expectedFileContent: ParsedFileContent = {
   resources: { a: 1, folder: {} },
   config: {
     classifications: {
-      0: 'UNKNOWN',
-      1: 'CRITICAL',
+      0: 'GOOD',
+      1: 'BAD',
     },
   },
   manualAttributions: {
@@ -376,8 +376,8 @@ describe('Test of loading function', () => {
           },
           config: {
             classifications: {
-              0: 'UNKNOWN',
-              1: 'CRITICAL',
+              0: 'GOOD',
+              1: 'BAD',
             },
           },
           externalAttributions: {
@@ -438,8 +438,8 @@ describe('Test of loading function', () => {
         resources: { a: 1 },
         config: {
           classifications: {
-            0: 'UNKNOWN',
-            1: 'CRITICAL',
+            0: 'GOOD',
+            1: 'BAD',
           },
         },
         manualAttributions: {

src/ElectronBackend/input/__tests__/parseFile.test.ts

@@ -27,8 +27,8 @@ const correctInput: ParsedOpossumInputFile = {
   },
   config: {
     classifications: {
-      0: 'UNKNOWN',
-      1: 'CRITICAL',
+      0: 'GOOD',
+      1: 'BAD',
     },
   },
   externalAttributions: {

src/Frontend/Components/AccordionWithPieChart/AccordionWithPieChart.tsx

@@ -8,10 +8,6 @@ import MuiAccordionDetails from '@mui/material/AccordionDetails';
 import MuiAccordionSummary from '@mui/material/AccordionSummary';
 import MuiTypography from '@mui/material/Typography';
 
-import {
-  PieChartCriticalityNames,
-  ProjectStatisticsPopupTitle,
-} from '../../enums/enums';
 import { OpossumColors } from '../../shared-styles';
 import { PieChartData } from '../../types/types';
 import { PieChart } from '../PieChart/PieChart';
@@ -37,34 +33,18 @@ interface AccordionProps {
   data: Array<PieChartData>;
   title: string;
   defaultExpanded?: boolean;
+  pieChartColorMap?: { [segmentName: string]: string };
 }
 
 export function getColorsForPieChart(
   pieChartData: Array<PieChartData>,
-  pieChartTitle: string,
+  pieChartColorMap?: { [segmentName: string]: string },
 ): Array<string> | undefined {
-  const pieChartColors: Array<string> = [];
-
-  if (
-    pieChartTitle === ProjectStatisticsPopupTitle.CriticalSignalsCountPieChart
-  ) {
-    for (const pieChartSegment of pieChartData) {
-      switch (pieChartSegment.name) {
-        case PieChartCriticalityNames.HighCriticality:
-          pieChartColors.push(OpossumColors.orange);
-          break;
-        case PieChartCriticalityNames.MediumCriticality:
-          pieChartColors.push(OpossumColors.mediumOrange);
-          break;
-        default:
-          pieChartColors.push(OpossumColors.darkBlue);
-          break;
-      }
-    }
-  } else {
+  if (pieChartColorMap === undefined) {
     return;
   }
-  return pieChartColors;
+
+  return pieChartData.map(({ name }) => pieChartColorMap[name]);
 }
 
 export const AccordionWithPieChart: React.FC<AccordionProps> = (props) => {
@@ -87,7 +67,7 @@ export const AccordionWithPieChart: React.FC<AccordionProps> = (props) => {
       <MuiAccordionDetails sx={classes.accordionDetails}>
         <PieChart
           segments={props.data}
-          colors={getColorsForPieChart(props.data, props.title)}
+          colors={getColorsForPieChart(props.data, props.pieChartColorMap)}
         />
       </MuiAccordionDetails>
     </MuiAccordion>

src/Frontend/Components/AttributionCountPerSourcePerLicenseTable/AttributionCountPerSourcePerLicenseTable.tsx

@@ -2,10 +2,20 @@
 // SPDX-FileCopyrightText: TNG Technology Consulting GmbH <https://www.tngtech.com>
 //
 // SPDX-License-Identifier: Apache-2.0
-import { sortBy } from 'lodash';
+import MuiBox from '@mui/material/Box';
+import MuiTable from '@mui/material/Table';
+import MuiTableBody from '@mui/material/TableBody';
+import MuiTableContainer from '@mui/material/TableContainer';
+import MuiTypography from '@mui/material/Typography';
 
-import { LicenseCounts, LicenseNamesWithCriticality } from '../../types/types';
-import { ProjectLicensesTable } from '../ProjectLicensesTable/ProjectLicensesTable';
+import {
+  LicenseCounts,
+  LicenseNamesWithClassification,
+  LicenseNamesWithCriticality,
+} from '../../types/types';
+import { AttributionCountPerSourcePerLicenseTableFooter } from './AttributionCountPerSourcePerLicenseTableFooter/AttributionCountPerSourcePerLicenseTableFooter';
+import { AttributionCountPerSourcePerLicenseTableHead } from './AttributionCountPerSourcePerLicenseTableHead/AttributionCountPerSourcePerLicenseTableHead';
+import { AttributionCountPerSourcePerLicenseTableRow } from './AttributionCountPerSourcePerLicenseTableRow/AttributionCountPerSourcePerLicenseTableRow';
 
 const classes = {
   container: {
@@ -14,13 +24,10 @@ const classes = {
   },
 };
 
-const LICENSE_COLUMN_NAME_IN_TABLE = 'License name';
-const FOOTER_TITLE = 'Total';
-const TOTAL_SOURCES_TITLE = 'Total';
-
 interface AttributionCountPerSourcePerLicenseTableProps {
   licenseCounts: LicenseCounts;
   licenseNamesWithCriticality: LicenseNamesWithCriticality;
+  licenseNamesWithClassification: LicenseNamesWithClassification;
   title: string;
 }
 
@@ -31,43 +38,48 @@ export const AttributionCountPerSourcePerLicenseTable: React.FC<
     props.licenseCounts.totalAttributionsPerSource,
   );
 
-  const totalNumberOfAttributionsPerSource = sourceNames.map((sourceName) =>
-    props.licenseCounts.totalAttributionsPerSource[sourceName].toString(),
-  );
-  const totalNumberOfAttributions = Object.values(
-    props.licenseCounts.totalAttributionsPerSource,
-  )
-    .reduce((partialSum, num) => partialSum + num, 0)
-    .toString();
-
-  const footerRow = [FOOTER_TITLE]
-    .concat(totalNumberOfAttributionsPerSource)
-    .concat(totalNumberOfAttributions);
-  const headerRow = [LICENSE_COLUMN_NAME_IN_TABLE]
-    .concat(sourceNames)
-    .concat(TOTAL_SOURCES_TITLE)
-    .map(
-      (sourceName) => sourceName.charAt(0).toUpperCase() + sourceName.slice(1),
-    );
-
-  Object.entries(
-    props.licenseCounts.attributionCountPerSourcePerLicense,
-  ).forEach(
-    ([licenseName, value]) =>
-      (value[TOTAL_SOURCES_TITLE] =
-        props.licenseCounts.totalAttributionsPerLicense[licenseName]),
-  );
-
   return (
-    <ProjectLicensesTable
-      title={props.title}
-      containerStyle={classes.container}
-      columnHeaders={headerRow}
-      columnNames={headerRow}
-      rowNames={sortBy(Object.keys(props.licenseNamesWithCriticality))}
-      tableContent={props.licenseCounts.attributionCountPerSourcePerLicense}
-      tableFooter={footerRow}
-      licenseNamesWithCriticality={props.licenseNamesWithCriticality}
-    />
+    <MuiBox>
+      <MuiTypography variant="subtitle1">{props.title}</MuiTypography>
+      <MuiTableContainer sx={classes.container}>
+        <MuiTable size="small" stickyHeader>
+          <AttributionCountPerSourcePerLicenseTableHead
+            sourceNames={sourceNames}
+          />
+          <MuiTableBody>
+            {Object.keys(props.licenseNamesWithCriticality)
+              .toSorted()
+              .map((licenseName, rowIndex) => (
+                <AttributionCountPerSourcePerLicenseTableRow
+                  sourceNames={sourceNames}
+                  signalCountsPerSource={
+                    props.licenseCounts.attributionCountPerSourcePerLicense[
+                      licenseName
+                    ]
+                  }
+                  licenseName={licenseName}
+                  licenseCriticality={
+                    props.licenseNamesWithCriticality[licenseName]
+                  }
+                  licenseClassification={
+                    props.licenseNamesWithClassification[licenseName]
+                  }
+                  totalSignalCount={
+                    props.licenseCounts.totalAttributionsPerLicense[licenseName]
+                  }
+                  key={rowIndex}
+                  rowIndex={rowIndex}
+                />
+              ))}
+          </MuiTableBody>
+          <AttributionCountPerSourcePerLicenseTableFooter
+            sourceNames={sourceNames}
+            totalAttributionsPerSource={
+              props.licenseCounts.totalAttributionsPerSource
+            }
+          />
+        </MuiTable>
+      </MuiTableContainer>
+    </MuiBox>
   );
 };

src/Frontend/Components/AttributionCountPerSourcePerLicenseTable/AttributionCountPerSourcePerLicenseTableFooter/AttributionCountPerSourcePerLicenseTableFooter.tsx

@@ -0,0 +1,44 @@
+// SPDX-FileCopyrightText: Meta Platforms, Inc. and its affiliates
+// SPDX-FileCopyrightText: TNG Technology Consulting GmbH <https://www.tngtech.com>
+//
+// SPDX-License-Identifier: Apache-2.0
+import MuiTableCell from '@mui/material/TableCell';
+import MuiTableFooter from '@mui/material/TableFooter';
+import MuiTableRow from '@mui/material/TableRow';
+import _ from 'lodash';
+
+import { text } from '../../../../shared/text';
+import { tableClasses } from '../../../shared-styles';
+
+interface AttributionCountPerSourcePerLicenseTableFooterProps {
+  sourceNames: Array<string>;
+  totalAttributionsPerSource: { [sourceName: string]: number };
+}
+
+export const AttributionCountPerSourcePerLicenseTableFooter: React.FC<
+  AttributionCountPerSourcePerLicenseTableFooterProps
+> = (props) => {
+  return (
+    <MuiTableFooter>
+      <MuiTableRow>
+        <MuiTableCell sx={tableClasses.footer} align={'left'}>
+          {text.attributionCountPerSourcePerLicenseTable.footerTitle}
+        </MuiTableCell>
+        <MuiTableCell sx={tableClasses.footer} />
+        <MuiTableCell sx={tableClasses.footer} />
+        {props.sourceNames.map((sourceName, sourceIdx) => (
+          <MuiTableCell
+            sx={tableClasses.footer}
+            key={sourceIdx}
+            align={'center'}
+          >
+            {props.totalAttributionsPerSource[sourceName]}
+          </MuiTableCell>
+        ))}
+        <MuiTableCell sx={tableClasses.footer} align={'center'}>
+          {_.sum(Object.values(props.totalAttributionsPerSource))}
+        </MuiTableCell>
+      </MuiTableRow>
+    </MuiTableFooter>
+  );
+};