diff --git a/CHANGELOG.adoc b/CHANGELOG.adoc index a0d0b69ba6..9773d1c3da 100644 --- a/CHANGELOG.adoc +++ b/CHANGELOG.adoc @@ -76,6 +76,7 @@ Except for the specific case where `cause === 'refresh'` in `DiagramRenderer` (w - https://github.com/eclipse-sirius/sirius-web/issues/4469[#4469] [table] Remove useless mutations send at the table opening - https://github.com/eclipse-sirius/sirius-web/issues/4583[#4583] [sirius-web] Improve the performance to retrieve if a representation is view based - https://github.com/eclipse-sirius/sirius-web/issues/4451[#4451] [diagram] Keep using the same node after a refresh if possible in order to avoid rerendering all the nodes after converting the diagram +- https://github.com/eclipse-sirius/sirius-web/issues/4575[#4575] [diagram] Memoize the style of a label to avoid rerendering them all when refreshing the diagram diff --git a/packages/diagrams/frontend/sirius-components-diagrams/src/renderer/Label.tsx b/packages/diagrams/frontend/sirius-components-diagrams/src/renderer/Label.tsx index 70980b269a..0fd4461e5e 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams/src/renderer/Label.tsx +++ b/packages/diagrams/frontend/sirius-components-diagrams/src/renderer/Label.tsx @@ -1,5 +1,5 @@ /******************************************************************************* - * Copyright (c) 2023, 2024 Obeo. + * Copyright (c) 2023, 2025 Obeo. * This program and the accompanying materials * are made available under the terms of the Eclipse Public License v2.0 * which accompanies this distribution, and is available at @@ -13,7 +13,7 @@ import { getCSSColor, IconOverlay } from '@eclipse-sirius/sirius-components-core'; import { Theme, useTheme } from '@mui/material/styles'; -import { memo, useContext } from 'react'; +import { memo, useContext, useMemo } from 'react'; import { DiagramContext } from '../contexts/DiagramContext'; import { DiagramContextValue } from '../contexts/DiagramContext.types'; import { EdgeLabel, InsideLabel, LabelOverflowStrategy, OutsideLabel } from './DiagramRenderer.types'; @@ -121,6 +121,10 @@ export const Label = memo(({ diagramElementId, label, faded }: LabelProps) => { } }; + const customIconStyle = useMemo(() => { + return { marginRight: theme.spacing(1) }; + }, []); + const content: JSX.Element = label.id === currentlyEditedLabelId && !readOnly ? ( @@ -129,7 +133,7 @@ export const Label = memo(({ diagramElementId, label, faded }: LabelProps) => { data-id={`${label.id}-content`} data-testid={`Label content - ${label.text}`} style={labelContentStyle(theme, label)}> - +
{label.text}
);