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

app/(dashboard)/dashboard/page.tsx

@@ -6,17 +6,17 @@ import { Badge } from "@/components/ui/badge"
 import { Button } from "@/components/ui/button"
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
 import { Progress } from "@/components/ui/progress"
+import { listOrders, listPlayers, listServices, listShops } from "@/lib/api"
 import { statusLabels } from "@/lib/constants"
-import { mockOrders, mockPlayers, mockServices, mockShops } from "@/lib/mock"
 import { useAuthStore } from "@/store/auth"
 
 export default function DashboardPage() {
   const { currentRole } = useAuthStore()
   const isOwner = currentRole === "owner"
 
-  const player = mockPlayers[0]
+  const player = listPlayers()[0]
-  const shop = mockShops[0]
+  const shop = listShops()[0]
-  const recentOrders = mockOrders.slice(0, 3)
+  const recentOrders = listOrders().slice(0, 3)
 
   return (
     <div className="space-y-6">
@@ -76,7 +76,7 @@ export default function DashboardPage() {
           </CardHeader>
           <CardContent>
             <div className="text-2xl font-bold">
-              {isOwner ? "¥12,800" : mockServices.filter((s) => s.playerId === player.id).length}
+              {isOwner ? "¥12,800" : listServices().filter((s) => s.playerId === player.id).length}
             </div>
           </CardContent>
         </Card>

app/(dashboard)/dashboard/services/new/page.tsx

@@ -19,8 +19,8 @@ import {
   SelectValue,
 } from "@/components/ui/select"
 import { Textarea } from "@/components/ui/textarea"
+import { getGameById, listGames } from "@/lib/api"
 import { GameIcon } from "@/lib/game-icons"
-import { mockGames } from "@/lib/mock"
 import type { PlayerService } from "@/lib/types"
 import { useAuthStore } from "@/store/auth"
 import { useServiceStore } from "@/store/services"
@@ -76,9 +76,10 @@ export default function NewServicePage() {
 
   const selectedGameId = watch("gameId")
   const selectedUnit = watch("unit")
+  const games = listGames()
 
   const onSubmit = async (data: z.infer<typeof serviceSchema>) => {
-    const game = mockGames.find((item) => item.id === data.gameId)
+    const game = getGameById(data.gameId)
     if (!game) return
 
     const payload: Omit<PlayerService, "id"> = {
@@ -128,7 +129,7 @@ export default function NewServicePage() {
                   <SelectValue placeholder="选择游戏" />
                 </SelectTrigger>
                 <SelectContent>
-                  {mockGames.map((game) => (
+                  {games.map((game) => (
                     <SelectItem key={game.id} value={game.id}>
                       <div className="flex items-center gap-2">
                         <GameIcon name={game.icon} className="h-4 w-4" />

app/(dashboard)/dashboard/shop/income/page.tsx

@@ -11,7 +11,7 @@ import {
   TableHeader,
   TableRow,
 } from "@/components/ui/table"
-import { mockTransactions } from "@/lib/mock"
+import { listTransactions } from "@/lib/api"
 import { useAuthStore } from "@/store/auth"
 import { useOrderStore } from "@/store/orders"
 import { useShopStore } from "@/store/shops"
@@ -35,7 +35,7 @@ export default function ShopIncomePage() {
     .reduce((acc, order) => acc + order.totalPrice, 0)
 
   const shopOrderIds = new Set(shopOrders.map((order) => order.id))
-  const relatedTransactions = mockTransactions.filter((transaction) => {
+  const relatedTransactions = listTransactions().filter((transaction) => {
     if (transaction.type === "withdrawal") return true
     if (transaction.type !== "income") return false
     const match = transaction.description.match(/ord\d+/)

app/(main)/community/page.tsx

@@ -7,14 +7,19 @@ import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"
 import { Badge } from "@/components/ui/badge"
 import { Button } from "@/components/ui/button"
 import { Card, CardContent, CardFooter, CardHeader } from "@/components/ui/card"
+import { listGames, listOrders, listPlayers, listPosts } from "@/lib/api"
 import { roleLabels } from "@/lib/constants"
-import { mockGames, mockOrders, mockPlayers, mockPosts } from "@/lib/mock"
 
 export default function CommunityPage() {
+  const games = listGames()
+  const posts = listPosts()
+  const orders = listOrders()
+  const players = listPlayers()
+
   const [sortMode, setSortMode] = useState<"latest" | "hot">("latest")
   const [selectedGame, setSelectedGame] = useState<string | null>(null)
 
-  const filteredPosts = mockPosts
+  const filteredPosts = posts
     .filter((post) => {
       if (!selectedGame) return true
       return post.tags.includes(selectedGame)
@@ -60,7 +65,7 @@ export default function CommunityPage() {
           </Button>
         </div>
         <div className="flex flex-wrap gap-2">
-          {mockGames.map((game) => (
+          {games.map((game) => (
             <Badge
               key={game.id}
               variant={selectedGame === game.name ? "default" : "outline"}
@@ -77,10 +82,10 @@ export default function CommunityPage() {
         {filteredPosts.map((post) =>
           (() => {
             const linkedOrder = post.linkedOrderId
-              ? mockOrders.find((order) => order.id === post.linkedOrderId)
+              ? orders.find((order) => order.id === post.linkedOrderId)
               : null
             const linkedPlayer = linkedOrder
-              ? mockPlayers.find((player) => player.id === linkedOrder.playerId)
+              ? players.find((player) => player.id === linkedOrder.playerId)
               : null
 
             return (

app/(main)/page.tsx

@@ -4,10 +4,14 @@ import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"
 import { Badge } from "@/components/ui/badge"
 import { Button } from "@/components/ui/button"
 import { Card, CardContent, CardFooter, CardHeader, CardTitle } from "@/components/ui/card"
+import { listGames, listPlayers, listShops } from "@/lib/api"
 import { GameIcon } from "@/lib/game-icons"
-import { mockGames, mockPlayers, mockShops } from "@/lib/mock"
 
 export default function HomePage() {
+  const games = listGames()
+  const players = listPlayers()
+  const shops = listShops()
+
   return (
     <div className="container mx-auto py-8 px-4 space-y-12">
       <section className="relative overflow-hidden rounded-3xl bg-linear-to-b from-primary/10 via-primary/5 to-transparent px-6 py-16 md:py-24 text-center">
@@ -44,7 +48,7 @@ export default function HomePage() {
           </Button>
         </div>
         <div className="grid grid-cols-4 md:grid-cols-8 gap-3">
-          {mockGames.map((game) => (
+          {games.map((game) => (
             <Link
               key={game.id}
               href={`/search?game=${encodeURIComponent(game.name)}`}
@@ -67,7 +71,7 @@ export default function HomePage() {
           </Button>
         </div>
         <div className="grid gap-4 md:grid-cols-2 lg:grid-cols-3">
-          {mockPlayers.map((player) => (
+          {players.map((player) => (
             <Card key={player.id} className="hover:shadow-md transition-shadow">
               <CardHeader className="flex flex-row items-center gap-3 space-y-0 pb-3">
                 <Avatar className="h-12 w-12">
@@ -127,7 +131,7 @@ export default function HomePage() {
           </Button>
         </div>
         <div className="grid gap-4 md:grid-cols-2">
-          {mockShops.map((shop) => (
+          {shops.map((shop) => (
             <Card key={shop.id} className="hover:shadow-md transition-shadow">
               <CardHeader>
                 <CardTitle className="text-lg">{shop.name}</CardTitle>

app/(main)/player/[id]/page.tsx

@@ -15,24 +15,27 @@ import {
 } from "@/components/ui/card"
 import { Separator } from "@/components/ui/separator"
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"
-import { mockFavorites, mockPlayers, mockReviews, mockServices } from "@/lib/mock"
+import {
+  isFavorited as checkFavorited,
+  listPlayers,
+  listReviewsByTargetUser,
+  listServicesByPlayer,
+} from "@/lib/api"
 
 export default async function PlayerDetailPage({ params }: { params: Promise<{ id: string }> }) {
   const { id } = await params
-  const player = mockPlayers.find((p) => p.id === id)
+  const player = listPlayers().find((p) => p.id === id)
 
   if (!player) {
     notFound()
   }
 
-  const playerReviews = mockReviews.filter((r) => r.toUserId === player.id)
+  const playerReviews = listReviewsByTargetUser(player.id)
   const playerServices =
     player.services && player.services.length > 0
       ? player.services
-      : mockServices.filter((s) => s.playerId === player.id)
+      : listServicesByPlayer(player.id)
-  const isFavorited = mockFavorites.some(
+  const isFavorited = checkFavorited("u1", "player", player.id)
-    (f) => f.userId === "u1" && f.targetType === "player" && f.targetId === player.id,
-  )
 
   return (
     <div className="container mx-auto py-8 px-4 max-w-5xl">

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 { Game, Player, Shop } from "@/lib/types"
-import type { 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) => {
+    return shops.map((shop) => {
-      const shopPlayers = mockPlayers.filter((player) => player.shopId === shop.id)
+      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
+        shopServices.length > 0
-          ? services.reduce((prev, curr) => (prev.price < curr.price ? prev : curr)).unit
+          ? 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}

app/(main)/shop/[id]/page.tsx

@@ -8,7 +8,13 @@ import { Badge } from "@/components/ui/badge"
 import { Button } from "@/components/ui/button"
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
 import { Separator } from "@/components/ui/separator"
-import { mockFavorites, mockPlayers, mockReviews, mockServices, mockShops } from "@/lib/mock"
+import {
+  isFavorited as checkFavorited,
+  getShopById,
+  listPlayersByShop,
+  listReviews,
+  listServices,
+} from "@/lib/api"
 
 interface PageProps {
   params: Promise<{ id: string }>
@@ -16,19 +22,17 @@ interface PageProps {
 
 export default async function ShopPage({ params }: PageProps) {
   const { id } = await params
-  const shop = mockShops.find((s) => s.id === id)
+  const shop = getShopById(id)
 
   if (!shop) {
     notFound()
   }
 
-  const shopPlayers = mockPlayers.filter((p) => p.shopId === shop.id)
+  const shopPlayers = listPlayersByShop(shop.id)
   const playerIds = shopPlayers.map((p) => p.id)
-  const shopServices = mockServices.filter((s) => playerIds.includes(s.playerId))
+  const shopServices = listServices().filter((s) => playerIds.includes(s.playerId))
-  const shopReviews = mockReviews.filter((r) => playerIds.includes(r.toUserId))
+  const shopReviews = listReviews().filter((r) => playerIds.includes(r.toUserId))
-  const isFavorited = mockFavorites.some(
+  const isFavorited = checkFavorited("u1", "shop", shop.id)
-    (f) => f.userId === "u1" && f.targetType === "shop" && f.targetId === shop.id,
-  )
 
   const sortedSections = [...shop.templateConfig.sections]
     .filter((s) => s.enabled)

app/(main)/user/[id]/page.tsx

@@ -5,25 +5,31 @@ import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"
 import { Badge } from "@/components/ui/badge"
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"
-import { mockFavorites, mockPlayers, mockPosts, mockShops, mockUsers } from "@/lib/mock"
+import {
+  getUserById,
+  listFavoritesByUser,
+  listPlayers,
+  listPostsByAuthor,
+  listShops,
+} from "@/lib/api"
 
 export default async function UserProfilePage({ params }: { params: Promise<{ id: string }> }) {
   const { id } = await params
-  const user = mockUsers.find((u) => u.id === id)
+  const user = getUserById(id)
 
   if (!user) {
     notFound()
   }
 
-  const userPosts = mockPosts.filter((p) => p.author.id === user.id)
+  const userPosts = listPostsByAuthor(user.id)
-  const userFavorites = mockFavorites.filter((f) => f.userId === user.id)
+  const userFavorites = listFavoritesByUser(user.id)
   const favoritePlayers = userFavorites
     .filter((f) => f.targetType === "player")
-    .map((f) => mockPlayers.find((p) => p.id === f.targetId))
+    .map((f) => listPlayers().find((p) => p.id === f.targetId))
     .filter((p): p is NonNullable<typeof p> => p != null)
   const favoriteShops = userFavorites
     .filter((f) => f.targetType === "shop")
-    .map((f) => mockShops.find((s) => s.id === f.targetId))
+    .map((f) => listShops().find((s) => s.id === f.targetId))
     .filter((s): s is NonNullable<typeof s> => s != null)
 
   return (

app/(order)/order/new/page.tsx

@@ -11,7 +11,7 @@ import { Input } from "@/components/ui/input"
 import { Label } from "@/components/ui/label"
 import { Separator } from "@/components/ui/separator"
 import { Textarea } from "@/components/ui/textarea"
-import { mockPlayers, mockServices } from "@/lib/mock"
+import { getPlayerById, getServiceById } from "@/lib/api"
 import { notifySuccess } from "@/lib/toast"
 import { useRequireAuth } from "@/lib/use-require-auth"
 import { useAuthStore } from "@/store/auth"
@@ -29,8 +29,8 @@ export default function NewOrderPage() {
   const deductBalance = useWalletStore((state) => state.deductBalance)
   const serviceId = searchParams.get("serviceId")
 
-  const service = mockServices.find((s) => s.id === serviceId)
+  const service = serviceId ? getServiceById(serviceId) : undefined
-  const player = service ? mockPlayers.find((p) => p.id === service.playerId) : null
+  const player = service ? getPlayerById(service.playerId) : undefined
 
   const [quantity, setQuantity] = useState(1)
   const [note, setNote] = useState("")

lib/api/disputes.ts

@@ -1,9 +1,9 @@
-import { mockDisputes } from "@/lib/mock"
+import { useDisputeStore } from "@/store/disputes"
 
 export function listDisputes() {
-  return mockDisputes
+  return useDisputeStore.getState().disputes
 }
 
 export function getDisputeByOrderId(orderId: string) {
-  return mockDisputes.find((dispute) => dispute.orderId === orderId)
+  return useDisputeStore.getState().disputes.find((dispute) => dispute.orderId === orderId)
 }

lib/api/reviews.ts

@@ -1,13 +1,13 @@
-import { mockReviews } from "@/lib/mock"
+import { useReviewStore } from "@/store/reviews"
 
 export function listReviews() {
-  return mockReviews
+  return useReviewStore.getState().reviews
 }
 
 export function listReviewsByOrder(orderId: string) {
-  return mockReviews.filter((review) => review.orderId === orderId)
+  return useReviewStore.getState().reviews.filter((review) => review.orderId === orderId)
 }
 
 export function listReviewsByTargetUser(userId: string) {
-  return mockReviews.filter((review) => review.toUserId === userId)
+  return useReviewStore.getState().reviews.filter((review) => review.toUserId === userId)
 }

lib/api/transactions.ts

@@ -1,5 +1,5 @@
-import { mockTransactions } from "@/lib/mock"
+import { useWalletStore } from "@/store/wallet"
 
 export function listTransactions() {
-  return mockTransactions
+  return useWalletStore.getState().transactions
 }