refactor: standardize code formatting across components and utilities
Some checks failed
Push to github container register / push-docker (push) Has been cancelled

- Updated formatting in SiteFooter and SiteHeader components for consistency.
- Refactored Badge, Button, Card, Separator components to improve readability.
- Enhanced markdown parsing logic in announcements and markdown utility functions.
- Adjusted ESLint configuration for better code quality checks.
- Added biome.json for BiomeJS configuration.
- Updated package.json and configuration files for improved dependency management.
This commit is contained in:
2026-04-06 03:44:49 +00:00
parent 8624d2c805
commit 88233ff069
24 changed files with 935 additions and 869 deletions

View File

@@ -3,64 +3,75 @@ import Link from "next/link";
import { notFound } from "next/navigation";
import { Badge } from "@/components/ui/badge";
import { getAnnouncementBySlug, getAnnouncementSlugs } from "@/lib/announcements";
import {
getAnnouncementBySlug,
getAnnouncementSlugs,
} from "@/lib/announcements";
type PageProps = {
params: Promise<{ slug: string }>;
params: Promise<{ slug: string }>;
};
export async function generateStaticParams() {
const slugs = await getAnnouncementSlugs();
return slugs.map((slug) => ({ slug }));
const slugs = await getAnnouncementSlugs();
return slugs.map((slug) => ({ slug }));
}
export async function generateMetadata({ params }: PageProps): Promise<Metadata> {
const { slug } = await params;
export async function generateMetadata({
params,
}: PageProps): Promise<Metadata> {
const { slug } = await params;
try {
const announcement = await getAnnouncementBySlug(slug);
return {
title: `${announcement.title} | お知らせ`,
description: announcement.summary || `${announcement.title} のお知らせです。`,
};
} catch {
return {
title: "お知らせ",
description: "お知らせページ",
};
}
try {
const announcement = await getAnnouncementBySlug(slug);
return {
title: `${announcement.title} | お知らせ`,
description:
announcement.summary || `${announcement.title} のお知らせです。`,
};
} catch {
return {
title: "お知らせ",
description: "お知らせページ",
};
}
}
export default async function AnnouncementDetailPage({ params }: PageProps) {
const { slug } = await params;
const { slug } = await params;
let announcement;
try {
announcement = await getAnnouncementBySlug(slug);
} catch {
notFound();
}
let announcement;
try {
announcement = await getAnnouncementBySlug(slug);
} catch {
notFound();
}
return (
<article className="mx-auto flex w-full max-w-4xl flex-1 flex-col gap-6 px-4 py-8 sm:px-8 sm:py-12">
<header className="rounded-3xl border bg-card/70 p-6 shadow-sm backdrop-blur motion-safe:animate-in motion-safe:fade-in motion-safe:slide-in-from-bottom-3 motion-safe:duration-700 sm:p-8">
<Badge variant="outline" className="mb-3">
</Badge>
<p className="text-xs text-muted-foreground">{announcement.date}</p>
<h1 className="mt-2 text-2xl font-semibold tracking-tight sm:text-4xl">{announcement.title}</h1>
</header>
return (
<article className="mx-auto flex w-full max-w-4xl flex-1 flex-col gap-6 px-4 py-8 sm:px-8 sm:py-12">
<header className="rounded-3xl border bg-card/70 p-6 shadow-sm backdrop-blur motion-safe:animate-in motion-safe:fade-in motion-safe:slide-in-from-bottom-3 motion-safe:duration-700 sm:p-8">
<Badge variant="outline" className="mb-3">
</Badge>
<p className="text-xs text-muted-foreground">{announcement.date}</p>
<h1 className="mt-2 text-2xl font-semibold tracking-tight sm:text-4xl">
{announcement.title}
</h1>
</header>
<section className="rounded-3xl border bg-card p-6 shadow-sm motion-safe:animate-in motion-safe:fade-in motion-safe:slide-in-from-bottom-2 motion-safe:duration-700 sm:p-8">
<div
className="markdown-body space-y-4 text-sm leading-7 sm:text-base [&_a]:text-primary [&_a]:underline [&_a]:underline-offset-4 [&_blockquote]:border-l-2 [&_blockquote]:pl-3 [&_code]:rounded [&_code]:bg-muted [&_code]:px-1.5 [&_code]:py-0.5 [&_h1]:text-2xl [&_h1]:font-semibold [&_h2]:text-xl [&_h2]:font-semibold [&_h3]:text-lg [&_h3]:font-semibold [&_li]:ml-5 [&_ol]:list-decimal [&_pre]:overflow-x-auto [&_pre]:rounded-lg [&_pre]:bg-muted [&_pre]:p-3 [&_ul]:list-disc"
dangerouslySetInnerHTML={{ __html: announcement.contentHtml }}
/>
</section>
<section className="rounded-3xl border bg-card p-6 shadow-sm motion-safe:animate-in motion-safe:fade-in motion-safe:slide-in-from-bottom-2 motion-safe:duration-700 sm:p-8">
<div
className="markdown-body space-y-4 text-sm leading-7 sm:text-base [&_a]:text-primary [&_a]:underline [&_a]:underline-offset-4 [&_blockquote]:border-l-2 [&_blockquote]:pl-3 [&_code]:rounded [&_code]:bg-muted [&_code]:px-1.5 [&_code]:py-0.5 [&_h1]:text-2xl [&_h1]:font-semibold [&_h2]:text-xl [&_h2]:font-semibold [&_h3]:text-lg [&_h3]:font-semibold [&_li]:ml-5 [&_ol]:list-decimal [&_pre]:overflow-x-auto [&_pre]:rounded-lg [&_pre]:bg-muted [&_pre]:p-3 [&_ul]:list-disc"
dangerouslySetInnerHTML={{ __html: announcement.contentHtml }}
/>
</section>
<Link href="/announcements" className="text-sm text-primary underline underline-offset-4 transition-transform duration-200 hover:-translate-y-0.5">
</Link>
</article>
);
<Link
href="/announcements"
className="text-sm text-primary underline underline-offset-4 transition-transform duration-200 hover:-translate-y-0.5"
>
</Link>
</article>
);
}

View File

@@ -1,10 +1,10 @@
export default function AnnouncementsLoading() {
return (
<div className="mx-auto flex w-full max-w-5xl flex-1 items-center justify-center px-4 py-12 sm:px-8">
<div className="flex items-center gap-3 rounded-xl border bg-card px-5 py-3 text-sm text-muted-foreground shadow-sm">
<span className="inline-block size-2.5 animate-pulse rounded-full bg-primary" />
...
</div>
</div>
);
return (
<div className="mx-auto flex w-full max-w-5xl flex-1 items-center justify-center px-4 py-12 sm:px-8">
<div className="flex items-center gap-3 rounded-xl border bg-card px-5 py-3 text-sm text-muted-foreground shadow-sm">
<span className="inline-block size-2.5 animate-pulse rounded-full bg-primary" />
...
</div>
</div>
);
}

View File

@@ -4,43 +4,48 @@ import { Badge } from "@/components/ui/badge";
import { getAllAnnouncements } from "@/lib/announcements";
export const metadata = {
title: "お知らせ | Takasumi-Neodyマイクラサーバプロジェクト",
description: "Takasumi-Neodyマイクラサーバプロジェクトのお知らせ一覧です。",
title: "お知らせ | Takasumi-Neodyマイクラサーバプロジェクト",
description: "Takasumi-Neodyマイクラサーバプロジェクトのお知らせ一覧です。",
};
export default async function AnnouncementsPage() {
const announcements = await getAllAnnouncements();
const announcements = await getAllAnnouncements();
return (
<div className="mx-auto flex w-full max-w-5xl flex-1 flex-col gap-6 px-4 py-8 sm:px-8 sm:py-12">
<header className="rounded-3xl border bg-card/70 p-6 shadow-sm backdrop-blur motion-safe:animate-in motion-safe:fade-in motion-safe:slide-in-from-bottom-3 motion-safe:duration-700 sm:p-8">
<Badge variant="outline" className="mb-3">
</Badge>
<h1 className="text-3xl font-semibold tracking-tight sm:text-4xl"></h1>
<p className="mt-3 text-sm leading-7 text-muted-foreground sm:text-base">
Markdown
</p>
</header>
return (
<div className="mx-auto flex w-full max-w-5xl flex-1 flex-col gap-6 px-4 py-8 sm:px-8 sm:py-12">
<header className="rounded-3xl border bg-card/70 p-6 shadow-sm backdrop-blur motion-safe:animate-in motion-safe:fade-in motion-safe:slide-in-from-bottom-3 motion-safe:duration-700 sm:p-8">
<Badge variant="outline" className="mb-3">
</Badge>
<h1 className="text-3xl font-semibold tracking-tight sm:text-4xl">
</h1>
<p className="mt-3 text-sm leading-7 text-muted-foreground sm:text-base">
Markdown
</p>
</header>
<section className="grid gap-4">
{announcements.map((item) => (
<article className="rounded-2xl border border-foreground/10 bg-card p-5 shadow-xs transition-all duration-300 motion-safe:animate-in motion-safe:fade-in motion-safe:slide-in-from-bottom-4 hover:-translate-y-1 hover:shadow-md sm:p-6" key={item.slug}>
<header>
<p className="text-xs text-muted-foreground">{item.date}</p>
<h2 className="mt-1 text-xl font-semibold">
<Link
href={`/announcements/${item.slug}`}
className="underline-offset-4 transition-colors duration-200 hover:text-primary hover:underline"
>
{item.title}
</Link>
</h2>
</header>
<p className="mt-3 text-sm text-muted-foreground">{item.summary}</p>
</article>
))}
</section>
</div>
);
<section className="grid gap-4">
{announcements.map((item) => (
<article
className="rounded-2xl border border-foreground/10 bg-card p-5 shadow-xs transition-all duration-300 motion-safe:animate-in motion-safe:fade-in motion-safe:slide-in-from-bottom-4 hover:-translate-y-1 hover:shadow-md sm:p-6"
key={item.slug}
>
<header>
<p className="text-xs text-muted-foreground">{item.date}</p>
<h2 className="mt-1 text-xl font-semibold">
<Link
href={`/announcements/${item.slug}`}
className="underline-offset-4 transition-colors duration-200 hover:text-primary hover:underline"
>
{item.title}
</Link>
</h2>
</header>
<p className="mt-3 text-sm text-muted-foreground">{item.summary}</p>
</article>
))}
</section>
</div>
);
}