fix: user cannot select 'Customer Service & Operations' category

web/hooks/use-tab-searchparams.ts

@@ -29,9 +29,10 @@ export const useTabSearchParams = ({
   const router = useRouter()
   const pathName = pathnameFromHook || window?.location?.pathname
   const searchParams = useSearchParams()
+  const searchParamValue = searchParams.has(searchParamName) ? decodeURIComponent(searchParams.get(searchParamName)!) : defaultTab
   const [activeTab, setTab] = useState<string>(
     !disableSearchParams
-      ? (searchParams.get(searchParamName) || defaultTab)
+      ? searchParamValue
       : defaultTab,
   )
 
@@ -39,7 +40,7 @@ export const useTabSearchParams = ({
     setTab(newActiveTab)
     if (disableSearchParams)
       return
-    router[`${routingBehavior}`](`${pathName}?${searchParamName}=${newActiveTab}`)
+    router[`${routingBehavior}`](`${pathName}?${searchParamName}=${encodeURIComponent(newActiveTab)}`)
   }
 
   return [activeTab, setActiveTab] as const