diff --git a/rsconcept/frontend/src/components/info/BadgeConstituenta.tsx b/rsconcept/frontend/src/components/info/BadgeConstituenta.tsx index 878eef61..7acaa4e6 100644 --- a/rsconcept/frontend/src/components/info/BadgeConstituenta.tsx +++ b/rsconcept/frontend/src/components/info/BadgeConstituenta.tsx @@ -1,10 +1,11 @@ import clsx from 'clsx'; +import { useConceptOptions } from '@/context/ConceptOptionsContext'; import { CstClass, IConstituenta } from '@/models/rsform'; import { APP_COLORS, colorFgCstStatus } from '@/styling/color'; +import { globals } from '@/utils/constants'; import { CProps } from '../props'; -import TooltipConstituenta from './TooltipConstituenta'; interface BadgeConstituentaProps extends CProps.Styling { /** Prefix for tooltip ID. */ @@ -18,6 +19,8 @@ interface BadgeConstituentaProps extends CProps.Styling { * Displays a badge with a constituenta alias and information tooltip. */ function BadgeConstituenta({ value, prefixID, className, style }: BadgeConstituentaProps) { + const { setHoverCst } = useConceptOptions(); + return (
setHoverCst(value)} > {value.alias} -
); } diff --git a/rsconcept/frontend/src/components/info/TooltipConstituenta.tsx b/rsconcept/frontend/src/components/info/TooltipConstituenta.tsx deleted file mode 100644 index 42bab46d..00000000 --- a/rsconcept/frontend/src/components/info/TooltipConstituenta.tsx +++ /dev/null @@ -1,18 +0,0 @@ -import InfoConstituenta from '@/components/info/InfoConstituenta'; -import Tooltip from '@/components/ui/Tooltip'; -import { IConstituenta } from '@/models/rsform'; - -interface TooltipConstituentaProps { - data: IConstituenta; - anchor: string; -} - -function TooltipConstituenta({ data, anchor }: TooltipConstituentaProps) { - return ( - - event.stopPropagation()} /> - - ); -} - -export default TooltipConstituenta; diff --git a/rsconcept/frontend/src/context/ConceptOptionsContext.tsx b/rsconcept/frontend/src/context/ConceptOptionsContext.tsx index 2b149251..9ea0ad46 100644 --- a/rsconcept/frontend/src/context/ConceptOptionsContext.tsx +++ b/rsconcept/frontend/src/context/ConceptOptionsContext.tsx @@ -3,8 +3,11 @@ import { createContext, useCallback, useContext, useEffect, useMemo, useState } from 'react'; import { flushSync } from 'react-dom'; +import InfoConstituenta from '@/components/info/InfoConstituenta'; +import Loader from '@/components/ui/Loader'; import Tooltip from '@/components/ui/Tooltip'; import useLocalStorage from '@/hooks/useLocalStorage'; +import { IConstituenta } from '@/models/rsform'; import { globals, PARAMETER, storage } from '@/utils/constants'; import { contextOutsideScope } from '@/utils/labels'; @@ -37,6 +40,8 @@ interface IOptionsContext { location: string; setLocation: React.Dispatch>; + setHoverCst: (newValue: IConstituenta | undefined) => void; + calculateHeight: (offset: string, minimum?: string) => string; } @@ -62,6 +67,8 @@ export const OptionsState = ({ children }: React.PropsWithChildren) => { const [noFooter, setNoFooter] = useState(false); const [showScroll, setShowScroll] = useState(false); + const [hoverCst, setHoverCst] = useState(undefined); + function setDarkClass(isDark: boolean) { const root = window.document.documentElement; if (isDark) { @@ -158,23 +165,27 @@ export const OptionsState = ({ children }: React.PropsWithChildren) => { toggleShowHelp: () => setShowHelp(prev => !prev), viewportHeight, mainHeight, - calculateHeight + calculateHeight, + setHoverCst }} > <> + + {hoverCst ? event.stopPropagation()} /> : } + {children} diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/ViewHidden.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/ViewHidden.tsx index fac90a0a..fc69756a 100644 --- a/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/ViewHidden.tsx +++ b/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/ViewHidden.tsx @@ -3,7 +3,6 @@ import clsx from 'clsx'; import { IconDropArrow, IconDropArrowUp } from '@/components/Icons'; -import TooltipConstituenta from '@/components/info/TooltipConstituenta'; import { CProps } from '@/components/props'; import MiniButton from '@/components/ui/MiniButton'; import Overlay from '@/components/ui/Overlay'; @@ -13,7 +12,7 @@ import useWindowSize from '@/hooks/useWindowSize'; import { GraphColoring } from '@/models/miscellaneous'; import { ConstituentaID, IRSForm } from '@/models/rsform'; import { APP_COLORS, colorBgGraphNode } from '@/styling/color'; -import { PARAMETER, prefixes, storage } from '@/utils/constants'; +import { globals, PARAMETER, prefixes, storage } from '@/utils/constants'; interface ViewHiddenProps { items: ConstituentaID[]; @@ -31,6 +30,7 @@ function ViewHidden({ items, selected, toggleSelection, setFocus, schema, colori const windowSize = useWindowSize(); const localSelected = items.filter(id => selected.includes(id)); const [isFolded, setIsFolded] = useLocalStorage(storage.rsgraphFoldHidden, false); + const { setHoverCst } = useConceptOptions(); function handleClick(cstID: ConstituentaID, event: CProps.EventMouse) { if (event.ctrlKey || event.metaKey) { @@ -89,29 +89,27 @@ function ViewHidden({ items, selected, toggleSelection, setFocus, schema, colori const adjustedColoring = coloringScheme === 'none' ? 'status' : coloringScheme; const id = `${prefixes.cst_hidden_list}${cst.alias}`; return ( -
- - -
+ ); })} diff --git a/rsconcept/frontend/src/utils/constants.ts b/rsconcept/frontend/src/utils/constants.ts index f0777c94..283ce67f 100644 --- a/rsconcept/frontend/src/utils/constants.ts +++ b/rsconcept/frontend/src/utils/constants.ts @@ -144,6 +144,7 @@ export const storage = { export const globals = { tooltip: 'global_tooltip', value_tooltip: 'value_tooltip', + constituenta_tooltip: 'cst_tooltip', password_tooltip: 'password_tooltip', email_tooltip: 'email_tooltip', main_scroll: 'main_scroll',