Remove mutualized api functions

.env

@@ -1,2 +1,3 @@
 VITE_API_GATEWAY=api/gateway
 VITE_WS_GATEWAY=ws/gateway
+VITE_DEBUG_REQUESTS=false

package.json

@@ -7,7 +7,7 @@
     "dependencies": {
         "@emotion/react": "^11.11.4",
         "@emotion/styled": "^11.11.5",
-        "@gridsuite/commons-ui": "0.63.4",
+        "@gridsuite/commons-ui": "file:../commons-ui/gridsuite-commons-ui-0.63.4.tgz",
         "@hookform/resolvers": "^3.3.4",
         "@mui/icons-material": "^5.15.14",
         "@mui/lab": "5.0.0-alpha.169",
@@ -32,6 +32,7 @@
         "react-window": "^1.8.10",
         "reconnecting-websocket": "^4.4.0",
         "redux": "^5.0.1",
+        "type-fest": "^4.24.0",
         "typeface-roboto": "^1.1.13",
         "uuid": "^9.0.1",
         "yup": "^1.4.0"

src/components/app-top-bar.tsx

@@ -4,20 +4,10 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
-import { useEffect, useRef } from 'react';
-import {
-    GridSuiteModule,
-    fetchAppsMetadata,
-    LIGHT_THEME,
-    logout,
-    TopBar,
-    UserManagerState,
-    GsTheme,
-    GsLang,
-} from '@gridsuite/commons-ui';
-import { APP_NAME, PARAM_LANGUAGE, PARAM_THEME } from '../utils/config-params';
+import { useCallback, useEffect, useRef } from 'react';
+import { LIGHT_THEME, logout, PARAM_LANGUAGE, PARAM_THEME, TopBar, UserManagerState } from '@gridsuite/commons-ui';
+import { APP_NAME } from '../utils/config-params';
 import { useDispatch, useSelector } from 'react-redux';
-import { fetchVersion, getServersInfos } from '../utils/rest-api';
 import { useNavigate } from 'react-router-dom';
 import GridExploreLogoLight from '../images/GridExplore_logo_light.svg?react';
 import GridExploreLogoDark from '../images/GridExplore_logo_dark.svg?react';
@@ -26,17 +16,22 @@ import AppPackage from '../../package.json';
 import { SearchBar } from './search/search-bar';
 import { AppState } from '../redux/reducer';
 import { AppDispatch } from '../redux/store';
+import { appsMetadataSrv } from '../services';
 import { useParameterState } from './dialogs/use-parameters-dialog';
 
 type AppTopBarProps = {
     userManagerInstance: UserManagerState['instance'];
 };
 
-export default function AppTopBar({ userManagerInstance }: AppTopBarProps) {
+export default function AppTopBar({ userManagerInstance }: Readonly<AppTopBarProps>) {
     const navigate = useNavigate();
 
+    const onLogoClick = useCallback(() => navigate('/', { replace: true }), [navigate]);
+
     const dispatch = useDispatch<AppDispatch>();
 
+    const onLogoutClick = useCallback(() => logout(dispatch, userManagerInstance), [dispatch, userManagerInstance]);
+
     const user = useSelector((state: AppState) => state.user);
 
     const appsAndUrls = useSelector((state: AppState) => state.appsAndUrls);
@@ -50,8 +45,8 @@ export default function AppTopBar({ userManagerInstance }: AppTopBarProps) {
     const searchInputRef = useRef<any | null>(null);
 
     useEffect(() => {
-        if (user !== null) {
-            fetchAppsMetadata().then((res) => {
+        if (user !== undefined) {
+            appsMetadataSrv.fetchAppsMetadata().then((res) => {
                 dispatch(setAppsAndUrls(res));
             });
         }
@@ -70,23 +65,28 @@ export default function AppTopBar({ userManagerInstance }: AppTopBarProps) {
         }
     }, [user]);
 
+    const globalVersionFetcher = useCallback(
+        () => appsMetadataSrv.fetchVersion().then((res) => res?.deployVersion ?? '<?>'),
+        []
+    );
+
     return (
         <TopBar
             appName={APP_NAME}
             appColor="#3DABE2"
             appLogo={theme === LIGHT_THEME ? <GridExploreLogoLight /> : <GridExploreLogoDark />}
             appVersion={AppPackage.version}
             appLicense={AppPackage.license}
-            onLogoutClick={() => logout(dispatch, userManagerInstance)}
-            onLogoClick={() => navigate('/', { replace: true })}
-            user={user ?? undefined}
+            onLogoutClick={onLogoutClick}
+            onLogoClick={onLogoClick}
+            user={user}
             appsAndUrls={appsAndUrls}
             onThemeClick={handleChangeTheme}
-            theme={themeLocal as GsTheme}
+            theme={themeLocal}
             onLanguageClick={handleChangeLanguage}
-            language={languageLocal as GsLang}
-            globalVersionPromise={() => fetchVersion().then((res) => res?.deployVersion)}
-            additionalModulesPromise={getServersInfos as () => Promise<GridSuiteModule[]>}
+            language={languageLocal}
+            globalVersionPromise={globalVersionFetcher}
+            additionalModulesPromise={'explore'}
         >
             {user && <SearchBar inputRef={searchInputRef} />}
         </TopBar>

src/components/app-wrapper.tsx

@@ -34,6 +34,7 @@ import {
     login_fr,
     multiple_selection_dialog_en,
     multiple_selection_dialog_fr,
+    PARAM_THEME,
     SnackbarProvider,
     table_en,
     table_fr,
@@ -57,7 +58,6 @@ import import_parameters_en from '../translations/external/import-parameters-en'
 import import_parameters_fr from '../translations/external/import-parameters-fr';
 import { store } from '../redux/store';
 import CssBaseline from '@mui/material/CssBaseline';
-import { PARAM_THEME } from '../utils/config-params';
 import { AppState } from '../redux/reducer';
 import { Theme } from '@mui/material';
 

src/components/app.tsx

@@ -12,28 +12,24 @@ import { selectComputedLanguage, selectLanguage, selectTheme } from '../redux/ac
 import {
     AuthenticationRouter,
     CardErrorBoundary,
+    getComputedLanguage,
     getPreLoginPath,
     initializeAuthenticationProd,
+    PARAM_LANGUAGE,
+    PARAM_THEME,
     UserManagerState,
     useSnackMessage,
 } from '@gridsuite/commons-ui';
 import { FormattedMessage } from 'react-intl';
-import {
-    connectNotificationsWsUpdateConfig,
-    fetchConfigParameter,
-    fetchConfigParameters,
-    fetchIdpSettings,
-    fetchValidateUser,
-} from '../utils/rest-api';
-import { APP_NAME, COMMON_APP_NAME, PARAM_LANGUAGE, PARAM_THEME } from '../utils/config-params';
-import { getComputedLanguage } from '../utils/language';
+import { APP_NAME } from '../utils/config-params';
 import AppTopBar from './app-top-bar';
-import Grid from '@mui/material/Grid';
+import { Grid } from '@mui/material';
 import TreeViewsContainer from './tree-views-container';
 import DirectoryContent from './directory-content';
 import DirectoryBreadcrumbs from './directory-breadcrumbs';
 import { AppState } from '../redux/reducer';
 import { AppDispatch } from '../redux/store';
+import { appLocalSrv, configNotificationSrv, configSrv, userAdminSrv } from '../services';
 
 const App = () => {
     const { snackError } = useSnackMessage();
@@ -86,14 +82,14 @@ const App = () => {
     });
 
     const connectNotificationsUpdateConfig = useCallback(() => {
-        const ws = connectNotificationsWsUpdateConfig();
-
+        const ws = configNotificationSrv.connectNotificationsWsUpdateConfig(APP_NAME);
         ws.onmessage = function (event) {
             let eventData = JSON.parse(event.data);
             if (eventData.headers && eventData.headers['parameterName']) {
-                fetchConfigParameter(eventData.headers['parameterName'])
-                    .then((param) => updateParams([param]))
-                    .catch((error) =>
+                configSrv
+                    .fetchConfigParameter(eventData.headers['parameterName'])
+                    .then((param: any) => updateParams([param]))
+                    .catch((error: any) =>
                         snackError({
                             messageTxt: error.message,
                             headerId: 'paramsRetrievingError',
@@ -128,8 +124,8 @@ const App = () => {
                     instance: await initializeAuthenticationProd(
                         dispatch,
                         initialMatchSilentRenewCallbackUrl != null,
-                        fetchIdpSettings,
-                        fetchValidateUser,
+                        appLocalSrv.fetchIdpSettings,
+                        userAdminSrv.fetchValidateUser,
                         initialMatchSigninCallbackUrl != null
                     ),
                     error: null,
@@ -142,8 +138,9 @@ const App = () => {
     }, [initialMatchSilentRenewCallbackUrl, dispatch, initialMatchSigninCallbackUrl]);
 
     useEffect(() => {
-        if (user !== null) {
-            fetchConfigParameters(COMMON_APP_NAME)
+        if (user !== undefined) {
+            configSrv
+                .fetchConfigParameters('common')
                 .then((params) => updateParams(params))
                 .catch((error) =>
                     snackError({
@@ -152,7 +149,8 @@ const App = () => {
                     })
                 );
 
-            fetchConfigParameters(APP_NAME)
+            configSrv
+                .fetchConfigParameters(APP_NAME)
                 .then((params) => updateParams(params))
                 .catch((error) =>
                     snackError({
@@ -188,7 +186,7 @@ const App = () => {
                         marginTop: '20px',
                     }}
                 >
-                    {user !== null ? (
+                    {user !== undefined ? (
                         <Routes>
                             <Route
                                 path="/"

src/components/dialogs/commons/prefilled-name-input.tsx

@@ -5,10 +5,9 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
 
-import React, { FunctionComponent, useEffect, useState } from 'react';
+import { FunctionComponent, useEffect, useState } from 'react';
 import { useFormContext } from 'react-hook-form';
-import { UniqueNameInput, ElementType, FieldConstants } from '@gridsuite/commons-ui';
-import { elementExists } from '../../../utils/rest-api';
+import { ElementType, FieldConstants, UniqueNameInput } from '@gridsuite/commons-ui';
 import { useSelector } from 'react-redux';
 import { AppState } from '../../../redux/reducer';
 
@@ -57,7 +56,6 @@ const PrefilledNameInput: FunctionComponent<PrefilledNameInputProps> = ({ label,
             name={name}
             label={label}
             elementType={elementType}
-            elementExists={elementExists}
             activeDirectory={activeDirectory}
             autoFocus={!caseFile}
             onManualChangeCallback={() => setModifiedByUser(true)}

src/components/dialogs/commons/upload-new-case.tsx

@@ -5,25 +5,24 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
 
-import React, { useState } from 'react';
+import { ChangeEvent, FunctionComponent, useState } from 'react';
 import { FormattedMessage, useIntl } from 'react-intl';
-import Button from '@mui/material/Button';
-import CircularProgress from '@mui/material/CircularProgress';
-import { Grid, Input } from '@mui/material';
+import { Button, CircularProgress, Grid, Input } from '@mui/material';
 import { useController, useFormContext } from 'react-hook-form';
-import { createCaseWithoutDirectoryElementCreation, deleteCase } from '../../../utils/rest-api';
 import { FieldConstants } from '@gridsuite/commons-ui';
+import { UUID } from 'crypto';
+import { caseSrv } from '../../../services';
 
 interface UploadNewCaseProps {
     isNewStudyCreation?: boolean;
-    getCurrentCaseImportParams?: (uuid: string) => void;
+    getCurrentCaseImportParams?: (uuid: UUID) => void;
     handleApiCallError?: ErrorCallback;
 }
 
 const MAX_FILE_SIZE_IN_MO = 100;
 const MAX_FILE_SIZE_IN_BYTES = MAX_FILE_SIZE_IN_MO * 1024 * 1024;
 
-const UploadNewCase: React.FunctionComponent<UploadNewCaseProps> = ({
+const UploadNewCase: FunctionComponent<UploadNewCaseProps> = ({
     isNewStudyCreation = false,
     getCurrentCaseImportParams,
     handleApiCallError,
@@ -49,7 +48,7 @@ const UploadNewCase: React.FunctionComponent<UploadNewCaseProps> = ({
     const caseFile = value as File;
     const { name: caseFileName } = caseFile || {};
 
-    const onChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+    const onChange = (event: ChangeEvent<HTMLInputElement>) => {
         event.preventDefault();
 
         clearErrors(FieldConstants.CASE_FILE);
@@ -68,12 +67,13 @@ const UploadNewCase: React.FunctionComponent<UploadNewCaseProps> = ({
                 if (isNewStudyCreation) {
                     // Create new case
                     setCaseFileLoading(true);
-                    createCaseWithoutDirectoryElementCreation(currentFile)
+                    caseSrv
+                        .createCaseWithoutDirectoryElementCreation(currentFile)
                         .then((newCaseUuid) => {
                             const prevCaseUuid = getValues(FieldConstants.CASE_UUID);
 
                             if (prevCaseUuid && prevCaseUuid !== newCaseUuid) {
-                                deleteCase(prevCaseUuid).catch(handleApiCallError);
+                                caseSrv.deleteCase(prevCaseUuid).catch(handleApiCallError);
                             }
 
                             onCaseUuidChange(newCaseUuid);