Track HiveGrid Cloud planning reference

2026-06-26 20:48:01 +02:00
1 parent b3d5ea6764
commit e341c5938a
@@ -0,0 +1,56 @@
+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>
+  );
+}