@aglyn/plugins-crm 1.0.0-beta.143

package/src/lib/components/contacts-section.js

@@ -0,0 +1,1025 @@
+/**
+ * @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 { CONTACT_LIFECYCLE_STAGE_LABELS, CONTACT_LIFECYCLE_STAGES, CONTACT_SOURCE_LABELS, CRM_CONTACT_VIEW_FIELDS, crmContactCustomColumn, crmViewFiltersFromSegment, crmViewSegmentFilters, newResourceScopeFields, ORG_SCOPE_TOKEN, pluginDocsHelp } from "@aglyn/aglyn";
+import { hiddenFilterVisibility, matchListFilter } from "@aglyn/shared-ui-jsx/const/list-filter";
+import { ListTable } from "@aglyn/shared-ui-jsx/components/list-table.component";
+import { CONTACT_LIST_FILTER_FIELDS, CONTACT_LIST_FILTER_HEADERS, contactCustomFilterFields, contactCustomFilterHeaders } from "../constants/contact-filters.js";
+import { contactPrimaryGroup, contactRecordFromDoc } from "../model/contact-record.js";
+import { useCrmOrgMount } from "../hooks/use-crm-org-mount.js";
+import { crmVisibleToClause, useCrmScope } from "../hooks/use-crm-scope.js";
+import { contactsListSeed } from "../model/contacts-list-seed.js";
+import { crmRoutes } from "../model/crm-routes.js";
+import { contactsCsv, downloadTextFile } from "../model/contacts-csv.js";
+import { useCrmRecordsQuota } from "../hooks/use-crm-records-quota.js";
+import { CardDisplay } from "@aglyn/shared-ui-jsx";
+import EmptyStateComponent from "@aglyn/shared-ui-jsx/components/empty-state.component";
+import ContactsBulkBar from "./contacts-bulk-bar.js";
+import { ContactImportButton } from "./contact-import-drawer.js";
+import { useSnackbar } from "@aglyn/shared-ui-snackstack";
+import { listFilterPlan, useFirestore, useFirestoreCollection, useFirestoreDoc, useUser } from "@aglyn/tenant-feature-instance";
+import { Alert, Button, Dialog, DialogActions, DialogContent, DialogTitle, Stack, TextField, Typography } from "@mui/material";
+import { addDoc, collection, deleteDoc, doc, limit, orderBy, query } from "firebase/firestore";
+import { useRouter, useSearchParams } from "next/navigation";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import RecentActivityFeed from "./recent-activity-feed.js";
+import { CONTACT_FILTER_COLUMNS, CONTACT_OPTIONAL_COLUMNS, contactListColumns } from "./contact-list-columns.js";
+import NewContactDrawer from "./new-contact-drawer.js";
+import { useCrmApi } from "./use-crm-api.js";
+import { useOrgMembers } from "./use-org-members.js";
+import { useContactFieldDefinitions } from "../hooks/use-contact-field-definitions.js";
+import { customFieldColumns } from "./contact-custom-columns.js";
+import { useCrmSavedView } from "../hooks/use-crm-saved-view.js";
+import { useCrmViewGrid } from "../hooks/use-crm-view-grid.js";
+import { CRM_LIST_SLOTS, CrmColumnOrderProvider } from "./crm-column-menu.js";
+import { NoNextActivityToggle } from "./crm-next-activity-column.js";
+import { useCompanyOptions } from "./company-picker.js";
+import CrmFilterBar from "./crm-filter-bar.js";
+import CrmViewsControl from "./crm-views-control.js";
+import { CrmSuiteLockedButton, CrmSuiteNotice, crmSuiteIncluded } from "./crm-suite-lock.js";
+/**
+ * The shared labels, under the name this file has always called them.
+ *
+ * The map lives beside the `ContactSource` union so the dynamic-list rule
+ * editor and this filter cannot disagree about what `order` is called.
+ */ const SOURCE_LABELS = CONTACT_SOURCE_LABELS;
+/**
+ * What the list keeps out of sight until a view says otherwise: the
+ * filter-only columns, which never show, and the optional columns
+ * (AGL-2616), which start hidden and come back through the column menu or
+ * a saved view's column list.
+ */ const HIDDEN_COLUMNS = _extends({}, hiddenFilterVisibility(CONTACT_LIST_FILTER_FIELDS, CONTACT_FILTER_COLUMNS), Object.fromEntries(CONTACT_OPTIONAL_COLUMNS.map((field)=>[
+        field,
+        false
+    ])));
+/**
+ * Why a refund found no contact to record itself against (AGL-2329).
+ *
+ * The three reasons `recordContactRefund` distinguishes, in the operator's
+ * language rather than the writer's enum. They are not interchangeable: two
+ * of them are things the merchant can act on and one is a deletion nothing
+ * should undo, and collapsing them into "unmatched" would turn an actionable
+ * fact into a statistic.
+ */ const UNMATCHED_REFUND_REASON = {
+    'no-email': 'the order carried no email address',
+    'no-contact': 'no contact record matched the buyer',
+    'contact-deleted': 'the contact was deleted between the sale and the refund'
+};
+/**
+ * Contacts CRM (AGL-198): the unified people list fed by AGL-197's
+ * ingestion — search, source badges, a profile drawer with the
+ * interaction timeline plus tags/notes editing, and CSV export. Part of
+ * the CRM, included from Starter (AGL-2851); the contactsPerHost band
+ * counts the records in it.
+ */ /**
+ * Contacts CRM (AGL-109 → AGL-395): the unified contacts list, segments,
+ * and profile drawer, owned by the contacts plugin and rendered by the
+ * shell's generic plugin route. The shell applies the `release_crm`
+ * gate (via the nav tab) and passes the resolved `org` doc for the
+ * `contactsPerHost` quota check.
+ *
+ * Since AGL-2595 this is the `people` SECTION of the Contacts hub rather
+ * than the whole page: `crm-console-page.tsx` routes to it, and the
+ * companies, deals, tasks, reports and fields sections sit beside it. The
+ * body is the v1 page unchanged, and it takes the shell's full prop bag so
+ * nothing the v1 page read has to be threaded through the hub by name.
+ */ export function ContactsPeopleSection(props) {
+    var _ref, _ref1, _ref2, _records_contactsCount, _ref3, _ref4, _ref5, _ref6, _ref7, _filterHeaders_windowClauses__field, _filterHeaders_plan_served_field;
+    var _plan_served;
+    const { hostId, org, releaseFlag, basePath } = props;
+    /*
+   * A row is a LINK now (AGL-2596): opening a person navigates to their own
+   * page rather than a drawer over the list, so the address can be pasted
+   * and every other CRM record can point at it. `basePath` is what the hub
+   * hands every section; the empty fallback only exists for a direct mount
+   * without the shell, where there is nowhere to navigate to anyway.
+   */ const routes = crmRoutes(basePath != null ? basePath : '');
+    const router = useRouter();
+    // Whether the audience overage on this page is actually INVOICED
+    // (AGL-1662), and whether that question has been answered yet.
+    //
+    // AGL-1604 stopped the usage cron putting `contactsOverageUsd` into
+    // `billedCents` while `release_crm` is off for the org; `db5ecdf2b`
+    // taught the console billing page's caption the same thing. This page's own
+    // alert still quoted the dollar figure with no flag check — and this is the
+    // surface a staff member reaches with the flag OFF, because the shell's
+    // `FeatureGate` admits them on `visible` (`released || isStaff`). Support
+    // then reads that number back to a customer whose invoice will not carry it.
+    //
+    // The shell resolves this from `released`, never `visible`: staff opening a
+    // page does not put a line on the customer's bill.
+    //
+    // Both default to the WITHHELD answer when the prop is absent, which only
+    // happens in a direct mount — the shell always supplies it for a surface
+    // with a nav-tab flag. A caller that has not resolved the verdict has not
+    // earned the right to quote a charge.
+    const contactsBilled = (_ref = releaseFlag == null ? void 0 : releaseFlag.released) != null ? _ref : false;
+    const releaseFlagsReady = (_ref1 = releaseFlag == null ? void 0 : releaseFlag.ready) != null ? _ref1 : false;
+    // Org-shared data root (AGL-237). Null until the org lookup settles
+    // (AGL-1061), and for a host with no owning org — the pre-migration host
+    // path this used to fall back to is gone (AGL-1050), so the CRM lists
+    // nothing rather than listing somewhere else. Resolved by the one scope
+    // hook (AGL-2614), which also answers for the organization-level mount
+    // (AGL-2630): there `hostId` is null, the org comes from the hub's mount,
+    // and the viewing group and the scope clause are both `null`.
+    const crmScope = useCrmScope({
+        hostId,
+        org
+    });
+    const { scope: dataScope, orgId, consentGroup, visibleTo: visibleToTokens } = crmScope;
+    /*
+   * THE CRM (AGL-2788). This list is the CRM's, and the shell mounts no CRM
+   * page for a plan without it (AGL-2851). The locks below — adding a person
+   * by hand, importing a file, a saved view, the owner, stage and company of
+   * a selection — draw only for an org whose plan lacks the CRM. The shell
+   * mounts this page only once the org has settled, so the plan read here
+   * is an answer.
+   */ const suiteIncluded = crmSuiteIncluded(org);
+    // The org's site list, at the organization level only — what names the
+    // sites in the "Known by" column (AGL-2630).
+    const mount = useCrmOrgMount();
+    // The org's custom fields, for the optional columns below (AGL-2601).
+    const customFields = useContactFieldDefinitions((_ref2 = dataScope == null ? void 0 : dataScope[1]) != null ? _ref2 : null);
+    /*==========================================
+   * THE CONTROLLER THIS PAGE IS SHOWING.
+   *
+   * A contact document is shared by every site in the org — one human who
+   * touched two sites is one row, which is the dedupe the shared address book
+   * exists for and the reason the org is billed once for them. Almost nothing
+   * ON that row is shared: the notes, tags, timeline and lifetime value are
+   * the holder's own business records, and while they lived at the top of the
+   * document every site in an agency's account could read every client's.
+   *
+   * So the page resolves the group it is being viewed as — the sites declared
+   * to be one sender, or this site alone — and reads that group's facet.
+   * Pure, from the org document the shell already passed, so it costs no
+   * read. `consentGroup` above is that group; at the ORGANIZATION level it
+   * is `null`, and each row is flattened through the person's own primary
+   * holder instead (`contactPrimaryGroup`), so an org-wide member reads the
+   * profile the first capturing site keeps — and the "Known by" column says
+   * which other sites hold one.
+   *=========================================*/ const firestore = useFirestore();
+    const { enqueueSnackbar } = useSnackbar();
+    const { data: user } = useUser();
+    /*
+   * WHAT THE LIST WAS OPENED FOR (AGL-2612).
+   *
+   * Two surfaces address this list with a question rather than a record: a
+   * form's own page ("who came in through this form") and an Inbox
+   * submission row ("open the person with this address"). Both arrive as
+   * query keys, parsed once into the same filter the grid's panel would
+   * produce, so the seeded query IS a typed query and nothing here is a
+   * second predicate.
+   */ const searchParams = useSearchParams();
+    const seed = useMemo(()=>contactsListSeed(searchParams), [
+        searchParams
+    ]);
+    /*
+   * The seed as CLAUSES, in front of everything else (AGL-2617).
+   *
+   * A view holds a list of clauses in the grammar the grid's panel speaks,
+   * and the seed is two of them — the form's captures and the address, plus
+   * the source the form link names. They lead every state the list works
+   * from, whichever view is open, so the query serves the seed (it reaches
+   * the whole collection, as it did before views) and a view narrows what
+   * comes back. The controller keeps them out of what a view SAVES.
+   */ const seedFilters = useMemo(()=>[
+            ...seed.filter ? [
+                seed.filter
+            ] : [],
+            ...seed.source ? [
+                {
+                    field: CRM_CONTACT_VIEW_FIELDS.source,
+                    op: 'equals',
+                    value: seed.source
+                }
+            ] : []
+        ], [
+        seed
+    ]);
+    const viewInitial = useMemo(()=>({
+            filters: seedFilters
+        }), [
+        seedFilters
+    ]);
+    const views = useCrmSavedView({
+        section: 'contacts',
+        hostId,
+        org,
+        basePath: basePath != null ? basePath : '',
+        initial: viewInitial
+    });
+    /*
+   * The grammar this list speaks: the declared fields, and one field per
+   * custom contact field the org has defined — so a view can filter on
+   * "plan is enterprise" the way it filters on a stage.
+   */ const filterFields = useMemo(()=>[
+            ...CONTACT_LIST_FILTER_FIELDS,
+            ...contactCustomFilterFields(customFields.active)
+        ], [
+        customFields.active
+    ]);
+    const filterHeaders = useMemo(()=>_extends({}, CONTACT_LIST_FILTER_HEADERS, contactCustomFilterHeaders(customFields.active)), [
+        customFields.active
+    ]);
+    /*
+   * ONE clause on the query, the rest over the window.
+   *
+   * Firestore takes one array clause per query and composes the rest only
+   * through indexes nobody built for every pair of columns, so the first
+   * clause the translator can serve is the one that reaches every contact
+   * and every other narrows the thousand the query returned. The caption
+   * under the bar says which is which; the chips mark the served one.
+   */ const plan = useMemo(()=>listFilterPlan(filterFields, views.state.filters), [
+        filterFields,
+        views.state.filters
+    ]);
+    const filter = plan.served;
+    /**
+   * The one filter that cannot carry the scope clause.
+   *
+   * `formIds` is an `array-contains` on the mirror, and Firestore takes one
+   * array clause per query — so this listener drops its `visibleTo`
+   * predicate for it, exactly as the company contacts card does for
+   * `companyIds`, and the rules then admit the read to an org-wide member
+   * only. A scoped member's listener errors instead of listing, and the
+   * alert below says so rather than showing an empty form.
+   */ const byForm = (filter == null ? void 0 : filter.field) === 'formIds';
+    const { data: contactDocs, status: contactsStatus, /**
+     * The rows the profile drawer is seeded from are unconfirmed by the
+     * server (AGL-1358). This payload is narrower than most sites in this
+     * issue — `email`, `sources` and `interactions` are not in it — but the
+     * two fields that are, `tags` and `notes`, are BOTH written on every
+     * save and both come off the seed. Edit the notes against a cached read
+     * and the tags go back with them, and tags are what
+     * `contactMatchesSegment` runs on: a saved segment is a campaign
+     * audience, so a rollback here silently changes who gets emailed.
+     */ fromCache: contactsFromCache } = useFirestoreCollection(()=>{
+        if (!dataScope) return null;
+        /*
+       * ORDERED, and filtered by the QUERY (AGL-2501, AGL-2292).
+       *
+       * Two bugs shared this one line. `limit(1000)` with no `orderBy` returns
+       * documents in ID order — contacts are created with `.add()` and
+       * `createResourceUid()`, so that is a pseudo-random SAMPLE of a thousand,
+       * and the client `.sort()` below made it look reliably newest-first. An
+       * org with forty thousand contacts saw a thousand arbitrary ones,
+       * convincingly sorted.
+       *
+       * The search then ran over that sample, so a name on the wrong side of
+       * the cap answered "no contacts match" — the answer a search must never
+       * give wrongly, on the list a merchant uses to find one person.
+       *
+       * The cap STAYS: nobody needs forty thousand rows streamed into a table,
+       * and the head-count has been a server aggregate since AGL-1706. What
+       * changes is that the thousand are now the newest thousand, and that a
+       * filter reaches the whole collection before the cap applies.
+       */ const constraints = plan.constraints;
+        /*
+       * SCOPED, and this is the leak it closes.
+       *
+       * The listener had no `where()` at all: `hostId` reached it only to
+       * resolve which ORG owns the data, so every site in the account listed
+       * every contact in the account. An agency's client opened Contacts and
+       * read the other clients' customers.
+       *
+       * `array-contains-any` over the group's tokens is the same predicate
+       * the rules evaluate with `hasAny`, so a filtered query is provable
+       * per-document and an UNFILTERED one is now permission-denied rather
+       * than quietly returning everything.
+       */ return query(collection(firestore, dataScope[0], dataScope[1], 'contacts'), // Dropped for the form mirror alone — see `byForm` — and absent at
+        // the organization level, where the tokens are `null` (AGL-2630).
+        ...byForm ? [] : crmVisibleToClause(visibleToTokens), ...constraints != null ? constraints : [
+            orderBy('updatedAt', 'desc')
+        ], limit(1000));
+    }, [
+        firestore,
+        dataScope,
+        plan.constraints,
+        byForm,
+        visibleToTokens
+    ], {
+        idField: '$id'
+    });
+    /*
+   * OPENED FOR ONE ADDRESS: move straight on to the record (AGL-2612).
+   *
+   * The Inbox links here with an email because a contact's id is minted at
+   * capture and nothing outside the CRM holds it; the list is the lookup.
+   * Once the seeded `email equals` query has answered with exactly one row,
+   * that row is the person and the list is a detour — `replace`, so Back
+   * returns to the Inbox rather than to this redirect. Nothing else
+   * navigates: no match leaves the filtered list on screen, which is the
+   * honest answer for a submission whose contact the band dropped, and a
+   * filter the reader has since changed is theirs.
+   */ const openedByEmail = useRef(false);
+    useEffect(()=>{
+        if (openedByEmail.current || !seed.openEmail) return;
+        if (contactsStatus !== 'success') return;
+        if ((filter == null ? void 0 : filter.field) !== 'email' || filter.value !== seed.openEmail) return;
+        const only = (contactDocs != null ? contactDocs : []).length === 1 ? contactDocs == null ? void 0 : contactDocs[0] : null;
+        if (!only) return;
+        openedByEmail.current = true;
+        router.replace(routes.contact(String(only.$id)));
+    }, [
+        seed.openEmail,
+        contactsStatus,
+        filter,
+        contactDocs,
+        router,
+        routes
+    ]);
+    /**
+   * Every row, flattened through THIS group's facet.
+   *
+   * One projection rather than a facet read at each of the nine places that
+   * touch `tags`, `notes`, `name` or `interactions`: a surface that reads one
+   * of them off the top of the document is a surface showing another
+   * holder's records, and nine chances to forget is nine leaks.
+   *
+   * The canonical `name` is the fallback and the shared identity; a holder's
+   * own override wins, so one business renaming a person cannot change what
+   * an unrelated business sees.
+   */ const contacts = useMemo(()=>(contactDocs != null ? contactDocs : []).map((row)=>contactRecordFromDoc(row, consentGroup != null ? consentGroup : contactPrimaryGroup(row, org))), [
+        contactDocs,
+        consentGroup,
+        org
+    ]);
+    /*
+   * The roster, for the Owner column — read only once a loaded row actually
+   * carries an owner. A list of people nobody has assigned never pays for
+   * the team list, and the create drawer asks for it in its own right.
+   */ const [createOpen, setCreateOpen] = useState(false);
+    /*
+   * The filter bar's pickers name people and companies, so the roster is
+   * also read once the reader has reached for a filter, or is looking at a
+   * view that names an owner or a company (AGL-2617).
+   */ const [filterOpened, setFilterOpened] = useState(false);
+    const namesFilter = views.state.filters.some((clause)=>clause.field === CRM_CONTACT_VIEW_FIELDS.owner || clause.field === CRM_CONTACT_VIEW_FIELDS.company);
+    const members = useOrgMembers(orgId, {
+        enabled: createOpen || filterOpened || namesFilter || contacts.some((contact)=>Boolean(contact.ownerUid))
+    });
+    /**
+   * The HEAD-COUNT, read as a server-side aggregate (AGL-1706).
+   *
+   * The listener above is `limit(1000)` and always will be — nobody needs
+   * 40,000 rows streamed into a table. What it must not do is answer "how
+   * many contacts does this org have", and it did: `contacts.length`
+   * saturated at 1,000, which is *exactly* the smallest paid included band
+   * (`starter`). So `overageContacts = max(0, used − included)` was 0 on
+   * every stock plan and the alert below could not render at all.
+   *
+   * Worse than the dead alert, the same capped number fed the readout in the
+   * toolbar. An org with 40,000 contacts on Pro read "1,000 contacts ·
+   * 10,000 included" — a page whose job is telling a customer where they sit
+   * in their band, telling them they have room they do not have. The console
+   * billing page read the truth from `getCountFromServer` on this very
+   * collection, so the two surfaces disagreed about the same org's audience.
+   *
+   * THE LIST AND THE COUNT ARE DIFFERENT QUESTIONS and now have different
+   * answers: one aggregate read per mount, the same call
+   * `billing-usage.component.tsx` already makes against the same path.
+   *
+   * The counting RULE is untouched — `checkCrmRecordsQuota` is an
+   * entitlement input and the usage cron is what bills from it. Only this
+   * page's input stopped being a saturated one.
+   *
+   * THE BAND IS THE RECORDS BAND (AGL-2611): contacts, companies and deals
+   * together, so the alert below is fed the sum of three aggregates while
+   * the readout beside the toolbar keeps the people count — a workspace
+   * whose hundred records are ninety companies is told it holds ten
+   * contacts and that its band is full, which are both true. The three
+   * reads and the fallback rule live in `useCrmRecordsQuota`, shared with
+   * the company and deal drawers so every door on this hub refuses on the
+   * same number.
+   */ const records = useCrmRecordsQuota(dataScope, org, {
+        contactsFallback: contacts.length
+    });
+    // Pending or denied, the listener length stands in. It can only UNDERSTATE
+    // (it is the same collection, capped), never overstate, so no alert this
+    // number gates can fire on a count larger than the truth.
+    const contactCount = (_records_contactsCount = records.contactsCount) != null ? _records_contactsCount : contacts.length;
+    // Records bands (AGL-890): a plan with an overage rate meters past the
+    // included count instead of blocking; a plan without one hard-bands
+    // (quota.allowed = false).
+    const quota = records.quota;
+    // Signups whose CRM record was dropped at a hard band (AGL-891), Free's
+    // included: capture still fills that band on a plan without the CRM.
+    // Written by upsert-contact, host-scoped.
+    // Host-scoped, so absent at the organization level (AGL-2630): the
+    // counter is a fact about one site's capture, and summing thirty of them
+    // would be a figure about nothing in particular.
+    const { data: droppedCounter } = useFirestoreDoc(()=>hostId ? doc(firestore, 'hosts', hostId, 'counters', 'contactsDropped') : null, [
+        firestore,
+        hostId
+    ]);
+    const droppedTotal = Number((_ref3 = droppedCounter == null ? void 0 : droppedCounter['total']) != null ? _ref3 : 0);
+    /*==========================================
+   * REFUNDS THAT REACHED NO CONTACT (AGL-2329).
+   *
+   * `recordContactRefund` refuses to create a contact for a refund — a
+   * contact holding a refund and no purchase is a phantom record with
+   * negative lifetime value — and increments
+   * `hosts/{hostId}/counters/contactRefundsUnmatched` instead. Its own
+   * comment says the shape mirrors `contactsDropped` "so an operator…", and
+   * there the sentence stops: `contactsDropped` had this reader and the
+   * refund counter had none, so a refund that reached no contact record
+   * incremented a number nobody could see.
+   *
+   * It sits beside the dropped-signup alert because they are the same kind
+   * of fact — something that happened to this host's CRM and left no row —
+   * and an operator reconciling their contact list needs both or neither.
+   *=========================================*/ const { data: unmatchedRefundCounter } = useFirestoreDoc(()=>hostId ? doc(firestore, 'hosts', hostId, 'counters', 'contactRefundsUnmatched') : null, [
+        firestore,
+        hostId
+    ]);
+    const unmatchedRefundTotal = Number((_ref4 = unmatchedRefundCounter == null ? void 0 : unmatchedRefundCounter['total']) != null ? _ref4 : 0);
+    const unmatchedRefundReason = String((_ref5 = unmatchedRefundCounter == null ? void 0 : unmatchedRefundCounter['lastReason']) != null ? _ref5 : '');
+    // Saved segments (AGL-199): reusable audience filters.
+    const { data: segmentDocs } = useFirestoreCollection(()=>dataScope ? query(collection(firestore, dataScope[0], dataScope[1], 'contactSegments'), limit(50)) : null, [
+        firestore,
+        dataScope
+    ], {
+        idField: '$id'
+    });
+    const segments = useMemo(()=>[
+            ...segmentDocs != null ? segmentDocs : []
+        ].sort((a, b)=>{
+            var _a_name, _b_name;
+            return String((_a_name = a.name) != null ? _a_name : '').localeCompare(String((_b_name = b.name) != null ? _b_name : ''));
+        }), [
+        segmentDocs
+    ]);
+    /*
+   * Every saved segment, offered in the views menu as a view (AGL-2617):
+   * choosing one puts its tag and source clauses on the filter bar. A
+   * segment can only have come FROM an org scope, so the delete is
+   * unreachable without one in practice — but the scope is nullable
+   * (AGL-1050) and an unguarded deref would be a crash rather than a no-op
+   * if that ever stopped being true.
+   */ const segmentPresets = useMemo(()=>segments.map((segment)=>{
+            var _segment_name, _segment_tags, _segment_sources;
+            return {
+                id: String(segment.$id),
+                label: String((_segment_name = segment.name) != null ? _segment_name : ''),
+                filters: crmViewFiltersFromSegment({
+                    tags: (_segment_tags = segment.tags) != null ? _segment_tags : [],
+                    sources: (_segment_sources = segment.sources) != null ? _segment_sources : []
+                }),
+                onRemove: dataScope ? ()=>deleteDoc(doc(firestore, dataScope[0], dataScope[1], 'contactSegments', String(segment.$id))) : undefined
+            };
+        }), [
+        segments,
+        dataScope,
+        firestore
+    ]);
+    /*
+   * THE WINDOW CLAUSES narrow in the browser, and the caption says so.
+   *
+   * An owner, a stage, a source, a company and a custom value all live on
+   * the viewing group's FACET, and a facet path is per group, so none of
+   * them is a field the query grammar can reach without an index per
+   * group; a second tag clause, or "any of these tags", is an array clause
+   * the scope predicate already occupies. So every clause the plan could
+   * not serve refines the ordered window rather than the collection —
+   * through the same matcher the grammar declares, so a chip and the rows
+   * under it agree. Ordinary orgs load their whole list into the window
+   * anyway; the caption below says what these narrow for the ones that do
+   * not.
+   */ const uid = (_ref6 = user == null ? void 0 : user.uid) != null ? _ref6 : '';
+    const windowClauses = plan.window;
+    const visible = useMemo(()=>windowClauses.length ? contacts.filter((contact)=>windowClauses.every((clause)=>matchListFilter(contact, filterFields, clause))) : contacts, [
+        contacts,
+        windowClauses,
+        filterFields
+    ]);
+    /*
+   * The choices the filter bar picks from. The companies are read only once
+   * the reader has reached for a filter or is looking at a view that names
+   * one — a read a list nobody is narrowing should not pay for, the same
+   * bargain the roster gets above. A stage and a source are fixed lists and
+   * cost nothing; a custom `select` field offers its own options.
+   */ const companies = useCompanyOptions({
+        hostId,
+        org,
+        enabled: filterOpened || namesFilter
+    });
+    const filterOptions = useMemo(()=>_extends({
+            [CRM_CONTACT_VIEW_FIELDS.owner]: [
+                ...uid ? [
+                    {
+                        value: uid,
+                        label: 'Me'
+                    }
+                ] : [],
+                ...members.options.filter((option)=>option.uid !== uid).map((option)=>({
+                        value: option.uid,
+                        label: option.label
+                    }))
+            ],
+            [CRM_CONTACT_VIEW_FIELDS.stage]: CONTACT_LIFECYCLE_STAGES.map((stage)=>({
+                    value: stage,
+                    label: CONTACT_LIFECYCLE_STAGE_LABELS[stage]
+                })),
+            [CRM_CONTACT_VIEW_FIELDS.source]: Object.entries(SOURCE_LABELS).map(([value, label])=>({
+                    value,
+                    label
+                })),
+            [CRM_CONTACT_VIEW_FIELDS.company]: companies.options.map((company)=>({
+                    value: company.id,
+                    label: company.name
+                }))
+        }, Object.fromEntries(customFields.active.filter((definition)=>{
+            var _definition_options;
+            return definition.type === 'select' && ((_definition_options = definition.options) == null ? void 0 : _definition_options.length);
+        }).map((definition)=>{
+            var _definition_options;
+            return [
+                crmContactCustomColumn(definition.key),
+                ((_definition_options = definition.options) != null ? _definition_options : []).map((option)=>({
+                        value: option,
+                        label: option
+                    }))
+            ];
+        }))), [
+        uid,
+        members.options,
+        companies.options,
+        customFields.active
+    ]);
+    /* One row grammar, the console's (AGL-2501) — the same table everywhere. */ const contactColumns = useMemo(()=>[
+            ...contactListColumns({
+                memberName: members.memberName,
+                // "Known by", at the organization level only (AGL-2630).
+                siteName: mount ? mount.siteName : undefined
+            }),
+            // The org's custom fields as optional columns (AGL-2601).
+            ...customFieldColumns(customFields.active)
+        ], [
+        members.memberName,
+        mount,
+        customFields.active
+    ]);
+    /*
+   * The grid's column and sort models are the VIEW'S (AGL-2617). The
+   * filter-only hidden columns — the declared fields that are not table
+   * columns, never the custom ones, which are shown — stay hidden whatever
+   * a view says, so a saved arrangement cannot unhide a strip of blank
+   * cells.
+   */ const grid = useCrmViewGrid(views, contactColumns, HIDDEN_COLUMNS);
+    /*
+   * A SEGMENT IS A VIEW'S TAG AND SOURCE CLAUSES, kept where a campaign
+   * can reach them (AGL-2617).
+   *
+   * The segment stays: it is what a campaign audience and a dynamic list
+   * resolve, and `contactMatchesSegment` is the one predicate both the
+   * console and the sender read. What changed is where it comes from — the
+   * filter bar's tag and source clauses, read back through
+   * `crmViewSegmentFilters`, so "Save as segment" is offered exactly when
+   * the working filters hold something a segment can hold. Each saved
+   * segment is offered in the views menu as a preset, and applying one
+   * puts its clauses on the bar, where they can be narrowed further and
+   * saved as a view.
+   */ const segmentFilters = useMemo(()=>crmViewSegmentFilters(views.state.filters), [
+        views.state.filters
+    ]);
+    const [segmentName, setSegmentName] = useState(null);
+    const handleSaveSegment = useCallback(async ()=>{
+        const name = (segmentName != null ? segmentName : '').trim().slice(0, 60);
+        // No org, no place to put it (AGL-1050). The button is disabled in
+        // this state; the guard is here so the callback cannot outlive it.
+        if (!name || !segmentFilters || !dataScope) return;
+        setSegmentName(null);
+        try {
+            var _segmentFilters_tags, _segmentFilters_sources;
+            await addDoc(collection(firestore, dataScope[0], dataScope[1], 'contactSegments'), _extends({
+                name,
+                tags: (_segmentFilters_tags = segmentFilters.tags) != null ? _segmentFilters_tags : [],
+                sources: (_segmentFilters_sources = segmentFilters.sources) != null ? _segmentFilters_sources : []
+            }, newResourceScopeFields([
+                ORG_SCOPE_TOKEN
+            ]), {
+                createdAt: new Date()
+            }));
+            enqueueSnackbar(`Segment "${name}" saved — usable as a campaign audience`, {
+                variant: 'success',
+                persist: false
+            });
+        } catch (error) {
+            console.error(error);
+            enqueueSnackbar('An error has occurred', {
+                variant: 'error',
+                allowDuplicate: true
+            });
+        }
+    }, [
+        segmentName,
+        segmentFilters,
+        firestore,
+        dataScope,
+        enqueueSnackbar
+    ]);
+    /** The rows ticked for a bulk action (AGL-2603); the bar above the table acts on them. */ const [selectedIds, setSelectedIds] = useState([]);
+    /*==========================================
+   * ADDING ONE PERSON BY HAND (AGL-2596).
+   *
+   * Through the plugin's server route rather than a client write, because
+   * creating a contact is the one act on this surface the rules cannot fully
+   * judge: the dedupe against every holder's rows is a lookup the capturing
+   * site may not read, and the audience band is a count the browser cannot
+   * take. The route answers `{ contactId, created }`; a merge onto somebody
+   * already in the address book is not an error, and the page says which
+   * happened before it opens the record.
+   *=========================================*/ // The site the route resolves the org from and stamps the record with: the
+    // mounted site, or at the organization level the one the drawer's picker
+    // named (AGL-2630) — the drawer holds its submit until it is known.
+    const crmApi = useCrmApi(crmScope.createHostId);
+    const [createBusy, setCreateBusy] = useState(false);
+    const [createError, setCreateError] = useState(null);
+    const handleCreate = useCallback(async (values)=>{
+        setCreateBusy(true);
+        setCreateError(null);
+        try {
+            var _payload_contactId;
+            const { response, payload } = await crmApi('contacts-create', _extends({
+                email: values.email
+            }, values.name ? {
+                name: values.name
+            } : {}, values.phone ? {
+                phone: values.phone
+            } : {}, values.jobTitle ? {
+                jobTitle: values.jobTitle
+            } : {}, values.companyName ? {
+                companyName: values.companyName
+            } : {}, values.companyId ? {
+                companyId: values.companyId
+            } : {}, values.address ? {
+                address: values.address
+            } : {}, values.ownerUid ? {
+                ownerUid: values.ownerUid
+            } : {}, values.lifecycleStage ? {
+                lifecycleStage: values.lifecycleStage
+            } : {}, values.tags.length ? {
+                tags: values.tags
+            } : {}, {
+                marketingConsent: values.marketingConsent
+            }));
+            if (!response.ok) {
+                var _payload_error;
+                // The route's own sentence, shown above the form unchanged: the
+                // band refusal is the list's wording, and a field refusal names
+                // the field.
+                setCreateError(String((_payload_error = payload['error']) != null ? _payload_error : 'The contact could not be added.'));
+                return;
+            }
+            const contactId = String((_payload_contactId = payload['contactId']) != null ? _payload_contactId : '');
+            // The activity entry is the route's (AGL-2622): it verified the
+            // caller and performed the write, so it is the one writer that
+            // cannot record an add that did not happen — and a second entry
+            // from here would put two rows on one act.
+            enqueueSnackbar(payload['created'] ? 'Contact added' : 'Already a contact — what you entered was merged into their record', {
+                variant: 'success',
+                persist: false
+            });
+            setCreateOpen(false);
+            if (contactId) router.push(routes.contact(contactId));
+        } catch (error) {
+            console.error(error);
+            setCreateError('The contact could not be added.');
+        } finally{
+            setCreateBusy(false);
+        }
+    }, [
+        crmApi,
+        enqueueSnackbar,
+        router,
+        routes
+    ]);
+    /*
+   * The file is `contactsCsv()`'s — every CRM column, the owner by address,
+   * one column per custom field — and the same options reach the bulk bar,
+   * so the table's export and the selection's are one file over two row
+   * sets (AGL-2621).
+   */ const csvOptions = useMemo(()=>({
+            ownerEmail: members.memberEmail,
+            customFields: customFields.active
+        }), [
+        members.memberEmail,
+        customFields.active
+    ]);
+    const handleExport = useCallback(()=>{
+        downloadTextFile('contacts.csv', 'text/csv', contactsCsv(visible, csvOptions));
+    }, [
+        visible,
+        csvOptions
+    ]);
+    return /*#__PURE__*/ _jsxs(_Fragment, {
+        children: [
+            /*#__PURE__*/ _jsx(CardDisplay, {
+                header: 'Contacts',
+                help: pluginDocsHelp('contacts', {
+                    anchor: '#the-contacts-page'
+                }),
+                contentGutterX: true,
+                contentGutterY: true,
+                children: /*#__PURE__*/ _jsxs(Stack, {
+                    spacing: 2,
+                    children: [
+                        /*#__PURE__*/ _jsxs(Stack, {
+                            direction: "row",
+                            spacing: 1,
+                            sx: {
+                                alignItems: 'center',
+                                flexWrap: 'wrap',
+                                rowGap: 1
+                            },
+                            children: [
+                                /*#__PURE__*/ _jsx(Typography, {
+                                    variant: "body2",
+                                    color: "text.secondary",
+                                    sx: {
+                                        flex: 1
+                                    },
+                                    children: `${contactCount.toLocaleString()} contacts · ${Number.isFinite(quota.included) ? `${quota.used.toLocaleString()} of ${quota.included.toLocaleString()} CRM records` : `${quota.used.toLocaleString()} CRM records`}`
+                                }),
+                                suiteIncluded ? /*#__PURE__*/ _jsx(ContactImportButton, {
+                                    hostId: hostId,
+                                    org: org
+                                }) : /*#__PURE__*/ _jsx(CrmSuiteLockedButton, {
+                                    children: 'Import CSV'
+                                }),
+                                /*#__PURE__*/ _jsx(Button, {
+                                    size: "small",
+                                    onClick: handleExport,
+                                    disabled: !visible.length,
+                                    children: 'Export CSV'
+                                }),
+                                suiteIncluded ? /*#__PURE__*/ _jsx(Button, {
+                                    size: "small",
+                                    variant: "contained",
+                                    color: "primary",
+                                    disabled: !dataScope,
+                                    onClick: ()=>{
+                                        setCreateError(null);
+                                        setCreateOpen(true);
+                                    },
+                                    children: 'New contact'
+                                }) : /*#__PURE__*/ _jsx(CrmSuiteLockedButton, {
+                                    variant: "contained",
+                                    color: "primary",
+                                    children: 'New contact'
+                                })
+                            ]
+                        }),
+                        suiteIncluded ? null : /*#__PURE__*/ _jsx(CrmSuiteNotice, {
+                            children: 'Contacts arrive here on their own from your forms, sign-ups, ' + 'orders and bookings. Adding one by hand, importing a CSV, ' + "saved views, and a contact's owner, stage and company are " + 'part of the CRM.'
+                        }),
+                        /*#__PURE__*/ _jsxs(Stack, {
+                            spacing: 1,
+                            children: [
+                                /*#__PURE__*/ _jsx(CrmViewsControl, {
+                                    controller: views,
+                                    allLabel: "All contacts",
+                                    suiteLocked: !suiteIncluded,
+                                    presets: segmentPresets,
+                                    onSaveAsSegment: segmentFilters && dataScope ? ()=>setSegmentName('') : null
+                                }),
+                                /*#__PURE__*/ _jsx(CrmFilterBar, {
+                                    fields: filterFields,
+                                    headers: filterHeaders,
+                                    clauses: views.state.filters,
+                                    onChange: views.setFilters,
+                                    options: filterOptions,
+                                    servedField: (_ref7 = (_plan_served = plan.served) == null ? void 0 : _plan_served.field) != null ? _ref7 : null,
+                                    onOpen: ()=>setFilterOpened(true)
+                                }),
+                                /*#__PURE__*/ _jsx(Stack, {
+                                    direction: "row",
+                                    children: /*#__PURE__*/ _jsx(NoNextActivityToggle, {
+                                        filters: views.state.filters,
+                                        onChange: views.setFilters
+                                    })
+                                })
+                            ]
+                        }),
+                        !quota.allowed ? /*#__PURE__*/ _jsx(Alert, {
+                            severity: "warning",
+                            children: 'CRM records limit reached — new visitors are no longer ' + 'captured' + (droppedTotal > 0 ? ` (${droppedTotal.toLocaleString()} missed so far)` : '') + '. Upgrade in Billing to keep collecting.'
+                        }) : quota.overageRecords > 0 && quota.overageRateUsd != null && // No claim about money until the verdict that decides it has
+                        // settled (AGL-1662). Before Remote Config activation the flag
+                        // reads its registry default, which is no org's verdict, so an
+                        // ungated alert could assert the wrong wording for one paint.
+                        releaseFlagsReady ? /*#__PURE__*/ _jsx(Alert, {
+                            severity: "info",
+                            children: contactsBilled ? // basis (AGL-2399): the count here is LIVE, the invoice
+                            // charges the last reading before the month closes, so the
+                            // dollar figure is a projection until the month ends. Staff
+                            // and customer must not read different sentences about the
+                            // same org's money — that applies to WHEN it is measured as
+                            // much as to how much.
+                            `${quota.overageRecords.toLocaleString()} CRM records over ` + `your plan's included ${quota.included.toLocaleString()} — ` + `metered at $${quota.overageRateUsd}/1,000 per month ` + `(≈$${quota.overageMonthlyUsd.toFixed(2)} if your list ends ` + 'the month at this size). ' + 'Upgrade in Billing for a larger included audience.' : // itself the wording `1a2aed5cb` published to
+                            // `billing-and-plans/overview.md` (AGL-1601/1603). Staff and
+                            // customer must not read different sentences about the same
+                            // org's money.
+                            //
+                            // THE COUNT STAYS, THE TOTAL GOES: the head-count is real —
+                            // ingestion captured those records — and is not a claim
+                            // about money. The upgrade nudge goes with the total, since
+                            // it prompts a purchase premised on a charge that is not
+                            // happening.
+                            `${quota.overageRecords.toLocaleString()} CRM records over ` + `your plan's included ${quota.included.toLocaleString()} — ` + 'not billed while the CRM is unavailable. ' + `The $${quota.overageRateUsd}/1,000 rate applies once ` + 'Contacts opens.'
+                        }) : droppedTotal > 0 ? /*#__PURE__*/ _jsx(Alert, {
+                            severity: "info",
+                            children: `${droppedTotal.toLocaleString()} earlier visitor${droppedTotal === 1 ? ' was' : 's were'} not captured while your CRM records band was full.`
+                        }) : null,
+                        unmatchedRefundTotal > 0 ? /*#__PURE__*/ _jsx(Alert, {
+                            severity: "warning",
+                            children: `${unmatchedRefundTotal.toLocaleString()} refund${unmatchedRefundTotal === 1 ? '' : 's'} could not be recorded against a contact${UNMATCHED_REFUND_REASON[unmatchedRefundReason] ? ` — most recently because ${UNMATCHED_REFUND_REASON[unmatchedRefundReason]}` : ''}. The money moved; the customer's timeline does not show it.`
+                        }) : null,
+                        byForm && contactsStatus === 'error' ? /*#__PURE__*/ _jsx(Alert, {
+                            severity: "info",
+                            children: 'The contacts this form captured could not be listed. Your ' + 'access is limited to specific sites, and a form filter ' + 'cannot be narrowed to them — an organization administrator ' + 'can see it.'
+                        }) : contacts.length === 0 && filter ? /*#__PURE__*/ _jsx(Typography, {
+                            variant: "body2",
+                            color: "text.secondary",
+                            children: contactsStatus === 'loading' ? 'Loading…' : 'No contacts match this filter.'
+                        }) : contacts.length === 0 ? /*#__PURE__*/ _jsx(EmptyStateComponent, {
+                            label: contactsStatus === 'loading' ? 'Loading contacts…' : 'No contacts yet',
+                            description: contactsStatus === 'loading' ? undefined : suiteIncluded ? 'Form submissions, member sign-ups, orders and bookings become contacts on their own; add one by hand or bring a list in from a CSV.' : 'Form submissions, member sign-ups, orders and bookings become contacts on their own.',
+                            action: contactsStatus === 'loading' ? undefined : !suiteIncluded ? /*#__PURE__*/ _jsxs(Stack, {
+                                direction: "row",
+                                spacing: 1,
+                                children: [
+                                    /*#__PURE__*/ _jsx(CrmSuiteLockedButton, {
+                                        variant: "contained",
+                                        color: "primary",
+                                        children: 'New contact'
+                                    }),
+                                    /*#__PURE__*/ _jsx(CrmSuiteLockedButton, {
+                                        children: 'Import CSV'
+                                    })
+                                ]
+                            }) : /*#__PURE__*/ _jsxs(Stack, {
+                                direction: "row",
+                                spacing: 1,
+                                children: [
+                                    /*#__PURE__*/ _jsx(Button, {
+                                        size: "small",
+                                        variant: "contained",
+                                        color: "primary",
+                                        disabled: !dataScope,
+                                        onClick: ()=>{
+                                            setCreateError(null);
+                                            setCreateOpen(true);
+                                        },
+                                        children: 'New contact'
+                                    }),
+                                    /*#__PURE__*/ _jsx(ContactImportButton, {
+                                        hostId: hostId,
+                                        org: org
+                                    })
+                                ]
+                            })
+                        }) : /*#__PURE__*/ _jsxs(_Fragment, {
+                            children: [
+                                windowClauses.length ? /*#__PURE__*/ _jsx(Typography, {
+                                    variant: "caption",
+                                    color: "text.secondary",
+                                    children: (windowClauses.length === 1 ? `${(_filterHeaders_windowClauses__field = filterHeaders[windowClauses[0].field]) != null ? _filterHeaders_windowClauses__field : windowClauses[0].field} narrows ` : `${windowClauses.length} of the filters narrow `) + 'the loaded window — the newest 1,000 contacts' + (plan.served ? ` matching ${(_filterHeaders_plan_served_field = filterHeaders[plan.served.field]) != null ? _filterHeaders_plan_served_field : plan.served.field}, which reached every contact.` : '.') + ' Sorting reorders that window.'
+                                }) : null,
+                                /*#__PURE__*/ _jsx(ContactsBulkBar, {
+                                    hostId: hostId,
+                                    org: org,
+                                    scope: dataScope,
+                                    consentGroup: consentGroup,
+                                    rows: visible,
+                                    selected: selectedIds,
+                                    onSelectedChange: setSelectedIds,
+                                    csv: csvOptions,
+                                    suiteLocked: !suiteIncluded
+                                }),
+                                /*#__PURE__*/ _jsx(CrmColumnOrderProvider, {
+                                    value: grid.columnOrder,
+                                    children: /*#__PURE__*/ _jsx(ListTable, {
+                                        rows: visible,
+                                        columns: grid.columns,
+                                        slots: CRM_LIST_SLOTS,
+                                        selectable: {
+                                            selected: selectedIds,
+                                            onChange: setSelectedIds
+                                        },
+                                        onOpen: (id)=>router.push(routes.contact(id)),
+                                        /*
+                   * The grid must NOT also filter: the bar above is the one
+                   * editor of the clauses, and the grid's own filter panel
+                   * holds one item where a view holds several. Columns and
+                   * sort are the view's, controlled so a saved arrangement
+                   * is what the grid shows and a change is what it saves.
+                   */ disableColumnFilter: true,
+                                        columnVisibilityModel: grid.columnVisibilityModel,
+                                        onColumnVisibilityModelChange: grid.onColumnVisibilityModelChange,
+                                        sortModel: grid.sortModel,
+                                        onSortModelChange: grid.onSortModelChange
+                                    })
+                                })
+                            ]
+                        }),
+                        /*#__PURE__*/ _jsx(RecentActivityFeed, {
+                            hostId: hostId,
+                            org: org,
+                            basePath: props.basePath
+                        })
+                    ]
+                })
+            }),
+            /*#__PURE__*/ _jsxs(Dialog, {
+                open: segmentName !== null,
+                onClose: ()=>setSegmentName(null),
+                maxWidth: "xs",
+                fullWidth: true,
+                children: [
+                    /*#__PURE__*/ _jsx(DialogTitle, {
+                        children: 'Save as segment'
+                    }),
+                    /*#__PURE__*/ _jsx(DialogContent, {
+                        children: /*#__PURE__*/ _jsxs(Stack, {
+                            spacing: 2,
+                            sx: {
+                                pt: 1
+                            },
+                            children: [
+                                /*#__PURE__*/ _jsx(Typography, {
+                                    variant: "body2",
+                                    color: "text.secondary",
+                                    children: 'The tag and source filters, kept as a segment an email campaign or a dynamic list can send to. The other filters stay on this view only.'
+                                }),
+                                /*#__PURE__*/ _jsx(TextField, {
+                                    autoFocus: true,
+                                    size: "small",
+                                    label: "Segment name",
+                                    value: segmentName != null ? segmentName : '',
+                                    onChange: (event)=>setSegmentName(event.target.value.slice(0, 60)),
+                                    onKeyDown: (event)=>{
+                                        if (event.key === 'Enter') {
+                                            event.preventDefault();
+                                            void handleSaveSegment();
+                                        }
+                                    },
+                                    slotProps: {
+                                        htmlInput: {
+                                            maxLength: 60
+                                        }
+                                    }
+                                })
+                            ]
+                        })
+                    }),
+                    /*#__PURE__*/ _jsxs(DialogActions, {
+                        children: [
+                            /*#__PURE__*/ _jsx(Button, {
+                                onClick: ()=>setSegmentName(null),
+                                children: 'Cancel'
+                            }),
+                            /*#__PURE__*/ _jsx(Button, {
+                                variant: "contained",
+                                disabled: !(segmentName != null ? segmentName : '').trim() || !dataScope,
+                                onClick: ()=>void handleSaveSegment(),
+                                children: 'Save segment'
+                            })
+                        ]
+                    })
+                ]
+            }),
+            createOpen ? /*#__PURE__*/ _jsx(NewContactDrawer, {
+                open: true,
+                onClose: ()=>setCreateOpen(false),
+                hostId: hostId,
+                org: org,
+                busy: createBusy,
+                error: createError,
+                owners: members.options,
+                ownersReady: members.ready,
+                onSubmit: (values)=>void handleCreate(values)
+            }) : null
+        ]
+    });
+}
+ContactsPeopleSection.displayName = 'ContactsPeopleSection';
+export default ContactsPeopleSection;
+
+//# sourceMappingURL=contacts-section.js.map