@centreon/ui 24.4.78 → 24.4.79

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@centreon/ui",
-  "version": "24.4.78",
+  "version": "24.4.79",
   "description": "Centreon UI Components",
   "scripts": {
     "update:deps": "pnpx npm-check-updates -i --format group",
@@ -144,7 +144,7 @@
     "ulog": "^2.0.0-beta.19"
   },
   "peerDependencies": {
-    "@centreon/ui-context": "file:../ui-context",
+    "@centreon/ui-context": "workspace:*",
     "@dnd-kit/core": "6.x",
     "@dnd-kit/sortable": "6.x",
     "@dnd-kit/utilities": "3.x",

package/src/Dashboard/Dashboard.styles.ts

@@ -22,6 +22,9 @@ export const useDashboardLayoutStyles = makeStyles<boolean>()(
       '& .react-grid-item.resizing': {
         boxShadow: theme.shadows[3]
       },
+      '& .react-grid-layout': {
+        position: 'relative'
+      },
       '& .react-resizable-handle': {
         backgroundColor: theme.palette.action.focus,
         backgroundImage: 'none',

package/src/Form/Inputs/ConnectedAutocomplete.tsx

@@ -112,11 +112,13 @@ const ConnectedAutocomplete = ({
         error={error}
         field={filterKey}
         getEndpoint={getEndpoint}
+        getOptionLabel={connectedAutocomplete?.getOptionLabel}
         getRenderedOptionText={connectedAutocomplete?.getRenderedOptionText}
         initialPage={1}
         isOptionEqualToValue={isOptionEqualToValue}
         label={t(label)}
         name={fieldName}
+        optionProperty={connectedAutocomplete?.optionProperty}
         required={isRequired}
         value={value ?? null}
         onBlur={blur}

package/src/Form/Inputs/models.ts

@@ -46,9 +46,14 @@ export interface InputProps {
   };
   connectedAutocomplete?: {
     additionalConditionParameters: Array<ConditionsSearchParameter>;
+    decoder?;
+    disableSelectAll?: boolean;
     endpoint?: string;
     filterKey?: string;
+    getOptionLabel?: (option) => string;
     getRenderedOptionText?: (option) => string | JSX.Element;
+    limitTags?: number;
+    optionProperty?: string;
   };
   custom?: {
     Component: React.ComponentType<InputPropsWithoutGroup>;

package/src/Graph/BarStack/Graph.tsx

@@ -15,16 +15,15 @@ import { useGraphStyles } from './BarStack.styles';
 import { BarStackProps } from './models';
 import { useGraphAndLegend } from './useGraphAndLegend';
 
-interface Props
-  extends Pick<
-    BarStackProps,
-    | 'data'
-    | 'displayValues'
-    | 'onSingleBarClick'
-    | 'unit'
-    | 'TooltipContent'
-    | 'tooltipProps'
-  > {
+interface Props extends Pick<
+  BarStackProps,
+  | 'data'
+  | 'displayValues'
+  | 'onSingleBarClick'
+  | 'unit'
+  | 'TooltipContent'
+  | 'tooltipProps'
+> {
   colorScale;
   height: number;
   isVerticalBar: boolean;

package/src/Graph/BarStack/GraphAndLegend.tsx

@@ -7,16 +7,15 @@ import Graph from './Graph';
 import { gap, legendMaxHeight, legendMaxWidth } from './constants';
 import { BarStackProps } from './models';
 
-interface Props
-  extends Pick<
-    BarStackProps,
-    | 'data'
-    | 'displayValues'
-    | 'onSingleBarClick'
-    | 'unit'
-    | 'TooltipContent'
-    | 'tooltipProps'
-  > {
+interface Props extends Pick<
+  BarStackProps,
+  | 'data'
+  | 'displayValues'
+  | 'onSingleBarClick'
+  | 'unit'
+  | 'TooltipContent'
+  | 'tooltipProps'
+> {
   colorScale;
   displayLegend: boolean;
   height: number;

package/src/Graph/Tree/Tree.cypress.spec.tsx

@@ -23,8 +23,10 @@ const validateTree = (tree): void => {
   });
 };
 
-interface InitializeProps
-  extends Pick<TreeProps<SimpleData | ComplexData>, 'treeLink' | 'children'> {
+interface InitializeProps extends Pick<
+  TreeProps<SimpleData | ComplexData>,
+  'treeLink' | 'children'
+> {
   data?: Node<SimpleData | ComplexData>;
   isDefaultExpanded?: (data: SimpleData | ComplexData) => boolean;
 }

package/src/InputField/Number/Number.tsx

@@ -4,8 +4,10 @@ import { T, always, cond, isEmpty, isNil } from 'ramda';
 
 import TextField, { TextProps } from '../Text';
 
-export interface NumberProps
-  extends Omit<TextProps, 'defaultValue' | 'onChange'> {
+export interface NumberProps extends Omit<
+  TextProps,
+  'defaultValue' | 'onChange'
+> {
   /**
    * The initial value which will be used by the input for the first render
    */

package/src/InputField/Select/Autocomplete/Connected/index.tsx

@@ -57,7 +57,7 @@ const ConnectedAutocompleteField = (
     open,
     exclusionOptionProperty = 'id',
     searchConditions = [],
-    getRenderedOptionText = (option): string => option.name?.toString(),
+    getRenderedOptionText = (option): string => option?.name?.toString(),
     getRequestHeaders,
     displayOptionThumbnail,
     queryKey,

package/src/InputField/Select/Autocomplete/Draggable/SortableListContent.tsx

@@ -8,8 +8,10 @@ import { Chip, Typography, useTheme } from '@mui/material';
 
 import { DraggableSelectEntry, SortableListProps } from './SortableList';
 
-interface ContentProps
-  extends Pick<DraggableSelectEntry, 'name' | 'createOption' | 'id'> {
+interface ContentProps extends Pick<
+  DraggableSelectEntry,
+  'name' | 'createOption' | 'id'
+> {
   attributes;
   id: string;
   index: number;

package/src/InputField/Select/Autocomplete/Multi/index.tsx

@@ -23,7 +23,8 @@ type DisableClearable = boolean;
 type FreeSolo = boolean;
 
 export interface Props
-  extends Omit<AutocompleteProps, 'renderTags' | 'renderOption' | 'multiple'>,
+  extends
+    Omit<AutocompleteProps, 'renderTags' | 'renderOption' | 'multiple'>,
     Omit<
       UseAutocompleteProps<SelectEntry, Multiple, DisableClearable, FreeSolo>,
       'multiple'

package/src/Listing/Cell/index.tsx

@@ -124,7 +124,8 @@ const useStyles = makeStyles<StylesProps>()(
 );
 
 interface Props
-  extends Pick<
+  extends
+    Pick<
       DataCellProps,
       'isRowHovered' | 'row' | 'rowColorConditions' | 'disableRowCondition'
     >,

package/src/Snackbar/Transition.tsx

@@ -22,8 +22,7 @@ type TransitionKeys =
   | 'addEndListener'
   | TransitionHandlerKeys;
 interface TransitionProps
-  extends TransitionActions,
-    Partial<Pick<_TransitionProps, TransitionKeys>> {
+  extends TransitionActions, Partial<Pick<_TransitionProps, TransitionKeys>> {
   style?: React.CSSProperties;
 }
 

package/src/api/useFetchQuery/index.ts

@@ -1,20 +1,17 @@
-import { useEffect, useMemo, useRef } from 'react';
-
-import 'ulog';
 import {
   QueryKey,
   QueryObserverBaseResult,
+  UseQueryOptions,
   useQuery,
   useQueryClient,
-  UseQueryOptions
-} from '@tanstack/react-query';
-import { JsonDecoder } from 'ts.data.json';
-import anylogger from 'anylogger';
-import { has, includes, isNil, not, omit } from 'ramda';
+} from "@tanstack/react-query";
+import { has, includes, isNil, not, omit } from "ramda";
+import { useEffect, useMemo, useRef } from "react";
+import { JsonDecoder } from "ts.data.json";
 
-import { CatchErrorProps, customFetch, ResponseError } from '../customFetch';
-import useSnackbar from '../../Snackbar/useSnackbar';
-import { useDeepCompare } from '../../utils';
+import useSnackbar from "../../Snackbar/useSnackbar";
+import { useDeepCompare } from "../../utils";
+import { CatchErrorProps, customFetch, ResponseError } from "../customFetch";
 
 export interface UseFetchQueryProps<T> {
   baseEndpoint?: string;
@@ -31,24 +28,24 @@ export interface UseFetchQueryProps<T> {
     suspense?: boolean;
   } & Omit<
     UseQueryOptions<T | ResponseError, Error, T | ResponseError, QueryKey>,
-    'queryKey' | 'queryFn'
+    "queryKey" | "queryFn"
   >;
 }
 
 export type UseFetchQueryState<T> = {
   data?: T;
-  error: Omit<ResponseError, 'isError'> | null;
+  error: Omit<ResponseError, "isError"> | null;
   fetchQuery: () => Promise<T | ResponseError>;
   prefetchNextPage: ({ page, getPrefetchQueryKey }) => void;
   prefetchPreviousPage: ({ page, getPrefetchQueryKey }) => void;
   prefetchQuery: ({ endpointParams, queryKey }) => void;
-} & Omit<QueryObserverBaseResult, 'data' | 'error'>;
+} & Omit<QueryObserverBaseResult, "data" | "error">;
 
 export interface PrefetchEndpointParams {
   page: number;
 }
 
-const log = anylogger('API Request');
+const log = console;
 
 const useFetchQuery = <T extends object>({
   getEndpoint,
@@ -61,7 +58,7 @@ const useFetchQuery = <T extends object>({
   queryOptions,
   httpCodesBypassErrorSnackbar = [],
   baseEndpoint,
-  doNotCancelCallsOnUnmount = false
+  doNotCancelCallsOnUnmount = false,
 }: UseFetchQueryProps<T>): UseFetchQueryState<T> => {
   const dataRef = useRef<T | undefined>(undefined);
 
@@ -76,10 +73,10 @@ const useFetchQuery = <T extends object>({
         defaultFailureMessage,
         endpoint: getEndpoint(),
         headers: new Headers(fetchHeaders),
-        signal
+        signal,
       }),
     queryKey: getQueryKey(),
-    ...queryOptions
+    ...queryOptions,
   });
 
   const queryClient = useQueryClient();
@@ -90,7 +87,7 @@ const useFetchQuery = <T extends object>({
       log.error(data.message);
       const hasACorrespondingHttpCode = includes(
         data?.statusCode || 0,
-        httpCodesBypassErrorSnackbar
+        httpCodesBypassErrorSnackbar,
       );
 
       if (!hasACorrespondingHttpCode) {
@@ -109,9 +106,9 @@ const useFetchQuery = <T extends object>({
           defaultFailureMessage,
           endpoint: getEndpoint(endpointParams),
           headers: new Headers(fetchHeaders),
-          signal
+          signal,
         }),
-      queryKey
+      queryKey,
     });
   };
 
@@ -124,7 +121,7 @@ const useFetchQuery = <T extends object>({
 
     return prefetchQuery({
       endpointParams: { page: nextPage },
-      queryKey: getPrefetchQueryKey(nextPage)
+      queryKey: getPrefetchQueryKey(nextPage),
     });
   };
 
@@ -137,7 +134,7 @@ const useFetchQuery = <T extends object>({
 
     return prefetchQuery({
       endpointParams: { page: previousPage },
-      queryKey: getPrefetchQueryKey(previousPage)
+      queryKey: getPrefetchQueryKey(previousPage),
     });
   };
 
@@ -151,16 +148,16 @@ const useFetchQuery = <T extends object>({
           defaultFailureMessage,
           endpoint: getEndpoint(),
           headers: new Headers(fetchHeaders),
-          signal
+          signal,
         }),
-      queryKey: getQueryKey()
+      queryKey: getQueryKey(),
     });
   };
 
   const data = useMemo(
     () =>
-      not(has('isError', queryData.data)) ? (queryData.data as T) : undefined,
-    [queryData.data]
+      not(has("isError", queryData.data)) ? (queryData.data as T) : undefined,
+    [queryData.data],
   );
 
   if (!isNil(data)) {
@@ -183,17 +180,17 @@ const useFetchQuery = <T extends object>({
     () => {
       manageError();
     },
-    useDeepCompare([queryData.data])
+    useDeepCompare([queryData.data]),
   );
 
   return {
-    ...omit(['data', 'error'], queryData),
+    ...omit(["data", "error"], queryData),
     data: dataRef.current,
-    error: errorData?.isError ? omit(['isError'], errorData) : null,
+    error: errorData?.isError ? omit(["isError"], errorData) : null,
     fetchQuery,
     prefetchNextPage,
     prefetchPreviousPage,
-    prefetchQuery
+    prefetchQuery,
   };
 };
 

package/src/api/useMutationQuery/index.ts

@@ -1,18 +1,16 @@
-import 'ulog';
 import { useEffect } from 'react';
 
 import {
-  useMutation,
   UseMutationOptions,
-  UseMutationResult
+  UseMutationResult,
+  useMutation
 } from '@tanstack/react-query';
-import { JsonDecoder } from 'ts.data.json';
-import anylogger from 'anylogger';
 import { includes, omit } from 'ramda';
+import { JsonDecoder } from 'ts.data.json';
 
-import { CatchErrorProps, customFetch, ResponseError } from '../customFetch';
 import useSnackbar from '../../Snackbar/useSnackbar';
 import { useDeepCompare } from '../../utils';
+import { CatchErrorProps, customFetch, ResponseError } from '../customFetch';
 
 export enum Method {
   DELETE = 'DELETE',
@@ -52,7 +50,7 @@ export type UseMutationQueryProps<T, TMeta> = {
   'mutationFn' | 'onError' | 'onMutate' | 'onSuccess' | 'mutateAsync' | 'mutate'
 >;
 
-const log = anylogger('API Request');
+const log = console;
 
 export type UseMutationQueryState<T, TMeta> = Omit<
   UseMutationResult<T | ResponseError>,

package/src/api/useRequest/index.ts

@@ -1,15 +1,13 @@
-import { useState, useEffect } from 'react';
+import { useEffect, useState } from 'react';
 
-import 'ulog';
 import axios from 'axios';
-import { pathOr, defaultTo, path, includes, or } from 'ramda';
-import anylogger from 'anylogger';
+import { defaultTo, includes, or, path, pathOr } from 'ramda';
 import { JsonDecoder } from 'ts.data.json';
 
-import useCancelTokenSource from '../useCancelTokenSource';
 import useSnackbar from '../../Snackbar/useSnackbar';
+import useCancelTokenSource from '../useCancelTokenSource';
 
-const log = anylogger('API Request');
+const log = console;
 
 export interface RequestParams<TResult> {
   decoder?: JsonDecoder.Decoder<TResult>;