From fcda4e65cd5095a7bc63a11d29e5b77dba217274 Mon Sep 17 00:00:00 2001
From: Syd Pleno <syd.pleno@gmail.com>
Date: Thu, 19 Sep 2024 07:15:02 +1000
Subject: [PATCH 1/9] Update TimelineSearch

---
 .../src/components/Analyzer/TimelineSearch.vue      | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/timesketch/frontend-ng/src/components/Analyzer/TimelineSearch.vue b/timesketch/frontend-ng/src/components/Analyzer/TimelineSearch.vue
index dd35c05367..f0786bf321 100644
--- a/timesketch/frontend-ng/src/components/Analyzer/TimelineSearch.vue
+++ b/timesketch/frontend-ng/src/components/Analyzer/TimelineSearch.vue
@@ -92,8 +92,17 @@ export default {
     },
     analyzerTimelineId: {
       handler: function (id) {
-        if (id) this.selectedTimelines.push(id)
-        if (!id) this.selectedTimelines = []
+        if (Array.isArray(id)) {
+          this.selectedTimelines = id
+        } else {
+          if (id) {
+            this.selectedTimelines.push(id)
+          }
+          else {
+            this.selectedTimelines = []
+          }
+        }
+
       },
     },
   },

From e19a589f77ec4ece471d93366e8b8bf73c69edf7 Mon Sep 17 00:00:00 2001
From: Syd Pleno <syd.pleno@gmail.com>
Date: Thu, 19 Sep 2024 07:16:41 +1000
Subject: [PATCH 2/9] Add event selection to VisualizationEditor

---
 .../Visualization/AggregationEventSelect.vue  | 205 ++++++++++++++++++
 .../Visualization/VisualizationEditor.vue     |  37 ++--
 2 files changed, 221 insertions(+), 21 deletions(-)
 create mode 100644 timesketch/frontend-ng/src/components/Visualization/AggregationEventSelect.vue

diff --git a/timesketch/frontend-ng/src/components/Visualization/AggregationEventSelect.vue b/timesketch/frontend-ng/src/components/Visualization/AggregationEventSelect.vue
new file mode 100644
index 0000000000..d3f274f0e5
--- /dev/null
+++ b/timesketch/frontend-ng/src/components/Visualization/AggregationEventSelect.vue
@@ -0,0 +1,205 @@
+<!--
+Copyright 2023 Google Inc. All rights reserved.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+<template>
+  <v-container class='ma-0'>
+    <v-row class="mt-3">
+      <v-col >
+        <!-- <v-container class="ma-0"> -->
+          <ts-timeline-search
+            componentName="visualization"
+            :analyzer-timeline-id="timelineIDs"
+            @selectedTimelines="selectedTimelineIDs = $event"
+          >
+          </ts-timeline-search>
+        <!-- </v-container> -->
+      </v-col>
+    </v-row>
+    <v-row class="mt-n10">
+      <v-col>
+        <v-text-field
+          outlined
+          autofocus
+          label="Event query"
+          v-model="selectedQueryString"
+
+        >
+        </v-text-field>
+      </v-col>
+    </v-row>
+    <v-row class="mt-n10">
+      <v-col>
+        <v-autocomplete
+          v-bind="$attrs"
+          v-model="selectedRecentSearch"
+          :items="allRecentSearches"
+          clearable
+          outlined
+          label="Select a recent search"
+          :disabled="!!selectedSavedSearch"
+
+        >
+        </v-autocomplete>
+      </v-col>
+      <v-col >
+        <v-autocomplete
+          :disabled="!!selectedRecentSearch"
+          v-bind="$attrs"
+          v-model="selectedSavedSearch"
+          :items="allSavedSearches"
+          clearable
+          outlined
+          label="Select a saved search"
+        >
+        </v-autocomplete>
+      </v-col>
+    </v-row>
+  </v-container>
+</template>
+
+<script>
+import TsTimelineSearch from '../Analyzer/TimelineSearch.vue'
+
+export default {
+  components: {
+    TsTimelineSearch,
+  },
+  props: {
+    queryString: {
+      type: String
+    },
+    queryChips: {
+      type: Object
+    },
+    recentSearch: {
+      type: Object,
+    },
+    timelineIDs: {
+      type: Array,
+      default: function() {
+        return []
+      },
+    },
+  },
+  data() {
+    return {
+      selectedFilter: '',
+      selectedRecentSearch: null,
+      selectedSavedSearch: null,
+      selectedTimelineIDs: this.timelineIDs,
+      selectedQueryString: this.queryString,
+      selectedQueryChips: this.queryChips
+    }
+  },
+  computed: {
+    sketch() {
+      return this.$store.state.sketch
+    },
+    allReadyTimelines() {
+      // Sort alphabetically based on timeline name.
+      const timelines = this.sketch.timelines.filter(
+        tl => tl.status[0].status === 'ready'
+      );
+      timelines.sort((a, b) => a.name.localeCompare(b.name))
+      return timelines;
+    },
+    allRecentSearches() {
+      let searchHistory = this.$store.state.searchHistory
+      if (Array.isArray(searchHistory)) {
+        let recentSearches = this.$store.state.searchHistory.map(
+          (view) => {
+            return {
+              text: `${view['query_string']} (${view['query_result_count']})`,
+              value: view
+            }
+          }
+        )
+        return recentSearches
+      }
+      return []
+    },
+    allSavedSearches() {
+      let savedSearches = this.$store.state.meta.views.map(
+        (view) => {
+          return {
+            text: view['name'], value: view
+          }
+        }
+      )
+      return savedSearches
+    }
+  },
+  watch: {
+    queryString() {
+      console.log(this.queryString)
+      if (this.queryString) {
+        return
+      }
+      this.selectedRecentSearch = null
+      this.selectedSavedSearch = null
+    },
+    selectedSavedSearch() {
+      if (!this.selectedSavedSearch) {
+        this.selectedQueryString = ''
+        this.selectedTimelineIDs = []
+        this.selectedQueryChips = null
+      } else {
+        this.selectedQueryString = this.selectedSavedSearch.query
+        let queryFilter = JSON.parse(this.selectedSavedSearch.filter)
+
+        let indices = queryFilter.indices
+        if (indices === '_all') {
+          this.selectedTimelineIDs = this.allReadyTimelines.map((x) => x.id)
+        } else {
+          this.selectedTimelineIDs = indices
+        }
+
+        this.selectedQueryChips = queryFilter.chips.filter(
+          (chip) => chip.type === 'label' || chip.type === 'term' || chip.type === 'datetime_range'
+        );
+      }
+    },
+    selectedRecentSearch() {
+      if (!this.selectedRecentSearch) {
+        this.selectedQueryString = ''
+        this.selectedTimelineIDs = []
+        this.selectedQueryChips = null
+      } else {
+        this.selectedQueryString = this.selectedRecentSearch.query_string
+        let queryFilter = JSON.parse(this.selectedRecentSearch.query_filter)
+        let indices = queryFilter.indices
+        if (indices === '_all') {
+          this.selectedTimelineIDs = this.allReadyTimelines.map((x) => x.id)
+        } else {
+          this.selectedTimelineIDs = indices
+        }
+
+        this.selectedQueryChips = queryFilter.chips.filter(
+          (chip) => chip.type === 'label' || chip.type === 'term' || chip.type === 'datetime_range'
+        );
+      }
+    },
+    selectedTimelineIDs() {
+      this.$emit('updateTimelineIDs', this.selectedTimelineIDs)
+    },
+    selectedQueryString() {
+      this.$emit('updateQueryString', this.selectedQueryString)
+    },
+    selectedQueryChips() {
+      this.$emit('updateQueryChips', this.selectedQueryChips)
+    }
+  }
+}
+</script>
diff --git a/timesketch/frontend-ng/src/components/Visualization/VisualizationEditor.vue b/timesketch/frontend-ng/src/components/Visualization/VisualizationEditor.vue
index 111e6bebcd..272f19dea0 100644
--- a/timesketch/frontend-ng/src/components/Visualization/VisualizationEditor.vue
+++ b/timesketch/frontend-ng/src/components/Visualization/VisualizationEditor.vue
@@ -36,19 +36,18 @@ limitations under the License.
       </v-btn>
     </v-toolbar>
     <v-divider class="mx-3"></v-divider>
-    <v-row class="mt-3">
-      <v-col >
-        <v-container class="ma-0">
-          <ts-timeline-search 
-            componentName="visualization" 
-            @selectedTimelines="selectedTimelineIDs = $event"></ts-timeline-search>
-        </v-container>
-      </v-col>
-    </v-row>
     <v-row class="mt-3">
       <v-col>
+        <TsAggregationEventSelect
+          @updateTimelineIDs="selectedTimelineIDs = $event"
+          :timelineIDs="selectedTimelineIDs"
+          @updateQueryString="selectedQueryString = $event"
+          :queryString="selectedQueryString"
+          @updateQueryChips="selectedQueryChips = $event"
+          :queryChips="selectedQueryChips"
+        >
+        </TsAggregationEventSelect>
         <TsAggregationConfig
-          @enabled="selectedTimelineIDs.length > 0"
           :field="selectedField"
           @updateField="selectedField = $event"
           :aggregator="selectedAggregator"
@@ -120,7 +119,7 @@ limitations under the License.
           text
           color="primary"
           @click="loadAggregationData"
-          :disabled="selectedTimelineIDs.length == 0 || !(
+          :disabled="!validAggregation || !(
             selectedField &&
             selectedAggregator &&
             selectedChartType
@@ -133,7 +132,7 @@ limitations under the License.
         <v-btn
           text
           @click="clear"
-          :disabled="!(
+          :disabled="!validAggregation || !(
             selectedField &&
             selectedAggregator &&
             selectedChartType
@@ -157,14 +156,14 @@ import ApiClient from '../../utils/RestApiClient'
 import TsAggregationConfig from './AggregationConfig.vue'
 import TsChartConfig from './ChartConfig.vue'
 import TsChartCard from './ChartCard.vue'
-import TsTimelineSearch from '../Analyzer/TimelineSearch.vue'
+import TsAggregationEventSelect from './AggregationEventSelect.vue'
 
 export default {
   components: {
     TsAggregationConfig,
     TsChartConfig,
     TsChartCard,
-    TsTimelineSearch,
+    TsAggregationEventSelect,
   },
   props: {
     aggregator: {
@@ -286,6 +285,9 @@ export default {
     }
   },
   computed: {
+    validAggregation() {
+      return this.selectedTimelineIDs.length > 0 && this.selectedQueryString
+    },
     sketch() {
       return this.$store.state.sketch
     },
@@ -304,13 +306,6 @@ export default {
       }
       return undefined
     },
-    currentQueryString() {
-      const currentSearchNode = this.$store.state.currentSearchNode
-      if (!currentSearchNode) {
-        return ""
-      }
-      return currentSearchNode.query_string
-    },
   },
   methods: {
     rename() {

From 46f42874eb182c85e4dc2d5bc17b18e41744e4dc Mon Sep 17 00:00:00 2001
From: Syd Pleno <sydp@google.com>
Date: Fri, 20 Sep 2024 05:29:17 +0000
Subject: [PATCH 3/9] Add placeholder image

---
 .../frontend-ng/public/vis_placeholder.png       | Bin 0 -> 6651 bytes
 1 file changed, 0 insertions(+), 0 deletions(-)
 create mode 100644 timesketch/frontend-ng/public/vis_placeholder.png

diff --git a/timesketch/frontend-ng/public/vis_placeholder.png b/timesketch/frontend-ng/public/vis_placeholder.png
new file mode 100644
index 0000000000000000000000000000000000000000..bbcdd1e865189690e837aebc6b2f8a4e9de341a1
GIT binary patch
literal 6651
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

literal 0
HcmV?d00001


From 43752dcdb274ed8ed20f964c506d9c308e51fb6f Mon Sep 17 00:00:00 2001
From: Syd Pleno <syd.pleno@gmail.com>
Date: Sat, 21 Sep 2024 10:12:28 +1000
Subject: [PATCH 4/9] Add placeholder image

---
 .../frontend-ng/dist/vis_placeholder.png      | Bin 0 -> 6651 bytes
 .../Visualization/AggregationEventSelect.vue  |  24 +++++++++---------
 .../Visualization/VisualizationEditor.vue     |   6 +++++
 3 files changed, 18 insertions(+), 12 deletions(-)
 create mode 100644 timesketch/frontend-ng/dist/vis_placeholder.png

diff --git a/timesketch/frontend-ng/dist/vis_placeholder.png b/timesketch/frontend-ng/dist/vis_placeholder.png
new file mode 100644
index 0000000000000000000000000000000000000000..bbcdd1e865189690e837aebc6b2f8a4e9de341a1
GIT binary patch
literal 6651
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

literal 0
HcmV?d00001

diff --git a/timesketch/frontend-ng/src/components/Visualization/AggregationEventSelect.vue b/timesketch/frontend-ng/src/components/Visualization/AggregationEventSelect.vue
index d3f274f0e5..a40de31ff0 100644
--- a/timesketch/frontend-ng/src/components/Visualization/AggregationEventSelect.vue
+++ b/timesketch/frontend-ng/src/components/Visualization/AggregationEventSelect.vue
@@ -34,36 +34,36 @@ limitations under the License.
           autofocus
           label="Event query"
           v-model="selectedQueryString"
-
         >
         </v-text-field>
       </v-col>
     </v-row>
     <v-row class="mt-n10">
       <v-col>
-        <v-autocomplete
+        <v-select
           v-bind="$attrs"
           v-model="selectedRecentSearch"
           :items="allRecentSearches"
           clearable
-          outlined
-          label="Select a recent search"
+          solo
+          dense
+          label="Recent search"
           :disabled="!!selectedSavedSearch"
-
         >
-        </v-autocomplete>
+        </v-select>
       </v-col>
-      <v-col >
-        <v-autocomplete
-          :disabled="!!selectedRecentSearch"
+      <v-col>
+        <v-select
           v-bind="$attrs"
           v-model="selectedSavedSearch"
           :items="allSavedSearches"
           clearable
-          outlined
-          label="Select a saved search"
+          solo
+          dense
+          label="Saved search"
+          :disabled="!!selectedRecentSearch"
         >
-        </v-autocomplete>
+        </v-select>
       </v-col>
     </v-row>
   </v-container>
diff --git a/timesketch/frontend-ng/src/components/Visualization/VisualizationEditor.vue b/timesketch/frontend-ng/src/components/Visualization/VisualizationEditor.vue
index 272f19dea0..dac8c845da 100644
--- a/timesketch/frontend-ng/src/components/Visualization/VisualizationEditor.vue
+++ b/timesketch/frontend-ng/src/components/Visualization/VisualizationEditor.vue
@@ -86,6 +86,12 @@ limitations under the License.
         ></TsChartConfig>
         </v-col>
         <v-col cols="8">
+          <v-img
+            v-if="chartSeries == null"
+            src="/dist/vis_placeholder.png"
+            width="750"
+            height="520"
+          ></v-img>
           <TsChartCard
             v-if="chartSeries && selectedChartType"
             :fieldName="selectedField.field"

From 69f73ca931f141b62f9d9c4aac3bbe7b769146cc Mon Sep 17 00:00:00 2001
From: Syd Pleno <syd.pleno@gmail.com>
Date: Sat, 21 Sep 2024 11:03:55 +1000
Subject: [PATCH 5/9] Fix type

---
 .../src/components/Visualization/AggregationEventSelect.vue     | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/timesketch/frontend-ng/src/components/Visualization/AggregationEventSelect.vue b/timesketch/frontend-ng/src/components/Visualization/AggregationEventSelect.vue
index a40de31ff0..1cb4d14ea7 100644
--- a/timesketch/frontend-ng/src/components/Visualization/AggregationEventSelect.vue
+++ b/timesketch/frontend-ng/src/components/Visualization/AggregationEventSelect.vue
@@ -81,7 +81,7 @@ export default {
       type: String
     },
     queryChips: {
-      type: Object
+      type: Array
     },
     recentSearch: {
       type: Object,

From 3a26d28f179721b7560ec8ac55cd3c83ffd33fcc Mon Sep 17 00:00:00 2001
From: Syd Pleno <syd.pleno@gmail.com>
Date: Sun, 22 Sep 2024 19:33:13 +1000
Subject: [PATCH 6/9] Update aggregator

---
 timesketch/lib/aggregators/apex.py | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/timesketch/lib/aggregators/apex.py b/timesketch/lib/aggregators/apex.py
index dc6e4d19e7..eff76c1834 100644
--- a/timesketch/lib/aggregators/apex.py
+++ b/timesketch/lib/aggregators/apex.py
@@ -137,7 +137,8 @@ def add_match_phrase_filter(self, field, value, clause="must"):
 
         if clause not in self._VALID_QUERY_CLAUSES:
             raise ValueError(f"Unknown boolean clause {clause}")
-
+        if isinstance(value, str):
+            field = f"{field}.keyword"
         self.bool_queries[clause].append({"match_phrase": {field: {"query": value}}})
 
     def add_term_filter(self, field, value, clause="filter", term_type="term"):
@@ -409,7 +410,7 @@ def _build_aggregation_query_spec(self, aggregator_options):
                 elif chip_type == "datetime_range":
                     aggregation_query.add_datetime_range(chip_value, chip_operator)
                 elif chip_type == "term":
-                    aggregation_query.add_term_filter(
+                    aggregation_query.add_match_phrase_filter(
                         chip_field, chip_value, chip_operator
                     )
                 else:
@@ -418,7 +419,6 @@ def _build_aggregation_query_spec(self, aggregator_options):
         aggregation_query.aggregation_query = self._get_aggregation_dsl(
             aggregator_options
         )
-
         return aggregation_query.spec
 
     def run(

From dcf8edbed55c35d7f6e9bae14731ea6994412fbc Mon Sep 17 00:00:00 2001
From: janosch <jkpr@google.com>
Date: Tue, 8 Oct 2024 22:18:15 +0000
Subject: [PATCH 7/9] * Adding an API endpoint to get fields per timeline. *
 Provide only fields that exist in all selected timelines for the aggregation.
 * Minor UI fix for the EventList * Dynamically sized the placeholder picture

---
 timesketch/api/v1/resources/timeline.py       | 98 +++++++++++++++++++
 timesketch/api/v1/routes.py                   |  5 +
 .../src/components/Explore/EventList.vue      | 10 +-
 .../Visualization/AggregationConfig.vue       | 10 ++
 .../Visualization/EventFieldSelect.vue        | 55 ++++++-----
 .../Visualization/VisualizationEditor.vue     | 59 ++++++++++-
 .../frontend-ng/src/utils/RestApiClient.js    |  3 +
 7 files changed, 206 insertions(+), 34 deletions(-)

diff --git a/timesketch/api/v1/resources/timeline.py b/timesketch/api/v1/resources/timeline.py
index 78dfc38f57..9d1425bc0e 100644
--- a/timesketch/api/v1/resources/timeline.py
+++ b/timesketch/api/v1/resources/timeline.py
@@ -20,6 +20,7 @@
 import six
 
 import opensearchpy
+from flask import jsonify
 from flask import request
 from flask import abort
 from flask import current_app
@@ -40,6 +41,7 @@
 from timesketch.models.sketch import SearchIndex
 from timesketch.models.sketch import Sketch
 from timesketch.models.sketch import Timeline
+from timesketch.lib.aggregators import manager as aggregator_manager
 
 
 logger = logging.getLogger("timesketch.timeline_api")
@@ -531,3 +533,99 @@ def post(self):
         utils.update_sketch_last_activity(sketch)
 
         return self.to_json(searchindex, status_code=HTTP_STATUS_CODE_CREATED)
+
+
+class TimelineFieldsResource(resources.ResourceMixin, Resource):
+    """Resource to retrieve unique fields present in a timeline.
+
+    This resource aggregates data types within a timeline and then queries
+    OpenSearch to retrieve all unique fields present across those data types,
+    excluding default Timesketch fields.
+    """
+
+    @login_required
+    def get(self, sketch_id, timeline_id):
+        """Handles GET request to retrieve unique fields in a timeline.
+
+        Args:
+            sketch_id (int): The ID of the sketch.
+            timeline_id (int): The ID of the timeline.
+
+        Returns:
+            flask.wrappers.Response: A JSON response containing a list of
+                unique fields in the timeline, sorted alphabetically. Returns
+                an empty list if no fields are found or if there's an error.
+                Possible error codes: 400, 403, 404.
+        """
+
+        sketch = Sketch.get_with_acl(sketch_id)
+        if not sketch:
+            abort(HTTP_STATUS_CODE_NOT_FOUND, "No sketch found with this ID.")
+        if not sketch.has_permission(current_user, "read"):
+            abort(
+                HTTP_STATUS_CODE_FORBIDDEN,
+                "User does not have read access controls on sketch.",
+            )
+
+        timeline = Timeline.get_by_id(timeline_id)
+        if not timeline:
+            abort(HTTP_STATUS_CODE_NOT_FOUND, "No timeline found with this ID.")
+
+        # Check that this timeline belongs to the sketch
+        if timeline.sketch.id != sketch.id:
+            abort(
+                HTTP_STATUS_CODE_NOT_FOUND,
+                "The timeline does not belong to the sketch.",
+            )
+
+        index_name = timeline.searchindex.index_name
+        timeline_fields = set()
+
+        # 1. Get distinct data types for the timeline using aggregation
+        aggregator_name = "field_bucket"
+        aggregator_parameters = {
+            "field": "data_type",
+            "limit": "10000",  # Get all data types
+        }
+
+        agg_class = aggregator_manager.AggregatorManager.get_aggregator(aggregator_name)
+        if not agg_class:
+            abort(HTTP_STATUS_CODE_NOT_FOUND, f"Aggregator {aggregator_name} not found")
+
+        aggregator = agg_class(
+            sketch_id=sketch_id, indices=[index_name], timeline_ids=[timeline_id]
+        )
+        result_obj = aggregator.run(**aggregator_parameters)
+
+        if not result_obj:
+            abort(HTTP_STATUS_CODE_BAD_REQUEST, "Error running data type aggregation.")
+
+        data_types = sorted([bucket["data_type"] for bucket in result_obj.values])
+
+        # 2. For each data type, query for a single event to get fields
+        for data_type in data_types:
+            query_filter = {"indices": [timeline_id], "size": 1}
+
+            try:
+                result = self.datastore.search(
+                    sketch_id=sketch_id,
+                    query_string=f'data_type:"{data_type}"',
+                    query_filter=query_filter,
+                    query_dsl=None,
+                    indices=[index_name],
+                    timeline_ids=[timeline_id],
+                )
+            except ValueError as e:
+                abort(HTTP_STATUS_CODE_BAD_REQUEST, str(e))
+
+            if isinstance(result, dict) and result.get("hits", {}).get("hits", []):
+                event = result["hits"]["hits"][0]["_source"]
+                for field in event:
+                    if field not in [
+                        "datetime",
+                        "timestamp",
+                        "__ts_timeline_id",
+                    ]:
+                        timeline_fields.add(field)
+
+        return jsonify({"objects": sorted(list(timeline_fields))})
diff --git a/timesketch/api/v1/routes.py b/timesketch/api/v1/routes.py
index 9846d90a7c..2e07fc47bc 100644
--- a/timesketch/api/v1/routes.py
+++ b/timesketch/api/v1/routes.py
@@ -56,6 +56,7 @@
 from .resources.explore import QueryResource
 from .resources.timeline import TimelineResource
 from .resources.timeline import TimelineListResource
+from timesketch.api.v1.resources.timeline import TimelineFieldsResource
 from .resources.searchindex import SearchIndexListResource
 from .resources.searchindex import SearchIndexResource
 from .resources.session import SessionResource
@@ -167,6 +168,10 @@
         TimelineResource,
         "/sketches/<int:sketch_id>/timelines/<int:timeline_id>/",
     ),
+    (
+        TimelineFieldsResource,
+        "/sketches/<int:sketch_id>/timelines/<int:timeline_id>/fields/",
+    ),
     (SearchIndexListResource, "/searchindices/"),
     (SearchIndexResource, "/searchindices/<int:searchindex_id>/"),
     (
diff --git a/timesketch/frontend-ng/src/components/Explore/EventList.vue b/timesketch/frontend-ng/src/components/Explore/EventList.vue
index d957f27c3a..9d6a9f5678 100644
--- a/timesketch/frontend-ng/src/components/Explore/EventList.vue
+++ b/timesketch/frontend-ng/src/components/Explore/EventList.vue
@@ -30,12 +30,10 @@ limitations under the License.
       <p>
         <v-dialog v-model="saveSearchMenu" v-if="!disableSaveSearch" width="500">
           <template v-slot:activator="{ on, attrs }">
-            <div v-bind="attrs" v-on="on">
-              <v-btn small depressed>
-                <v-icon left small title="Save current search">mdi-content-save-outline</v-icon>
-                Save search
-              </v-btn>
-            </div>
+            <v-btn small depressed v-bind="attrs" v-on="on" title="Save Search">
+              <v-icon left small >mdi-content-save-outline</v-icon>
+              Save search
+            </v-btn>
           </template>
 
           <v-card class="pa-4">
diff --git a/timesketch/frontend-ng/src/components/Visualization/AggregationConfig.vue b/timesketch/frontend-ng/src/components/Visualization/AggregationConfig.vue
index 3fb73e778a..24b26904f5 100644
--- a/timesketch/frontend-ng/src/components/Visualization/AggregationConfig.vue
+++ b/timesketch/frontend-ng/src/components/Visualization/AggregationConfig.vue
@@ -20,6 +20,8 @@ limitations under the License.
         <TsEventFieldSelect
           :field="selectedField"
           @selectedField="selectedField = $event"
+          :timelineFields="timelineFields"
+          :loadingFields="loadingFields"
           :rules="[rules.required]"
           >
           </TsEventFieldSelect>
@@ -114,6 +116,14 @@ export default {
     splitByTimeline: {
       type: Boolean,
     },
+    timelineFields: {
+        type: Array,
+        default: () => [],
+    },
+    loadingFields: {
+        type: Boolean,
+        default: false
+    },
   },
   data() {
     return {
diff --git a/timesketch/frontend-ng/src/components/Visualization/EventFieldSelect.vue b/timesketch/frontend-ng/src/components/Visualization/EventFieldSelect.vue
index a6976e2bb1..bf4694c915 100644
--- a/timesketch/frontend-ng/src/components/Visualization/EventFieldSelect.vue
+++ b/timesketch/frontend-ng/src/components/Visualization/EventFieldSelect.vue
@@ -17,19 +17,20 @@ limitations under the License.
   <v-autocomplete
     outlined
     v-model="selectedField"
-    :items="allNonTimestampFields"
+    :items="mappedTimelineFields"
     label="Field name to aggregate"
+    :loading="loadingFields"
     @input="$emit('selectedField', $event)"
   >
-    <template 
+    <template
       #item="{ item, on, attrs }"
     >
-      <v-list-item 
-        v-on="on" 
+      <v-list-item
+        v-on="on"
         v-bind="attrs"
       >
         <v-list-item-avatar>
-          <v-icon> 
+          <v-icon>
             {{ item.value.type === 'text' ? 'mdi-code-string' : 'mdi-pound-box' }}
           </v-icon>
         </v-list-item-avatar>
@@ -38,11 +39,11 @@ limitations under the License.
         </v-list-item-content>
       </v-list-item>
     </template>
-    <template 
+    <template
       #selection="{ item }"
     >
-      <v-icon> 
-        {{ item.value.type === 'text' ? 'mdi-code-string' : 'mdi-pound-box' }} 
+      <v-icon>
+        {{ item.value.type === 'text' ? 'mdi-code-string' : 'mdi-pound-box' }}
       </v-icon>
       &nbsp; &nbsp; {{ item.text }}
     </template>
@@ -56,34 +57,40 @@ export default {
     field: {
       type: Object,
     },
+    timelineFields: {
+      type: Array,
+      default: () => [],
+    },
+    loadingFields: {
+        type: Boolean,
+        default: false
+    },
   },
   data() {
     return {
       selectedField: this.field,
-      
     }
   },
   computed: {
-    allNonTimestampFields() {
-      let mappings = this.$store.state.meta.mappings
-        .filter(
-          (mapping) => {
-            return (
-              mapping['field'] !== 'datetime'
-              && mapping['field'] !== 'timestamp'
-            )
-        })
-        .map(
-          (mapping) => {
-            return {text: mapping['field'], value: mapping}}
-        )
-      return mappings
+    mappedTimelineFields() {
+      const mappings = this.$store.state.meta.mappings;
+
+      return this.timelineFields.map(field => {
+        const mapping = mappings.find(m => m.field === field);
+        const type = mapping ? mapping.type : 'unknown';
+        return { text: field, value: { field, type } };
+      });
     },
   },
   watch: {
     field() {
         this.selectedField = this.field
-    }
+    },
+    timelineFields(newFields) {
+      if (!newFields || newFields.length === 0) {
+          this.selectedField = null;
+      }
+    },
   }
 }
 </script>
diff --git a/timesketch/frontend-ng/src/components/Visualization/VisualizationEditor.vue b/timesketch/frontend-ng/src/components/Visualization/VisualizationEditor.vue
index dac8c845da..49b3ee1d4b 100644
--- a/timesketch/frontend-ng/src/components/Visualization/VisualizationEditor.vue
+++ b/timesketch/frontend-ng/src/components/Visualization/VisualizationEditor.vue
@@ -39,7 +39,7 @@ limitations under the License.
     <v-row class="mt-3">
       <v-col>
         <TsAggregationEventSelect
-          @updateTimelineIDs="selectedTimelineIDs = $event"
+          @updateTimelineIDs="getTimelineFields"
           :timelineIDs="selectedTimelineIDs"
           @updateQueryString="selectedQueryString = $event"
           :queryString="selectedQueryString"
@@ -48,6 +48,8 @@ limitations under the License.
         >
         </TsAggregationEventSelect>
         <TsAggregationConfig
+          :timelineFields="availableTimelineFields"
+          :loadingFields="loadingFields"
           :field="selectedField"
           @updateField="selectedField = $event"
           :aggregator="selectedAggregator"
@@ -85,12 +87,13 @@ limitations under the License.
           @updateShowDataLabels="selectedShowDataLabels = $event"
         ></TsChartConfig>
         </v-col>
-        <v-col cols="8">
+        <v-col cols="8" :class="chartSeries == null? 'd-flex justify-center align-center' : ''">
           <v-img
             v-if="chartSeries == null"
             src="/dist/vis_placeholder.png"
-            width="750"
-            height="520"
+            max-width="600"
+            max-height="500"
+            contain
           ></v-img>
           <TsChartCard
             v-if="chartSeries && selectedChartType"
@@ -213,6 +216,7 @@ export default {
     },
     queryString: {
       type: String,
+      default: "*"
     },
     range: {
       type: Object,
@@ -288,6 +292,8 @@ export default {
       selectedYTitle: this.yTitle,
       renameVisualDialog: false,
       selectedChartTitleDraft: this.selectedChartTitleDraft,
+      availableTimelineFields: [],
+      loadingFields: false,
     }
   },
   computed: {
@@ -314,6 +320,51 @@ export default {
     },
   },
   methods: {
+    getTimelineFields(timelineIDs) {
+      this.selectedTimelineIDs = timelineIDs
+      if (!timelineIDs || timelineIDs.length === 0 ) {
+        this.availableTimelineFields = []
+        return;
+      }
+
+      this.loadingFields = true;
+
+      if (timelineIDs.length === 1) {
+        ApiClient.getTimelineFields(this.sketch.id, timelineIDs[0])
+          .then(response => {
+            this.availableTimelineFields = response.data.objects
+            this.loadingFields = false
+          })
+          .catch(error => {
+            console.error("Error fetching fields:", error);
+            this.availableTimelineFields = [];
+            this.loadingFields = false
+          });
+      }
+      else {
+        const promises = timelineIDs.map(timelineID => {
+          return ApiClient.getTimelineFields(this.sketch.id, timelineID)
+            .then(response => response.data.objects)
+            .catch(error => {
+                console.error("Error fetching timeline fields:", error);
+                return []
+            })
+          })
+
+          Promise.all(promises)
+            .then(results => {
+              // Flatten the arrays and create a set to guarantee uniqueness
+              const intersection = results.reduce((a, b) => a.filter(c => b.includes(c)));
+              this.availableTimelineFields = intersection
+              this.loadingFields = false;
+            })
+            .catch(error => {
+              console.error("Error in Promise.all", error)
+              this.availableTimelineFields = []
+              this.loadingFields = false;
+            })
+      }
+    },
     rename() {
       this.renameVisualDialog = false
       this.selectedChartTitle = this.selectedChartTitleDraft
diff --git a/timesketch/frontend-ng/src/utils/RestApiClient.js b/timesketch/frontend-ng/src/utils/RestApiClient.js
index 3fe3809479..b514354d8b 100644
--- a/timesketch/frontend-ng/src/utils/RestApiClient.js
+++ b/timesketch/frontend-ng/src/utils/RestApiClient.js
@@ -111,6 +111,9 @@ export default {
   getSketchTimelineAnalysis(sketchId, timelineId) {
     return RestApiClient.get('/sketches/' + sketchId + '/timelines/' + timelineId + '/analysis/')
   },
+  getTimelineFields(sketchId, timelineId){
+    return RestApiClient.get('/sketches/' + sketchId + '/timelines/' + timelineId + '/fields/')
+  },
   saveSketchTimeline(sketchId, timelineId, name, description, color) {
     let formData = {
       name: name,

From a3e3562bc8f898167d33bf8deac71e69a31ed6c4 Mon Sep 17 00:00:00 2001
From: janosch <jkpr@google.com>
Date: Tue, 8 Oct 2024 22:24:56 +0000
Subject: [PATCH 8/9] linter

---
 timesketch/api/v1/routes.py | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/timesketch/api/v1/routes.py b/timesketch/api/v1/routes.py
index 2e07fc47bc..0993110caa 100644
--- a/timesketch/api/v1/routes.py
+++ b/timesketch/api/v1/routes.py
@@ -56,7 +56,7 @@
 from .resources.explore import QueryResource
 from .resources.timeline import TimelineResource
 from .resources.timeline import TimelineListResource
-from timesketch.api.v1.resources.timeline import TimelineFieldsResource
+from .resources.timeline import TimelineFieldsResource
 from .resources.searchindex import SearchIndexListResource
 from .resources.searchindex import SearchIndexResource
 from .resources.session import SessionResource

From 0b31ca71714fb730052c1f577ea73b69c91bade6 Mon Sep 17 00:00:00 2001
From: janosch <jkpr@google.com>
Date: Wed, 9 Oct 2024 15:28:21 +0000
Subject: [PATCH 9/9] Add todo.

---
 timesketch/api/v1/resources/timeline.py | 1 +
 1 file changed, 1 insertion(+)

diff --git a/timesketch/api/v1/resources/timeline.py b/timesketch/api/v1/resources/timeline.py
index 9d1425bc0e..3c81023d44 100644
--- a/timesketch/api/v1/resources/timeline.py
+++ b/timesketch/api/v1/resources/timeline.py
@@ -535,6 +535,7 @@ def post(self):
         return self.to_json(searchindex, status_code=HTTP_STATUS_CODE_CREATED)
 
 
+# TODO(Issue 3200): Research more efficient ways to gather unique fields.
 class TimelineFieldsResource(resources.ResourceMixin, Resource):
     """Resource to retrieve unique fields present in a timeline.