33 lines
1.1 KiB
TypeScript
33 lines
1.1 KiB
TypeScript
import { Users } from "lucide-react";
|
|
import { useTranslation } from "react-i18next";
|
|
import { Button } from "@/components/ui/button";
|
|
|
|
interface ProviderEmptyStateProps {
|
|
onCreate?: () => void;
|
|
}
|
|
|
|
export function ProviderEmptyState({ onCreate }: ProviderEmptyStateProps) {
|
|
const { t } = useTranslation();
|
|
|
|
return (
|
|
<div className="flex flex-col items-center justify-center rounded-lg border border-dashed border-muted-foreground/30 p-10 text-center">
|
|
<div className="mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-muted">
|
|
<Users className="h-7 w-7 text-muted-foreground" />
|
|
</div>
|
|
<h3 className="text-lg font-semibold">
|
|
{t("provider.noProviders", { defaultValue: "暂无供应商" })}
|
|
</h3>
|
|
<p className="mt-2 max-w-sm text-sm text-muted-foreground">
|
|
{t("provider.noProvidersDescription", {
|
|
defaultValue: "开始添加一个供应商以快速完成切换。",
|
|
})}
|
|
</p>
|
|
{onCreate && (
|
|
<Button className="mt-6" onClick={onCreate}>
|
|
{t("provider.addProvider", { defaultValue: "添加供应商" })}
|
|
</Button>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|