Fixed: the empty message changing on changing the queryString (#528)

hotwax · Jan 9, 2025 · f980c1c · f980c1c
1 parent 0f9f4b8
commit f980c1c
Showing 1 changed file with 3 additions and 1 deletion.
diff --git a/src/components/MatchProductModal.vue b/src/components/MatchProductModal.vue
@@ -42,7 +42,7 @@
     </template>
 
     <div v-else-if="queryString && isSearching && !products.length" class="empty-state">
-      <p>{{ translate("No results found for", { queryString }) }}</p>
+      <p>{{ translate("No results found for", { queryString: prevSearchedQuery }) }}</p>
     </div>
     <div v-else class="empty-state">
       <img src="../assets/images/empty-state-add-product-modal.png" alt="empty-state" />
@@ -95,6 +95,7 @@ let queryString = ref('');
 const isSearching = ref(false);
 const selectedProductId = ref("") as Ref<string>;
 const isLoading = ref(false);
+const prevSearchedQuery = ref("");
 
 async function handleSearch() {
   if(!queryString.value.trim()) {
@@ -120,6 +121,7 @@ async function getProducts() {
     logger.error("Failed to fetch products", err)
   }
   products.value = productsList
+  prevSearchedQuery.value = queryString.value
   isLoading.value = false;
 }
 function closeModal(payload = {}) {