Bug on Execution List and Generate Functional Doc

src/views/pages/ScenarioExec.vue

@@ -14,13 +14,13 @@
             <Button label="Return to scenario" @click="chatDisabled" size="large" iconPos="right" icon="pi pi-backward" class="w-auto"></Button>
         </div>
     </div>
-    <div v-else class="flex mt-6">
+    <div v-else class="flex mt-2">
-        <div class="card flex flex-col gap-4 w-full">
+        <div class="card flex flex-col w-full">
             <MdPreview :class="['markdown-content', 'ml-[-20px]']" v-model="scenario.hint" language="en-US" />
             
             <template v-if="scenario.inputs">
-                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+                <div class="grid grid-cols-2 md:grid-cols-1">
-                    <div v-for="input in scenario.inputs" :key="input.name" :class="['input-container', input.type === 'textarea' ? 'col-span-12' : '']">
+                    <div v-for="input in scenario.inputs" :key="input.name" >
                         <div v-if="input.type === 'singlefile' || input.type === 'singlefile_acceptall'">
                             <label :for="input.name">
                                 <b>{{ input.label }}</b>
@@ -37,7 +37,8 @@
                                     auto
                                     :showUploadButton="false"
                                     :showCancelButton="false"
-                                    :maxFileSize="10000000"
+                                    :maxFileSize="20971520"
+                                    :invalidFileSizeMessage="'Invalid file size, file size should be smaller than 20 MB'"
                                     v-model:files="uploadedFiles"
                                 >
                                     <template #content="{ files, uploadedFiles, removeUploadedFileCallback, removeFileCallback }">
@@ -72,10 +73,14 @@
 
                                     <template #empty>
                                         <div class="flex items-center justify-center flex-col">
-                                            <i class="pi pi-cloud-upload !border-2 !rounded-full !p-8 !text-4xl !text-muted-color" />
+                                            <!-- <i class="pi pi-cloud-upload !border border-black !rounded-full !w-21 !h-21 !p-6 !text-4xl !text-muted-color" /> -->
-                                            <p class="mt-6 mb-0">Drag and drop files to here to upload.</p>
+                                            <div class="!border !border-violet-600 !rounded-full !w-24 !h-24 flex items-center justify-center">
+                                                <i class="pi pi-cloud-upload !text-4xl !-violet-600"></i>
+                                            </div>
+                                            <p class="mt-2 mb-2 text-m">Drag and drop files here to upload.</p>
                                         </div>
                                     </template>
+
                                 </FileUpload>
                             </div>
                         </div>
@@ -96,7 +101,7 @@
                                     auto
                                     :showUploadButton="false"
                                     :showCancelButton="false"
-                                    :maxFileSize="10000000"
+                                    :maxFileSize="20971520"
                                     v-model:files="uploadedFiles"
                                 >
                                     <template #content="{ files, uploadedFiles, removeUploadedFileCallback, removeFileCallback }">
@@ -131,8 +136,11 @@
 
                                     <template #empty>
                                         <div class="flex items-center justify-center flex-col">
-                                            <i class="pi pi-cloud-upload !border-2 !rounded-full !p-8 !text-4xl !text-muted-color" />
+                                            <!-- <i class="pi pi-cloud-upload !border border-black !rounded-full !w-21 !h-21 !p-6 !text-4xl !text-muted-color" /> -->
-                                            <p class="mt-6 mb-0">Drag and drop files to here to upload.</p>
+                                            <div class="!border !border-violet-600 !rounded-full !w-24 !h-24 flex items-center justify-center">
+                                                <i class="pi pi-cloud-upload !text-4xl !-violet-600"></i>
+                                            </div>
+                                            <p class="mt-2 mb-0 text-m">Drag and drop files here to upload.</p>
                                         </div>
                                     </template>
                                 </FileUpload>
@@ -149,7 +157,7 @@
                     </div>
                 </div>
                 <div v-if="data_loaded && scenario.chatEnabled" class="flex justify-center">
-                    <div v-if ="!chat_enabled" class="flex gap-4">
+                    <div v-if ="!chat_enabled" class="flex gap-4 mt-6">
                         <Button :disabled="loadingStore.exectuion_loading || !isInputFilled" label="Execute" @click="execScenario" size="large" iconPos="right" icon="pi pi-cog"></Button>
                         <Button label="Open Chat" @click="chatEnabled" size="large" iconPos="right" icon="pi pi-comments"></Button>
                     </div>
@@ -157,7 +165,7 @@
                         <Button label="Return to scenario" @click="chatDisabled" size="large" iconPos="right" icon="pi pi-backward"></Button>
                     </div> -->
                 </div>
-                <div v-else class="flex justify-center">
+                <div v-else class="flex justify-center mt-6">
                     <Button :disabled="loadingStore.exectuion_loading || !isInputFilled" label="Execute" @click="execScenario" size="large" iconPos="right" icon="pi pi-cog"></Button>
                 </div>
             </template>
@@ -552,10 +560,10 @@ const showFileContent = (base64String, type) => {
             const jsonObject = JSON.parse(textContent); // Parse JSON
             fileContent.value = JSON.stringify(jsonObject, null, 2); // Formatta JSON
         } else {
-            fileContent.value = 'Tipo di file non supportato.';
+            fileContent.value = 'Unsupported file type.';
         }
     } catch (error) {
-        fileContent.value = 'Errore durante la decodifica o il parsing del file.';
+        fileContent.value = 'Errore while decoding or parsing file.';
         console.error(error);
     }
 };
@@ -612,34 +620,6 @@ const getFileNames = (zipData) => {
     return files;
 };
 
-// const uploadSingleFile = async (file) => {
-//             // Logica per caricare un singolo file utilizzando axios
-//             try {
-//                 const formData = new FormData();
-//                 formData.append('MultiFileUpload', file);
-
-//                 const response = await axios.post(uploadUrl.value, formData, {
-//                     headers: {
-//                         'Content-Type': 'multipart/form-data',
-//                     },
-//                 });
-
-//                 if (response.status === 200) {
-//                     toast.add({ severity: 'success', summary: 'Success', detail: `File "${file.name}" uploaded successfully.`, life: 3000 });
-//                 } else {
-//                     toast.add({ severity: 'error', summary: 'Error', detail: `Failed to upload file "${file.name}".`, life: 3000 });
-//                 }
-//             } catch (error) {
-//                 toast.add({ severity: 'error', summary: 'Error', detail: `Error uploading file "${file.name}": ${error.message}`, life: 3000 });
-//                 console.error('Error uploading file:', error);
-//             }
-//         };
-
-//         const removeFile = (file, index, callback) => {
-//             // Logica per rimuovere un file dalla lista dei "pending"
-//             console.log('Removing pending file:', file);
-//             callback(file, index);
-//         };
 async function updateRating(newRating) {
     ScenarioService.updateScenarioExecRating(exec_id.value, newRating.value)
         .then((response) => {
@@ -735,54 +715,12 @@ const onRemove = (event, removeUploadedFileCallback, type) => {
     }
 };
 
-// const onRemove = (event) => {
-//       // Metodo per gestire la rimozione dei file
-//       console.log('Removing file:', folderName.value);
-
-//       try {
-//         axios.post(
-//           `http://localhost:8081/deleteFile`,
-//           { fileName: event.file.name, folderName: folderName.value}, // Invio nome del file come payload
-//           {
-//             headers: {
-//               'Content-Type': 'application/json',
-//             },
-//           }
-//         ).then(response => {
-//             if (response.status === 200) {
-//           console.log('File removed successfully:', response.data);
-
-//           toast.add({
-//         severity: "success",
-//         summary: "Successo",
-//         detail: "File removed successfully!",
-//         life: 3000,
-//     });
-//         } else {
-//           console.error('Failed to remove file:', response.statusText);
-
-//           toast.add({
-//         severity: "error",
-//         summary: "Errore",
-//         detail: `Failed to remove file. Status: ${xhr.status}`,
-//         life: 3000,
-//     });
-//         }
-
-//         })
-
-//       } catch (error) {
-//         console.error('Error while removing file:', error);
-//       }
-//     }
-
 const onUpload = (event, uploadType) => {
     console.log('response upload ', event.xhr.response);
 
     const { xhr } = event; // Estraggo l'oggetto XMLHttpRequest
 
     if (xhr.status === 200) {
-        // Risposta OK
 
         if (uploadType === 'SingleFileUpload') {
             //formData.value['SingleFileUpload'] = "OK";
@@ -792,6 +730,7 @@ const onUpload = (event, uploadType) => {
             } else {
                 formData.value['SingleFileUpload'] = 'UnknownFile';
             }
+            console.log("Length of uploaded files", event.files.length);
             numberPrFiles.value += 1;
             console.log('Number of PR files: ', numberPrFiles.value);
         }
@@ -807,6 +746,7 @@ const onUpload = (event, uploadType) => {
             detail: 'File uploaded successfully!',
             life: 3000
         });
+        console.log("Length of uploaded files", uploadedFiles.value.length);
     } else {
         // Errore durante l'upload
         console.error("Error during upload. Status:", xhr.status, 'Response:', xhr.response);
@@ -846,7 +786,7 @@ const downloadZipFile = async (fileName) => {
 function downloadFile() {
     try {
         // Converti la stringa base64 in un blob
-        const base64String = this.scenario_output.value;
+        const base64String = scenario_output.value;
         const byteCharacters = atob(base64String);
         const byteNumbers = Array.from(byteCharacters, (char) => char.charCodeAt(0));
         const byteArray = new Uint8Array(byteNumbers);
@@ -881,9 +821,11 @@ const formatSize = (bytes) => {
 
     return `${truncatedSize} ${sizes[i]}`;
 };
+
 </script>
 
 <style scoped>
+
 .input-container {
     margin-bottom: 1em;
 }

src/views/pages/ScenarioExecList.vue

@@ -216,7 +216,7 @@ const filters = ref({
     'execSharedMap.user_input.selected_application': { 
         operator: FilterOperator.AND, 
         constraints: [{
-        value: userPrefStore.getSelApp.fe_name, matchMode: FilterMatchMode.CONTAINS 
+        value: userPrefStore.getSelApp?.fe_name || null, matchMode: FilterMatchMode.CONTAINS 
         }]
     },
     'scenario.aiModel.model': {