nixcn/cms-server
1
0
Fork 1
Code Pull Requests Activity

refactor(profile): update error display to use Empty component

Browse Source 
Signed-off-by: Noa Virellia <noa@requiem.garden>
This commit is contained in:
Noa Virellia
2026-02-06 20:47:35 +08:00
parent 6411268090
commit 3c4e078bdd
3 changed files with 22 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
client/cms/src/components/profile/profile.error.tsx
View File

@@ -1,30 +1,16 @@
import { Mail } from 'lucide-react';
import { Skeleton } from '../ui/skeleton';
import { UserLock } from 'lucide-react';
import { Empty, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle } from '../ui/empty';
export function ProfileError({ reason }: { reason: string }) {
return (
<div className="flex flex-col justify-center w-full lg:w-auto h-full lg:h-auto lg:flex-row lg:gap-8">
<div className="flex w-full flex-row mt-2 lg:mt-0 lg:flex-col lg:w-max">
<div className="flex flex-col w-full gap-3">
<div className="flex flex-col w-full gap-3">
<div className="flex flex-row gap-3 w-full lg:flex-col">
<Skeleton className="size-16 rounded-full border-2 border-muted lg:size-64" />
<div className="flex flex-1 flex-col justify-center lg:mt-3 gap-2">
<Skeleton className="w-32 h-8" />
<Skeleton className="w-20 h-6" />
</div>
</div>
<div className="flex flex-row gap-2 items-center text-sm px-1 lg:px-0">
<Mail className="h-4 w-4 stroke-muted-foreground" />
<Skeleton className="w-32 h-4" />
</div>
</div>
<Skeleton className="w-64 h-[40px]" />
</div>
</div>
<Skeleton className="relative rounded-md border border-muted w-full flex-1 lg:flex-auto min-h-72 lg:h-full mt-4 lg:mt-0 prose dark:prose-invert max-w-[1012px] self-center flex items-center justify-center">
{reason}
</Skeleton>
</div>
<Empty className="h-full">
<EmptyHeader>
<EmptyMedia variant="icon">
<UserLock />
</EmptyMedia>
<EmptyTitle>无法查看此个人资料</EmptyTitle>
<EmptyDescription>{reason}</EmptyDescription>
</EmptyHeader>
</Empty>
);
}