@aglyn/plugins-marketing 1.0.0-beta.232 → 1.0.0-beta.233

package/src/lib/components/campaign-members-section.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../libs/plugins/marketing/src/lib/components/campaign-members-section.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 {\n  pluginRecordHref,\n  pluginRecordListHref,\n} from '@aglyn/aglyn/plugin-manager/plugin-record-routes'\nimport { AppLink } from '@aglyn/shared-ui-jsx'\nimport {\n  Figure,\n  Section,\n} from '@aglyn/shared-ui-jsx/components/measured-figures.component'\nimport { ListPagination } from '@aglyn/shared-ui-jsx/components/list-pagination.component'\nimport ListQueryNotices, {\n  listQueryRefusals,\n} from '@aglyn/shared-ui-jsx/components/list-query-notices.component'\nimport { ListTable } from '@aglyn/shared-ui-jsx/components/list-table.component'\nimport { useListGridFilter } from '@aglyn/shared-ui-jsx/hooks/use-list-grid-filter'\nimport { TABLE_ROW_HEIGHT } from '@aglyn/shared-ui-jsx/const/table-pagination'\nimport { useListQuery } from '@aglyn/tenant-feature-instance/hooks/use-list-query'\nimport {\n  buildRoute,\n  readContainerIds,\n  Route,\n  type FormStats,\n  type FormStatsTotals,\n} from '@aglyn/aglyn'\nimport { Alert, Stack, Typography } from '@mui/material'\nimport type { GridColDef } from '@mui/x-data-grid'\nimport {\n  collection,\n  documentId,\n  limit,\n  orderBy,\n  query,\n  where,\n} from 'firebase/firestore'\nimport { useCallback, useMemo } from 'react'\nimport {\n  useConsoleHostRoute,\n  useFirestore,\n  useFirestoreCollection,\n} from '@aglyn/tenant-feature-instance'\nimport {\n  campaignFormsRollup,\n  campaignFormTotals,\n  campaignPeriodRange,\n  isWindowedRange,\n  type CampaignFormsRollup,\n} from '../model/campaign-membership-figures'\nimport { CAMPAIGN_KIND, CAMPAIGN_MEMBERSHIP_FIELD } from '../model/campaign-kind'\nimport {\n  CAMPAIGN_MEMBERS_QUERY,\n  CAMPAIGN_MEMBERS_SEARCH_NOTICE,\n  campaignMembersBase,\n  campaignMembersSearchClause,\n  type CampaignMemberCollection,\n} from '../model/campaign-members-query'\n\n/**\n * How many forms the holdings figures add up.\n *\n * The tables page through every member; the figures are a sum, read from a\n * window of their own. One document past it is asked for, so \"the figures\n * cover some of the forms\" is a fact rather than a guess — the same probe\n * the emails figures on this page make.\n */\nconst FIGURES_CEILING = 25\n\nexport interface CampaignMembersSectionProps {\n  hostId: string\n  /**\n   * The site's name, when the section is one of several — the org hub draws\n   * one per site the campaign is placed on, and each heading says whose\n   * forms and screens it lists.\n   */\n  siteName?: string\n  campaignId: string\n  /** The campaign's first day, when it has one. */\n  startAtMs?: number | null\n  /** The campaign's last day, when it has one. */\n  endAtMs?: number | null\n}\n\n/** One row, whatever collection it came out of. */\ninterface MemberRow {\n  id: string\n  name: string\n  href: string | null\n  /** Why there is no link, when there is none. */\n  hrefReason?: string\n  /** The member's own counters, for a kind that carries them. */\n  totals?: FormStatsTotals\n  /** Campaigns the member is filed under, this one included. */\n  campaigns?: number\n}\n\n/**\n * WHAT ELSE IS IN THIS CAMPAIGN — the landing pages and forms assigned to it,\n * and what those forms have collected.\n *\n * ## Declared, and therefore different from every section above it\n *\n * The conversions, revenue and destinations sections are EVIDENCE: they join\n * on the campaign's send ids and report what visitors did BECAUSE of this\n * campaign's mail. This one is a statement the merchant made — a screen or a\n * form carries this campaign's id in {@link CAMPAIGN_MEMBERSHIP_FIELD} — plus\n * the counters those records carry on their own documents.\n *\n * The distinction survives into the wording, because the arithmetic will not\n * enforce it. A form's submissions are the form's; filing the form under a\n * campaign does not make them the campaign's, and a heading that said\n * \"this campaign produced 40 leads\" over a number meaning \"the forms filed\n * here have 40 leads\" would be a worse page than one showing nothing. So the\n * figures are labeled as what the forms HOLD, they sit in their own block\n * under their own disclaimer, and no total on this page adds them to an\n * attributed one.\n *\n * ## Three ways the forms' counters could mislead, each answered\n *\n *  1. **They are lifetime.** `stats.submissions` has counted since the form\n *     existed, including every submission from before anybody filed it here.\n *     Where the campaign carries dates, the figures are summed from the\n *     monthly `stats.periods` series over those months instead, and the\n *     caption says which of the two a reader is looking at. Months are whole,\n *     so a campaign starting mid-month includes that month entire — stated,\n *     not rounded away.\n *  2. **A form can be in twenty campaigns.** `campaignIds` is an array, so\n *     the same submissions count toward every campaign the form is filed\n *     under. Rows say so and the total refuses to present itself as\n *     exclusive.\n *  3. **A counter nobody wrote is not a zero.** `stats.leads` is counted\n *     only for a form whose `routing.lead` is set, and `stats.views` only by\n *     the analytics beacon. Both reach the shared `Figure`, which draws an em\n *     dash and the words \"not recorded\" rather than a confident 0.\n *\n * ## Screens carry no counter, and this section will not invent one\n *\n * A form's counters ride on the form document, so the query this section\n * already makes pays for them. A screen's traffic does not: it is one\n * document per screen per day in `hosts/{hostId}/screenAnalytics`, with no\n * lifetime total anywhere, so a views column here would cost a range read\n * across screens times days on every open of this page — and the display of\n * those figures is a paid entitlement this section does not resolve. The\n * screens block names the absence and links to the surface that does measure\n * it, which is a smaller lie than a number nobody can stand behind.\n *\n * ## The join is `array-contains`, on the member's own document\n *\n * A campaign holds no member list. Each record names the campaigns it is in,\n * which is what makes deleting one record leave nothing behind and what lets\n * a record's own page draw its campaigns without a query. The query here is\n * the other direction of the same field.\n *\n * ## Each kind is a table paged by its own query (AGL-3321)\n *\n * The screens and the forms are each a list a reader pages and searches, so\n * the membership, the soft delete and the search word are all on the\n * table's Firestore query (`campaign-members-query.ts`), and every member is\n * reachable a page at a time. Nothing is matched over rows already read: a\n * deleted screen is left out by `deletedAt == null`, which every screen\n * stores, and the search is a prefix range on the stored `nameLower`.\n *\n * Unsearched, a table walks the document name, which every record has — a\n * form carries `updatedAt` only if some writer stamped one, and ordering on a\n * field a writer may omit does not mis-sort the list, it drops rows from it.\n *\n * The forms' HOLDINGS are a sum, not a list, so they read a window of their\n * own — the first {@link FIGURES_CEILING} forms by document name — and say\n * when the campaign holds more, as the mail figures on this page do.\n *\n * ## Contacts are named here and NOT listed, and the reason is a query limit\n *\n * A contact is org-scoped and shared between the sites that captured it, so\n * every client read of the collection has to carry\n * `visibleTo array-contains-any` — that is what makes the read provable\n * per-document under the rules. Firestore permits ONE array clause per query,\n * and that is it: there is no client query that filters contacts by campaign\n * as well, so there is no pre-filtered address to link to either. The link\n * offered goes to the Contacts page and says it arrives unfiltered; the\n * assignment is real, is set from the contact's own drawer, and a count of it\n * would cost a scan of the collection the customer is billed on.\n */\nexport function CampaignMembersSection(props: CampaignMembersSectionProps) {\n  const { hostId, siteName, campaignId, startAtMs, endAtMs } = props\n  const firestore = useFirestore()\n  const { orgSlug, subdomain: host } = useConsoleHostRoute(hostId)\n\n  /*\n   * The window the holdings figures add up: the forms filed here, by\n   * document name, one past the ceiling as the probe. A form has no soft\n   * delete — it is deleted outright — so every document this returns is a\n   * form in use or a retired one, and both hold what they collected.\n   */\n  const { data: figureDocs } = useFirestoreCollection<Record<string, unknown>>(\n    () =>\n      query(\n        collection(firestore, 'hosts', hostId, 'forms'),\n        where(CAMPAIGN_MEMBERSHIP_FIELD, 'array-contains', campaignId),\n        orderBy(documentId()),\n        limit(FIGURES_CEILING + 1),\n      ),\n    [firestore, hostId, campaignId],\n    { idField: '$id' },\n  )\n\n  /*\n   * The months the campaign's dates cover, or nothing where it has neither.\n   * Derived from props the detail card already holds, so asking what a\n   * figure covers costs no read.\n   */\n  const range = useMemo(\n    () => campaignPeriodRange({ startAtMs, endAtMs }),\n    [startAtMs, endAtMs],\n  )\n  const windowed = isWindowedRange(range)\n\n  const screenRow = useCallback(\n    (row: Record<string, unknown>): MemberRow => {\n      const id = String(row['$id'])\n      const versionId = String(row['versionId'] ?? '')\n      return {\n        id,\n        name: String(row['displayName'] ?? id),\n        /*\n         * A screen with no saved version has no detail address to build —\n         * the route carries a version — so it stays plain text rather than\n         * linking somewhere that 404s. The screens list applies the same\n         * guard to its own name column.\n         */\n        href:\n          versionId && orgSlug && host\n            ? buildRoute(Route.SCREEN_DETAILS, {\n                orgSlug,\n                host,\n                screenId: id,\n                versionId,\n              })\n            : null,\n        hrefReason: versionId\n          ? 'This site’s console URL has not resolved yet'\n          : 'This page has no saved version yet',\n        campaigns: readContainerIds(row, CAMPAIGN_KIND).length,\n      }\n    },\n    [orgSlug, host],\n  )\n\n  /*\n   * The counters ride on the form documents, so each row's figures are paid\n   * for by the read that lists it.\n   */\n  const formRow = useCallback(\n    (row: Record<string, unknown>): MemberRow => {\n      const id = String(row['$id'])\n      return {\n        id,\n        name: String(row['displayName'] ?? id),\n        href: orgSlug && host ? pluginRecordHref('form', { orgSlug, host }, id) : null,\n        hrefReason: 'This site’s console URL has not resolved yet',\n        totals: campaignFormTotals(row['stats'] as FormStats | undefined, range),\n        campaigns: readContainerIds(row, CAMPAIGN_KIND).length,\n      }\n    },\n    [orgSlug, host, range],\n  )\n\n  const figureForms = useMemo(\n    () => (figureDocs ?? []).slice(0, FIGURES_CEILING).map(formRow),\n    [figureDocs, formRow],\n  )\n  const figuresTruncated = (figureDocs ?? []).length > FIGURES_CEILING\n  const rollup = useMemo(\n    () =>\n      campaignFormsRollup(\n        figureForms.map((row) => ({\n          totals: row.totals as FormStatsTotals,\n          campaigns: row.campaigns ?? 1,\n        })),\n      ),\n    [figureForms],\n  )\n\n  const analyticsHref =\n    orgSlug && host\n      ? buildRoute(Route.HOST_ANALYTICS, { orgSlug, host })\n      : null\n  const contactsHref =\n    orgSlug && host ? pluginRecordListHref('contact', { orgSlug, host }) : null\n\n  return (\n    <Section\n      title={\n        siteName\n          ? `Assigned to this campaign on ${siteName}`\n          : 'Assigned to this campaign'\n      }\n    >\n      <Stack spacing={2}>\n        <Typography variant=\"body2\" color=\"text.secondary\">\n          {'The pages and forms somebody put in this campaign. Assignment is ' +\n            'a grouping — what the campaign was credited with is measured ' +\n            'above, from the links its emails carried.'}\n        </Typography>\n        <MemberTable\n          heading=\"Pages\"\n          noun=\"page\"\n          collectionName=\"screens\"\n          hostId={hostId}\n          campaignId={campaignId}\n          toRow={screenRow}\n        />\n        {/*\n          The absence, named where a reader would look for the number.\n\n          A screen's traffic is not on the screen document — it is a day doc\n          per screen in `screenAnalytics` — so a views column here would be a\n          read across screens times days on every open, for figures whose\n          display is a paid entitlement this section does not resolve. The\n          page that does both is linked instead.\n         */}\n        <Typography variant=\"caption\" color=\"text.secondary\">\n          {'Page views are not shown here. A page keeps no running total ' +\n            'on its own record — traffic is stored a day at a time — so ' +\n            'counting it would be a fresh read of the site’s history every ' +\n            'time this view opens. '}\n          {analyticsHref ? (\n            <AppLink href={analyticsHref}>\n              {'The site’s analytics measures it by page.'}\n            </AppLink>\n          ) : (\n            'The site’s analytics view measures it by page.'\n          )}\n        </Typography>\n        <MemberTable\n          heading=\"Forms\"\n          noun=\"form\"\n          collectionName=\"forms\"\n          hostId={hostId}\n          campaignId={campaignId}\n          toRow={formRow}\n          figures\n        />\n        {/*\n          THE MEMBERSHIP TOTAL, fenced off from the attributed ones above.\n\n          Same `Figure` primitive as the mail rollup, deliberately different\n          words: it says what the forms HOLD, and the caption beneath refuses\n          the reading a merchant will reach for first.\n         */}\n        {figureForms.length ? (\n          <FormsHoldings\n            rollup={rollup}\n            windowed={windowed}\n            from={range.from ?? null}\n            to={range.to ?? null}\n            truncated={figuresTruncated}\n          />\n        ) : null}\n        {/*\n          The people, named rather than omitted.\n\n          A contact CAN be filed under a campaign and this page cannot list\n          them — see the module comment for the query rule that decides it.\n          Leaving the heading out entirely would read as \"contacts cannot be\n          assigned\", which is the one thing it does not mean.\n         */}\n        <Stack spacing={0.5}>\n          <Typography variant=\"overline\" color=\"text.secondary\">\n            {'Contacts'}\n          </Typography>\n          <Typography variant=\"body2\" color=\"text.secondary\">\n            {'Contacts are filed under a campaign from the contact’s own ' +\n              'panel on the Contacts page. They are not listed or counted ' +\n              'here: a contact belongs to the organization rather than to ' +\n              'this site, so the query that reads them is already spending ' +\n              'its one array filter on which sites may see the person. '}\n            {contactsHref ? (\n              <AppLink href={contactsHref}>{'Open Contacts'}</AppLink>\n            ) : null}\n            {contactsHref\n              ? ' — it opens unfiltered, because that same rule leaves no ' +\n                'campaign filter for the address to carry.'\n              : ''}\n          </Typography>\n        </Stack>\n      </Stack>\n    </Section>\n  )\n}\n\n/**\n * What the campaign's forms have collected — and what that is NOT.\n *\n * Two sentences do the whole job of keeping this apart from the attributed\n * figures, and both are load-bearing:\n *\n *  - The first refuses causation outright. A merchant reading a number under\n *    a campaign's heading will assume the campaign caused it unless told\n *    otherwise in the same breath.\n *  - The second says which months the number covers. A lifetime total under a\n *    campaign that ran for six weeks is the same lie one step quieter.\n *\n * `shared` is stated as a count rather than folded into the arithmetic. There\n * is no honest way to divide a submission between two campaigns a form is\n * filed under, so the total is left whole and the overlap is disclosed.\n */\nfunction FormsHoldings(props: {\n  rollup: CampaignFormsRollup\n  windowed: boolean\n  from: string | null\n  to: string | null\n  /** The campaign holds more forms than the figures add up. */\n  truncated: boolean\n}) {\n  const { rollup, windowed, from, to, truncated } = props\n  const note = (recorded: number) =>\n    recorded < rollup.members\n      ? `across ${recorded} of ${rollup.members} forms`\n      : `across ${rollup.members} form${rollup.members === 1 ? '' : 's'}`\n  const span = windowed\n    ? `the campaign’s months (${from ?? 'the first month recorded'} to ${\n        to ?? 'now'\n      })`\n    : 'each form’s whole history'\n  return (\n    <Stack spacing={1}>\n      <Typography variant=\"overline\" color=\"text.secondary\">\n        {'What these forms hold'}\n      </Typography>\n      <Stack useFlexGap direction=\"row\" spacing={3} sx={{ flexWrap: 'wrap' }}>\n        <Figure\n          label=\"Views\"\n          value={rollup.views.value}\n          note={note(rollup.views.recorded)}\n        />\n        <Figure\n          label=\"Started\"\n          value={rollup.starts.value}\n          note={note(rollup.starts.recorded)}\n        />\n        <Figure\n          label=\"Submissions\"\n          value={rollup.submissions.value}\n          note={note(rollup.submissions.recorded)}\n        />\n        <Figure\n          label=\"Leads\"\n          value={rollup.leads.value}\n          note={note(rollup.leads.recorded)}\n        />\n      </Stack>\n      <Typography variant=\"caption\" color=\"text.secondary\">\n        {'These are the forms’ own counters, not this campaign’s results. ' +\n          'A submission is counted here because somebody filed the form ' +\n          'under this campaign, whether or not this campaign’s mail sent ' +\n          `the visitor. Counted over ${span}.`}\n      </Typography>\n      {windowed ? (\n        <Typography variant=\"caption\" color=\"text.secondary\">\n          {'Whole calendar months: a campaign that started or ended mid-' +\n            'month takes that month entire, and a form counting nothing in ' +\n            'those months adds nothing here even where its lifetime total ' +\n            'is large.'}\n        </Typography>\n      ) : (\n        <Typography variant=\"caption\" color=\"text.secondary\">\n          {'This campaign has no dates, so nothing narrows the figures to ' +\n            'it. They are lifetime totals and include everything from ' +\n            'before the forms were put in this campaign. Give the campaign ' +\n            'a start and an end to count only its months.'}\n        </Typography>\n      )}\n      {truncated ? (\n        <Alert severity=\"info\">\n          {`These figures add up the first ${FIGURES_CEILING} forms in this ` +\n            'campaign, in document order. It holds more; the table above ' +\n            'lists every one of them.'}\n        </Alert>\n      ) : null}\n      {rollup.shared ? (\n        <Typography variant=\"caption\" color=\"text.secondary\">\n          {`${rollup.shared} of these ${rollup.members} forms ${\n            rollup.shared === 1 ? 'is' : 'are'\n          } filed under another campaign too, so the same submissions are ` +\n            'counted there as well. This total is not exclusive to this ' +\n            'campaign.'}\n        </Typography>\n      ) : null}\n    </Stack>\n  )\n}\nFormsHoldings.displayName = 'FormsHoldings'\n\n/** A counter as a cell: an em dash where nothing was recorded, never a zero. */\nfunction statCell(value: number | null | undefined) {\n  return value === null || value === undefined ? '—' : value.toLocaleString()\n}\n\n/** The counters a form carries on its own document, in the order they are read. */\nconst MEMBER_FIGURES = [\n  ['views', 'Views'],\n  ['starts', 'Started'],\n  ['submissions', 'Submissions'],\n  ['leads', 'Leads'],\n] as const\n\n/** How the search reads on a notice: the box, not a column. */\nconst MEMBER_SEARCH_HEADERS: Readonly<Record<string, string>> = {\n  name: 'Search',\n}\n\n/**\n * One kind's members, as a record list in the shared grid, paged by its own\n * query (AGL-3321).\n *\n * The membership, the soft delete and the search word are predicates on the\n * query (`campaign-members-query.ts`); the grid neither filters nor sorts\n * the page it is handed. The search box is the grid's quick filter, turned\n * into \"name starts with\" because the membership holds the query's one\n * array clause; the Filters panel is not offered, because every column\n * beside it would need an index of its own for a list this size.\n *\n * `figures` adds the counter columns for a kind that carries them on its own\n * document. It is a prop rather than two lists because the row grammar — the\n * name cell, the reason a member has no link, the footer — is the part that\n * has to stay identical between screens and forms.\n */\nfunction MemberTable(props: {\n  heading: string\n  noun: string\n  collectionName: CampaignMemberCollection\n  hostId: string\n  campaignId: string\n  toRow: (row: Record<string, unknown>) => MemberRow\n  figures?: boolean\n}) {\n  const { heading, noun, collectionName, hostId, campaignId, toRow, figures } =\n    props\n  const firestore = useFirestore()\n  const gridFilter = useListGridFilter({})\n  const search = campaignMembersSearchClause(gridFilter.searchWords)\n  const page = useListQuery<Record<string, unknown>>({\n    collection: collection(firestore, 'hosts', hostId, collectionName),\n    declaration: CAMPAIGN_MEMBERS_QUERY,\n    request: {\n      clauses: search ? [search] : [],\n      base: campaignMembersBase(collectionName, campaignId),\n    },\n    deps: [firestore, hostId, collectionName, campaignId],\n    idField: '$id',\n  })\n  const rows = useMemo(() => page.rows.map(toRow), [page.rows, toRow])\n  // Nothing typed and nothing on the first page: the campaign holds none,\n  // which is said in words rather than as an empty grid.\n  const none = !search && page.page === 0 && rows.length === 0\n  const columns = useMemo<GridColDef<MemberRow>[]>(\n    () => [\n      {\n        field: 'name',\n        headerName: 'Name',\n        flex: 1,\n        minWidth: 240,\n        renderCell: ({ row }) => (\n          <Stack sx={{ py: 1, minWidth: 0 }}>\n            {row.href ? (\n              <AppLink href={row.href}>{row.name}</AppLink>\n            ) : (\n              <>\n                <Typography variant=\"body2\">{row.name}</Typography>\n                <Typography variant=\"caption\" color=\"text.secondary\">\n                  {row.hrefReason}\n                </Typography>\n              </>\n            )}\n            {/*\n              The overlap, on the row that causes it. A reader comparing two\n              campaigns has to be able to see which rows they have in common\n              without opening either.\n             */}\n            {(row.campaigns ?? 1) > 1 ? (\n              <Typography variant=\"caption\" color=\"text.secondary\">\n                {`Also in ${(row.campaigns ?? 1) - 1} other campaign${\n                  (row.campaigns ?? 1) - 1 === 1 ? '' : 's'\n                }`}\n              </Typography>\n            ) : null}\n          </Stack>\n        ),\n      },\n      ...(figures\n        ? MEMBER_FIGURES.map(\n            ([figure, headerName]): GridColDef<MemberRow> => ({\n              field: figure,\n              headerName,\n              type: 'number',\n              align: 'right',\n              headerAlign: 'right',\n              width: 120,\n              valueGetter: (_value, row) => row.totals?.[figure] ?? null,\n              renderCell: ({ row }) => statCell(row.totals?.[figure]),\n            }),\n          )\n        : []),\n    ],\n    [figures],\n  )\n  return (\n    <Stack spacing={0.5}>\n      <Typography variant=\"overline\" color=\"text.secondary\">\n        {heading}\n      </Typography>\n      {none ? (\n        <Typography variant=\"body2\" color=\"text.secondary\">\n          {page.status === 'loading'\n            ? `Reading this campaign’s ${noun}s…`\n            : `No ${noun} is in this campaign. Open a ${noun} and pick this ` +\n              'campaign on its own page to put it in one.'}\n        </Typography>\n      ) : (\n        <>\n          <ListQueryNotices\n            refused={listQueryRefusals(page.plan.refused, {\n              fields: CAMPAIGN_MEMBERS_QUERY.fields,\n              headers: MEMBER_SEARCH_HEADERS,\n            })}\n            notices={\n              search\n                ? [CAMPAIGN_MEMBERS_SEARCH_NOTICE, ...page.plan.notices]\n                : page.plan.notices\n            }\n          />\n          <ListTable\n            aria-label={heading}\n            rows={rows}\n            columns={columns}\n            getRowId={(row: MemberRow) => row.id}\n            rowHeight={TABLE_ROW_HEIGHT}\n            // A member's name carries why it has no link, and the other\n            // campaigns it is in, beneath it.\n            getRowHeight={() => 'auto'}\n            loading={page.status === 'loading'}\n            filterMode=\"server\"\n            filterModel={gridFilter.filterModel}\n            onFilterModelChange={gridFilter.onFilterModelChange}\n            quickFilter\n            disableColumnFilter\n            disableColumnSorting\n            hideFooter\n            noRowsLabel={`No ${noun} in this campaign starts with that`}\n          />\n          <ListPagination\n            page={page.page}\n            pageSize={page.pageSize}\n            rowCount={rows.length}\n            hasMore={page.hasMore}\n            onPageChange={page.setPage}\n            onPageSizeChange={page.setPageSize}\n          />\n        </>\n      )}\n    </Stack>\n  )\n}\n\nCampaignMembersSection.displayName = 'CampaignMembersSection'\n\nexport default CampaignMembersSection\n"],"names":["pluginRecordHref","pluginRecordListHref","AppLink","Figure","Section","ListPagination","ListQueryNotices","listQueryRefusals","ListTable","useListGridFilter","TABLE_ROW_HEIGHT","useListQuery","buildRoute","readContainerIds","Route","Alert","Stack","Typography","collection","documentId","limit","orderBy","query","where","useCallback","useMemo","useConsoleHostRoute","useFirestore","useFirestoreCollection","campaignFormsRollup","campaignFormTotals","campaignPeriodRange","isWindowedRange","CAMPAIGN_KIND","CAMPAIGN_MEMBERSHIP_FIELD","CAMPAIGN_MEMBERS_QUERY","CAMPAIGN_MEMBERS_SEARCH_NOTICE","campaignMembersBase","campaignMembersSearchClause","FIGURES_CEILING","CampaignMembersSection","props","range","hostId","siteName","campaignId","startAtMs","endAtMs","firestore","orgSlug","subdomain","host","data","figureDocs","idField","windowed","screenRow","row","id","String","versionId","name","href","SCREEN_DETAILS","screenId","hrefReason","campaigns","length","formRow","totals","figureForms","slice","map","figuresTruncated","rollup","analyticsHref","HOST_ANALYTICS","contactsHref","title","spacing","variant","color","MemberTable","heading","noun","collectionName","toRow","figures","FormsHoldings","from","to","truncated","note","recorded","members","span","useFlexGap","direction","sx","flexWrap","label","value","views","starts","submissions","leads","severity","shared","displayName","statCell","undefined","toLocaleString","MEMBER_FIGURES","MEMBER_SEARCH_HEADERS","gridFilter","search","searchWords","page","declaration","request","clauses","base","deps","rows","none","columns","field","headerName","flex","minWidth","renderCell","py","figure","type","align","headerAlign","width","valueGetter","_value","status","refused","plan","fields","headers","notices","aria-label","getRowId","rowHeight","getRowHeight","loading","filterMode","filterModel","onFilterModelChange","quickFilter","disableColumnFilter","disableColumnSorting","hideFooter","noRowsLabel","pageSize","rowCount","hasMore","onPageChange","setPage","onPageSizeChange","setPageSize"],"mappings":"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"}
+{"version":3,"sources":["../../../../../../../libs/plugins/marketing/src/lib/components/campaign-members-section.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 {\n  pluginRecordHref,\n  pluginRecordListHref,\n} from '@aglyn/aglyn/plugin-manager/plugin-record-routes'\nimport { AppLink } from '@aglyn/shared-ui-jsx'\nimport {\n  Figure,\n  Section,\n} from '@aglyn/shared-ui-jsx/components/measured-figures.component'\nimport { ListPagination } from '@aglyn/shared-ui-jsx/components/list-pagination.component'\nimport ListQueryNotices, {\n  listQueryRefusals,\n} from '@aglyn/shared-ui-jsx/components/list-query-notices.component'\nimport { ListTable } from '@aglyn/shared-ui-jsx/components/list-table.component'\nimport { useListGridFilter } from '@aglyn/shared-ui-jsx/hooks/use-list-grid-filter'\nimport { useListColumnSort } from '@aglyn/shared-ui-jsx/hooks/use-list-column-sort'\nimport type { ListQuerySort } from '@aglyn/shared-ui-jsx/const/list-query-plan'\nimport { TABLE_ROW_HEIGHT } from '@aglyn/shared-ui-jsx/const/table-pagination'\nimport { useListQuery } from '@aglyn/tenant-feature-instance/hooks/use-list-query'\nimport {\n  buildRoute,\n  readContainerIds,\n  Route,\n  type FormStats,\n  type FormStatsTotals,\n} from '@aglyn/aglyn'\nimport { Alert, Stack, Typography } from '@mui/material'\nimport type { GridColDef } from '@mui/x-data-grid'\nimport {\n  collection,\n  documentId,\n  limit,\n  orderBy,\n  query,\n  where,\n} from 'firebase/firestore'\nimport { useCallback, useMemo, useState } from 'react'\nimport {\n  useConsoleHostRoute,\n  useFirestore,\n  useFirestoreCollection,\n} from '@aglyn/tenant-feature-instance'\nimport {\n  campaignFormsRollup,\n  campaignFormTotals,\n  campaignPeriodRange,\n  isWindowedRange,\n  type CampaignFormsRollup,\n} from '../model/campaign-membership-figures'\nimport { CAMPAIGN_KIND, CAMPAIGN_MEMBERSHIP_FIELD } from '../model/campaign-kind'\nimport {\n  CAMPAIGN_MEMBERS_QUERY,\n  CAMPAIGN_MEMBERS_SEARCH_NOTICE,\n  campaignMembersBase,\n  campaignMembersSearchClause,\n  type CampaignMemberCollection,\n} from '../model/campaign-members-query'\n\n/**\n * How many forms the holdings figures add up.\n *\n * The tables page through every member; the figures are a sum, read from a\n * window of their own. One document past it is asked for, so \"the figures\n * cover some of the forms\" is a fact rather than a guess — the same probe\n * the emails figures on this page make.\n */\nconst FIGURES_CEILING = 25\n\nexport interface CampaignMembersSectionProps {\n  hostId: string\n  /**\n   * The site's name, when the section is one of several — the org hub draws\n   * one per site the campaign is placed on, and each heading says whose\n   * forms and screens it lists.\n   */\n  siteName?: string\n  campaignId: string\n  /** The campaign's first day, when it has one. */\n  startAtMs?: number | null\n  /** The campaign's last day, when it has one. */\n  endAtMs?: number | null\n}\n\n/** One row, whatever collection it came out of. */\ninterface MemberRow {\n  id: string\n  name: string\n  href: string | null\n  /** Why there is no link, when there is none. */\n  hrefReason?: string\n  /** The member's own counters, for a kind that carries them. */\n  totals?: FormStatsTotals\n  /** Campaigns the member is filed under, this one included. */\n  campaigns?: number\n}\n\n/**\n * WHAT ELSE IS IN THIS CAMPAIGN — the landing pages and forms assigned to it,\n * and what those forms have collected.\n *\n * ## Declared, and therefore different from every section above it\n *\n * The conversions, revenue and destinations sections are EVIDENCE: they join\n * on the campaign's send ids and report what visitors did BECAUSE of this\n * campaign's mail. This one is a statement the merchant made — a screen or a\n * form carries this campaign's id in {@link CAMPAIGN_MEMBERSHIP_FIELD} — plus\n * the counters those records carry on their own documents.\n *\n * The distinction survives into the wording, because the arithmetic will not\n * enforce it. A form's submissions are the form's; filing the form under a\n * campaign does not make them the campaign's, and a heading that said\n * \"this campaign produced 40 leads\" over a number meaning \"the forms filed\n * here have 40 leads\" would be a worse page than one showing nothing. So the\n * figures are labeled as what the forms HOLD, they sit in their own block\n * under their own disclaimer, and no total on this page adds them to an\n * attributed one.\n *\n * ## Three ways the forms' counters could mislead, each answered\n *\n *  1. **They are lifetime.** `stats.submissions` has counted since the form\n *     existed, including every submission from before anybody filed it here.\n *     Where the campaign carries dates, the figures are summed from the\n *     monthly `stats.periods` series over those months instead, and the\n *     caption says which of the two a reader is looking at. Months are whole,\n *     so a campaign starting mid-month includes that month entire — stated,\n *     not rounded away.\n *  2. **A form can be in twenty campaigns.** `campaignIds` is an array, so\n *     the same submissions count toward every campaign the form is filed\n *     under. Rows say so and the total refuses to present itself as\n *     exclusive.\n *  3. **A counter nobody wrote is not a zero.** `stats.leads` is counted\n *     only for a form whose `routing.lead` is set, and `stats.views` only by\n *     the analytics beacon. Both reach the shared `Figure`, which draws an em\n *     dash and the words \"not recorded\" rather than a confident 0.\n *\n * ## Screens carry no counter, and this section will not invent one\n *\n * A form's counters ride on the form document, so the query this section\n * already makes pays for them. A screen's traffic does not: it is one\n * document per screen per day in `hosts/{hostId}/screenAnalytics`, with no\n * lifetime total anywhere, so a views column here would cost a range read\n * across screens times days on every open of this page — and the display of\n * those figures is a paid entitlement this section does not resolve. The\n * screens block names the absence and links to the surface that does measure\n * it, which is a smaller lie than a number nobody can stand behind.\n *\n * ## The join is `array-contains`, on the member's own document\n *\n * A campaign holds no member list. Each record names the campaigns it is in,\n * which is what makes deleting one record leave nothing behind and what lets\n * a record's own page draw its campaigns without a query. The query here is\n * the other direction of the same field.\n *\n * ## Each kind is a table paged by its own query (AGL-3321)\n *\n * The screens and the forms are each a list a reader pages and searches, so\n * the membership, the soft delete and the search word are all on the\n * table's Firestore query (`campaign-members-query.ts`), and every member is\n * reachable a page at a time. Nothing is matched over rows already read: a\n * deleted screen is left out by `deletedAt == null`, which every screen\n * stores, and the search is a prefix range on the stored `nameLower`.\n *\n * Unsearched, a table walks the document name, which every record has — a\n * form carries `updatedAt` only if some writer stamped one, and ordering on a\n * field a writer may omit does not mis-sort the list, it drops rows from it.\n *\n * The forms' HOLDINGS are a sum, not a list, so they read a window of their\n * own — the first {@link FIGURES_CEILING} forms by document name — and say\n * when the campaign holds more, as the mail figures on this page do.\n *\n * ## Contacts are named here and NOT listed, and the reason is a query limit\n *\n * A contact is org-scoped and shared between the sites that captured it, so\n * every client read of the collection has to carry\n * `visibleTo array-contains-any` — that is what makes the read provable\n * per-document under the rules. Firestore permits ONE array clause per query,\n * and that is it: there is no client query that filters contacts by campaign\n * as well, so there is no pre-filtered address to link to either. The link\n * offered goes to the Contacts page and says it arrives unfiltered; the\n * assignment is real, is set from the contact's own drawer, and a count of it\n * would cost a scan of the collection the customer is billed on.\n */\nexport function CampaignMembersSection(props: CampaignMembersSectionProps) {\n  const { hostId, siteName, campaignId, startAtMs, endAtMs } = props\n  const firestore = useFirestore()\n  const { orgSlug, subdomain: host } = useConsoleHostRoute(hostId)\n\n  /*\n   * The window the holdings figures add up: the forms filed here, by\n   * document name, one past the ceiling as the probe. A form has no soft\n   * delete — it is deleted outright — so every document this returns is a\n   * form in use or a retired one, and both hold what they collected.\n   */\n  const { data: figureDocs } = useFirestoreCollection<Record<string, unknown>>(\n    () =>\n      query(\n        collection(firestore, 'hosts', hostId, 'forms'),\n        where(CAMPAIGN_MEMBERSHIP_FIELD, 'array-contains', campaignId),\n        orderBy(documentId()),\n        limit(FIGURES_CEILING + 1),\n      ),\n    [firestore, hostId, campaignId],\n    { idField: '$id' },\n  )\n\n  /*\n   * The months the campaign's dates cover, or nothing where it has neither.\n   * Derived from props the detail card already holds, so asking what a\n   * figure covers costs no read.\n   */\n  const range = useMemo(\n    () => campaignPeriodRange({ startAtMs, endAtMs }),\n    [startAtMs, endAtMs],\n  )\n  const windowed = isWindowedRange(range)\n\n  const screenRow = useCallback(\n    (row: Record<string, unknown>): MemberRow => {\n      const id = String(row['$id'])\n      const versionId = String(row['versionId'] ?? '')\n      return {\n        id,\n        name: String(row['displayName'] ?? id),\n        /*\n         * A screen with no saved version has no detail address to build —\n         * the route carries a version — so it stays plain text rather than\n         * linking somewhere that 404s. The screens list applies the same\n         * guard to its own name column.\n         */\n        href:\n          versionId && orgSlug && host\n            ? buildRoute(Route.SCREEN_DETAILS, {\n                orgSlug,\n                host,\n                screenId: id,\n                versionId,\n              })\n            : null,\n        hrefReason: versionId\n          ? 'This site’s console URL has not resolved yet'\n          : 'This page has no saved version yet',\n        campaigns: readContainerIds(row, CAMPAIGN_KIND).length,\n      }\n    },\n    [orgSlug, host],\n  )\n\n  /*\n   * The counters ride on the form documents, so each row's figures are paid\n   * for by the read that lists it.\n   */\n  const formRow = useCallback(\n    (row: Record<string, unknown>): MemberRow => {\n      const id = String(row['$id'])\n      return {\n        id,\n        name: String(row['displayName'] ?? id),\n        href: orgSlug && host ? pluginRecordHref('form', { orgSlug, host }, id) : null,\n        hrefReason: 'This site’s console URL has not resolved yet',\n        totals: campaignFormTotals(row['stats'] as FormStats | undefined, range),\n        campaigns: readContainerIds(row, CAMPAIGN_KIND).length,\n      }\n    },\n    [orgSlug, host, range],\n  )\n\n  const figureForms = useMemo(\n    () => (figureDocs ?? []).slice(0, FIGURES_CEILING).map(formRow),\n    [figureDocs, formRow],\n  )\n  const figuresTruncated = (figureDocs ?? []).length > FIGURES_CEILING\n  const rollup = useMemo(\n    () =>\n      campaignFormsRollup(\n        figureForms.map((row) => ({\n          totals: row.totals as FormStatsTotals,\n          campaigns: row.campaigns ?? 1,\n        })),\n      ),\n    [figureForms],\n  )\n\n  const analyticsHref =\n    orgSlug && host\n      ? buildRoute(Route.HOST_ANALYTICS, { orgSlug, host })\n      : null\n  const contactsHref =\n    orgSlug && host ? pluginRecordListHref('contact', { orgSlug, host }) : null\n\n  return (\n    <Section\n      title={\n        siteName\n          ? `Assigned to this campaign on ${siteName}`\n          : 'Assigned to this campaign'\n      }\n    >\n      <Stack spacing={2}>\n        <Typography variant=\"body2\" color=\"text.secondary\">\n          {'The pages and forms somebody put in this campaign. Assignment is ' +\n            'a grouping — what the campaign was credited with is measured ' +\n            'above, from the links its emails carried.'}\n        </Typography>\n        <MemberTable\n          heading=\"Pages\"\n          noun=\"page\"\n          collectionName=\"screens\"\n          hostId={hostId}\n          campaignId={campaignId}\n          toRow={screenRow}\n        />\n        {/*\n          The absence, named where a reader would look for the number.\n\n          A screen's traffic is not on the screen document — it is a day doc\n          per screen in `screenAnalytics` — so a views column here would be a\n          read across screens times days on every open, for figures whose\n          display is a paid entitlement this section does not resolve. The\n          page that does both is linked instead.\n         */}\n        <Typography variant=\"caption\" color=\"text.secondary\">\n          {'Page views are not shown here. A page keeps no running total ' +\n            'on its own record — traffic is stored a day at a time — so ' +\n            'counting it would be a fresh read of the site’s history every ' +\n            'time this view opens. '}\n          {analyticsHref ? (\n            <AppLink href={analyticsHref}>\n              {'The site’s analytics measures it by page.'}\n            </AppLink>\n          ) : (\n            'The site’s analytics view measures it by page.'\n          )}\n        </Typography>\n        <MemberTable\n          heading=\"Forms\"\n          noun=\"form\"\n          collectionName=\"forms\"\n          hostId={hostId}\n          campaignId={campaignId}\n          toRow={formRow}\n          figures\n        />\n        {/*\n          THE MEMBERSHIP TOTAL, fenced off from the attributed ones above.\n\n          Same `Figure` primitive as the mail rollup, deliberately different\n          words: it says what the forms HOLD, and the caption beneath refuses\n          the reading a merchant will reach for first.\n         */}\n        {figureForms.length ? (\n          <FormsHoldings\n            rollup={rollup}\n            windowed={windowed}\n            from={range.from ?? null}\n            to={range.to ?? null}\n            truncated={figuresTruncated}\n          />\n        ) : null}\n        {/*\n          The people, named rather than omitted.\n\n          A contact CAN be filed under a campaign and this page cannot list\n          them — see the module comment for the query rule that decides it.\n          Leaving the heading out entirely would read as \"contacts cannot be\n          assigned\", which is the one thing it does not mean.\n         */}\n        <Stack spacing={0.5}>\n          <Typography variant=\"overline\" color=\"text.secondary\">\n            {'Contacts'}\n          </Typography>\n          <Typography variant=\"body2\" color=\"text.secondary\">\n            {'Contacts are filed under a campaign from the contact’s own ' +\n              'panel on the Contacts page. They are not listed or counted ' +\n              'here: a contact belongs to the organization rather than to ' +\n              'this site, so the query that reads them is already spending ' +\n              'its one array filter on which sites may see the person. '}\n            {contactsHref ? (\n              <AppLink href={contactsHref}>{'Open Contacts'}</AppLink>\n            ) : null}\n            {contactsHref\n              ? ' — it opens unfiltered, because that same rule leaves no ' +\n                'campaign filter for the address to carry.'\n              : ''}\n          </Typography>\n        </Stack>\n      </Stack>\n    </Section>\n  )\n}\n\n/**\n * What the campaign's forms have collected — and what that is NOT.\n *\n * Two sentences do the whole job of keeping this apart from the attributed\n * figures, and both are load-bearing:\n *\n *  - The first refuses causation outright. A merchant reading a number under\n *    a campaign's heading will assume the campaign caused it unless told\n *    otherwise in the same breath.\n *  - The second says which months the number covers. A lifetime total under a\n *    campaign that ran for six weeks is the same lie one step quieter.\n *\n * `shared` is stated as a count rather than folded into the arithmetic. There\n * is no honest way to divide a submission between two campaigns a form is\n * filed under, so the total is left whole and the overlap is disclosed.\n */\nfunction FormsHoldings(props: {\n  rollup: CampaignFormsRollup\n  windowed: boolean\n  from: string | null\n  to: string | null\n  /** The campaign holds more forms than the figures add up. */\n  truncated: boolean\n}) {\n  const { rollup, windowed, from, to, truncated } = props\n  const note = (recorded: number) =>\n    recorded < rollup.members\n      ? `across ${recorded} of ${rollup.members} forms`\n      : `across ${rollup.members} form${rollup.members === 1 ? '' : 's'}`\n  const span = windowed\n    ? `the campaign’s months (${from ?? 'the first month recorded'} to ${\n        to ?? 'now'\n      })`\n    : 'each form’s whole history'\n  return (\n    <Stack spacing={1}>\n      <Typography variant=\"overline\" color=\"text.secondary\">\n        {'What these forms hold'}\n      </Typography>\n      <Stack useFlexGap direction=\"row\" spacing={3} sx={{ flexWrap: 'wrap' }}>\n        <Figure\n          label=\"Views\"\n          value={rollup.views.value}\n          note={note(rollup.views.recorded)}\n        />\n        <Figure\n          label=\"Started\"\n          value={rollup.starts.value}\n          note={note(rollup.starts.recorded)}\n        />\n        <Figure\n          label=\"Submissions\"\n          value={rollup.submissions.value}\n          note={note(rollup.submissions.recorded)}\n        />\n        <Figure\n          label=\"Leads\"\n          value={rollup.leads.value}\n          note={note(rollup.leads.recorded)}\n        />\n      </Stack>\n      <Typography variant=\"caption\" color=\"text.secondary\">\n        {'These are the forms’ own counters, not this campaign’s results. ' +\n          'A submission is counted here because somebody filed the form ' +\n          'under this campaign, whether or not this campaign’s mail sent ' +\n          `the visitor. Counted over ${span}.`}\n      </Typography>\n      {windowed ? (\n        <Typography variant=\"caption\" color=\"text.secondary\">\n          {'Whole calendar months: a campaign that started or ended mid-' +\n            'month takes that month entire, and a form counting nothing in ' +\n            'those months adds nothing here even where its lifetime total ' +\n            'is large.'}\n        </Typography>\n      ) : (\n        <Typography variant=\"caption\" color=\"text.secondary\">\n          {'This campaign has no dates, so nothing narrows the figures to ' +\n            'it. They are lifetime totals and include everything from ' +\n            'before the forms were put in this campaign. Give the campaign ' +\n            'a start and an end to count only its months.'}\n        </Typography>\n      )}\n      {truncated ? (\n        <Alert severity=\"info\">\n          {`These figures add up the first ${FIGURES_CEILING} forms in this ` +\n            'campaign, in document order. It holds more; the table above ' +\n            'lists every one of them.'}\n        </Alert>\n      ) : null}\n      {rollup.shared ? (\n        <Typography variant=\"caption\" color=\"text.secondary\">\n          {`${rollup.shared} of these ${rollup.members} forms ${\n            rollup.shared === 1 ? 'is' : 'are'\n          } filed under another campaign too, so the same submissions are ` +\n            'counted there as well. This total is not exclusive to this ' +\n            'campaign.'}\n        </Typography>\n      ) : null}\n    </Stack>\n  )\n}\nFormsHoldings.displayName = 'FormsHoldings'\n\n/** A counter as a cell: an em dash where nothing was recorded, never a zero. */\nfunction statCell(value: number | null | undefined) {\n  return value === null || value === undefined ? '—' : value.toLocaleString()\n}\n\n/** The counters a form carries on its own document, in the order they are read. */\nconst MEMBER_FIGURES = [\n  ['views', 'Views'],\n  ['starts', 'Started'],\n  ['submissions', 'Submissions'],\n  ['leads', 'Leads'],\n] as const\n\n/*\n * The figures are summed from the campaign's visits for the members on the\n * page, so they sort the page; Name orders the query (AGL-3680).\n */\nconst MEMBER_PAGE_SORTS = Object.fromEntries(\n  MEMBER_FIGURES.map(([figure]) => [figure, (row: MemberRow) => row.totals?.[figure] ?? null]),\n)\nconst MEMBER_PAGE_SORT_HEADERS = Object.fromEntries(MEMBER_FIGURES)\n\n/** How the search reads on a notice: the box, not a column. */\nconst MEMBER_SEARCH_HEADERS: Readonly<Record<string, string>> = {\n  name: 'Search',\n}\n\n/**\n * One kind's members, as a record list in the shared grid, paged by its own\n * query (AGL-3321).\n *\n * The membership, the soft delete and the search word are predicates on the\n * query (`campaign-members-query.ts`); the grid neither filters nor sorts\n * the page it is handed. The search box is the grid's quick filter, turned\n * into \"name starts with\" because the membership holds the query's one\n * array clause; the Filters panel is not offered, because every column\n * beside it would need an index of its own for a list this size.\n *\n * `figures` adds the counter columns for a kind that carries them on its own\n * document. It is a prop rather than two lists because the row grammar — the\n * name cell, the reason a member has no link, the footer — is the part that\n * has to stay identical between screens and forms.\n */\nfunction MemberTable(props: {\n  heading: string\n  noun: string\n  collectionName: CampaignMemberCollection\n  hostId: string\n  campaignId: string\n  toRow: (row: Record<string, unknown>) => MemberRow\n  figures?: boolean\n}) {\n  const { heading, noun, collectionName, hostId, campaignId, toRow, figures } =\n    props\n  const firestore = useFirestore()\n  const gridFilter = useListGridFilter({})\n  const search = campaignMembersSearchClause(gridFilter.searchWords)\n  const [askedSort, setAskedSort] = useState<ListQuerySort | null>(null)\n  const page = useListQuery<Record<string, unknown>>({\n    collection: collection(firestore, 'hosts', hostId, collectionName),\n    declaration: CAMPAIGN_MEMBERS_QUERY,\n    request: {\n      clauses: search ? [search] : [],\n      base: campaignMembersBase(collectionName, campaignId),\n      sort: askedSort,\n    },\n    deps: [firestore, hostId, collectionName, campaignId],\n    idField: '$id',\n  })\n  const rows = useMemo(() => page.rows.map(toRow), [page.rows, toRow])\n  const columnSort = useListColumnSort<MemberRow>({\n    sorts: CAMPAIGN_MEMBERS_QUERY.sorts,\n    sort: askedSort,\n    onSortChange: setAskedSort,\n    orderBy: page.plan.orderBy,\n    rows,\n    pageSorts: figures ? MEMBER_PAGE_SORTS : undefined,\n    headers: MEMBER_PAGE_SORT_HEADERS,\n  })\n  // Nothing typed and nothing on the first page: the campaign holds none,\n  // which is said in words rather than as an empty grid.\n  const none = !search && page.page === 0 && rows.length === 0\n  const columns = useMemo<GridColDef<MemberRow>[]>(\n    () => [\n      {\n        field: 'name',\n        headerName: 'Name',\n        flex: 1,\n        minWidth: 240,\n        renderCell: ({ row }) => (\n          <Stack sx={{ py: 1, minWidth: 0 }}>\n            {row.href ? (\n              <AppLink href={row.href}>{row.name}</AppLink>\n            ) : (\n              <>\n                <Typography variant=\"body2\">{row.name}</Typography>\n                <Typography variant=\"caption\" color=\"text.secondary\">\n                  {row.hrefReason}\n                </Typography>\n              </>\n            )}\n            {/*\n              The overlap, on the row that causes it. A reader comparing two\n              campaigns has to be able to see which rows they have in common\n              without opening either.\n             */}\n            {(row.campaigns ?? 1) > 1 ? (\n              <Typography variant=\"caption\" color=\"text.secondary\">\n                {`Also in ${(row.campaigns ?? 1) - 1} other campaign${\n                  (row.campaigns ?? 1) - 1 === 1 ? '' : 's'\n                }`}\n              </Typography>\n            ) : null}\n          </Stack>\n        ),\n      },\n      ...(figures\n        ? MEMBER_FIGURES.map(\n            ([figure, headerName]): GridColDef<MemberRow> => ({\n              field: figure,\n              headerName,\n              type: 'number',\n              align: 'right',\n              headerAlign: 'right',\n              width: 120,\n              valueGetter: (_value, row) => row.totals?.[figure] ?? null,\n              renderCell: ({ row }) => statCell(row.totals?.[figure]),\n            }),\n          )\n        : []),\n    ],\n    [figures],\n  )\n  return (\n    <Stack spacing={0.5}>\n      <Typography variant=\"overline\" color=\"text.secondary\">\n        {heading}\n      </Typography>\n      {none ? (\n        <Typography variant=\"body2\" color=\"text.secondary\">\n          {page.status === 'loading'\n            ? `Reading this campaign’s ${noun}s…`\n            : `No ${noun} is in this campaign. Open a ${noun} and pick this ` +\n              'campaign on its own page to put it in one.'}\n        </Typography>\n      ) : (\n        <>\n          <ListQueryNotices\n            refused={listQueryRefusals(page.plan.refused, {\n              fields: CAMPAIGN_MEMBERS_QUERY.fields,\n              headers: MEMBER_SEARCH_HEADERS,\n            })}\n            notices={[\n              ...(search ? [CAMPAIGN_MEMBERS_SEARCH_NOTICE] : []),\n              ...page.plan.notices,\n              ...columnSort.notices,\n            ]}\n          />\n          <ListTable\n            aria-label={heading}\n            rows={columnSort.rows}\n            columns={columns}\n            getRowId={(row: MemberRow) => row.id}\n            rowHeight={TABLE_ROW_HEIGHT}\n            // A member's name carries why it has no link, and the other\n            // campaigns it is in, beneath it.\n            getRowHeight={() => 'auto'}\n            loading={page.status === 'loading'}\n            filterMode=\"server\"\n            filterModel={gridFilter.filterModel}\n            onFilterModelChange={gridFilter.onFilterModelChange}\n            quickFilter\n            disableColumnFilter\n            // Name orders the query, the figures the page (AGL-3680).\n            columnSort={columnSort}\n            hideFooter\n            noRowsLabel={`No ${noun} in this campaign starts with that`}\n          />\n          <ListPagination\n            page={page.page}\n            pageSize={page.pageSize}\n            rowCount={rows.length}\n            hasMore={page.hasMore}\n            onPageChange={page.setPage}\n            onPageSizeChange={page.setPageSize}\n          />\n        </>\n      )}\n    </Stack>\n  )\n}\n\nCampaignMembersSection.displayName = 'CampaignMembersSection'\n\nexport default CampaignMembersSection\n"],"names":["pluginRecordHref","pluginRecordListHref","AppLink","Figure","Section","ListPagination","ListQueryNotices","listQueryRefusals","ListTable","useListGridFilter","useListColumnSort","TABLE_ROW_HEIGHT","useListQuery","buildRoute","readContainerIds","Route","Alert","Stack","Typography","collection","documentId","limit","orderBy","query","where","useCallback","useMemo","useState","useConsoleHostRoute","useFirestore","useFirestoreCollection","campaignFormsRollup","campaignFormTotals","campaignPeriodRange","isWindowedRange","CAMPAIGN_KIND","CAMPAIGN_MEMBERSHIP_FIELD","CAMPAIGN_MEMBERS_QUERY","CAMPAIGN_MEMBERS_SEARCH_NOTICE","campaignMembersBase","campaignMembersSearchClause","FIGURES_CEILING","CampaignMembersSection","props","range","hostId","siteName","campaignId","startAtMs","endAtMs","firestore","orgSlug","subdomain","host","data","figureDocs","idField","windowed","screenRow","row","id","String","versionId","name","href","SCREEN_DETAILS","screenId","hrefReason","campaigns","length","formRow","totals","figureForms","slice","map","figuresTruncated","rollup","analyticsHref","HOST_ANALYTICS","contactsHref","title","spacing","variant","color","MemberTable","heading","noun","collectionName","toRow","figures","FormsHoldings","from","to","truncated","note","recorded","members","span","useFlexGap","direction","sx","flexWrap","label","value","views","starts","submissions","leads","severity","shared","displayName","statCell","undefined","toLocaleString","MEMBER_FIGURES","MEMBER_PAGE_SORTS","Object","fromEntries","figure","MEMBER_PAGE_SORT_HEADERS","MEMBER_SEARCH_HEADERS","gridFilter","search","searchWords","askedSort","setAskedSort","page","declaration","request","clauses","base","sort","deps","rows","columnSort","sorts","onSortChange","plan","pageSorts","headers","none","columns","field","headerName","flex","minWidth","renderCell","py","type","align","headerAlign","width","valueGetter","_value","status","refused","fields","notices","aria-label","getRowId","rowHeight","getRowHeight","loading","filterMode","filterModel","onFilterModelChange","quickFilter","disableColumnFilter","hideFooter","noRowsLabel","pageSize","rowCount","hasMore","onPageChange","setPage","onPageSizeChange","setPageSize"],"mappings":"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"}

package/src/lib/components/campaigns-card.js

@@ -32,6 +32,7 @@ import { ListRowActions, ListTable, listActionsColumn } from "@aglyn/shared-ui-j
 import { hiddenFilterVisibility } from "@aglyn/shared-ui-jsx/const/list-filter";
 import { listFilterGridColumns } from "@aglyn/shared-ui-jsx/const/list-grid-filter";
 import { useListGridFilter } from "@aglyn/shared-ui-jsx/hooks/use-list-grid-filter";
+import { useListColumnSort } from "@aglyn/shared-ui-jsx/hooks/use-list-column-sort";
 import { useSnackbar } from "@aglyn/shared-ui-snackstack";
 import { Alert, Button, Chip, Stack, ToggleButton, ToggleButtonGroup, Typography } from "@mui/material";
 import { collection, limit, query, setDoc, where } from "firebase/firestore";
@@ -57,6 +58,21 @@ import { useCampaignTopicOptions } from "./use-campaign-topic-options.js";
 /** Firestore's cap on an `in` clause's values. */ const IN_LIMIT = 30;
 const formatDay = (ms)=>ms === null ? '' : new Date(ms).toLocaleDateString();
 /** A rolled-up figure, or an em dash where nothing recorded one. */ const figure = (value)=>value.value === null ? '—' : value.value.toLocaleString();
+/*
+ * EVERY HEADER SORTS (AGL-3680). A campaign's name and a single send's
+ * subject order the kind's query (`declaration.sorts`); what a row is drawn
+ * from — its sites, its window, its lists, and its figures (a campaign's
+ * summed from its emails for the page, a send's counters absent until
+ * something is counted) — sorts the page.
+ */ const CAMPAIGN_PAGE_SORT_HEADERS = {
+    sitesLabel: 'Sites',
+    windowState: 'Window',
+    listIds: 'Lists',
+    emails: 'Emails',
+    sent: 'Mail sent',
+    opens: 'Mail opens',
+    clicks: 'Mail clicks'
+};
 const WINDOW_LABEL = {
     undated: 'No dates',
     upcoming: 'Upcoming',
@@ -146,6 +162,8 @@ const NO_CLAUSES = {
    * is asked by scope token, a send by the site it was sent as); the search
    * words are the reader's and carry across.
    *=========================================*/ const [kind, setKind] = useState('campaign');
+    // The header order asked of the kind on screen; a new kind starts unsorted.
+    const [askedSort, setAskedSort] = useState(null);
     const [clausesByKind, setClausesByKind] = useState(NO_CLAUSES);
     const [searchWords, setSearchWords] = useState([]);
     const setKindClauses = useCallback((next)=>setClausesByKind((current)=>_extends({}, current, {
@@ -184,7 +202,8 @@ const NO_CLAUSES = {
                 ...gridFilter.clauses
             ] : gridFilter.clauses : [],
             search: hostId ? [] : gridFilter.searchWords,
-            base: campaignContainersScope(hostId)
+            base: campaignContainersScope(hostId),
+            sort: kind === 'campaign' ? askedSort : null
         },
         deps: [
             firestore,
@@ -203,7 +222,8 @@ const NO_CLAUSES = {
             base: [
                 SINGLE_SENDS_BASE,
                 ...campaignSendsScope(hostId)
-            ]
+            ],
+            sort: kind === 'single' ? askedSort : null
         },
         deps: [
             firestore,
@@ -335,6 +355,32 @@ const NO_CLAUSES = {
         restSends.rows,
         orgMount
     ]);
+    const pageSorts = useMemo(()=>({
+            sitesLabel: (row)=>row.sitesLabel || null,
+            windowState: (row)=>{
+                var _ref, _row_startAtMs;
+                return (_ref = (_row_startAtMs = row.startAtMs) != null ? _row_startAtMs : row.endAtMs) != null ? _ref : null;
+            },
+            listIds: (row)=>row.listIds.map((id)=>{
+                    var _listNames_get;
+                    return (_listNames_get = listNames.get(id)) != null ? _listNames_get : id;
+                }).join(', ') || null,
+            emails: (row)=>row.rollup.sends,
+            sent: (row)=>row.rollup.sent.value,
+            opens: (row)=>row.rollup.opens.value,
+            clicks: (row)=>row.rollup.clicks.value
+        }), [
+        listNames
+    ]);
+    const columnSort = useListColumnSort({
+        sorts: declaration.sorts,
+        sort: askedSort,
+        onSortChange: setAskedSort,
+        orderBy: page.plan.orderBy,
+        rows,
+        pageSorts,
+        headers: CAMPAIGN_PAGE_SORT_HEADERS
+    });
     /*
    * The choices the picked fields offer. A campaign's Sites are asked by
    * scope token — `org` is placed on every site — and a single send's by
@@ -827,7 +873,10 @@ const NO_CLAUSES = {
                         size: "small",
                         value: kind,
                         onChange: (_event, next)=>{
-                            if (next) setKind(next);
+                            if (next) {
+                                setKind(next);
+                                setAskedSort(null);
+                            }
                         },
                         "aria-label": "Which rows the table lists",
                         sx: {
@@ -857,25 +906,30 @@ const NO_CLAUSES = {
                             headers: filterHeaders,
                             options: filterOptions
                         }),
-                        notices: siteSearch ? [
-                            CAMPAIGN_SITE_SEARCH_NOTICE,
-                            ...page.plan.notices
-                        ] : page.plan.notices
+                        notices: [
+                            ...siteSearch ? [
+                                CAMPAIGN_SITE_SEARCH_NOTICE
+                            ] : [],
+                            ...page.plan.notices,
+                            ...columnSort.notices
+                        ]
                     }),
                     /*#__PURE__*/ _jsx(ListTable, {
-                        rows: rows,
+                        rows: columnSort.rows,
                         columns: listFilterGridColumns(columns, declaration.fields, filterOptions, filterHeaders),
                         onOpen: (id)=>openCampaign(id),
                         loading: page.status === 'loading',
                         /*
            * The panel and the search are the grid's; every clause and the
            * search word are on the list's query (AGL-3321), and the grid
-           * neither filters nor sorts the page it is handed.
+           * neither filters nor sorts the page it is handed: a stored
+           * column's header orders the query, a drawn one the page
+           * (AGL-3680).
            */ filterMode: "server",
                         filterModel: gridFilter.filterModel,
                         onFilterModelChange: gridFilter.onFilterModelChange,
                         quickFilter: true,
-                        disableColumnSorting: true,
+                        columnSort: columnSort,
                         hideFooter: true,
                         initialState: {
                             columns: {