refactor(pages): migrate app data reads to api adapters

app/(main)/search/page.tsx

@@ -41,9 +41,9 @@ import {
   SheetTrigger,
 } from "@/components/ui/sheet"
 import { Switch } from "@/components/ui/switch"
+import { listGames, listPlayers, listServices, listShops } from "@/lib/api"
 import { GameIcon } from "@/lib/game-icons"
-import { mockGames, mockPlayers, mockServices, mockShops } from "@/lib/mock"
-import type { Player, Shop } from "@/lib/types"
+import type { Game, Player, Shop } from "@/lib/types"
 import { cn } from "@/lib/utils"
 
 function StatusBadge({ status }: { status: Player["status"] }) {
@@ -255,6 +255,7 @@ type SearchResult =
     }
 
 interface FilterProps {
+  games: Game[]
   selectedGames: string[]
   onGameChange: (game: string, checked: boolean) => void
   priceRange: { min: string; max: string }
@@ -267,6 +268,7 @@ interface FilterProps {
 }
 
 function FilterSection({
+  games,
   selectedGames,
   onGameChange,
   priceRange,
@@ -285,7 +287,7 @@ function FilterSection({
           游戏类型
         </h3>
         <div className="space-y-2">
-          {mockGames.map((game) => (
+          {games.map((game) => (
             <div key={game.id} className="flex items-center space-x-2">
               <Checkbox
                 id={`game-${game.id}`}
@@ -365,6 +367,10 @@ function FilterSection({
 function SearchPageContent() {
   const searchParams = useSearchParams()
   const router = useRouter()
+  const games = listGames()
+  const players = listPlayers()
+  const services = listServices()
+  const shops = listShops()
 
   const [searchQuery, setSearchQuery] = useState(searchParams.get("q") || "")
   const [selectedGames, setSelectedGames] = useState<string[]>(() => {
@@ -406,30 +412,30 @@ function SearchPageContent() {
   }
 
   const shopResultItems = useMemo<ShopResultItem[]>(() => {
-    return mockShops.map((shop) => {
-      const shopPlayers = mockPlayers.filter((player) => player.shopId === shop.id)
+    return shops.map((shop) => {
+      const shopPlayers = players.filter((player) => player.shopId === shop.id)
       const playerIds = new Set(shopPlayers.map((player) => player.id))
-      const services = mockServices.filter((service) => playerIds.has(service.playerId))
+      const shopServices = services.filter((service) => playerIds.has(service.playerId))
       const minPrice =
-        services.length > 0 ? Math.min(...services.map((service) => service.price)) : 0
+        shopServices.length > 0 ? Math.min(...shopServices.map((service) => service.price)) : 0
       const unit =
-        services.length > 0
-          ? services.reduce((prev, curr) => (prev.price < curr.price ? prev : curr)).unit
+        shopServices.length > 0
+          ? shopServices.reduce((prev, curr) => (prev.price < curr.price ? prev : curr)).unit
           : "局"
-      const games = [...new Set(services.map((service) => service.gameName))]
+      const shopGames = [...new Set(shopServices.map((service) => service.gameName))]
       const hasAvailable = shopPlayers.some((player) => player.status === "available")
       return {
         shop,
         minPrice,
         unit,
-        games,
+        games: shopGames,
         hasAvailable,
       }
     })
-  }, [])
+  }, [players, services, shops])
 
   const filteredPlayers = useMemo(() => {
-    return mockPlayers.filter((player) => {
+    return players.filter((player) => {
       if (searchQuery) {
         const query = searchQuery.toLowerCase()
         const matchName = player.user.nickname.toLowerCase().includes(query)
@@ -456,7 +462,7 @@ function SearchPageContent() {
 
       return true
     })
-  }, [searchQuery, selectedGames, priceRange, onlyOnline, minRating])
+  }, [minRating, onlyOnline, players, priceRange, searchQuery, selectedGames])
 
   const filteredShops = useMemo(() => {
     return shopResultItems.filter((item) => {
@@ -559,6 +565,7 @@ function SearchPageContent() {
               </SheetHeader>
               <div className="py-6">
                 <FilterSection
+                  games={games}
                   selectedGames={selectedGames}
                   onGameChange={handleGameChange}
                   priceRange={priceRange}
@@ -608,6 +615,7 @@ function SearchPageContent() {
             </CardHeader>
             <CardContent>
               <FilterSection
+                games={games}
                 selectedGames={selectedGames}
                 onGameChange={handleGameChange}
                 priceRange={priceRange}