9a49ff3f5e
包含分组标题行、移动端 Tab 隐藏滚动条、信号卡片样式及浅色主题适配。
98 lines
2.7 KiB
TypeScript
98 lines
2.7 KiB
TypeScript
"use client";
|
|
|
|
import { RefreshCw } from "lucide-react";
|
|
import { useEffect } from "react";
|
|
import { I18nProvider, useI18n } from "@/hooks/useI18n";
|
|
|
|
function AccountErrorContent({
|
|
error,
|
|
reset,
|
|
}: {
|
|
error: Error & { digest?: string };
|
|
reset: () => void;
|
|
}) {
|
|
const { locale } = useI18n();
|
|
const isEn = locale === "en-US";
|
|
|
|
useEffect(() => {
|
|
console.error("Account page error:", error);
|
|
}, [error]);
|
|
|
|
return (
|
|
<div
|
|
style={{
|
|
display: "flex",
|
|
flexDirection: "column",
|
|
alignItems: "center",
|
|
justifyContent: "center",
|
|
minHeight: "100vh",
|
|
padding: "2rem",
|
|
gap: "1rem",
|
|
backgroundColor: "var(--color-bg-base, #0B1220)",
|
|
color: "var(--color-text-primary, #E6EDF3)",
|
|
fontFamily: "var(--font-data, Inter, sans-serif)",
|
|
textAlign: "center",
|
|
}}
|
|
>
|
|
<h1
|
|
style={{
|
|
fontSize: "1.25rem",
|
|
fontWeight: 600,
|
|
margin: 0,
|
|
color: "var(--color-accent-primary, #4DA3FF)",
|
|
}}
|
|
>
|
|
{isEn ? "Account Page Error" : "账户页面出错"}
|
|
</h1>
|
|
<p
|
|
style={{
|
|
color: "var(--color-text-secondary, #9FB2C7)",
|
|
fontSize: "0.875rem",
|
|
margin: 0,
|
|
maxWidth: 420,
|
|
lineHeight: 1.7,
|
|
}}
|
|
>
|
|
{isEn
|
|
? "If this happened during payment or wallet binding, the most common cause is conflicting wallet extensions (e.g. MetaMask and Rabby open at the same time). Try disabling other wallet extensions and refresh."
|
|
: "如果是在支付或绑定钱包时出现此问题,常见原因是钱包插件冲突(例如同时开启了 MetaMask 和 Rabby)。请尝试关闭其他钱包插件后刷新页面重试。"}
|
|
</p>
|
|
<button
|
|
type="button"
|
|
onClick={reset}
|
|
style={{
|
|
marginTop: "0.5rem",
|
|
display: "inline-flex",
|
|
alignItems: "center",
|
|
gap: "0.5rem",
|
|
padding: "0.5rem 1.25rem",
|
|
borderRadius: "var(--radius-md, 10px)",
|
|
border: "1px solid var(--color-border-default, rgba(159,178,199,0.16))",
|
|
backgroundColor: "var(--color-bg-raised, #111A2E)",
|
|
color: "var(--color-accent-primary, #4DA3FF)",
|
|
cursor: "pointer",
|
|
fontSize: "0.875rem",
|
|
fontWeight: 500,
|
|
}}
|
|
>
|
|
<RefreshCw size={14} />
|
|
{isEn ? "Retry" : "重试"}
|
|
</button>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default function AccountErrorPage({
|
|
error,
|
|
reset,
|
|
}: {
|
|
error: Error & { digest?: string };
|
|
reset: () => void;
|
|
}) {
|
|
return (
|
|
<I18nProvider>
|
|
<AccountErrorContent error={error} reset={reset} />
|
|
</I18nProvider>
|
|
);
|
|
}
|