DARPA-ASKEM · YohannParis · Oct 1, 2024 · Oct 1, 2024 · Oct 1, 2024 · Oct 1, 2024
@@ -25,14 +25,14 @@ const props = defineProps<{
 	node: WorkflowNode<CodeAssetState>;
 }>();
 
-const emit = defineEmits(['close', 'update-output-port', 'update-state']);
+const emit = defineEmits(['close', 'update-output', 'update-state']);
 
 async function onApplyChanges(code: Code) {
 	const outputPort = cloneDeep(props.node.outputs[0]);
 	if (!code || !outputPort) return;
 	const blocks = await getCodeBlocks(code);
 	outputPort.label = `${code.name} code blocks (${blocks.length})`;
-	emit('update-output-port', outputPort);
+	emit('update-output', outputPort);
 }
 </script>
 

@@ -205,7 +205,7 @@ const props = defineProps<{
 	node: WorkflowNode<InterventionPolicyState>;
 }>();
 
-const emit = defineEmits(['close', 'update-state', 'select-output', 'append-output', 'update-output-port']);
+const emit = defineEmits(['close', 'update-state', 'select-output', 'append-output']);
 
 const confirm = useConfirm();
 

@@ -263,7 +263,7 @@ const isEditingDescription = ref(false);
 const newDescription = ref('');
 const descriptionTextareaRef = ref<ComponentPublicInstance<typeof Textarea> | null>(null);
 
-const emit = defineEmits(['append-output', 'update-state', 'select-output', 'close', 'update-output-port']);
+const emit = defineEmits(['append-output', 'update-state', 'select-output', 'close']);
 
 interface BasicKnobs {
 	transientModelConfig: ModelConfiguration;
@@ -676,7 +676,7 @@ const resetConfiguration = () => {
 const updateThoughts = (data: any) => {
 	llmThoughts.value.push(data);
 	const llmResponse = llmThoughts.value.findLast((thought) => thought?.msg_type === 'llm_response');
-	// If the last thought is an llm response, update the notebook response
+	// If the last thought is a LLM response, update the notebook response
 	if (llmResponse) {
 		notebookResponse.value = llmResponse.content.text;
 	}

@@ -132,7 +132,7 @@ import { ModelEditOperationState, ModelEditOperation } from './model-edit-operat
 const props = defineProps<{
 	node: WorkflowNode<ModelEditOperationState>;
 }>();
-const emit = defineEmits(['append-output', 'update-state', 'close', 'select-output', 'update-output-port']);
+const emit = defineEmits(['append-output', 'update-state', 'close', 'select-output', 'update-output']);
 
 const outputs = computed(() => {
 	if (!isEmpty(props.node.outputs)) {
@@ -404,7 +404,7 @@ function updateNode(model: Model) {
 	if (!outputPort) return;
 	outputPort.label = model.header.name;
 
-	emit('update-output-port', outputPort);
+	emit('update-output', outputPort);
 }
 
 onMounted(async () => {

@@ -145,7 +145,6 @@
 		:asset="selectedModel"
 		:is-visible="showSaveModelModal"
 		@close-modal="onCloseModelModal"
-		@on-save="onAddModel"
 	/>
 </template>
 
@@ -177,7 +176,7 @@ import TeraTextEditor from '@/components/documents/tera-text-editor.vue';
 import TeraDrilldownSection from '@/components/drilldown/tera-drilldown-section.vue';
 import { ModelFromEquationsState, EquationBlock } from './model-from-equations-operation';
 
-const emit = defineEmits(['close', 'update-state', 'append-output', 'select-output', 'update-output-port']);
+const emit = defineEmits(['close', 'update-state', 'append-output', 'select-output']);
 const props = defineProps<{
 	node: WorkflowNode<ModelFromEquationsState>;
 }>();
@@ -358,22 +357,10 @@ async function fetchModel() {
 	loadingModel.value = false;
 }
 
-function onAddModel(model: Model) {
-	if (!model?.name || !selectedOutputId.value) return;
-	updateNodeLabel(selectedOutputId.value, model.name);
-}
-
 function onCloseModelModal() {
 	showSaveModelModal.value = false;
 }
 
-function updateNodeLabel(id: string, label: string) {
-	const outputPort = cloneDeep(props.node.outputs?.find((port) => port.id === id));
-	if (!outputPort) return;
-	outputPort.label = label;
-	emit('update-output-port', outputPort);
-}
-
 function getEquations() {
 	const newEquations = multipleEquations.value.split('\n');
 	newEquations.forEach((equation) => {

@@ -110,7 +110,6 @@
 		:initial-name="outputAmr.name"
 		:is-visible="showSaveModelModal"
 		:is-updating-asset="true"
-		@on-save="updateNodeOutput"
 		@close-modal="showSaveModelModal = false"
 	/>
 </template>
@@ -152,7 +151,7 @@ import { blankStratifyGroup, StratifyGroup, StratifyOperationStateMira } from '.
 const props = defineProps<{
 	node: WorkflowNode<StratifyOperationStateMira>;
 }>();
-const emit = defineEmits(['append-output', 'update-state', 'close', 'update-output-port', 'select-output']);
+const emit = defineEmits(['append-output', 'update-state', 'close', 'select-output']);
 
 enum StratifyTabs {
 	Wizard = 'Wizard',
@@ -248,7 +247,7 @@ const stratifyModel = () => {
 		concepts_to_stratify: conceptsToStratify,
 		params_to_stratify: parametersToStratify,
 		cartesian_control: strataOption.cartesianProduct,
-		structure: strataOption.useStructure === true ? null : []
+		structure: strataOption.useStructure ? null : []
 	};
 	kernelManager.sendMessage('reset_request', {}).register('reset_response', () => {
 		kernelManager
@@ -332,10 +331,10 @@ const getStatesAndParameters = (amrModel: Model) => {
 			modelStates.push(o.id);
 		});
 	} else if (modelFramework === AMRSchemaNames.REGNET) {
-		model.vertices.forEach((v) => {
+		model.vertices.forEach((v: any) => {
 			modelStates.push(v.name);
 		});
-		model.parameters.forEach((p) => {
+		model.parameters.forEach((p: any) => {
 			modelParameters.push(p.id);
 		});
 	} else {
@@ -457,18 +456,6 @@ const isSaveDisabled = computed(() => {
 	return useProjects().hasAssetInActiveProject(outputPort?.value?.[0]);
 });
 
-function updateNodeOutput(model: Model) {
-	if (!selectedOutputId.value || !model) return;
-
-	amr.value = model;
-	const outputPort = _.cloneDeep(props.node.outputs?.find((port) => port.id === selectedOutputId.value));
-
-	if (!outputPort) return;
-	outputPort.label = model.header.name;
-
-	emit('update-output-port', outputPort);
-}
-
 // check if user has made changes to the code
 const hasCodeChange = () => {
 	if (props.node.state.strataCodeHistory.length) {

@@ -153,17 +153,17 @@
 	<Teleport to="body">
 		<component
 			v-if="dialogIsOpened && currentActiveNode"
+			:downstream-operators-nav="downstreamOperatorsNav"
 			:is="registry.getDrilldown(currentActiveNode.operationType)"
 			:node="currentActiveNode"
-			:upstream-operators-nav="upstreamOperatorsNav"
-			:downstream-operators-nav="downstreamOperatorsNav"
 			:spawn-animation="drilldownSpawnAnimation"
+			:upstream-operators-nav="upstreamOperatorsNav"
+			@close="addOperatorToRoute(null)"
 			@append-output="(event: any) => appendOutput(currentActiveNode, event)"
+			@select-output="(event: any) => selectOutput(currentActiveNode, event)"
+			@update-output="(event: any) => updateOutput(currentActiveNode, event)"
 			@update-state="(event: any) => updateWorkflowNodeState(currentActiveNode, event)"
 			@update-status="(status: OperatorStatus) => updateWorkflowNodeStatus(currentActiveNode, status)"
-			@select-output="(event: any) => selectOutput(currentActiveNode, event)"
-			@close="addOperatorToRoute(null)"
-			@update-output-port="(event: any) => updateOutputPort(currentActiveNode, event)"
 		/>
 	</Teleport>
 </template>
@@ -409,9 +409,9 @@ function selectOutput(node: WorkflowNode<any> | null, selectedOutputId: string)
 	saveWorkflowHandler();
 }
 
-function updateOutputPort(node: WorkflowNode<any> | null, workflowOutput: WorkflowOutput<any>) {
+function updateOutput(node: WorkflowNode<any> | null, workflowOutput: WorkflowOutput<any>) {
 	if (!node) return;
-	workflowService.updateOutputPort(node, workflowOutput);
+	workflowService.updateOutput(node, workflowOutput);
 	saveWorkflowHandler();
 }
 
@@ -780,7 +780,7 @@ const dist2 = (a: Position, b: Position) => (a.x - b.x) * (a.x - b.x) + (a.y - b
 const threshold2 = 5.0 * 5.0;
 
 /*
- * Relink edges that have become detatched
+ * Relink edges that have become detached
  *
  * [output-port](edge source => edge target)[input-port]
  *
@@ -1008,30 +1008,30 @@ onUnmounted(() => {
 
 <style scoped>
 .toolbar {
+	align-items: center;
+	background-color: var(--surface-transparent);
+	border-bottom: 1px solid var(--surface-border-light);
 	display: flex;
 	flex-direction: row;
 	justify-content: space-between;
-	align-items: center;
-	padding: 0.5rem 1rem;
-	border-bottom: 1px solid var(--surface-border-light);
+	padding: var(--gap-2) var(--gap-4);
 	z-index: 900;
-	background-color: var(--surface-transparent);
 }
 
 .glass {
 	backdrop-filter: blur(10px);
 }
 
 .button-group {
-	display: flex;
 	align-items: center;
+	display: flex;
 	flex-direction: row;
-	gap: var(--gap-small);
+	gap: var(--gap-2);
 }
 
 .rename-workflow {
-	display: flex;
 	align-items: center;
+	display: flex;
 	flex-wrap: nowrap;
 }
 </style>
@@ -807,10 +807,16 @@ export function getActiveOutput(node: WorkflowNode<any>) {
 	return node.outputs.find((o) => o.id === node.active);
 }
 
-export function updateOutputPort(node: WorkflowNode<any>, updatedOutputPort: WorkflowOutput<any>) {
-	let outputPort = node.outputs.find((port) => port.id === updatedOutputPort.id);
-	if (!outputPort) return;
-	outputPort = Object.assign(outputPort, updatedOutputPort);
+/**
+ * Update the output of a node referenced by the output id
+ * @param node
+ * @param updatedOutput
+ */
+export function updateOutput(node: WorkflowNode<any>, updatedOutput: WorkflowOutput<any>) {
+	const foundOutput = node.outputs.find((output) => output.id === updatedOutput.id);
+	if (foundOutput) {
+		Object.assign(foundOutput, updatedOutput);
+	}
 }
 
 // Check if the current-state matches that of the output-state.