Fix box chart empty condition

the-deep · Feb 22, 2024 · a24bb25 · a24bb25
1 parent 01b5dbc
commit a24bb25
Showing 1 changed file with 7 additions and 3 deletions.
diff --git a/app/components/charts/BoxBarChart/index.tsx b/app/components/charts/BoxBarChart/index.tsx
@@ -7,6 +7,7 @@ import {
     sum,
     getColorOnBgColor,
     isDefined,
+    isNotDefined,
 } from '@togglecorp/fujs';
 import {
     ContainerCard,
@@ -70,6 +71,9 @@ function BoxBarChart<
     } = props;
 
     const finalData = useMemo(() => {
+        if (isNotDefined(data) || data?.length <= 0) {
+            return [];
+        }
         const itemsGroupedByRow = listToGroupList(
             data ?? [],
             rowSelector,
@@ -144,7 +148,7 @@ function BoxBarChart<
                 {isDefined(data) && (
                     <div className={styles.row}>
                         <div />
-                        {columns.map((column) => (
+                        {columns?.map((column) => (
                             <div
                                 className={_cs(
                                     styles.cell,
@@ -159,15 +163,15 @@ function BoxBarChart<
                         <div />
                     </div>
                 )}
-                {finalData.map((item) => (
+                {finalData?.map((item) => (
                     <div
                         key={item.rowLabel}
                         className={styles.row}
                     >
                         <div className={_cs(styles.cell, styles.label)}>
                             {item.rowLabel}
                         </div>
-                        {item.columnsForRow.map((countItem, index) => {
+                        {item.columnsForRow?.map((countItem, index) => {
                             const bgColor = getColorForValue(countItem);
 
                             return (