@aglyn/plugins-crm 1.0.0-beta.143

package/src/lib/components/crm-email-template-tools.js

@@ -0,0 +1,240 @@
+/**
+ * @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 { CRM_EMAIL_TEMPLATE_NAME_MAX, CRM_MERGE_FIELDS, crmMergeFieldToken } from "@aglyn/aglyn";
+import { Autocomplete, Button, Dialog, DialogActions, DialogContent, DialogTitle, FormControlLabel, FormHelperText, ListSubheader, Menu, MenuItem, Radio, RadioGroup, TextField } from "@mui/material";
+import { useEffect, useMemo, useState } from "react";
+/** How the picker heads each group; shared first, because it is the team's. */ const visibilityGroup = (template)=>template.visibility === 'personal' ? 'Mine' : 'Shared';
+/**
+ * "Template" — the letter to start from, grouped into the team's and the
+ * reader's own. An Autocomplete rather than a select because a workspace
+ * that keeps forty letters finds one by typing its name. Options are
+ * ordered shared-then-personal so the groups render contiguous, which is
+ * what the control's grouping needs.
+ */ export function CrmTemplatePicker(props) {
+    const { templates, value, onChange, disabled } = props;
+    const options = useMemo(()=>[
+            ...templates
+        ].sort((a, b)=>a.visibility === b.visibility ? a.name.localeCompare(b.name) : a.visibility === 'personal' ? 1 : -1), [
+        templates
+    ]);
+    return /*#__PURE__*/ _jsx(Autocomplete, {
+        size: "small",
+        options: options,
+        groupBy: visibilityGroup,
+        getOptionLabel: (option)=>option.name,
+        isOptionEqualToValue: (option, selected)=>option.$id === selected.$id,
+        value: value,
+        onChange: (_event, next)=>onChange(next),
+        disabled: disabled,
+        noOptionsText: "No templates match",
+        renderInput: (params)=>/*#__PURE__*/ _jsx(TextField, _extends({}, params, {
+                label: "Template",
+                helperText: "Fills in the subject and the message. Merge fields such as {{contact.firstName}} are filled from this record when the email is sent."
+            }))
+    });
+}
+CrmTemplatePicker.displayName = 'CrmTemplatePicker';
+/**
+ * "Insert" — a snippet, or a merge field, at the caret.
+ *
+ * One menu for both because they are one gesture: put something into the
+ * message where I am. The snippets come first, under their own heading,
+ * and the fields follow grouped by what they read — only the groups that
+ * apply, so a letter to a contact is not offered `{{lead.name}}`. With no
+ * snippets the menu is the fields alone, which is what keeps the dialog
+ * useful before anyone has saved a snippet.
+ */ export function CrmInsertMenu(props) {
+    const { snippets, groups, disabled, onInsert } = props;
+    const [anchor, setAnchor] = useState(null);
+    const fields = useMemo(()=>{
+        const byGroup = new Map();
+        for (const field of CRM_MERGE_FIELDS){
+            var _byGroup_get;
+            if (!groups.includes(field.group)) continue;
+            byGroup.set(field.group, [
+                ...(_byGroup_get = byGroup.get(field.group)) != null ? _byGroup_get : [],
+                field
+            ]);
+        }
+        return [
+            ...byGroup.entries()
+        ];
+    }, [
+        groups
+    ]);
+    const pick = (text)=>{
+        setAnchor(null);
+        onInsert(text);
+    };
+    return /*#__PURE__*/ _jsxs(_Fragment, {
+        children: [
+            /*#__PURE__*/ _jsx(Button, {
+                size: "small",
+                disabled: disabled,
+                onClick: (event)=>setAnchor(event.currentTarget),
+                "aria-haspopup": "menu",
+                children: 'Insert'
+            }),
+            /*#__PURE__*/ _jsxs(Menu, {
+                open: Boolean(anchor),
+                anchorEl: anchor,
+                onClose: ()=>setAnchor(null),
+                children: [
+                    snippets.length ? /*#__PURE__*/ _jsx(ListSubheader, {
+                        disableSticky: true,
+                        children: 'Snippets'
+                    }) : null,
+                    snippets.map((snippet)=>/*#__PURE__*/ _jsx(MenuItem, {
+                            onClick: ()=>pick(snippet.body),
+                            children: snippet.name
+                        }, snippet.$id)),
+                    fields.flatMap(([group, entries])=>[
+                            /*#__PURE__*/ _jsx(ListSubheader, {
+                                disableSticky: true,
+                                children: `${group} fields`
+                            }, `group-${group}`),
+                            ...entries.map((field)=>/*#__PURE__*/ _jsx(MenuItem, {
+                                    onClick: ()=>pick(crmMergeFieldToken(field.key)),
+                                    children: field.label
+                                }, field.key))
+                        ])
+                ]
+            })
+        ]
+    });
+}
+CrmInsertMenu.displayName = 'CrmInsertMenu';
+/**
+ * "Save as template" — a name and whose it is, over the draft as written.
+ *
+ * The subject and the body are the dialog's own and are not shown again
+ * here; this asks only what the draft does not carry. Personal is the
+ * default, because a letter one rep wrote is theirs until they hand it to
+ * the team, and handing it over is one click.
+ */ export function CrmSaveAsTemplateDialog(props) {
+    const { open, onClose, onSave } = props;
+    const [name, setName] = useState('');
+    const [visibility, setVisibility] = useState('personal');
+    const [busy, setBusy] = useState(false);
+    const [error, setError] = useState(null);
+    useEffect(()=>{
+        if (!open) return;
+        setName('');
+        setVisibility('personal');
+        setBusy(false);
+        setError(null);
+    }, [
+        open
+    ]);
+    const canSave = name.trim().length > 0 && !busy;
+    const handleSave = async ()=>{
+        if (!canSave) return;
+        setBusy(true);
+        setError(null);
+        try {
+            await onSave({
+                name: name.trim().slice(0, CRM_EMAIL_TEMPLATE_NAME_MAX),
+                visibility
+            });
+        } catch (cause) {
+            console.error(cause);
+            setError('The template could not be saved. Try again.');
+        } finally{
+            setBusy(false);
+        }
+    };
+    return /*#__PURE__*/ _jsxs(Dialog, {
+        open: open,
+        onClose: busy ? undefined : onClose,
+        maxWidth: "xs",
+        fullWidth: true,
+        children: [
+            /*#__PURE__*/ _jsx(DialogTitle, {
+                children: 'Save as template'
+            }),
+            /*#__PURE__*/ _jsxs(DialogContent, {
+                sx: {
+                    display: 'flex',
+                    flexDirection: 'column',
+                    gap: 2
+                },
+                children: [
+                    /*#__PURE__*/ _jsx(TextField, {
+                        size: "small",
+                        label: "Template name",
+                        value: name,
+                        onChange: (event)=>setName(event.target.value),
+                        autoFocus: true,
+                        sx: {
+                            mt: 1
+                        },
+                        slotProps: {
+                            htmlInput: {
+                                maxLength: CRM_EMAIL_TEMPLATE_NAME_MAX
+                            }
+                        }
+                    }),
+                    /*#__PURE__*/ _jsxs(RadioGroup, {
+                        value: visibility,
+                        onChange: (event)=>setVisibility(event.target.value),
+                        children: [
+                            /*#__PURE__*/ _jsx(FormControlLabel, {
+                                value: "personal",
+                                control: /*#__PURE__*/ _jsx(Radio, {
+                                    size: "small"
+                                }),
+                                label: "Personal — listed for you alone"
+                            }),
+                            /*#__PURE__*/ _jsx(FormControlLabel, {
+                                value: "shared",
+                                control: /*#__PURE__*/ _jsx(Radio, {
+                                    size: "small"
+                                }),
+                                label: "Shared — every CRM editor can use and edit it"
+                            })
+                        ]
+                    }),
+                    error ? /*#__PURE__*/ _jsx(FormHelperText, {
+                        error: true,
+                        children: error
+                    }) : null
+                ]
+            }),
+            /*#__PURE__*/ _jsxs(DialogActions, {
+                children: [
+                    /*#__PURE__*/ _jsx(Button, {
+                        onClick: onClose,
+                        disabled: busy,
+                        children: 'Cancel'
+                    }),
+                    /*#__PURE__*/ _jsx(Button, {
+                        variant: "contained",
+                        color: "primary",
+                        disabled: !canSave,
+                        onClick: handleSave,
+                        children: busy ? 'Saving…' : 'Save template'
+                    })
+                ]
+            })
+        ]
+    });
+}
+CrmSaveAsTemplateDialog.displayName = 'CrmSaveAsTemplateDialog';
+
+//# sourceMappingURL=crm-email-template-tools.js.map

package/src/lib/components/crm-email-template-tools.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../libs/plugins/crm/src/lib/components/crm-email-template-tools.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2026 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n'use client'\n\nimport {\n  CRM_EMAIL_TEMPLATE_NAME_MAX,\n  CRM_MERGE_FIELDS,\n  type CrmEmailTemplateRow,\n  type CrmEmailTemplateVisibility,\n  type CrmMergeFieldDefinition,\n  type CrmMergeFieldGroup,\n  crmMergeFieldToken,\n} from '@aglyn/aglyn'\nimport {\n  Autocomplete,\n  Button,\n  Dialog,\n  DialogActions,\n  DialogContent,\n  DialogTitle,\n  FormControlLabel,\n  FormHelperText,\n  ListSubheader,\n  Menu,\n  MenuItem,\n  Radio,\n  RadioGroup,\n  TextField,\n} from '@mui/material'\nimport { type MouseEvent, useEffect, useMemo, useState } from 'react'\n\n/**\n * The pieces the send dialog grows for templates (AGL-2658), each on its\n * own so the dialog's file — which several hands edit — takes three\n * elements and a handful of lines rather than a second component's worth.\n */\n\nexport interface CrmTemplatePickerProps {\n  /** Every listed template of kind `template`, shared and personal alike. */\n  templates: readonly CrmEmailTemplateRow[]\n  /** The one applied to the draft, or `null`. */\n  value: CrmEmailTemplateRow | null\n  onChange: (template: CrmEmailTemplateRow | null) => void\n  disabled?: boolean\n}\n\n/** How the picker heads each group; shared first, because it is the team's. */\nconst visibilityGroup = (template: CrmEmailTemplateRow): string =>\n  template.visibility === 'personal' ? 'Mine' : 'Shared'\n\n/**\n * \"Template\" — the letter to start from, grouped into the team's and the\n * reader's own. An Autocomplete rather than a select because a workspace\n * that keeps forty letters finds one by typing its name. Options are\n * ordered shared-then-personal so the groups render contiguous, which is\n * what the control's grouping needs.\n */\nexport function CrmTemplatePicker(props: CrmTemplatePickerProps) {\n  const { templates, value, onChange, disabled } = props\n  const options = useMemo(\n    () =>\n      [...templates].sort((a, b) =>\n        a.visibility === b.visibility\n          ? a.name.localeCompare(b.name)\n          : a.visibility === 'personal'\n            ? 1\n            : -1,\n      ),\n    [templates],\n  )\n  return (\n    <Autocomplete\n      size=\"small\"\n      options={options}\n      groupBy={visibilityGroup}\n      getOptionLabel={(option) => option.name}\n      isOptionEqualToValue={(option, selected) => option.$id === selected.$id}\n      value={value}\n      onChange={(_event, next) => onChange(next)}\n      disabled={disabled}\n      noOptionsText=\"No templates match\"\n      renderInput={(params) => (\n        <TextField\n          {...params}\n          label=\"Template\"\n          helperText=\"Fills in the subject and the message. Merge fields such as {{contact.firstName}} are filled from this record when the email is sent.\"\n        />\n      )}\n    />\n  )\n}\nCrmTemplatePicker.displayName = 'CrmTemplatePicker'\n\nexport interface CrmInsertMenuProps {\n  /** Every listed template of kind `snippet`. */\n  snippets: readonly CrmEmailTemplateRow[]\n  /** Which merge-field groups apply to the record being written to. */\n  groups: readonly CrmMergeFieldGroup[]\n  disabled?: boolean\n  /** Receives the text to put at the caret. */\n  onInsert: (text: string) => void\n}\n\n/**\n * \"Insert\" — a snippet, or a merge field, at the caret.\n *\n * One menu for both because they are one gesture: put something into the\n * message where I am. The snippets come first, under their own heading,\n * and the fields follow grouped by what they read — only the groups that\n * apply, so a letter to a contact is not offered `{{lead.name}}`. With no\n * snippets the menu is the fields alone, which is what keeps the dialog\n * useful before anyone has saved a snippet.\n */\nexport function CrmInsertMenu(props: CrmInsertMenuProps) {\n  const { snippets, groups, disabled, onInsert } = props\n  const [anchor, setAnchor] = useState<HTMLElement | null>(null)\n  const fields = useMemo(() => {\n    const byGroup = new Map<CrmMergeFieldGroup, CrmMergeFieldDefinition[]>()\n    for (const field of CRM_MERGE_FIELDS) {\n      if (!groups.includes(field.group)) continue\n      byGroup.set(field.group, [...(byGroup.get(field.group) ?? []), field])\n    }\n    return [...byGroup.entries()]\n  }, [groups])\n  const pick = (text: string) => {\n    setAnchor(null)\n    onInsert(text)\n  }\n  return (\n    <>\n      <Button\n        size=\"small\"\n        disabled={disabled}\n        onClick={(event: MouseEvent<HTMLElement>) => setAnchor(event.currentTarget)}\n        aria-haspopup=\"menu\"\n      >\n        {'Insert'}\n      </Button>\n      <Menu open={Boolean(anchor)} anchorEl={anchor} onClose={() => setAnchor(null)}>\n        {snippets.length ? <ListSubheader disableSticky>{'Snippets'}</ListSubheader> : null}\n        {snippets.map((snippet) => (\n          <MenuItem key={snippet.$id} onClick={() => pick(snippet.body)}>\n            {snippet.name}\n          </MenuItem>\n        ))}\n        {fields.flatMap(([group, entries]) => [\n          <ListSubheader key={`group-${group}`} disableSticky>\n            {`${group} fields`}\n          </ListSubheader>,\n          ...entries.map((field) => (\n            <MenuItem key={field.key} onClick={() => pick(crmMergeFieldToken(field.key))}>\n              {field.label}\n            </MenuItem>\n          )),\n        ])}\n      </Menu>\n    </>\n  )\n}\nCrmInsertMenu.displayName = 'CrmInsertMenu'\n\nexport interface CrmSaveAsTemplateDialogProps {\n  open: boolean\n  onClose: () => void\n  /** Writes the template; closing on success is the caller's job. */\n  onSave: (draft: {\n    name: string\n    visibility: CrmEmailTemplateVisibility\n  }) => Promise<void>\n}\n\n/**\n * \"Save as template\" — a name and whose it is, over the draft as written.\n *\n * The subject and the body are the dialog's own and are not shown again\n * here; this asks only what the draft does not carry. Personal is the\n * default, because a letter one rep wrote is theirs until they hand it to\n * the team, and handing it over is one click.\n */\nexport function CrmSaveAsTemplateDialog(props: CrmSaveAsTemplateDialogProps) {\n  const { open, onClose, onSave } = props\n  const [name, setName] = useState('')\n  const [visibility, setVisibility] = useState<CrmEmailTemplateVisibility>('personal')\n  const [busy, setBusy] = useState(false)\n  const [error, setError] = useState<string | null>(null)\n  useEffect(() => {\n    if (!open) return\n    setName('')\n    setVisibility('personal')\n    setBusy(false)\n    setError(null)\n  }, [open])\n  const canSave = name.trim().length > 0 && !busy\n  const handleSave = async () => {\n    if (!canSave) return\n    setBusy(true)\n    setError(null)\n    try {\n      await onSave({ name: name.trim().slice(0, CRM_EMAIL_TEMPLATE_NAME_MAX), visibility })\n    } catch (cause) {\n      console.error(cause)\n      setError('The template could not be saved. Try again.')\n    } finally {\n      setBusy(false)\n    }\n  }\n  return (\n    <Dialog open={open} onClose={busy ? undefined : onClose} maxWidth=\"xs\" fullWidth>\n      <DialogTitle>{'Save as template'}</DialogTitle>\n      <DialogContent sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>\n        <TextField\n          size=\"small\"\n          label=\"Template name\"\n          value={name}\n          onChange={(event) => setName(event.target.value)}\n          autoFocus\n          sx={{ mt: 1 }}\n          slotProps={{ htmlInput: { maxLength: CRM_EMAIL_TEMPLATE_NAME_MAX } }}\n        />\n        <RadioGroup\n          value={visibility}\n          onChange={(event) => setVisibility(event.target.value as CrmEmailTemplateVisibility)}\n        >\n          <FormControlLabel\n            value=\"personal\"\n            control={<Radio size=\"small\" />}\n            label=\"Personal — listed for you alone\"\n          />\n          <FormControlLabel\n            value=\"shared\"\n            control={<Radio size=\"small\" />}\n            label=\"Shared — every CRM editor can use and edit it\"\n          />\n        </RadioGroup>\n        {error ? <FormHelperText error>{error}</FormHelperText> : null}\n      </DialogContent>\n      <DialogActions>\n        <Button onClick={onClose} disabled={busy}>\n          {'Cancel'}\n        </Button>\n        <Button variant=\"contained\" color=\"primary\" disabled={!canSave} onClick={handleSave}>\n          {busy ? 'Saving…' : 'Save template'}\n        </Button>\n      </DialogActions>\n    </Dialog>\n  )\n}\nCrmSaveAsTemplateDialog.displayName = 'CrmSaveAsTemplateDialog'\n"],"names":["CRM_EMAIL_TEMPLATE_NAME_MAX","CRM_MERGE_FIELDS","crmMergeFieldToken","Autocomplete","Button","Dialog","DialogActions","DialogContent","DialogTitle","FormControlLabel","FormHelperText","ListSubheader","Menu","MenuItem","Radio","RadioGroup","TextField","useEffect","useMemo","useState","visibilityGroup","template","visibility","CrmTemplatePicker","props","templates","value","onChange","disabled","options","sort","a","b","name","localeCompare","size","groupBy","getOptionLabel","option","isOptionEqualToValue","selected","$id","_event","next","noOptionsText","renderInput","params","label","helperText","displayName","CrmInsertMenu","snippets","groups","onInsert","anchor","setAnchor","fields","byGroup","Map","field","includes","group","set","get","entries","pick","text","onClick","event","currentTarget","aria-haspopup","open","Boolean","anchorEl","onClose","length","disableSticky","map","snippet","body","flatMap","key","CrmSaveAsTemplateDialog","onSave","setName","setVisibility","busy","setBusy","error","setError","canSave","trim","handleSave","slice","cause","console","undefined","maxWidth","fullWidth","sx","display","flexDirection","gap","target","autoFocus","mt","slotProps","htmlInput","maxLength","control","variant","color"],"mappings":"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"}

package/src/lib/components/crm-export-all-button.d.ts

@@ -0,0 +1,39 @@
+import { type CrmExportResource } from '@aglyn/aglyn';
+export interface CrmExportAllButtonProps {
+    /** Which table to take a complete copy of. */
+    resource: CrmExportResource;
+    /** The organization whose records these are; null holds the button. */
+    orgId: string | null;
+    /**
+     * The site being read as.
+     *
+     * Required for contacts — the file is written through one holder's facet
+     * and a facet is per site — and for a scoped reader's leads. Null at the
+     * organization level, where an org-wide member takes every site's leads
+     * in one file.
+     */
+    hostId: string | null;
+    disabled?: boolean;
+}
+/**
+ * EXPORT ALL — the whole collection, not the loaded window (AGL-2662).
+ *
+ * Beside "Export CSV", which writes the rows on screen. The two are
+ * deliberately both offered and deliberately named apart: a selection's
+ * file is what somebody just picked, and this is the audience.
+ *
+ * ## The response is checked, not trusted
+ *
+ * The route reports a `count()` aggregate in `X-Aglyn-Export-Rows`, taken
+ * before its first page. A stream that dies halfway produces a perfectly
+ * well-formed shorter file, and nothing about the bytes says it is short —
+ * which is exactly how the window-sized export stayed invisible for as long
+ * as it did. A body with fewer rows than promised is REFUSED rather than
+ * saved, because a partial audience saved under a confident name is worse
+ * than no file.
+ */
+export declare function CrmExportAllButton(props: CrmExportAllButtonProps): import("react").JSX.Element;
+export declare namespace CrmExportAllButton {
+    var displayName: string;
+}
+export default CrmExportAllButton;

package/src/lib/components/crm-export-all-button.js

@@ -0,0 +1,98 @@
+/**
+ * @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 { jsx as _jsx } from "react/jsx-runtime";
+import { countCsvDataRows } from "@aglyn/aglyn";
+import { authorizedFetch } from "@aglyn/shared-util-http/authorized-token";
+import { useUser } from "@aglyn/tenant-feature-instance";
+import { Button } from "@mui/material";
+import { useSnackbar } from "notistack";
+import { useCallback, useState } from "react";
+import { downloadTextFile } from "../model/contacts-csv.js";
+/** The header the export route promises its row count in. */ const EXPORT_ROWS_HEADER = 'X-Aglyn-Export-Rows';
+/**
+ * EXPORT ALL — the whole collection, not the loaded window (AGL-2662).
+ *
+ * Beside "Export CSV", which writes the rows on screen. The two are
+ * deliberately both offered and deliberately named apart: a selection's
+ * file is what somebody just picked, and this is the audience.
+ *
+ * ## The response is checked, not trusted
+ *
+ * The route reports a `count()` aggregate in `X-Aglyn-Export-Rows`, taken
+ * before its first page. A stream that dies halfway produces a perfectly
+ * well-formed shorter file, and nothing about the bytes says it is short —
+ * which is exactly how the window-sized export stayed invisible for as long
+ * as it did. A body with fewer rows than promised is REFUSED rather than
+ * saved, because a partial audience saved under a confident name is worse
+ * than no file.
+ */ export function CrmExportAllButton(props) {
+    const { resource, orgId, hostId, disabled } = props;
+    const { data: user } = useUser();
+    const { enqueueSnackbar } = useSnackbar();
+    const [busy, setBusy] = useState(false);
+    const handleExport = useCallback(async ()=>{
+        if (!orgId || busy) return;
+        setBusy(true);
+        try {
+            var _response_headers_get;
+            const params = new URLSearchParams({
+                orgId,
+                resource
+            });
+            if (hostId) params.set('hostId', hostId);
+            const response = await authorizedFetch(user, `/api/crm/export?${params.toString()}`);
+            if (!response.ok) {
+                var _ref;
+                const failure = await response.json().catch(()=>({}));
+                throw new Error((_ref = failure == null ? void 0 : failure.error) != null ? _ref : 'Export failed');
+            }
+            const text = await response.text();
+            const promised = Number((_response_headers_get = response.headers.get(EXPORT_ROWS_HEADER)) != null ? _response_headers_get : '');
+            const received = countCsvDataRows(text);
+            if (Number.isFinite(promised) && received < promised) {
+                enqueueSnackbar(`Export incomplete — ${received} of ${promised} rows arrived. ` + 'Nothing was saved; try again.', {
+                    variant: 'error'
+                });
+                return;
+            }
+            downloadTextFile(`${resource}.csv`, 'text/csv', text);
+        } catch (error) {
+            enqueueSnackbar(error instanceof Error ? error.message : 'Export failed', {
+                variant: 'error'
+            });
+        } finally{
+            setBusy(false);
+        }
+    }, [
+        orgId,
+        hostId,
+        resource,
+        user,
+        busy,
+        enqueueSnackbar
+    ]);
+    return /*#__PURE__*/ _jsx(Button, {
+        size: "small",
+        disabled: disabled || busy || !orgId,
+        onClick: ()=>void handleExport(),
+        children: busy ? 'Exporting…' : 'Export all…'
+    });
+}
+CrmExportAllButton.displayName = 'CrmExportAllButton';
+export default CrmExportAllButton;
+
+//# sourceMappingURL=crm-export-all-button.js.map

package/src/lib/components/crm-export-all-button.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../libs/plugins/crm/src/lib/components/crm-export-all-button.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2026 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n'use client'\n\nimport {\n  countCsvDataRows,\n  type CrmExportResource,\n} from '@aglyn/aglyn'\nimport { authorizedFetch } from '@aglyn/shared-util-http/authorized-token'\nimport { useUser } from '@aglyn/tenant-feature-instance'\nimport { Button } from '@mui/material'\nimport { useSnackbar } from 'notistack'\nimport { useCallback, useState } from 'react'\nimport { downloadTextFile } from '../model/contacts-csv'\n\n/** The header the export route promises its row count in. */\nconst EXPORT_ROWS_HEADER = 'X-Aglyn-Export-Rows'\n\nexport interface CrmExportAllButtonProps {\n  /** Which table to take a complete copy of. */\n  resource: CrmExportResource\n  /** The organization whose records these are; null holds the button. */\n  orgId: string | null\n  /**\n   * The site being read as.\n   *\n   * Required for contacts — the file is written through one holder's facet\n   * and a facet is per site — and for a scoped reader's leads. Null at the\n   * organization level, where an org-wide member takes every site's leads\n   * in one file.\n   */\n  hostId: string | null\n  disabled?: boolean\n}\n\n/**\n * EXPORT ALL — the whole collection, not the loaded window (AGL-2662).\n *\n * Beside \"Export CSV\", which writes the rows on screen. The two are\n * deliberately both offered and deliberately named apart: a selection's\n * file is what somebody just picked, and this is the audience.\n *\n * ## The response is checked, not trusted\n *\n * The route reports a `count()` aggregate in `X-Aglyn-Export-Rows`, taken\n * before its first page. A stream that dies halfway produces a perfectly\n * well-formed shorter file, and nothing about the bytes says it is short —\n * which is exactly how the window-sized export stayed invisible for as long\n * as it did. A body with fewer rows than promised is REFUSED rather than\n * saved, because a partial audience saved under a confident name is worse\n * than no file.\n */\nexport function CrmExportAllButton(props: CrmExportAllButtonProps) {\n  const { resource, orgId, hostId, disabled } = props\n  const { data: user } = useUser()\n  const { enqueueSnackbar } = useSnackbar()\n  const [busy, setBusy] = useState(false)\n\n  const handleExport = useCallback(async () => {\n    if (!orgId || busy) return\n    setBusy(true)\n    try {\n      const params = new URLSearchParams({ orgId, resource })\n      if (hostId) params.set('hostId', hostId)\n      const response = await authorizedFetch(\n        user,\n        `/api/crm/export?${params.toString()}`,\n      )\n      if (!response.ok) {\n        const failure = await response.json().catch(() => ({}))\n        throw new Error(failure?.error ?? 'Export failed')\n      }\n      const text = await response.text()\n      const promised = Number(response.headers.get(EXPORT_ROWS_HEADER) ?? '')\n      const received = countCsvDataRows(text)\n      if (Number.isFinite(promised) && received < promised) {\n        enqueueSnackbar(\n          `Export incomplete — ${received} of ${promised} rows arrived. ` +\n            'Nothing was saved; try again.',\n          { variant: 'error' },\n        )\n        return\n      }\n      downloadTextFile(`${resource}.csv`, 'text/csv', text)\n    } catch (error) {\n      enqueueSnackbar(\n        error instanceof Error ? error.message : 'Export failed',\n        { variant: 'error' },\n      )\n    } finally {\n      setBusy(false)\n    }\n  }, [orgId, hostId, resource, user, busy, enqueueSnackbar])\n\n  return (\n    <Button\n      size=\"small\"\n      disabled={disabled || busy || !orgId}\n      onClick={() => void handleExport()}\n    >\n      {busy ? 'Exporting…' : 'Export all…'}\n    </Button>\n  )\n}\nCrmExportAllButton.displayName = 'CrmExportAllButton'\n\nexport default CrmExportAllButton\n"],"names":["countCsvDataRows","authorizedFetch","useUser","Button","useSnackbar","useCallback","useState","downloadTextFile","EXPORT_ROWS_HEADER","CrmExportAllButton","props","resource","orgId","hostId","disabled","data","user","enqueueSnackbar","busy","setBusy","handleExport","response","params","URLSearchParams","set","toString","ok","failure","json","catch","Error","error","text","promised","Number","headers","get","received","isFinite","variant","message","size","onClick","displayName"],"mappings":"AAAA;;;;;;;;;;;;;;;CAeC,GACD;;AAEA,SACEA,gBAAgB,QAEX,eAAc;AACrB,SAASC,eAAe,QAAQ,2CAA0C;AAC1E,SAASC,OAAO,QAAQ,iCAAgC;AACxD,SAASC,MAAM,QAAQ,gBAAe;AACtC,SAASC,WAAW,QAAQ,YAAW;AACvC,SAASC,WAAW,EAAEC,QAAQ,QAAQ,QAAO;AAC7C,SAASC,gBAAgB,QAAQ,2BAAuB;AAExD,2DAA2D,GAC3D,MAAMC,qBAAqB;AAmB3B;;;;;;;;;;;;;;;;CAgBC,GACD,OAAO,SAASC,mBAAmBC,KAA8B;IAC/D,MAAM,EAAEC,QAAQ,EAAEC,KAAK,EAAEC,MAAM,EAAEC,QAAQ,EAAE,GAAGJ;IAC9C,MAAM,EAAEK,MAAMC,IAAI,EAAE,GAAGd;IACvB,MAAM,EAAEe,eAAe,EAAE,GAAGb;IAC5B,MAAM,CAACc,MAAMC,QAAQ,GAAGb,SAAS;IAEjC,MAAMc,eAAef,YAAY;QAC/B,IAAI,CAACO,SAASM,MAAM;QACpBC,QAAQ;QACR,IAAI;gBAYsBE;YAXxB,MAAMC,SAAS,IAAIC,gBAAgB;gBAAEX;gBAAOD;YAAS;YACrD,IAAIE,QAAQS,OAAOE,GAAG,CAAC,UAAUX;YACjC,MAAMQ,WAAW,MAAMpB,gBACrBe,MACA,CAAC,gBAAgB,EAAEM,OAAOG,QAAQ,IAAI;YAExC,IAAI,CAACJ,SAASK,EAAE,EAAE;;gBAChB,MAAMC,UAAU,MAAMN,SAASO,IAAI,GAAGC,KAAK,CAAC,IAAO,CAAA,CAAC,CAAA;gBACpD,MAAM,IAAIC,cAAMH,2BAAAA,QAASI,KAAK,mBAAI;YACpC;YACA,MAAMC,OAAO,MAAMX,SAASW,IAAI;YAChC,MAAMC,WAAWC,QAAOb,wBAAAA,SAASc,OAAO,CAACC,GAAG,CAAC5B,+BAArBa,wBAA4C;YACpE,MAAMgB,WAAWrC,iBAAiBgC;YAClC,IAAIE,OAAOI,QAAQ,CAACL,aAAaI,WAAWJ,UAAU;gBACpDhB,gBACE,CAAC,oBAAoB,EAAEoB,SAAS,IAAI,EAAEJ,SAAS,eAAe,CAAC,GAC7D,iCACF;oBAAEM,SAAS;gBAAQ;gBAErB;YACF;YACAhC,iBAAiB,GAAGI,SAAS,IAAI,CAAC,EAAE,YAAYqB;QAClD,EAAE,OAAOD,OAAO;YACdd,gBACEc,iBAAiBD,QAAQC,MAAMS,OAAO,GAAG,iBACzC;gBAAED,SAAS;YAAQ;QAEvB,SAAU;YACRpB,QAAQ;QACV;IACF,GAAG;QAACP;QAAOC;QAAQF;QAAUK;QAAME;QAAMD;KAAgB;IAEzD,qBACE,KAACd;QACCsC,MAAK;QACL3B,UAAUA,YAAYI,QAAQ,CAACN;QAC/B8B,SAAS,IAAM,KAAKtB;kBAEnBF,OAAO,eAAe;;AAG7B;AACAT,mBAAmBkC,WAAW,GAAG;AAEjC,eAAelC,mBAAkB"}

package/src/lib/components/crm-filter-bar.d.ts

@@ -0,0 +1,53 @@
+import { type CrmViewFilterClause } from '@aglyn/aglyn';
+import { type ListFilterField } from '@aglyn/shared-ui-jsx/const/list-filter';
+/** A choice for a field whose value is picked rather than typed. */
+export interface CrmFilterOption {
+    value: string;
+    label: string;
+}
+export interface CrmFilterBarProps {
+    /** The list's grammar — every field a clause may name. */
+    fields: readonly ListFilterField[];
+    /** How a field reads on a chip; a field without one reads as its column. */
+    headers: Readonly<Record<string, string>>;
+    clauses: readonly CrmViewFilterClause[];
+    onChange: (clauses: CrmViewFilterClause[]) => void;
+    /**
+     * Choices per field — an owner from the roster, a stage from the fixed
+     * list, a source from its labels. A field with choices gets a picker
+     * and its chip shows the label; without them a value is typed.
+     */
+    options?: Readonly<Record<string, readonly CrmFilterOption[]>>;
+    /** The field the query is serving, marked so the reader knows which reached everything. */
+    servedField?: string | null;
+    disabled?: boolean;
+    /**
+     * The reader reached for a filter. A section that reads its pickers'
+     * choices lazily — the roster, the companies — starts those reads here,
+     * so a list nobody is narrowing pays for neither.
+     */
+    onOpen?: () => void;
+}
+/**
+ * The chips above a CRM list: every clause the list is narrowed by, and
+ * the one control that adds another (AGL-2617).
+ *
+ * A saved view carries several clauses and the data grid's own filter panel
+ * holds one, so the list needs an editor of its own for the set. Each
+ * clause is a chip that reads as a sentence — "Owner is Dana", "Created on
+ * or after 1 Jan" — with the clause the query serves marked, because that
+ * is the one that reached every contact and the others narrowed the loaded
+ * window; the list's caption says the same thing in prose.
+ *
+ * Adding one is a popover, not a row of controls: field, operator, value,
+ * Add. The value control follows the field — a picker where the section
+ * supplied choices, a date box for a date, a number box for a number, a
+ * text box otherwise — and the operators offered are exactly the ones the
+ * grammar declares for the field, so a clause cannot be built that nothing
+ * answers.
+ */
+export declare function CrmFilterBar(props: CrmFilterBarProps): import("react").JSX.Element;
+export declare namespace CrmFilterBar {
+    var displayName: string;
+}
+export default CrmFilterBar;