[WIP] Fixes dependency cycles and add eslint no-cycle rule

.eslintrc.json

@@ -7,12 +7,34 @@
         "coverage"
     ],
     "plugins": ["react-refresh"],
+    "settings": {
+        "import/parsers": {
+            "@typescript-eslint/parser": [
+                ".ts",
+                ".tsx"
+            ]
+        },
+        "import/resolver": {
+            "typescript": {
+                "alwaysTryTypes": true,
+                "project": "./tsconfig.json"
+            }
+        }
+    },
     "rules": {
         "prettier/prettier": "warn",
         "curly": "error",
         "react-refresh/only-export-components": [
             "error",
             { "allowConstantExport": true }
-        ]
+        ],
+        "import/no-cycle": [
+            "error",
+            {
+                "maxDepth": "∞",
+                "ignoreExternal": true
+            }
+        ],
+        "import/no-self-import": "warn"
     }
 }

package.json

@@ -105,6 +105,7 @@
         "eslint": "^8.57.1",
         "eslint-config-prettier": "^9.1.0",
         "eslint-config-react-app": "^7.0.1",
+        "eslint-import-resolver-typescript": "3.8.3",
         "eslint-plugin-flowtype": "^8.0.3",
         "eslint-plugin-import": "^2.31.0",
         "eslint-plugin-jsx-a11y": "^6.10.2",

src/components/app-top-bar.jsx

@@ -16,7 +16,6 @@ import { PARAM_LANGUAGE, PARAM_THEME, PARAM_USE_NAME, PARAM_DEVELOPER_MODE } fro
 import { useDispatch, useSelector } from 'react-redux';
 import PropTypes from 'prop-types';
 import AppPackage from '../../package.json';
-import { DiagramType, useDiagram } from './diagrams/diagram-common';
 import { isNodeBuilt, isNodeReadOnly } from './graph/util/model-functions';
 import { getServersInfos } from '../services/study';
 import { EQUIPMENT_TYPES } from './utils/equipment-types';
@@ -29,6 +28,8 @@ import { fetchAppsMetadata } from '@gridsuite/commons-ui';
 import { ROOT_NODE_LABEL } from '../constants/node.constant';
 import { useParameterState } from './dialogs/parameters/use-parameters-state';
 import { StudyView } from './utils/utils';
+import { DiagramType } from './diagrams/diagram.type';
+import { useDiagram } from './diagrams/use-diagram';
 
 const styles = {
     currentNodeBox: {

src/components/app.jsx

@@ -51,7 +51,7 @@ import {
     setUpdateNetworkVisualizationParameters,
 } from '../redux/actions';
 import { NOTIFICATIONS_URL_KEYS } from './utils/notificationsProvider-utils';
-import { getNetworkVisualizationParameters } from '../services/study/study-config.ts';
+import { getNetworkVisualizationParameters } from '../services/study/study-config';
 import { StudyView } from './utils/utils';
 
 const noUserManager = { instance: null, error: null };

src/components/computing-status/use-computing-status.ts

@@ -10,12 +10,14 @@ import { UUID } from 'crypto';
 import { RefObject, useCallback, useEffect, useRef } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { ComputingType } from './computing-type';
-import { AppState, StudyUpdated } from 'redux/reducer';
 import { OptionalServicesStatus } from '../utils/optional-services';
 import { setComputingStatus, setLastCompletedComputation } from '../../redux/actions';
-import { AppDispatch } from '../../redux/store';
 import { UPDATE_TYPE_HEADER } from 'components/use-node-data';
 
+import { AppDispatch } from '../../redux/store';
+import { StudyUpdated } from '../../redux/reducer.type';
+import { AppState } from '../../redux/app-state.type';
+
 interface UseComputingStatusProps {
     (
         studyUuid: UUID,

src/components/custom-aggrid/custom-aggrid-filters/custom-aggrid-autocomplete-filter.tsx

@@ -8,8 +8,8 @@ import React, { FunctionComponent, SyntheticEvent, useCallback, useEffect, useSt
 import { Autocomplete, TextField } from '@mui/material';
 import { useIntl } from 'react-intl';
 import { useCustomAggridFilter } from './hooks/use-custom-aggrid-filter';
-import { CustomAggridFilterParams, FILTER_TEXT_COMPARATORS } from '../custom-aggrid-header.type';
 import { isNonEmptyStringOrArray } from '../../../utils/types-utils';
+import { CustomAggridFilterParams, FILTER_TEXT_COMPARATORS } from './custom-aggrid-filter.type';
 
 export interface CustomAggridAutocompleteFilterParams extends CustomAggridFilterParams {
     getOptionLabel?: (value: string) => string; // Used for translation of enum values in the filter

src/components/custom-aggrid/custom-aggrid-filters/custom-aggrid-boolean-filter.tsx

@@ -12,9 +12,9 @@ import { useIntl } from 'react-intl';
 import { SelectChangeEvent } from '@mui/material/Select/SelectInput';
 import { mergeSx } from 'components/utils/functions';
 import { useCustomAggridFilter } from './hooks/use-custom-aggrid-filter';
-import { CustomAggridFilterParams, FILTER_DATA_TYPES, FILTER_TEXT_COMPARATORS } from '../custom-aggrid-header.type';
 import { isNonEmptyStringOrArray } from '../../../utils/types-utils';
 import { BooleanFilterValue } from './utils/aggrid-filters-utils';
+import { CustomAggridFilterParams, FILTER_DATA_TYPES, FILTER_TEXT_COMPARATORS } from './custom-aggrid-filter.type';
 
 const styles = {
     input: {

src/components/custom-aggrid/custom-aggrid-filters/custom-aggrid-comparator-filter.tsx

@@ -8,7 +8,8 @@ import { CustomAggridComparatorSelector } from './custom-aggrid-comparator-selec
 import { CustomAggridTextFilter } from './custom-aggrid-text-filter';
 import { Grid } from '@mui/material';
 import { useCustomAggridComparatorFilter } from './hooks/use-custom-aggrid-comparator-filter';
-import { CustomAggridFilterParams } from '../custom-aggrid-header.type';
+
+import { CustomAggridFilterParams } from './custom-aggrid-filter.type';
 
 export const CustomAggridComparatorFilter = ({ api, colId, filterParams }: CustomAggridFilterParams) => {
     const {

src/components/custom-aggrid/custom-aggrid-filters/custom-aggrid-duration-filter.tsx

@@ -8,10 +8,10 @@ import { ChangeEvent, FunctionComponent, useCallback, useEffect, useState } from
 import { Grid, IconButton, InputAdornment, TextField, Typography } from '@mui/material';
 import { useIntl } from 'react-intl';
 import ClearIcon from '@mui/icons-material/Clear';
-import { CustomAggridFilterParams } from '../custom-aggrid-header.type';
 import { CustomAggridComparatorSelector } from './custom-aggrid-comparator-selector';
 import { SelectChangeEvent } from '@mui/material/Select/SelectInput';
 import { useCustomAggridFilter } from './hooks/use-custom-aggrid-filter';
+import { CustomAggridFilterParams } from './custom-aggrid-filter.type';
 
 const styles = {
     containerStyle: {

src/components/custom-aggrid/custom-aggrid-filters/custom-aggrid-filter.tsx

@@ -6,10 +6,10 @@
  */
 import React, { ComponentType, MouseEvent, useMemo, useState } from 'react';
 import { Popover } from '@mui/material';
-import { CustomAggridFilterParams } from '../custom-aggrid-header.type';
 import { CustomFilterIcon } from './custom-filter-icon';
 import { useCustomAggridFilter } from './hooks/use-custom-aggrid-filter';
 import { CustomAggridAutocompleteFilterParams } from './custom-aggrid-autocomplete-filter';
+import { CustomAggridFilterParams } from './custom-aggrid-filter.type';
 
 const styles = {
     input: {