57 lines
2.2 KiB
TypeScript
57 lines
2.2 KiB
TypeScript
import { Link } from "react-router";
|
|
import { t as i18nT } from "i18next";
|
|
import UserBadge from "~/components/core/users/UserBadge";
|
|
import CheckIcon from "~/components/ui/icons/CheckIcon";
|
|
import XIcon from "~/components/ui/icons/XIcon";
|
|
import TableSimple from "~/components/ui/tables/TableSimple";
|
|
import { useLocaleFormatters } from "~/locale/format";
|
|
import type { IGetSubscribersData } from "../services/.server/NotificationService";
|
|
import { adminPath } from "~/utils/app/CanonicalUrlUtils";
|
|
|
|
export default function NotificationSubscribersTable({ items }: { items: IGetSubscribersData | null }) {
|
|
const formatters = useLocaleFormatters();
|
|
|
|
return (
|
|
<TableSimple
|
|
items={items?.data ?? []}
|
|
pagination={{
|
|
page: (items?.page ?? 0) + 1,
|
|
pageSize: items?.pageSize ?? 0,
|
|
totalItems: items?.totalCount ?? 0,
|
|
totalPages: Math.ceil((items?.totalCount ?? 0) / (items?.pageSize ?? 0)),
|
|
}}
|
|
headers={[
|
|
{
|
|
name: "subscriber",
|
|
title: i18nT("notifications.admin.subscribers.columns.subscriber"),
|
|
value: (i) => (
|
|
<div>
|
|
{!i.email ? (
|
|
<div>-</div>
|
|
) : (
|
|
<Link to={adminPath("notifications/messages?subscriberId=" + i.subscriberId, { mode: "host-aware" })}>
|
|
<UserBadge
|
|
item={{
|
|
id: i.subscriberId,
|
|
email: i.email,
|
|
firstName: i.firstName,
|
|
lastName: i.lastName,
|
|
}}
|
|
/>
|
|
</Link>
|
|
)}
|
|
</div>
|
|
),
|
|
},
|
|
{ name: "createdAt", title: i18nT("notifications.admin.subscribers.columns.createdAt"), value: (i) => formatters.relativeDate(i.createdAt) },
|
|
{ name: "updatedAt", title: i18nT("notifications.admin.subscribers.columns.updatedAt"), value: (i) => formatters.relativeDate(i.updatedAt) },
|
|
{
|
|
name: "deleted",
|
|
title: i18nT("notifications.admin.subscribers.columns.deleted"),
|
|
value: (i) => <div>{i.deleted ? <CheckIcon className="text-theme-500 h-4 w-4" /> : <XIcon className="text-muted-foreground h-4 w-4" />}</div>,
|
|
},
|
|
]}
|
|
></TableSimple>
|
|
);
|
|
}
|