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

This commit is contained in:
zetaloop
2026-02-22 08:30:21 +08:00
parent 43a0cf7a73
commit 4beb610f23
13 changed files with 97 additions and 66 deletions
+10 -5
View File
@@ -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 (
+8 -4
View File
@@ -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>
+10 -7
View File
@@ -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)
const isFavorited = mockFavorites.some(
(f) => f.userId === "u1" && f.targetType === "player" && f.targetId === player.id,
)
: listServicesByPlayer(player.id)
const isFavorited = checkFavorited("u1", "player", player.id)
return (
<div className="container mx-auto py-8 px-4 max-w-5xl">
+22 -14
View File
@@ -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}
+12 -8
View File
@@ -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 shopReviews = mockReviews.filter((r) => playerIds.includes(r.toUserId))
const isFavorited = mockFavorites.some(
(f) => f.userId === "u1" && f.targetType === "shop" && f.targetId === shop.id,
)
const shopServices = listServices().filter((s) => playerIds.includes(s.playerId))
const shopReviews = listReviews().filter((r) => playerIds.includes(r.toUserId))
const isFavorited = checkFavorited("u1", "shop", shop.id)
const sortedSections = [...shop.templateConfig.sections]
.filter((s) => s.enabled)
+12 -6
View File
@@ -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 userFavorites = mockFavorites.filter((f) => f.userId === user.id)
const userPosts = listPostsByAuthor(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 (