src/components/ui/VnSearchBar.vue

@@ -40,6 +40,11 @@ const search = async () => {
             query: searchTerm.value ? { search: searchTerm.value } : {}
         });
 
+        if (!searchTerm.value) {
+            emit('onSearchError');
+            return;
+        }
+
         if (props.sqlQuery) {
             data = await jApi.query(props.sqlQuery, {
                 [props.searchField]: searchTerm.value

src/pages/Ecomerce/CatalogView.vue

@@ -1,7 +1,14 @@
 <template>
     <Teleport v-if="isHeaderMounted" to="#actions">
         <div class="row">
-            <VnSearchBar :search-term="search" @on-search-error="items = []" />
+            <VnSearchBar
+                @on-search-error="
+                    () => {
+                        items = [];
+                        search = '';
+                    }
+                "
+            />
             <QBtn
                 :icon="viewTypeButtonContent.icon"
                 :label="viewTypeButtonContent.label"