@centreon/ui 24.8.6 → 24.8.7

package/src/utils/useInfiniteScrollListing.ts

@@ -1,129 +1,129 @@
-import { useEffect, useMemo, useRef, useState } from 'react';
-
-import { equals, gte, isNil, reduce } from 'ramda';
-import { PrimitiveAtom, useAtom } from 'jotai';
-import { JsonDecoder } from 'ts.data.json';
-
-import {
-  QueryParameter,
-  buildListingEndpoint,
-  useFetchQuery,
-  useIntersectionObserver
-} from '@centreon/ui';
-
-import type { Listing } from '../api/models';
-import { Parameters } from '../api/buildListingEndpoint/models';
-
-interface UseInfiniteScrollListing<T> {
-  elementRef: (node) => void;
-  elements: Array<T>;
-  isLoading: boolean;
-  total?: number;
-}
-
-interface UseInfiniteScrollListingProps<T> {
-  customQueryParameters?: Array<QueryParameter>;
-  decoder?: JsonDecoder.Decoder<Listing<T>>;
-  enabled?: boolean;
-  endpoint: string;
-  limit?: number;
-  pageAtom: PrimitiveAtom<number>;
-  parameters?: Parameters;
-  queryKeyName: string;
-  suspense?: boolean;
-}
-
-export const useInfiniteScrollListing = <T>({
-  queryKeyName,
-  endpoint,
-  decoder,
-  pageAtom,
-  suspense = true,
-  parameters,
-  customQueryParameters,
-  limit = 100,
-  enabled = true
-}: UseInfiniteScrollListingProps<T>): UseInfiniteScrollListing<T> => {
-  const [maxPage, setMaxPage] = useState(1);
-
-  const elements = useRef<Array<T> | undefined>(undefined);
-
-  const [page, setPage] = useAtom(pageAtom);
-
-  const { data, isLoading, prefetchNextPage, fetchStatus } = useFetchQuery<
-    Listing<T>
-  >({
-    decoder,
-    getEndpoint: (params) =>
-      buildListingEndpoint({
-        baseEndpoint: endpoint,
-        customQueryParameters,
-        parameters: { limit, page: params?.page || page, ...parameters }
-      }),
-    getQueryKey: () => [
-      queryKeyName,
-      page,
-      JSON.stringify(parameters),
-      JSON.stringify(customQueryParameters)
-    ],
-    isPaginated: true,
-    queryOptions: {
-      enabled,
-      refetchOnMount: false,
-      refetchOnWindowFocus: false,
-      suspense: suspense && equals(page, 1)
-    }
-  });
-
-  const elementRef = useIntersectionObserver({
-    action: () => {
-      setPage((currentPage) => currentPage + 1);
-    },
-    loading: !equals(fetchStatus, 'idle'),
-    maxPage,
-    page
-  });
-
-  elements.current = useMemo(() => {
-    if (isNil(data) || !equals(fetchStatus, 'idle')) {
-      return elements.current;
-    }
-
-    return reduce<T, Array<T>>(
-      (acc, element) => [...acc, element],
-      equals(page, 1) ? [] : elements.current || [],
-      data.result
-    );
-  }, [page, data, fetchStatus]);
-
-  useEffect(() => {
-    if (isNil(data)) {
-      return;
-    }
-
-    const total = data.meta.total || 1;
-    const newMaxPage = Math.ceil(total / limit);
-
-    setMaxPage(newMaxPage);
-
-    if (gte(page, newMaxPage)) {
-      return;
-    }
-
-    prefetchNextPage({
-      getPrefetchQueryKey: (newPage) => [`dashboards`, newPage],
-      page
-    });
-  }, [data]);
-
-  useEffect(() => {
-    return () => setPage(1);
-  }, []);
-
-  return {
-    elementRef,
-    elements: elements.current || [],
-    isLoading,
-    total: data?.meta.total
-  };
-};
+import { useEffect, useMemo, useRef, useState } from 'react';
+
+import { PrimitiveAtom, useAtom } from 'jotai';
+import { equals, gte, isNil, reduce } from 'ramda';
+import { JsonDecoder } from 'ts.data.json';
+
+import {
+  QueryParameter,
+  buildListingEndpoint,
+  useFetchQuery,
+  useIntersectionObserver
+} from '@centreon/ui';
+
+import { Parameters } from '../api/buildListingEndpoint/models';
+import type { Listing } from '../api/models';
+
+interface UseInfiniteScrollListing<T> {
+  elementRef: (node) => void;
+  elements: Array<T>;
+  isLoading: boolean;
+  total?: number;
+}
+
+interface UseInfiniteScrollListingProps<T> {
+  customQueryParameters?: Array<QueryParameter>;
+  decoder?: JsonDecoder.Decoder<Listing<T>>;
+  enabled?: boolean;
+  endpoint: string;
+  limit?: number;
+  pageAtom: PrimitiveAtom<number>;
+  parameters?: Parameters;
+  queryKeyName: string;
+  suspense?: boolean;
+}
+
+export const useInfiniteScrollListing = <T>({
+  queryKeyName,
+  endpoint,
+  decoder,
+  pageAtom,
+  suspense = true,
+  parameters,
+  customQueryParameters,
+  limit = 100,
+  enabled = true
+}: UseInfiniteScrollListingProps<T>): UseInfiniteScrollListing<T> => {
+  const [maxPage, setMaxPage] = useState(1);
+
+  const elements = useRef<Array<T> | undefined>(undefined);
+
+  const [page, setPage] = useAtom(pageAtom);
+
+  const { data, isLoading, prefetchNextPage, fetchStatus } = useFetchQuery<
+    Listing<T>
+  >({
+    decoder,
+    getEndpoint: (params) =>
+      buildListingEndpoint({
+        baseEndpoint: endpoint,
+        customQueryParameters,
+        parameters: { limit, page: params?.page || page, ...parameters }
+      }),
+    getQueryKey: () => [
+      queryKeyName,
+      page,
+      JSON.stringify(parameters),
+      JSON.stringify(customQueryParameters)
+    ],
+    isPaginated: true,
+    queryOptions: {
+      enabled,
+      refetchOnMount: false,
+      refetchOnWindowFocus: false,
+      suspense: suspense && equals(page, 1)
+    }
+  });
+
+  const elementRef = useIntersectionObserver({
+    action: () => {
+      setPage((currentPage) => currentPage + 1);
+    },
+    loading: !equals(fetchStatus, 'idle'),
+    maxPage,
+    page
+  });
+
+  elements.current = useMemo(() => {
+    if (isNil(data) || !equals(fetchStatus, 'idle')) {
+      return elements.current;
+    }
+
+    return reduce<T, Array<T>>(
+      (acc, element) => [...acc, element],
+      equals(page, 1) ? [] : elements.current || [],
+      data.result
+    );
+  }, [page, data, fetchStatus]);
+
+  useEffect(() => {
+    if (isNil(data)) {
+      return;
+    }
+
+    const total = data.meta.total || 1;
+    const newMaxPage = Math.ceil(total / limit);
+
+    setMaxPage(newMaxPage);
+
+    if (gte(page, newMaxPage)) {
+      return;
+    }
+
+    prefetchNextPage({
+      getPrefetchQueryKey: (newPage) => ['dashboards', newPage],
+      page
+    });
+  }, [data]);
+
+  useEffect(() => {
+    return () => setPage(1);
+  }, []);
+
+  return {
+    elementRef,
+    elements: elements.current || [],
+    isLoading,
+    total: data?.meta.total
+  };
+};

package/src/utils/useIntersectionObserver.ts

@@ -1,4 +1,4 @@
-import { useRef, useCallback } from 'react';
+import { useCallback, useRef } from 'react';
 
 interface HookParam {
   action: () => void;

package/src/utils/useKeyObserver.tsx

@@ -1,4 +1,4 @@
-import { useState, useEffect } from 'react';
+import { useEffect, useState } from 'react';
 
 interface UseKeyObserverProps {
   isShiftKeyDown: boolean;

package/src/utils/useLicenseExpirationWarning.test.tsx

@@ -1,5 +1,5 @@
-import dayjs from 'dayjs';
 import { renderHook } from '@testing-library/react';
+import dayjs from 'dayjs';
 
 import {
   getFetchCall,

package/src/utils/useLicenseExpirationWarning.ts

@@ -1,7 +1,7 @@
 import { useEffect } from 'react';
 
 import dayjs from 'dayjs';
-import { path, pipe, propEq, find, lt, isNil } from 'ramda';
+import { path, find, isNil, lt, pipe, propEq } from 'ramda';
 import { useTranslation } from 'react-i18next';
 
 import { useFetchQuery, useSnackbar } from '..';

package/src/utils/useLocaleDateTimeFormat/index.test.tsx

@@ -2,13 +2,13 @@ import { useEffect } from 'react';
 
 import dayjs from 'dayjs';
 import 'dayjs/locale/en';
+import { RenderResult, render } from '@testing-library/react';
+import localizedFormatPlugin from 'dayjs/plugin/localizedFormat';
 import timezonePlugin from 'dayjs/plugin/timezone';
 import utcPlugin from 'dayjs/plugin/utc';
-import localizedFormatPlugin from 'dayjs/plugin/localizedFormat';
-import { render, RenderResult } from '@testing-library/react';
 import { Provider, useSetAtom } from 'jotai';
 
-import { userAtom, ThemeMode } from '@centreon/ui-context';
+import { ThemeMode, userAtom } from '@centreon/ui-context';
 
 import { useLocaleDateTimeFormat } from '.';
 

package/src/utils/useLocaleDateTimeFormat/index.ts

@@ -1,7 +1,7 @@
 import dayjs from 'dayjs';
+import localizedFormat from 'dayjs/plugin/localizedFormat';
 import humanizeDuration from 'humanize-duration';
 import { useAtomValue } from 'jotai';
-import localizedFormat from 'dayjs/plugin/localizedFormat';
 
 import { userAtom } from '@centreon/ui-context';
 

package/src/utils/useLocaleDateTimeFormat/localeFallback.test.tsx

@@ -2,13 +2,13 @@ import { useEffect } from 'react';
 
 import dayjs from 'dayjs';
 import 'dayjs/locale/en';
+import { RenderResult, render } from '@testing-library/react';
+import localizedFormatPlugin from 'dayjs/plugin/localizedFormat';
 import timezonePlugin from 'dayjs/plugin/timezone';
 import utcPlugin from 'dayjs/plugin/utc';
-import localizedFormatPlugin from 'dayjs/plugin/localizedFormat';
-import { useSetAtom, Provider } from 'jotai';
-import { render, RenderResult } from '@testing-library/react';
+import { Provider, useSetAtom } from 'jotai';
 
-import { userAtom, ThemeMode } from '@centreon/ui-context';
+import { ThemeMode, userAtom } from '@centreon/ui-context';
 
 import { useLocaleDateTimeFormat } from '.';
 

package/src/utils/useLocaleTimezoneDate/LocaleTimezoneDate.cypress.spec.tsx

@@ -1,7 +1,7 @@
+import dayjs from 'dayjs';
 import localizedFormat from 'dayjs/plugin/localizedFormat';
-import utc from 'dayjs/plugin/utc';
 import timezonePlugin from 'dayjs/plugin/timezone';
-import dayjs from 'dayjs';
+import utc from 'dayjs/plugin/utc';
 
 import 'dayjs/locale/de';
 import 'dayjs/locale/fr';

package/src/utils/useMemoComponent.ts

@@ -1,4 +1,4 @@
-import { useMemo, useRef, DependencyList, ReactElement } from 'react';
+import { DependencyList, ReactElement, useMemo, useRef } from 'react';
 
 import { equals } from 'ramda';
 

package/src/utils/usePluralizedTranslation.ts

@@ -1,9 +1,9 @@
 import { useCallback } from 'react';
 
-import { useTranslation } from 'react-i18next';
-import pluralize from 'pluralize';
 import { useAtomValue } from 'jotai';
+import pluralize from 'pluralize';
 import { equals, includes } from 'ramda';
+import { useTranslation } from 'react-i18next';
 
 import { userAtom } from '@centreon/ui-context';
 

package/src/utils/useViewportIntersection.ts

@@ -1,4 +1,4 @@
-import { useState, useRef, useEffect, Dispatch, SetStateAction } from 'react';
+import { Dispatch, SetStateAction, useEffect, useRef, useState } from 'react';
 
 interface ViewportIntersectionState {
   isInViewport: boolean;