From 9fadfec1b38afdbcbea529398488a15201d0dd8b Mon Sep 17 00:00:00 2001 From: Ivan <8611739+IRBorisov@users.noreply.github.com> Date: Tue, 11 Mar 2025 22:56:31 +0300 Subject: [PATCH] M: Add distinguishing border for focusCst --- .../pages/RSFormPage/EditorTermGraph/graph/TGNode.tsx | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/rsconcept/frontend/src/features/rsform/pages/RSFormPage/EditorTermGraph/graph/TGNode.tsx b/rsconcept/frontend/src/features/rsform/pages/RSFormPage/EditorTermGraph/graph/TGNode.tsx index 07942b96..3a7b9756 100644 --- a/rsconcept/frontend/src/features/rsform/pages/RSFormPage/EditorTermGraph/graph/TGNode.tsx +++ b/rsconcept/frontend/src/features/rsform/pages/RSFormPage/EditorTermGraph/graph/TGNode.tsx @@ -33,6 +33,7 @@ export function TGNode(node: TGNodeInternal) { const { focusCst, setFocus: setFocusCst, navigateCst } = useRSEdit(); const filter = useTermGraphStore(state => state.filter); const coloring = useTermGraphStore(state => state.coloring); + const isFocused = focusCst === node.data; const label = node.data.alias; const description = !filter.noText ? node.data.term_resolved : ''; @@ -40,7 +41,7 @@ export function TGNode(node: TGNodeInternal) { function handleContextMenu(event: React.MouseEvent) { event.stopPropagation(); event.preventDefault(); - setFocusCst(focusCst === node.data ? null : node.data); + setFocusCst(isFocused ? null : node.data); } function handleDoubleClick(event: React.MouseEvent) { @@ -57,10 +58,12 @@ export function TGNode(node: TGNodeInternal) { style={{ backgroundColor: node.selected ? APP_COLORS.bgActiveSelection - : focusCst === node.data + : isFocused ? APP_COLORS.bgPurple : colorBgGraphNode(node.data, coloring), - fontSize: label.length > LABEL_THRESHOLD ? FONT_SIZE_MED : FONT_SIZE_MAX + fontSize: label.length > LABEL_THRESHOLD ? FONT_SIZE_MED : FONT_SIZE_MAX, + borderWidth: isFocused ? '2px' : '0px', + borderColor: isFocused ? APP_COLORS.bgSelected : 'transparent' }} data-tooltip-id={globalIDs.tooltip} data-tooltip-html={describeCstNode(node.data)}