[frontend] use new loader in widget (#8288)

OpenCTI-Platform · Oct 17, 2024 · 671a784 · 671a784
1 parent 280e5d9
commit 671a784
Show file tree

Hide file tree

Showing 71 changed files with 170 additions and 190 deletions.
diff --git a/opencti-platform/opencti-front/src/components/dashboard/WidgetLoader.tsx b/opencti-platform/opencti-front/src/components/dashboard/WidgetLoader.tsx
diff --git a/opencti-platform/opencti-front/src/private/components/Dashboard.jsx b/opencti-platform/opencti-front/src/private/components/Dashboard.jsx
@@ -28,7 +28,6 @@ import StixRelationshipsHorizontalBars from './common/stix_relationships/StixRel
 import DashboardView from './workspaces/dashboards/Dashboard';
 import useQueryLoading from '../../utils/hooks/useQueryLoading';
 import useConnectedDocumentModifier from '../../utils/hooks/useConnectedDocumentModifier';
-import WidgetLoader from '../../components/dashboard/WidgetLoader';
 
 // region styles
 // Deprecated - https://mui.com/system/styles/basics/
@@ -163,7 +162,7 @@ const TargetedCountries = ({ timeField }) => {
   return (
     <>
       {queryRef && (
-        <React.Suspense fallback={<WidgetLoader />}>
+        <React.Suspense fallback={<Loader variant={LoaderVariant.inElement} />}>
           <TargetedCountriesComponent queryRef={queryRef} />
         </React.Suspense>
       )}

diff --git a/...ti-platform/opencti-front/src/private/components/common/audits/AuditsDistributionList.jsx b/...ti-platform/opencti-front/src/private/components/common/audits/AuditsDistributionList.jsx
@@ -22,8 +22,8 @@ import useGranted, { SETTINGS_SETACCESSES } from '../../../../utils/hooks/useGra
 import useEnterpriseEdition from '../../../../utils/hooks/useEnterpriseEdition';
 import WidgetContainer from '../../../../components/dashboard/WidgetContainer';
 import WidgetNoData from '../../../../components/dashboard/WidgetNoData';
-import WidgetLoader from '../../../../components/dashboard/WidgetLoader';
 import WidgetDistributionList from '../../../../components/dashboard/WidgetDistributionList';
+import Loader, { LoaderVariant } from '../../../../components/Loader';
 
 const auditsDistributionListDistributionQuery = graphql`
   query AuditsDistributionListDistributionQuery(
@@ -161,7 +161,7 @@ const AuditsDistributionList = ({
           if (props) {
             return <WidgetNoData />;
           }
-          return <WidgetLoader />;
+          return <Loader variant={LoaderVariant.inElement} />;
         }}
       />
     );

diff --git a/opencti-platform/opencti-front/src/private/components/common/audits/AuditsDonut.jsx b/opencti-platform/opencti-front/src/private/components/common/audits/AuditsDonut.jsx
@@ -22,8 +22,8 @@ import useGranted, { SETTINGS_SECURITYACTIVITY, SETTINGS_SETACCESSES, VIRTUAL_OR
 import useEnterpriseEdition from '../../../../utils/hooks/useEnterpriseEdition';
 import WidgetContainer from '../../../../components/dashboard/WidgetContainer';
 import WidgetNoData from '../../../../components/dashboard/WidgetNoData';
-import WidgetLoader from '../../../../components/dashboard/WidgetLoader';
 import WidgetDonut from '../../../../components/dashboard/WidgetDonut';
+import Loader, { LoaderVariant } from '../../../../components/Loader';
 
 const auditsDonutDistributionQuery = graphql`
   query AuditsDonutDistributionQuery(
@@ -147,7 +147,7 @@ const AuditsDonut = ({
           if (props) {
             return <WidgetNoData />;
           }
-          return <WidgetLoader />;
+          return <Loader variant={LoaderVariant.inElement} />;
         }}
       />
     );

diff --git a/opencti-platform/opencti-front/src/private/components/common/audits/AuditsList.jsx b/opencti-platform/opencti-front/src/private/components/common/audits/AuditsList.jsx
@@ -33,7 +33,7 @@ import useEnterpriseEdition from '../../../../utils/hooks/useEnterpriseEdition';
 import { buildFiltersAndOptionsForWidgets } from '../../../../utils/filters/filtersUtils';
 import WidgetContainer from '../../../../components/dashboard/WidgetContainer';
 import WidgetNoData from '../../../../components/dashboard/WidgetNoData';
-import WidgetLoader from '../../../../components/dashboard/WidgetLoader';
+import Loader, { LoaderVariant } from '../../../../components/Loader';
 
 // Deprecated - https://mui.com/system/styles/basics/
 // Do not use it for new code.
@@ -259,7 +259,7 @@ const AuditsList = ({
           if (props) {
             return <WidgetNoData />;
           }
-          return <WidgetLoader />;
+          return <Loader variant={LoaderVariant.inElement} />;
         }}
       />
     );

diff --git a/opencti-platform/opencti-front/src/private/components/common/audits/AuditsMultiAreaChart.jsx b/opencti-platform/opencti-front/src/private/components/common/audits/AuditsMultiAreaChart.jsx
@@ -23,8 +23,8 @@ import useEnterpriseEdition from '../../../../utils/hooks/useEnterpriseEdition';
 import { removeEntityTypeAllFromFilterGroup } from '../../../../utils/filters/filtersUtils';
 import WidgetContainer from '../../../../components/dashboard/WidgetContainer';
 import WidgetNoData from '../../../../components/dashboard/WidgetNoData';
-import WidgetLoader from '../../../../components/dashboard/WidgetLoader';
 import WidgetMultiAreas from '../../../../components/dashboard/WidgetMultiAreas';
+import Loader, { LoaderVariant } from '../../../../components/Loader';
 
 const auditsMultiAreaChartTimeSeriesQuery = graphql`
   query AuditsMultiAreaChartTimeSeriesQuery(
@@ -125,7 +125,7 @@ const AuditsMultiAreaChart = ({
           if (props) {
             return <WidgetNoData />;
           }
-          return <WidgetLoader />;
+          return <Loader variant={LoaderVariant.inElement} />;
         }}
       />
     );

diff --git a/opencti-platform/opencti-front/src/private/components/common/audits/AuditsMultiHeatMap.jsx b/opencti-platform/opencti-front/src/private/components/common/audits/AuditsMultiHeatMap.jsx
@@ -23,8 +23,8 @@ import useEnterpriseEdition from '../../../../utils/hooks/useEnterpriseEdition';
 import { removeEntityTypeAllFromFilterGroup } from '../../../../utils/filters/filtersUtils';
 import WidgetContainer from '../../../../components/dashboard/WidgetContainer';
 import WidgetNoData from '../../../../components/dashboard/WidgetNoData';
-import WidgetLoader from '../../../../components/dashboard/WidgetLoader';
 import WidgetMultiHeatMap from '../../../../components/dashboard/WidgetMultiHeatMap';
+import Loader, { LoaderVariant } from '../../../../components/Loader';
 
 const auditsMultiHeatMapTimeSeriesQuery = graphql`
   query AuditsMultiHeatMapTimeSeriesQuery(
@@ -133,7 +133,7 @@ const AuditsMultiHeatMap = ({
           if (props) {
             return <WidgetNoData />;
           }
-          return <WidgetLoader />;
+          return <Loader variant={LoaderVariant.inElement} />;
         }}
       />
     );

diff --git a/opencti-platform/opencti-front/src/private/components/common/audits/AuditsMultiLineChart.jsx b/opencti-platform/opencti-front/src/private/components/common/audits/AuditsMultiLineChart.jsx
@@ -23,8 +23,8 @@ import useEnterpriseEdition from '../../../../utils/hooks/useEnterpriseEdition';
 import { removeEntityTypeAllFromFilterGroup } from '../../../../utils/filters/filtersUtils';
 import WidgetContainer from '../../../../components/dashboard/WidgetContainer';
 import WidgetNoData from '../../../../components/dashboard/WidgetNoData';
-import WidgetLoader from '../../../../components/dashboard/WidgetLoader';
 import WidgetMultiLines from '../../../../components/dashboard/WidgetMultiLines';
+import Loader, { LoaderVariant } from '../../../../components/Loader';
 
 const auditsMultiLineChartTimeSeriesQuery = graphql`
   query AuditsMultiLineChartTimeSeriesQuery(
@@ -124,7 +124,7 @@ const AuditsMultiLineChart = ({
           if (props) {
             return <WidgetNoData />;
           }
-          return <WidgetLoader />;
+          return <Loader variant={LoaderVariant.inElement} />;
         }}
       />
     );

diff --git a/...i-platform/opencti-front/src/private/components/common/audits/AuditsMultiVerticalBars.jsx b/...i-platform/opencti-front/src/private/components/common/audits/AuditsMultiVerticalBars.jsx
@@ -23,8 +23,8 @@ import useEnterpriseEdition from '../../../../utils/hooks/useEnterpriseEdition';
 import { removeEntityTypeAllFromFilterGroup } from '../../../../utils/filters/filtersUtils';
 import WidgetContainer from '../../../../components/dashboard/WidgetContainer';
 import WidgetNoData from '../../../../components/dashboard/WidgetNoData';
-import WidgetLoader from '../../../../components/dashboard/WidgetLoader';
 import WidgetVerticalBars from '../../../../components/dashboard/WidgetVerticalBars';
+import Loader, { LoaderVariant } from '../../../../components/Loader';
 
 const auditsMultiVerticalBarsTimeSeriesQuery = graphql`
   query AuditsMultiVerticalBarsTimeSeriesQuery(
@@ -125,7 +125,7 @@ const AuditsMultiVerticalBars = ({
           if (props) {
             return <WidgetNoData />;
           }
-          return <WidgetLoader />;
+          return <Loader variant={LoaderVariant.inElement} />;
         }}
       />
     );

diff --git a/opencti-platform/opencti-front/src/private/components/common/audits/AuditsNumber.jsx b/opencti-platform/opencti-front/src/private/components/common/audits/AuditsNumber.jsx
@@ -23,9 +23,9 @@ import useEnterpriseEdition from '../../../../utils/hooks/useEnterpriseEdition';
 import { buildFiltersAndOptionsForWidgets } from '../../../../utils/filters/filtersUtils';
 import WidgetContainer from '../../../../components/dashboard/WidgetContainer';
 import WidgetNoData from '../../../../components/dashboard/WidgetNoData';
-import WidgetLoader from '../../../../components/dashboard/WidgetLoader';
 import WidgetNumber from '../../../../components/dashboard/WidgetNumber';
 import WidgetAccessDenied from '../../../../components/dashboard/WidgetAccessDenied';
+import Loader, { LoaderVariant } from '../../../../components/Loader';
 
 const auditsNumberNumberQuery = graphql`
   query AuditsNumberNumberSeriesQuery(
@@ -83,7 +83,7 @@ const AuditsNumber = ({
           if (props) {
             return <WidgetNoData />;
           }
-          return <WidgetLoader />;
+          return <Loader variant={LoaderVariant.inElement} />;
         }}
       />
     );

diff --git a/opencti-platform/opencti-front/src/private/components/common/audits/AuditsPolarArea.tsx b/opencti-platform/opencti-front/src/private/components/common/audits/AuditsPolarArea.tsx
@@ -18,14 +18,14 @@ import React, { CSSProperties } from 'react';
 import { AuditsPolarAreaDistributionQuery } from '@components/common/audits/__generated__/AuditsPolarAreaDistributionQuery.graphql';
 import { useFormatter } from '../../../../components/i18n';
 import WidgetContainer from '../../../../components/dashboard/WidgetContainer';
-import WidgetLoader from '../../../../components/dashboard/WidgetLoader';
 import useQueryLoading from '../../../../utils/hooks/useQueryLoading';
 import WidgetPolarArea from '../../../../components/dashboard/WidgetPolarArea';
 import WidgetNoData from '../../../../components/dashboard/WidgetNoData';
 import useGranted, { SETTINGS_SECURITYACTIVITY, SETTINGS_SETACCESSES, VIRTUAL_ORGANIZATION_ADMIN } from '../../../../utils/hooks/useGranted';
 import useEnterpriseEdition from '../../../../utils/hooks/useEnterpriseEdition';
 import WidgetAccessDenied from '../../../../components/dashboard/WidgetAccessDenied';
 import { DashboardWidgetDataSelection, DashboardWidgetParameters } from '../../../../utils/dashboard';
+import Loader, { LoaderVariant } from '../../../../components/Loader';
 
 const auditsPolarAreaDistributionQuery = graphql`
   query AuditsPolarAreaDistributionQuery(
@@ -165,7 +165,7 @@ const AuditsPolarAreaQueyRef = ({
       variant={variant}
     >
       {queryRef ? (
-        <React.Suspense fallback={<WidgetLoader />}>
+        <React.Suspense fallback={<Loader variant={LoaderVariant.inElement} />}>
           <AuditsPolarAreaComponent
             queryRef={queryRef}
             dataSelection={dataSelection}
@@ -174,7 +174,7 @@ const AuditsPolarAreaQueyRef = ({
           />
         </React.Suspense>
       ) : (
-        <WidgetLoader />
+        <Loader variant={LoaderVariant.inElement} />
       )}
     </WidgetContainer>
   );

diff --git a/opencti-platform/opencti-front/src/private/components/common/audits/AuditsRadar.jsx b/opencti-platform/opencti-front/src/private/components/common/audits/AuditsRadar.jsx
@@ -21,8 +21,8 @@ import useGranted, { SETTINGS_SECURITYACTIVITY, SETTINGS_SETACCESSES, VIRTUAL_OR
 import useEnterpriseEdition from '../../../../utils/hooks/useEnterpriseEdition';
 import WidgetContainer from '../../../../components/dashboard/WidgetContainer';
 import WidgetNoData from '../../../../components/dashboard/WidgetNoData';
-import WidgetLoader from '../../../../components/dashboard/WidgetLoader';
 import WidgetRadar from '../../../../components/dashboard/WidgetRadar';
+import Loader, { LoaderVariant } from '../../../../components/Loader';
 
 const auditsRadarDistributionQuery = graphql`
   query AuditsRadarDistributionQuery(
@@ -155,7 +155,7 @@ const AuditsRadar = ({
           if (props) {
             return <WidgetNoData />;
           }
-          return <WidgetLoader />;
+          return <Loader variant={LoaderVariant.inElement} />;
         }}
       />
     );

diff --git a/opencti-platform/opencti-front/src/private/components/common/audits/AuditsTreeMap.jsx b/opencti-platform/opencti-front/src/private/components/common/audits/AuditsTreeMap.jsx
@@ -21,8 +21,8 @@ import useGranted, { SETTINGS_SECURITYACTIVITY, SETTINGS_SETACCESSES, VIRTUAL_OR
 import useEnterpriseEdition from '../../../../utils/hooks/useEnterpriseEdition';
 import WidgetContainer from '../../../../components/dashboard/WidgetContainer';
 import WidgetNoData from '../../../../components/dashboard/WidgetNoData';
-import WidgetLoader from '../../../../components/dashboard/WidgetLoader';
 import WidgetTree from '../../../../components/dashboard/WidgetTree';
+import Loader, { LoaderVariant } from '../../../../components/Loader';
 
 const auditsTreeMapDistributionQuery = graphql`
   query AuditsTreeMapDistributionQuery(
@@ -169,7 +169,7 @@ const AuditsTreeMap = ({
           if (props) {
             return <WidgetNoData />;
           }
-          return <WidgetLoader />;
+          return <Loader variant={LoaderVariant.inElement} />;
         }}
       />
     );

diff --git a/...front/src/private/components/common/stix_core_objects/StixCoreObjectsDistributionList.jsx b/...front/src/private/components/common/stix_core_objects/StixCoreObjectsDistributionList.jsx
@@ -6,9 +6,9 @@ import useGranted, { SETTINGS_SETACCESSES } from '../../../../utils/hooks/useGra
 import { buildFiltersAndOptionsForWidgets } from '../../../../utils/filters/filtersUtils';
 import WidgetContainer from '../../../../components/dashboard/WidgetContainer';
 import WidgetNoData from '../../../../components/dashboard/WidgetNoData';
-import WidgetLoader from '../../../../components/dashboard/WidgetLoader';
 import WidgetDistributionList from '../../../../components/dashboard/WidgetDistributionList';
 import { getMainRepresentative, isFieldForIdentifier } from '../../../../utils/defaultRepresentatives';
+import Loader, { LoaderVariant } from '../../../../components/Loader';
 
 const stixCoreObjectsDistributionListDistributionQuery = graphql`
   query StixCoreObjectsDistributionListDistributionQuery(
@@ -141,7 +141,7 @@ const StixCoreObjectsDistributionList = ({
           if (props) {
             return <WidgetNoData />;
           }
-          return <WidgetLoader />;
+          return <Loader variant={LoaderVariant.inElement} />;
         }}
       />
     );

diff --git a/...rm/opencti-front/src/private/components/common/stix_core_objects/StixCoreObjectsDonut.jsx b/...rm/opencti-front/src/private/components/common/stix_core_objects/StixCoreObjectsDonut.jsx
@@ -4,9 +4,9 @@ import * as PropTypes from 'prop-types';
 import { QueryRenderer } from '../../../../relay/environment';
 import { useFormatter } from '../../../../components/i18n';
 import WidgetNoData from '../../../../components/dashboard/WidgetNoData';
-import WidgetLoader from '../../../../components/dashboard/WidgetLoader';
 import WidgetContainer from '../../../../components/dashboard/WidgetContainer';
 import WidgetDonut from '../../../../components/dashboard/WidgetDonut';
+import Loader, { LoaderVariant } from '../../../../components/Loader';
 
 const stixCoreObjectsDonutDistributionQuery = graphql`
   query StixCoreObjectsDonutDistributionQuery(
@@ -136,7 +136,7 @@ const StixCoreObjectsDonut = ({
           if (props) {
             return <WidgetNoData />;
           }
-          return <WidgetLoader />;
+          return <Loader variant={LoaderVariant.inElement} />;
         }}
       />
     );

diff --git a/...i-front/src/private/components/common/stix_core_objects/StixCoreObjectsHorizontalBars.jsx b/...i-front/src/private/components/common/stix_core_objects/StixCoreObjectsHorizontalBars.jsx
@@ -5,9 +5,9 @@ import { useFormatter } from '../../../../components/i18n';
 import { buildFiltersAndOptionsForWidgets } from '../../../../utils/filters/filtersUtils';
 import WidgetContainer from '../../../../components/dashboard/WidgetContainer';
 import WidgetNoData from '../../../../components/dashboard/WidgetNoData';
-import WidgetLoader from '../../../../components/dashboard/WidgetLoader';
 import WidgetHorizontalBars from '../../../../components/dashboard/WidgetHorizontalBars';
 import useDistributionGraphData from '../../../../utils/hooks/useDistributionGraphData';
+import Loader, { LoaderVariant } from '../../../../components/Loader';
 
 const stixCoreObjectsHorizontalBarsDistributionQuery = graphql`
     query StixCoreObjectsHorizontalBarsDistributionQuery(
@@ -144,7 +144,7 @@ const StixCoreObjectsHorizontalBars = ({
           if (props) {
             return <WidgetNoData />;
           }
-          return <WidgetLoader />;
+          return <Loader variant={LoaderVariant.inElement} />;
         }}
       />
     );

diff --git a/...orm/opencti-front/src/private/components/common/stix_core_objects/StixCoreObjectsList.jsx b/...orm/opencti-front/src/private/components/common/stix_core_objects/StixCoreObjectsList.jsx
@@ -5,8 +5,8 @@ import { QueryRenderer } from '../../../../relay/environment';
 import { buildFiltersAndOptionsForWidgets } from '../../../../utils/filters/filtersUtils';
 import WidgetContainer from '../../../../components/dashboard/WidgetContainer';
 import WidgetNoData from '../../../../components/dashboard/WidgetNoData';
-import WidgetLoader from '../../../../components/dashboard/WidgetLoader';
 import WidgetListCoreObjects from '../../../../components/dashboard/WidgetListCoreObjects';
+import Loader, { LoaderVariant } from '../../../../components/Loader';
 
 const stixCoreObjectsListQuery = graphql`
   query StixCoreObjectsListQuery(
@@ -258,7 +258,7 @@ const StixCoreObjectsList = ({
           if (props) {
             return <WidgetNoData />;
           }
-          return <WidgetLoader />;
+          return <Loader variant={LoaderVariant.inElement} />;
         }}
       />
     </WidgetContainer>

diff --git a/...i-front/src/private/components/common/stix_core_objects/StixCoreObjectsMultiAreaChart.jsx b/...i-front/src/private/components/common/stix_core_objects/StixCoreObjectsMultiAreaChart.jsx
@@ -6,8 +6,8 @@ import { monthsAgo, now } from '../../../../utils/Time';
 import { buildFiltersAndOptionsForWidgets } from '../../../../utils/filters/filtersUtils';
 import WidgetContainer from '../../../../components/dashboard/WidgetContainer';
 import WidgetNoData from '../../../../components/dashboard/WidgetNoData';
-import WidgetLoader from '../../../../components/dashboard/WidgetLoader';
 import WidgetMultiAreas from '../../../../components/dashboard/WidgetMultiAreas';
+import Loader, { LoaderVariant } from '../../../../components/Loader';
 
 const stixCoreObjectsMultiAreaChartTimeSeriesQuery = graphql`
   query StixCoreObjectsMultiAreaChartTimeSeriesQuery(
@@ -88,7 +88,7 @@ const StixCoreObjectsMultiAreaChart = ({
           if (props) {
             return <WidgetNoData />;
           }
-          return <WidgetLoader />;
+          return <Loader variant={LoaderVariant.inElement} />;
         }}
       />
     );

diff --git a/...cti-front/src/private/components/common/stix_core_objects/StixCoreObjectsMultiHeatMap.jsx b/...cti-front/src/private/components/common/stix_core_objects/StixCoreObjectsMultiHeatMap.jsx
@@ -5,9 +5,9 @@ import { useFormatter } from '../../../../components/i18n';
 import { monthsAgo, now } from '../../../../utils/Time';
 import { removeEntityTypeAllFromFilterGroup } from '../../../../utils/filters/filtersUtils';
 import WidgetNoData from '../../../../components/dashboard/WidgetNoData';
-import WidgetLoader from '../../../../components/dashboard/WidgetLoader';
 import WidgetContainer from '../../../../components/dashboard/WidgetContainer';
 import WidgetMultiHeatMap from '../../../../components/dashboard/WidgetMultiHeatMap';
+import Loader, { LoaderVariant } from '../../../../components/Loader';
 
 const stixCoreObjectsMultiHeatMapTimeSeriesQuery = graphql`
   query StixCoreObjectsMultiHeatMapTimeSeriesQuery(
@@ -94,7 +94,7 @@ const StixCoreObjectsMultiHeatMap = ({
           if (props) {
             return <WidgetNoData />;
           }
-          return <WidgetLoader />;
+          return <Loader variant={LoaderVariant.inElement} />;
         }}
       />
     );

diff --git a/...i-front/src/private/components/common/stix_core_objects/StixCoreObjectsMultiLineChart.jsx b/...i-front/src/private/components/common/stix_core_objects/StixCoreObjectsMultiLineChart.jsx
@@ -6,8 +6,8 @@ import { monthsAgo, now } from '../../../../utils/Time';
 import { buildFiltersAndOptionsForWidgets } from '../../../../utils/filters/filtersUtils';
 import WidgetContainer from '../../../../components/dashboard/WidgetContainer';
 import WidgetNoData from '../../../../components/dashboard/WidgetNoData';
-import WidgetLoader from '../../../../components/dashboard/WidgetLoader';
 import WidgetMultiLines from '../../../../components/dashboard/WidgetMultiLines';
+import Loader, { LoaderVariant } from '../../../../components/Loader';
 
 const stixCoreObjectsMultiLineChartTimeSeriesQuery = graphql`
   query StixCoreObjectsMultiLineChartTimeSeriesQuery(
@@ -87,7 +87,7 @@ const StixCoreObjectsMultiLineChart = ({
           if (props) {
             return <WidgetNoData />;
           }
-          return <WidgetLoader />;
+          return <Loader variant={LoaderVariant.inElement} />;
         }}
       />
     );