diff --git a/app/[character]/[page]/opengraph-image.tsx b/app/[character]/[page]/opengraph-image.tsx index d895a9d..f3a6e45 100644 --- a/app/[character]/[page]/opengraph-image.tsx +++ b/app/[character]/[page]/opengraph-image.tsx @@ -1,99 +1,59 @@ import { connection } from "next/server"; import { getCachedPublicGuide } from "@/lib/cache/public"; -import { publicSections } from "@/components/public/structured-guide"; import { generateOgImage, ogImageContentType, ogImageSize, } from "@/lib/og-image"; -export const alt = "Buzz Guide section"; +export const alt = "Buzz Guide character guide"; export const size = ogImageSize; export const contentType = ogImageContentType; -function sectionTitle(slug: string, fallback: string): string { - if (slug === "weapon") return "อาวุธแนะนำ"; - if (slug === "artifact") return "อาร์ติแฟกต์และค่าสถานะ"; - if (slug === "constellations") return "กลุ่มดาว"; - if (slug === "team") return "ทีมแนะนำ"; - return fallback; -} - -function sectionContent( - guide: Awaited>, - slug: string, -) { - if (!guide) return { description: "คู่มือเกนชินอิมแพกต์", highlights: [] }; - - if (slug === "weapon") { - return { - description: "อาวุธที่เหมาะกับตัวละคร พร้อมอันดับและเปอร์เซ็นต์การใช้งาน", - highlights: guide.weapons.slice(0, 3).map((item, index) => { - const percent = item.overallPercent ? ` · ${item.overallPercent}%` : ""; - return `${index + 1}. ${item.weapon.name}${percent}`; - }), - }; - } - - if (slug === "artifact") { - const artifactHighlights = guide.artifactGroups.flatMap((group) => - group.rows.slice(0, 2).map((row) => - `${group.name}: ${row.first.name}${row.second ? ` + ${row.second.name}` : ""}`, - ), - ); - const targetHighlights = guide.artifactProfile?.targets - .slice(0, 2) - .map((target) => `${target.stat}: ${target.value}`) ?? []; - return { - description: "เซ็ตอาร์ติแฟกต์ ค่าสถานะหลัก และเป้าหมายที่ควรจัด", - highlights: [...artifactHighlights, ...targetHighlights], - }; - } - - if (slug === "team") { - return { - description: "ทีมแนะนำพร้อมสมาชิกและเวลาหมุนคอมโบ", - highlights: guide.teams - .slice(0, 3) - .map((team) => `${team.title} · ${team.members.length} ตัวละคร`), - }; - } - - if (slug === "constellations") { - return { - description: "รายละเอียดกลุ่มดาวและพลังที่เพิ่มขึ้นในแต่ละระดับ", - highlights: guide.constellations - .slice(0, 3) - .map((constellation) => `C${constellation.level} ${constellation.name}`), - }; - } - - const extra = guide.extras.find((item) => item.slug === slug); - return { - description: extra?.title ?? "รายละเอียดเพิ่มเติมของคู่มือ", - highlights: extra?.rows.slice(0, 3).map((row) => row.heading || row.body) ?? [], - }; -} - export default async function Image({ params, }: { - params: Promise<{ character: string; page: string }>; + params: Promise<{ character: string }>; }) { await connection(); - const { character, page } = await params; - const guide = await getCachedPublicGuide(character); - const section = guide - ? publicSections(guide).find((item) => item.slug === page) - : null; - if (!guide || !section) return new Response("Not found", { status: 404 }); - - const content = sectionContent(guide, page); + const guide = await getCachedPublicGuide((await params).character); + if (!guide) return new Response("Not found", { status: 404 }); + const recommendedWeapon = guide.weapons[0]; + const recommendedArtifact = guide.artifactGroups.find( + (group) => group.rows.length > 0, + )?.rows[0]; return generateOgImage({ title: guide.name, - sub: `${sectionTitle(page, section.title)} · ${content.highlights.join(" · ") || content.description}`, + sub: guide.overview, characterCard: true, backgroundUrl: guide.character.nameCardImageUrl, characterUrl: guide.character.splashImageUrl ?? guide.character.imageUrl, + recommendedWeapon: recommendedWeapon + ? { + name: recommendedWeapon.weapon.name, + refinement: recommendedWeapon.refinement, + rarity: recommendedWeapon.weapon.rarity, + imageUrl: recommendedWeapon.weapon.imageUrl, + overallPercent: recommendedWeapon.overallPercent, + personalPercent: recommendedWeapon.personalPercent, + } + : null, + recommendedArtifact: recommendedArtifact + ? { + first: { + name: recommendedArtifact.first.name, + rarity: recommendedArtifact.first.rarity, + imageUrl: recommendedArtifact.first.imageUrl, + }, + second: recommendedArtifact.second + ? { + name: recommendedArtifact.second.name, + rarity: recommendedArtifact.second.rarity, + imageUrl: recommendedArtifact.second.imageUrl, + } + : null, + percent: recommendedArtifact.percent, + } + : null, }); } diff --git a/app/[character]/[page]/page.tsx b/app/[character]/[page]/page.tsx index c4af15d..57c59dc 100644 --- a/app/[character]/[page]/page.tsx +++ b/app/[character]/[page]/page.tsx @@ -9,9 +9,9 @@ type Params = Promise<{ character: string; page: string }>; export async function generateMetadata({ params }: { params: Params }): Promise { await connection(); - const { character, page } = await params; + const { character } = await params; const guide = await getCachedPublicGuide(character); - return guide ? { title: `${page} - ${guide.name} - คู่มือ`, description: guide.overview } : { title: "ไม่พบไกด์" }; + return guide ? { title: `${guide.name}`, description: guide.overview } : { title: "ไม่พบไกด์" }; } export default async function GuideSectionPage({ params }: { params: Params }) { diff --git a/app/[character]/page.tsx b/app/[character]/page.tsx index 7fa5943..0d7ba96 100644 --- a/app/[character]/page.tsx +++ b/app/[character]/page.tsx @@ -15,7 +15,7 @@ export async function generateMetadata({ await connection(); const guide = await getCachedPublicGuide((await params).character); return guide - ? { title: `${guide.name} - คู่มือ`, description: guide.overview } + ? { title: `${guide.name}`, description: guide.overview } : { title: "ไม่พบไกด์" }; } diff --git a/app/layout.tsx b/app/layout.tsx index 9f5aada..57df517 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -29,8 +29,7 @@ export const metadata: Metadata = { }; export default function RootLayout({ children }: LayoutProps<"/">) { - const deploymentId = - process.env.NEXT_DEPLOYMENT_ID?.trim() || "development"; + const deploymentId = process.env.NEXT_DEPLOYMENT_ID?.trim() || "development"; return ( ) { {children} - + diff --git a/app/opengraph-image.tsx b/app/opengraph-image.tsx index 28b684b..359b796 100644 --- a/app/opengraph-image.tsx +++ b/app/opengraph-image.tsx @@ -4,13 +4,13 @@ import { ogImageSize, } from "@/lib/og-image"; -export const alt = "Buzz Guide - คู่มือเกนชินสาธารณะที่เตรียมไว้ให้คุณ"; +export const alt = "Buzz Guide "; export const size = ogImageSize; export const contentType = ogImageContentType; export default function Image() { return generateOgImage({ title: "ไกด์ตัวละคร", - sub: "คู่มือเกนชินสาธารณะที่เตรียมไว้ให้คุณ", + sub: "", }); } diff --git a/app/page.tsx b/app/page.tsx index 1dea880..e7ab6b8 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -14,9 +14,6 @@ export default async function HomePage() {
-

- คู่มือการจัดตัวละครเกนชินอิมแพกต์ -

เลือกตัวละครแล้วส่องดูได้เลย

diff --git a/components/public/site-header.tsx b/components/public/site-header.tsx index f7d05fe..b912102 100644 --- a/components/public/site-header.tsx +++ b/components/public/site-header.tsx @@ -15,7 +15,7 @@ export async function SiteHeader({ editHref = "/admin" }: { editHref?: string } className="mr-auto flex min-h-11 items-center gap-3 rounded-lg font-heading font-semibold focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring" > - ไกด์ช่องเกนชินไม่ใช่เกมมือถือ + ไกด์เกนชินไม่ใช่เกมมือถือ