From 7a7f74aba4e75cb9d8107f5acbf189e291c8bdb7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Carsten=20K=C3=B6nig?= <carstenkoenig92@gmail.com>
Date: Sun, 8 Dec 2024 19:39:18 +0100
Subject: [PATCH] adds health filter to shards view

---
 CHANGELOG.md                          |  2 ++
 src/components/shards/IndexShards.vue | 14 +++++++++++---
 src/components/shards/ShardsTable.vue |  5 ++++-
 3 files changed, 17 insertions(+), 4 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 63fbea03..069f4055 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -4,6 +4,8 @@
 
 * truncate long fields in search results table, fixes [#211](https://github.com/cars10/elasticvue/issues/211)
 * fix search results table column filtering again, fixes [#244](https://github.com/cars10/elasticvue/issues/244)
+* fix hotkey issues, fixes [#273](https://github.com/cars10/elasticvue/issues/273)
+* adds health filter to shards view
 
 ## 1.1.0
 
diff --git a/src/components/shards/IndexShards.vue b/src/components/shards/IndexShards.vue
index ecebd6b4..6d564a41 100644
--- a/src/components/shards/IndexShards.vue
+++ b/src/components/shards/IndexShards.vue
@@ -10,13 +10,16 @@
     <q-separator />
 
     <loader-status :request-state="requestState">
-      <shards-table :shards="shards" @reload="load" />
+      <shards-table :shards="shards" @reload="load">
+        <q-select v-model="health" :options="['green', 'yellow', 'red']" label="Health" clearable dense outlined
+                  class="q-mr-md" style="min-width: 140px" />
+      </shards-table>
     </loader-status>
   </q-card>
 </template>
 
 <script setup lang="ts">
-  import { onMounted, Ref, ref } from 'vue'
+  import { onMounted, Ref, ref, watch } from 'vue'
   import ReloadButton from '../shared/ReloadButton.vue'
   import LoaderStatus from '../shared/LoaderStatus.vue'
   import { useElasticsearchAdapter } from '../../composables/CallElasticsearch'
@@ -28,9 +31,13 @@
   const shards: Ref<TableShards> = ref({} as TableShards)
 
   const { requestState, callElasticsearch } = useElasticsearchAdapter()
-  const catIndicesArgs = { h: ['index', 'health', 'pri', 'rep', 'status'], s: ['health:desc', 'index'] }
+  const health = ref(null)
 
   const load = async () => {
+    let catIndicesArgs = { h: ['index', 'health', 'pri', 'rep', 'status'], s: ['health:desc', 'index'] }
+
+    if (health.value) catIndicesArgs['health'] = health.value
+
     const catIndices = callElasticsearch('catIndices', catIndicesArgs)
     const catShards = callElasticsearch('catShards', CAT_METHOD_PARAMS)
 
@@ -38,6 +45,7 @@
     shards.value = convertShards(rawShards, indices)
   }
 
+  watch(health, load)
   onMounted(load)
 
   const CAT_METHOD_PARAMS = {
diff --git a/src/components/shards/ShardsTable.vue b/src/components/shards/ShardsTable.vue
index 14a6561e..9925c284 100644
--- a/src/components/shards/ShardsTable.vue
+++ b/src/components/shards/ShardsTable.vue
@@ -8,6 +8,8 @@
     </div>
 
     <div class="flex">
+      <slot />
+
       <filter-input v-model="filter" />
 
       <q-btn icon="settings" round flat class="q-ml-sm">
@@ -47,7 +49,8 @@
             </svg>
             <span :class="{'text-underline': currentReroutingShard.index === col.name}">{{ col.label }}</span>
           </div>
-          <small class="text-weight-regular" :title="`${shards.indices[col.name].pri} pri / ${shards.indices[col.name].rep} rep`">
+          <small class="text-weight-regular"
+                 :title="`${shards.indices[col.name].pri} pri / ${shards.indices[col.name].rep} rep`">
             {{ shards.indices[col.name].pri }}/{{ shards.indices[col.name].rep }} shards
           </small>
         </q-th>