@aglyn/plugins-marketing 1.0.0-beta.143

package/src/lib/components/campaign-conversions-card.js

@@ -0,0 +1,642 @@
+/**
+ * @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, Fragment as _Fragment } from "react/jsx-runtime";
+import { pluginDocsHelp } from "@aglyn/aglyn";
+import { mdiEyeOutline, mdiMapMarkerOutline } from "@aglyn/shared-data-mdi";
+import { AppLink, CardDisplay, MdiIcon } from "@aglyn/shared-ui-jsx";
+import { ListRowActions, ListTable, listActionsColumn } from "@aglyn/shared-ui-jsx/components/list-table.component";
+import { ListPagination } from "@aglyn/shared-ui-jsx/components/list-pagination.component";
+import { Figure, Section } from "@aglyn/shared-ui-email-campaigns/components/report-figures";
+import { Alert, Button, Chip, Divider, Stack, ToggleButton, ToggleButtonGroup, Typography } from "@mui/material";
+import { collection, documentId, getCountFromServer, getDocs, query, where } from "firebase/firestore";
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { useRouter } from "next/navigation";
+import { useFirestore, useOrgDataScope, usePagedCollection } from "@aglyn/tenant-feature-instance";
+/*
+ * The MODULE, not the barrel, for the pure query helpers — a spec that mocks
+ * `@aglyn/tenant-feature-instance` wholesale to stage its Firestore hooks
+ * would otherwise lose them, and neither is a hook.
+ */ import { ceilingedWindow, collectionCeiling, collectionPage } from "@aglyn/tenant-feature-instance/hooks/host-collection-queries";
+import { CAMPAIGN_CONVERSION_KINDS, CAMPAIGN_CONVERSION_KIND_COPY, campaignConversionsCoverage, campaignTouchLabel } from "@aglyn/shared-ui-email-campaigns/model/campaign-conversions";
+/**
+ * WHAT THE CAMPAIGNS CAUSED, from the conversions' end.
+ *
+ * A campaign's own report says what that campaign caused. This is the list
+ * the report cannot be: every credited conversion on the site, the ones
+ * credited to a tagged web link rather than to a campaign document, and — the
+ * half a report of successes can never show — how many were credited to
+ * nothing at all.
+ *
+ * ## ONE KIND AT A TIME, and that is the whole design
+ *
+ * A form submission by a new person writes a submission record, a contact and
+ * a lead. Three true statements about one visit, and a screen that showed
+ * them together would invite the reader to add them and treble every figure.
+ * So the kind is a MODE rather than a column: the query carries
+ * `where('kind','==', …)`, only one kind's rows are ever on screen, and there
+ * is no view in which two kinds could be totalled because there is no view in
+ * which two kinds are both present.
+ *
+ * ## THE TWO CHANNELS ARE TWO LISTS, and never one
+ *
+ * An email touch names a campaign document — a real entity with a report to
+ * open. A web touch names `utm_` text a marketer typed into a URL: no
+ * document, no id, no bound on how many distinct values exist. Merging them
+ * would put a linkable record and an unlinkable label in one column and imply
+ * they are the same kind of thing, and grouping the web side into a rollup
+ * would build a map anybody who can vary a query string can grow. So there
+ * are two tables, the web one is read as records, and neither is summed into
+ * the other.
+ *
+ * ## The read cost
+ *
+ * Two paged listeners bounded by the page size, and two aggregation counts.
+ * Nothing scans a collection, no row triggers a read of its own, and the
+ * landing-page join — the only expensive thing here — is behind a button and
+ * says what it will cost before it runs.
+ */ /**
+ * How many attribution records the landing-page join reads.
+ *
+ * A CEILING rather than a page size: grouping is over a window and a window
+ * sliced ten at a time cannot be grouped at all. Kept low because this is the
+ * one read on the surface that is measured in hundreds — see the button that
+ * asks for it.
+ */ const LANDING_PAGE_CEILING = 100;
+/** Firestore's cap on the values in one `in` filter. */ const ID_CHUNK = 30;
+const conversionsDocsHelp = pluginDocsHelp('emailCampaigns', {
+    anchor: '#the-campaign-report',
+    excerpt: 'A conversion is credited to the last campaign whose link the visitor ' + 'followed. The four kinds count different things about the same visits ' + 'and are never added together.'
+});
+const day = (ms)=>{
+    const value = Number(ms != null ? ms : 0);
+    return Number.isFinite(value) && value > 0 ? new Date(value).toLocaleString() : '—';
+};
+export function CampaignConversionsCard(props) {
+    const { hostId, basePath, campaignId } = props;
+    const firestore = useFirestore();
+    const router = useRouter();
+    const { scope: dataScope } = useOrgDataScope({
+        hostId
+    });
+    const [kind, setKind] = useState('form');
+    const attributions = useCallback(()=>collection(firestore, 'hosts', hostId, 'campaignAttributions'), [
+        firestore,
+        hostId
+    ]);
+    /*==========================================
+   * THE TWO LISTS.
+   *
+   * Both walk the collection in DOCUMENT-NAME order through `collectionPage`,
+   * which is the console's one ordering decision: `orderBy` on a field
+   * matches only documents that HAVE it, so ordering on a date would hide
+   * rows rather than merely mis-order them, and an unordered `limit()` is a
+   * pseudo-random sample whose gaps leave nothing to notice. The walk is
+   * total — every row is reachable by paging — and it is deliberately NOT
+   * newest-first, which the note under each table says out loud.
+   *
+   * `campaignId` narrows the email list when the reader arrived from one
+   * campaign. It is never applied to the web list: a `utm_` label is not a
+   * campaign id and a query pretending otherwise would return nothing while
+   * reading as "this campaign caused no web conversions".
+   *=========================================*/ const emailList = usePagedCollection((pageLimit)=>collectionPage(campaignId ? query(attributions(), where('kind', '==', kind), where('campaignId', '==', campaignId)) : query(attributions(), where('kind', '==', kind), where('channel', '==', 'email')), pageLimit), [
+        firestore,
+        hostId,
+        kind,
+        campaignId
+    ], {
+        idField: '$id'
+    });
+    const webList = usePagedCollection((pageLimit)=>campaignId ? null : collectionPage(query(attributions(), where('kind', '==', kind), where('channel', '==', 'web')), pageLimit), [
+        firestore,
+        hostId,
+        kind,
+        campaignId
+    ], {
+        idField: '$id'
+    });
+    /*==========================================
+   * THE UNCREDITED HALF.
+   *
+   * Two aggregation counts, and they are on the page by DEFAULT rather than
+   * behind a button, because the tables above them are a list of the
+   * successes: showing only those renders "we credited nine of these" as
+   * "nine of these happened", which is the conclusion this surface exists to
+   * stop a reader drawing. An aggregation is billed per thousand index
+   * entries rather than per document, so the honest figure costs about as
+   * much as one row.
+   *
+   * Withheld entirely when either count fails. Defaulting the total to the
+   * attributed figure would render every conversion as attributed, which is
+   * the most flattering wrong answer available here.
+   *=========================================*/ /*
+   * A PATH STRING and a BOOLEAN, not an object.
+   *
+   * Both are effect dependencies, and an object rebuilt on every render
+   * reopens the effect on every render — which here means paying for two
+   * aggregation counts per render rather than per kind. Primitives compare by
+   * value, so the reads happen when the question changes and not when React
+   * re-runs the component.
+   */ const totalCollectionPath = useMemo(()=>{
+        switch(kind){
+            case 'form':
+                return `hosts/${hostId}/formSubmissions`;
+            case 'lead':
+                return `hosts/${hostId}/leads`;
+            case 'booking':
+                return `hosts/${hostId}/bookings`;
+            case 'contact':
+                /*
+         * ORG-SCOPED, and the coverage model is told so below. A contact is
+         * shared across every site in the org while an attribution belongs to
+         * one host, so this total counts contacts created on another site
+         * that could never have been credited here.
+         */ return dataScope ? `${dataScope[0]}/${dataScope[1]}/contacts` : null;
+            default:
+                return null;
+        }
+    }, [
+        kind,
+        hostId,
+        dataScope
+    ]);
+    /** The kind's records live outside this host, so the total over-counts. */ const totalCrossesHosts = kind === 'contact';
+    const [attributedCount, setAttributedCount] = useState(null);
+    const [totalCount, setTotalCount] = useState(null);
+    useEffect(()=>{
+        // A campaign-scoped view has no uncredited figure to compute — see the
+        // prop's docblock — so it does not pay for one either.
+        if (campaignId || !totalCollectionPath) {
+            setAttributedCount(null);
+            setTotalCount(null);
+            return;
+        }
+        let active = true;
+        setAttributedCount(null);
+        setTotalCount(null);
+        void getCountFromServer(query(attributions(), where('kind', '==', kind))).then((snapshot)=>{
+            if (active) setAttributedCount(snapshot.data().count);
+        }).catch(()=>{
+        // Left null, which withholds the split. See the block comment.
+        });
+        const segments = totalCollectionPath.split('/');
+        void getCountFromServer(collection(firestore, segments[0], ...segments.slice(1))).then((snapshot)=>{
+            if (active) setTotalCount(snapshot.data().count);
+        }).catch(()=>{
+        // Left null, which withholds the split. See the block comment.
+        });
+        return ()=>{
+            active = false;
+        };
+    }, [
+        attributions,
+        firestore,
+        kind,
+        campaignId,
+        totalCollectionPath
+    ]);
+    const coverage = campaignConversionsCoverage({
+        kind,
+        attributed: attributedCount,
+        total: totalCount,
+        crossHostTotal: totalCrossesHosts
+    });
+    /*==========================================
+   * LANDING PAGES — a join, and an EXPENSIVE one, so it is asked for.
+   *
+   * The attribution record carries `refId`; a form submission carries the
+   * `path` it was submitted from. Joining the two is the only landing-page
+   * answer the stored data supports, and the notice below says plainly what
+   * it is not: `path` is where the FORM was, not where the campaign link
+   * landed, so a visitor who arrived on one page and submitted on another is
+   * grouped under the second.
+   *
+   * Two reads deep and both bounded: a ceiling over the attributions, then
+   * their submissions by document name in chunks of thirty. `getDocs` rather
+   * than a listener — a grouping nobody is watching does not need to be kept
+   * live, and a listener would go on costing after the reader looked away.
+   *=========================================*/ const [landingBusy, setLandingBusy] = useState(false);
+    const [landingError, setLandingError] = useState(null);
+    const [landing, setLanding] = useState(null);
+    // A grouping computed for one kind describes that kind. Switching the mode
+    // leaves it on screen labelled as something it is not.
+    useEffect(()=>{
+        setLanding(null);
+        setLandingError(null);
+    }, [
+        kind,
+        campaignId
+    ]);
+    const groupByLandingPage = useCallback(async ()=>{
+        if (landingBusy) return;
+        setLandingBusy(true);
+        setLandingError(null);
+        try {
+            const credited = await getDocs(collectionCeiling(campaignId ? query(attributions(), where('kind', '==', 'form'), where('campaignId', '==', campaignId)) : query(attributions(), where('kind', '==', 'form')), LANDING_PAGE_CEILING));
+            const { rows: credits, truncated } = ceilingedWindow(credited.docs.map((entry)=>entry.data()), LANDING_PAGE_CEILING);
+            const refIds = Array.from(new Set(credits.map((record)=>{
+                var _record_refId;
+                return String((_record_refId = record.refId) != null ? _record_refId : '');
+            }).filter((id)=>id.length > 0)));
+            const submissions = collection(firestore, 'hosts', hostId, 'formSubmissions');
+            const paths = new Map();
+            for(let index = 0; index < refIds.length; index += ID_CHUNK){
+                const chunk = refIds.slice(index, index + ID_CHUNK);
+                const found = await getDocs(query(submissions, where(documentId(), 'in', chunk)));
+                found.docs.forEach((entry)=>{
+                    var _ref;
+                    var _entry_data;
+                    const path = String((_ref = (_entry_data = entry.data()) == null ? void 0 : _entry_data.path) != null ? _ref : '').trim();
+                    if (path) paths.set(entry.id, path);
+                });
+            }
+            const counts = new Map();
+            let missing = 0;
+            refIds.forEach((refId)=>{
+                var _counts_get;
+                const path = paths.get(refId);
+                if (!path) {
+                    /*
+           * The submission was deleted, or it carries no path — an older one,
+           * or a form posted by an integration that sent none. Counted and
+           * REPORTED rather than filed under a placeholder page: a bar
+           * labelled "/" that is really "we do not know" is the kind of row a
+           * reader acts on.
+           */ missing += 1;
+                    return;
+                }
+                counts.set(path, ((_counts_get = counts.get(path)) != null ? _counts_get : 0) + 1);
+            });
+            setLanding({
+                rows: Array.from(counts.entries()).map(([path, conversions])=>({
+                        $id: path,
+                        path,
+                        conversions
+                    })).sort((a, b)=>b.conversions - a.conversions || a.path.localeCompare(b.path)),
+                read: refIds.length,
+                truncated,
+                missing
+            });
+        } catch (error) {
+            console.error(error);
+            setLandingError('The landing pages could not be read');
+        } finally{
+            setLandingBusy(false);
+        }
+    }, [
+        attributions,
+        campaignId,
+        firestore,
+        hostId,
+        landingBusy
+    ]);
+    const campaignHref = (row)=>row.campaignId ? `${basePath}/campaigns/${row.campaignId}` : undefined;
+    const columns = useMemo(()=>[
+            {
+                field: 'refId',
+                headerName: 'Record',
+                flex: 1,
+                minWidth: 200,
+                renderCell: ({ row })=>{
+                    var _row_refId;
+                    return /*#__PURE__*/ _jsxs(Stack, {
+                        sx: {
+                            minWidth: 0
+                        },
+                        children: [
+                            /*#__PURE__*/ _jsx(Typography, {
+                                variant: "body2",
+                                noWrap: true,
+                                children: String((_row_refId = row.refId) != null ? _row_refId : row.$id)
+                            }),
+                            /*#__PURE__*/ _jsx(Typography, {
+                                variant: "caption",
+                                color: "text.secondary",
+                                noWrap: true,
+                                children: CAMPAIGN_CONVERSION_KIND_COPY[kind].label
+                            })
+                        ]
+                    });
+                }
+            },
+            {
+                field: 'campaign',
+                headerName: 'Credited to',
+                flex: 1,
+                minWidth: 180,
+                renderCell: ({ row })=>{
+                    const label = campaignTouchLabel(row) || '—';
+                    const href = campaignHref(row);
+                    return href ? /*#__PURE__*/ _jsx(AppLink, {
+                        href: href,
+                        onClick: (event)=>event.stopPropagation(),
+                        children: label
+                    }) : /*#__PURE__*/ _jsx(Typography, {
+                        variant: "body2",
+                        noWrap: true,
+                        children: label
+                    });
+                }
+            },
+            {
+                field: 'convertedAtMs',
+                headerName: 'Converted',
+                width: 190,
+                renderCell: ({ row })=>/*#__PURE__*/ _jsx(Typography, {
+                        variant: "body2",
+                        noWrap: true,
+                        children: day(row.convertedAtMs)
+                    })
+            },
+            listActionsColumn((row)=>{
+                var _row_refId;
+                return /*#__PURE__*/ _jsx(ListRowActions, {
+                    label: String((_row_refId = row.refId) != null ? _row_refId : row.$id),
+                    items: [
+                        {
+                            key: 'campaign',
+                            label: 'Open campaign',
+                            icon: /*#__PURE__*/ _jsx(MdiIcon, {
+                                path: mdiEyeOutline.path,
+                                size: 0.8
+                            }),
+                            href: campaignHref(row),
+                            disabled: !campaignHref(row),
+                            /*
+               * Shown disabled with the reason rather than hidden. A control
+               * that vanishes and one that does not apply look identical from
+               * the outside, and only one of them is honest — there is no
+               * campaign document behind a `utm_` label to open.
+               */ disabledReason: 'This came from a tagged link rather than a campaign email, ' + 'so there is no campaign to open'
+                        }
+                    ]
+                });
+            })
+        ], // eslint-disable-next-line react-hooks/exhaustive-deps
+    [
+        kind,
+        basePath
+    ]);
+    const landingColumns = useMemo(()=>[
+            {
+                field: 'path',
+                headerName: 'Page the form was on',
+                flex: 1,
+                minWidth: 240,
+                renderCell: ({ row })=>/*#__PURE__*/ _jsx(Typography, {
+                        variant: "body2",
+                        noWrap: true,
+                        children: row.path
+                    })
+            },
+            {
+                field: 'conversions',
+                headerName: 'Credited submissions',
+                width: 190,
+                align: 'right',
+                headerAlign: 'right',
+                renderCell: ({ row })=>/*#__PURE__*/ _jsx(Typography, {
+                        variant: "body2",
+                        children: Number(row.conversions).toLocaleString()
+                    })
+            }
+        ], []);
+    const kindCopy = CAMPAIGN_CONVERSION_KIND_COPY[kind];
+    return /*#__PURE__*/ _jsx(CardDisplay, {
+        header: "Conversions",
+        subheader: campaignId ? 'Credited to this campaign' : 'What the campaigns caused, one kind at a time',
+        help: conversionsDocsHelp,
+        HeaderProps: {
+            action: campaignId ? /*#__PURE__*/ _jsx(Button, _extends({
+                component: AppLink
+            }, {
+                componentVariant: 'naked',
+                nativeButton: false
+            }, {
+                href: `${basePath}/conversions`,
+                size: "small",
+                color: "primary",
+                children: 'All conversions'
+            })) : undefined
+        },
+        contentGutterX: true,
+        contentGutterY: true,
+        children: /*#__PURE__*/ _jsxs(Stack, {
+            spacing: 2,
+            children: [
+                /*#__PURE__*/ _jsxs(Stack, {
+                    spacing: 1,
+                    children: [
+                        /*#__PURE__*/ _jsx(ToggleButtonGroup, {
+                            exclusive: true,
+                            size: "small",
+                            color: "primary",
+                            value: kind,
+                            onChange: (_event, next)=>{
+                                if (next) setKind(next);
+                            },
+                            "aria-label": "Conversion kind",
+                            children: CAMPAIGN_CONVERSION_KINDS.map((one)=>/*#__PURE__*/ _jsx(ToggleButton, {
+                                    value: one,
+                                    children: CAMPAIGN_CONVERSION_KIND_COPY[one].label
+                                }, one))
+                        }),
+                        /*#__PURE__*/ _jsx(Typography, {
+                            variant: "caption",
+                            color: "text.secondary",
+                            children: 'One kind at a time. The four count different things about the ' + 'same visits — one person filling in one form appears as a ' + 'submission, a contact and a lead — so they are never shown ' + 'together and never added.'
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ _jsx(Divider, {}),
+                campaignId ? /*#__PURE__*/ _jsx(Alert, {
+                    severity: "info",
+                    children: 'This is one campaign’s share. Conversions credited to no ' + 'campaign belong to no campaign, so they are not counted here ' + '— open all conversions for the site-wide figure.'
+                }) : coverage ? /*#__PURE__*/ _jsxs(Section, {
+                    title: `${kindCopy.label} on this site`,
+                    children: [
+                        /*#__PURE__*/ _jsxs(Stack, {
+                            direction: "row",
+                            spacing: 4,
+                            useFlexGap: true,
+                            sx: {
+                                flexWrap: 'wrap'
+                            },
+                            children: [
+                                /*#__PURE__*/ _jsx(Figure, {
+                                    label: "Credited to a campaign",
+                                    value: coverage.attributed,
+                                    note: "from a campaign email or a tagged link"
+                                }),
+                                /*#__PURE__*/ _jsx(Figure, {
+                                    label: "Not credited",
+                                    value: coverage.unattributed,
+                                    note: "arrived directly, or predate attribution"
+                                }),
+                                /*#__PURE__*/ _jsx(Figure, {
+                                    label: `${kindCopy.label} in total`,
+                                    value: coverage.total,
+                                    note: coverage.exact ? 'on this site' : 'on this site, all time'
+                                })
+                            ]
+                        }),
+                        coverage.caveats.map((caveat)=>/*#__PURE__*/ _jsx(Alert, {
+                                severity: "info",
+                                children: caveat.message
+                            }, caveat.id))
+                    ]
+                }) : /*#__PURE__*/ _jsx(Alert, {
+                    severity: "info",
+                    children: 'How many of these were credited to no campaign could not be ' + 'counted, so it is not shown. The lists below are the credited ' + 'ones only and are not a count of everything that happened.'
+                }),
+                /*#__PURE__*/ _jsx(Divider, {}),
+                /*#__PURE__*/ _jsxs(Section, {
+                    title: "From campaign emails",
+                    children: [
+                        /*#__PURE__*/ _jsx(ListTable, {
+                            rows: emailList.rows,
+                            columns: columns,
+                            hideFooter: true,
+                            onOpen: (_id, row)=>{
+                                const href = campaignHref(row);
+                                if (href) router.push(href);
+                            },
+                            noRowsLabel: "Nothing credited to a campaign email",
+                            noRowsDescription: 'A conversion is credited when the visitor followed a link in ' + 'a campaign email before converting.'
+                        }),
+                        /*#__PURE__*/ _jsx(ListPagination, {
+                            page: emailList.page,
+                            pageSize: emailList.pageSize,
+                            rowCount: emailList.rows.length,
+                            hasMore: emailList.hasMore,
+                            onPageChange: emailList.setPage,
+                            onPageSizeChange: emailList.setPageSize
+                        }),
+                        /*#__PURE__*/ _jsx(Typography, {
+                            variant: "caption",
+                            color: "text.secondary",
+                            children: 'Listed in the order they are stored, which is not the order ' + 'they happened in — every row is reachable by paging, but the ' + 'first page is not the most recent conversions.'
+                        })
+                    ]
+                }),
+                campaignId ? null : /*#__PURE__*/ _jsxs(Section, {
+                    title: "From tagged web links",
+                    children: [
+                        /*#__PURE__*/ _jsx(Typography, {
+                            variant: "body2",
+                            color: "text.secondary",
+                            children: 'Credited to the utm_ label on the link the visitor followed. ' + 'These are listed one by one rather than grouped: the label ' + 'is free text with no campaign behind it, so there is ' + 'nothing to open and no fixed set to total.'
+                        }),
+                        /*#__PURE__*/ _jsx(ListTable, {
+                            rows: webList.rows,
+                            columns: columns,
+                            hideFooter: true,
+                            noRowsLabel: "Nothing credited to a tagged link",
+                            noRowsDescription: 'A conversion lands here when the visitor arrived on a URL ' + 'carrying utm_ parameters.'
+                        }),
+                        /*#__PURE__*/ _jsx(ListPagination, {
+                            page: webList.page,
+                            pageSize: webList.pageSize,
+                            rowCount: webList.rows.length,
+                            hasMore: webList.hasMore,
+                            onPageChange: webList.setPage,
+                            onPageSizeChange: webList.setPageSize
+                        })
+                    ]
+                }),
+                kind === 'form' ? /*#__PURE__*/ _jsxs(_Fragment, {
+                    children: [
+                        /*#__PURE__*/ _jsx(Divider, {}),
+                        /*#__PURE__*/ _jsxs(Section, {
+                            title: "Landing pages",
+                            children: [
+                                /*#__PURE__*/ _jsx(Typography, {
+                                    variant: "body2",
+                                    color: "text.secondary",
+                                    children: 'Groups credited form submissions by the page the form was ' + 'on. This reads up to ' + `${LANDING_PAGE_CEILING.toLocaleString()} attribution ` + 'records and their submissions, so it runs when you ask ' + 'for it rather than on every visit.'
+                                }),
+                                /*#__PURE__*/ _jsx(Stack, {
+                                    direction: "row",
+                                    spacing: 1,
+                                    children: /*#__PURE__*/ _jsx(Button, {
+                                        size: "small",
+                                        variant: "contained",
+                                        disabled: landingBusy,
+                                        startIcon: /*#__PURE__*/ _jsx(MdiIcon, {
+                                            path: mdiMapMarkerOutline.path,
+                                            size: 0.8
+                                        }),
+                                        onClick: ()=>void groupByLandingPage(),
+                                        children: landingBusy ? 'Reading…' : 'Group by landing page'
+                                    })
+                                }),
+                                landingError ? /*#__PURE__*/ _jsx(Alert, {
+                                    severity: "warning",
+                                    children: landingError
+                                }) : null,
+                                landing ? /*#__PURE__*/ _jsxs(Stack, {
+                                    spacing: 1,
+                                    children: [
+                                        /*#__PURE__*/ _jsx(Alert, {
+                                            severity: "info",
+                                            children: 'This is the page each form sat on, not the page the ' + 'campaign link landed on — a visitor who arrived on ' + 'one page and submitted on another is counted under ' + 'the second. There is no conversion RATE here either: ' + 'the record carries no count of visits to a page from ' + 'a campaign, so there is no denominator to divide by. ' + 'Only form submissions carry a page at all, so leads, ' + 'contacts and bookings have no landing page.'
+                                        }),
+                                        landing.truncated ? /*#__PURE__*/ _jsx(Alert, {
+                                            severity: "warning",
+                                            children: `More than ${LANDING_PAGE_CEILING.toLocaleString()} ` + 'credited submissions exist. This groups the ' + `${landing.read.toLocaleString()} that were read, ` + 'which are not the most recent — they are the ones ' + 'that came first in storage order.'
+                                        }) : null,
+                                        landing.missing ? /*#__PURE__*/ _jsx(Alert, {
+                                            severity: "info",
+                                            children: `${landing.missing.toLocaleString()} of the ` + `${landing.read.toLocaleString()} credited ` + 'submissions are not grouped: the submission has ' + 'been deleted, or it recorded no page. They are ' + 'reported here rather than filed under a page they ' + 'may not have come from.'
+                                        }) : null,
+                                        /*#__PURE__*/ _jsx(ListTable, {
+                                            rows: landing.rows,
+                                            columns: landingColumns,
+                                            hideFooter: true,
+                                            noRowsLabel: "No pages to group",
+                                            noRowsDescription: "None of the credited submissions recorded a page."
+                                        }),
+                                        /*#__PURE__*/ _jsxs(Stack, {
+                                            direction: "row",
+                                            spacing: 1,
+                                            children: [
+                                                /*#__PURE__*/ _jsx(Chip, {
+                                                    size: "small",
+                                                    variant: "outlined",
+                                                    label: `${landing.read.toLocaleString()} credited submissions read`
+                                                }),
+                                                /*#__PURE__*/ _jsx(Chip, {
+                                                    size: "small",
+                                                    variant: "outlined",
+                                                    label: `${landing.rows.length.toLocaleString()} pages`
+                                                })
+                                            ]
+                                        })
+                                    ]
+                                }) : null
+                            ]
+                        })
+                    ]
+                }) : null
+            ]
+        })
+    });
+}
+CampaignConversionsCard.displayName = 'CampaignConversionsCard';
+export default CampaignConversionsCard;
+
+//# sourceMappingURL=campaign-conversions-card.js.map