Merge branch 'main' into 4754-notebook-re-run-notifications

packages/client/hmi-client/src/App.vue

@@ -6,6 +6,7 @@
  </router-view>
  <tera-footer />
  <tera-common-modal-dialogs />
+ <ConfirmDialog class="w-4" />
 </template>
 
 <script setup lang="ts">
@@ -20,6 +21,7 @@ import { useProjects } from '@/composables/project';
 import { useCurrentRoute } from '@/router';
 import { ToastSeverity, ToastSummaries, useToastService } from '@/services/toast';
 import { Project } from '@/types/Types';
+import ConfirmDialog from 'primevue/confirmdialog';
 
 const toast = useToastService();
 

packages/client/hmi-client/src/components/home/tera-project-menu.vue

@@ -15,6 +15,7 @@ import { computed, ref } from 'vue';
 import { exportProjectAsFile } from '@/services/project';
 import { AcceptedExtensions } from '@/types/common';
 import { MenuItem } from 'primevue/menuitem';
+import useAuthStore from '@/stores/auth';
 
 const props = defineProps<{ project: Project | null }>();
 
@@ -26,8 +27,8 @@ const { isShareDialogVisible, isRemoveDialogVisible, isProjectConfigDialogVisibl
 const isCopying = ref(false);
 
 const menu = ref();
-const renameMenuItem = {
- label: 'Edit project details',
+const editDetailsMenuItem = {
+ label: 'Edit details',
  icon: 'pi pi-pencil',
  command: () => {
  isProjectConfigDialogVisible.value = true;
@@ -41,14 +42,14 @@ const shareMenuItem = {
  }
 };
 const removeMenuItem = {
- label: 'Remove',
+ label: 'Delete',
  icon: 'pi pi-trash',
  command: () => {
  isRemoveDialogVisible.value = true;
  }
 };
 const copyMenuItem = {
- label: 'Copy this project',
+ label: 'Copy',
  icon: 'pi pi-clone',
  command: async () => {
  if (props.project) {
@@ -80,19 +81,20 @@ const downloadMenuItem = {
  }
 };
 
-const separatorMenuItem = { separator: true };
 const projectMenuItems = computed(() => {
- const items: MenuItem[] = [];
- if (props.project?.publicProject || props.project?.userPermission === 'creator') {
- items.push(copyMenuItem);
- items.push(downloadMenuItem);
- }
- if (props.project?.userPermission === 'creator') {
- items.push(renameMenuItem, shareMenuItem, separatorMenuItem, removeMenuItem);
+ // Basic access to public and reader project
+ const items: MenuItem[] = [copyMenuItem, downloadMenuItem];
+
+ // Creator/Editor of the project
+ if (['creator', 'writer'].includes(props.project?.userPermission ?? '')) {
+ items.push(editDetailsMenuItem, shareMenuItem);
  }
- if (props.project?.userPermission === 'writer') {
- items.push(renameMenuItem);
+
+ // Creator of the project, or an admin
+ if (props.project?.userPermission === 'creator' || useAuthStore().isAdmin) {
+ items.push(removeMenuItem);
  }
+
  return items;
 });
 

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

@@ -120,6 +120,9 @@ const resetZoom = async () => {
 };
 
 async function renderGraph() {
+ // Sanity guard
+ if (mmt.value.templates.length === 0) return;
+
  renderer = getModelRenderer(
  mmt.value,
  graphElement.value as HTMLDivElement,

packages/client/hmi-client/src/components/navbar/tera-navbar.vue

@@ -381,7 +381,7 @@ const userMenuItems = ref([
  command: () => {
  router.push(RoutePath.UserAdmin);
  },
- visible: auth.user?.roles.some((r) => r.name === 'ADMIN')
+ visible: auth.isAdmin
  },
  {
  label: 'Logout',

packages/client/hmi-client/src/components/operator/tera-operator-inputs.vue

@@ -21,10 +21,6 @@
  <div class="truncate text-left">
  {{ useProjects().getAssetName(input.value?.[0]) || getPortLabel(input) }}
  </div>
- <!--TODO: label is a string type not an array consider adding this back in if we support an array of labels-->
- <!-- <label v-for="(label, labelIdx) in input.label?.split(',') ?? []" :key="labelIdx">
- {{ label }}
- </label> -->
  <Button
  class="unlink"
  label="Unlink"

packages/client/hmi-client/src/components/responsive-matrix/matrix-util.ts

@@ -5,7 +5,6 @@ export const formatAxis = (axisSelection: Selection<any, any, any, any>) => {
  axisSelection.selectAll('text').attr('stroke', 'none').attr('fill', '#555');
 };
 
-// FIXME: add test
 export const makeLabels = (
  itemList: any[],
  itemAltList: any[],

packages/client/hmi-client/src/components/widgets/tera-pdf-embed.vue

@@ -1,17 +1,20 @@
 <template>
- <div id="adobe-dc-view" />
+ <div :id="id" />
 </template>
 
 <script setup lang="ts">
 import { ref, watch, onMounted } from 'vue';
 import API from '@/api/api';
+import { v4 as uuidv4 } from 'uuid';
 
 const props = defineProps<{
  pdfLink?: string;
  title: string;
  filePromise?: Promise<ArrayBuffer | null>;
 }>();
 
+const id = uuidv4();
+
 const adobeDCView = ref();
 const adobeApis = ref();
 const isAdobePdfApiReady = ref(false);
@@ -49,7 +52,7 @@ watch(isAdobePdfApiReady, () => {
  // eslint-disable-line
  new window.AdobeDC.View({
  clientId: apiKey,
- divId: 'adobe-dc-view'
+ divId: id
  })
  );
 

packages/client/hmi-client/src/components/widgets/tera-pdf-panel.vue

@@ -0,0 +1,64 @@
+<template>
+ <TabView v-if="pdfs?.length" class="container">
+ <TabPanel :header="pdf.name" v-for="pdf in pdfs" :key="pdf.name">
+ <tera-pdf-embed v-if="pdf.isPdf" :pdf-link="pdf.data" :title="pdf.name || ''" />
+ <tera-text-editor v-else :initial-text="pdf.data" />
+ </TabPanel>
+ </TabView>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+
+import TabView from 'primevue/tabview';
+import TabPanel from 'primevue/tabpanel';
+
+import TeraPdfEmbed from '@/components/widgets/tera-pdf-embed.vue';
+import TeraTextEditor from '@/components/documents/tera-text-editor.vue';
+import type { DocumentAsset } from '@/types/Types';
+
+interface PdfData {
+ document: DocumentAsset;
+ data: string;
+ isPdf: boolean;
+ name: string;
+}
+
+const props = defineProps<{
+ pdfs: PdfData[];
+}>();
+
+const pdfs = ref<PdfData[]>(props.pdfs);
+</script>
+
+<style scoped>
+.container {
+ display: flex;
+ flex-direction: column;
+ flex: 1;
+}
+
+:deep(.p-tabview) {
+ display: flex;
+ flex-direction: column;
+ flex: 1;
+}
+:deep(.p-tabview-panels) {
+ display: flex;
+ flex-direction: column;
+ flex: 1;
+}
+:deep(.p-tabview-panel) {
+ flex: 1;
+}
+
+:deep(.p-tabview-header) {
+ max-width: 150px;
+}
+
+:deep(.p-tabview-title) {
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ overflow: hidden;
+}
+</style>

packages/client/hmi-client/src/components/workflow/ops/dataset-transformer/tera-dataset-transformer.vue

@@ -80,9 +80,10 @@ const jupyterPanel = ref();
 const selectedDataset = ref<string | null>(null);
 const updateKernelState = (newKernelState: any) => {
  kernelState.value = newKernelState;
- // Default the dropdown to the first dataframe
+ // Default the dropdown to the last dataframe
  if (!selectedDataset.value) {
- selectedDataset.value = Object.keys(newKernelState)[0];
+ const keys = Object.keys(newKernelState);
+ selectedDataset.value = keys[keys.length - 1];
  }
 };
 

packages/client/hmi-client/src/components/workflow/ops/intervention-policy/tera-intervention-policy-card.vue

@@ -22,7 +22,7 @@ defineProps<{
  selected?: boolean;
 }>();
 
-const emit = defineEmits(['use-intervention']);
+const emit = defineEmits(['use-intervention', 'delete-intervention-policy']);
 
 const contextMenu = ref();
 const contextMenuItems = [
@@ -32,6 +32,13 @@ const contextMenuItems = [
  command() {
  emit('use-intervention');
  }
+ },
+ {
+ label: 'Delete',
+ icon: 'pi pi-trash',
+ command() {
+ emit('delete-intervention-policy');
+ }
  }
 ];
 

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

@@ -36,6 +36,7 @@
  :selected="selectedPolicy?.id === policy.id"
  @click="onReplacePolicy(policy)"
  @use-intervention="onReplacePolicy(policy)"
+ @delete-intervention-policy="onDeleteInterventionPolicy(policy)"
  />
  </li>
  </ul>
@@ -183,7 +184,8 @@ import {
  blankIntervention,
  flattenInterventionData,
  getInterventionPolicyById,
- updateInterventionPolicy
+ updateInterventionPolicy,
+ deleteInterventionPolicy
 } from '@/services/intervention-policy';
 import Accordion from 'primevue/accordion';
 import AccordionTab from 'primevue/accordiontab';
@@ -406,6 +408,23 @@ const onReplacePolicy = (policy: InterventionPolicy) => {
  }
 };
 
+const onDeleteInterventionPolicy = (policy: InterventionPolicy) => {
+ confirm.require({
+ message: `Are you sure you want to delete the configuration ${policy.name}?`,
+ header: 'Delete Confirmation',
+ icon: 'pi pi-exclamation-triangle',
+ acceptLabel: 'Confirm',
+ rejectLabel: 'Cancel',
+ accept: async () => {
+ if (policy.id) {
+ await deleteInterventionPolicy(policy.id);
+ const modelId = props.node.inputs[0].value?.[0];
+ fetchInterventionPolicies(modelId);
+ }
+ }
+ });
+};
+
 const addIntervention = () => {
  // by default add the first parameter with a static intervention
  knobs.value.transientInterventionPolicy.interventions.push(blankIntervention);

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

@@ -7,6 +7,18 @@
  hide-dropdown
  >
  <template #sidebar>
+ <tera-slider-panel
+ v-if="pdfData.length"
+ v-model:is-open="isDocViewerOpen"
+ header="Document Viewer"
+ content-width="700px"
+ >
+ <template #content>
+ <tera-drilldown-section :is-loading="isFetchingPDF">
+ <tera-pdf-panel :pdfs="pdfData" />
+ </tera-drilldown-section>
+ </template>
+ </tera-slider-panel>
  <tera-slider-panel
  class="input-config"
  v-model:is-open="isSidebarOpen"
@@ -212,6 +224,7 @@ import TeraModelDiagram from '@/components/model/petrinet/tera-model-diagram.vue
 import TeraObservables from '@/components/model/model-parts/tera-observables.vue';
 import TeraInitialTable from '@/components/model/petrinet/tera-initial-table.vue';
 import TeraParameterTable from '@/components/model/petrinet/tera-parameter-table.vue';
+import { downloadDocumentAsset, getDocumentAsset, getDocumentFileAsText } from '@/services/document-assets';
 import {
  emptyMiraModel,
  generateModelDatasetConfigurationContext,
@@ -246,14 +259,15 @@ import TeraToggleableInput from '@/components/widgets/tera-toggleable-input.vue'
 import { saveCodeToState } from '@/services/notebook';
 import TeraSaveAssetModal from '@/components/project/tera-save-asset-modal.vue';
 import { useProjects } from '@/composables/project';
-import TeraModelConfigurationItem from './tera-model-configuration-item.vue';
+import TeraPdfPanel from '@/components/widgets/tera-pdf-panel.vue';
 import {
  blankModelConfig,
  isModelConfigsEqual,
  isModelConfigValuesEqual,
  ModelConfigOperation,
  ModelConfigOperationState
 } from './model-config-operation';
+import TeraModelConfigurationItem from './tera-model-configuration-item.vue';
 
 enum ConfigTabs {
  Wizard = 'Wizard',
@@ -264,6 +278,11 @@ const props = defineProps<{
  node: WorkflowNode<ModelConfigOperationState>;
 }>();
 
+const isFetchingPDF = ref(false);
+const isDocViewerOpen = ref(true);
+
+const pdfData = ref<{ document: any; data: string; isPdf: boolean; name: string }[]>([]);
+
 const isSidebarOpen = ref(true);
 const isEditingDescription = ref(false);
 const newDescription = ref('');
@@ -707,6 +726,29 @@ onMounted(() => {
  selectedOutputId.value = props.node.active;
  initialize(true);
  }
+
+ if (documentIds.value.length) {
+ isFetchingPDF.value = true;
+ documentIds.value.forEach(async (id) => {
+ const document = await getDocumentAsset(id);
+ const name: string = document?.name ?? '';
+ const filename = document?.fileNames?.[0];
+ const isPdf = !!document?.fileNames?.[0]?.endsWith('.pdf');
+
+ if (document?.id && filename) {
+ let data: string | null;
+ if (isPdf) {
+ data = await downloadDocumentAsset(document.id, filename);
+ } else {
+ data = await getDocumentFileAsText(document.id, filename);
+ }
+ if (data !== null) {
+ pdfData.value.push({ document, data, isPdf, name });
+ }
+ }
+ });
+ }
+ isFetchingPDF.value = false;
 });
 
 watch(
@@ -860,4 +902,11 @@ button.start-edit {
 .executed-code {
  white-space: pre-wrap;
 }
+:deep(.content-wrapper) {
+ & > section {
+ & > main {
+ overflow: hidden;
+ }
+ }
+}
 </style>