Fix transitions & observable tables (#5951)

Co-authored-by: Cole Blanchard <cblanchard@Coles-MacBook-Pro.local>

packages/client/hmi-client/src/components/model/model-parts/tera-model-part-entry.vue

@@ -1,7 +1,7 @@
 <template>
 	<section class="flex flex-column gap-2">
 		<span class="flex align-items-center gap-3">
-			<h6>{{ symbol }}</h6>
+			<h6>{{ id }}</h6>
 			<span v-if="!isTimePart" class="name">
 				<template v-if="featureConfig.isPreview">{{ nameText }}</template>
 				<tera-input-text
@@ -107,6 +107,7 @@ import { getCurieFromGroundingIdentifier, getNameOfCurieCached, searchCuriesEnti
 import type { FeatureConfig } from '@/types/common';
 import Dropdown from 'primevue/dropdown';
 import { CalendarDateType } from '@/types/common';
+import { PartType } from '@/model-representation/service';
 
 const props = defineProps<{
 	description?: string;
@@ -119,7 +120,7 @@ const props = defineProps<{
 	input?: any;
 	output?: any;
 	featureConfig: FeatureConfig;
-	isTimePart?: boolean;
+	partType: PartType;
 }>();
 
 const emit = defineEmits(['update-item']);
@@ -130,12 +131,14 @@ const descriptionText = ref(props.description);
 const query = ref('');
 const results = ref<DKG[]>([]);
 
-const symbol = computed(() => (props.templateId ? `${props.templateId}, ${props.id}` : props.id));
-
 // If we are in preview mode and there is no content, show nothing
-const showUnit = computed(() => !(props.featureConfig.isPreview && !unitExpression.value));
+const showUnit = computed(
+	() => !(props.featureConfig.isPreview && !unitExpression.value) && props.partType !== PartType.TRANSITION
+);
 const showConcept = computed(() => !(props.featureConfig.isPreview && !query.value));
 
+const isTimePart = props.partType === PartType.TIME;
+
 // Used if an option isn't selected from the Autocomplete suggestions but is typed in regularly
 function applyValidConcept() {
 	// Allows to empty the concept

packages/client/hmi-client/src/components/model/model-parts/tera-model-part.vue

@@ -20,7 +20,7 @@
 					</span>
 					<!--N/A if it's a transition-->
 					<div class="right-side">
-						<template v-if="!featureConfig.isPreview && (!children[0]?.input || !children[0]?.output)">
+						<template v-if="!featureConfig.isPreview && partType !== PartType.TRANSITION">
 							<Button
 								:disabled="getEditingState(index).isEditingChildrenUnits"
 								@click="getEditingState(index).isEditingChildrenUnits = true"
@@ -119,6 +119,7 @@
 							:key="child.id"
 						>
 							<tera-model-part-entry
+								:part-type="partType"
 								:description="child.description"
 								:name="child.name"
 								:id="child.id"
@@ -127,6 +128,7 @@
 								:input="child.input"
 								:output="child.output"
 								:unitExpression="child.unitExpression"
+								:expression="child.expression"
 								:feature-config="featureConfig"
 								@update-item="$emit('update-item', { id: child.id, ...$event })"
 							/>
@@ -146,7 +148,7 @@
 			</template>
 			<tera-model-part-entry
 				v-else
-				:is-time-part="!!isTimePart"
+				:part-type="partType"
 				:description="base.description"
 				:name="base.name"
 				:id="base.id"
@@ -155,6 +157,7 @@
 				:input="base.input"
 				:output="base.output"
 				:unitExpression="base.unitExpression"
+				:expression="base.expression"
 				:feature-config="featureConfig"
 				@update-item="$emit('update-item', { id: base.id, ...$event })"
 			/>
@@ -184,13 +187,14 @@ import Button from 'primevue/button';
 import type { FeatureConfig } from '@/types/common';
 import TeraInputText from '@/components/widgets/tera-input-text.vue';
 import Paginator from 'primevue/paginator';
+import { PartType } from '@/model-representation/service';
 
 const props = defineProps<{
 	items: any[];
 	featureConfig: FeatureConfig;
 	collapsedItems?: Map<string, string[]>;
 	showMatrix?: boolean;
-	isTimePart?: boolean;
+	partType: PartType;
 	filter?: string;
 }>();
 

packages/client/hmi-client/src/components/model/petrinet/tera-petrinet-parts.vue

@@ -7,6 +7,7 @@
 			</template>
 			<tera-model-part
 				v-if="!isEmpty(mmt.initials)"
+				:part-type="PartType.STATE"
 				:items="stateList"
 				:collapsed-items="collapsedInitials"
 				:feature-config="featureConfig"
@@ -21,6 +22,7 @@
 			</template>
 			<tera-model-part
 				v-if="!isEmpty(mmt.parameters)"
+				:part-type="PartType.PARAMETER"
 				:items="parameterList"
 				:collapsed-items="collapsedParameters"
 				:feature-config="featureConfig"
@@ -45,6 +47,7 @@
 				<tera-input-text class="ml-auto" placeholder="Filter" v-model="observablesFilter" />
 			</template>
 			<tera-model-part
+				:part-type="PartType.OBSERVABLE"
 				v-if="!isEmpty(observables)"
 				:items="observablesList"
 				:feature-config="featureConfig"
@@ -58,6 +61,7 @@
 				<tera-input-text class="ml-auto" placeholder="Filter" v-model="transitionsFilter" />
 			</template>
 			<tera-model-part
+				:part-type="PartType.TRANSITION"
 				v-if="!isEmpty(transitions) && !isEmpty(mmt.templates)"
 				:items="transitionsList"
 				:collapsed-items="collapsedTemplates"
@@ -83,7 +87,7 @@
 			</template>
 			<tera-model-part
 				v-if="time"
-				is-time-part
+				:part-type="PartType.TIME"
 				:items="timeList"
 				:feature-config="featureConfig"
 				@update-item="$emit('update-time', $event)"

packages/client/hmi-client/src/components/workflow/ops/funman/tera-funman-drilldown.vue

@@ -228,6 +228,7 @@
 								<AccordionTab v-if="!isEmpty(calibratedConfigObservables)" header="Observables">
 									<tera-model-part
 										class="pl-4"
+										:part-type="PartType.OBSERVABLE"
 										:items="calibratedConfigObservables"
 										:feature-config="{ isPreview: true }"
 									/>
@@ -391,6 +392,7 @@ import { removeChartSettingById, updateChartSettingsBySelectedVariables } from '
 import { nodeOutputLabel } from '@/components/workflow/util';
 import { formatJSON } from '@/services/code';
 import TeraDrilldownPreview from '@/components/drilldown/tera-drilldown-preview.vue';
+import { PartType } from '@/model-representation/service';
 import { FunmanOperationState, Constraint, ConstraintType, CompartmentalConstraint } from './funman-operation';
 
 const props = defineProps<{

packages/client/hmi-client/src/components/workflow/ops/model-config/tera-model-config-drilldown.vue

@@ -157,7 +157,12 @@
 					/>
 					<Accordion :active-index="observableActiveIndicies" v-if="!isEmpty(observablesList)">
 						<AccordionTab header="Observables">
-							<tera-model-part class="pl-4" :items="observablesList" :feature-config="{ isPreview: true }" />
+							<tera-model-part
+								class="pl-4"
+								:part-type="PartType.OBSERVABLE"
+								:items="observablesList"
+								:feature-config="{ isPreview: true }"
+							/>
 						</AccordionTab>
 					</Accordion>
 					<!-- vertical spacer at end of page -->
@@ -271,7 +276,8 @@ import {
 	isModelMissingMetadata,
 	getParameters as getAmrParameters,
 	getInitials as getAmrInitials,
-	createObservablesList
+	createObservablesList,
+	PartType
 } from '@/model-representation/service';
 import Message from 'primevue/message';
 import TeraColumnarPanel from '@/components/widgets/tera-columnar-panel.vue';

packages/client/hmi-client/src/model-representation/service.ts

@@ -355,7 +355,9 @@ export function checkPetrinetAMR(amr: Model) {
 export enum PartType {
 	STATE = 'STATE',
 	PARAMETER = 'PARAMETER',
-	TRANSITION = 'TRANSITION'
+	TRANSITION = 'TRANSITION',
+	OBSERVABLE = 'OBSERVABLE',
+	TIME = 'TIME'
 }
 
 // FIXME: should refactor so typing is explicit and clear
@@ -392,7 +394,7 @@ export function createPartsList(parts, model, partType) {
 					input: null,
 					output: null
 				};
-				if (partType === PartType.STATE || PartType.PARAMETER) {
+				if (partType === PartType.STATE || partType === PartType.PARAMETER) {
 					returnObj.unitExpression = t.units?.expression;
 				} else if (partType === PartType.TRANSITION) {
 					returnObj.expression = t.expression;
@@ -413,7 +415,7 @@ export function createPartsList(parts, model, partType) {
 			isParent || !basePart
 				? { id: `${id}` }
 				: {
-						id: `${id}`,
+						id: basePart.id,
 						name: basePart.name,
 						description: basePart.description,
 						grounding: basePart.grounding,
@@ -422,6 +424,7 @@ export function createPartsList(parts, model, partType) {
 		if (partType === PartType.TRANSITION) {
 			base.templateId = `${id}`;
 			if (basePart) {
+				base.expression = basePart.expression;
 				base.input = basePart.input.join(', ');
 				base.output = basePart.output.join(', ');
 			}