40 lines
1.1 KiB
TypeScript
40 lines
1.1 KiB
TypeScript
|
import { Button } from "@repo/shadcn-ui/components/button";
|
||
|
|
import { ChevronRightIcon } from "@repo/shadcn-ui/lib/icons";
|
||
|
|
import type { ReactNode } from "react";
|
||
|
|
import { useTranslation } from "react-i18next";
|
||
|
|
|
||
|
|
export function DashboardPanel({
|
||
|
|
title,
|
||
|
|
icon,
|
||
|
|
action,
|
||
|
|
children,
|
||
|
|
}: {
|
||
|
|
title: string;
|
||
|
|
icon?: ReactNode;
|
||
|
|
action?: () => void;
|
||
|
|
children: ReactNode;
|
||
|
|
}) {
|
||
|
|
const { t } = useTranslation("companies");
|
||
|
|
return (
|
||
|
|
<section aria-label={title} className="dashboard-panel min-w-0">
|
||
|
|
<div className="mb-4 flex items-center justify-between gap-3">
|
||
|
|
<h2 className="flex items-center gap-3">
|
||
|
|
{icon && (
|
||
|
|
<span aria-hidden="true" className="[&_svg]:size-5">
|
||
|
|
{icon}
|
||
|
|
</span>
|
||
|
|
)}
|
||
|
|
{title}
|
||
|
|
</h2>
|
||
|
|
{action && (
|
||
|
|
<Button className="text-primary shrink-0" onClick={action} size="sm" variant="ghost">
|
||
|
|
{t("dashboard.viewAll")}
|
||
|
|
<ChevronRightIcon aria-hidden="true" className="size-4" />
|
||
|
|
</Button>
|
||
|
|
)}
|
||
|
|
</div>
|
||
|
|
{children}
|
||
|
|
</section>
|
||
|
|
);
|
||
|
|
}
|