From 7aad31c5aaaf581c1cc5e16aa35764d47c7260eb Mon Sep 17 00:00:00 2001
From: jean-baptiste-perez-bib <jean-baptiste.perez_ext@michelin.com>
Date: Mon, 23 Dec 2024 14:26:06 +0100
Subject: [PATCH] Allow showing processing timeline events (frontend)

For now, there is no setting to switch with previous behaviour.
---
 .../src/components/Explore/TimelineChip.vue          |  4 ++--
 .../src/components/Explore/TimelineComponent.vue     | 12 ++++++++----
 2 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/timesketch/frontend-ng/src/components/Explore/TimelineChip.vue b/timesketch/frontend-ng/src/components/Explore/TimelineChip.vue
index aeafed1ce7..e99a444ca8 100644
--- a/timesketch/frontend-ng/src/components/Explore/TimelineChip.vue
+++ b/timesketch/frontend-ng/src/components/Explore/TimelineChip.vue
@@ -50,7 +50,7 @@ limitations under the License.
             <template v-slot:activator="{ on: onTooltip, attrs }">
               <span
                 class="timeline-name-ellipsis"
-                :class="{ disabled: !isSelected && slotProps.timelineStatus === 'ready' }"
+                :class="{ disabled: !isSelected && (slotProps.timelineStatus === 'processing' || slotProps.timelineStatus === 'ready') }"
                 v-bind="attrs"
                 v-on="onTooltip"
                 >{{ timeline.name }}</span
@@ -88,7 +88,7 @@ export default {
   },
   methods: {
     timelineStyle(timelineStatus) {
-      const greyOut = timelineStatus === 'ready' && !this.isSelected
+      const greyOut = (timelineStatus === 'processing' || timelineStatus === 'ready') && !this.isSelected
       return {
         opacity: greyOut ? '50%' : '100%',
         backgroundColor: this.$vuetify.theme.dark ? '#303030' : '#f5f5f5',
diff --git a/timesketch/frontend-ng/src/components/Explore/TimelineComponent.vue b/timesketch/frontend-ng/src/components/Explore/TimelineComponent.vue
index 49b3d37411..e7d2090e8f 100644
--- a/timesketch/frontend-ng/src/components/Explore/TimelineComponent.vue
+++ b/timesketch/frontend-ng/src/components/Explore/TimelineComponent.vue
@@ -20,7 +20,7 @@ limitations under the License.
 -->
 <template>
   <span>
-    <v-dialog v-if="timelineStatus === 'processing'" v-model="dialogStatus" width="600">
+    <v-dialog v-if="!timelineAvailable" v-model="dialogStatus" width="600">
       <template v-slot:activator="{ on, attrs }">
         <slot
           name="processing"
@@ -155,7 +155,7 @@ limitations under the License.
             </v-card>
           </v-dialog>
 
-          <v-list-item v-if="timelineStatus === 'ready'" @click="$emit('toggle', timeline)">
+          <v-list-item v-if="timelineAvailable" @click="$emit('toggle', timeline)">
             <v-list-item-action>
               <v-icon v-if="isSelected">mdi-eye-off</v-icon>
               <v-icon v-else>mdi-eye</v-icon>
@@ -164,7 +164,7 @@ limitations under the License.
             <v-list-item-subtitle v-else>Re-enable</v-list-item-subtitle>
           </v-list-item>
 
-          <v-list-item v-if="timelineStatus === 'ready'" @click="$emit('disableAllOtherTimelines', timeline)">
+          <v-list-item v-if="timelineAvailable" @click="$emit('disableAllOtherTimelines', timeline)">
             <v-list-item-action>
               <v-icon>mdi-checkbox-marked-circle-minus-outline</v-icon>
             </v-list-item-action>
@@ -245,7 +245,7 @@ limitations under the License.
             <v-list-item-subtitle>Run Analyzers</v-list-item-subtitle>
           </v-list-item>
 
-          <v-list-item style="cursor: pointer" @click="deleteConfirmation = true">
+          <v-list-item v-if="timelineAvailable" style="cursor: pointer" @click="deleteConfirmation = true">
             <v-list-item-action>
               <v-icon>mdi-trash-can-outline</v-icon>
             </v-list-item-action>
@@ -328,6 +328,7 @@ export default {
     return {
       autoRefresh: false,
       allIndexedEvents: 0, // all indexed events from ready and processed datasources
+      showProcessingTimelineEvents: true,
       totalEvents: null,
       dialogStatus: false,
       dialogRename: false,
@@ -399,6 +400,9 @@ export default {
     timelineFailed() {
       return this.timelineStatus === 'fail'
     },
+    timelineAvailable() {
+      return this.timelineStatus === 'ready' || (this.showProcessingTimelineEvents && this.timelineStatus === 'processing')
+    },
     timelineChipColor() {
       if (!this.timeline.color.startsWith('#')) {
         return '#' + this.timeline.color