fix before and after filters

web/src/components/input/InputWithTags.tsx

@@ -188,7 +188,11 @@ export default function InputWithTags({
 
   const createFilter = useCallback(
     (type: FilterType, value: string) => {
-      if (allSuggestions[type as FilterType]?.includes(value)) {
+      if (
+        allSuggestions[type as FilterType]?.includes(value) ||
+        type == "before" ||
+        type == "after"
+      ) {
         const newFilters = { ...filters };
         let timestamp = 0;
 
@@ -318,6 +322,7 @@ export default function InputWithTags({
         ((filterType === "before" || filterType === "after") &&
           trimmedValue.match(/^\d{8}$/))
       ) {
+        console.log(filterType, trimmedValue);
         createFilter(filterType, trimmedValue);
         setInputValue((prev) => {
           const regex = new RegExp(
@@ -355,11 +360,7 @@ export default function InputWithTags({
         ];
 
         // Check if filter type is valid
-        if (
+        if (filterType in allSuggestions) {
-          filterType in allSuggestions ||
-          filterType === "before" ||
-          filterType === "after"
-        ) {
           setCurrentFilterType(filterType);
 
           if (filterType === "before" || filterType === "after") {

web/src/hooks/use-suggestions.ts

@@ -48,8 +48,6 @@ export default function useSuggestions(
         setSuggestions([
           ...(searchHistory?.map((search) => search.name) ?? []),
           ...availableFilters,
-          "before",
-          "after",
         ]);
       }
     },

web/src/utils/dateUtil.ts

@@ -374,6 +374,19 @@ export function getIntlDateFormat() {
     .join("");
 }
 
+export function formatDateToLocaleString(daysOffset: number = 0): string {
+  const date = new Date();
+  date.setDate(date.getDate() + daysOffset);
+
+  return new Intl.DateTimeFormat(window.navigator.language, {
+    day: "2-digit",
+    month: "2-digit",
+    year: "numeric",
+  })
+    .format(date)
+    .replace(/[^\d]/g, "");
+}
+
 export function isValidTimeRange(rangeString: string): boolean {
   const range = rangeString.split(",");
 

web/src/views/search/SearchView.tsx

@@ -30,6 +30,7 @@ import scrollIntoView from "scroll-into-view-if-needed";
 import InputWithTags from "@/components/input/InputWithTags";
 import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";
 import { isEqual } from "lodash";
+import { formatDateToLocaleString } from "@/utils/dateUtil";
 
 type SearchViewProps = {
   search: string;
@@ -121,6 +122,8 @@ export default function SearchView({
       sub_labels: allSubLabels,
       search_type: ["thumbnail", "description"] as SearchSource[],
       time_range: ["00:00,24:00"],
+      before: [formatDateToLocaleString()],
+      after: [formatDateToLocaleString(-5)],
     }),
     [config, allLabels, allZones, allSubLabels],
   );