Handled summary table for packages without dependencies & adjusted ta…

…ble dimensions Signed-off-by: Omkar Phansopkar <[email protected]>
aboutcode-org · Oct 17, 2023 · e397372 · e397372
1 parent 1626bab
commit e397372
Show file tree

Hide file tree

Showing 6 changed files with 38 additions and 27 deletions.
diff --git a/src/components/LicenseEntity/LicenseEntity.tsx b/src/components/LicenseEntity/LicenseEntity.tsx
@@ -129,6 +129,7 @@ const LicenseEntity = (props: LicenseDetectionEntityProps) => {
         onGridSizeChanged={(params) => params.api.sizeColumnsToFit()}
         className="ag-theme-alpine ag-grid-customClass entity-table"
         ensureDomOrder
+        suppressHorizontalScroll
         enableCellTextSelection
         pagination={false}
         defaultColDef={DEFAULT_FILE_REGION_COL_DEF}

diff --git a/src/components/PackagesEntityDetails/DependenciesTableCols.ts.ts b/src/components/PackagesEntityDetails/DependenciesTableCols.ts.ts
@@ -29,36 +29,36 @@ export const DependenciesTableCols: DepsColDef[] = [
   {
     headerName: "Scope",
     field: "scope",
-    width: 130,
+    width: 160,
   },
   {
     headerName: "Resolved",
     field: "is_resolved",
     cellRenderer: TickRenderer,
-    maxWidth: 95,
+    maxWidth: 92,
   },
   {
     headerName: "Runtime",
     field: "is_runtime",
     cellRenderer: TickRenderer,
-    maxWidth: 95,
+    maxWidth: 92,
   },
   {
     headerName: "Optional",
     field: "is_optional",
     cellRenderer: TickRenderer,
-    maxWidth: 95,
+    maxWidth: 92,
   },
   {
     headerName: "Data source ID",
     field: "datasource_id",
-    width: 130,
+    width: 165,
   },
   {
     headerName: "Data file",
     field: "datafile_path",
     cellRenderer: FilePathRenderer,
-    width: 200,
+    width: 400,
   },
   {
     headerName: "Extracted requirement",

diff --git a/src/components/PackagesEntityDetails/PackageEntity.tsx b/src/components/PackagesEntityDetails/PackageEntity.tsx
@@ -18,11 +18,11 @@ import "../../styles/entityCommonStyles.css";
 import "./packageEntity.css";
 
 interface PackageEntityProps {
-  package: PackageDetails;
+  activePackage: PackageDetails;
   goToDependency: (dependency: DependencyDetails) => void;
 }
 const PackageEntity = (props: PackageEntityProps) => {
-  const { package: activePackage } = props;
+  const { activePackage } = props;
   const { goToFileInTableView } = useWorkbenchDB();
 
   if (!activePackage) {

diff --git a/src/pages/DependencyInfoDash/DependencyInfoDash.tsx b/src/pages/DependencyInfoDash/DependencyInfoDash.tsx
@@ -60,7 +60,7 @@ const DependencyInfoDash = () => {
     >();
     packagesData.forEach((packageData) => {
       // Package data having PURL as null are invalid & will have no dependency
-      // Hence, don't consider such package data (will be fixed in further toolkit version)
+      // Hence, don't consider such package data (will be fixed in further scancode-toolkit version)
       if (!packageData.getDataValue("purl")) return;
 
       const packageDataType = packageData.getDataValue("type");
@@ -94,11 +94,15 @@ const DependencyInfoDash = () => {
       }, 0);
     });
 
-    return Array.from(packageTypeToSummaryMapping.values()).sort(
-      (packageTypeSummary1, packageTypeSummary2) =>
-        packageTypeSummary2.packageTypeDetails.total -
-        packageTypeSummary1.packageTypeDetails.total
-    );
+    return Array.from(packageTypeToSummaryMapping.values())
+      .filter(
+        (packageTypeSummary) => packageTypeSummary.packageTypeDetails.total > 0
+      )
+      .sort(
+        (packageTypeSummary1, packageTypeSummary2) =>
+          packageTypeSummary2.packageTypeDetails.total -
+          packageTypeSummary1.packageTypeDetails.total
+      );
   }
 
   useEffect(() => {
@@ -217,17 +221,22 @@ const DependencyInfoDash = () => {
         </Col>
       </Row>
       <br />
-      Dependency Scope summary by Package Type
-      <AgGridReact
-        rowData={Object.values(packageTypeSummaryData || {})}
-        columnDefs={DependencySummaryTableCols}
-        defaultColDef={DEFAULT_DEPS_SUMMARY_COL_DEF}
-        ensureDomOrder
-        enableCellTextSelection
-        onGridReady={(params) => params.api.sizeColumnsToFit()}
-        onGridSizeChanged={(params) => params.api.sizeColumnsToFit()}
-        className="ag-theme-alpine ag-grid-customClass scope-summary-table"
-      />
+      {packageTypeSummaryData.length > 0 && (
+        <>
+        <h6>Dependency Scope summary by Package Type</h6>
+          <AgGridReact
+            rowData={Object.values(packageTypeSummaryData || {})}
+            columnDefs={DependencySummaryTableCols}
+            defaultColDef={DEFAULT_DEPS_SUMMARY_COL_DEF}
+            ensureDomOrder
+            enableCellTextSelection
+            suppressHorizontalScroll
+            onGridReady={(params) => params.api.sizeColumnsToFit()}
+            onGridSizeChanged={(params) => params.api.sizeColumnsToFit()}
+            className="ag-theme-alpine ag-grid-customClass scope-summary-table"
+          />
+        </>
+      )}
       <br />
       <Row className="dash-cards">
         <Col sm={4}>

diff --git a/src/pages/DependencyInfoDash/dependencyInfoDash.css b/src/pages/DependencyInfoDash/dependencyInfoDash.css
@@ -1,5 +1,5 @@
 :root {
-  --min-scope-summary-table-height: 100px;
+  --min-scope-summary-table-height: 90px;
   --max-scope-summary-table-height: 40vh;
   --scope-summary-table-header-height: 49px;
   --scope-summary-table-height: 5px;
@@ -14,6 +14,7 @@
   min-height: var(--min-scope-summary-table-height);
   height: auto !important;
 }
+
 .scope-summary-table .ag-overlay-wrapper {
   max-height: var(--max-scope-summary-table-height);
   align-items: flex-end;

diff --git a/src/pages/Packages/Packages.tsx b/src/pages/Packages/Packages.tsx
@@ -589,7 +589,7 @@ const Packages = () => {
           {activeEntityType ? (
             activeEntityType === "package" && activePackage ? (
               <PackageEntity
-                package={activePackage}
+                activePackage={activePackage}
                 goToDependency={activateDependency}
               />
             ) : activeEntityType === "dependency" && activeDependency ? (