diff --git a/packages/client/hmi-client/src/components/workflow/ops/model-comparison/model-comparison-operation.ts b/packages/client/hmi-client/src/components/workflow/ops/model-comparison/model-comparison-operation.ts index 4f6f99d61d..61e99b0844 100644 --- a/packages/client/hmi-client/src/components/workflow/ops/model-comparison/model-comparison-operation.ts +++ b/packages/client/hmi-client/src/components/workflow/ops/model-comparison/model-comparison-operation.ts @@ -8,6 +8,7 @@ export interface ModelComparisonOperationState extends BaseState { notebookHistory: NotebookHistory[]; hasCodeRun: boolean; comparisonImageIds: string[]; + comparisonPairs: string[][]; } export const ModelComparisonOperation: Operation = { @@ -26,7 +27,8 @@ export const ModelComparisonOperation: Operation = { const init: ModelComparisonOperationState = { notebookHistory: [], hasCodeRun: false, - comparisonImageIds: [] + comparisonImageIds: [], + comparisonPairs: [] }; return init; } diff --git a/packages/client/hmi-client/src/components/workflow/ops/model-comparison/tera-model-comparison.vue b/packages/client/hmi-client/src/components/workflow/ops/model-comparison/tera-model-comparison.vue index 1b5adef563..663e58253f 100644 --- a/packages/client/hmi-client/src/components/workflow/ops/model-comparison/tera-model-comparison.vue +++ b/packages/client/hmi-client/src/components/workflow/ops/model-comparison/tera-model-comparison.vue @@ -104,7 +104,7 @@ /> @@ -198,6 +198,7 @@ const code = ref(props.node.state.notebookHistory?.[0]?.code ?? ''); const llmThoughts = ref([]); const isKernelReady = ref(false); const contextLanguage = ref('python3'); +const comparisonPairs = ref(props.node.state.comparisonPairs); const initializeAceEditor = (editorInstance: any) => { editor = editorInstance; @@ -218,6 +219,18 @@ function updateImagesState(operationType: string, newImageId: string | null = nu emit('update-state', state); } +function updateComparisonTitlesState(operationType: string, pairs: string[][] | null = null) { + const state = cloneDeep(props.node.state); + if (operationType === 'add' && pairs !== null) state.comparisonPairs = pairs; + else if (operationType === 'clear') state.comparisonPairs = []; + emit('update-state', state); +} + +function getTitle(index: number) { + if (!comparisonPairs.value[index]) return ''; + return `${comparisonPairs.value[index][0].replaceAll('_', ' ')} VS ${comparisonPairs.value[index][1].replaceAll('_', ' ')}`; +} + function updateCodeState() { const state = saveCodeToState(props.node, code.value, true); emit('update-state', state); @@ -226,6 +239,7 @@ function updateCodeState() { function emptyImages() { deleteImages(props.node.state.comparisonImageIds); // Delete images from S3 updateImagesState('clear'); // Then their ids can be removed from the state + updateComparisonTitlesState('clear'); structuralComparisons.value = []; } @@ -248,6 +262,17 @@ function runCode() { emptyImages(); updateCodeState(); + kernelManager.sendMessage('get_comparison_pairs_request', {}).register('any_get_comparison_pairs_reply', (data) => { + const pairs = data.msg.content?.return?.comparison_pairs; + const state = cloneDeep(props.node.state); + if (pairs.length) { + updateComparisonTitlesState('add', pairs); + comparisonPairs.value = pairs; + } else if (state.comparisonPairs.length) { + comparisonPairs.value = state.comparisonPairs; + } + }); + kernelManager .sendMessage('execute_request', messageContent) .register('display_data', (data) => {