From 11f4627d2ee4de5502acdd4bdae2866dcafa44ea Mon Sep 17 00:00:00 2001 From: Caroline Jeandat Date: Mon, 8 Sep 2025 17:57:12 +0200 Subject: [PATCH 01/16] add tooltips for the limit reductions table --- .../limit-reduction-table-cell.tsx | 27 ++++++++--- .../limit-reduction-table-row.tsx | 7 +-- .../limit-reductions-table-form.tsx | 45 ++++++++++++------- .../custom-voltage-level-table.tsx | 9 +++- src/translations/en/parameters.ts | 8 ++-- src/translations/fr/parameters.ts | 6 ++- 6 files changed, 70 insertions(+), 32 deletions(-) diff --git a/src/components/parameters/common/limitreductions/limit-reduction-table-cell.tsx b/src/components/parameters/common/limitreductions/limit-reduction-table-cell.tsx index e52434a5..df19161c 100644 --- a/src/components/parameters/common/limitreductions/limit-reduction-table-cell.tsx +++ b/src/components/parameters/common/limitreductions/limit-reduction-table-cell.tsx @@ -6,23 +6,36 @@ */ import { TableCell } from '@mui/material'; -import { LimitReductionIColumnsDef, LIMIT_REDUCTIONS_FORM, VOLTAGE_LEVELS_FORM } from './columns-definitions'; +import { useIntl } from 'react-intl'; +import { LimitReductionIColumnsDef, LIMIT_REDUCTIONS_FORM, VOLTAGE_LEVELS_FORM, ILimitReductionsByVoltageLevel } from './columns-definitions'; import { FloatInput, RawReadOnlyInput } from '../../../inputs'; export function LimitReductionTableCell({ rowIndex, column, + limits }: Readonly<{ rowIndex: number; column: LimitReductionIColumnsDef; + limits: ILimitReductionsByVoltageLevel[]; }>) { - return ( - - {column.dataKey === VOLTAGE_LEVELS_FORM ? ( - - ) : ( - + const intl = useIntl(); + return column.dataKey === VOLTAGE_LEVELS_FORM ? ( + + + + ) : ( + + ); } diff --git a/src/components/parameters/common/limitreductions/limit-reduction-table-row.tsx b/src/components/parameters/common/limitreductions/limit-reduction-table-row.tsx index 6e4f8be6..a7e279d2 100644 --- a/src/components/parameters/common/limitreductions/limit-reduction-table-row.tsx +++ b/src/components/parameters/common/limitreductions/limit-reduction-table-row.tsx @@ -7,18 +7,19 @@ import { TableRow } from '@mui/material'; import { LimitReductionTableCell } from './limit-reduction-table-cell'; -import { LimitReductionIColumnsDef } from './columns-definitions'; +import { ILimitReductionsByVoltageLevel, LimitReductionIColumnsDef } from './columns-definitions'; interface TableRowComponentProps { columnsDefinition: LimitReductionIColumnsDef[]; index: number; + limits: ILimitReductionsByVoltageLevel[]; } -export function LimitReductionTableRow({ columnsDefinition, index }: Readonly) { +export function LimitReductionTableRow({ columnsDefinition, index, limits }: Readonly) { return ( {columnsDefinition.map((column: LimitReductionIColumnsDef) => ( - + ))} ); diff --git a/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx b/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx index cfc4e554..81d7896f 100644 --- a/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx +++ b/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx @@ -15,31 +15,43 @@ import { } from './columns-definitions'; import { CustomVoltageLevelTable } from '../voltage-level-table'; -const getLabelColumn = (limit: ITemporaryLimitReduction) => { - const lowBound = `${Math.trunc(limit.limitDuration.lowBound / 60)} min`; - const highBoundValue = Math.trunc(limit.limitDuration.highBound / 60); - const highBound = highBoundValue === 0 ? '∞' : `${Math.trunc(limit.limitDuration.highBound / 60)} min`; - const lowerBoundClosed = limit.limitDuration.lowClosed ? '[' : ']'; - const highBoundClosed = limit.limitDuration.highClosed || null ? ']' : '['; - return `${lowerBoundClosed}${lowBound}, ${highBound}${highBoundClosed}`; -}; - export function LimitReductionsTableForm({ limits }: Readonly<{ limits: ILimitReductionsByVoltageLevel[] }>) { const intl = useIntl(); - const getToolTipColumn = useCallback( + const getLabelColumn = useCallback( (limit: ITemporaryLimitReduction) => { - const lowBound = Math.trunc(limit.limitDuration.lowBound / 60); - const highBound = Math.trunc(limit.limitDuration.highBound / 60); + const highBound = Math.trunc(limit.limitDuration.lowBound / 60); + const lowBound = Math.trunc(limit.limitDuration.highBound / 60); + if (lowBound === 0) { - return intl.formatMessage({ id: 'LimitDurationAfterIST' }, { value: highBound }); + return intl.formatMessage({ id: 'LimitVoltageAfterIST' }, { highBound: `${highBound}` }); } + return intl.formatMessage( + { id: 'LimitVoltageInterval' }, + { + lowBound: `${lowBound}`, + highBound: `${highBound}`, + } + ); + }, + [intl] + ); + + const getToolTipColumn = useCallback( + (limit: ITemporaryLimitReduction) => { + const lowBound = `${Math.trunc(limit.limitDuration.lowBound / 60)} min`; + const highBoundValue = Math.trunc(limit.limitDuration.highBound / 60); + const highBound = highBoundValue === 0 ? '∞' : `${Math.trunc(limit.limitDuration.highBound / 60)} min`; + const lowerBoundClosed = limit.limitDuration.lowClosed ? '[' : ']'; + const higherBoundClosed = limit.limitDuration.highClosed || null ? ']' : '['; return intl.formatMessage( { id: 'LimitDurationInterval' }, { - lowBound: `IT${lowBound}`, - highBound: highBound === 0 ? 'IST' : `IT${highBound}`, + lowBound: `${lowBound}`, + highBound: `${highBound}`, + higherBoundClosed: `${higherBoundClosed}`, + lowerBoundClosed: `${lowerBoundClosed}`, } ); }, @@ -64,13 +76,14 @@ export function LimitReductionsTableForm({ limits }: Readonly<{ limits: ILimitRe } return columnsDef; - }, [intl, limits, getToolTipColumn]); + }, [intl, limits, getLabelColumn, getToolTipColumn]); return ( ); } diff --git a/src/components/parameters/common/voltage-level-table/custom-voltage-level-table.tsx b/src/components/parameters/common/voltage-level-table/custom-voltage-level-table.tsx index 2c5f2633..7e7bb537 100644 --- a/src/components/parameters/common/voltage-level-table/custom-voltage-level-table.tsx +++ b/src/components/parameters/common/voltage-level-table/custom-voltage-level-table.tsx @@ -7,7 +7,11 @@ import { Table, TableBody, TableCell, TableContainer, TableHead, TableRow } from '@mui/material'; import { useMemo } from 'react'; import { useFieldArray } from 'react-hook-form'; -import { LimitReductionIColumnsDef, LIMIT_REDUCTIONS_FORM } from '../limitreductions/columns-definitions'; +import { + LimitReductionIColumnsDef, + LIMIT_REDUCTIONS_FORM, + ILimitReductionsByVoltageLevel, +} from '../limitreductions/columns-definitions'; import { LimitReductionTableRow } from '../limitreductions/limit-reduction-table-row'; import { CustomVoltageLevelTableRow } from './custom-voltage-level-table-row'; @@ -15,12 +19,14 @@ interface LimitReductionsTableProps { columnsDefinition: LimitReductionIColumnsDef[]; tableHeight: number; formName: string; + limits?: ILimitReductionsByVoltageLevel[]; } export function CustomVoltageLevelTable({ formName, columnsDefinition, tableHeight, + limits }: Readonly) { const { fields: rows } = useFieldArray({ name: formName, @@ -62,6 +68,7 @@ export function CustomVoltageLevelTable({ columnsDefinition={columnsDefinition} index={index} formName={formName} + limits={limits} /> ))} diff --git a/src/translations/en/parameters.ts b/src/translations/en/parameters.ts index aee72a91..104efa13 100644 --- a/src/translations/en/parameters.ts +++ b/src/translations/en/parameters.ts @@ -56,10 +56,12 @@ export const parametersEn = { General: 'General', LimitReductions: 'Limit reductions', - IST: 'IST', - LimitDurationInterval: 'Between {highBound} and {lowBound}', - LimitDurationAfterIST: 'Beyond IT{value}', + IST: 'PATL', + LimitVoltageInterval: 'Between TATL{lowBound} and TATL{highBound}', + LimitVoltageAfterIST: 'Between PATL and TATL{highBound}', + LimitDurationInterval: 'Duration {lowerBoundClosed}{lowBound}, {highBound}{higherBoundClosed}', voltageRange: 'Voltage range', + VoltageRangeInterval: 'Voltage range interval [{lowBound} kV,{highBound} kV]', Provider: 'Provider', LimitReduction: 'Limit reduction', diff --git a/src/translations/fr/parameters.ts b/src/translations/fr/parameters.ts index 3e42abe4..5d853235 100644 --- a/src/translations/fr/parameters.ts +++ b/src/translations/fr/parameters.ts @@ -59,9 +59,11 @@ export const parametersFr = { General: 'Général', LimitReductions: 'Abattements', IST: 'IST', - LimitDurationInterval: 'Entre {highBound} et {lowBound}', - LimitDurationAfterIST: 'Au-delà de IT{value}', + LimitVoltageInterval: 'Entre IT{lowBound} et IT{highBound}', + LimitVoltageAfterIST: 'Entre IST et IT{highBound}', + LimitDurationInterval: 'Tempo {lowerBoundClosed}{lowBound}, {highBound}{higherBoundClosed}', voltageRange: 'Niveau de tension', + VoltageRangeInterval: 'Plage de tension [{lowBound} kV,{highBound} kV]', Provider: 'Simulateur', LimitReduction: 'Abattement des seuils', From b147d78450413215f285c354d7b3f7190c9f10d0 Mon Sep 17 00:00:00 2001 From: Caroline Jeandat Date: Mon, 8 Sep 2025 18:05:30 +0200 Subject: [PATCH 02/16] fix translation --- src/translations/en/parameters.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/translations/en/parameters.ts b/src/translations/en/parameters.ts index 104efa13..050cdd19 100644 --- a/src/translations/en/parameters.ts +++ b/src/translations/en/parameters.ts @@ -61,7 +61,7 @@ export const parametersEn = { LimitVoltageAfterIST: 'Between PATL and TATL{highBound}', LimitDurationInterval: 'Duration {lowerBoundClosed}{lowBound}, {highBound}{higherBoundClosed}', voltageRange: 'Voltage range', - VoltageRangeInterval: 'Voltage range interval [{lowBound} kV,{highBound} kV]', + VoltageRangeInterval: 'Voltage interval [{lowBound} kV,{highBound} kV]', Provider: 'Provider', LimitReduction: 'Limit reduction', From 25d50e8805650cf091ebb4bb1bfb6d525f958ca4 Mon Sep 17 00:00:00 2001 From: Caroline Jeandat Date: Tue, 9 Sep 2025 10:25:26 +0200 Subject: [PATCH 03/16] remove capitalization --- .../security-analysis/security-analysis-parameters-selector.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/parameters/security-analysis/security-analysis-parameters-selector.tsx b/src/components/parameters/security-analysis/security-analysis-parameters-selector.tsx index 6f3e1ba2..3727862d 100644 --- a/src/components/parameters/security-analysis/security-analysis-parameters-selector.tsx +++ b/src/components/parameters/security-analysis/security-analysis-parameters-selector.tsx @@ -61,7 +61,6 @@ export function SecurityAnalysisParametersSelector({ sx={{ fontSize: 17, fontWeight: 'bold', - textTransform: 'capitalize', }} /> ) From ce9abbae0b39bbadfb731060956588a4d3619e64 Mon Sep 17 00:00:00 2001 From: Caroline Jeandat Date: Tue, 9 Sep 2025 10:42:00 +0200 Subject: [PATCH 04/16] fix --- .../common/voltage-level-table/custom-voltage-level-table.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/parameters/common/voltage-level-table/custom-voltage-level-table.tsx b/src/components/parameters/common/voltage-level-table/custom-voltage-level-table.tsx index 7e7bb537..37a327b4 100644 --- a/src/components/parameters/common/voltage-level-table/custom-voltage-level-table.tsx +++ b/src/components/parameters/common/voltage-level-table/custom-voltage-level-table.tsx @@ -19,14 +19,14 @@ interface LimitReductionsTableProps { columnsDefinition: LimitReductionIColumnsDef[]; tableHeight: number; formName: string; - limits?: ILimitReductionsByVoltageLevel[]; + limits: ILimitReductionsByVoltageLevel[]; } export function CustomVoltageLevelTable({ formName, columnsDefinition, tableHeight, - limits + limits, }: Readonly) { const { fields: rows } = useFieldArray({ name: formName, From d75ef0286d2d1669ddc40e0cb57e40613a27c3ec Mon Sep 17 00:00:00 2001 From: Caroline Jeandat Date: Tue, 9 Sep 2025 10:45:19 +0200 Subject: [PATCH 05/16] prettier fix --- .../limitreductions/limit-reduction-table-cell.tsx | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/src/components/parameters/common/limitreductions/limit-reduction-table-cell.tsx b/src/components/parameters/common/limitreductions/limit-reduction-table-cell.tsx index df19161c..dab78256 100644 --- a/src/components/parameters/common/limitreductions/limit-reduction-table-cell.tsx +++ b/src/components/parameters/common/limitreductions/limit-reduction-table-cell.tsx @@ -7,13 +7,18 @@ import { TableCell } from '@mui/material'; import { useIntl } from 'react-intl'; -import { LimitReductionIColumnsDef, LIMIT_REDUCTIONS_FORM, VOLTAGE_LEVELS_FORM, ILimitReductionsByVoltageLevel } from './columns-definitions'; +import { + LimitReductionIColumnsDef, + LIMIT_REDUCTIONS_FORM, + VOLTAGE_LEVELS_FORM, + ILimitReductionsByVoltageLevel, +} from './columns-definitions'; import { FloatInput, RawReadOnlyInput } from '../../../inputs'; export function LimitReductionTableCell({ rowIndex, column, - limits + limits, }: Readonly<{ rowIndex: number; column: LimitReductionIColumnsDef; From cb23f1e88dde8fa9c7f7c81baf774b927dc75c25 Mon Sep 17 00:00:00 2001 From: Caroline Jeandat Date: Thu, 11 Sep 2025 10:09:03 +0200 Subject: [PATCH 06/16] return react elements --- .../limitreductions/columns-definitions.ts | 4 +- .../limit-reduction-table-cell.tsx | 30 +++---- .../limit-reductions-table-form.tsx | 79 +++++++++---------- .../custom-voltage-level-table.tsx | 21 ++--- src/translations/en/parameters.ts | 2 +- src/translations/fr/parameters.ts | 2 +- 6 files changed, 70 insertions(+), 68 deletions(-) diff --git a/src/components/parameters/common/limitreductions/columns-definitions.ts b/src/components/parameters/common/limitreductions/columns-definitions.ts index 43c798ee..8c486026 100644 --- a/src/components/parameters/common/limitreductions/columns-definitions.ts +++ b/src/components/parameters/common/limitreductions/columns-definitions.ts @@ -69,9 +69,9 @@ export const TAB_INFO = [ ]; export interface LimitReductionIColumnsDef { - label: string; + label: React.ReactNode; dataKey: string; - tooltip: string; + tooltip: React.ReactNode; width?: string; } diff --git a/src/components/parameters/common/limitreductions/limit-reduction-table-cell.tsx b/src/components/parameters/common/limitreductions/limit-reduction-table-cell.tsx index dab78256..8b905839 100644 --- a/src/components/parameters/common/limitreductions/limit-reduction-table-cell.tsx +++ b/src/components/parameters/common/limitreductions/limit-reduction-table-cell.tsx @@ -5,8 +5,8 @@ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ -import { TableCell } from '@mui/material'; -import { useIntl } from 'react-intl'; +import { TableCell, Tooltip } from '@mui/material'; +import { FormattedMessage } from 'react-intl'; import { LimitReductionIColumnsDef, LIMIT_REDUCTIONS_FORM, @@ -24,20 +24,22 @@ export function LimitReductionTableCell({ column: LimitReductionIColumnsDef; limits: ILimitReductionsByVoltageLevel[]; }>) { - const intl = useIntl(); return column.dataKey === VOLTAGE_LEVELS_FORM ? ( - + } > - - + + + + ) : ( diff --git a/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx b/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx index 81d7896f..d47eee15 100644 --- a/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx +++ b/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx @@ -4,8 +4,8 @@ * 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 { useCallback, useMemo } from 'react'; -import { useIntl } from 'react-intl'; +import { useMemo } from 'react'; +import { FormattedMessage, useIntl } from 'react-intl'; import { COLUMNS_DEFINITIONS_LIMIT_REDUCTIONS, ILimitReductionsByVoltageLevel, @@ -15,48 +15,47 @@ import { } from './columns-definitions'; import { CustomVoltageLevelTable } from '../voltage-level-table'; -export function LimitReductionsTableForm({ limits }: Readonly<{ limits: ILimitReductionsByVoltageLevel[] }>) { - const intl = useIntl(); - - const getLabelColumn = useCallback( - (limit: ITemporaryLimitReduction) => { - const highBound = Math.trunc(limit.limitDuration.lowBound / 60); - const lowBound = Math.trunc(limit.limitDuration.highBound / 60); +const getLabelColumn = (limit: ITemporaryLimitReduction) => { + const highBound = Math.trunc(limit.limitDuration.lowBound / 60); + const lowBound = Math.trunc(limit.limitDuration.highBound / 60); - if (lowBound === 0) { - return intl.formatMessage({ id: 'LimitVoltageAfterIST' }, { highBound: `${highBound}` }); - } + if (lowBound === 0) { + return ; + // return intl.formatMessage({ id: 'LimitVoltageAfterIST' }, { highBound: `${highBound}` }); + } - return intl.formatMessage( - { id: 'LimitVoltageInterval' }, - { - lowBound: `${lowBound}`, - highBound: `${highBound}`, - } - ); - }, - [intl] + return ( + ); +}; - const getToolTipColumn = useCallback( - (limit: ITemporaryLimitReduction) => { - const lowBound = `${Math.trunc(limit.limitDuration.lowBound / 60)} min`; - const highBoundValue = Math.trunc(limit.limitDuration.highBound / 60); - const highBound = highBoundValue === 0 ? '∞' : `${Math.trunc(limit.limitDuration.highBound / 60)} min`; - const lowerBoundClosed = limit.limitDuration.lowClosed ? '[' : ']'; - const higherBoundClosed = limit.limitDuration.highClosed || null ? ']' : '['; - return intl.formatMessage( - { id: 'LimitDurationInterval' }, - { - lowBound: `${lowBound}`, - highBound: `${highBound}`, - higherBoundClosed: `${higherBoundClosed}`, - lowerBoundClosed: `${lowerBoundClosed}`, - } - ); - }, - [intl] +const getToolTipColumn = (limit: ITemporaryLimitReduction) => { + const lowBound = `${Math.trunc(limit.limitDuration.lowBound / 60)} min`; + const highBoundValue = Math.trunc(limit.limitDuration.highBound / 60); + const highBound = highBoundValue === 0 ? '∞' : `${Math.trunc(limit.limitDuration.highBound / 60)} min`; + const lowerBoundClosed = limit.limitDuration.lowClosed ? '[' : ']'; + const higherBoundClosed = limit.limitDuration.highClosed || null ? ']' : '['; + return ( + ); +}; + +export function LimitReductionsTableForm({ limits }: Readonly<{ limits: ILimitReductionsByVoltageLevel[] }>) { + const intl = useIntl(); const columnsDefinition = useMemo(() => { const columnsDef = COLUMNS_DEFINITIONS_LIMIT_REDUCTIONS.map((column) => ({ @@ -76,7 +75,7 @@ export function LimitReductionsTableForm({ limits }: Readonly<{ limits: ILimitRe } return columnsDef; - }, [intl, limits, getLabelColumn, getToolTipColumn]); + }, [intl, limits]); return ( {columnsDefinition.map((column) => ( - - {column.label} - + + + {column.label} + + ))} diff --git a/src/translations/en/parameters.ts b/src/translations/en/parameters.ts index 050cdd19..34fc4fcc 100644 --- a/src/translations/en/parameters.ts +++ b/src/translations/en/parameters.ts @@ -61,7 +61,7 @@ export const parametersEn = { LimitVoltageAfterIST: 'Between PATL and TATL{highBound}', LimitDurationInterval: 'Duration {lowerBoundClosed}{lowBound}, {highBound}{higherBoundClosed}', voltageRange: 'Voltage range', - VoltageRangeInterval: 'Voltage interval [{lowBound} kV,{highBound} kV]', + VoltageRangeInterval: 'Voltage interval ]{lowBound} kV,{highBound} kV]', Provider: 'Provider', LimitReduction: 'Limit reduction', diff --git a/src/translations/fr/parameters.ts b/src/translations/fr/parameters.ts index 5d853235..2541e719 100644 --- a/src/translations/fr/parameters.ts +++ b/src/translations/fr/parameters.ts @@ -63,7 +63,7 @@ export const parametersFr = { LimitVoltageAfterIST: 'Entre IST et IT{highBound}', LimitDurationInterval: 'Tempo {lowerBoundClosed}{lowBound}, {highBound}{higherBoundClosed}', voltageRange: 'Niveau de tension', - VoltageRangeInterval: 'Plage de tension [{lowBound} kV,{highBound} kV]', + VoltageRangeInterval: 'Plage de tension ]{lowBound} kV,{highBound} kV]', Provider: 'Simulateur', LimitReduction: 'Abattement des seuils', From a256a369206bc86bd93beebc723ebbac2a82a051 Mon Sep 17 00:00:00 2001 From: Caroline Jeandat Date: Thu, 11 Sep 2025 10:19:08 +0200 Subject: [PATCH 07/16] change label type --- .../common/limitreductions/columns-definitions.ts | 4 ++-- .../limitreductions/limit-reductions-table-form.tsx | 10 ++++------ 2 files changed, 6 insertions(+), 8 deletions(-) diff --git a/src/components/parameters/common/limitreductions/columns-definitions.ts b/src/components/parameters/common/limitreductions/columns-definitions.ts index 8c486026..b6aea37a 100644 --- a/src/components/parameters/common/limitreductions/columns-definitions.ts +++ b/src/components/parameters/common/limitreductions/columns-definitions.ts @@ -69,9 +69,9 @@ export const TAB_INFO = [ ]; export interface LimitReductionIColumnsDef { - label: React.ReactNode; + label: string | React.ReactNode; dataKey: string; - tooltip: React.ReactNode; + tooltip: string | React.ReactNode; width?: string; } diff --git a/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx b/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx index d47eee15..c560a919 100644 --- a/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx +++ b/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx @@ -5,7 +5,7 @@ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ import { useMemo } from 'react'; -import { FormattedMessage, useIntl } from 'react-intl'; +import { FormattedMessage } from 'react-intl'; import { COLUMNS_DEFINITIONS_LIMIT_REDUCTIONS, ILimitReductionsByVoltageLevel, @@ -55,13 +55,11 @@ const getToolTipColumn = (limit: ITemporaryLimitReduction) => { }; export function LimitReductionsTableForm({ limits }: Readonly<{ limits: ILimitReductionsByVoltageLevel[] }>) { - const intl = useIntl(); - const columnsDefinition = useMemo(() => { const columnsDef = COLUMNS_DEFINITIONS_LIMIT_REDUCTIONS.map((column) => ({ ...column, - label: intl.formatMessage({ id: column.label }), - tooltip: intl.formatMessage({ id: column.tooltip }), + label: column.label, + tooltip: column.tooltip, })); if (limits !== null && limits.length > 0) { @@ -75,7 +73,7 @@ export function LimitReductionsTableForm({ limits }: Readonly<{ limits: ILimitRe } return columnsDef; - }, [intl, limits]); + }, [limits]); return ( Date: Thu, 11 Sep 2025 10:20:17 +0200 Subject: [PATCH 08/16] change label and tooltip type --- .../parameters/common/limitreductions/columns-definitions.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/parameters/common/limitreductions/columns-definitions.ts b/src/components/parameters/common/limitreductions/columns-definitions.ts index b6aea37a..8c486026 100644 --- a/src/components/parameters/common/limitreductions/columns-definitions.ts +++ b/src/components/parameters/common/limitreductions/columns-definitions.ts @@ -69,9 +69,9 @@ export const TAB_INFO = [ ]; export interface LimitReductionIColumnsDef { - label: string | React.ReactNode; + label: React.ReactNode; dataKey: string; - tooltip: string | React.ReactNode; + tooltip: React.ReactNode; width?: string; } From a8c3ed228aed767c9ddc22a0156e5dd5215b4fc0 Mon Sep 17 00:00:00 2001 From: Caroline Jeandat Date: Thu, 11 Sep 2025 10:30:31 +0200 Subject: [PATCH 09/16] remove comments --- .../common/limitreductions/limit-reductions-table-form.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx b/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx index c560a919..9ade7542 100644 --- a/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx +++ b/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx @@ -21,7 +21,6 @@ const getLabelColumn = (limit: ITemporaryLimitReduction) => { if (lowBound === 0) { return ; - // return intl.formatMessage({ id: 'LimitVoltageAfterIST' }, { highBound: `${highBound}` }); } return ( From dd47267154412dc21f82e281f16ef77882da1c8b Mon Sep 17 00:00:00 2001 From: Caroline Jeandat Date: Thu, 11 Sep 2025 13:03:54 +0200 Subject: [PATCH 10/16] create new files for components --- ...definitions.ts => columns-definitions.tsx} | 9 ++-- .../limit-reductions-label-column.tsx | 21 +++++++++ .../limit-reductions-table-form.tsx | 46 ++----------------- .../limit-reductions-tooltip-column.tsx | 27 +++++++++++ 4 files changed, 57 insertions(+), 46 deletions(-) rename src/components/parameters/common/limitreductions/{columns-definitions.ts => columns-definitions.tsx} (95%) create mode 100644 src/components/parameters/common/limitreductions/limit-reductions-label-column.tsx create mode 100644 src/components/parameters/common/limitreductions/limit-reductions-tooltip-column.tsx diff --git a/src/components/parameters/common/limitreductions/columns-definitions.ts b/src/components/parameters/common/limitreductions/columns-definitions.tsx similarity index 95% rename from src/components/parameters/common/limitreductions/columns-definitions.ts rename to src/components/parameters/common/limitreductions/columns-definitions.tsx index 8c486026..9eb41fab 100644 --- a/src/components/parameters/common/limitreductions/columns-definitions.ts +++ b/src/components/parameters/common/limitreductions/columns-definitions.tsx @@ -7,6 +7,7 @@ import { NumberSchema } from 'yup'; import { UUID } from 'crypto'; +import { FormattedMessage } from 'react-intl'; import yup from '../../../../utils/yupConfig'; import { PARAM_SA_FLOW_PROPORTIONAL_THRESHOLD, @@ -77,14 +78,14 @@ export interface LimitReductionIColumnsDef { export const COLUMNS_DEFINITIONS_LIMIT_REDUCTIONS: LimitReductionIColumnsDef[] = [ { - label: 'voltageRange', + label: , dataKey: VOLTAGE_LEVELS_FORM, - tooltip: 'voltageRange', + tooltip: , }, { - label: 'IST', + label: , dataKey: IST_FORM, - tooltip: 'IST', + tooltip: , }, ]; diff --git a/src/components/parameters/common/limitreductions/limit-reductions-label-column.tsx b/src/components/parameters/common/limitreductions/limit-reductions-label-column.tsx new file mode 100644 index 00000000..6216f6d3 --- /dev/null +++ b/src/components/parameters/common/limitreductions/limit-reductions-label-column.tsx @@ -0,0 +1,21 @@ +import { FormattedMessage } from 'react-intl'; +import { ITemporaryLimitReduction } from './columns-definitions'; + +export function LimitReductionsLabelColumn({ limitDuration }: ITemporaryLimitReduction) { + const highBound = Math.trunc(limitDuration.lowBound / 60); + const lowBound = Math.trunc(limitDuration.highBound / 60); + + if (lowBound === 0) { + return ; + } + + return ( + + ); +} \ No newline at end of file diff --git a/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx b/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx index 9ade7542..bc8ef783 100644 --- a/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx +++ b/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx @@ -5,53 +5,15 @@ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ import { useMemo } from 'react'; -import { FormattedMessage } from 'react-intl'; import { COLUMNS_DEFINITIONS_LIMIT_REDUCTIONS, ILimitReductionsByVoltageLevel, - ITemporaryLimitReduction, LIMIT_DURATION_FORM, LIMIT_REDUCTIONS_FORM, } from './columns-definitions'; import { CustomVoltageLevelTable } from '../voltage-level-table'; - -const getLabelColumn = (limit: ITemporaryLimitReduction) => { - const highBound = Math.trunc(limit.limitDuration.lowBound / 60); - const lowBound = Math.trunc(limit.limitDuration.highBound / 60); - - if (lowBound === 0) { - return ; - } - - return ( - - ); -}; - -const getToolTipColumn = (limit: ITemporaryLimitReduction) => { - const lowBound = `${Math.trunc(limit.limitDuration.lowBound / 60)} min`; - const highBoundValue = Math.trunc(limit.limitDuration.highBound / 60); - const highBound = highBoundValue === 0 ? '∞' : `${Math.trunc(limit.limitDuration.highBound / 60)} min`; - const lowerBoundClosed = limit.limitDuration.lowClosed ? '[' : ']'; - const higherBoundClosed = limit.limitDuration.highClosed || null ? ']' : '['; - return ( - - ); -}; +import { LimitReductionsToolTipColumn } from './limit-reductions-tooltip-column'; +import { LimitReductionsLabelColumn } from './limit-reductions-label-column'; export function LimitReductionsTableForm({ limits }: Readonly<{ limits: ILimitReductionsByVoltageLevel[] }>) { const columnsDefinition = useMemo(() => { @@ -64,9 +26,9 @@ export function LimitReductionsTableForm({ limits }: Readonly<{ limits: ILimitRe if (limits !== null && limits.length > 0) { limits[0].temporaryLimitReductions.forEach((tlimit, index) => { columnsDef.push({ - label: getLabelColumn(tlimit), + label: LimitReductionsLabelColumn(tlimit), dataKey: LIMIT_DURATION_FORM + index, - tooltip: getToolTipColumn(tlimit), + tooltip: LimitReductionsToolTipColumn(tlimit), }); }); } diff --git a/src/components/parameters/common/limitreductions/limit-reductions-tooltip-column.tsx b/src/components/parameters/common/limitreductions/limit-reductions-tooltip-column.tsx new file mode 100644 index 00000000..a0a9aec0 --- /dev/null +++ b/src/components/parameters/common/limitreductions/limit-reductions-tooltip-column.tsx @@ -0,0 +1,27 @@ +/** + * Copyright (c) 2024, RTE (http://www.rte-france.com) + * This Source Code Form is subject to the terms of the Mozilla Public + * 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 { FormattedMessage } from 'react-intl'; +import { ITemporaryLimitReduction } from './columns-definitions'; + +export function LimitReductionsToolTipColumn({ limitDuration }: ITemporaryLimitReduction) { + const lowBound = `${Math.trunc(limitDuration.lowBound / 60)} min`; + const highBoundValue = Math.trunc(limitDuration.highBound / 60); + const highBound = highBoundValue === 0 ? '∞' : `${Math.trunc(limitDuration.highBound / 60)} min`; + const lowerBoundClosed = limitDuration.lowClosed ? '[' : ']'; + const higherBoundClosed = limitDuration.highClosed || null ? ']' : '['; + return ( + + ); +} From 7c627e3a766476d9f5f3d53119c358ac1c5f65d6 Mon Sep 17 00:00:00 2001 From: Caroline Jeandat Date: Thu, 11 Sep 2025 13:22:26 +0200 Subject: [PATCH 11/16] fix --- .../{columns-definitions.tsx => columns-definitions.ts} | 9 ++++----- .../common/limitreductions/limit-reductions-form-util.ts | 1 + .../limitreductions/limit-reductions-label-column.tsx | 9 ++++++++- .../limitreductions/limit-reductions-table-form.tsx | 6 ++++-- .../limitreductions/limit-reductions-tooltip-column.tsx | 1 + 5 files changed, 18 insertions(+), 8 deletions(-) rename src/components/parameters/common/limitreductions/{columns-definitions.tsx => columns-definitions.ts} (95%) diff --git a/src/components/parameters/common/limitreductions/columns-definitions.tsx b/src/components/parameters/common/limitreductions/columns-definitions.ts similarity index 95% rename from src/components/parameters/common/limitreductions/columns-definitions.tsx rename to src/components/parameters/common/limitreductions/columns-definitions.ts index 9eb41fab..8c486026 100644 --- a/src/components/parameters/common/limitreductions/columns-definitions.tsx +++ b/src/components/parameters/common/limitreductions/columns-definitions.ts @@ -7,7 +7,6 @@ import { NumberSchema } from 'yup'; import { UUID } from 'crypto'; -import { FormattedMessage } from 'react-intl'; import yup from '../../../../utils/yupConfig'; import { PARAM_SA_FLOW_PROPORTIONAL_THRESHOLD, @@ -78,14 +77,14 @@ export interface LimitReductionIColumnsDef { export const COLUMNS_DEFINITIONS_LIMIT_REDUCTIONS: LimitReductionIColumnsDef[] = [ { - label: , + label: 'voltageRange', dataKey: VOLTAGE_LEVELS_FORM, - tooltip: , + tooltip: 'voltageRange', }, { - label: , + label: 'IST', dataKey: IST_FORM, - tooltip: , + tooltip: 'IST', }, ]; diff --git a/src/components/parameters/common/limitreductions/limit-reductions-form-util.ts b/src/components/parameters/common/limitreductions/limit-reductions-form-util.ts index 851940aa..784c172b 100644 --- a/src/components/parameters/common/limitreductions/limit-reductions-form-util.ts +++ b/src/components/parameters/common/limitreductions/limit-reductions-form-util.ts @@ -4,6 +4,7 @@ * 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 { ILimitReductionsByVoltageLevel, ISAParameters, diff --git a/src/components/parameters/common/limitreductions/limit-reductions-label-column.tsx b/src/components/parameters/common/limitreductions/limit-reductions-label-column.tsx index 6216f6d3..0b1100be 100644 --- a/src/components/parameters/common/limitreductions/limit-reductions-label-column.tsx +++ b/src/components/parameters/common/limitreductions/limit-reductions-label-column.tsx @@ -1,3 +1,10 @@ +/** + * Copyright (c) 2024, RTE (http://www.rte-france.com) + * This Source Code Form is subject to the terms of the Mozilla Public + * 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 { FormattedMessage } from 'react-intl'; import { ITemporaryLimitReduction } from './columns-definitions'; @@ -18,4 +25,4 @@ export function LimitReductionsLabelColumn({ limitDuration }: ITemporaryLimitRed }} /> ); -} \ No newline at end of file +} diff --git a/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx b/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx index bc8ef783..faf2081f 100644 --- a/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx +++ b/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx @@ -4,7 +4,9 @@ * 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 { useMemo } from 'react'; +import { FormattedMessage } from 'react-intl'; import { COLUMNS_DEFINITIONS_LIMIT_REDUCTIONS, ILimitReductionsByVoltageLevel, @@ -19,8 +21,8 @@ export function LimitReductionsTableForm({ limits }: Readonly<{ limits: ILimitRe const columnsDefinition = useMemo(() => { const columnsDef = COLUMNS_DEFINITIONS_LIMIT_REDUCTIONS.map((column) => ({ ...column, - label: column.label, - tooltip: column.tooltip, + label: , + tooltip: , })); if (limits !== null && limits.length > 0) { diff --git a/src/components/parameters/common/limitreductions/limit-reductions-tooltip-column.tsx b/src/components/parameters/common/limitreductions/limit-reductions-tooltip-column.tsx index a0a9aec0..7add0597 100644 --- a/src/components/parameters/common/limitreductions/limit-reductions-tooltip-column.tsx +++ b/src/components/parameters/common/limitreductions/limit-reductions-tooltip-column.tsx @@ -4,6 +4,7 @@ * 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 { FormattedMessage } from 'react-intl'; import { ITemporaryLimitReduction } from './columns-definitions'; From 4798e889ce13064ceed3195c2cbaf2b888b52146 Mon Sep 17 00:00:00 2001 From: Caroline Jeandat Date: Thu, 11 Sep 2025 13:42:46 +0200 Subject: [PATCH 12/16] clean --- .../common/limitreductions/limit-reductions-form-util.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/parameters/common/limitreductions/limit-reductions-form-util.ts b/src/components/parameters/common/limitreductions/limit-reductions-form-util.ts index 784c172b..851940aa 100644 --- a/src/components/parameters/common/limitreductions/limit-reductions-form-util.ts +++ b/src/components/parameters/common/limitreductions/limit-reductions-form-util.ts @@ -4,7 +4,6 @@ * 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 { ILimitReductionsByVoltageLevel, ISAParameters, From 5998bb51ff72a49d8e477b18e0245c2dbd0cb7f1 Mon Sep 17 00:00:00 2001 From: Caroline Jeandat Date: Thu, 11 Sep 2025 13:45:08 +0200 Subject: [PATCH 13/16] clean --- .../common/limitreductions/limit-reductions-label-column.tsx | 2 +- .../common/limitreductions/limit-reductions-tooltip-column.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/parameters/common/limitreductions/limit-reductions-label-column.tsx b/src/components/parameters/common/limitreductions/limit-reductions-label-column.tsx index 0b1100be..49e6159e 100644 --- a/src/components/parameters/common/limitreductions/limit-reductions-label-column.tsx +++ b/src/components/parameters/common/limitreductions/limit-reductions-label-column.tsx @@ -1,5 +1,5 @@ /** - * Copyright (c) 2024, RTE (http://www.rte-france.com) + * Copyright (c) 2025, RTE (http://www.rte-france.com) * This Source Code Form is subject to the terms of the Mozilla Public * 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/. diff --git a/src/components/parameters/common/limitreductions/limit-reductions-tooltip-column.tsx b/src/components/parameters/common/limitreductions/limit-reductions-tooltip-column.tsx index 7add0597..7dea5bd3 100644 --- a/src/components/parameters/common/limitreductions/limit-reductions-tooltip-column.tsx +++ b/src/components/parameters/common/limitreductions/limit-reductions-tooltip-column.tsx @@ -1,5 +1,5 @@ /** - * Copyright (c) 2024, RTE (http://www.rte-france.com) + * Copyright (c) 2025, RTE (http://www.rte-france.com) * This Source Code Form is subject to the terms of the Mozilla Public * 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/. From 8bd9f61c487145ca3766459abee57e562ef18a47 Mon Sep 17 00:00:00 2001 From: Caroline Jeandat Date: Thu, 11 Sep 2025 15:49:25 +0200 Subject: [PATCH 14/16] put readonly --- .../common/limitreductions/limit-reductions-label-column.tsx | 2 +- .../common/limitreductions/limit-reductions-tooltip-column.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/parameters/common/limitreductions/limit-reductions-label-column.tsx b/src/components/parameters/common/limitreductions/limit-reductions-label-column.tsx index 49e6159e..3ef4b314 100644 --- a/src/components/parameters/common/limitreductions/limit-reductions-label-column.tsx +++ b/src/components/parameters/common/limitreductions/limit-reductions-label-column.tsx @@ -8,7 +8,7 @@ import { FormattedMessage } from 'react-intl'; import { ITemporaryLimitReduction } from './columns-definitions'; -export function LimitReductionsLabelColumn({ limitDuration }: ITemporaryLimitReduction) { +export function LimitReductionsLabelColumn({ limitDuration }: Readonly) { const highBound = Math.trunc(limitDuration.lowBound / 60); const lowBound = Math.trunc(limitDuration.highBound / 60); diff --git a/src/components/parameters/common/limitreductions/limit-reductions-tooltip-column.tsx b/src/components/parameters/common/limitreductions/limit-reductions-tooltip-column.tsx index 7dea5bd3..ab0fc637 100644 --- a/src/components/parameters/common/limitreductions/limit-reductions-tooltip-column.tsx +++ b/src/components/parameters/common/limitreductions/limit-reductions-tooltip-column.tsx @@ -8,7 +8,7 @@ import { FormattedMessage } from 'react-intl'; import { ITemporaryLimitReduction } from './columns-definitions'; -export function LimitReductionsToolTipColumn({ limitDuration }: ITemporaryLimitReduction) { +export function LimitReductionsToolTipColumn({ limitDuration }: Readonly) { const lowBound = `${Math.trunc(limitDuration.lowBound / 60)} min`; const highBoundValue = Math.trunc(limitDuration.highBound / 60); const highBound = highBoundValue === 0 ? '∞' : `${Math.trunc(limitDuration.highBound / 60)} min`; From a962edb94141afc95adc93edc0ff4edbb1c7ca7c Mon Sep 17 00:00:00 2001 From: Caroline Jeandat Date: Thu, 11 Sep 2025 17:03:55 +0200 Subject: [PATCH 15/16] readonly prop --- .../limit-reductions-label-column.tsx | 10 +++++++--- .../limit-reductions-tooltip-column.tsx | 16 ++++++++++------ 2 files changed, 17 insertions(+), 9 deletions(-) diff --git a/src/components/parameters/common/limitreductions/limit-reductions-label-column.tsx b/src/components/parameters/common/limitreductions/limit-reductions-label-column.tsx index 3ef4b314..9265057a 100644 --- a/src/components/parameters/common/limitreductions/limit-reductions-label-column.tsx +++ b/src/components/parameters/common/limitreductions/limit-reductions-label-column.tsx @@ -8,9 +8,13 @@ import { FormattedMessage } from 'react-intl'; import { ITemporaryLimitReduction } from './columns-definitions'; -export function LimitReductionsLabelColumn({ limitDuration }: Readonly) { - const highBound = Math.trunc(limitDuration.lowBound / 60); - const lowBound = Math.trunc(limitDuration.highBound / 60); +type LimitReductionsLabelColumnProps = { + limits: ITemporaryLimitReduction; +}; + +export function LimitReductionsLabelColumn({ limits }: Readonly) { + const highBound = Math.trunc(limits.limitDuration.lowBound / 60); + const lowBound = Math.trunc(limits.limitDuration.highBound / 60); if (lowBound === 0) { return ; diff --git a/src/components/parameters/common/limitreductions/limit-reductions-tooltip-column.tsx b/src/components/parameters/common/limitreductions/limit-reductions-tooltip-column.tsx index ab0fc637..423d15cf 100644 --- a/src/components/parameters/common/limitreductions/limit-reductions-tooltip-column.tsx +++ b/src/components/parameters/common/limitreductions/limit-reductions-tooltip-column.tsx @@ -8,12 +8,16 @@ import { FormattedMessage } from 'react-intl'; import { ITemporaryLimitReduction } from './columns-definitions'; -export function LimitReductionsToolTipColumn({ limitDuration }: Readonly) { - const lowBound = `${Math.trunc(limitDuration.lowBound / 60)} min`; - const highBoundValue = Math.trunc(limitDuration.highBound / 60); - const highBound = highBoundValue === 0 ? '∞' : `${Math.trunc(limitDuration.highBound / 60)} min`; - const lowerBoundClosed = limitDuration.lowClosed ? '[' : ']'; - const higherBoundClosed = limitDuration.highClosed || null ? ']' : '['; +type LimitReductionsLabelColumnProps = { + limits: ITemporaryLimitReduction; +}; + +export function LimitReductionsToolTipColumn({ limits }: Readonly) { + const lowBound = `${Math.trunc(limits.limitDuration.lowBound / 60)} min`; + const highBoundValue = Math.trunc(limits.limitDuration.highBound / 60); + const highBound = highBoundValue === 0 ? '∞' : `${Math.trunc(limits.limitDuration.highBound / 60)} min`; + const lowerBoundClosed = limits.limitDuration.lowClosed ? '[' : ']'; + const higherBoundClosed = limits.limitDuration.highClosed || null ? ']' : '['; return ( Date: Thu, 11 Sep 2025 17:13:15 +0200 Subject: [PATCH 16/16] fix --- .../common/limitreductions/limit-reductions-table-form.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx b/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx index faf2081f..bef3c2fd 100644 --- a/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx +++ b/src/components/parameters/common/limitreductions/limit-reductions-table-form.tsx @@ -28,9 +28,9 @@ export function LimitReductionsTableForm({ limits }: Readonly<{ limits: ILimitRe if (limits !== null && limits.length > 0) { limits[0].temporaryLimitReductions.forEach((tlimit, index) => { columnsDef.push({ - label: LimitReductionsLabelColumn(tlimit), + label: , dataKey: LIMIT_DURATION_FORM + index, - tooltip: LimitReductionsToolTipColumn(tlimit), + tooltip: , }); }); }