fix: error message

This commit is contained in:
hamster1963 2024-10-20 00:36:22 +08:00
parent 57c7a60860
commit 46958194a4
2 changed files with 115 additions and 112 deletions

View File

@ -24,7 +24,7 @@ export default function ServerListClient() {
<p className="text-sm font-medium opacity-40">{t("error_message")}</p> <p className="text-sm font-medium opacity-40">{t("error_message")}</p>
</div> </div>
); );
if (!data) return null; if (!data?.result) return null;
const { result } = data; const { result } = data;

View File

@ -12,7 +12,10 @@ import useSWR from "swr";
export default function ServerOverviewClient() { export default function ServerOverviewClient() {
const t = useTranslations("ServerOverviewClient"); const t = useTranslations("ServerOverviewClient");
const { data, error } = useSWR<ServerApi>("/api/server", nezhaFetcher); const { data, error, isLoading } = useSWR<ServerApi>(
"/api/server",
nezhaFetcher,
);
const disableCartoon = getEnv("NEXT_PUBLIC_DisableCartoon") === "true"; const disableCartoon = getEnv("NEXT_PUBLIC_DisableCartoon") === "true";
if (error) if (error)
@ -23,14 +26,8 @@ export default function ServerOverviewClient() {
</div> </div>
); );
if (!data?.result)
return (
<div className="flex flex-col items-center justify-center">
<p className="text-sm font-medium opacity-40">{t("no_data_message")}</p>
</div>
);
return ( return (
<>
<section className="grid grid-cols-2 gap-4 lg:grid-cols-4"> <section className="grid grid-cols-2 gap-4 lg:grid-cols-4">
<Card> <Card>
<CardContent className="px-6 py-3"> <CardContent className="px-6 py-3">
@ -42,7 +39,7 @@ export default function ServerOverviewClient() {
<span className="relative flex h-2 w-2"> <span className="relative flex h-2 w-2">
<span className="relative inline-flex h-2 w-2 rounded-full bg-blue-500"></span> <span className="relative inline-flex h-2 w-2 rounded-full bg-blue-500"></span>
</span> </span>
{data ? ( {data?.result ? (
<div className="text-lg font-semibold"> <div className="text-lg font-semibold">
{data?.result.length} {data?.result.length}
</div> </div>
@ -66,7 +63,7 @@ export default function ServerOverviewClient() {
<span className="absolute inline-flex h-full w-full animate-ping rounded-full bg-green-500 opacity-75"></span> <span className="absolute inline-flex h-full w-full animate-ping rounded-full bg-green-500 opacity-75"></span>
<span className="relative inline-flex h-2 w-2 rounded-full bg-green-500"></span> <span className="relative inline-flex h-2 w-2 rounded-full bg-green-500"></span>
</span> </span>
{data ? ( {data?.result ? (
<div className="text-lg font-semibold"> <div className="text-lg font-semibold">
{data?.live_servers} {data?.live_servers}
</div> </div>
@ -90,7 +87,7 @@ export default function ServerOverviewClient() {
<span className="absolute inline-flex h-full w-full animate-ping rounded-full bg-red-500 opacity-75"></span> <span className="absolute inline-flex h-full w-full animate-ping rounded-full bg-red-500 opacity-75"></span>
<span className="relative inline-flex h-2 w-2 rounded-full bg-red-500"></span> <span className="relative inline-flex h-2 w-2 rounded-full bg-red-500"></span>
</span> </span>
{data ? ( {data?.result ? (
<div className="text-lg font-semibold"> <div className="text-lg font-semibold">
{data?.offline_servers} {data?.offline_servers}
</div> </div>
@ -109,7 +106,7 @@ export default function ServerOverviewClient() {
<p className="text-sm font-medium md:text-base"> <p className="text-sm font-medium md:text-base">
{t("p_3463-3530_Totalbandwidth")} {t("p_3463-3530_Totalbandwidth")}
</p> </p>
{data ? ( {data?.result ? (
<section className="flex pt-[4px] items-center gap-2"> <section className="flex pt-[4px] items-center gap-2">
<p className="text-[14px] font-semibold"> <p className="text-[14px] font-semibold">
{formatBytes(data?.total_out_bandwidth)} {formatBytes(data?.total_out_bandwidth)}
@ -136,5 +133,11 @@ export default function ServerOverviewClient() {
</CardContent> </CardContent>
</Card> </Card>
</section> </section>
{data?.result === undefined && !isLoading && (
<div className="flex flex-col items-center justify-center">
<p className="text-sm font-medium opacity-40">{t("error_message")}</p>
</div>
)}
</>
); );
} }