@aglyn/plugins-crm 1.0.0-beta.143

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

@@ -0,0 +1,664 @@
+/**
+ * @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 * as Aglyn from "@aglyn/aglyn";
+import { mdiAccountArrowRight, mdiAccountCancelOutline, mdiAccountConvertOutline, mdiAccountTieOutline } from "@aglyn/shared-data-mdi";
+import { CardDisplay, MdiIcon } from "@aglyn/shared-ui-jsx";
+import { ListPagination } from "@aglyn/shared-ui-jsx/components/list-pagination.component";
+import { ListTable } from "@aglyn/shared-ui-jsx/components/list-table.component";
+import { useOrgMemberOptions } from "../hooks/use-org-member-options.js";
+import { useCrmOrgMount } from "../hooks/use-crm-org-mount.js";
+import { useCrmSavedView } from "../hooks/use-crm-saved-view.js";
+import { useCrmScope } from "../hooks/use-crm-scope.js";
+import { useCrmViewGrid } from "../hooks/use-crm-view-grid.js";
+import { CRM_LIST_SLOTS, CrmColumnOrderProvider } from "./crm-column-menu.js";
+import { useOrgLeads } from "../hooks/use-org-leads.js";
+import CrmViewsControl from "./crm-views-control.js";
+import RowActionsMenu from "@aglyn/shared-ui-jsx/components/row-actions-menu.component";
+import { TABLE_PAGE_SIZE_DEFAULT } from "@aglyn/shared-ui-jsx/const/table-pagination";
+import EmptyStateComponent from "@aglyn/shared-ui-jsx/components/empty-state.component";
+import { useSnackbar } from "@aglyn/shared-ui-snackstack";
+import { useFirestore, useFirestoreCollection } from "@aglyn/tenant-feature-instance";
+import { Alert, Box, Button, Dialog, DialogActions, DialogContent, DialogTitle, FormControl, InputLabel, MenuItem, Select, Stack, Typography } from "@mui/material";
+import { collection, deleteField, doc, limit, orderBy, query, serverTimestamp, updateDoc } from "firebase/firestore";
+import { useRouter } from "next/navigation";
+import { useCallback, useEffect, useId, useMemo, useState } from "react";
+import { downloadTextFile } from "../model/contacts-csv.js";
+import { crmRoutes } from "../model/crm-routes.js";
+import { LEAD_FILTER_LABELS, LEAD_FILTERS, leadMatchesFilter } from "../model/lead-filters.js";
+import { leadsCsv } from "../model/leads-csv.js";
+import { LeadConvertDialog } from "./lead-convert-dialog.js";
+import { leadSourceLabel, leadSources, leadTimeLabel } from "./lead-history-card.js";
+import { LeadImportButton } from "./lead-import-drawer.js";
+import { LeadOwnerSelect } from "./lead-owner-select.js";
+import { CONVERT_PENDING_ERASURE_REASON } from "./lead-properties-card.js";
+import { LeadStatusChip } from "./lead-status-chip.js";
+import LeadSurfacesNote from "./lead-surfaces-note.js";
+import { LeadUnqualifyDialog } from "./lead-unqualify-dialog.js";
+import LeadsBulkBar from "./leads-bulk-bar.js";
+import OrgLeadSurfacesNote from "./org-lead-surfaces-note.js";
+/**
+ * How many leads the section reads: the newest by last seen, plus one probe
+ * row so "there are more" is a fact rather than a guess at the boundary.
+ *
+ * A CEILING and a client-side filter rather than a paged status query, and
+ * the reason is the lead documents themselves. Every lead the capture door
+ * writes carries NO `status` — the field exists only once somebody in the
+ * CRM has touched the lead — and Firestore cannot select documents by a
+ * field's absence: `where('status','in',[…])`, `!=` and `not-in` all skip a
+ * document without the field. A server-side "open leads" query would
+ * therefore hide every lead nobody has worked yet, which is the entire
+ * population the section exists to show on the day it ships. So the query
+ * is the one order every lead can satisfy (`lastSeenAtMs`, stamped on every
+ * capture), and the status filter narrows the loaded window — said out loud
+ * beneath the table whenever the window is not the whole collection.
+ *
+ * The window is then PAGED in memory under the shared footer, the way the
+ * workspace pickers page a slice of a window they cannot re-key: the rows
+ * are already in the snapshot, so turning a page costs nothing, and the
+ * footer's count is exact because it counts the filtered window rather than
+ * a collection nobody has measured.
+ */ const LEADS_WINDOW = 200;
+/**
+ * `/crm/leads` — the people a site has met but not yet qualified (AGL-2608).
+ *
+ * A section of its own, the way Salesforce keeps Leads apart from Contacts:
+ * a lead is a capture — a form, a booking, a sign-up — that somebody has
+ * still to work, and it converts into a contact, a company and a deal when
+ * it is real. Reads `hosts/{hostId}/leads`, host-scoped by path, so there is
+ * no `visibleTo` filter; the Firestore rules admit any member of the site to
+ * read it and an admin, editor or author to update it, which is what makes
+ * the inline status and owner changes client-direct writes.
+ *
+ * At the ORGANIZATION level (AGL-2630) there is no one site to read: the
+ * section opens the same query under every site the org has (`useOrgLeads`)
+ * and lists the merged window with a Site column, every row naming the site
+ * its writes and its link go to. The per-site notes — which of a site's
+ * forms file a lead — belong to a site's own hub and are not drawn here.
+ */ export function CrmLeadsSection(props) {
+    var _ref, _ref1, _ref2, _ref3, _ref4, _ref5;
+    const { hostId, org, basePath } = props;
+    const firestore = useFirestore();
+    const router = useRouter();
+    const { enqueueSnackbar } = useSnackbar();
+    const { orgId } = useCrmScope({
+        hostId,
+        org
+    });
+    const mount = useCrmOrgMount();
+    const roster = useOrgMemberOptions(orgId);
+    const routes = crmRoutes(basePath != null ? basePath : '');
+    // Under a site: the site's own window, rows keyed by document id.
+    const site = useFirestoreCollection(()=>hostId ? query(collection(firestore, 'hosts', hostId, 'leads'), orderBy('lastSeenAtMs', 'desc'), limit(LEADS_WINDOW + 1)) : null, [
+        firestore,
+        hostId
+    ], {
+        idField: '$id'
+    });
+    // At the organization level: every site's window, merged.
+    const orgHostIds = useMemo(()=>{
+        var _ref;
+        return hostId ? [] : ((_ref = mount == null ? void 0 : mount.hosts) != null ? _ref : []).map((host)=>host.id);
+    }, [
+        hostId,
+        mount == null ? void 0 : mount.hosts
+    ]);
+    const orgLeads = useOrgLeads({
+        hostIds: orgHostIds,
+        windowSize: LEADS_WINDOW
+    });
+    const leadDocs = useMemo(()=>hostId ? site.data.map((row)=>_extends({}, row, {
+                leadId: row.$id,
+                hostId
+            })) : orgLeads.data, [
+        hostId,
+        site.data,
+        orgLeads.data
+    ]);
+    const status = hostId ? site.status : (mount == null ? void 0 : mount.hostsReady) && !orgHostIds.length ? 'success' : orgLeads.status;
+    const truncated = hostId ? leadDocs.length > LEADS_WINDOW : orgLeads.truncated;
+    const window = useMemo(()=>leadDocs.slice(0, LEADS_WINDOW), [
+        leadDocs
+    ]);
+    /*
+   * The `Show` filter is the saved VIEW'S (AGL-2617): a saved view of leads
+   * holds the status beside the columns and the sort, and the select below
+   * writes into it. Unset reads as `open`, which is what the section opened
+   * on before views existed and the one reading a query cannot express.
+   */ const views = useCrmSavedView({
+        section: 'leads',
+        hostId,
+        org: props.org,
+        basePath: basePath != null ? basePath : ''
+    });
+    const filter = useMemo(()=>{
+        var _views_state_filters_find;
+        const value = (_views_state_filters_find = views.state.filters.find((clause)=>clause.field === 'status')) == null ? void 0 : _views_state_filters_find.value;
+        return LEAD_FILTERS.includes(value != null ? value : '') ? value : 'open';
+    }, [
+        views.state.filters
+    ]);
+    const setFilter = useCallback((next)=>views.setFilters(next === 'open' ? [] : [
+            {
+                field: 'status',
+                op: 'equals',
+                value: next
+            }
+        ]), [
+        views.setFilters
+    ]);
+    // The label's id, so the filter's combobox is named "Show" rather than
+    // after the option it shows — see `LeadOwnerSelect`.
+    const filterLabelId = useId();
+    const rows = useMemo(()=>window.filter((lead)=>leadMatchesFilter(lead, filter)), [
+        window,
+        filter
+    ]);
+    const [page, setPage] = useState(0);
+    const [pageSize, setPageSize] = useState(TABLE_PAGE_SIZE_DEFAULT);
+    // A new filter starts on page one: page three of the open leads is not a
+    // page of the unqualified ones, and an out-of-range page renders empty.
+    useEffect(()=>{
+        setPage(0);
+    }, [
+        filter
+    ]);
+    const pageRows = useMemo(()=>rows.slice(page * pageSize, (page + 1) * pageSize), [
+        rows,
+        page,
+        pageSize
+    ]);
+    /*
+   * The ticked rows, for the bulk bar (AGL-2662). Cleared when the filter
+   * changes: a selection made on the open leads is not a selection of the
+   * unqualified ones, and the bar's count would be over rows no longer
+   * listed.
+   */ const [selectedIds, setSelectedIds] = useState([]);
+    useEffect(()=>setSelectedIds([]), [
+        filter
+    ]);
+    // How the file names the owner and, at the org level, the site.
+    const csvOptions = useMemo(()=>_extends({
+            ownerEmail: roster.emailFor
+        }, hostId ? {} : {
+            siteName: (id)=>mount == null ? void 0 : mount.siteName(id)
+        }), [
+        roster.emailFor,
+        hostId,
+        mount
+    ]);
+    // The listed window — every row the filter admits, not just the page.
+    const handleExport = useCallback(()=>{
+        downloadTextFile('leads.csv', 'text/csv', leadsCsv(rows, csvOptions));
+    }, [
+        rows,
+        csvOptions
+    ]);
+    const [assigning, setAssigning] = useState(null);
+    const [unqualifying, setUnqualifying] = useState(null);
+    // The row whose conversion dialog is open (AGL-2641) — the same dialog
+    // the lead's page opens, fed the row so the list is one click shorter.
+    const [converting, setConverting] = useState(null);
+    const writeLead = useCallback(async (lead, fields, done)=>{
+        try {
+            await updateDoc(doc(firestore, 'hosts', lead.hostId, 'leads', lead.leadId), _extends({}, fields, {
+                updatedAt: serverTimestamp()
+            }));
+            enqueueSnackbar(done, {
+                variant: 'success',
+                persist: false
+            });
+        } catch (error) {
+            enqueueSnackbar(error instanceof Error ? error.message : 'The lead could not be updated.', {
+                variant: 'error'
+            });
+        }
+    }, [
+        firestore,
+        enqueueSnackbar
+    ]);
+    const columns = useMemo(()=>[
+            {
+                field: 'name',
+                headerName: 'Lead',
+                flex: 1.4,
+                minWidth: 160,
+                valueGetter: (_value, row)=>String(row['name'] || row['email'] || ''),
+                renderCell: ({ row })=>{
+                    var _row_email;
+                    return /*#__PURE__*/ _jsxs(Stack, {
+                        spacing: 0,
+                        sx: {
+                            minWidth: 0,
+                            justifyContent: 'center',
+                            height: '100%'
+                        },
+                        children: [
+                            /*#__PURE__*/ _jsx(Typography, {
+                                variant: "body2",
+                                noWrap: true,
+                                children: String(row['name'] || row['email'] || row.$id)
+                            }),
+                            row['name'] ? /*#__PURE__*/ _jsx(Typography, {
+                                variant: "caption",
+                                color: "text.secondary",
+                                noWrap: true,
+                                children: String((_row_email = row['email']) != null ? _row_email : '')
+                            }) : null
+                        ]
+                    });
+                }
+            },
+            {
+                field: 'status',
+                headerName: 'Status',
+                flex: 0.9,
+                minWidth: 150,
+                valueGetter: (_value, row)=>Aglyn.crmLeadStatus(row),
+                renderCell: ({ row })=>/*#__PURE__*/ _jsx(InlineStatus, {
+                        lead: row,
+                        onChange: (next)=>{
+                            if (next === 'unqualified') {
+                                setUnqualifying(row);
+                                return;
+                            }
+                            void writeLead(row, _extends({
+                                status: next
+                            }, Aglyn.crmLeadStatus(row) === 'unqualified' ? {
+                                unqualifiedReason: deleteField()
+                            } : {}), 'Status updated');
+                        }
+                    })
+            },
+            {
+                field: 'ownerUid',
+                headerName: 'Owner',
+                flex: 1,
+                minWidth: 140,
+                valueGetter: (_value, row)=>row.ownerUid ? roster.labelFor(row.ownerUid) : 'Unassigned'
+            },
+            // Only at the organization level, where a row can be any site's.
+            ...hostId ? [] : [
+                {
+                    field: 'hostId',
+                    headerName: 'Site',
+                    flex: 0.9,
+                    minWidth: 140,
+                    valueGetter: (_value, row)=>{
+                        var _ref;
+                        return (_ref = mount == null ? void 0 : mount.siteName(row.hostId)) != null ? _ref : row.hostId;
+                    }
+                }
+            ],
+            {
+                field: 'sources',
+                headerName: 'Source',
+                flex: 1,
+                minWidth: 140,
+                valueGetter: (_value, row)=>leadSources(row).map(leadSourceLabel).join(', ')
+            },
+            {
+                field: 'lastSeenAtMs',
+                headerName: 'Last seen',
+                flex: 0.9,
+                minWidth: 160,
+                valueGetter: (_value, row)=>{
+                    var _row_lastSeenAtMs;
+                    return leadTimeLabel((_row_lastSeenAtMs = row['lastSeenAtMs']) != null ? _row_lastSeenAtMs : row['createdAt']);
+                }
+            },
+            {
+                field: 'actions',
+                headerName: '',
+                width: 56,
+                sortable: false,
+                filterable: false,
+                disableColumnMenu: true,
+                renderCell: ({ row })=>{
+                    var _row_email;
+                    /*
+           * Why Convert is refused, in the order the lead's page refuses it:
+           * a converted lead has its contact already, a closed one was
+           * judged not real, and a person with an erasure pending must not
+           * be captured again — a conversion is a capture (AGL-2623).
+           */ const converted = Boolean(row.convertedContactId);
+                    const erasurePending = Aglyn.readErasureRequestedAtMs(row) !== null;
+                    const convertRefusal = converted ? 'This lead was converted' : !Aglyn.isCrmLeadOpen(row) ? 'This lead was unqualified' : erasurePending ? CONVERT_PENDING_ERASURE_REASON : null;
+                    return /*#__PURE__*/ _jsx(Box, {
+                        onClick: (event)=>event.stopPropagation(),
+                        sx: {
+                            display: 'flex',
+                            alignItems: 'center',
+                            height: '100%'
+                        },
+                        children: /*#__PURE__*/ _jsx(RowActionsMenu, {
+                            label: String((_row_email = row['email']) != null ? _row_email : row.$id),
+                            items: [
+                                {
+                                    key: 'open',
+                                    label: 'Open lead',
+                                    icon: /*#__PURE__*/ _jsx(MdiIcon, {
+                                        path: mdiAccountArrowRight.path,
+                                        size: 0.8
+                                    }),
+                                    href: routes.lead(row.leadId, hostId ? null : row.hostId)
+                                },
+                                {
+                                    key: 'convert',
+                                    label: 'Convert…',
+                                    icon: /*#__PURE__*/ _jsx(MdiIcon, {
+                                        path: mdiAccountConvertOutline.path,
+                                        size: 0.8
+                                    }),
+                                    onClick: ()=>setConverting(row),
+                                    disabled: convertRefusal !== null,
+                                    disabledReason: convertRefusal != null ? convertRefusal : undefined
+                                },
+                                {
+                                    key: 'assign',
+                                    label: 'Assign owner',
+                                    icon: /*#__PURE__*/ _jsx(MdiIcon, {
+                                        path: mdiAccountTieOutline.path,
+                                        size: 0.8
+                                    }),
+                                    onClick: ()=>setAssigning(row)
+                                },
+                                {
+                                    key: 'unqualify',
+                                    label: 'Unqualify',
+                                    icon: /*#__PURE__*/ _jsx(MdiIcon, {
+                                        path: mdiAccountCancelOutline.path,
+                                        size: 0.8
+                                    }),
+                                    onClick: ()=>setUnqualifying(row),
+                                    disabled: !Aglyn.isCrmLeadOpen(row) || Boolean(row.convertedContactId),
+                                    disabledReason: row.convertedContactId ? 'This lead was converted' : 'This lead is already closed'
+                                }
+                            ]
+                        })
+                    });
+                }
+            }
+        ], [
+        roster,
+        routes,
+        writeLead,
+        hostId,
+        mount
+    ]);
+    /* The column and sort models are the view's (AGL-2617). */ const grid = useCrmViewGrid(views, columns);
+    return /*#__PURE__*/ _jsxs(_Fragment, {
+        children: [
+            /*#__PURE__*/ _jsx(CardDisplay, {
+                header: 'Leads',
+                help: Aglyn.pluginDocsHelp('contacts', {
+                    anchor: '#whats-in-the-crm-area'
+                }),
+                actions: /*#__PURE__*/ _jsxs(Stack, {
+                    direction: "row",
+                    spacing: 1,
+                    sx: {
+                        alignItems: 'center'
+                    },
+                    children: [
+                        /*#__PURE__*/ _jsx(CrmViewsControl, {
+                            controller: views,
+                            allLabel: "All leads"
+                        }),
+                        /*#__PURE__*/ _jsxs(FormControl, {
+                            size: "small",
+                            sx: {
+                                minWidth: 160
+                            },
+                            children: [
+                                /*#__PURE__*/ _jsx(InputLabel, {
+                                    id: filterLabelId,
+                                    children: 'Show'
+                                }),
+                                /*#__PURE__*/ _jsx(Select, {
+                                    labelId: filterLabelId,
+                                    label: "Show",
+                                    value: filter,
+                                    onChange: (event)=>setFilter(event.target.value),
+                                    children: LEAD_FILTERS.map((option)=>/*#__PURE__*/ _jsx(MenuItem, {
+                                            value: option,
+                                            children: LEAD_FILTER_LABELS[option]
+                                        }, option))
+                                })
+                            ]
+                        }),
+                        /*#__PURE__*/ _jsx(LeadImportButton, {
+                            hostId: hostId
+                        }),
+                        /*#__PURE__*/ _jsx(Button, {
+                            size: "small",
+                            onClick: handleExport,
+                            disabled: !rows.length,
+                            children: 'Export CSV'
+                        })
+                    ]
+                }),
+                contentGutterX: true,
+                contentGutterY: true,
+                children: /*#__PURE__*/ _jsxs(Stack, {
+                    spacing: 2,
+                    children: [
+                        hostId ? /*#__PURE__*/ _jsx(LeadSurfacesNote, {
+                            hostId: hostId
+                        }) : /*#__PURE__*/ _jsx(OrgLeadSurfacesNote, {}),
+                        status === 'success' && window.length === 0 ? /*#__PURE__*/ _jsx(EmptyStateComponent, {
+                            label: 'No leads yet',
+                            description: 'Sign-ups, bookings and form submissions on your site become leads on their own — or bring a list in with Import CSV.'
+                        }) : status === 'success' && rows.length === 0 ? /*#__PURE__*/ _jsx(Typography, {
+                            variant: "body2",
+                            color: "text.secondary",
+                            children: `No ${LEAD_FILTER_LABELS[filter].toLowerCase()} leads among the ` + `${window.length.toLocaleString()} most recently seen.`
+                        }) : /*#__PURE__*/ _jsxs(_Fragment, {
+                            children: [
+                                /*#__PURE__*/ _jsx(LeadsBulkBar, {
+                                    rows: rows,
+                                    selected: selectedIds,
+                                    onSelectedChange: setSelectedIds,
+                                    roster: roster,
+                                    csv: csvOptions,
+                                    orgId: orgId,
+                                    hostId: hostId
+                                }),
+                                /*#__PURE__*/ _jsx(CrmColumnOrderProvider, {
+                                    value: grid.columnOrder,
+                                    children: /*#__PURE__*/ _jsx(ListTable, {
+                                        rows: pageRows,
+                                        columns: grid.columns,
+                                        slots: CRM_LIST_SLOTS,
+                                        selectable: {
+                                            selected: selectedIds,
+                                            onChange: setSelectedIds
+                                        },
+                                        loading: status === 'loading',
+                                        onOpen: (_id, row)=>router.push(routes.lead(row.leadId, hostId ? null : row.hostId)),
+                                        // Columns and sort are the view's, controlled (AGL-2617).
+                                        columnVisibilityModel: grid.columnVisibilityModel,
+                                        onColumnVisibilityModelChange: grid.onColumnVisibilityModelChange,
+                                        sortModel: grid.sortModel,
+                                        onSortModelChange: grid.onSortModelChange,
+                                        // Paged by the footer below, so the grid must not also slice.
+                                        hideFooter: true
+                                    })
+                                }),
+                                /*#__PURE__*/ _jsx(ListPagination, {
+                                    page: page,
+                                    pageSize: pageSize,
+                                    rowCount: pageRows.length,
+                                    count: rows.length,
+                                    onPageChange: setPage,
+                                    onPageSizeChange: setPageSize
+                                })
+                            ]
+                        }),
+                        truncated ? /*#__PURE__*/ _jsx(Alert, {
+                            severity: "info",
+                            children: `Showing the ${LEADS_WINDOW.toLocaleString()} most recently seen ` + 'leads. The status filter narrows these; older leads are still ' + 'listed in the Inbox and reached by campaign audiences.'
+                        }) : null
+                    ]
+                })
+            }),
+            /*#__PURE__*/ _jsx(AssignOwnerDialog, {
+                lead: assigning,
+                roster: roster,
+                onClose: ()=>setAssigning(null),
+                onAssign: (uid)=>{
+                    if (!assigning) return;
+                    void writeLead(assigning, {
+                        ownerUid: uid || deleteField()
+                    }, uid ? 'Owner assigned' : 'Owner cleared');
+                    setAssigning(null);
+                }
+            }),
+            /*#__PURE__*/ _jsx(LeadUnqualifyDialog, {
+                open: Boolean(unqualifying),
+                onClose: ()=>setUnqualifying(null),
+                hostId: (_ref = (_ref1 = unqualifying == null ? void 0 : unqualifying.hostId) != null ? _ref1 : hostId) != null ? _ref : '',
+                leadId: (_ref2 = unqualifying == null ? void 0 : unqualifying.leadId) != null ? _ref2 : '',
+                leadLabel: String((unqualifying == null ? void 0 : unqualifying['name']) || (unqualifying == null ? void 0 : unqualifying['email']) || '')
+            }),
+            /*#__PURE__*/ _jsx(LeadConvertDialog, {
+                open: Boolean(converting),
+                onClose: ()=>setConverting(null),
+                hostId: (_ref3 = (_ref4 = converting == null ? void 0 : converting.hostId) != null ? _ref4 : hostId) != null ? _ref3 : '',
+                orgId: orgId,
+                org: org,
+                leadId: (_ref5 = converting == null ? void 0 : converting.leadId) != null ? _ref5 : '',
+                lead: converting != null ? converting : {},
+                basePath: basePath != null ? basePath : '',
+                roster: roster
+            })
+        ]
+    });
+}
+CrmLeadsSection.displayName = 'CrmLeadsSection';
+/**
+ * The status, editable in place for a lead that is still open.
+ *
+ * A converted lead shows the chip alone: its status IS the conversion, and
+ * the route stamped it. The select stops its click from reaching the row, or
+ * every status change would also open the record.
+ */ function InlineStatus(props) {
+    const { lead, onChange } = props;
+    if (lead.convertedContactId) {
+        return /*#__PURE__*/ _jsx(Box, {
+            sx: {
+                display: 'flex',
+                alignItems: 'center',
+                height: '100%'
+            },
+            children: /*#__PURE__*/ _jsx(LeadStatusChip, {
+                lead: lead
+            })
+        });
+    }
+    const status = Aglyn.crmLeadStatus(lead);
+    return /*#__PURE__*/ _jsx(Box, {
+        onClick: (event)=>event.stopPropagation(),
+        sx: {
+            display: 'flex',
+            alignItems: 'center',
+            height: '100%',
+            width: '100%'
+        },
+        children: /*#__PURE__*/ _jsxs(Select, {
+            size: "small",
+            variant: "standard",
+            disableUnderline: true,
+            value: status,
+            onChange: (event)=>onChange(event.target.value),
+            renderValue: ()=>/*#__PURE__*/ _jsx(LeadStatusChip, {
+                    lead: lead
+                }),
+            sx: {
+                width: '100%'
+            },
+            children: [
+                /*#__PURE__*/ _jsx(MenuItem, {
+                    value: "new",
+                    children: Aglyn.CRM_LEAD_STATUS_LABELS.new
+                }),
+                /*#__PURE__*/ _jsx(MenuItem, {
+                    value: "working",
+                    children: Aglyn.CRM_LEAD_STATUS_LABELS.working
+                }),
+                /*#__PURE__*/ _jsx(MenuItem, {
+                    value: "unqualified",
+                    children: `${Aglyn.CRM_LEAD_STATUS_LABELS.unqualified}…`
+                })
+            ]
+        })
+    });
+}
+InlineStatus.displayName = 'InlineStatus';
+/** Hand a lead to a team member. */ function AssignOwnerDialog(props) {
+    var _ref;
+    const { lead, roster, onClose, onAssign } = props;
+    const [uid, setUid] = useState(null);
+    const current = uid != null ? uid : String((_ref = lead == null ? void 0 : lead.ownerUid) != null ? _ref : '');
+    return /*#__PURE__*/ _jsxs(Dialog, {
+        open: Boolean(lead),
+        onClose: onClose,
+        maxWidth: "xs",
+        fullWidth: true,
+        slotProps: {
+            transition: {
+                onExited: ()=>setUid(null)
+            }
+        },
+        children: [
+            /*#__PURE__*/ _jsx(DialogTitle, {
+                children: `Assign ${String((lead == null ? void 0 : lead['name']) || (lead == null ? void 0 : lead['email']) || 'lead')}`
+            }),
+            /*#__PURE__*/ _jsx(DialogContent, {
+                children: /*#__PURE__*/ _jsx(Box, {
+                    sx: {
+                        pt: 1
+                    },
+                    children: /*#__PURE__*/ _jsx(LeadOwnerSelect, {
+                        value: current,
+                        onChange: setUid,
+                        roster: roster,
+                        size: "medium"
+                    })
+                })
+            }),
+            /*#__PURE__*/ _jsxs(DialogActions, {
+                children: [
+                    /*#__PURE__*/ _jsx(Button, {
+                        onClick: onClose,
+                        children: 'Cancel'
+                    }),
+                    /*#__PURE__*/ _jsx(Button, {
+                        variant: "contained",
+                        onClick: ()=>onAssign(current),
+                        children: 'Assign'
+                    })
+                ]
+            })
+        ]
+    });
+}
+AssignOwnerDialog.displayName = 'AssignOwnerDialog';
+export default CrmLeadsSection;
+
+//# sourceMappingURL=leads-section.js.map