From 6fd1670b92a7f2aa78579db68b05fdef155830e6 Mon Sep 17 00:00:00 2001
From: "alexander.kerscher" <alexander.kerscher@muenchen.de>
Date: Thu, 19 Dec 2024 15:43:53 +0100
Subject: [PATCH] reset search on click fix zoom bug

---
 frontend/src/App.vue                             |  7 +++++++
 frontend/src/components/app/SearchInputField.vue | 12 ++++--------
 frontend/src/components/map/ZaehlstelleMap.vue   |  2 ++
 frontend/src/store/SearchStore.ts                |  9 +++++++++
 4 files changed, 22 insertions(+), 8 deletions(-)

diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index bb563a3b..96189ff6 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -15,6 +15,7 @@
           <router-link
             to="/"
             style="text-decoration: none"
+            @click="resetSearch"
           >
             <v-toolbar-title class="text-white font-weight-medium">
               <span class="font-weight-medium">DAVe</span>
@@ -79,6 +80,7 @@ import InfoMessage from "@/components/app/InfoMessage.vue";
 import SearchInputField from "@/components/app/SearchInputField.vue";
 import VisitHistory from "@/components/app/VisitHistory.vue";
 import TheSnackbar from "@/components/common/TheSnackbar.vue";
+import { useSearchStore } from "@/store/SearchStore";
 import { useSnackbarStore } from "@/store/SnackbarStore";
 import { useUserStore } from "@/store/UserStore";
 import SsoUserInfoResponse from "@/types/app/SsoUserInfoResponse";
@@ -93,6 +95,7 @@ const frontendVersion = ref("");
 
 const snackbarStore = useSnackbarStore();
 const userStore = useUserStore();
+const searchStore = useSearchStore();
 const route = useRoute();
 
 created();
@@ -157,6 +160,10 @@ function shortCuts(event: KeyboardEvent) {
     }
   }
 }
+
+function resetSearch() {
+  searchStore.resetAndTriggerSearch();
+}
 </script>
 
 <style>
diff --git a/frontend/src/components/app/SearchInputField.vue b/frontend/src/components/app/SearchInputField.vue
index 64ac747e..9e1f3016 100644
--- a/frontend/src/components/app/SearchInputField.vue
+++ b/frontend/src/components/app/SearchInputField.vue
@@ -72,7 +72,7 @@ import type SucheZaehlstelleSuggestDTO from "@/types/suche/SucheZaehlstelleSugge
 import type SucheZaehlungSuggestDTO from "@/types/suche/SucheZaehlungSuggestDTO";
 
 import { isEmpty, isNil } from "lodash";
-import { onMounted, ref, watch } from "vue";
+import { ref, watch } from "vue";
 import { useRoute, useRouter } from "vue-router";
 
 import SucheService from "@/api/service/SucheService";
@@ -98,10 +98,6 @@ const router = useRouter();
 const snackbarStore = useSnackbarStore();
 const searchStore = useSearchStore();
 
-onMounted(() => {
-  clearSearch();
-});
-
 function suggest(query: string) {
   if (!isEmpty(query)) {
     lastSuggestQuery.value = query;
@@ -171,8 +167,7 @@ function suggest(query: string) {
 function clearSearch(): void {
   searchQuery.value = "";
   selectedSuggestion.value = undefined;
-  searchStore.setLastSearchQuery(searchQuery.value);
-  search();
+  searchStore.resetAndTriggerSearch();
 }
 
 function searchOrShowSelectedSuggestion() {
@@ -272,9 +267,10 @@ function iconOfSuggestion(type: string) {
 }
 
 watch(
-  () => searchStore.getLastSearchQuery,
+  () => searchStore.getTriggerSearch,
   () => {
     searchQuery.value = searchStore.getLastSearchQuery;
+    selectedSuggestion.value = undefined;
     search();
   }
 );
diff --git a/frontend/src/components/map/ZaehlstelleMap.vue b/frontend/src/components/map/ZaehlstelleMap.vue
index 0fce03cc..de1e418c 100644
--- a/frontend/src/components/map/ZaehlstelleMap.vue
+++ b/frontend/src/components/map/ZaehlstelleMap.vue
@@ -311,6 +311,8 @@ function setMarkerToMap() {
     // Zaehlartenmarker erzeugen
     setZaehlartenmarkerToMap();
     map.setView(center.value, zoomValue.value);
+  } else {
+    map.setView(center.value, zoomValue.value);
   }
 }
 
diff --git a/frontend/src/store/SearchStore.ts b/frontend/src/store/SearchStore.ts
index 9475d20b..8014e406 100644
--- a/frontend/src/store/SearchStore.ts
+++ b/frontend/src/store/SearchStore.ts
@@ -6,9 +6,11 @@ import { computed, ref } from "vue";
 export const useSearchStore = defineStore("searchStore", () => {
   const searchResult = ref<Array<AnzeigeKarteDTO>>([]);
   const lastSearchQuery = ref("");
+  const triggerSearch = ref(false);
 
   const getSearchResult = computed(() => searchResult.value);
   const getLastSearchQuery = computed(() => lastSearchQuery.value);
+  const getTriggerSearch = computed(() => triggerSearch.value);
 
   function setSearchResult(payload: Array<AnzeigeKarteDTO>) {
     searchResult.value = payload;
@@ -16,11 +18,18 @@ export const useSearchStore = defineStore("searchStore", () => {
   function setLastSearchQuery(payload: string) {
     lastSearchQuery.value = payload;
   }
+  function resetAndTriggerSearch() {
+    setSearchResult([]);
+    setLastSearchQuery("");
+    triggerSearch.value = !triggerSearch.value;
+  }
 
   return {
     getSearchResult,
     getLastSearchQuery,
+    getTriggerSearch,
     setSearchResult,
     setLastSearchQuery,
+    resetAndTriggerSearch,
   };
 });