@aglyn/plugins-crm 1.0.0-beta.221 → 1.0.0-beta.223

package/src/lib/components/lead-properties-card.js

@@ -21,43 +21,35 @@ import { mdiAccountCancelOutline } from "@aglyn/shared-data-mdi";
 import { AppLink, CardDisplay, MdiIcon } from "@aglyn/shared-ui-jsx";
 import { useSnackbar } from "@aglyn/shared-ui-snackstack";
 import { useFirestore, writeGuardedBySeed } from "@aglyn/tenant-feature-instance";
-import { Alert, Button, FormControl, InputLabel, MenuItem, Select, Stack, TextField, Tooltip, Typography } from "@mui/material";
+import { Alert, Button, FormControl, InputLabel, Select, Stack, TextField, Tooltip, Typography } from "@mui/material";
 import { deleteField, doc, serverTimestamp, updateDoc } from "firebase/firestore";
 import { useEffect, useId, useMemo, useState } from "react";
 import { useContactFieldDefinitions } from "../hooks/use-contact-field-definitions.js";
 import { useLeadSourcePicklist } from "../hooks/use-lead-source-picklist.js";
+import { useLeadStatusPicklist } from "../hooks/use-lead-status-picklist.js";
+import { useLeadPicklists } from "../hooks/use-lead-picklists.js";
 import { crmCustomDraftChanges, crmCustomDraftMissingRequired, crmCustomDraftValue, crmCustomDraftWrites } from "../model/crm-custom-draft.js";
 import { CrmCustomFieldControl } from "./crm-custom-field-control.js";
 import { crmRoutes } from "../model/crm-routes.js";
-import { addressDraftFrom, ContactAddressFields } from "./contact-address-fields.js";
+import { LeadProfileFields, leadProfileDraftBody, leadProfileDraftFrom } from "./lead-profile-fields.js";
 import { CrmCallButton, CrmPhoneLink } from "./crm-call-actions.js";
 import { CrmEmailStateChip } from "./crm-email-state-chip.js";
 import { CrmEmailGatewayChip } from "./crm-email-check.js";
 import { CrmRecordChip, CrmRecordHeader } from "./crm-record-header.js";
 import { CrmSendEmailButton } from "./crm-send-email-button.js";
 import { LeadOwnerSelect } from "./lead-owner-select.js";
-import { LeadSourceSelect } from "./lead-source-select.js";
 import { LeadStatusChip } from "./lead-status-chip.js";
+import { leadStatusChoices, leadStatusMenuItems } from "./lead-status-options.js";
 import { crmClientListFields, CRM_CLIENT_SEARCH_FIELDS } from "../model/crm-list-query.js";
 import { useCrmSharingFollowUp } from "../hooks/use-crm-sharing.js";
 /** The Leads list's fields a profile save rewrites; the verdict key is the server's. */ const LEAD_CLIENT_LIST_FIELDS = [
     ...CRM_CLIENT_SEARCH_FIELDS,
-    'leadSourceKey'
+    'leadSourceKey',
+    // Industry and Rating (AGL-3513).
+    'industryKey',
+    'ratingKey'
 ];
 const NOTES_MAX = Aglyn.CRM_LEAD_NOTES_MAX;
-const TEXT_MAX = Aglyn.CRM_LEAD_TEXT_MAX;
-/** The stored profile as a draft the fields can edit. */ function profileDraftFrom(lead) {
-    var _lead_company, _lead_jobTitle, _ref, _lead_phone, _lead_website, _lead_leadSource, _lead_tags, _lead_address;
-    return {
-        company: String((_lead_company = lead.company) != null ? _lead_company : ''),
-        jobTitle: String((_lead_jobTitle = lead.jobTitle) != null ? _lead_jobTitle : ''),
-        phone: String((_ref = (_lead_phone = lead.phone) != null ? _lead_phone : lead['phone']) != null ? _ref : ''),
-        website: String((_lead_website = lead.website) != null ? _lead_website : ''),
-        leadSource: String((_lead_leadSource = lead.leadSource) != null ? _lead_leadSource : ''),
-        tags: ((_lead_tags = lead.tags) != null ? _lead_tags : []).join(', '),
-        address: addressDraftFrom((_lead_address = lead.address) != null ? _lead_address : null)
-    };
-}
 /** The patch as the document takes it: a cleared field is deleted, not blanked. */ function profileWrite(patch) {
     const write = {};
     for (const [key, value] of Object.entries(patch)){
@@ -109,7 +101,7 @@ const TEXT_MAX = Aglyn.CRM_LEAD_TEXT_MAX;
  * conversion, and the header's actions become links to what the conversion
  * made.
  */ export function LeadPropertiesCard(props) {
-    var _lead_phone, _lead_notes, _lead_email, _lead_email1, _lead_name, _lead_email2, _lead_leadSource;
+    var _lead_phone, _lead_mobilePhone, _lead_notes, _lead_email, _lead_email1, _lead_name, _lead_email2;
     const { hostId, consentGroup, orgId, leadId, lead, leadStatus, fromCache, basePath, roster, onConvert, onUnqualify, extraMenuItems = [], banner, extraChips, erasurePending = false, org } = props;
     const firestore = useFirestore();
     const { enqueueSnackbar } = useSnackbar();
@@ -128,35 +120,38 @@ const TEXT_MAX = Aglyn.CRM_LEAD_TEXT_MAX;
     // The last verdict on the address (AGL-3245), as the platform stamped it.
     const emailState = Aglyn.readEmailState(lead);
     /** What a capture that took a number left on the document (AGL-2661). */ const leadPhone = String((_lead_phone = lead['phone']) != null ? _lead_phone : '').trim();
+    const leadMobile = String((_lead_mobilePhone = lead.mobilePhone) != null ? _lead_mobilePhone : '').trim();
+    // The person asked not to be phoned (AGL-3513): a hint on every dial control.
+    const doNotCall = lead.doNotCall === true;
     const [notes, setNotes] = useState(String((_lead_notes = lead.notes) != null ? _lead_notes : ''));
     // The label's id, so the status combobox is named "Status" rather than
     // after the status it shows — see `LeadOwnerSelect`.
     const statusLabelId = useId();
     const [notesDirty, setNotesDirty] = useState(false);
     /*
-   * THE LEAD'S OWN PROFILE (AGL-3231) — company, title, phone, website,
-   * address, tags, lead source — edited in the Details card with the notes
-   * and the custom fields, under one Save, the way the contact's Properties
-   * card saves. Seeded from the document and guarded on save: a draft
-   * edited over a cached read must not overwrite a newer profile with an
-   * older one.
-   */ const [profile, setProfile] = useState(()=>profileDraftFrom(lead));
+   * THE LEAD'S OWN PROFILE (AGL-3231, AGL-3513) — the name's parts,
+   * company, title, the phones, website, address, tags, lead source,
+   * industry, rating, size and revenue — edited in the Details card with
+   * the notes and the custom fields, under one Save, the way the contact's
+   * Properties card saves. Seeded from the document and guarded on save: a
+   * draft edited over a cached read must not overwrite a newer profile
+   * with an older one.
+   */ const [profile, setProfile] = useState(()=>leadProfileDraftFrom(lead));
     const [profileDirty, setProfileDirty] = useState(false);
     const [saving, setSaving] = useState(false);
     const [profileErrors, setProfileErrors] = useState({});
+    // The stored profile as one value, so a change to any of its fields reseeds.
+    const profileSeed = JSON.stringify(Aglyn.CRM_LEAD_PROFILE_KEYS.map((key)=>{
+        var _lead_key;
+        return (_lead_key = lead[key]) != null ? _lead_key : null;
+    }));
     useEffect(()=>{
-        if (!profileDirty) setProfile(profileDraftFrom(lead));
-    // The draft follows the document until it is edited; the fields are
-    // read one by one so a change to any of them reseeds.
+        if (!profileDirty) setProfile(leadProfileDraftFrom(lead));
+    // The draft follows the document until it is edited.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [
         profileDirty,
-        lead.company,
-        lead.jobTitle,
-        lead.phone,
-        lead.website,
-        lead.leadSource,
-        lead.tags,
-        lead.address
+        profileSeed
     ]);
     /*
    * THE ORG'S OWN LEAD FIELDS (AGL-3272), edited under the same Save as
@@ -170,6 +165,14 @@ const TEXT_MAX = Aglyn.CRM_LEAD_TEXT_MAX;
    */ const fields = useContactFieldDefinitions(orgId, 'lead');
     // The org's lead source values (AGL-3298), for the select below.
     const leadSources = useLeadSourcePicklist(orgId);
+    // The org's lead status values (AGL-3512): the chip's words and the select's choices.
+    const leadStatuses = useLeadStatusPicklist(orgId);
+    // The org's Salutation, Industry and Rating lists (AGL-3513).
+    const leadPicklists = useLeadPicklists(orgId);
+    const statusChoices = useMemo(()=>leadStatusChoices(leadStatuses.picklist, lead), [
+        leadStatuses.picklist,
+        lead
+    ]);
     const storedCustom = useMemo(()=>{
         var _lead_custom;
         return (_lead_custom = lead.custom) != null ? _lead_custom : {};
@@ -229,7 +232,7 @@ const TEXT_MAX = Aglyn.CRM_LEAD_TEXT_MAX;
     const dirty = profileDirty || customChanged || notesDirty;
     /** Every draft back to what the document holds. */ const discard = ()=>{
         var _lead_notes;
-        setProfile(profileDraftFrom(lead));
+        setProfile(leadProfileDraftFrom(lead));
         setProfileDirty(false);
         setProfileErrors({});
         setCustom({});
@@ -243,17 +246,12 @@ const TEXT_MAX = Aglyn.CRM_LEAD_TEXT_MAX;
    */ const saveDetails = async ()=>{
         const update = {};
         if (!converted && (profileDirty || customChanged)) {
-            const { patch, errors } = Aglyn.normalizeCrmLeadProfile({
-                company: profile.company,
-                jobTitle: profile.jobTitle,
-                phone: profile.phone,
-                website: profile.website,
-                leadSource: profile.leadSource,
-                tags: profile.tags,
-                address: profile.address
-            });
-            setProfileErrors(errors);
-            if (Object.keys(errors).length) return;
+            const { body, revenueError } = leadProfileDraftBody(profile);
+            const { patch, errors } = Aglyn.normalizeCrmLeadProfile(body);
+            const shown = _extends({}, errors);
+            if (revenueError) shown['annualRevenueCents'] = revenueError;
+            setProfileErrors(shown);
+            if (Object.keys(shown).length) return;
             /*
        * A required field the reader CLEARED is refused; one the lead has
        * always lacked is not this save's to demand, or a field added after
@@ -266,6 +264,9 @@ const TEXT_MAX = Aglyn.CRM_LEAD_TEXT_MAX;
                 return;
             }
             const profileFields = profileWrite(patch);
+            // While a first or last name is set, the name is theirs (AGL-3513).
+            const composed = Aglyn.crmLeadComposedName(lead, patch);
+            if (composed && composed !== lead['name']) profileFields['name'] = composed;
             Object.assign(update, profileFields, crmCustomDraftWrites(storedCustom, custom), // The company, title, tags and lead source are what the Leads list
             // searches and filters by (AGL-3321).
             crmClientListFields('leads', lead, profileFields, LEAD_CLIENT_LIST_FIELDS));
@@ -380,7 +381,8 @@ const TEXT_MAX = Aglyn.CRM_LEAD_TEXT_MAX;
                             link: {
                                 leadId
                             },
-                            phone: leadPhone
+                            phone: leadPhone || leadMobile,
+                            doNotCall: doNotCall
                         }),
                         /*#__PURE__*/ _jsx(CrmSendEmailButton, {
                             hostId: hostId,
@@ -401,7 +403,7 @@ const TEXT_MAX = Aglyn.CRM_LEAD_TEXT_MAX;
                                 size: 0.8
                             }),
                             destructive: true,
-                            onClick: onUnqualify
+                            onClick: ()=>onUnqualify()
                         }
                     ] : [],
                     ...extraMenuItems
@@ -409,7 +411,8 @@ const TEXT_MAX = Aglyn.CRM_LEAD_TEXT_MAX;
                 chips: /*#__PURE__*/ _jsxs(_Fragment, {
                     children: [
                         /*#__PURE__*/ _jsx(LeadStatusChip, {
-                            lead: lead
+                            lead: lead,
+                            statuses: leadStatuses.picklist
                         }),
                         /*#__PURE__*/ _jsx(CrmEmailStateChip, {
                             state: emailState
@@ -433,7 +436,15 @@ const TEXT_MAX = Aglyn.CRM_LEAD_TEXT_MAX;
                         leadPhone ? /*#__PURE__*/ _jsx(Fact, {
                             label: "Phone",
                             children: /*#__PURE__*/ _jsx(CrmPhoneLink, {
-                                phone: leadPhone
+                                phone: leadPhone,
+                                doNotCall: doNotCall
+                            })
+                        }) : null,
+                        leadMobile ? /*#__PURE__*/ _jsx(Fact, {
+                            label: "Mobile phone",
+                            children: /*#__PURE__*/ _jsx(CrmPhoneLink, {
+                                phone: leadMobile,
+                                doNotCall: doNotCall
                             })
                         }) : null,
                         /*#__PURE__*/ _jsx(Fact, {
@@ -457,7 +468,8 @@ const TEXT_MAX = Aglyn.CRM_LEAD_TEXT_MAX;
                                         },
                                         children: [
                                             /*#__PURE__*/ _jsx(LeadStatusChip, {
-                                                lead: lead
+                                                lead: lead,
+                                                statuses: leadStatuses.picklist
                                             }),
                                             /*#__PURE__*/ _jsx(Typography, {
                                                 variant: "body2",
@@ -476,42 +488,29 @@ const TEXT_MAX = Aglyn.CRM_LEAD_TEXT_MAX;
                                             id: statusLabelId,
                                             children: 'Status'
                                         }),
-                                        /*#__PURE__*/ _jsxs(Select, {
+                                        /*#__PURE__*/ _jsx(Select, {
                                             labelId: statusLabelId,
                                             label: "Status",
-                                            value: status === 'unqualified' ? 'unqualified' : status,
+                                            value: Aglyn.crmLeadStatusLabel(lead, leadStatuses.picklist),
                                             onChange: (event)=>{
-                                                const next = String(event.target.value);
-                                                if (next === 'unqualified') {
-                                                    onUnqualify();
+                                                const choice = statusChoices.find((entry)=>entry.label === event.target.value);
+                                                if (!choice) return;
+                                                if (choice.status === 'unqualified') {
+                                                    onUnqualify(choice.label);
                                                     return;
                                                 }
-                                                // Reopening drops the reason with the closed state: a lead
-                                                // being worked again is not "unqualified because …".
+                                                // The meaning and the org's label for it, together
+                                                // (AGL-3512). Reopening drops the reason with the closed
+                                                // state: a lead being worked again is not "unqualified
+                                                // because …".
                                                 void write(_extends({
-                                                    status: next
+                                                    status: choice.status,
+                                                    statusLabel: choice.label
                                                 }, status === 'unqualified' ? {
                                                     unqualifiedReason: deleteField()
                                                 } : {}), 'Status updated');
                                             },
-                                            children: [
-                                                /*#__PURE__*/ _jsx(MenuItem, {
-                                                    value: "new",
-                                                    children: Aglyn.CRM_LEAD_STATUS_LABELS.new
-                                                }),
-                                                /*#__PURE__*/ _jsx(MenuItem, {
-                                                    value: "nurturing",
-                                                    children: Aglyn.CRM_LEAD_STATUS_LABELS.nurturing
-                                                }),
-                                                /*#__PURE__*/ _jsx(MenuItem, {
-                                                    value: "working",
-                                                    children: Aglyn.CRM_LEAD_STATUS_LABELS.working
-                                                }),
-                                                /*#__PURE__*/ _jsx(MenuItem, {
-                                                    value: "unqualified",
-                                                    children: `${Aglyn.CRM_LEAD_STATUS_LABELS.unqualified}…`
-                                                })
-                                            ]
+                                            children: leadStatusMenuItems(statusChoices)
                                         })
                                     ]
                                 }),
@@ -563,104 +562,14 @@ const TEXT_MAX = Aglyn.CRM_LEAD_TEXT_MAX;
                 children: /*#__PURE__*/ _jsxs(Stack, {
                     spacing: 2,
                     children: [
-                        /*#__PURE__*/ _jsxs(Stack, {
-                            direction: {
-                                xs: 'column',
-                                md: 'row'
-                            },
-                            spacing: 2,
-                            children: [
-                                /*#__PURE__*/ _jsx(TextField, {
-                                    size: "small",
-                                    label: "Company",
-                                    value: profile.company,
-                                    onChange: (event)=>editProfile('company', event.target.value),
-                                    disabled: converted,
-                                    slotProps: {
-                                        htmlInput: {
-                                            maxLength: TEXT_MAX
-                                        }
-                                    },
-                                    fullWidth: true
-                                }),
-                                /*#__PURE__*/ _jsx(TextField, {
-                                    size: "small",
-                                    label: "Job title",
-                                    value: profile.jobTitle,
-                                    onChange: (event)=>editProfile('jobTitle', event.target.value),
-                                    disabled: converted,
-                                    slotProps: {
-                                        htmlInput: {
-                                            maxLength: TEXT_MAX
-                                        }
-                                    },
-                                    fullWidth: true
-                                })
-                            ]
-                        }),
-                        /*#__PURE__*/ _jsxs(Stack, {
-                            direction: {
-                                xs: 'column',
-                                md: 'row'
-                            },
-                            spacing: 2,
-                            children: [
-                                /*#__PURE__*/ _jsx(TextField, {
-                                    size: "small",
-                                    label: "Phone",
-                                    value: profile.phone,
-                                    onChange: (event)=>editProfile('phone', event.target.value),
-                                    disabled: converted,
-                                    error: Boolean(profileErrors['phone']),
-                                    helperText: profileErrors['phone'] || 'With the country code, like +1 512 555 0107',
-                                    fullWidth: true
-                                }),
-                                /*#__PURE__*/ _jsx(TextField, {
-                                    size: "small",
-                                    label: "Website",
-                                    value: profile.website,
-                                    onChange: (event)=>editProfile('website', event.target.value),
-                                    disabled: converted,
-                                    error: Boolean(profileErrors['website']),
-                                    helperText: profileErrors['website'] || 'Like acme.com',
-                                    fullWidth: true
-                                })
-                            ]
-                        }),
-                        /*#__PURE__*/ _jsxs(Stack, {
-                            direction: {
-                                xs: 'column',
-                                md: 'row'
-                            },
-                            spacing: 2,
-                            children: [
-                                /*#__PURE__*/ _jsx(LeadSourceSelect, {
-                                    picklist: leadSources.picklist,
-                                    value: profile.leadSource,
-                                    stored: String((_lead_leadSource = lead.leadSource) != null ? _lead_leadSource : ''),
-                                    onChange: (label)=>editProfile('leadSource', label),
-                                    disabled: converted
-                                }),
-                                /*#__PURE__*/ _jsx(TextField, {
-                                    size: "small",
-                                    label: "Tags",
-                                    value: profile.tags,
-                                    onChange: (event)=>editProfile('tags', event.target.value),
-                                    disabled: converted,
-                                    helperText: "Comma-separated",
-                                    fullWidth: true
-                                })
-                            ]
-                        }),
-                        /*#__PURE__*/ _jsx(Typography, {
-                            variant: "caption",
-                            color: "text.secondary",
-                            children: 'Address'
-                        }),
-                        /*#__PURE__*/ _jsx(ContactAddressFields, {
-                            value: profile.address,
-                            onChange: (next)=>editProfile('address', next),
-                            disabled: converted
+                        /*#__PURE__*/ _jsx(LeadProfileFields, {
+                            draft: profile,
+                            onChange: editProfile,
+                            errors: profileErrors,
+                            disabled: converted,
+                            leadSources: leadSources.picklist,
+                            lists: leadPicklists.lists,
+                            stored: lead
                         }),
                         fields.active.length ? /*#__PURE__*/ _jsxs(_Fragment, {
                             children: [