diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 9c8c2f7..191d601 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -1071,7 +1071,9 @@ const App = () => { } iconPosition="start" /> diff --git a/frontend/src/VectorVisualizer.tsx b/frontend/src/VectorVisualizer.tsx index a84dc68..3d7c605 100644 --- a/frontend/src/VectorVisualizer.tsx +++ b/frontend/src/VectorVisualizer.tsx @@ -271,8 +271,22 @@ const VectorVisualizer: React.FC = ({ setSnack, connectio }); }} + onClick={(event: any) => { + const point = event.points[0]; + console.log('Point:', point); + const type = point.customdata.type; + const text = point.customdata.doc; + const emoji = emojiMap[type] || '❓'; + setTooltip({ + visible: true, + background: point['marker.color'], + color: getTextColorForBackground(point['marker.color']), + content: `${emoji} ${type.toUpperCase()}\n${text}`, + }); + }} + data={[plotData.data]} - useResizeHandler={true} + useResizeHandler={true} config={{ responsive: true, displayModeBar: false, @@ -297,6 +311,8 @@ const VectorVisualizer: React.FC = ({ setSnack, connectio overflow: 'auto', maxHeight: '20vh', minHeight: '20vh', + overflowWrap: 'break-all', + wordBreak: 'break-all', }} >