@centreon/ui 25.11.1 → 25.11.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@centreon/ui",
-  "version": "25.11.1",
+  "version": "25.11.3",
   "description": "Centreon UI Components",
   "scripts": {
     "update:deps": "pnpx npm-check-updates -i --format group",
@@ -90,7 +90,7 @@
     "@vitejs/plugin-react": "^4.3.4",
     "@vitejs/plugin-react-swc": "^3.8.0",
     "chai": "^5.2.0",
-    "cypress": "^14.1.0",
+    "cypress": "^15.5.0",
     "identity-obj-proxy": "^3.0.0",
     "jest-transform-stub": "^2.0.0",
     "mochawesome": "^7.1.3",

package/src/Checkbox/Checkbox.tsx

@@ -55,12 +55,14 @@ interface Props {
   dataTestId?: string;
   disabled?: boolean;
   label: string;
+  id: string;
   labelPlacement?: LabelPlacement;
   labelProps?: TypographyProps;
   onChange?: (e) => void;
 }
 
 const Checkbox = ({
+  id,
   Icon,
   checked,
   label,
@@ -86,7 +88,7 @@ const Checkbox = ({
             className={classes.checkbox}
             color="primary"
             disabled={disabled}
-            id={label}
+            id={id}
             size="small"
             sx={{ padding: 0 }}
             onChange={onChange}

package/src/Checkbox/CheckboxGroup/index.tsx

@@ -6,6 +6,8 @@ import { TypographyProps } from '@mui/material/Typography';
 
 import Checkbox, { LabelPlacement } from '../Checkbox';
 
+import { useTranslation } from 'react-i18next';
+
 interface Props {
   className?: string;
   dataTestId?: string;
@@ -45,6 +47,8 @@ const CheckboxGroup = ({
 }: Props): JSX.Element => {
   const { classes, cx } = useStyles();
 
+  const { t } = useTranslation();
+
   const row = !equals(direction, 'vertical');
 
   return (
@@ -61,10 +65,11 @@ const CheckboxGroup = ({
             className={cx(classes.checkbox, className)}
             disabled={disabled}
             key={value}
-            label={value}
+            label={t(value)}
             labelPlacement={labelPlacement}
             labelProps={labelProps}
             onChange={onChange}
+            id={value}
           />
         );
       })}

package/src/Form/Inputs/Checkbox.tsx

@@ -15,7 +15,8 @@ const Checkbox = ({
   fieldName,
   getDisabled,
   hideInput,
-  dataTestId
+  dataTestId,
+  label
 }: InputPropsWithoutGroup): JSX.Element => {
   const { values, setFieldValue } = useFormikContext<FormikValues>();
 
@@ -45,7 +46,7 @@ const Checkbox = ({
         checked={value?.checked}
         dataTestId={dataTestId || ''}
         disabled={disabled}
-        label={value?.label}
+        label={label}
         labelPlacement={checkbox?.labelPlacement || 'end'}
         onChange={handleChange}
       />

package/src/Form/Inputs/ConnectedAutocomplete.tsx

@@ -137,6 +137,8 @@ const ConnectedAutocomplete = ({
         getEndpoint={getEndpoint}
         decoder={connectedAutocomplete?.decoder}
         getRenderedOptionText={connectedAutocomplete?.getRenderedOptionText}
+        getOptionLabel={connectedAutocomplete?.getOptionLabel}
+        optionProperty={connectedAutocomplete?.optionProperty}
         initialPage={1}
         isOptionEqualToValue={isOptionEqualToValue}
         label={t(label)}

package/src/Form/Inputs/models.ts

@@ -62,6 +62,8 @@ export interface InputProps {
     endpoint?: string;
     filterKey?: string;
     getRenderedOptionText?: (option) => string | JSX.Element;
+    getOptionLabel?: (option) => string;
+    optionProperty?: string;
     disableSelectAll?: boolean;
     limitTags?: number;
     decoder?;

package/src/Form/storiesData.tsx

@@ -236,12 +236,12 @@ export const basicFormInputs: Array<InputProps> = [
             direction: 'horizontal'
           },
           fieldName: 'notifications.channels',
-          label: 'channels',
+          label: 'mail',
           type: InputType.Checkbox
         },
         {
           fieldName: 'notifications.includeServices',
-          label: 'Iclude services',
+          label: 'Include services for this host',
           type: InputType.Checkbox
         },
         {

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

@@ -65,7 +65,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/Multi/Multi.tsx

@@ -36,7 +36,7 @@ const MultiAutocompleteField = ({
   disableSortedOptions = false,
   disableSelectAll = true,
   optionProperty = 'name',
-  getOptionLabel = (option): string => option.name,
+  getOptionLabel = (option): string => option?.name,
   getTagLabel = (option): string => option[optionProperty],
   getOptionTooltipLabel,
   chipProps,