From: Adam Dullage <redacted>
Date: Wed, 1 May 2024 20:03:50 +0000 (+0100)
Subject: Implement null term validation in SearchInput
X-Git-Url: http://git.99rst.org/?a=commitdiff_plain;h=490896f2d5c7f38251d452732864ed8230714f6c;p=flatnotes.git

Implement null term validation in SearchInput
---

diff --git a/client/partials/SearchInput.vue b/client/partials/SearchInput.vue
index b810797..4fa4ddf 100644
--- a/client/partials/SearchInput.vue
+++ b/client/partials/SearchInput.vue
@@ -1,6 +1,10 @@
 <template>
   <form class="flex w-full max-w-[500px]" @submit.prevent="search">
-    <TextInput v-model="searchTerm" placeholder="Search" class="rounded-r-none" />
+    <TextInput
+      v-model="searchTerm"
+      placeholder="Search"
+      class="rounded-r-none"
+    />
     <CustomButton
       :iconPath="mdilMagnify"
       iconSize="1.75em"
@@ -11,20 +15,27 @@
 
 <script setup>
 import { mdilMagnify } from "@mdi/light-js";
-import { useRouter } from "vue-router";
+import { useToast } from "primevue/usetoast";
 import { ref } from "vue";
+import { useRouter } from "vue-router";
 import * as constants from "../constants";
 
 import CustomButton from "../components/CustomButton.vue";
 import TextInput from "../components/TextInput.vue";
+import { getToastOptions } from "../helpers.js";
 
 const router = useRouter();
 const searchTerm = ref("");
+const toast = useToast();
 
 function search() {
-  router.push({
-    name: "search",
-    query: { [constants.params.searchTerm]: searchTerm.value },
-  });
+  if (searchTerm.value) {
+    router.push({
+      name: "search",
+      query: { [constants.params.searchTerm]: searchTerm.value },
+    });
+  } else {
+    toast.add(getToastOptions("Error", "Please enter a search term", true));
+  }
 }
 </script>