Files
lume/packages/ui/src/emptyFeed.tsx
2024-03-02 15:21:28 +07:00

35 lines
830 B
TypeScript

import { InfoIcon } from "@lume/icons";
import { cn } from "@lume/utils";
import { useTranslation } from "react-i18next";
export function EmptyFeed({
text,
subtext,
className,
}: {
text?: string;
subtext?: string;
className?: string;
}) {
const { t } = useTranslation();
return (
<div
className={cn(
"flex w-full flex-col items-center justify-center gap-2 rounded-xl bg-neutral-50 py-3 dark:bg-neutral-950",
className,
)}
>
<InfoIcon className="size-8 text-blue-500" />
<div className="text-center">
<p className="text-lg font-semibold">
{text ? text : t("global.emptyFeedTitle")}
</p>
<p className="text-sm leading-tight">
{subtext ? subtext : t("global.emptyFeedSubtitle")}
</p>
</div>
</div>
);
}