76 lines
2.5 KiB
TypeScript
76 lines
2.5 KiB
TypeScript
import pkg from "../package.json";
|
||
import type { FooterLink, FooterLinksAlign } from "@/lib/brand";
|
||
import FooterTiming from "./FooterTiming";
|
||
|
||
// 官方镜像构建会写入 NEXT_PUBLIC_APP_VERSION（可与脚手架 0.1.0 相同）。
|
||
// 未注入时，脚手架默认号仍当未发布，页脚显示占位。
|
||
function realVersion(pkgVersion: string): string {
|
||
const injected = process.env.NEXT_PUBLIC_APP_VERSION?.trim();
|
||
if (injected) return injected;
|
||
return !pkgVersion || pkgVersion === "0.0.0" || pkgVersion === "0.1.0" ? "" : pkgVersion;
|
||
}
|
||
|
||
function zoneLinks(links: FooterLink[], align: FooterLinksAlign): FooterLink[] {
|
||
return links.filter((item) => (item.align || "right") === align);
|
||
}
|
||
|
||
function LinkGroup({ items }: { items: FooterLink[] }) {
|
||
if (items.length === 0) return null;
|
||
return (
|
||
<div className="site-footer-links">
|
||
{items.map((item) => (
|
||
<a
|
||
key={`${item.align}-${item.label}-${item.url}`}
|
||
href={item.url}
|
||
className="meta text-[12px] hover:underline"
|
||
{...(item.new_tab ? { target: "_blank", rel: "noopener noreferrer" } : {})}
|
||
>
|
||
{item.label}
|
||
</a>
|
||
))}
|
||
</div>
|
||
);
|
||
}
|
||
|
||
// 极简页脚：版权 / 版本 / 耗时 + 左 / 中 / 右三栏链接
|
||
export default function Footer({
|
||
siteName = "姜十三社区",
|
||
links = [],
|
||
}: {
|
||
siteName?: string;
|
||
links?: FooterLink[];
|
||
}) {
|
||
const year = new Date().getFullYear();
|
||
const brand = siteName.trim() || "姜十三社区";
|
||
const visible = links.filter((item) => item.label.trim() && item.url.trim());
|
||
const left = zoneLinks(visible, "left");
|
||
const center = zoneLinks(visible, "center");
|
||
const right = zoneLinks(visible, "right");
|
||
|
||
return (
|
||
<footer
|
||
className="site-footer"
|
||
style={{
|
||
borderTop: "1px solid var(--line)",
|
||
background: "var(--panel)",
|
||
}}
|
||
>
|
||
<div className="site-footer-inner max-w-[1440px] mx-auto px-4 sm:px-6 py-4">
|
||
<div className="site-footer-zone site-footer-zone-left">
|
||
<div className="site-footer-meta">
|
||
<span className="meta text-[12px] whitespace-nowrap">© {year} {brand}</span>
|
||
<FooterTiming version={realVersion(pkg.version)} />
|
||
</div>
|
||
<LinkGroup items={left} />
|
||
</div>
|
||
<div className="site-footer-zone site-footer-zone-center">
|
||
<LinkGroup items={center} />
|
||
</div>
|
||
<div className="site-footer-zone site-footer-zone-right">
|
||
<LinkGroup items={right} />
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
);
|
||
}
|