Remove categories and sorting options from the video search filters

Removes category/sort selection from UI and `/api/videos`, updates `getVideos`/`getVideoCount` in `storage.ts`, and removes `/api/categories` route.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: aa92e7e2-ec62-4c92-b21b-02ef78a664c2
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/aa92e7e2-ec62-4c92-b21b-02ef78a664c2/Cz5fe6k

client/src/components/search-header.tsx

@@ -6,19 +6,13 @@ import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@
 
 interface SearchHeaderProps {
   onSearch: (query: string) => void;
-  onCategoryChange: (category: string) => void;
-  onSortChange: (sort: string) => void;
   onViewChange: (view: "grid" | "list") => void;
-  categories: string[];
   currentView: "grid" | "list";
 }
 
 export default function SearchHeader({
   onSearch,
-  onCategoryChange,
-  onSortChange,
   onViewChange,
-  categories,
   currentView
 }: SearchHeaderProps) {
   const [searchQuery, setSearchQuery] = useState("");
@@ -79,61 +73,33 @@ export default function SearchHeader({
             <p className="text-bunny-muted">Streaming from Bunny.net CDN</p>
           </div>
           
-          <div className="flex flex-wrap gap-3">
-            <Select onValueChange={onCategoryChange} data-testid="select-category">
-              <SelectTrigger className="bg-bunny-gray border border-gray-600 rounded-lg px-4 py-2 text-sm focus:outline-none focus:border-bunny-blue w-40">
-                <SelectValue placeholder="All Categories" />
-              </SelectTrigger>
-              <SelectContent>
-                <SelectItem value="All Categories">All Categories</SelectItem>
-                {categories.map((category) => (
-                  <SelectItem key={category} value={category}>
-                    {category}
-                  </SelectItem>
-                ))}
-              </SelectContent>
-            </Select>
-            
-            <Select onValueChange={onSortChange} data-testid="select-sort">
-              <SelectTrigger className="bg-bunny-gray border border-gray-600 rounded-lg px-4 py-2 text-sm focus:outline-none focus:border-bunny-blue w-32">
-                <SelectValue placeholder="Latest" />
-              </SelectTrigger>
-              <SelectContent>
-                <SelectItem value="latest">Latest</SelectItem>
-                <SelectItem value="views">Most Viewed</SelectItem>
-                <SelectItem value="duration">Duration</SelectItem>
-                <SelectItem value="title">A-Z</SelectItem>
-              </SelectContent>
-            </Select>
-            
-            <div className="flex bg-bunny-gray rounded-lg p-1">
-              <Button
-                variant={currentView === "grid" ? "default" : "ghost"}
-                size="sm"
-                onClick={() => onViewChange("grid")}
-                className={`px-3 py-1 rounded text-sm ${
-                  currentView === "grid" 
-                    ? "bg-bunny-blue text-white" 
-                    : "text-bunny-muted hover:text-white"
-                }`}
-                data-testid="button-grid-view"
-              >
-                <Grid3X3 className="w-4 h-4" />
-              </Button>
-              <Button
-                variant={currentView === "list" ? "default" : "ghost"}
-                size="sm"
-                onClick={() => onViewChange("list")}
-                className={`px-3 py-1 rounded text-sm ${
-                  currentView === "list" 
-                    ? "bg-bunny-blue text-white" 
-                    : "text-bunny-muted hover:text-white"
-                }`}
-                data-testid="button-list-view"
-              >
-                <List className="w-4 h-4" />
-              </Button>
-            </div>
+          <div className="flex bg-bunny-gray rounded-lg p-1">
+            <Button
+              variant={currentView === "grid" ? "default" : "ghost"}
+              size="sm"
+              onClick={() => onViewChange("grid")}
+              className={`px-3 py-1 rounded text-sm ${
+                currentView === "grid" 
+                  ? "bg-bunny-blue text-white" 
+                  : "text-bunny-muted hover:text-white"
+              }`}
+              data-testid="button-grid-view"
+            >
+              <Grid3X3 className="w-4 h-4" />
+            </Button>
+            <Button
+              variant={currentView === "list" ? "default" : "ghost"}
+              size="sm"
+              onClick={() => onViewChange("list")}
+              className={`px-3 py-1 rounded text-sm ${
+                currentView === "list" 
+                  ? "bg-bunny-blue text-white" 
+                  : "text-bunny-muted hover:text-white"
+              }`}
+              data-testid="button-list-view"
+            >
+              <List className="w-4 h-4" />
+            </Button>
           </div>
         </div>
       </div>

client/src/pages/home.tsx

@@ -12,25 +12,16 @@ interface VideosResponse {
 
 export default function Home() {
   const [searchQuery, setSearchQuery] = useState("");
-  const [selectedCategory, setSelectedCategory] = useState("All Categories");
-  const [sortBy, setSortBy] = useState("latest");
   const [viewMode, setViewMode] = useState<"grid" | "list">("grid");
   const [offset, setOffset] = useState(0);
   const [allVideos, setAllVideos] = useState<Video[]>([]);
 
-  // Fetch categories
-  const { data: categories = [] } = useQuery<string[]>({
-    queryKey: ["/api/categories"],
-  });
-
   // Fetch videos
   const { data: videosResponse, isLoading, refetch } = useQuery<VideosResponse>({
     queryKey: ["/api/videos", { 
       limit: 20, 
       offset, 
-      search: searchQuery || undefined,
-      category: selectedCategory !== "All Categories" ? selectedCategory : undefined,
-      sort: sortBy
+      search: searchQuery || undefined
     }],
     queryFn: async ({ queryKey }) => {
       const [, params] = queryKey as [string, any];
@@ -61,42 +52,27 @@ export default function Home() {
     }
   }, [videosResponse, offset]);
 
-  // Reset videos when search/filter changes
+  // Reset videos when search changes
   const handleSearch = (query: string) => {
     setSearchQuery(query);
     setOffset(0);
     setAllVideos([]);
   };
 
-  const handleCategoryChange = (category: string) => {
-    setSelectedCategory(category);
-    setOffset(0);
-    setAllVideos([]);
-  };
-
-  const handleSortChange = (sort: string) => {
-    setSortBy(sort);
-    setOffset(0);
-    setAllVideos([]);
-  };
-
   const handleLoadMore = () => {
     setOffset(prev => prev + 20);
   };
 
-  // Force refetch when filters change
+  // Force refetch when search changes
   useEffect(() => {
     refetch();
-  }, [searchQuery, selectedCategory, sortBy, offset, refetch]);
+  }, [searchQuery, offset, refetch]);
 
   return (
     <div className="min-h-screen bg-bunny-dark">
       <SearchHeader
         onSearch={handleSearch}
-        onCategoryChange={handleCategoryChange}
-        onSortChange={handleSortChange}
         onViewChange={setViewMode}
-        categories={categories}
         currentView={viewMode}
       />