@undp/data-viz 2.6.0 → 2.6.1

package/dist/PerformanceIntensiveMultiGraphDashboard.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"PerformanceIntensiveMultiGraphDashboard.cjs","sources":["../src/Components/Dashboard/PerformanceIntensive/MultiGraphDashboard.tsx"],"sourcesContent":["import { useEffect, useEffectEvent, useState } from 'react';\r\nimport intersection from 'lodash.intersection';\r\nimport flattenDeep from 'lodash.flattendeep';\r\nimport { createFilter, DropdownSelect } from '@undp/design-system-react/DropdownSelect';\r\nimport { Label } from '@undp/design-system-react/Label';\r\nimport { CheckboxGroup, CheckboxGroupItem } from '@undp/design-system-react/CheckboxGroup';\r\nimport { RadioGroup, RadioGroupItem } from '@undp/design-system-react/RadioGroup';\r\n\r\nimport { SingleGraphDashboard } from '../SingleGraphDashboard';\r\n\r\nimport { SingleGraphDashboardThreeDGraphs } from './SingleGraphDashboardThreeDGraphs';\r\nimport { SingleGraphDashboardGeoHubMaps } from './SingleGraphDashboardGeoHubMaps';\r\n\r\nimport {\r\n  ClassNameObject,\r\n  PerformanceIntensiveDashboardLayoutDataType,\r\n  DataFilterDataType,\r\n  DataSettingsDataType,\r\n  FilterSettingsDataType,\r\n  FilterUiSettingsDataType,\r\n  GraphType,\r\n  StyleObject,\r\n  PerformanceIntensiveDashboardColumnDataType,\r\n  ThreeDGraphType,\r\n  GeoHubGraphType,\r\n} from '@/Types';\r\nimport {\r\n  fetchAndParseCSV,\r\n  fetchAndParseJSON,\r\n  fetchAndParseMultipleDataSources,\r\n  fetchAndTransformDataFromAPI,\r\n} from '@/Utils/fetchAndParseData';\r\nimport { getUniqValue } from '@/Utils/getUniqValue';\r\nimport { GraphHeader } from '@/Components/Elements/GraphHeader';\r\nimport { transformColumnsToArray } from '@/Utils/transformData/transformColumnsToArray';\r\nimport { filterData } from '@/Utils/transformData/filterData';\r\nimport { transformDefaultValue } from '@/Utils/transformDataForSelect';\r\nimport { GraphContainer } from '@/Components/Elements/GraphContainer';\r\n\r\ninterface Props {\r\n  dashboardID?: string;\r\n  dashboardLayout: PerformanceIntensiveDashboardLayoutDataType;\r\n  dataSettings: DataSettingsDataType;\r\n  filters?: FilterUiSettingsDataType[];\r\n  noOfFiltersPerRow?: number;\r\n  dataFilters?: DataFilterDataType[];\r\n  debugMode?: boolean;\r\n  theme?: 'dark' | 'light';\r\n  filterPosition?: 'top' | 'side';\r\n  readableHeader?: {\r\n    value: string;\r\n    label: string;\r\n  }[];\r\n  uiMode?: 'light' | 'normal';\r\n  graphStyles?: StyleObject;\r\n  graphClassNames?: ClassNameObject;\r\n}\r\n\r\nconst TotalWidth = (columns: PerformanceIntensiveDashboardColumnDataType[]) => {\r\n  const columnWidth = columns.map(d => d.columnWidth || 1);\r\n  const sum = columnWidth.reduce((acc, cur) => acc + cur, 0);\r\n  return sum;\r\n};\r\n\r\nconst GraphWithAttachedFilter: GraphType[] = [\r\n  'barChart',\r\n  'choroplethMap',\r\n  'biVariateChoroplethMap',\r\n  'circlePacking',\r\n  'treeMap',\r\n];\r\n\r\nexport function PerformanceIntensiveMultiGraphDashboard(props: Props) {\r\n  const {\r\n    dashboardID,\r\n    dashboardLayout,\r\n    dataSettings,\r\n    filters,\r\n    debugMode,\r\n    theme = 'light',\r\n    readableHeader,\r\n    dataFilters,\r\n    noOfFiltersPerRow = 4,\r\n    filterPosition,\r\n    uiMode = 'normal',\r\n    graphStyles,\r\n    graphClassNames,\r\n  } = props;\r\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n  const [filteredData, setFilteredData] = useState<any>(undefined);\r\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n  const [data, setData] = useState<any>(undefined);\r\n  const [filterSettings, setFilterSettings] = useState<FilterSettingsDataType[]>([]);\r\n\r\n  const threeDGraphs = ['threeDGlobe'];\r\n  const geoHubMaps = ['geoHubCompareMap', 'geoHubMap', 'geoHubMapWithLayerSelection'];\r\n  const filterConfig = {\r\n    ignoreCase: true,\r\n    ignoreAccents: true,\r\n    trim: true,\r\n  };\r\n\r\n  const updateFiltersEvent = useEffectEvent(() => {\r\n    const filterSettingsTemp = (filters || []).map(el => ({\r\n      filter: el.column,\r\n      label: el.label || `Filter by ${el.column}`,\r\n      singleSelect: el.singleSelect,\r\n      clearable: el.clearable,\r\n      defaultValue: transformDefaultValue(el.defaultValue),\r\n      value: transformDefaultValue(el.defaultValue),\r\n      availableValues: getUniqValue(data, el.column)\r\n        .filter(v => !el.excludeValues?.includes(`${v}`))\r\n        .map(v => ({ value: v, label: v })),\r\n      allowSelectAll: el.allowSelectAll,\r\n      width: el.width,\r\n    }));\r\n    setFilterSettings(filterSettingsTemp);\r\n  });\r\n  const filteredDataEvent = useEffectEvent(() => {\r\n    if (!data || filterSettings.length === 0) setFilteredData(data);\r\n    else {\r\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n      const result = data.filter((item: any) =>\r\n        filterSettings.every(filter =>\r\n          filter.value && flattenDeep([filter.value]).length > 0\r\n            ? intersection(\r\n                flattenDeep([item[filter.filter]]),\r\n                flattenDeep([filter.value]).map(el => el.value),\r\n              ).length > 0\r\n            : true,\r\n        ),\r\n      );\r\n      setFilteredData(result);\r\n    }\r\n  });\r\n  useEffect(() => {\r\n    filteredDataEvent();\r\n  }, [filterSettings, data]);\r\n\r\n  useEffect(() => {\r\n    const fetchData = async () => {\r\n      try {\r\n        const dataFromFile = dataSettings.dataURL\r\n          ? typeof dataSettings.dataURL === 'string'\r\n            ? dataSettings.fileType === 'json'\r\n              ? await fetchAndParseJSON(\r\n                  dataSettings.dataURL,\r\n                  dataSettings.columnsToArray,\r\n                  dataSettings.dataTransformation,\r\n                  debugMode,\r\n                )\r\n              : dataSettings.fileType === 'api'\r\n                ? await fetchAndTransformDataFromAPI(\r\n                    dataSettings.dataURL,\r\n                    dataSettings.apiHeaders,\r\n                    dataSettings.columnsToArray,\r\n                    dataSettings.dataTransformation,\r\n                    debugMode,\r\n                  )\r\n                : await fetchAndParseCSV(\r\n                    dataSettings.dataURL,\r\n                    dataSettings.dataTransformation,\r\n                    dataSettings.columnsToArray,\r\n                    debugMode,\r\n                    dataSettings.delimiter,\r\n                    true,\r\n                  )\r\n            : await fetchAndParseMultipleDataSources(\r\n                dataSettings.dataURL,\r\n                dataSettings.idColumnTitle,\r\n              )\r\n          : await transformColumnsToArray(dataSettings.data, dataSettings.columnsToArray);\r\n        setData(dataFromFile);\r\n      } catch (error) {\r\n        console.error('Data fetching error:', error);\r\n      }\r\n    };\r\n    fetchData();\r\n    updateFiltersEvent();\r\n  }, [dataSettings, debugMode]);\r\n\r\n  useEffect(() => {\r\n    updateFiltersEvent();\r\n  }, [filters, data]);\r\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n  const handleFilterChange = (filter: string, values: any) => {\r\n    setFilterSettings(prev => prev.map(f => (f.filter === filter ? { ...f, value: values } : f)));\r\n  };\r\n  return (\r\n    <GraphContainer\r\n      id={dashboardID}\r\n      aria-label='This is a dashboard'\r\n      backgroundColor={dashboardLayout.backgroundColor ?? false}\r\n      theme={theme || 'light'}\r\n      language={dashboardLayout.language || 'en'}\r\n      padding={dashboardLayout.padding}\r\n    >\r\n      {dashboardLayout.title || dashboardLayout.description ? (\r\n        <GraphHeader\r\n          graphTitle={dashboardLayout.title}\r\n          graphDescription={dashboardLayout.description}\r\n          isDashboard\r\n        />\r\n      ) : null}\r\n      <div className='flex gap-4 flex-wrap'>\r\n        {filterSettings.length !== 0 ? (\r\n          <div\r\n            className='flex-grow flex-shrink-0'\r\n            style={{\r\n              width: filterPosition === 'side' ? '280px' : '100%',\r\n            }}\r\n          >\r\n            <div className='flex flex-wrap items-start gap-4 w-full sticky top-4'>\r\n              {filterSettings?.map((d, i) => (\r\n                <div\r\n                  style={{\r\n                    width:\r\n                      d.width ||\r\n                      `calc(${100 / noOfFiltersPerRow}% - ${\r\n                        (noOfFiltersPerRow - 1) / noOfFiltersPerRow\r\n                      }rem)`,\r\n                    flexGrow: d.width ? 0 : 1,\r\n                    flexShrink: d.ui !== 'radio' || d.width ? 0 : 1,\r\n                    minWidth: '240px',\r\n                  }}\r\n                  key={i}\r\n                >\r\n                  <Label className='mb-2'>{d.label}</Label>\r\n                  {d.singleSelect ? (\r\n                    d.ui !== 'radio' ? (\r\n                      <DropdownSelect\r\n                        options={d.availableValues}\r\n                        variant={uiMode}\r\n                        isClearable={d.clearable === undefined ? true : d.clearable}\r\n                        isSearchable\r\n                        controlShouldRenderValue\r\n                        filterOption={createFilter(filterConfig)}\r\n                        onChange={el => {\r\n                          handleFilterChange(d.filter, el);\r\n                        }}\r\n                        value={d.value}\r\n                        defaultValue={d.defaultValue}\r\n                      />\r\n                    ) : (\r\n                      <RadioGroup\r\n                        variant={uiMode}\r\n                        defaultValue={(d.defaultValue as { value: string; label: string }).value}\r\n                        onValueChange={el => {\r\n                          handleFilterChange(\r\n                            d.filter,\r\n                            d.availableValues.filter(v => v.value === el),\r\n                          );\r\n                        }}\r\n                      >\r\n                        {d.availableValues.map((el, j) => (\r\n                          <RadioGroupItem label={`${el.label}`} value={`${el.value}`} key={j} />\r\n                        ))}\r\n                      </RadioGroup>\r\n                    )\r\n                  ) : (\r\n                    <>\r\n                      {d.ui !== 'radio' ? (\r\n                        <DropdownSelect\r\n                          options={d.availableValues}\r\n                          variant={uiMode}\r\n                          size='sm'\r\n                          isMulti\r\n                          isClearable={d.clearable === undefined ? true : d.clearable}\r\n                          isSearchable\r\n                          controlShouldRenderValue\r\n                          filterOption={createFilter(filterConfig)}\r\n                          onChange={el => {\r\n                            handleFilterChange(d.filter, el);\r\n                          }}\r\n                          value={d.value}\r\n                          defaultValue={d.defaultValue}\r\n                        />\r\n                      ) : (\r\n                        <CheckboxGroup\r\n                          variant={uiMode}\r\n                          defaultValue={\r\n                            d.defaultValue\r\n                              ? (\r\n                                  d.defaultValue as {\r\n                                    value: string | number;\r\n                                    label: string | number;\r\n                                  }[]\r\n                                ).map(el => `${el.value}`)\r\n                              : []\r\n                          }\r\n                          value={\r\n                            d.value\r\n                              ? (\r\n                                  d.value as {\r\n                                    value: string | number;\r\n                                    label: string | number;\r\n                                  }[]\r\n                                ).map(el => `${el.value}`)\r\n                              : undefined\r\n                          }\r\n                          onValueChange={el => {\r\n                            handleFilterChange(\r\n                              d.filter,\r\n                              d.availableValues.filter(v => el.indexOf(`${v.value}`) !== -1),\r\n                            );\r\n                          }}\r\n                        >\r\n                          {d.availableValues.map((el, j) => (\r\n                            <CheckboxGroupItem\r\n                              label={`${el.label}`}\r\n                              value={`${el.value}`}\r\n                              key={j}\r\n                            />\r\n                          ))}\r\n                        </CheckboxGroup>\r\n                      )}\r\n                      {d.allowSelectAll ? (\r\n                        <button\r\n                          type='button'\r\n                          className='bg-transparent border-0 p-0 mt-2 cursor-pointer text-primary-blue-600 dark:text-primary-blue-400'\r\n                          onClick={() => {\r\n                            handleFilterChange(d.filter, d.availableValues);\r\n                          }}\r\n                        >\r\n                          Select all options\r\n                        </button>\r\n                      ) : null}\r\n                    </>\r\n                  )}\r\n                </div>\r\n              ))}\r\n            </div>\r\n          </div>\r\n        ) : null}\r\n        <div\r\n          className='flex flex-wrap gap-4 flex-grow flex-shrink-0 min-w-[280px]'\r\n          style={{\r\n            width: filterPosition === 'side' ? 'calc(100% - 280px - 1rem)' : '100%',\r\n          }}\r\n        >\r\n          {dashboardLayout.rows.map((d, i) => (\r\n            <div\r\n              key={i}\r\n              className='flex flex-wrap items-stretch gap-4 w-full h-auto'\r\n              style={{\r\n                minHeight: `${d.height || 0}px`,\r\n              }}\r\n            >\r\n              {d.columns.map((el, j) => (\r\n                <div\r\n                  key={j}\r\n                  className='flex bg-transparent grow min-w-60'\r\n                  style={{\r\n                    width: `calc(${(100 * (el.columnWidth || 1)) / TotalWidth(d.columns)}% - ${\r\n                      (TotalWidth(d.columns) - (el.columnWidth || 1)) / TotalWidth(d.columns)\r\n                    }rem)`,\r\n                    minHeight: 'inherit',\r\n                  }}\r\n                >\r\n                  {threeDGraphs.includes(el.graphType) ? (\r\n                    <SingleGraphDashboardThreeDGraphs\r\n                      graphType={el.graphType as ThreeDGraphType}\r\n                      dataFilters={el.dataFilters}\r\n                      uiMode={uiMode}\r\n                      graphSettings={{\r\n                        ...(el.settings || {}),\r\n                        width: undefined,\r\n                        height: undefined,\r\n                        minHeight: undefined,\r\n                        relativeHeight: undefined,\r\n                        resetSelectionOnDoubleClick: el.attachedFilter\r\n                          ? false\r\n                          : el.settings?.resetSelectionOnDoubleClick,\r\n                        styles: el.settings?.styles || graphStyles,\r\n                        classNames: el.settings?.classNames || graphClassNames,\r\n                        radius: el.graphType === 'donutChart' ? undefined : el.settings?.radius,\r\n                        size: el.graphType === 'unitChart' ? el.settings?.size : undefined,\r\n                        language: el.settings?.language || dashboardLayout.language,\r\n                        theme: el.settings?.theme || theme,\r\n                      }}\r\n                      dataSettings={{\r\n                        data: filteredData\r\n                          ? filterData(filteredData, dataFilters || [])\r\n                          : undefined,\r\n                      }}\r\n                      dataTransform={el.dataTransform}\r\n                      dataSelectionOptions={el.dataSelectionOptions}\r\n                      advancedDataSelectionOptions={el.advancedDataSelectionOptions}\r\n                      graphDataConfiguration={el.graphDataConfiguration}\r\n                      debugMode={debugMode}\r\n                      readableHeader={readableHeader || []}\r\n                    />\r\n                  ) : geoHubMaps.includes(el.graphType) ? (\r\n                    <SingleGraphDashboardGeoHubMaps\r\n                      graphType={el.graphType as GeoHubGraphType}\r\n                      uiMode={uiMode}\r\n                      graphSettings={{\r\n                        ...(el.settings || {}),\r\n                        width: undefined,\r\n                        height: undefined,\r\n                        resetSelectionOnDoubleClick: el.attachedFilter\r\n                          ? false\r\n                          : el.settings?.resetSelectionOnDoubleClick,\r\n                        styles: el.settings?.styles || graphStyles,\r\n                        classNames: el.settings?.classNames || graphClassNames,\r\n                        radius: el.graphType === 'donutChart' ? undefined : el.settings?.radius,\r\n                        size: el.graphType === 'unitChart' ? el.settings?.size : undefined,\r\n                        language: el.settings?.language || dashboardLayout.language,\r\n                        theme: el.settings?.theme || theme,\r\n                      }}\r\n                      debugMode={debugMode}\r\n                    />\r\n                  ) : (\r\n                    <SingleGraphDashboard\r\n                      graphType={el.graphType as GraphType}\r\n                      dataFilters={el.dataFilters}\r\n                      uiMode={uiMode}\r\n                      graphSettings={{\r\n                        ...(el.settings || {}),\r\n                        width: undefined,\r\n                        height: undefined,\r\n                        resetSelectionOnDoubleClick: el.attachedFilter\r\n                          ? false\r\n                          : el.settings?.resetSelectionOnDoubleClick,\r\n                        styles: el.settings?.styles || graphStyles,\r\n                        classNames: el.settings?.classNames || graphClassNames,\r\n                        radius: el.graphType === 'donutChart' ? undefined : el.settings?.radius,\r\n                        size: el.graphType === 'unitChart' ? el.settings?.size : undefined,\r\n                        language: el.settings?.language || dashboardLayout.language,\r\n                        theme: el.settings?.theme || theme,\r\n                      }}\r\n                      dataSettings={{\r\n                        data: filteredData\r\n                          ? filterData(filteredData, dataFilters || [])\r\n                          : undefined,\r\n                      }}\r\n                      updateFilters={\r\n                        el.attachedFilter &&\r\n                        GraphWithAttachedFilter.indexOf(el.graphType as GraphType) !== -1 &&\r\n                        filterSettings.findIndex(f => f.filter === el.attachedFilter) !== -1\r\n                          ? dClicked => {\r\n                              const indx = filterSettings.findIndex(\r\n                                f => f.filter === el.attachedFilter,\r\n                              );\r\n                              const value = dClicked\r\n                                ? filterSettings[indx].singleSelect\r\n                                  ? { value: dClicked, label: dClicked }\r\n                                  : [{ value: dClicked, label: dClicked }]\r\n                                : undefined;\r\n                              handleFilterChange(el.attachedFilter as string, value);\r\n                            }\r\n                          : undefined\r\n                      }\r\n                      dataTransform={el.dataTransform}\r\n                      dataSelectionOptions={el.dataSelectionOptions}\r\n                      advancedDataSelectionOptions={el.advancedDataSelectionOptions}\r\n                      graphDataConfiguration={el.graphDataConfiguration}\r\n                      debugMode={debugMode}\r\n                      readableHeader={readableHeader || []}\r\n                    />\r\n                  )}\r\n                </div>\r\n              ))}\r\n            </div>\r\n          ))}\r\n        </div>\r\n      </div>\r\n    </GraphContainer>\r\n  );\r\n}\r\n"],"names":["TotalWidth","columns","map","d","columnWidth","reduce","acc","cur","GraphWithAttachedFilter","PerformanceIntensiveMultiGraphDashboard","props","dashboardID","dashboardLayout","dataSettings","filters","debugMode","theme","readableHeader","dataFilters","noOfFiltersPerRow","filterPosition","uiMode","graphStyles","graphClassNames","filteredData","setFilteredData","useState","undefined","data","setData","filterSettings","setFilterSettings","threeDGraphs","geoHubMaps","filterConfig","ignoreCase","ignoreAccents","trim","updateFiltersEvent","useEffectEvent","filterSettingsTemp","el","filter","column","label","singleSelect","clearable","defaultValue","transformDefaultValue","value","availableValues","getUniqValue","v","excludeValues","includes","allowSelectAll","width","filteredDataEvent","length","result","item","every","flattenDeep","intersection","useEffect","dataFromFile","dataURL","fileType","fetchAndParseJSON","columnsToArray","dataTransformation","fetchAndTransformDataFromAPI","apiHeaders","fetchAndParseCSV","delimiter","fetchAndParseMultipleDataSources","idColumnTitle","transformColumnsToArray","error","console","fetchData","handleFilterChange","values","prev","f","GraphContainer","backgroundColor","language","padding","title","description","jsx","GraphHeader","jsxs","i","flexGrow","flexShrink","ui","minWidth","Label","DropdownSelect","createFilter","RadioGroup","j","RadioGroupItem","Fragment","CheckboxGroup","indexOf","CheckboxGroupItem","rows","minHeight","height","graphType","SingleGraphDashboardThreeDGraphs","settings","relativeHeight","resetSelectionOnDoubleClick","attachedFilter","styles","classNames","radius","size","filterData","dataTransform","dataSelectionOptions","advancedDataSelectionOptions","graphDataConfiguration","SingleGraphDashboardGeoHubMaps","SingleGraphDashboard","findIndex","dClicked","indx"],"mappings":"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"}
+{"version":3,"file":"PerformanceIntensiveMultiGraphDashboard.cjs","names":[],"sources":["../src/Components/Dashboard/PerformanceIntensive/MultiGraphDashboard.tsx"],"sourcesContent":["import { CheckboxGroup, CheckboxGroupItem } from '@undp/design-system-react/CheckboxGroup';\nimport { createFilter, DropdownSelect } from '@undp/design-system-react/DropdownSelect';\nimport { Label } from '@undp/design-system-react/Label';\nimport { RadioGroup, RadioGroupItem } from '@undp/design-system-react/RadioGroup';\nimport flattenDeep from 'lodash.flattendeep';\nimport intersection from 'lodash.intersection';\nimport { useEffect, useEffectEvent, useState } from 'react';\nimport { GraphContainer } from '@/Components/Elements/GraphContainer';\nimport { GraphHeader } from '@/Components/Elements/GraphHeader';\nimport type {\n  ClassNameObject,\n  DataFilterDataType,\n  DataSettingsDataType,\n  FilterSettingsDataType,\n  FilterUiSettingsDataType,\n  GeoHubGraphType,\n  GraphType,\n  PerformanceIntensiveDashboardColumnDataType,\n  PerformanceIntensiveDashboardLayoutDataType,\n  StyleObject,\n  ThreeDGraphType,\n} from '@/Types';\nimport {\n  fetchAndParseCSV,\n  fetchAndParseJSON,\n  fetchAndParseMultipleDataSources,\n  fetchAndTransformDataFromAPI,\n} from '@/Utils/fetchAndParseData';\nimport { getUniqValue } from '@/Utils/getUniqValue';\nimport { filterData } from '@/Utils/transformData/filterData';\nimport { transformColumnsToArray } from '@/Utils/transformData/transformColumnsToArray';\nimport { transformDefaultValue } from '@/Utils/transformDataForSelect';\nimport { SingleGraphDashboard } from '../SingleGraphDashboard';\nimport { SingleGraphDashboardGeoHubMaps } from './SingleGraphDashboardGeoHubMaps';\nimport { SingleGraphDashboardThreeDGraphs } from './SingleGraphDashboardThreeDGraphs';\n\ninterface Props {\n  dashboardID?: string;\n  dashboardLayout: PerformanceIntensiveDashboardLayoutDataType;\n  dataSettings: DataSettingsDataType;\n  filters?: FilterUiSettingsDataType[];\n  noOfFiltersPerRow?: number;\n  dataFilters?: DataFilterDataType[];\n  debugMode?: boolean;\n  theme?: 'dark' | 'light';\n  filterPosition?: 'top' | 'side';\n  readableHeader?: {\n    value: string;\n    label: string;\n  }[];\n  uiMode?: 'light' | 'normal';\n  graphStyles?: StyleObject;\n  graphClassNames?: ClassNameObject;\n}\n\nconst TotalWidth = (columns: PerformanceIntensiveDashboardColumnDataType[]) => {\n  const columnWidth = columns.map((d) => d.columnWidth || 1);\n  const sum = columnWidth.reduce((acc, cur) => acc + cur, 0);\n  return sum;\n};\n\nconst GraphWithAttachedFilter: GraphType[] = [\n  'barChart',\n  'choroplethMap',\n  'biVariateChoroplethMap',\n  'circlePacking',\n  'treeMap',\n];\n\nexport function PerformanceIntensiveMultiGraphDashboard(props: Props) {\n  const {\n    dashboardID,\n    dashboardLayout,\n    dataSettings,\n    filters,\n    debugMode,\n    theme = 'light',\n    readableHeader,\n    dataFilters,\n    noOfFiltersPerRow = 4,\n    filterPosition,\n    uiMode = 'normal',\n    graphStyles,\n    graphClassNames,\n  } = props;\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  const [filteredData, setFilteredData] = useState<any>(undefined);\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  const [data, setData] = useState<any>(undefined);\n  const [filterSettings, setFilterSettings] = useState<FilterSettingsDataType[]>([]);\n\n  const threeDGraphs = ['threeDGlobe'];\n  const geoHubMaps = ['geoHubCompareMap', 'geoHubMap', 'geoHubMapWithLayerSelection'];\n  const filterConfig = {\n    ignoreCase: true,\n    ignoreAccents: true,\n    trim: true,\n  };\n\n  const updateFiltersEvent = useEffectEvent(() => {\n    const filterSettingsTemp = (filters || []).map((el) => ({\n      filter: el.column,\n      label: el.label || `Filter by ${el.column}`,\n      singleSelect: el.singleSelect,\n      clearable: el.clearable,\n      defaultValue: transformDefaultValue(el.defaultValue),\n      value: transformDefaultValue(el.defaultValue),\n      availableValues: getUniqValue(data, el.column)\n        .filter((v) => !el.excludeValues?.includes(`${v}`))\n        .map((v) => ({ value: v, label: v })),\n      allowSelectAll: el.allowSelectAll,\n      width: el.width,\n    }));\n    setFilterSettings(filterSettingsTemp);\n  });\n  const filteredDataEvent = useEffectEvent(() => {\n    if (!data || filterSettings.length === 0) setFilteredData(data);\n    else {\n      // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n      const result = data.filter((item: any) =>\n        filterSettings.every((filter) =>\n          filter.value && flattenDeep([filter.value]).length > 0\n            ? intersection(\n                flattenDeep([item[filter.filter]]),\n                flattenDeep([filter.value]).map((el) => el.value),\n              ).length > 0\n            : true,\n        ),\n      );\n      setFilteredData(result);\n    }\n  });\n  useEffect(() => {\n    filteredDataEvent();\n  }, [filterSettings, data]);\n\n  useEffect(() => {\n    const fetchData = async () => {\n      try {\n        const dataFromFile = dataSettings.dataURL\n          ? typeof dataSettings.dataURL === 'string'\n            ? dataSettings.fileType === 'json'\n              ? await fetchAndParseJSON(\n                  dataSettings.dataURL,\n                  dataSettings.columnsToArray,\n                  dataSettings.dataTransformation,\n                  debugMode,\n                )\n              : dataSettings.fileType === 'api'\n                ? await fetchAndTransformDataFromAPI(\n                    dataSettings.dataURL,\n                    dataSettings.apiHeaders,\n                    dataSettings.columnsToArray,\n                    dataSettings.dataTransformation,\n                    debugMode,\n                  )\n                : await fetchAndParseCSV(\n                    dataSettings.dataURL,\n                    dataSettings.dataTransformation,\n                    dataSettings.columnsToArray,\n                    debugMode,\n                    dataSettings.delimiter,\n                    true,\n                  )\n            : await fetchAndParseMultipleDataSources(\n                dataSettings.dataURL,\n                dataSettings.idColumnTitle,\n              )\n          : await transformColumnsToArray(dataSettings.data, dataSettings.columnsToArray);\n        setData(dataFromFile);\n      } catch (error) {\n        console.error('Data fetching error:', error);\n      }\n    };\n    fetchData();\n    updateFiltersEvent();\n  }, [dataSettings, debugMode]);\n\n  useEffect(() => {\n    updateFiltersEvent();\n  }, [filters, data]);\n  // biome-ignore lint/suspicious/noExplicitAny: undefined data type\n  const handleFilterChange = (filter: string, values: any) => {\n    setFilterSettings((prev) =>\n      prev.map((f) => (f.filter === filter ? { ...f, value: values } : f)),\n    );\n  };\n  return (\n    <GraphContainer\n      id={dashboardID}\n      aria-label='This is a dashboard'\n      backgroundColor={dashboardLayout.backgroundColor ?? false}\n      theme={theme || 'light'}\n      language={dashboardLayout.language || 'en'}\n      padding={dashboardLayout.padding}\n    >\n      {dashboardLayout.title || dashboardLayout.description ? (\n        <GraphHeader\n          graphTitle={dashboardLayout.title}\n          graphDescription={dashboardLayout.description}\n          isDashboard\n        />\n      ) : null}\n      <div className='flex gap-4 flex-wrap'>\n        {filterSettings.length !== 0 ? (\n          <div\n            className='flex-grow flex-shrink-0'\n            style={{\n              width: filterPosition === 'side' ? '280px' : '100%',\n            }}\n          >\n            <div className='flex flex-wrap items-start gap-4 w-full sticky top-4'>\n              {filterSettings?.map((d, i) => (\n                <div\n                  style={{\n                    width:\n                      d.width ||\n                      `calc(${100 / noOfFiltersPerRow}% - ${\n                        (noOfFiltersPerRow - 1) / noOfFiltersPerRow\n                      }rem)`,\n                    flexGrow: d.width ? 0 : 1,\n                    flexShrink: d.ui !== 'radio' || d.width ? 0 : 1,\n                    minWidth: '240px',\n                  }}\n                  // biome-ignore lint/suspicious/noArrayIndexKey: index is the unique identifier\n                  key={i}\n                >\n                  <Label className='mb-2'>{d.label}</Label>\n                  {d.singleSelect ? (\n                    d.ui !== 'radio' ? (\n                      <DropdownSelect\n                        options={d.availableValues}\n                        variant={uiMode}\n                        isClearable={d.clearable === undefined ? true : d.clearable}\n                        isSearchable\n                        controlShouldRenderValue\n                        filterOption={createFilter(filterConfig)}\n                        onChange={(el) => {\n                          handleFilterChange(d.filter, el);\n                        }}\n                        value={d.value}\n                        defaultValue={d.defaultValue}\n                      />\n                    ) : (\n                      <RadioGroup\n                        variant={uiMode}\n                        defaultValue={(d.defaultValue as { value: string; label: string }).value}\n                        onValueChange={(el) => {\n                          handleFilterChange(\n                            d.filter,\n                            d.availableValues.filter((v) => v.value === el),\n                          );\n                        }}\n                      >\n                        {d.availableValues.map((el) => (\n                          <RadioGroupItem\n                            label={`${el.label}`}\n                            value={`${el.value}`}\n                            key={el.value}\n                          />\n                        ))}\n                      </RadioGroup>\n                    )\n                  ) : (\n                    <>\n                      {d.ui !== 'radio' ? (\n                        <DropdownSelect\n                          options={d.availableValues}\n                          variant={uiMode}\n                          size='sm'\n                          isMulti\n                          isClearable={d.clearable === undefined ? true : d.clearable}\n                          isSearchable\n                          controlShouldRenderValue\n                          filterOption={createFilter(filterConfig)}\n                          onChange={(el) => {\n                            handleFilterChange(d.filter, el);\n                          }}\n                          value={d.value}\n                          defaultValue={d.defaultValue}\n                        />\n                      ) : (\n                        <CheckboxGroup\n                          variant={uiMode}\n                          defaultValue={\n                            d.defaultValue\n                              ? (\n                                  d.defaultValue as {\n                                    value: string | number;\n                                    label: string | number;\n                                  }[]\n                                ).map((el) => `${el.value}`)\n                              : []\n                          }\n                          value={\n                            d.value\n                              ? (\n                                  d.value as {\n                                    value: string | number;\n                                    label: string | number;\n                                  }[]\n                                ).map((el) => `${el.value}`)\n                              : undefined\n                          }\n                          onValueChange={(el) => {\n                            handleFilterChange(\n                              d.filter,\n                              d.availableValues.filter((v) => el.indexOf(`${v.value}`) !== -1),\n                            );\n                          }}\n                        >\n                          {d.availableValues.map((el) => (\n                            <CheckboxGroupItem\n                              label={`${el.label}`}\n                              value={`${el.value}`}\n                              key={el.value}\n                            />\n                          ))}\n                        </CheckboxGroup>\n                      )}\n                      {d.allowSelectAll ? (\n                        <button\n                          type='button'\n                          className='bg-transparent border-0 p-0 mt-2 cursor-pointer text-primary-blue-600 dark:text-primary-blue-400'\n                          onClick={() => {\n                            handleFilterChange(d.filter, d.availableValues);\n                          }}\n                        >\n                          Select all options\n                        </button>\n                      ) : null}\n                    </>\n                  )}\n                </div>\n              ))}\n            </div>\n          </div>\n        ) : null}\n        <div\n          className='flex flex-wrap gap-4 flex-grow flex-shrink-0 min-w-[280px]'\n          style={{\n            width: filterPosition === 'side' ? 'calc(100% - 280px - 1rem)' : '100%',\n          }}\n        >\n          {dashboardLayout.rows.map((d, i) => (\n            <div\n              // biome-ignore lint/suspicious/noArrayIndexKey: index is the unique identifier\n              key={i}\n              className='flex flex-wrap items-stretch gap-4 w-full h-auto'\n              style={{\n                minHeight: `${d.height || 0}px`,\n              }}\n            >\n              {d.columns.map((el, j) => (\n                <div\n                  // biome-ignore lint/suspicious/noArrayIndexKey: index is the unique identifier\n                  key={j}\n                  className='flex bg-transparent grow min-w-60'\n                  style={{\n                    width: `calc(${(100 * (el.columnWidth || 1)) / TotalWidth(d.columns)}% - ${\n                      (TotalWidth(d.columns) - (el.columnWidth || 1)) / TotalWidth(d.columns)\n                    }rem)`,\n                    minHeight: 'inherit',\n                  }}\n                >\n                  {threeDGraphs.includes(el.graphType) ? (\n                    <SingleGraphDashboardThreeDGraphs\n                      graphType={el.graphType as ThreeDGraphType}\n                      dataFilters={el.dataFilters}\n                      uiMode={uiMode}\n                      graphSettings={{\n                        ...(el.settings || {}),\n                        width: undefined,\n                        height: undefined,\n                        minHeight: undefined,\n                        relativeHeight: undefined,\n                        resetSelectionOnDoubleClick: el.attachedFilter\n                          ? false\n                          : el.settings?.resetSelectionOnDoubleClick,\n                        styles: el.settings?.styles || graphStyles,\n                        classNames: el.settings?.classNames || graphClassNames,\n                        radius: el.graphType === 'donutChart' ? undefined : el.settings?.radius,\n                        size: el.graphType === 'unitChart' ? el.settings?.size : undefined,\n                        language: el.settings?.language || dashboardLayout.language,\n                        theme: el.settings?.theme || theme,\n                      }}\n                      dataSettings={{\n                        data: filteredData\n                          ? filterData(filteredData, dataFilters || [])\n                          : undefined,\n                      }}\n                      dataTransform={el.dataTransform}\n                      dataSelectionOptions={el.dataSelectionOptions}\n                      advancedDataSelectionOptions={el.advancedDataSelectionOptions}\n                      graphDataConfiguration={el.graphDataConfiguration}\n                      debugMode={debugMode}\n                      readableHeader={readableHeader || []}\n                    />\n                  ) : geoHubMaps.includes(el.graphType) ? (\n                    <SingleGraphDashboardGeoHubMaps\n                      graphType={el.graphType as GeoHubGraphType}\n                      uiMode={uiMode}\n                      graphSettings={{\n                        ...(el.settings || {}),\n                        width: undefined,\n                        height: undefined,\n                        resetSelectionOnDoubleClick: el.attachedFilter\n                          ? false\n                          : el.settings?.resetSelectionOnDoubleClick,\n                        styles: el.settings?.styles || graphStyles,\n                        classNames: el.settings?.classNames || graphClassNames,\n                        radius: el.graphType === 'donutChart' ? undefined : el.settings?.radius,\n                        size: el.graphType === 'unitChart' ? el.settings?.size : undefined,\n                        language: el.settings?.language || dashboardLayout.language,\n                        theme: el.settings?.theme || theme,\n                      }}\n                      debugMode={debugMode}\n                    />\n                  ) : (\n                    <SingleGraphDashboard\n                      graphType={el.graphType as GraphType}\n                      dataFilters={el.dataFilters}\n                      uiMode={uiMode}\n                      graphSettings={{\n                        ...(el.settings || {}),\n                        width: undefined,\n                        height: undefined,\n                        resetSelectionOnDoubleClick: el.attachedFilter\n                          ? false\n                          : el.settings?.resetSelectionOnDoubleClick,\n                        styles: el.settings?.styles || graphStyles,\n                        classNames: el.settings?.classNames || graphClassNames,\n                        radius: el.graphType === 'donutChart' ? undefined : el.settings?.radius,\n                        size: el.graphType === 'unitChart' ? el.settings?.size : undefined,\n                        language: el.settings?.language || dashboardLayout.language,\n                        theme: el.settings?.theme || theme,\n                      }}\n                      dataSettings={{\n                        data: filteredData\n                          ? filterData(filteredData, dataFilters || [])\n                          : undefined,\n                      }}\n                      updateFilters={\n                        el.attachedFilter &&\n                        GraphWithAttachedFilter.indexOf(el.graphType as GraphType) !== -1 &&\n                        filterSettings.findIndex((f) => f.filter === el.attachedFilter) !== -1\n                          ? (dClicked) => {\n                              const indx = filterSettings.findIndex(\n                                (f) => f.filter === el.attachedFilter,\n                              );\n                              const value = dClicked\n                                ? filterSettings[indx].singleSelect\n                                  ? { value: dClicked, label: dClicked }\n                                  : [{ value: dClicked, label: dClicked }]\n                                : undefined;\n                              handleFilterChange(el.attachedFilter as string, value);\n                            }\n                          : undefined\n                      }\n                      dataTransform={el.dataTransform}\n                      dataSelectionOptions={el.dataSelectionOptions}\n                      advancedDataSelectionOptions={el.advancedDataSelectionOptions}\n                      graphDataConfiguration={el.graphDataConfiguration}\n                      debugMode={debugMode}\n                      readableHeader={readableHeader || []}\n                    />\n                  )}\n                </div>\n              ))}\n            </div>\n          ))}\n        </div>\n      </div>\n    </GraphContainer>\n  );\n}\n"],"mappings":"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"}