Skip to content

Commit 8a0885c

Browse files
fix: multimode metrics state handling
fix: lint fixes
1 parent 08d6c82 commit 8a0885c

File tree

13 files changed

+70
-60
lines changed

13 files changed

+70
-60
lines changed

frontend/src/components/ChatBot/ChatInfoModal.tsx

Lines changed: 8 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import {
1313
import { DocumentDuplicateIconOutline, ClipboardDocumentCheckIconOutline } from '@neo4j-ndl/react/icons';
1414
import '../../styling/info.css';
1515
import Neo4jRetrievalLogo from '../../assets/images/Neo4jRetrievalLogo.png';
16-
import { ExtendedNode, UserCredentials, chatInfoMessage, multimodelmetric } from '../../types';
16+
import { ExtendedNode, UserCredentials, chatInfoMessage } from '../../types';
1717
import { useContext, useEffect, useMemo, useState } from 'react';
1818
import GraphViewButton from '../Graph/GraphViewButton';
1919
import { chunkEntitiesAPI } from '../../services/ChunkEntitiesInfo';
@@ -57,6 +57,7 @@ const ChatInfoModal: React.FC<chatInfoMessage> = ({
5757
metricsLoading,
5858
activeChatmodes,
5959
metricError,
60+
multiModelMetrics,
6061
saveNodes,
6162
saveChunks,
6263
saveChatRelationships,
@@ -65,6 +66,7 @@ const ChatInfoModal: React.FC<chatInfoMessage> = ({
6566
saveMetrics,
6667
toggleInfoLoading,
6768
toggleMetricsLoading,
69+
saveMultimodemetrics,
6870
}) => {
6971
const { breakpoints } = tokens;
7072
const isTablet = useMediaQuery(`(min-width:${breakpoints.xs}) and (max-width: ${breakpoints.lg})`);
@@ -76,11 +78,8 @@ const ChatInfoModal: React.FC<chatInfoMessage> = ({
7678
const [, copy] = useCopyToClipboard();
7779
const [copiedText, setcopiedText] = useState<boolean>(false);
7880
const [showMetricsTable, setShowMetricsTable] = useState<boolean>(Boolean(metricDetails));
79-
const [multiModelMetrics, setMultiModelMetrics] = useState<multimodelmetric[]>([]);
8081
const [multiModeError, setMultiModeError] = useState<string>('');
8182

82-
console.log('node', nodeDetails);
83-
8483
const actions: CypherCodeBlockProps['actions'] = useMemo(
8584
() => [
8685
{
@@ -170,7 +169,6 @@ const ChatInfoModal: React.FC<chatInfoMessage> = ({
170169
if (metricsLoading) {
171170
toggleMetricsLoading();
172171
}
173-
setMultiModelMetrics([]);
174172
};
175173
}, [nodeDetails, mode, error, metricsLoading]);
176174

@@ -181,7 +179,7 @@ const ChatInfoModal: React.FC<chatInfoMessage> = ({
181179
if (activeChatmodes) {
182180
if (Object.keys(activeChatmodes).length <= 1) {
183181
setShowMetricsTable(true);
184-
const defaultMode = Object.keys(activeChatmodes)[0];
182+
const [defaultMode] = Object.keys(activeChatmodes);
185183
try {
186184
toggleMetricsLoading();
187185
const response = await getChatMetrics(metricquestion, [metriccontexts], [metricanswer], metricmodel, [
@@ -227,7 +225,7 @@ const ChatInfoModal: React.FC<chatInfoMessage> = ({
227225
const metricsdata = Object.entries(modewisedata).map(([mode, scores]) => {
228226
return { mode, answer_relevancy: scores.answer_relevancy, faithfulness: scores.faithfulness };
229227
});
230-
setMultiModelMetrics(metricsdata);
228+
saveMultimodemetrics(metricsdata);
231229
} else {
232230
throw new Error(responses.data.error);
233231
}
@@ -346,7 +344,7 @@ const ChatInfoModal: React.FC<chatInfoMessage> = ({
346344
{showMetricsTable && activeChatmodes != null && Object.keys(activeChatmodes).length <= 1 && (
347345
<MetricsTab metricsLoading={metricsLoading} error={metricError} metricDetails={metricDetails} />
348346
)}
349-
{!metricDetails && (
347+
{!metricDetails && activeChatmodes != undefined && Object.keys(activeChatmodes).length <= 1 && (
350348
<Button
351349
label='Metrics Action Button'
352350
disabled={metricsLoading || !supportedLLmsForRagas.includes(metricmodel)}
@@ -356,14 +354,14 @@ const ChatInfoModal: React.FC<chatInfoMessage> = ({
356354
View Detailed Metrics
357355
</Button>
358356
)}
359-
{!multiModelMetrics && (
357+
{!multiModelMetrics.length && activeChatmodes != undefined && Object.keys(activeChatmodes).length > 1 && (
360358
<Button
361359
label='Metrics Action Button'
362360
disabled={metricsLoading || !supportedLLmsForRagas.includes(metricmodel)}
363361
className='w-max self-center mt-4'
364362
onClick={loadMetrics}
365363
>
366-
View Detailed For All Modes
364+
View Detailed Metrics For All Modes
367365
</Button>
368366
)}
369367
</Stack>

frontend/src/components/ChatBot/Chatbot.tsx

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ import {
2525
ResponseMode,
2626
UserCredentials,
2727
metricstate,
28+
multimodelmetric,
2829
nodeDetailsProps,
2930
} from '../../types';
3031
import { useCredentials } from '../../context/UserCredentials';
@@ -81,6 +82,7 @@ const Chatbot: FC<ChatbotProps> = (props) => {
8182
const [metricsLoading, toggleMetricsLoading] = useReducer((s) => !s, false);
8283
const downloadLinkRef = useRef<HTMLAnchorElement>(null);
8384
const [activeChat, setActiveChat] = useState<Messages | null>(null);
85+
const [multiModelMetrics, setMultiModelMetrics] = useState<multimodelmetric[]>([]);
8486

8587
const [_, copy] = useCopyToClipboard();
8688
const { speak, cancel, speaking } = useSpeechSynthesis({
@@ -112,6 +114,9 @@ const Chatbot: FC<ChatbotProps> = (props) => {
112114
const saveChunks = (chatChunks: Chunk[]) => {
113115
setChunks(chatChunks);
114116
};
117+
const saveMultimodemetrics = (metrics: multimodelmetric[]) => {
118+
setMultiModelMetrics(metrics);
119+
};
115120
const saveMetrics = (metricInfo: metricstate) => {
116121
setMetricDetails(metricInfo);
117122
};
@@ -400,6 +405,9 @@ const Chatbot: FC<ChatbotProps> = (props) => {
400405
setInfoEntities([]);
401406
setMetricDetails(null);
402407
}
408+
if (previousActiveChat != null && chat.id != previousActiveChat?.id) {
409+
setMultiModelMetrics([]);
410+
}
403411
}, []);
404412

405413
const speechHandler = useCallback((chat: Messages) => {
@@ -648,7 +656,9 @@ const Chatbot: FC<ChatbotProps> = (props) => {
648656
saveNodes={saveNodes}
649657
toggleInfoLoading={toggleInfoLoading}
650658
toggleMetricsLoading={toggleMetricsLoading}
659+
saveMultimodemetrics={saveMultimodemetrics}
651660
activeChatmodes={activeChat?.modes}
661+
multiModelMetrics={multiModelMetrics}
652662
/>
653663
</Modal>
654664
</Suspense>

frontend/src/components/ChatBot/ChunkInfo.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ const ChunkInfo: FC<ChunkProps> = ({ loading, chunks, mode }) => {
2424
const [viewPoint, setViewPoint] = useState('');
2525
const [_, setLoadingGraphView] = useState(false);
2626

27-
const handleChunkClick = async (elementId: string, viewMode: string) => {
27+
const handleChunkClick = (elementId: string, viewMode: string) => {
2828
handleGraphNodeClick(
2929
userCredentials as UserCredentials,
3030
elementId,

frontend/src/components/ChatBot/EntitiesInfo.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ const EntitiesInfo: FC<EntitiesProps> = ({ loading, mode, graphonly_entities, in
4343
return Object.keys(labelCounts).sort((a, b) => labelCounts[b] - labelCounts[a]);
4444
}, [labelCounts]);
4545

46-
const handleEntityClick = async (elementId: string, viewMode: string) => {
46+
const handleEntityClick = (elementId: string, viewMode: string) => {
4747
handleGraphNodeClick(
4848
userCredentials as UserCredentials,
4949
elementId,

frontend/src/components/ChatBot/SourcesInfo.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -12,14 +12,14 @@ import s3logo from '../../assets/images/s3logo.png';
1212

1313
const filterUniqueChunks = (chunks: Chunk[]) => {
1414
const chunkSource = new Set();
15-
return chunks.filter(chunk => {
15+
return chunks.filter((chunk) => {
1616
const sourceCheck = `${chunk.fileName}-${chunk.fileSource}`;
1717
if (chunkSource.has(sourceCheck)) {
1818
return false;
19-
} else {
19+
}
2020
chunkSource.add(sourceCheck);
2121
return true;
22-
}
22+
2323
});
2424
};
2525

@@ -147,4 +147,4 @@ const SourcesInfo: FC<SourcesProps> = ({ loading, mode, chunks, sources }) => {
147147
</>
148148
);
149149
};
150-
export default SourcesInfo;
150+
export default SourcesInfo;

frontend/src/components/ChatBot/chatInfo.ts

Lines changed: 32 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -2,39 +2,39 @@ import { getNeighbors } from '../../services/GraphQuery';
22
import { NeoNode, NeoRelationship, UserCredentials } from '../../types';
33

44
export const handleGraphNodeClick = async (
5-
userCredentials: UserCredentials,
6-
elementId: string,
7-
viewMode: string,
8-
setNeoNodes: React.Dispatch<React.SetStateAction<NeoNode[]>>,
9-
setNeoRels: React.Dispatch<React.SetStateAction<NeoRelationship[]>>,
10-
setOpenGraphView: React.Dispatch<React.SetStateAction<boolean>>,
11-
setViewPoint: React.Dispatch<React.SetStateAction<string>>,
12-
setLoadingGraphView?: React.Dispatch<React.SetStateAction<boolean>>
5+
userCredentials: UserCredentials,
6+
elementId: string,
7+
viewMode: string,
8+
setNeoNodes: React.Dispatch<React.SetStateAction<NeoNode[]>>,
9+
setNeoRels: React.Dispatch<React.SetStateAction<NeoRelationship[]>>,
10+
setOpenGraphView: React.Dispatch<React.SetStateAction<boolean>>,
11+
setViewPoint: React.Dispatch<React.SetStateAction<string>>,
12+
setLoadingGraphView?: React.Dispatch<React.SetStateAction<boolean>>
1313
) => {
14-
if (setLoadingGraphView) {
15-
setLoadingGraphView(true);
14+
if (setLoadingGraphView) {
15+
setLoadingGraphView(true);
16+
}
17+
try {
18+
const result = await getNeighbors(userCredentials, elementId);
19+
if (result && result.data.data.nodes.length > 0) {
20+
let { nodes } = result.data.data;
21+
if (viewMode === 'Chunk') {
22+
nodes = nodes.filter((node: NeoNode) => node.labels.length === 1 && node.properties.id !== null);
23+
}
24+
const nodeIds = new Set(nodes.map((node: NeoNode) => node.element_id));
25+
const relationships = result.data.data.relationships.filter(
26+
(rel: NeoRelationship) => nodeIds.has(rel.end_node_element_id) && nodeIds.has(rel.start_node_element_id)
27+
);
28+
setNeoNodes(nodes);
29+
setNeoRels(relationships);
30+
setOpenGraphView(true);
31+
setViewPoint('chatInfoView');
1632
}
17-
try {
18-
const result = await getNeighbors(userCredentials, elementId);
19-
if (result && result.data.data.nodes.length > 0) {
20-
let { nodes } = result.data.data;
21-
if (viewMode === 'Chunk') {
22-
nodes = nodes.filter((node: NeoNode) => node.labels.length === 1 && node.properties.id !== null);
23-
}
24-
const nodeIds = new Set(nodes.map((node: NeoNode) => node.element_id));
25-
const relationships = result.data.data.relationships.filter(
26-
(rel: NeoRelationship) => nodeIds.has(rel.end_node_element_id) && nodeIds.has(rel.start_node_element_id)
27-
);
28-
setNeoNodes(nodes);
29-
setNeoRels(relationships);
30-
setOpenGraphView(true);
31-
setViewPoint('chatInfoView');
32-
}
33-
} catch (error: any) {
34-
console.error('Error fetching neighbors:', error);
35-
} finally {
36-
if (setLoadingGraphView) {
37-
setLoadingGraphView(false);
38-
}
33+
} catch (error: any) {
34+
console.error('Error fetching neighbors:', error);
35+
} finally {
36+
if (setLoadingGraphView) {
37+
setLoadingGraphView(false);
3938
}
39+
}
4040
};

frontend/src/components/Dropdown.tsx

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,9 @@ const DropdownComponent: React.FC<ReusableDropdownProps> = ({
3939
};
4040
}),
4141
placeholder: placeholder || 'Select an option',
42-
defaultValue: defaultValue ? { label: capitalize(defaultValue), value: defaultValue } : undefined,
42+
defaultValue: defaultValue
43+
? { label: capitalizeWithUnderscore(defaultValue), value: defaultValue }
44+
: undefined,
4345
menuPlacement: 'auto',
4446
isDisabled: isDisabled,
4547
value: value,

frontend/src/components/Graph/GraphPropertiesTable.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ import { GraphLabel, Typography } from '@neo4j-ndl/react';
22
import { GraphPropertiesTableProps } from '../../types';
33

44
const GraphPropertiesTable = ({ propertiesWithTypes }: GraphPropertiesTableProps): JSX.Element => {
5-
console.log('props', propertiesWithTypes);
65
return (
76
<div className='flex w-full flex-col break-all px-4 text-sm' data-testid='viz-details-pane-properties-table'>
87
<div className='mb-1 flex flex-row pl-2'>

frontend/src/components/Popups/GraphEnhancementDialog/Deduplication/index.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -106,7 +106,7 @@ export default function DeduplicationTab() {
106106
});
107107
};
108108

109-
const handleDuplicateNodeClick = async (elementId: string, viewMode: string) => {
109+
const handleDuplicateNodeClick = (elementId: string, viewMode: string) => {
110110
handleGraphNodeClick(
111111
userCredentials as UserCredentials,
112112
elementId,

frontend/src/components/Popups/GraphEnhancementDialog/EnitityExtraction/EntityExtractionSetting.tsx

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -317,8 +317,9 @@ export default function EntityExtractionSetting({
317317
options: nodeLabelOptions,
318318
onChange: onChangenodes,
319319
value: selectedNodes,
320-
classNamePrefix: `${isTablet ? 'tablet_entity_extraction_Tab_node_label' : 'entity_extraction_Tab_node_label'
321-
}`,
320+
classNamePrefix: `${
321+
isTablet ? 'tablet_entity_extraction_Tab_node_label' : 'entity_extraction_Tab_node_label'
322+
}`,
322323
}}
323324
type='creatable'
324325
/>
@@ -332,8 +333,9 @@ export default function EntityExtractionSetting({
332333
options: relationshipTypeOptions,
333334
onChange: onChangerels,
334335
value: selectedRels,
335-
classNamePrefix: `${isTablet ? 'tablet_entity_extraction_Tab_relationship_label' : 'entity_extraction_Tab_relationship_label'
336-
}`,
336+
classNamePrefix: `${
337+
isTablet ? 'tablet_entity_extraction_Tab_relationship_label' : 'entity_extraction_Tab_relationship_label'
338+
}`,
337339
}}
338340
type='creatable'
339341
/>

0 commit comments

Comments
 (0)