@aglyn/plugins-marketing 1.0.0-beta.143

package/src/lib/components/email-recipients-card.js

@@ -0,0 +1,338 @@
+/**
+ * @license
+ * Copyright 2026 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */ 'use client';
+import { _ as _extends } from "@swc/helpers/_/_extends";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { pluginDocsHelp } from "@aglyn/aglyn";
+import { CardDisplay } from "@aglyn/shared-ui-jsx";
+import { ListPagination } from "@aglyn/shared-ui-jsx/components/list-pagination.component";
+import { ListTable } from "@aglyn/shared-ui-jsx/components/list-table.component";
+import { TABLE_ROW_HEIGHT } from "@aglyn/shared-ui-jsx/const/table-pagination";
+import { useUser } from "@aglyn/tenant-feature-instance";
+import { authorizedFetch } from "@aglyn/shared-util-http/authorized-token";
+import { Alert, Chip, MenuItem, Stack, TextField, Typography } from "@mui/material";
+import { useCallback, useEffect, useMemo, useState } from "react";
+/** The server's page size. Fixed, so the reader is not offered a choice. */ const PAGE_SIZE = 25;
+const FILTER_LABELS = {
+    all: 'Everyone this was sent to',
+    opened: 'Opened it',
+    clicked: 'Clicked something'
+};
+const recipientsDocsHelp = pluginDocsHelp('emailCampaigns', {
+    anchor: '#opens--clicks',
+    excerpt: 'The people an email reached, and which of them opened it or clicked ' + 'a link — read from the per-recipient delivery log.'
+});
+/**
+ * WHO, not how many.
+ *
+ * ## Why this is a fetch and not a listen
+ *
+ * Every other card on this page reads Firestore directly. This one cannot:
+ * the per-recipient delivery log lives at `emailDeliveries/{sha256(address)}`
+ * — one platform-level collection holding every site's mail and every
+ * transactional message besides — and the query that narrows it to this
+ * site's campaigns is a collection-group query whose scoping predicate is
+ * part of the query. A security rule cannot require a `where` clause, so
+ * there is no rule that would admit this read and refuse the same read
+ * without the filter. The narrowing happens on the server, behind the same
+ * site role the send path requires.
+ *
+ * ## Why it is its own card
+ *
+ * A separate card is a separate mount, and this is the only read on either
+ * detail page whose cost grows with how much mail there has been. It asks
+ * once on mount and once per page turn — never on a poll — so a reader who
+ * came for the preview and the totals above pays for one page of this and
+ * nothing more.
+ *
+ * ## The cursor, and why "Previous" keeps a stack
+ *
+ * The route pages forward with an opaque cursor, which is the only shape a
+ * Firestore query offers without counting the whole result first. Going back
+ * therefore means remembering where each page started, so the cursors are
+ * kept in a list indexed by page — `null` for the first — rather than
+ * re-walking forward from the beginning.
+ */ export function EmailRecipientsCard(props) {
+    var _cursors_page;
+    const { hostId, screenId, emailId } = props;
+    const { data: user } = useUser();
+    const [filter, setFilter] = useState('all');
+    const [page, setPage] = useState(0);
+    /** Cursor for each page. Index 0 is always `null` — the first page. */ const [cursors, setCursors] = useState([
+        null
+    ]);
+    const [rows, setRows] = useState([]);
+    const [hasMore, setHasMore] = useState(false);
+    const [loading, setLoading] = useState(true);
+    const [failure, setFailure] = useState(null);
+    const [campaignsOmitted, setCampaignsOmitted] = useState(0);
+    const [campaignsRead, setCampaignsRead] = useState(0);
+    const cursor = (_cursors_page = cursors[page]) != null ? _cursors_page : null;
+    useEffect(()=>{
+        if (!user) return undefined;
+        let active = true;
+        setLoading(true);
+        setFailure(null);
+        void (async ()=>{
+            try {
+                var _ref, _ref1, _ref2;
+                const response = await authorizedFetch(user, '/api/campaigns/recipients', {
+                    method: 'POST',
+                    headers: {
+                        'Content-Type': 'application/json'
+                    },
+                    body: JSON.stringify(_extends({
+                        hostId
+                    }, screenId ? {
+                        screenId
+                    } : {}, emailId ? {
+                        emailId
+                    } : {}, {
+                        filter,
+                        cursor
+                    }))
+                });
+                const payload = await response.json().catch(()=>({}));
+                if (!active) return;
+                if (!response.ok) {
+                    var _ref3;
+                    setRows([]);
+                    setHasMore(false);
+                    setFailure(String((_ref3 = payload == null ? void 0 : payload.error) != null ? _ref3 : 'Could not read recipients'));
+                    return;
+                }
+                /*
+         * A read that FAILED is not a campaign nobody opened.
+         *
+         * The route answers 200 with `lookupFailed` for a delivery-log read
+         * that could not run — a missing collection-group index is the likely
+         * one — because the rest of the payload is still true. Rendering that
+         * as an empty table is how a merchant concludes their campaign
+         * reached nobody, which is the one wrong answer this table can give.
+         */ if (payload == null ? void 0 : payload.lookupFailed) {
+                    setRows([]);
+                    setHasMore(false);
+                    setFailure('The delivery log could not be read, so this table is empty for ' + 'a reason that has nothing to do with your campaign. The ' + 'numbers above come from the campaigns themselves and are ' + 'unaffected.');
+                    return;
+                }
+                const nextRows = Array.isArray(payload == null ? void 0 : payload.rows) ? payload.rows : [];
+                setRows(nextRows);
+                setCampaignsOmitted(Number((_ref = payload == null ? void 0 : payload.campaignsOmitted) != null ? _ref : 0));
+                setCampaignsRead(Number((_ref1 = payload == null ? void 0 : payload.campaignsRead) != null ? _ref1 : 0));
+                const nextCursor = (_ref2 = payload == null ? void 0 : payload.cursor) != null ? _ref2 : null;
+                setHasMore(Boolean(nextCursor));
+                if (nextCursor) {
+                    setCursors((existing)=>{
+                        if (existing[page + 1] === nextCursor) return existing;
+                        const next = existing.slice(0, page + 1);
+                        next[page + 1] = nextCursor;
+                        return next;
+                    });
+                }
+            } catch (error) {
+                console.error(error);
+                if (active) {
+                    setRows([]);
+                    setHasMore(false);
+                    setFailure('Could not read recipients');
+                }
+            } finally{
+                if (active) setLoading(false);
+            }
+        })();
+        return ()=>{
+            active = false;
+        };
+    }, [
+        user,
+        hostId,
+        screenId,
+        emailId,
+        filter,
+        cursor,
+        page
+    ]);
+    // A new filter is a new result set, so the cursors collected under the old
+    // one describe positions in a query that no longer exists.
+    const handleFilter = useCallback((next)=>{
+        setFilter(next);
+        setPage(0);
+        setCursors([
+            null
+        ]);
+    }, []);
+    const columns = useMemo(()=>[
+            {
+                field: 'to',
+                headerName: 'Recipient',
+                flex: 1,
+                minWidth: 240,
+                renderCell: ({ row })=>/*#__PURE__*/ _jsxs(Stack, {
+                        spacing: 0.5,
+                        sx: {
+                            py: 1,
+                            minWidth: 0,
+                            wordBreak: 'break-all'
+                        },
+                        children: [
+                            /*#__PURE__*/ _jsx(Typography, {
+                                variant: "body2",
+                                children: row.to
+                            }),
+                            row.clickedLinks.map((link)=>/*#__PURE__*/ _jsx(Typography, {
+                                    variant: "caption",
+                                    color: "text.secondary",
+                                    children: link
+                                }, link))
+                        ]
+                    })
+            },
+            ...emailId ? [] : [
+                {
+                    field: 'subject',
+                    headerName: 'Email',
+                    flex: 1,
+                    minWidth: 180,
+                    valueGetter: (_value, row)=>{
+                        var _row_subject;
+                        return (_row_subject = row.subject) != null ? _row_subject : '—';
+                    }
+                }
+            ],
+            {
+                field: 'status',
+                headerName: 'State',
+                width: 130,
+                renderCell: ({ row })=>/*#__PURE__*/ _jsx(Chip, {
+                        size: "small",
+                        label: row.status
+                    })
+            },
+            {
+                field: 'openCount',
+                headerName: 'Opens',
+                type: 'number',
+                align: 'right',
+                headerAlign: 'right',
+                width: 100,
+                renderCell: ({ row })=>/*#__PURE__*/ _jsx(Typography, {
+                        variant: "body2",
+                        sx: {
+                            fontWeight: 'bold'
+                        },
+                        children: row.openCount.toLocaleString()
+                    })
+            },
+            {
+                field: 'clickCount',
+                headerName: 'Clicks',
+                type: 'number',
+                align: 'right',
+                headerAlign: 'right',
+                width: 100,
+                renderCell: ({ row })=>/*#__PURE__*/ _jsx(Typography, {
+                        variant: "body2",
+                        sx: {
+                            fontWeight: 'bold'
+                        },
+                        children: row.clickCount.toLocaleString()
+                    })
+            },
+            {
+                field: 'lastEventAtMs',
+                headerName: 'Last event',
+                width: 190,
+                renderCell: ({ row })=>row.lastEventAtMs ? new Date(row.lastEventAtMs).toLocaleString() : '—'
+            }
+        ], [
+        emailId
+    ]);
+    return /*#__PURE__*/ _jsx(CardDisplay, {
+        header: 'Recipients',
+        help: recipientsDocsHelp,
+        contentGutterX: true,
+        contentGutterY: true,
+        children: /*#__PURE__*/ _jsxs(Stack, {
+            spacing: 2,
+            children: [
+                /*#__PURE__*/ _jsx(Typography, {
+                    variant: "body2",
+                    color: "text.secondary",
+                    children: (emailId ? 'One row per address this email was sent to, newest first. ' : 'One row per message sent from this template, newest first. ') + 'Opens are counted by a tracking pixel a mail client may block ' + 'or pre-fetch, so an absent open is weaker evidence than a click.'
+                }),
+                /*#__PURE__*/ _jsx(TextField, {
+                    select: true,
+                    size: "small",
+                    label: "Show",
+                    value: filter,
+                    onChange: (event)=>handleFilter(event.target.value),
+                    sx: {
+                        alignSelf: 'flex-start',
+                        minWidth: 260
+                    },
+                    children: Object.keys(FILTER_LABELS).map((key)=>/*#__PURE__*/ _jsx(MenuItem, {
+                            value: key,
+                            children: FILTER_LABELS[key]
+                        }, key))
+                }),
+                failure ? /*#__PURE__*/ _jsx(Alert, {
+                    severity: "warning",
+                    children: failure
+                }) : null,
+                campaignsOmitted ? /*#__PURE__*/ _jsx(Alert, {
+                    severity: "info",
+                    children: 'This template has been used by more emails than one read can ' + `span. These rows cover its ${campaignsRead} most recent ` + `emails; ${campaignsOmitted} older ` + `${campaignsOmitted === 1 ? 'email is' : 'emails are'} ` + 'not included.'
+                }) : null,
+                rows.length === 0 && !loading && !failure ? /*#__PURE__*/ _jsx(Typography, {
+                    variant: "body2",
+                    color: "text.secondary",
+                    children: filter === 'all' ? 'No delivery records have been kept for this yet.' : 'Nobody in the delivery log matches that yet.'
+                }) : /*#__PURE__*/ _jsx(ListTable, {
+                    "aria-label": "Recipients",
+                    rows: rows,
+                    columns: columns,
+                    getRowId: (row)=>row.messageId,
+                    rowHeight: TABLE_ROW_HEIGHT,
+                    // A recipient carries the links they followed beneath the
+                    // address, so a row is as tall as its list of links.
+                    getRowHeight: ()=>'auto',
+                    // One page of a cursor feed, turned by the footer below: the grid
+                    // neither slices it nor filters the page and calls that the log.
+                    hideFooter: true,
+                    disableColumnFilter: true,
+                    quickFilter: false
+                }),
+                /*#__PURE__*/ _jsx(ListPagination, {
+                    page: page,
+                    pageSize: PAGE_SIZE,
+                    rowCount: rows.length,
+                    hasMore: hasMore,
+                    disabled: loading,
+                    onPageChange: setPage
+                }),
+                /*#__PURE__*/ _jsx(Typography, {
+                    variant: "caption",
+                    color: "text.secondary",
+                    children: 'Up to ten distinct destinations are kept per recipient, so a ' + 'reader who clicked more links than that has the rest counted ' + 'but not listed.'
+                })
+            ]
+        })
+    });
+}
+EmailRecipientsCard.displayName = 'EmailRecipientsCard';
+export default EmailRecipientsCard;
+
+//# sourceMappingURL=email-recipients-card.js.map

package/src/lib/components/email-recipients-card.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../libs/plugins/marketing/src/lib/components/email-recipients-card.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2026 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n'use client'\n\nimport { pluginDocsHelp } from '@aglyn/aglyn'\nimport { CardDisplay } from '@aglyn/shared-ui-jsx'\nimport { ListPagination } from '@aglyn/shared-ui-jsx/components/list-pagination.component'\nimport { ListTable } from '@aglyn/shared-ui-jsx/components/list-table.component'\nimport { TABLE_ROW_HEIGHT } from '@aglyn/shared-ui-jsx/const/table-pagination'\nimport { useUser } from '@aglyn/tenant-feature-instance'\nimport { authorizedFetch } from '@aglyn/shared-util-http/authorized-token'\nimport {\n  Alert,\n  Chip,\n  MenuItem,\n  Stack,\n  TextField,\n  Typography,\n} from '@mui/material'\nimport type { GridColDef } from '@mui/x-data-grid'\nimport { useCallback, useEffect, useMemo, useState } from 'react'\n\n/** The server's page size. Fixed, so the reader is not offered a choice. */\nconst PAGE_SIZE = 25\n\n/** Which recipients the table asks for. Matches the route's own vocabulary. */\ntype EngagementFilter = 'all' | 'opened' | 'clicked'\n\nconst FILTER_LABELS: Record<EngagementFilter, string> = {\n  all: 'Everyone this was sent to',\n  opened: 'Opened it',\n  clicked: 'Clicked something',\n}\n\ninterface RecipientRow {\n  messageId: string\n  to: string\n  subject: string | null\n  campaignId: string | null\n  status: string\n  openCount: number\n  clickCount: number\n  clickedLinks: string[]\n  firstSeenAtMs: number\n  lastEventAtMs: number\n}\n\nconst recipientsDocsHelp = pluginDocsHelp('emailCampaigns', {\n  anchor: '#opens--clicks',\n  excerpt:\n    'The people an email reached, and which of them opened it or clicked ' +\n    'a link — read from the per-recipient delivery log.',\n})\n\nexport interface EmailRecipientsCardProps {\n  hostId: string\n  /**\n   * Read every message built from this template.\n   *\n   * Exactly one of `screenId` and `emailId` is passed. The route takes the\n   * SCOPE rather than a list of message ids because a caller who could name\n   * ids could name another site's, and the narrower input is the one that\n   * cannot be got wrong later.\n   */\n  screenId?: string\n  /** Read one message. */\n  emailId?: string\n}\n\n/**\n * WHO, not how many.\n *\n * ## Why this is a fetch and not a listen\n *\n * Every other card on this page reads Firestore directly. This one cannot:\n * the per-recipient delivery log lives at `emailDeliveries/{sha256(address)}`\n * — one platform-level collection holding every site's mail and every\n * transactional message besides — and the query that narrows it to this\n * site's campaigns is a collection-group query whose scoping predicate is\n * part of the query. A security rule cannot require a `where` clause, so\n * there is no rule that would admit this read and refuse the same read\n * without the filter. The narrowing happens on the server, behind the same\n * site role the send path requires.\n *\n * ## Why it is its own card\n *\n * A separate card is a separate mount, and this is the only read on either\n * detail page whose cost grows with how much mail there has been. It asks\n * once on mount and once per page turn — never on a poll — so a reader who\n * came for the preview and the totals above pays for one page of this and\n * nothing more.\n *\n * ## The cursor, and why \"Previous\" keeps a stack\n *\n * The route pages forward with an opaque cursor, which is the only shape a\n * Firestore query offers without counting the whole result first. Going back\n * therefore means remembering where each page started, so the cursors are\n * kept in a list indexed by page — `null` for the first — rather than\n * re-walking forward from the beginning.\n */\nexport function EmailRecipientsCard(props: EmailRecipientsCardProps) {\n  const { hostId, screenId, emailId } = props\n  const { data: user } = useUser()\n\n  const [filter, setFilter] = useState<EngagementFilter>('all')\n  const [page, setPage] = useState(0)\n  /** Cursor for each page. Index 0 is always `null` — the first page. */\n  const [cursors, setCursors] = useState<(string | null)[]>([null])\n  const [rows, setRows] = useState<RecipientRow[]>([])\n  const [hasMore, setHasMore] = useState(false)\n  const [loading, setLoading] = useState(true)\n  const [failure, setFailure] = useState<string | null>(null)\n  const [campaignsOmitted, setCampaignsOmitted] = useState(0)\n  const [campaignsRead, setCampaignsRead] = useState(0)\n\n  const cursor = cursors[page] ?? null\n\n  useEffect(() => {\n    if (!user) return undefined\n    let active = true\n    setLoading(true)\n    setFailure(null)\n    void (async () => {\n      try {\n        const response = await authorizedFetch(\n          user,\n          '/api/campaigns/recipients',\n          {\n            method: 'POST',\n            headers: { 'Content-Type': 'application/json' },\n            body: JSON.stringify({\n              hostId,\n              ...(screenId ? { screenId } : {}),\n              ...(emailId ? { emailId } : {}),\n              filter,\n              cursor,\n            }),\n          },\n        )\n        const payload = await response.json().catch(() => ({}))\n        if (!active) return\n        if (!response.ok) {\n          setRows([])\n          setHasMore(false)\n          setFailure(String(payload?.error ?? 'Could not read recipients'))\n          return\n        }\n        /*\n         * A read that FAILED is not a campaign nobody opened.\n         *\n         * The route answers 200 with `lookupFailed` for a delivery-log read\n         * that could not run — a missing collection-group index is the likely\n         * one — because the rest of the payload is still true. Rendering that\n         * as an empty table is how a merchant concludes their campaign\n         * reached nobody, which is the one wrong answer this table can give.\n         */\n        if (payload?.lookupFailed) {\n          setRows([])\n          setHasMore(false)\n          setFailure(\n            'The delivery log could not be read, so this table is empty for ' +\n              'a reason that has nothing to do with your campaign. The ' +\n              'numbers above come from the campaigns themselves and are ' +\n              'unaffected.',\n          )\n          return\n        }\n        const nextRows: RecipientRow[] = Array.isArray(payload?.rows)\n          ? payload.rows\n          : []\n        setRows(nextRows)\n        setCampaignsOmitted(Number(payload?.campaignsOmitted ?? 0))\n        setCampaignsRead(Number(payload?.campaignsRead ?? 0))\n        const nextCursor: string | null = payload?.cursor ?? null\n        setHasMore(Boolean(nextCursor))\n        if (nextCursor) {\n          setCursors((existing) => {\n            if (existing[page + 1] === nextCursor) return existing\n            const next = existing.slice(0, page + 1)\n            next[page + 1] = nextCursor\n            return next\n          })\n        }\n      } catch (error) {\n        console.error(error)\n        if (active) {\n          setRows([])\n          setHasMore(false)\n          setFailure('Could not read recipients')\n        }\n      } finally {\n        if (active) setLoading(false)\n      }\n    })()\n    return () => {\n      active = false\n    }\n  }, [user, hostId, screenId, emailId, filter, cursor, page])\n\n  // A new filter is a new result set, so the cursors collected under the old\n  // one describe positions in a query that no longer exists.\n  const handleFilter = useCallback((next: EngagementFilter) => {\n    setFilter(next)\n    setPage(0)\n    setCursors([null])\n  }, [])\n\n  const columns = useMemo<GridColDef<RecipientRow>[]>(\n    () => [\n      {\n        field: 'to',\n        headerName: 'Recipient',\n        flex: 1,\n        minWidth: 240,\n        renderCell: ({ row }) => (\n          <Stack spacing={0.5} sx={{ py: 1, minWidth: 0, wordBreak: 'break-all' }}>\n            <Typography variant=\"body2\">{row.to}</Typography>\n            {/*\n             * WHICH links, under the person who followed them. The\n             * per-campaign link rollup counts destinations and names nobody;\n             * this is the other half of the same question, and it is the half\n             * a merchant asks when they want to know who to call.\n             */}\n            {row.clickedLinks.map((link) => (\n              <Typography key={link} variant=\"caption\" color=\"text.secondary\">\n                {link}\n              </Typography>\n            ))}\n          </Stack>\n        ),\n      },\n      ...(emailId\n        ? []\n        : [\n            {\n              field: 'subject',\n              headerName: 'Email',\n              flex: 1,\n              minWidth: 180,\n              valueGetter: (_value: unknown, row: RecipientRow) => row.subject ?? '—',\n            } satisfies GridColDef<RecipientRow>,\n          ]),\n      {\n        field: 'status',\n        headerName: 'State',\n        width: 130,\n        renderCell: ({ row }) => <Chip size=\"small\" label={row.status} />,\n      },\n      {\n        field: 'openCount',\n        headerName: 'Opens',\n        type: 'number',\n        align: 'right',\n        headerAlign: 'right',\n        width: 100,\n        renderCell: ({ row }) => (\n          <Typography variant=\"body2\" sx={{ fontWeight: 'bold' }}>\n            {row.openCount.toLocaleString()}\n          </Typography>\n        ),\n      },\n      {\n        field: 'clickCount',\n        headerName: 'Clicks',\n        type: 'number',\n        align: 'right',\n        headerAlign: 'right',\n        width: 100,\n        renderCell: ({ row }) => (\n          <Typography variant=\"body2\" sx={{ fontWeight: 'bold' }}>\n            {row.clickCount.toLocaleString()}\n          </Typography>\n        ),\n      },\n      {\n        field: 'lastEventAtMs',\n        headerName: 'Last event',\n        width: 190,\n        renderCell: ({ row }) =>\n          row.lastEventAtMs ? new Date(row.lastEventAtMs).toLocaleString() : '—',\n      },\n    ],\n    [emailId],\n  )\n\n  return (\n    <CardDisplay\n      header={'Recipients'}\n      help={recipientsDocsHelp}\n      contentGutterX\n      contentGutterY\n    >\n      <Stack spacing={2}>\n        <Typography variant=\"body2\" color=\"text.secondary\">\n          {(emailId\n            ? 'One row per address this email was sent to, newest first. '\n            : 'One row per message sent from this template, newest first. ') +\n            'Opens are counted by a tracking pixel a mail client may block ' +\n            'or pre-fetch, so an absent open is weaker evidence than a click.'}\n        </Typography>\n\n        <TextField\n          select\n          size=\"small\"\n          label=\"Show\"\n          value={filter}\n          onChange={(event) =>\n            handleFilter(event.target.value as EngagementFilter)\n          }\n          sx={{ alignSelf: 'flex-start', minWidth: 260 }}\n        >\n          {(Object.keys(FILTER_LABELS) as EngagementFilter[]).map((key) => (\n            <MenuItem key={key} value={key}>\n              {FILTER_LABELS[key]}\n            </MenuItem>\n          ))}\n        </TextField>\n\n        {failure ? <Alert severity=\"warning\">{failure}</Alert> : null}\n\n        {campaignsOmitted ? (\n          <Alert severity=\"info\">\n            {'This template has been used by more emails than one read can ' +\n              `span. These rows cover its ${campaignsRead} most recent ` +\n              `emails; ${campaignsOmitted} older ` +\n              `${campaignsOmitted === 1 ? 'email is' : 'emails are'} ` +\n              'not included.'}\n          </Alert>\n        ) : null}\n\n        {rows.length === 0 && !loading && !failure ? (\n          <Typography variant=\"body2\" color=\"text.secondary\">\n            {filter === 'all'\n              ? 'No delivery records have been kept for this yet.'\n              : 'Nobody in the delivery log matches that yet.'}\n          </Typography>\n        ) : (\n          <ListTable\n            aria-label=\"Recipients\"\n            rows={rows}\n            columns={columns}\n            getRowId={(row: RecipientRow) => row.messageId}\n            rowHeight={TABLE_ROW_HEIGHT}\n            // A recipient carries the links they followed beneath the\n            // address, so a row is as tall as its list of links.\n            getRowHeight={() => 'auto'}\n            // One page of a cursor feed, turned by the footer below: the grid\n            // neither slices it nor filters the page and calls that the log.\n            hideFooter\n            disableColumnFilter\n            quickFilter={false}\n          />\n        )}\n\n        {/*\n         * A cursor feed knows whether ANOTHER page exists and never how many\n         * rows there are in total, so `hasMore` is passed and `count` is not\n         * — the control renders \"1–25 of more than 25\" rather than inventing\n         * a total nobody paid to count.\n         */}\n        <ListPagination\n          page={page}\n          pageSize={PAGE_SIZE}\n          rowCount={rows.length}\n          hasMore={hasMore}\n          disabled={loading}\n          onPageChange={setPage}\n        />\n\n        <Typography variant=\"caption\" color=\"text.secondary\">\n          {'Up to ten distinct destinations are kept per recipient, so a ' +\n            'reader who clicked more links than that has the rest counted ' +\n            'but not listed.'}\n        </Typography>\n      </Stack>\n    </CardDisplay>\n  )\n}\nEmailRecipientsCard.displayName = 'EmailRecipientsCard'\n\nexport default EmailRecipientsCard\n"],"names":["pluginDocsHelp","CardDisplay","ListPagination","ListTable","TABLE_ROW_HEIGHT","useUser","authorizedFetch","Alert","Chip","MenuItem","Stack","TextField","Typography","useCallback","useEffect","useMemo","useState","PAGE_SIZE","FILTER_LABELS","all","opened","clicked","recipientsDocsHelp","anchor","excerpt","EmailRecipientsCard","props","cursors","hostId","screenId","emailId","data","user","filter","setFilter","page","setPage","setCursors","rows","setRows","hasMore","setHasMore","loading","setLoading","failure","setFailure","campaignsOmitted","setCampaignsOmitted","campaignsRead","setCampaignsRead","cursor","undefined","active","response","method","headers","body","JSON","stringify","payload","json","catch","ok","String","error","lookupFailed","nextRows","Array","isArray","Number","nextCursor","Boolean","existing","next","slice","console","handleFilter","columns","field","headerName","flex","minWidth","renderCell","row","spacing","sx","py","wordBreak","variant","to","clickedLinks","map","link","color","valueGetter","_value","subject","width","size","label","status","type","align","headerAlign","fontWeight","openCount","toLocaleString","clickCount","lastEventAtMs","Date","header","help","contentGutterX","contentGutterY","select","value","onChange","event","target","alignSelf","Object","keys","key","severity","length","aria-label","getRowId","messageId","rowHeight","getRowHeight","hideFooter","disableColumnFilter","quickFilter","pageSize","rowCount","disabled","onPageChange","displayName"],"mappings":"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"}

package/src/lib/components/emails-list-card.d.ts

@@ -0,0 +1,36 @@
+export interface EmailsListCardProps {
+    hostId: string;
+    /** The emails hub URL, so a row can link to the message's own page. */
+    basePath: string;
+}
+/**
+ * EVERY MESSAGE, AS AGAINST EVERY CAMPAIGN.
+ *
+ * A campaign groups messages; this is the messages. The two are different
+ * questions — "how did the spring promotion do" and "what went out on the
+ * 14th, and to whom" — and they were previously the same list because a
+ * campaign document WAS a single send.
+ *
+ * ## Ordered in the browser, deliberately
+ *
+ * No SEND date is on every message: a sent one carries `sentAt` and a
+ * scheduled one carries `sendAtMs`, written by two different branches of the
+ * send path, and a draft carries neither — so `orderBy` on either would not
+ * mis-sort this list, it would DROP half of it. `collectionCeiling` reads a
+ * bounded window in document-id order and probes one past the ceiling, so the
+ * rows are sorted here and the reader is told when there are more.
+ *
+ * Every writer stamps a `createdAtMs`, which is the field this list could be
+ * ordered on in Firestore. Moving it there is a query change with the same
+ * hazard as the two above — `orderBy` drops a document missing the field —
+ * so it needs the corpus proven to carry one, not just the writers.
+ *
+ * The page is therefore a SLICE of a window this card already holds, not a
+ * query: paging an id-ordered walk and re-sorting each page by date would run
+ * in one order within a page and another across them.
+ */
+export declare function EmailsListCard(props: EmailsListCardProps): import("react").JSX.Element;
+export declare namespace EmailsListCard {
+    var displayName: string;
+}
+export default EmailsListCard;