diff --git a/libs/shared/lib/schema/panel/Schema.tsx b/libs/shared/lib/schema/panel/Schema.tsx index e59d1aabd26610cc728c180060ff8363914474f5..aae59bad9af71d24fecc51943351bd01c1755e12 100644 --- a/libs/shared/lib/schema/panel/Schema.tsx +++ b/libs/shared/lib/schema/panel/Schema.tsx @@ -3,7 +3,7 @@ import { SmartBezierEdge, SmartStepEdge, SmartStraightEdge } from '@tisoap/react import ReactFlow, { Edge, Node, ReactFlowInstance, ReactFlowProvider, useEdgesState, useNodesState, MiniMap } from 'reactflow'; import 'reactflow/dist/style.css'; import { Button } from '../../components/buttons'; -import { useSchemaGraph, useSchemaSettings, useSearchResultSchema, useSchemaStats } from '../../data-access'; +import { useSchemaGraph, useSchemaSettings, useSearchResultSchema } from '../../data-access'; import { toSchemaGraphology } from '../../data-access/store/schemaSlice'; import { NodeEdge } from '../pills/edges/node-edge'; import { SelfEdge } from '../pills/edges/self-edge'; @@ -61,7 +61,6 @@ export const Schema = (props: Props) => { // In case the schema is updated const schemaGraph = useSchemaGraph(); - const graphStats = useSchemaStats(); const schemaGraphology = useMemo(() => toSchemaGraphology(schemaGraph), [schemaGraph]); const layout = useRef<AlgorithmToLayoutProvider<AllLayoutAlgorithms>>(); @@ -161,46 +160,6 @@ export const Schema = (props: Props) => { } }; - useEffect(() => { - if (graphStats.nodeStats) { - const nodeStatsMap = graphStats.nodeStats; - setNodes((nds) => - nds.map((node) => { - const { id, type, data } = node; - - const nodeCount = nodeStatsMap[id]?.count; - - return { - ...node, - data: { - ...data, - nodeCount, - }, - }; - }), - ); - } - - if (graphStats.edgeStats) { - const edgeStatsMap = graphStats.edgeStats; - setEdges((edg) => - edg.map((edge) => { - const { id, type, data } = edge; - - const nodeCount = edgeStatsMap[id]?.count; - - return { - ...edge, - data: { - ...data, - nodeCount, - }, - }; - }), - ); - } - }, [graphStats]); - const handleOnClick = (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => { const target = event.target as HTMLElement; const clickedOutsideNode = target.classList.contains('react-flow__pane'); diff --git a/libs/shared/lib/schema/pills/nodes/SchemaPopUp/SchemaPopUp.tsx b/libs/shared/lib/schema/pills/nodes/SchemaPopUp/SchemaPopUp.tsx index 91865cf5760448d7e471a3cbe6299764144ecb45..331e0761ec3093f37990b409814672cb2713c623 100644 --- a/libs/shared/lib/schema/pills/nodes/SchemaPopUp/SchemaPopUp.tsx +++ b/libs/shared/lib/schema/pills/nodes/SchemaPopUp/SchemaPopUp.tsx @@ -1,6 +1,7 @@ import React from 'react'; import { Icon } from '@graphpolaris/shared/lib/components/icon'; import { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider } from '@graphpolaris/shared/lib/components/tooltip'; +import { useSchemaStats } from '@graphpolaris/shared/lib/data-access'; const formatNumber = (number: number) => { return number.toLocaleString('de-DE'); diff --git a/libs/shared/lib/schema/pills/nodes/entity/SchemaEntityPill.tsx b/libs/shared/lib/schema/pills/nodes/entity/SchemaEntityPill.tsx index 55fec20773d1824caac0421090a7c039c2a71834..c4fb7f010b2b1dd82d8604230e565c280208d53b 100644 --- a/libs/shared/lib/schema/pills/nodes/entity/SchemaEntityPill.tsx +++ b/libs/shared/lib/schema/pills/nodes/entity/SchemaEntityPill.tsx @@ -7,11 +7,13 @@ import { EntityPill } from '@graphpolaris/shared/lib/components'; import { Tooltip, TooltipContent, TooltipTrigger } from '@graphpolaris/shared/lib/components/tooltip'; import { VisualizationTooltip } from '@graphpolaris/shared/lib/components/VisualizationTooltip'; import { SchemaPopUp } from '../SchemaPopUp/SchemaPopUp'; +import { useSchemaStats } from '@graphpolaris/shared/lib/data-access'; export const SchemaEntityPill = React.memo(({ id, selected, data }: NodeProps<SchemaReactflowNodeWithFunctions>) => { const [openPopupLocation, setOpenPopupLocation] = useState<{ x: number; y: number } | null>(null); const viewport = useViewport(); + const schemaStats = useSchemaStats(); const ref = useRef<HTMLDivElement>(null); /** @@ -81,7 +83,7 @@ export const SchemaEntityPill = React.memo(({ id, selected, data }: NodeProps<Sc }, {} as Record<string, string>, )} - numberOfElements={data.nodeCount} + numberOfElements={schemaStats.nodeStats[data.name]?.count} /> </VisualizationTooltip> </div> diff --git a/libs/shared/lib/schema/pills/nodes/relation/SchemaRelationPill.tsx b/libs/shared/lib/schema/pills/nodes/relation/SchemaRelationPill.tsx index f5ca399d1c857201264105e9a711bf53415b3d2b..2bee28161f69e9353e350711944877d2e4a40722 100644 --- a/libs/shared/lib/schema/pills/nodes/relation/SchemaRelationPill.tsx +++ b/libs/shared/lib/schema/pills/nodes/relation/SchemaRelationPill.tsx @@ -8,11 +8,13 @@ import { RelationPill } from '@graphpolaris/shared/lib/components'; import { Tooltip, TooltipContent, TooltipTrigger } from '@graphpolaris/shared/lib/components/tooltip'; import { VisualizationTooltip } from '@graphpolaris/shared/lib/components/VisualizationTooltip'; import { SchemaPopUp } from '../SchemaPopUp/SchemaPopUp'; +import { useSchemaStats } from '@graphpolaris/shared/lib/data-access'; export const SchemaRelationPill = React.memo(({ id, selected, data, ...props }: NodeProps<SchemaReactflowRelationWithFunctions>) => { const [openPopupLocation, setOpenPopupLocation] = useState<{ x: number; y: number } | null>(null); const viewport = useViewport(); + const schemaStats = useSchemaStats(); const ref = useRef<HTMLDivElement>(null); /** @@ -93,6 +95,7 @@ export const SchemaRelationPill = React.memo(({ id, selected, data, ...props }: : {} } connections={{ from: data.from, to: data.to }} + numberOfElements={schemaStats.edgeStats[data.collection]?.count} /> </VisualizationTooltip> </div>