Add Chart for limits set to vizualise limits distribution

package.json

@@ -16,6 +16,7 @@
         "@mui/icons-material": "^5.16.14",
         "@mui/lab": "5.0.0-alpha.175",
         "@mui/material": "^5.16.14",
+        "@mui/x-charts": "^7.25.0",
         "@mui/x-tree-view": "^6.17.0",
         "@powsybl/network-viewer": "1.7.0",
         "@reduxjs/toolkit": "^2.5.1",

src/components/dialogs/limits/limits-side-pane.tsx

@@ -24,6 +24,7 @@ import { TemporaryLimit } from '../../../services/network-modification-types';
 import DndTable from '../../utils/dnd-table/dnd-table';
 import TemporaryLimitsTable from './temporary-limits-table';
 import { CurrentTreeNode } from '../../../redux/reducer';
+import LimitsChart from './limitsChart';
 
 export interface LimitsSidePaneProps {
     limitsGroupFormName: string;
@@ -198,6 +199,9 @@ export function LimitsSidePane({
 
     return (
         <Box sx={{ p: 2 }}>
+            <Box>
+                <LimitsChart limitsGroupFormName={limitsGroupFormName} />
+            </Box>
             {permanentCurrentLimitField}
             <Box component={`h4`}>
                 <FormattedMessage id="TemporaryCurrentLimitsText" />