adrianbonpin/deckyvault
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

chore: fix tailwind v4 styling & format styling

Browse Source
This commit is contained in:
adrianbonpin
2026-04-27 06:17:46 +08:00
parent 0a3738a778
commit ea6407cb4f
2 changed files with 1140 additions and 1017 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/game/[id]/game-page-client.tsx
+909 -791
View File
File diff suppressed because it is too large Load Diff
app/game/[id]/page.tsx
+231 -226
View File
@@ -2,257 +2,262 @@ import { notFound } from "next/navigation"
import { after } from "next/server" import { after } from "next/server"
import { db } from "@/lib/db/index" import { db } from "@/lib/db/index"
import { import {
games, games,
gameVersions, gameVersions,
performanceEntries, performanceEntries,
communityPresets, communityPresets,
gameComments, gameComments,
gamePlatformSupport, gamePlatformSupport,
hardware, hardware,
} from "@/lib/db/schema" } from "@/lib/db/schema"
import { eq, sql } from "drizzle-orm" import { eq, sql } from "drizzle-orm"
import { isSyncStale, syncSteamGame } from "@/lib/steam/sync" import { isSyncStale, syncSteamGame } from "@/lib/steam/sync"
import { GamePageClient } from "./game-page-client" import { GamePageClient } from "./game-page-client"
export const metadata = { export const metadata = {
title: "Game", title: "Game",
} }
async function createGameStub(steamAppId: number) { async function createGameStub(steamAppId: number) {
const url = new URL("https://store.steampowered.com/api/appdetails/") const url = new URL("https://store.steampowered.com/api/appdetails/")
url.searchParams.set("appids", String(steamAppId)) url.searchParams.set("appids", String(steamAppId))
url.searchParams.set("cc", "US") url.searchParams.set("cc", "US")
url.searchParams.set("l", "en") url.searchParams.set("l", "en")
const res = await fetch(url.toString(), { const res = await fetch(url.toString(), {
headers: { Accept: "application/json" }, headers: { Accept: "application/json" },
})
let title = `Steam App ${steamAppId}`
let developer: string | null = null
let publisher: string | null = null
let genres: string[] | null = null
let headerImage: string | null = null
let capsuleImage: string | null = null
let description: string | null = null
if (res.ok) {
const data = (await res.json()) as Record<
string,
{
success: boolean
data: {
type?: string
name: string
developers?: string[]
publishers?: string[]
genres?: { description: string }[]
header_image?: string
short_description?: string
}
}
>
const entry = data[String(steamAppId)]
if (entry?.success && entry.data) {
if (entry.data.type && entry.data.type !== "game") {
notFound()
}
title = entry.data.name
developer = entry.data.developers?.[0] ?? null
publisher = entry.data.publishers?.[0] ?? null
genres = entry.data.genres?.map((g) => g.description) ?? []
headerImage = entry.data.header_image ?? null
capsuleImage = `https://cdn.akamai.steamstatic.com/steam/apps/${steamAppId}/library_600x900.jpg`
description = entry.data.short_description ?? null
}
}
const [game] = await db
.insert(games)
.values({
steamAppId,
source: "steam",
title,
developer,
publisher,
genres,
headerImage,
capsuleImage,
description,
storeUrl: `https://store.steampowered.com/app/${steamAppId}`,
lastSync: new Date(),
syncStatus: "synced",
}) })
.returning()
return game let title = `Steam App ${steamAppId}`
let developer: string | null = null
let publisher: string | null = null
let genres: string[] | null = null
let headerImage: string | null = null
let capsuleImage: string | null = null
let description: string | null = null
if (res.ok) {
const data = (await res.json()) as Record<
string,
{
success: boolean
data: {
type?: string
name: string
developers?: string[]
publishers?: string[]
genres?: { description: string }[]
header_image?: string
short_description?: string
}
}
>
const entry = data[String(steamAppId)]
if (entry?.success && entry.data) {
if (entry.data.type && entry.data.type !== "game") {
notFound()
}
title = entry.data.name
developer = entry.data.developers?.[0] ?? null
publisher = entry.data.publishers?.[0] ?? null
genres = entry.data.genres?.map((g) => g.description) ?? []
headerImage = entry.data.header_image ?? null
capsuleImage = `https://cdn.akamai.steamstatic.com/steam/apps/${steamAppId}/library_600x900.jpg`
description = entry.data.short_description ?? null
}
}
const [game] = await db
.insert(games)
.values({
steamAppId,
source: "steam",
title,
developer,
publisher,
genres,
headerImage,
capsuleImage,
description,
storeUrl: `https://store.steampowered.com/app/${steamAppId}`,
lastSync: new Date(),
syncStatus: "synced",
})
.returning()
return game
} }
export default async function GamePage({ export default async function GamePage({
params, params,
searchParams, searchParams,
}: { }: {
params: Promise<{ id: string }> params: Promise<{ id: string }>
searchParams: Promise<{ sync?: string }> searchParams: Promise<{ sync?: string }>
}) { }) {
const { id } = await params const { id } = await params
const { sync } = await searchParams const { sync } = await searchParams
const isNumeric = /^\d+$/.test(id) const isNumeric = /^\d+$/.test(id)
const forceSync = sync === "1" const forceSync = sync === "1"
// ── Resolve game ──────────────────────────────────────────────── // ── Resolve game ────────────────────────────────────────────────
let game let game
if (isNumeric) { if (isNumeric) {
const rows = await db const rows = await db
.select() .select()
.from(games) .from(games)
.where(eq(games.steamAppId, Number(id))) .where(eq(games.steamAppId, Number(id)))
.limit(1) .limit(1)
game = rows[0] game = rows[0]
} else { } else {
const rows = await db const rows = await db
.select() .select()
.from(games) .from(games)
.where(eq(games.id, id)) .where(eq(games.id, id))
.limit(1) .limit(1)
game = rows[0] game = rows[0]
}
if (!game && isNumeric) {
try {
game = await createGameStub(Number(id))
} catch (err) {
console.error("Failed to auto-create game stub:", err)
} }
}
if (!game) { if (!game && isNumeric) {
notFound() try {
} game = await createGameStub(Number(id))
} catch (err) {
console.error("Failed to auto-create game stub:", err)
}
}
// ── Fetch related data in parallel ────────────────────────────── if (!game) {
const [benchmarkCount, presetCount, commentCount, platformSupport, presetRows] = notFound()
await Promise.all([ }
db
.select({ count: sql<number>`count(*)::int` }) // ── Fetch related data in parallel ──────────────────────────────
.from(performanceEntries) const [
.innerJoin( benchmarkCount,
gameVersions, presetCount,
eq(performanceEntries.versionId, gameVersions.id), commentCount,
) platformSupport,
.where(eq(gameVersions.gameId, game.id)) presetRows,
.then((r) => r[0]?.count ?? 0), ] = await Promise.all([
db db
.select({ count: sql<number>`count(*)::int` }) .select({ count: sql<number>`count(*)::int` })
.from(communityPresets) .from(performanceEntries)
.where(eq(communityPresets.gameId, game.id)) .innerJoin(
.then((r) => r[0]?.count ?? 0), gameVersions,
db eq(performanceEntries.versionId, gameVersions.id),
.select({ count: sql<number>`count(*)::int` }) )
.from(gameComments) .where(eq(gameVersions.gameId, game.id))
.where(eq(gameComments.gameId, game.id)) .then((r) => r[0]?.count ?? 0),
.then((r) => r[0]?.count ?? 0), db
db .select({ count: sql<number>`count(*)::int` })
.select() .from(communityPresets)
.from(gamePlatformSupport) .where(eq(communityPresets.gameId, game.id))
.where(eq(gamePlatformSupport.gameId, game.id)) .then((r) => r[0]?.count ?? 0),
.then((r) => r), db
db .select({ count: sql<number>`count(*)::int` })
.select({ .from(gameComments)
id: communityPresets.id, .where(eq(gameComments.gameId, game.id))
name: communityPresets.name, .then((r) => r[0]?.count ?? 0),
description: communityPresets.description, db
hardwareSlug: communityPresets.hardwareSlug, .select()
hardwareName: hardware.name, .from(gamePlatformSupport)
upvotes: communityPresets.upvotes, .where(eq(gamePlatformSupport.gameId, game.id))
settingsJson: communityPresets.settingsJson, .then((r) => r),
createdAt: communityPresets.createdAt, db
fpsAvg: performanceEntries.fpsAvg, .select({
fpsLow: performanceEntries.fpsLow, id: communityPresets.id,
fpsHigh: performanceEntries.fpsHigh, name: communityPresets.name,
fsrVersion: performanceEntries.fsrVersion, description: communityPresets.description,
frameGenMethod: performanceEntries.frameGenMethod, hardwareSlug: communityPresets.hardwareSlug,
protonVersion: performanceEntries.protonVersion, hardwareName: hardware.name,
osVersion: performanceEntries.osVersion, upvotes: communityPresets.upvotes,
}) settingsJson: communityPresets.settingsJson,
.from(communityPresets) createdAt: communityPresets.createdAt,
.leftJoin( fpsAvg: performanceEntries.fpsAvg,
performanceEntries, fpsLow: performanceEntries.fpsLow,
eq(communityPresets.performanceEntryId, performanceEntries.id), fpsHigh: performanceEntries.fpsHigh,
) fsrVersion: performanceEntries.fsrVersion,
.innerJoin( frameGenMethod: performanceEntries.frameGenMethod,
hardware, protonVersion: performanceEntries.protonVersion,
eq(communityPresets.hardwareSlug, hardware.slug), osVersion: performanceEntries.osVersion,
) })
.where(eq(communityPresets.gameId, game.id)) .from(communityPresets)
.orderBy(sql`${communityPresets.upvotes} DESC`), .leftJoin(
performanceEntries,
eq(communityPresets.performanceEntryId, performanceEntries.id),
)
.innerJoin(
hardware,
eq(communityPresets.hardwareSlug, hardware.slug),
)
.where(eq(communityPresets.gameId, game.id))
.orderBy(sql`${communityPresets.upvotes} DESC`),
]) ])
// ── Sync logic: force or stale-while-revalidate ───────────────── // ── Sync logic: force or stale-while-revalidate ─────────────────
const shouldSync = const shouldSync =
game.source === "steam" && game.source === "steam" &&
game.steamAppId && game.steamAppId &&
(forceSync || isSyncStale(game.lastSync)) (forceSync || isSyncStale(game.lastSync))
if (shouldSync) { if (shouldSync) {
after(async () => { after(async () => {
await syncSteamGame(game.steamAppId!) await syncSteamGame(game.steamAppId!)
}) })
} }
// Serialize for client component (Dates → strings) // Serialize for client component (Dates → strings)
const serializedGame = { const serializedGame = {
id: game.id, id: game.id,
steamAppId: game.steamAppId, steamAppId: game.steamAppId,
title: game.title, title: game.title,
description: game.description, description: game.description,
developer: game.developer, developer: game.developer,
publisher: game.publisher, publisher: game.publisher,
genres: game.genres, genres: game.genres,
headerImage: game.headerImage, headerImage: game.headerImage,
capsuleImage: game.capsuleImage, capsuleImage: game.capsuleImage,
storeUrl: game.storeUrl, storeUrl: game.storeUrl,
source: game.source, source: game.source,
lastSync: game.lastSync ? game.lastSync.toISOString() : null, lastSync: game.lastSync ? game.lastSync.toISOString() : null,
syncStatus: game.syncStatus, syncStatus: game.syncStatus,
createdAt: game.createdAt.toISOString(), createdAt: game.createdAt.toISOString(),
} }
const serializedPresets = presetRows.map((p) => ({ const serializedPresets = presetRows.map((p) => ({
id: p.id, id: p.id,
name: p.name, name: p.name,
description: p.description, description: p.description,
hardwareSlug: p.hardwareSlug, hardwareSlug: p.hardwareSlug,
hardwareName: p.hardwareName, hardwareName: p.hardwareName,
upvotes: p.upvotes, upvotes: p.upvotes,
settingsCount: Array.isArray(p.settingsJson) settingsCount: Array.isArray(p.settingsJson)
? p.settingsJson.reduce( ? p.settingsJson.reduce(
(sum: number, cat: { settings: unknown[] }) => (sum: number, cat: { settings: unknown[] }) =>
sum + cat.settings.length, sum + cat.settings.length,
0, 0,
) )
: 0, : 0,
fpsAvg: p.fpsAvg, fpsAvg: p.fpsAvg,
fpsLow: p.fpsLow, fpsLow: p.fpsLow,
fpsHigh: p.fpsHigh, fpsHigh: p.fpsHigh,
fsrVersion: p.fsrVersion, fsrVersion: p.fsrVersion,
frameGenMethod: p.frameGenMethod, frameGenMethod: p.frameGenMethod,
protonVersion: p.protonVersion, protonVersion: p.protonVersion,
osVersion: p.osVersion, osVersion: p.osVersion,
createdAt: p.createdAt.toISOString(), createdAt: p.createdAt.toISOString(),
})) }))
return ( return (
<GamePageClient <GamePageClient
game={serializedGame} game={serializedGame}
counts={{ counts={{
benchmarks: benchmarkCount, benchmarks: benchmarkCount,
presets: presetCount, presets: presetCount,
comments: commentCount, comments: commentCount,
}} }}
platformSupport={platformSupport} platformSupport={platformSupport}
presets={serializedPresets} presets={serializedPresets}
gameId={game.id} gameId={game.id}
/> />
) )
} }