From 5e1f2fa6e6bbc511a156559570f2baf1bca761f6 Mon Sep 17 00:00:00 2001
From: Josh Hawkins <32435876+hawkeye217@users.noreply.github.com>
Date: Wed, 18 Sep 2024 12:42:49 -0500
Subject: [PATCH] filter capitalization

---
 web/src/components/input/InputWithTags.tsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/web/src/components/input/InputWithTags.tsx b/web/src/components/input/InputWithTags.tsx
index 6156d49da..3bb73f239 100644
--- a/web/src/components/input/InputWithTags.tsx
+++ b/web/src/components/input/InputWithTags.tsx
@@ -549,15 +549,15 @@ export default function InputWithTags({
                     filterValues.map((value, index) => (
                       <span
                         key={`${filterType}-${index}`}
-                        className="inline-flex items-center whitespace-nowrap rounded-full bg-green-100 px-2 py-0.5 text-sm text-green-800"
+                        className="inline-flex items-center whitespace-nowrap rounded-full bg-green-100 px-2 py-0.5 text-sm capitalize text-green-800"
                       >
-                        {filterType}:{value}
+                        {filterType}: {value.replaceAll("_", " ")}
                         <button
                           onClick={() =>
                             removeFilter(filterType as FilterType, value)
                           }
                           className="ml-1 focus:outline-none"
-                          aria-label={`Remove ${filterType}:${value} filter`}
+                          aria-label={`Remove ${filterType}:${value.replaceAll("_", " ")} filter`}
                         >
                           <LuX className="h-3 w-3" />
                         </button>
@@ -566,7 +566,7 @@ export default function InputWithTags({
                   ) : (
                     <span
                       key={filterType}
-                      className="inline-flex items-center whitespace-nowrap rounded-full bg-green-100 px-2 py-0.5 text-sm text-green-800"
+                      className="inline-flex items-center whitespace-nowrap rounded-full bg-green-100 px-2 py-0.5 text-sm capitalize text-green-800"
                     >
                       {filterType}:
                       {filterType === "before" || filterType === "after"