add ability to use * and ? in recognized plate input

web/src/components/overlay/dialog/SearchFilterDialog.tsx

@@ -919,10 +919,21 @@ export function RecognizedLicensePlatesFilterContent({
     return null;
   }
 
-  const filteredRecognizedLicensePlates =
+  const filterItems = (value: string, search: string) => {
-    allRecognizedLicensePlates?.filter((id) =>
+    if (!search) return 1; // Show all items if no search input
-      id.toLowerCase().includes(inputValue.toLowerCase()),
+
-    ) || [];
+    if (search.includes("*") || search.includes("?")) {
+      const escapedSearch = search
+        .replace(/[.+^${}()|[\]\\]/g, "\\$&")
+        .replace(/\*/g, ".*") // * matches any characters
+        .replace(/\?/g, "."); // ? matches any single character
+      const regex = new RegExp(`^${escapedSearch}$`, "i");
+      return regex.test(value) ? 1 : -1; // 1 for match, -1 for no match
+    }
+
+    // fallback to substring matching if no wildcards
+    return value.toLowerCase().includes(search.toLowerCase()) ? 1 : -1;
+  };
 
   return (
     <div className="overflow-x-hidden">
@@ -938,19 +949,22 @@ export function RecognizedLicensePlatesFilterContent({
         </p>
       ) : (
         <>
-          <Command className="border border-input bg-background">
+          <Command
+            className="border border-input bg-background"
+            filter={filterItems}
+          >
             <CommandInput
               placeholder={t("recognizedLicensePlates.placeholder")}
               value={inputValue}
               onValueChange={setInputValue}
             />
             <CommandList className="max-h-[200px] overflow-auto">
-              {filteredRecognizedLicensePlates.length === 0 && inputValue && (
+              {allRecognizedLicensePlates.length > 0 && inputValue && (
                 <CommandEmpty>
                   {t("recognizedLicensePlates.noLicensePlatesFound")}
                 </CommandEmpty>
               )}
-              {filteredRecognizedLicensePlates.map((plate) => (
+              {allRecognizedLicensePlates.map((plate) => (
                 <CommandItem
                   key={plate}
                   value={plate}