Disable multiple inputs into same simulate box (#1913)

packages/client/hmi-client/src/services/models/simulation-service.ts

@@ -38,7 +38,7 @@ export async function makeForecastJob(simulationParam: SimulationRequest) {
 
 export async function makeForecastJobCiemss(simulationParam: SimulationRequest) {
 	try {
-		const resp = await API.post('simulation-request/ciemss/forecast/', simulationParam);
+		const resp = await API.post('simulation-request/ciemss/forecast', simulationParam);
 		EventService.create(
 			EventType.TransformPrompt,
 			useProjects().activeProject.value?.id,

packages/client/hmi-client/src/types/SimulateConfig.ts

@@ -11,6 +11,7 @@ export enum TspanUnits {
 export type ChartConfig = {
 	selectedVariable: string[];
 	selectedRun: string;
+	active?: boolean;
 };
 
 export type DataseriesConfig = {

packages/client/hmi-client/src/workflow/ops/calibrate-julia/tera-calibrate-node-julia.vue

@@ -34,6 +34,7 @@
 					:run-results="runResults"
 					:initial-data="csvAsset"
 					:mapping="mapping"
+					:run-type="RunType.Julia"
 					:chartConfig="cfg"
 					@configuration-change="chartConfigurationChange(index, $event)"
 				/>
@@ -117,7 +118,7 @@ import {
 	querySimulationInProgress
 } from '@/services/models/simulation-service';
 import { setupModelInput, setupDatasetInput } from '@/services/calibrate-workflow';
-import { ChartConfig, RunResults } from '@/types/SimulateConfig';
+import { ChartConfig, RunResults, RunType } from '@/types/SimulateConfig';
 import { csvParse } from 'd3';
 import { workflowEventBus } from '@/services/workflow';
 import _ from 'lodash';

packages/client/hmi-client/src/workflow/ops/simulate-ciemss/simulate-ciemss-operation.ts

@@ -14,7 +14,7 @@ export const SimulateCiemssOperation: Operation = {
 	name: WorkflowOperationTypes.SIMULATE_CIEMSS,
 	displayName: 'Simulate (probabilistic)',
 	description: 'given a model id, and configuration id, run a simulation',
-	inputs: [{ type: 'modelConfigId', label: 'Model configuration', acceptMultiple: true }],
+	inputs: [{ type: 'modelConfigId', label: 'Model configuration', acceptMultiple: false }],
 	outputs: [{ type: 'simOutput' }],
 	isRunnable: true,
 

packages/client/hmi-client/src/workflow/ops/simulate-ciemss/tera-simulate-ciemss.vue

@@ -24,23 +24,26 @@
 			v-if="activeTab === SimulateTabs.output && node?.outputs.length"
 			class="simulate-container"
 		>
+			<Dropdown
+				v-if="runList.length > 0"
+				:options="runList"
+				v-model="selectedRun"
+				option-label="label"
+				placeholder="Select a simulation run"
+				@update:model-value="handleSelectedRunChange"
+			/>
 			<tera-simulate-chart
-				v-for="(cfg, index) of node.state.chartConfigs"
-				:key="index"
-				:run-results="runResults"
-				:chartConfig="cfg"
+				v-if="runResults[selectedRun?.runId]"
+				:run-results="runResults[selectedRun.runId]"
+				:chartConfig="node.state.chartConfigs[selectedRun.idx]"
 				has-mean-line
-				@configuration-change="configurationChange(index, $event)"
+				@configuration-change="configurationChange(selectedRun.idx, $event)"
 			/>
-			<Button
-				class="add-chart"
-				text
-				:outlined="true"
-				@click="addChart"
-				label="Add chart"
-				icon="pi pi-plus"
+			<tera-dataset-datatable
+				v-if="rawContent[selectedRun?.runId]"
+				:rows="10"
+				:raw-content="rawContent[selectedRun.runId]"
 			/>
-			<tera-dataset-datatable :rows="10" :raw-content="rawContent" />
 			<Button
 				class="add-chart"
 				title="Saves the current version of the model as a new Terarium asset"
@@ -69,13 +72,17 @@
 				<Accordion :multiple="true" :active-index="[0, 1, 2]">
 					<AccordionTab>
 						<template #header> Model </template>
-						<tera-model-diagram v-if="model" :model="model" :is-editable="false" />
+						<tera-model-diagram
+							v-if="model[selectedRun?.runId]"
+							:model="model[selectedRun.runId]!"
+							:is-editable="false"
+						/>
 					</AccordionTab>
 					<AccordionTab>
 						<template #header> Model configuration </template>
 						<tera-model-configurations
-							v-if="model"
-							:model="model"
+							v-if="model[selectedRun?.runId]"
+							:model="model[selectedRun.runId]!"
 							:model-configurations="modelConfigurations"
 							:feature-config="{ isPreview: true }"
 						/>
@@ -130,6 +137,7 @@ import { ref, onMounted, computed, watch } from 'vue';
 import Accordion from 'primevue/accordion';
 import AccordionTab from 'primevue/accordiontab';
 import Button from 'primevue/button';
+import Dropdown from 'primevue/dropdown';
 import InputNumber from 'primevue/inputnumber';
 import { CsvAsset, Model, TimeSpan, ModelConfiguration } from '@/types/Types';
 import { ChartConfig, RunResults } from '@/types/SimulateConfig';
@@ -163,15 +171,21 @@ enum SimulateTabs {
 
 const activeTab = ref(SimulateTabs.input);
 
-const model = ref<Model | null>(null);
+const model = ref<{ [runId: string]: Model | null }>({});
 const modelConfigurations = ref<ModelConfiguration[]>([]);
-const parsedRawData = ref<any>();
-const runConfigs = ref<any>({});
-const runResults = ref<RunResults>({});
+const runResults = ref<{ [runId: string]: RunResults }>({});
 const showSaveInput = ref(<boolean>false);
 const saveAsName = ref(<string | null>'');
-const completedRunId = computed<string | undefined>(() => props?.node?.outputs?.[0]?.value?.[0]);
-const rawContent = ref<CsvAsset | null>(null);
+const rawContent = ref<{ [runId: string]: CsvAsset | null }>({});
+
+const runList = computed(() =>
+	props.node.state.chartConfigs.map((cfg: ChartConfig, idx: number) => ({
+		label: `Output ${idx + 1} - ${cfg.selectedRun}`,
+		idx,
+		runId: cfg.selectedRun
+	}))
+);
+const selectedRun = ref();
 
 const configurationChange = (index: number, config: ChartConfig) => {
 	const state = _.cloneDeep(props.node.state);
@@ -184,9 +198,16 @@ const configurationChange = (index: number, config: ChartConfig) => {
 	});
 };
 
-const addChart = () => {
+const handleSelectedRunChange = () => {
+	if (!selectedRun.value) return;
+
+	lazyLoadSimulationData(selectedRun.value.runId);
+
 	const state = _.cloneDeep(props.node.state);
-	state.chartConfigs.push(_.last(state.chartConfigs) as ChartConfig);
+	// set the active status for the selected run in the chart configs
+	state.chartConfigs.forEach((cfg, idx) => {
+		cfg.active = idx === selectedRun.value?.idx;
+	});
 
 	workflowEventBus.emitNodeStateChange({
 		workflowId: props.node.workflowId,
@@ -198,38 +219,42 @@ const addChart = () => {
 async function saveDatasetToProject() {
 	const { activeProject, get } = useProjects();
 	if (activeProject.value?.id) {
-		if (await saveDataset(activeProject.value.id, completedRunId.value, saveAsName.value)) {
+		if (await saveDataset(activeProject.value.id, selectedRun.value.runId, saveAsName.value)) {
 			get();
 		}
 		showSaveInput.value = false;
 	}
 }
 
-onMounted(async () => {
-	// FIXME: Even though the input is a list of simulation ids, we will assume just a single model for now
-	// e.g. just take the first one.
-	if (!props.node) return;
+const lazyLoadSimulationData = async (runId: string) => {
+	if (runResults.value[runId]) return;
 
-	const nodeObj = props.node;
-
-	if (!nodeObj.outputs[0]) return;
-	const port = nodeObj.outputs[0];
-	if (!port.value) return;
-	const simulationId = port.value[0];
-
-	const modelConfigId = nodeObj.inputs[0].value?.[0];
+	// there's only a single input config
+	const modelConfigId = props.node.inputs[0].value?.[0];
 	const modelConfiguration = await getModelConfigurationById(modelConfigId);
 	if (modelConfiguration) {
-		model.value = await getModel(modelConfiguration.modelId);
-		if (model.value) modelConfigurations.value = await getModelConfigurations(model.value.id);
+		model.value[runId] = await getModel(modelConfiguration.modelId);
+		if (model.value[runId]) {
+			modelConfigurations.value = await getModelConfigurations(model.value[runId]!.id);
+		}
 	}
 
-	const output = await getRunResultCiemss(simulationId);
-	parsedRawData.value = output.parsedRawData;
-	runResults.value = output.runResults;
-	runConfigs.value = output.runConfigs;
+	const output = await getRunResultCiemss(runId);
+	runResults.value[runId] = output.runResults;
+	rawContent.value[runId] = createCsvAssetFromRunResults(runResults.value[runId]);
+};
 
-	rawContent.value = createCsvAssetFromRunResults(runResults.value);
+onMounted(() => {
+	const runId = props.node.state.chartConfigs.find((cfg) => cfg.active)?.selectedRun;
+	if (runId) {
+		selectedRun.value = runList.value.find((run) => run.runId === runId);
+	} else {
+		selectedRun.value = runList.value.length > 0 ? runList.value[0] : undefined;
+	}
+
+	if (selectedRun.value?.runId) {
+		lazyLoadSimulationData(selectedRun.value.runId);
+	}
 });
 
 watch(
@@ -247,12 +272,6 @@ watch(
 </script>
 
 <style scoped>
-.add-chart {
-	width: 9em;
-	margin: 0em 1em;
-	margin-bottom: 1em;
-}
-
 .tera-simulate {
 	background: white;
 	z-index: 1;