From 340bfaa02ad8bd43f8c7b655f640e8a8869bb2ba Mon Sep 17 00:00:00 2001
From: Cole Blanchard <cblanchard@Coles-MacBook-Pro.local>
Date: Wed, 6 Dec 2023 11:59:05 -0500
Subject: [PATCH 1/3] task: generate model from code asset

---
 .../model-from-code/tera-model-from-code.vue  | 111 +++++++++++-------
 1 file changed, 69 insertions(+), 42 deletions(-)

diff --git a/packages/client/hmi-client/src/workflow/ops/model-from-code/tera-model-from-code.vue b/packages/client/hmi-client/src/workflow/ops/model-from-code/tera-model-from-code.vue
index 86ea2c68f5..c8b62e8488 100644
--- a/packages/client/hmi-client/src/workflow/ops/model-from-code/tera-model-from-code.vue
+++ b/packages/client/hmi-client/src/workflow/ops/model-from-code/tera-model-from-code.vue
@@ -73,12 +73,12 @@
 						<i class="pi pi-spin pi-spinner" :style="{ fontSize: '2rem' }"></i>
 					</div>
 				</section>
-				<section v-if="previewHTML !== ''">
-					<template v-if="selectedModelFramework === ModelFramework.Petrinet">
-						<!--Potentially put tera-model-diagram here just for petrinets-->
+				<section>
+					<template v-if="selectedModelFramework === ModelFramework.Petrinet && model">
+						<tera-model-diagram :model="model" :is-editable="false"></tera-model-diagram>
 						<!--Potentially breakdown tera-model-descriptions state and parameter tables and put them here-->
 					</template>
-					<template v-if="selectedModelFramework === ModelFramework.Decapodes">
+					<template v-if="selectedModelFramework === ModelFramework.Decapodes && previewHTML">
 						<div :innerHTML="previewHTML" />
 					</template>
 					<div class="flex flex-column gap-2">
@@ -99,7 +99,7 @@
 					<Button
 						:disabled="!modelValid || modelName === ''"
 						label="Apply changes and close"
-						@click="getModel"
+						@click="constructModel"
 					/>
 				</template>
 			</tera-drilldown-preview>
@@ -119,7 +119,7 @@ import { VAceEditorInstance } from 'vue3-ace-editor/types';
 import 'ace-builds/src-noconflict/mode-python';
 import 'ace-builds/src-noconflict/mode-julia';
 import 'ace-builds/src-noconflict/mode-r';
-import { ProgrammingLanguage } from '@/types/Types';
+import { ProgrammingLanguage, Model } from '@/types/Types';
 import { WorkflowNode } from '@/types/workflow';
 import { cloneDeep, isEmpty } from 'lodash';
 import { KernelSessionManager } from '@/services/jupyter';
@@ -128,6 +128,10 @@ import { logger } from '@/utils/logger';
 import TeraDrilldown from '@/components/drilldown/tera-drilldown.vue';
 import TeraDrilldownSection from '@/components/drilldown/tera-drilldown-section.vue';
 import TeraDrilldownPreview from '@/components/drilldown/tera-drilldown-preview.vue';
+import { getCodeAsset, getCodeFileAsText } from '@/services/code';
+import { codeToAMR } from '@/services/knowledge';
+import TeraModelDiagram from '@/components/model/petrinet/model-diagrams/tera-model-diagram.vue';
+import { getModel } from '@/services/model';
 import { ModelFromCodeState } from './model-from-code-operation';
 
 const props = defineProps<{
@@ -146,17 +150,18 @@ const isProcessing = ref(false);
 const editor = ref<VAceEditorInstance['_editor'] | null>(null);
 const modelName = ref('');
 const programmingLanguages = Object.values(ProgrammingLanguage);
-const selectedProgrammingLanguage = ref(ProgrammingLanguage.Julia);
+const selectedProgrammingLanguage = ref(ProgrammingLanguage.Python);
 const modelFrameworks = Object.values(ModelFramework);
 const selectedModelFramework = ref(
 	isEmpty(props.node.state.modelFramework)
-		? ModelFramework.Decapodes
+		? ModelFramework.Petrinet
 		: props.node.state.modelFramework
 );
 const modelValid = ref(false);
 const kernelManager = new KernelSessionManager();
 const previewHTML = ref('');
 
+const model = ref<Model>();
 const codeBlock = {
 	...props.node.state,
 	name: 'Code block 1',
@@ -166,6 +171,17 @@ const codeBlock = {
 const codeBlocks = ref([codeBlock]);
 
 onMounted(async () => {
+	if (props.node.inputs[0].value?.[0]) {
+		const codeAsset = await getCodeAsset(props.node.inputs[0].value[0]);
+
+		// for now get the first files source code
+		if (codeAsset?.id && codeAsset?.files) {
+			const filename = Object.keys(codeAsset.files)[0];
+			const codeContent = await getCodeFileAsText(codeAsset.id, filename);
+			codeBlocks.value[0].codeContent = codeContent ?? '';
+		}
+	}
+
 	try {
 		const jupyterContext = buildJupyterContext();
 		if (jupyterContext) {
@@ -183,14 +199,8 @@ onUnmounted(() => {
 });
 
 function buildJupyterContext() {
-	const contextName =
-		selectedModelFramework.value === ModelFramework.Decapodes ? 'decapodes_creation' : null;
-	const languageName =
-		selectedProgrammingLanguage.value === ProgrammingLanguage.Julia ? 'julia-1.9' : null;
-	if (contextName === null || languageName === null) {
-		logger.warn("Can't work with current language. Do nothing.");
-		return null;
-	}
+	const contextName = 'decapodes_creation';
+	const languageName = 'julia-1.9';
 
 	return {
 		context: contextName,
@@ -206,23 +216,34 @@ function setKernelContext() {
 	}
 }
 
-function handleCode() {
+async function handleCode() {
 	isProcessing.value = true;
 
-	const code = editor.value?.getValue();
-	const messageContent = <JSONObject>{
-		declaration: code
-	};
+	if (selectedModelFramework.value === ModelFramework.Petrinet) {
+		const modelId = await codeToAMR(props.node.inputs[0].value?.[0]);
+		const newModel = await getModel(modelId);
+		if (newModel) {
+			model.value = newModel;
+		}
+		isProcessing.value = false;
+	}
 
-	modelValid.value = false;
+	if (selectedModelFramework.value === ModelFramework.Decapodes) {
+		const code = editor.value?.getValue();
+		const messageContent = <JSONObject>{
+			declaration: code
+		};
 
-	kernelManager
-		.sendMessage('compile_expr_request', messageContent)
-		?.register('compile_expr_response', handleCompileExprResponse)
-		?.register('decapodes_preview', handleDecapodesPreview);
+		modelValid.value = false;
+
+		kernelManager
+			.sendMessage('compile_expr_request', messageContent)
+			?.register('compile_expr_response', handleCompileExprResponse)
+			?.register('decapodes_preview', handleDecapodesPreview);
+	}
 }
 
-function getModel() {
+function constructModel() {
 	const modelContent = {
 		name: modelName.value
 	};
@@ -235,22 +256,28 @@ function getModel() {
 }
 
 function saveAsNewModel() {
-	const messageContent = {
-		header: {
-			description: modelName.value,
-			name: modelName.value,
-			_type: 'Header',
-			model_version: 'v1.0',
-			schema: 'modelreps.io/DecaExpr',
-			schema_name: 'DecaExpr'
-		}
-	};
-
-	modelValid.value = false;
+	if (selectedModelFramework.value === ModelFramework.Petrinet) {
+		// save function here for petrinet
+	}
 
-	kernelManager
-		.sendMessage('save_amr_request', messageContent)
-		?.register('save_amr_response', handleSaveAmrResponse);
+	if (selectedModelFramework.value === ModelFramework.Decapodes) {
+		const messageContent = {
+			header: {
+				description: modelName.value,
+				name: modelName.value,
+				_type: 'Header',
+				model_version: 'v1.0',
+				schema: 'modelreps.io/DecaExpr',
+				schema_name: 'DecaExpr'
+			}
+		};
+
+		modelValid.value = false;
+
+		kernelManager
+			.sendMessage('save_amr_request', messageContent)
+			?.register('save_amr_response', handleSaveAmrResponse);
+	}
 }
 
 function handleCompileExprResponse() {

From 6ff731b93a09a4e7e3e05ef543f813c58cb5c93a Mon Sep 17 00:00:00 2001
From: Cole Blanchard <cblanchard@Coles-MacBook-Pro.local>
Date: Wed, 6 Dec 2023 14:09:05 -0500
Subject: [PATCH 2/3] comment

---
 .../workflow/ops/model-from-code/tera-model-from-code.vue   | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/packages/client/hmi-client/src/workflow/ops/model-from-code/tera-model-from-code.vue b/packages/client/hmi-client/src/workflow/ops/model-from-code/tera-model-from-code.vue
index c8b62e8488..33be7060f4 100644
--- a/packages/client/hmi-client/src/workflow/ops/model-from-code/tera-model-from-code.vue
+++ b/packages/client/hmi-client/src/workflow/ops/model-from-code/tera-model-from-code.vue
@@ -199,8 +199,10 @@ onUnmounted(() => {
 });
 
 function buildJupyterContext() {
-	const contextName = 'decapodes_creation';
-	const languageName = 'julia-1.9';
+	const contextName =
+		selectedModelFramework.value === ModelFramework.Decapodes ? 'decapodes_creation' : null;
+	const languageName =
+		selectedProgrammingLanguage.value === ProgrammingLanguage.Julia ? 'julia-1.9' : null;
 
 	return {
 		context: contextName,

From 4ffde5b5f3717f3c68d79b9a7368a254cf629572 Mon Sep 17 00:00:00 2001
From: Cole Blanchard <cblanchard@Coles-MacBook-Pro.local>
Date: Wed, 6 Dec 2023 16:48:51 -0500
Subject: [PATCH 3/3] task: save asset

---
 .../model-from-code/tera-model-from-code.vue  | 80 ++++++++++++-------
 1 file changed, 51 insertions(+), 29 deletions(-)

diff --git a/packages/client/hmi-client/src/workflow/ops/model-from-code/tera-model-from-code.vue b/packages/client/hmi-client/src/workflow/ops/model-from-code/tera-model-from-code.vue
index 33be7060f4..133c6c789a 100644
--- a/packages/client/hmi-client/src/workflow/ops/model-from-code/tera-model-from-code.vue
+++ b/packages/client/hmi-client/src/workflow/ops/model-from-code/tera-model-from-code.vue
@@ -68,36 +68,29 @@
 		</div>
 		<template #preview>
 			<tera-drilldown-preview v-model:output="selectedModelFramework" :options="modelFrameworks">
-				<section v-if="modelValid === false || previewHTML === ''">
-					<div v-if="isProcessing">
-						<i class="pi pi-spin pi-spinner" :style="{ fontSize: '2rem' }"></i>
-					</div>
-				</section>
+				<tera-progress-spinner v-if="isProcessing" :font-size="2" />
 				<section>
-					<template v-if="selectedModelFramework === ModelFramework.Petrinet && model">
-						<tera-model-diagram :model="model" :is-editable="false"></tera-model-diagram>
+					<template v-if="selectedModelFramework === ModelFramework.Petrinet && selectedModel">
+						<tera-model-diagram :model="selectedModel" :is-editable="false"></tera-model-diagram>
 						<!--Potentially breakdown tera-model-descriptions state and parameter tables and put them here-->
 					</template>
 					<template v-if="selectedModelFramework === ModelFramework.Decapodes && previewHTML">
 						<div :innerHTML="previewHTML" />
 					</template>
-					<div class="flex flex-column gap-2">
-						<label>Model name</label>
-						<InputText v-model="modelName" />
-					</div>
 				</section>
 				<template #footer>
 					<Button
-						:disabled="!modelValid || modelName === ''"
+						:loading="savingAsset"
+						:disabled="!isModelValid()"
 						label="Save as new model"
 						severity="secondary"
 						outlined
 						@click="saveAsNewModel"
 						style="margin-right: auto"
 					/>
-					<Button label="Cancel" severity="secondary" outlined />
+					<Button label="Cancel" severity="secondary" @click="emit('close')" outlined />
 					<Button
-						:disabled="!modelValid || modelName === ''"
+						:disabled="!isModelValid()"
 						label="Apply changes and close"
 						@click="constructModel"
 					/>
@@ -112,14 +105,13 @@ import { onMounted, onUnmounted, ref } from 'vue';
 import Dropdown from 'primevue/dropdown';
 import Panel from 'primevue/panel';
 import Button from 'primevue/button';
-import InputText from 'primevue/inputtext';
 import InputSwitch from 'primevue/inputswitch';
 import { VAceEditor } from 'vue3-ace-editor';
 import { VAceEditorInstance } from 'vue3-ace-editor/types';
 import 'ace-builds/src-noconflict/mode-python';
 import 'ace-builds/src-noconflict/mode-julia';
 import 'ace-builds/src-noconflict/mode-r';
-import { ProgrammingLanguage, Model } from '@/types/Types';
+import { ProgrammingLanguage, Model, AssetType } from '@/types/Types';
 import { WorkflowNode } from '@/types/workflow';
 import { cloneDeep, isEmpty } from 'lodash';
 import { KernelSessionManager } from '@/services/jupyter';
@@ -132,6 +124,10 @@ import { getCodeAsset, getCodeFileAsText } from '@/services/code';
 import { codeToAMR } from '@/services/knowledge';
 import TeraModelDiagram from '@/components/model/petrinet/model-diagrams/tera-model-diagram.vue';
 import { getModel } from '@/services/model';
+import { addAsset } from '@/services/project';
+import { useProjects } from '@/composables/project';
+import TeraProgressSpinner from '@/components/widgets/tera-progress-spinner.vue';
+import { useToastService } from '@/services/toast';
 import { ModelFromCodeState } from './model-from-code-operation';
 
 const props = defineProps<{
@@ -148,7 +144,6 @@ enum ModelFramework {
 const isProcessing = ref(false);
 
 const editor = ref<VAceEditorInstance['_editor'] | null>(null);
-const modelName = ref('');
 const programmingLanguages = Object.values(ProgrammingLanguage);
 const selectedProgrammingLanguage = ref(ProgrammingLanguage.Python);
 const modelFrameworks = Object.values(ModelFramework);
@@ -157,17 +152,19 @@ const selectedModelFramework = ref(
 		? ModelFramework.Petrinet
 		: props.node.state.modelFramework
 );
-const modelValid = ref(false);
+const decapodesModelValid = ref(false);
 const kernelManager = new KernelSessionManager();
 const previewHTML = ref('');
 
-const model = ref<Model>();
+const selectedModel = ref<Model>();
 const codeBlock = {
 	...props.node.state,
 	name: 'Code block 1',
 	includeInProcess: true
 };
 
+const savingAsset = ref(false);
+
 const codeBlocks = ref([codeBlock]);
 
 onMounted(async () => {
@@ -225,7 +222,7 @@ async function handleCode() {
 		const modelId = await codeToAMR(props.node.inputs[0].value?.[0]);
 		const newModel = await getModel(modelId);
 		if (newModel) {
-			model.value = newModel;
+			selectedModel.value = newModel;
 		}
 		isProcessing.value = false;
 	}
@@ -236,7 +233,7 @@ async function handleCode() {
 			declaration: code
 		};
 
-		modelValid.value = false;
+		decapodesModelValid.value = false;
 
 		kernelManager
 			.sendMessage('compile_expr_request', messageContent)
@@ -247,26 +244,39 @@ async function handleCode() {
 
 function constructModel() {
 	const modelContent = {
-		name: modelName.value
+		name: 'new model'
 	};
 
-	modelValid.value = false;
+	decapodesModelValid.value = false;
 
 	kernelManager
 		.sendMessage('construct_amr_request', modelContent)
 		?.register('construct_amr_response', handleConstructAmrResponse);
 }
 
-function saveAsNewModel() {
+async function saveAsNewModel() {
 	if (selectedModelFramework.value === ModelFramework.Petrinet) {
-		// save function here for petrinet
+		const projectId = useProjects().activeProject.value?.id;
+
+		if (!projectId || !selectedModel.value) return;
+
+		savingAsset.value = true;
+		const response = await addAsset(projectId, AssetType.Models, selectedModel.value.id);
+		savingAsset.value = false;
+
+		if (!response) {
+			logger.error('Could not save asset to project');
+			return;
+		}
+
+		useToastService().success('', 'Model saved successfully.');
 	}
 
 	if (selectedModelFramework.value === ModelFramework.Decapodes) {
 		const messageContent = {
 			header: {
-				description: modelName.value,
-				name: modelName.value,
+				description: 'new description',
+				name: 'new model',
 				_type: 'Header',
 				model_version: 'v1.0',
 				schema: 'modelreps.io/DecaExpr',
@@ -274,7 +284,7 @@ function saveAsNewModel() {
 			}
 		};
 
-		modelValid.value = false;
+		decapodesModelValid.value = false;
 
 		kernelManager
 			.sendMessage('save_amr_request', messageContent)
@@ -283,7 +293,7 @@ function saveAsNewModel() {
 }
 
 function handleCompileExprResponse() {
-	modelValid.value = true;
+	decapodesModelValid.value = true;
 }
 
 function handleDecapodesPreview(data: any) {
@@ -317,6 +327,18 @@ function addCodeBlock() {
 function removeCodeBlock(index: number) {
 	codeBlocks.value.splice(index, 1);
 }
+
+function isModelValid() {
+	if (selectedModelFramework.value === ModelFramework.Petrinet) {
+		return !!selectedModel.value;
+	}
+
+	if (selectedModelFramework.value === ModelFramework.Decapodes) {
+		return decapodesModelValid.value;
+	}
+
+	return false;
+}
 </script>
 
 <style scoped>