Revert upgrade react and react-dom to version 19 (#899)

This reverts commit b0c8434.

Author: dbraquart

package-lock.json

@@ -65,8 +65,8 @@
         "ag-grid-community": "^33.0.3",
         "ag-grid-react": "^33.0.4",
         "notistack": "^3.0.2",
-        "react": "^19.2.0",
-        "react-dom": "^19.2.0",
+        "react": "^18.3.1",
+        "react-dom": "^18.3.1",
         "react-hook-form": "^7.54.2",
         "react-intl": "^7.1.6",
         "react-papaparse": "^4.4.0",
@@ -98,8 +98,8 @@
         "@types/localized-countries": "^2.0.3",
         "@types/node": "^22.18.1",
         "@types/prop-types": "^15.7.15",
-        "@types/react": "^19.2.2",
-        "@types/react-dom": "^19.2.1",
+        "@types/react": "^18.3.24",
+        "@types/react-dom": "^18.3.7",
         "@types/react-resizable": "^3.0.8",
         "@typescript-eslint/eslint-plugin": "^7.18.0",
         "@typescript-eslint/parser": "^7.18.0",
@@ -128,8 +128,8 @@
         "notistack": "^3.0.2",
         "prettier": "^3.6.2",
         "prettier-plugin-properties": "^0.3.0",
-        "react": "^19.2.0",
-        "react-dom": "^19.2.0",
+        "react": "^18.3.1",
+        "react-dom": "^18.3.1",
         "react-hook-form": "^7.62.0",
         "react-intl": "^7.1.11",
         "react-papaparse": "^4.4.0",

package.json

@@ -5,7 +5,7 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
 
-import { JSX, useCallback } from 'react';
+import { useCallback } from 'react';
 import { CsvExportProps } from './csv-export.type';
 import { useCsvExport } from './use-csv-export';
 import { ExportCsvButton } from './export-csv-button';

src/components/csvDownloader/csv-export.tsx

@@ -5,7 +5,7 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
 
-import { JSX, ReactNode } from 'react';
+import { ReactNode } from 'react';
 import { ElementType, EquipmentType } from '../../utils';
 
 export const SELECTED = 'selected';

src/components/dnd-table/dnd-table.type.ts

@@ -5,7 +5,7 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
 
-import React, { RefObject, useEffect, useRef } from 'react';
+import React, { MutableRefObject, useEffect, useRef } from 'react';
 import { FormattedMessage } from 'react-intl';
 import { useController } from 'react-hook-form';
 
@@ -29,7 +29,7 @@ export function ErrorInput({ name, InputField }: ErrorInputProps) {
         name,
     });
 
-    const errorRef: RefObject<any> = useRef(null);
+    const errorRef: MutableRefObject<any> = useRef(null);
 
     const errorProps = (errorMsg: ErrorMessage | undefined) => {
         if (typeof errorMsg === 'string') {

src/components/inputs/reactHookForm/errorManagement/ErrorInput.tsx

@@ -7,7 +7,7 @@
 import { ReactNode, useCallback, useLayoutEffect, useMemo, useRef, useState } from 'react';
 import { Box, type BoxProps, styled, Tooltip } from '@mui/material';
 import { Style } from 'node:util';
-import type { SxStyle, MuiStyles } from '../../utils';
+import type { SxStyle, MuiStyles } from '../../utils/styles';
 
 const overflowStyle = {
     overflow: {
@@ -49,7 +49,7 @@ export const OverflowableText = styled(
         children,
         ...props
     }: OverflowableTextProps) => {
-        const element = useRef<HTMLHeadingElement>(undefined);
+        const element = useRef<HTMLHeadingElement>();
 
         const isMultiLine = useMemo(() => maxLineCount && maxLineCount > 1, [maxLineCount]);
 

src/components/overflowableText/OverflowableText.tsx

@@ -7,7 +7,7 @@
 import { useEffect, useRef } from 'react';
 
 export function usePrevious<T = undefined>(value: T) {
-    const ref = useRef<T>(undefined);
+    const ref = useRef<T>();
     useEffect(() => {
         ref.current = value;
     }, [value]);

src/hooks/usePrevious.ts

@@ -5,7 +5,7 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
 
-import { RefObject, useCallback } from 'react';
+import { MutableRefObject, useCallback } from 'react';
 import { BaseVariant, OptionsObject, closeSnackbar as closeSnackbarFromNotistack, useSnackbar } from 'notistack';
 import { IntlShape } from 'react-intl';
 import { useIntlRef } from './useIntlRef';
@@ -33,7 +33,7 @@ function checkInputs(txt?: string, id?: string, values?: SnackInputs['messageVal
 }
 
 function checkAndTranslateIfNecessary(
-    intlRef: RefObject<IntlShape>,
+    intlRef: MutableRefObject<IntlShape>,
     txt?: string,
     id?: string,
     values?: SnackInputs['messageValues']
@@ -52,7 +52,7 @@ function checkAndTranslateIfNecessary(
     );
 }
 
-function makeMessage(intlRef: RefObject<IntlShape>, snackInputs: SnackInputs): string | null {
+function makeMessage(intlRef: MutableRefObject<IntlShape>, snackInputs: SnackInputs): string | null {
     const message = checkAndTranslateIfNecessary(
         intlRef,
         snackInputs.messageTxt,