fix(web): format discover browse files

web/src/components/BrandCard.tsx

@@ -37,7 +37,7 @@ export default function BrandCard({
       aria-label={card.display_name}
       className={cn(
         "group relative flex h-20 w-[140px] flex-none items-center justify-center overflow-hidden rounded-lg shadow-sm",
-        "ring-1 ring-white/5 transition-colors hover:ring-white/30 focus:outline-none focus:ring-2 focus:ring-white",
+        "ring-1 ring-white/5 transition-colors hover:ring-white/30 focus:ring-2 focus:ring-white focus:outline-none",
       )}
       style={{ background }}
     >

web/src/hooks/queries/keys.ts

@@ -130,17 +130,7 @@ export const requestKeys = {
     mediaType: string | undefined,
     sort: string,
     page: number,
-  ) =>
-    [
-      "requests",
-      "discover",
-      "browse",
-      kind,
-      slug,
-      mediaType ?? "",
-      sort,
-      page,
-    ] as const,
+  ) => ["requests", "discover", "browse", kind, slug, mediaType ?? "", sort, page] as const,
   search: (mediaType: string, query: string, page: number) =>
     ["requests", "search", mediaType, query, page] as const,
   detail: (mediaType: string, tmdbID: number) => ["requests", "detail", mediaType, tmdbID] as const,

web/src/hooks/queries/requests.ts

@@ -78,9 +78,7 @@ export function useDiscoverStudios() {
   return useQuery({
     queryKey: requestKeys.discoverStudios(),
     queryFn: () =>
-      api<DiscoverStudiosResponse>("/requests/discover/studios").then(
-        (data) => data.studios ?? [],
-      ),
+      api<DiscoverStudiosResponse>("/requests/discover/studios").then((data) => data.studios ?? []),
     staleTime: DISCOVER_BRAND_STALE_TIME,
   });
 }
@@ -100,9 +98,7 @@ export function useDiscoverGenres() {
   return useQuery({
     queryKey: requestKeys.discoverGenres(),
     queryFn: () =>
-      api<DiscoverGenresResponse>("/requests/discover/genres").then(
-        (data) => data.genres ?? [],
-      ),
+      api<DiscoverGenresResponse>("/requests/discover/genres").then((data) => data.genres ?? []),
     staleTime: DISCOVER_BRAND_STALE_TIME,
   });
 }

web/src/pages/RequestBrowse.tsx

@@ -42,7 +42,7 @@ export default function RequestBrowse({ kind }: RequestBrowseProps) {
   const page = Math.max(1, Number(searchParams.get("page") ?? "1") || 1);
   const mediaTypeFromQuery = normalizeMediaType(searchParams.get("media_type"));
   const mediaType: RequestMediaType | undefined =
-    kind === "studio" ? "movie" : kind === "network" ? "series" : mediaTypeFromQuery ?? "movie";
+    kind === "studio" ? "movie" : kind === "network" ? "series" : (mediaTypeFromQuery ?? "movie");
 
   const browse = useRequestBrowse({ kind, slug, mediaType, sort, page });
   const createRequest = useCreateMediaRequest();
@@ -84,7 +84,10 @@ export default function RequestBrowse({ kind }: RequestBrowseProps) {
         <p className="text-foreground text-lg font-semibold">
           {kind === "studio" ? "Studio" : kind === "network" ? "Network" : "Genre"} not found.
         </p>
-        <Link to="/requests" className="text-muted-foreground hover:text-foreground text-sm underline">
+        <Link
+          to="/requests"
+          className="text-muted-foreground hover:text-foreground text-sm underline"
+        >
           Back to Requests
         </Link>
       </div>
@@ -175,7 +178,11 @@ export default function RequestBrowse({ kind }: RequestBrowseProps) {
           <span className="text-muted-foreground text-sm tabular-nums">
             Page {page} of {totalPages}
           </span>
-          <Button variant="outline" disabled={page >= totalPages} onClick={() => goToPage(page + 1)}>
+          <Button
+            variant="outline"
+            disabled={page >= totalPages}
+            onClick={() => goToPage(page + 1)}
+          >
             Next
           </Button>
         </div>
@@ -234,7 +241,9 @@ function BrowseGridSkeleton() {
 }
 
 function normalizeSort(value: string | null): BrowseSort {
-  return SORT_OPTIONS.some((option) => option.value === value) ? (value as BrowseSort) : "popularity";
+  return SORT_OPTIONS.some((option) => option.value === value)
+    ? (value as BrowseSort)
+    : "popularity";
 }
 
 function normalizeMediaType(value: string | null): RequestMediaType | undefined {