@aglyn/plugins-crm 1.0.0-beta.143

package/src/lib/components/recipes-card.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../libs/plugins/crm/src/lib/components/recipes-card.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  type AglynOrgBilling,\n  checkEntitlement,\n  CRM_ACTION_RECIPES,\n  type CrmActionRecipe,\n  type CrmActionRecipeId,\n  planLabelGrantingFeature,\n  pluginDocsHelp,\n} from '@aglyn/aglyn'\nimport { AppLink, CardDisplay, SrOnly } from '@aglyn/shared-ui-jsx'\nimport { ScrollTable } from '@aglyn/shared-ui-jsx/components/scroll-table.component'\nimport { useSnackbar } from '@aglyn/shared-ui-snackstack'\nimport {\n  ceilingedWindow,\n  collectionCeiling,\n  useFirestore,\n  useFirestoreCollection,\n} from '@aglyn/tenant-feature-instance'\nimport {\n  Alert,\n  Button,\n  Drawer,\n  MenuItem,\n  Stack,\n  TableBody,\n  TableCell,\n  TableHead,\n  TableRow,\n  TextField,\n  Typography,\n} from '@mui/material'\nimport { collection } from 'firebase/firestore'\nimport { Fragment, useCallback, useEffect, useMemo, useState } from 'react'\nimport type {\n  CrmRecipeInstallResult,\n  CrmRecipeSiteStatus,\n} from '../constants/api-routes'\nimport { type CrmOrgMount, useCrmOrgMount } from '../hooks/use-crm-org-mount'\nimport { useCrmApi } from './use-crm-api'\n\n/** How many of a site's forms the picker offers before it says it stopped. */\nconst FORM_OPTION_CEILING = 100\n\n/**\n * The site's Automation → Actions page — where an installed action lives\n * and is edited — or `null` for a site whose subdomain the mount could not\n * answer, which is named and not linked.\n */\nfunction siteActionsHref(mount: CrmOrgMount, hostId: string): string | null {\n  const subdomain = mount.siteSubdomain(hostId)\n  return subdomain\n    ? `${mount.hostsPath}/${encodeURIComponent(subdomain)}/automation/actions`\n    : null\n}\n\n/**\n * Where a site stands with one recipe, read off the stamps the status route\n * answered. `maybe` is the third answer and the honest one: the site\n * carries actions saved before the stamp existed, any of which could have\n * started from the recipe, so the card neither lists the site as carrying\n * it nor offers the install as if to a blank site. `unread` is the answer\n * before the route has answered, or for a site it did not name.\n */\ntype SiteStanding = 'installed' | 'maybe' | 'clear' | 'unread'\n\nfunction standingOf(\n  status: ReadonlyMap<string, CrmRecipeSiteStatus> | null,\n  hostId: string,\n  recipeId: CrmActionRecipeId,\n): SiteStanding {\n  const site = status?.get(hostId)\n  if (!site) return 'unread'\n  if (site.installed.includes(recipeId)) return 'installed'\n  return site.unstamped > 0 ? 'maybe' : 'clear'\n}\n\n/**\n * The stamps of every site of the org, read once the site list is known\n * and again after each install, so the card reports what the documents\n * say rather than what it last did.\n */\nfunction useRecipeStatus(mount: CrmOrgMount | null) {\n  const api = useCrmApi(null)\n  const [sites, setSites] = useState<Map<string, CrmRecipeSiteStatus> | null>(null)\n  const [error, setError] = useState<string | null>(null)\n  const refresh = useCallback(async () => {\n    try {\n      const { response, payload } = await api('recipe-status', {})\n      if (!response.ok) {\n        setError(payload?.error ?? 'Which sites carry a recipe could not be read.')\n        return\n      }\n      const answered = (payload.sites ?? []) as CrmRecipeSiteStatus[]\n      setSites(new Map(answered.map((site) => [site.hostId, site])))\n      setError(null)\n    } catch (caught) {\n      console.error(caught)\n      setError('Which sites carry a recipe could not be read.')\n    }\n  }, [api])\n  const hostsReady = Boolean(mount?.hostsReady)\n  useEffect(() => {\n    if (hostsReady) void refresh()\n  }, [hostsReady, refresh])\n  return { sites, error, refresh }\n}\n\n/** A site's name, linked into its Actions page when the link is known. */\nfunction SiteLink(props: { mount: CrmOrgMount; hostId: string }) {\n  const { mount, hostId } = props\n  const href = siteActionsHref(mount, hostId)\n  const name = mount.siteName(hostId)\n  return href ? <AppLink href={href}>{name}</AppLink> : <>{name}</>\n}\nSiteLink.displayName = 'SiteLink'\n\n/** One recipe's \"Installed on\" cell: the sites that carry it, and the ones that may. */\nfunction InstalledOn(props: {\n  mount: CrmOrgMount\n  recipe: CrmActionRecipe\n  status: ReadonlyMap<string, CrmRecipeSiteStatus> | null\n}) {\n  const { mount, recipe, status } = props\n  if (!status) {\n    return (\n      <Typography variant=\"caption\" color=\"text.secondary\">\n        {'Reading…'}\n      </Typography>\n    )\n  }\n  const installed = mount.hosts.filter(\n    (host) => standingOf(status, host.id, recipe.id) === 'installed',\n  )\n  const maybe = mount.hosts.filter(\n    (host) => standingOf(status, host.id, recipe.id) === 'maybe',\n  )\n  return (\n    <Stack spacing={0.5}>\n      <Typography variant=\"body2\">\n        {installed.length === 0\n          ? 'Not installed on any site yet.'\n          : installed.map((host, index) => (\n              <Fragment key={host.id}>\n                {index > 0 ? ', ' : null}\n                <SiteLink mount={mount} hostId={host.id} />\n              </Fragment>\n            ))}\n      </Typography>\n      {maybe.length > 0 ? (\n        <Typography variant=\"caption\" color=\"text.secondary\">\n          {`May already have it: ${maybe.map((host) => host.name).join(', ')} — ` +\n            'actions there were saved before recipes were tracked.'}\n        </Typography>\n      ) : null}\n    </Stack>\n  )\n}\nInstalledOn.displayName = 'InstalledOn'\n\ninterface RecipeInstallFormProps {\n  recipe: CrmActionRecipe\n  mount: CrmOrgMount\n  status: ReadonlyMap<string, CrmRecipeSiteStatus> | null\n  onClose: () => void\n  onInstalled: (result: CrmRecipeInstallResult, hostId: string) => void\n}\n\n/**\n * The install drawer's body: pick the site, pick the form a recipe that\n * needs one is keyed on, confirm. Mounted fresh on every opening — the\n * Drawer unmounts it when closed — so the picks start over each time from\n * the session's site, when that site does not already carry the recipe.\n *\n * The forms are read from the picked site only once a site is picked and\n * only for a recipe that needs one, so a reader installing the other three\n * pays no read. Live forms only: an archived form collects nothing, and a\n * recipe keyed on it would never fire.\n */\nfunction RecipeInstallForm(props: RecipeInstallFormProps) {\n  const { recipe, mount, status, onClose, onInstalled } = props\n  const firestore = useFirestore()\n  const api = useCrmApi(null)\n  const needsForm = recipe.needs === 'form'\n  const [hostId, setHostId] = useState(() => {\n    const pick = mount.createHostId\n    return pick && standingOf(status, pick, recipe.id) !== 'installed' ? pick : ''\n  })\n  const [formId, setFormId] = useState('')\n  const [busy, setBusy] = useState(false)\n  const [error, setError] = useState<string | null>(null)\n\n  const { data: formRead, status: formsStatus } = useFirestoreCollection<any>(\n    () =>\n      needsForm && hostId\n        ? collectionCeiling(\n            collection(firestore, 'hosts', hostId, 'forms'),\n            FORM_OPTION_CEILING,\n          )\n        : null,\n    [firestore, needsForm, hostId],\n    { idField: '$id' },\n  )\n  const { rows: formDocs, truncated: formsTruncated } = ceilingedWindow<any>(\n    formRead,\n    FORM_OPTION_CEILING,\n  )\n  const formOptions = useMemo(\n    () =>\n      (formDocs ?? [])\n        .filter((form: any) => !form.archivedAt)\n        .map((form: any) => ({\n          id: form.$id as string,\n          name: (String(form.displayName ?? '').trim() || form.$id) as string,\n        }))\n        .sort((a: { name: string }, b: { name: string }) =>\n          a.name.localeCompare(b.name),\n        ),\n    [formDocs],\n  )\n  const formsLoading = needsForm && Boolean(hostId) && formsStatus === 'loading'\n\n  const canInstall =\n    Boolean(hostId) && (!needsForm || Boolean(formId)) && !busy && !formsLoading\n\n  const handleInstall = async () => {\n    if (!canInstall) return\n    setBusy(true)\n    setError(null)\n    try {\n      const { response, payload } = await api('recipe-install', {\n        hostId,\n        recipeId: recipe.id,\n        ...(formId ? { formId } : {}),\n      })\n      if (!response.ok) {\n        setError(payload?.error ?? 'The recipe could not be installed.')\n        return\n      }\n      onInstalled(payload as CrmRecipeInstallResult, hostId)\n    } catch (caught) {\n      console.error(caught)\n      setError('The recipe could not be installed.')\n    } finally {\n      setBusy(false)\n    }\n  }\n\n  const siteSuffix = (id: string) => {\n    const standing = standingOf(status, id, recipe.id)\n    if (standing === 'installed') return ' — installed'\n    if (standing === 'maybe') return ' — may already have it'\n    return ''\n  }\n\n  return (\n    <Stack spacing={2} sx={{ width: 380, p: 3 }}>\n      <Typography variant=\"h6\">{`Install “${recipe.title}”`}</Typography>\n      <Typography variant=\"body2\" color=\"text.secondary\">\n        {recipe.description}\n      </Typography>\n      <TextField\n        select\n        size=\"small\"\n        label=\"Site\"\n        value={hostId}\n        onChange={(event) => {\n          setHostId(event.target.value)\n          setFormId('')\n          setError(null)\n        }}\n        disabled={busy}\n        helperText={\n          mount.hosts.length === 0\n            ? 'This organization has no sites yet.'\n            : 'The action is written into this site’s Automation → Actions.'\n        }\n        fullWidth\n      >\n        {mount.hosts.map((host) => (\n          <MenuItem\n            key={host.id}\n            value={host.id}\n            disabled={standingOf(status, host.id, recipe.id) === 'installed'}\n          >\n            {`${host.name}${siteSuffix(host.id)}`}\n          </MenuItem>\n        ))}\n      </TextField>\n      {needsForm ? (\n        <TextField\n          select\n          size=\"small\"\n          label=\"Form\"\n          value={formId}\n          onChange={(event) => setFormId(event.target.value)}\n          disabled={!hostId || busy || formsLoading}\n          helperText={\n            !hostId\n              ? 'Pick the site first; the recipe is keyed on one of its forms.'\n              : formsLoading\n                ? 'Loading the site’s forms…'\n                : formOptions.length === 0\n                  ? 'This site has no live forms.'\n                  : formsTruncated\n                    ? `Showing the first ${FORM_OPTION_CEILING} forms.`\n                    : 'Contacts this form makes are tagged with its name.'\n          }\n          fullWidth\n        >\n          {formOptions.map((form) => (\n            <MenuItem key={form.id} value={form.id}>\n              {form.name}\n            </MenuItem>\n          ))}\n        </TextField>\n      ) : null}\n      <Typography variant=\"caption\" color=\"text.secondary\">\n        {'The action is created enabled, exactly as the recipe defines it. ' +\n          'Change anything afterwards from the site’s Automation → Actions page.'}\n      </Typography>\n      {error ? (\n        <Typography variant=\"body2\" color=\"error\">\n          {error}\n        </Typography>\n      ) : null}\n      <Stack direction=\"row\" spacing={1}>\n        <Button\n          variant=\"contained\"\n          color=\"primary\"\n          disabled={!canInstall}\n          onClick={() => void handleInstall()}\n        >\n          {busy ? 'Installing…' : 'Install'}\n        </Button>\n        <Button onClick={onClose} disabled={busy}>\n          {'Cancel'}\n        </Button>\n      </Stack>\n    </Stack>\n  )\n}\nRecipeInstallForm.displayName = 'RecipeInstallForm'\n\nexport interface RecipesCardProps {\n  org?: Partial<AglynOrgBilling> | null\n}\n\n/**\n * \"Recipes\" — the CRM's ready-made automations, installed on a site from\n * the organization (AGL-2639).\n *\n * ## Why this card exists at the org level and nowhere else\n *\n * Automation is a site feature: a site's Actions page has a Recipes menu\n * that opens the editor prefilled, and the person saves what they see.\n * The org hub mounts over every site with no editor of its own, so it had\n * no recipes at all, and an org running five sites installed \"Welcome a\n * new lead\" five times by hand. This card is the org's door: every recipe,\n * the sites that already carry it, and Install, which writes the action\n * into the site the reader picks through the server — the server stamps\n * the recipe, refuses a site outside the org, and refuses a second copy.\n * Under a site the section does not mount it; the site's own menu is the\n * right door there.\n *\n * ## \"Installed on\" reads the stamp, and says when it cannot\n *\n * The status route answers, per site, the recipes a live action is stamped\n * with and how many live actions carry no stamp. A site with any of the\n * latter is named as one that MAY already have the recipe rather than\n * listed as clear: those actions were saved before the stamp existed and\n * the card cannot tell a hand-built welcome from an installed one.\n *\n * ## Creation opens a drawer\n *\n * Install is a button per row; the picks — the site, and for Tag by form\n * one of that site's forms — live in a drawer, never above the list.\n */\nexport function RecipesCard(props: RecipesCardProps) {\n  const { org } = props\n  const mount = useCrmOrgMount()\n  const { enqueueSnackbar } = useSnackbar()\n  const status = useRecipeStatus(mount)\n  const refreshStatus = status.refresh\n  const [installing, setInstalling] = useState<CrmActionRecipe | null>(null)\n  const [lastInstall, setLastInstall] = useState<{\n    hostId: string\n    name: string\n  } | null>(null)\n\n  const entitled = checkEntitlement(org, 'actions')\n  const canInstall = Boolean(mount?.hostsReady) && entitled\n\n  const handleInstalled = useCallback(\n    (result: CrmRecipeInstallResult, hostId: string) => {\n      setInstalling(null)\n      setLastInstall({ hostId, name: result.name })\n      enqueueSnackbar(\n        `Installed “${result.name}” on ${mount?.siteName(hostId) ?? hostId}`,\n        { variant: 'success', persist: false },\n      )\n      void refreshStatus()\n    },\n    [enqueueSnackbar, mount, refreshStatus],\n  )\n\n  // Mounted by the section only beneath the org hub's provider; the hooks\n  // above run either way, so the render order never depends on the mount.\n  if (!mount) return null\n\n  const lastInstallHref = lastInstall ? siteActionsHref(mount, lastInstall.hostId) : null\n  return (\n    <CardDisplay\n      header={'Recipes'}\n      help={pluginDocsHelp('crmSettings', { anchor: '#recipes' })}\n      contentGutterX\n      contentGutterY\n      contentBordered=\"all\"\n    >\n      <Stack spacing={2}>\n        <Typography variant=\"body2\" color=\"text.secondary\">\n          {'Ready-made automations for the CRM. Install one on a site and the ' +\n            'action is written into that site’s Automation → Actions as the ' +\n            'recipe defines it, where it can be edited like any other action.'}\n        </Typography>\n        {lastInstall ? (\n          <Alert\n            severity=\"success\"\n            onClose={() => setLastInstall(null)}\n            action={\n              lastInstallHref ? (\n                // A link dressed as a button: the anchor carries its own\n                // href, so it keeps the link role a navigation door has.\n                <Button\n                  component={AppLink as any}\n                  {...({\n                    componentVariant: 'naked',\n                    nativeButton: false,\n                  } as any)}\n                  href={lastInstallHref}\n                  size=\"small\"\n                  color=\"inherit\"\n                >\n                  {'Open Automation → Actions'}\n                </Button>\n              ) : undefined\n            }\n          >\n            {`Installed “${lastInstall.name}” on ${mount.siteName(lastInstall.hostId)}.`}\n          </Alert>\n        ) : null}\n        {status.error ? (\n          <Typography variant=\"caption\" color=\"error\">\n            {status.error}\n          </Typography>\n        ) : null}\n        <ScrollTable size=\"small\">\n          <TableHead>\n            <TableRow>\n              <TableCell>{'Recipe'}</TableCell>\n              <TableCell>{'Installed on'}</TableCell>\n              <TableCell align=\"right\" />\n            </TableRow>\n          </TableHead>\n          <TableBody>\n            {CRM_ACTION_RECIPES.map((recipe) => (\n              <TableRow key={recipe.id} hover>\n                <TableCell sx={{ maxWidth: 360 }}>\n                  <Typography variant=\"body2\">{recipe.title}</Typography>\n                  <Typography variant=\"caption\" color=\"text.secondary\">\n                    {recipe.description}\n                  </Typography>\n                </TableCell>\n                <TableCell>\n                  <InstalledOn mount={mount} recipe={recipe} status={status.sites} />\n                </TableCell>\n                <TableCell align=\"right\" sx={{ width: 120 }}>\n                  <Button\n                    size=\"small\"\n                    variant=\"outlined\"\n                    disabled={!canInstall}\n                    onClick={() => setInstalling(recipe)}\n                  >\n                    {'Install'}\n                    <SrOnly>{` ${recipe.title}`}</SrOnly>\n                  </Button>\n                </TableCell>\n              </TableRow>\n            ))}\n          </TableBody>\n        </ScrollTable>\n        {!entitled ? (\n          <Typography variant=\"caption\" color=\"text.secondary\">\n            {`The actions builder requires the ${planLabelGrantingFeature('actions') ?? 'Pro'} ` +\n              'plan — see Billing to upgrade.'}\n          </Typography>\n        ) : null}\n        {mount.hostsReady && mount.hosts.length === 0 ? (\n          <Typography variant=\"body2\" color=\"text.secondary\">\n            {'This organization has no sites yet, so there is nowhere to install a recipe.'}\n          </Typography>\n        ) : null}\n      </Stack>\n      <Drawer anchor=\"right\" open={Boolean(installing)} onClose={() => setInstalling(null)}>\n        {installing ? (\n          <RecipeInstallForm\n            recipe={installing}\n            mount={mount}\n            status={status.sites}\n            onClose={() => setInstalling(null)}\n            onInstalled={handleInstalled}\n          />\n        ) : null}\n      </Drawer>\n    </CardDisplay>\n  )\n}\nRecipesCard.displayName = 'RecipesCard'\n\nexport default RecipesCard\n"],"names":["checkEntitlement","CRM_ACTION_RECIPES","planLabelGrantingFeature","pluginDocsHelp","AppLink","CardDisplay","SrOnly","ScrollTable","useSnackbar","ceilingedWindow","collectionCeiling","useFirestore","useFirestoreCollection","Alert","Button","Drawer","MenuItem","Stack","TableBody","TableCell","TableHead","TableRow","TextField","Typography","collection","Fragment","useCallback","useEffect","useMemo","useState","useCrmOrgMount","useCrmApi","FORM_OPTION_CEILING","siteActionsHref","mount","hostId","subdomain","siteSubdomain","hostsPath","encodeURIComponent","standingOf","status","recipeId","site","get","installed","includes","unstamped","useRecipeStatus","api","sites","setSites","error","setError","refresh","payload","response","ok","answered","Map","map","caught","console","hostsReady","Boolean","SiteLink","props","href","name","siteName","displayName","InstalledOn","recipe","variant","color","hosts","filter","host","id","maybe","spacing","length","index","join","RecipeInstallForm","onClose","onInstalled","firestore","needsForm","needs","setHostId","pick","createHostId","formId","setFormId","busy","setBusy","data","formRead","formsStatus","idField","rows","formDocs","truncated","formsTruncated","formOptions","form","archivedAt","$id","String","trim","sort","a","b","localeCompare","formsLoading","canInstall","handleInstall","siteSuffix","standing","sx","width","p","title","description","select","size","label","value","onChange","event","target","disabled","helperText","fullWidth","direction","onClick","RecipesCard","org","enqueueSnackbar","refreshStatus","installing","setInstalling","lastInstall","setLastInstall","entitled","handleInstalled","result","persist","lastInstallHref","header","help","anchor","contentGutterX","contentGutterY","contentBordered","severity","action","component","componentVariant","nativeButton","undefined","align","hover","maxWidth","open"],"mappings":"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"}

package/src/lib/components/record-activity-card.d.ts

@@ -0,0 +1,26 @@
+import { type ActivityRecordLink, type CrmOrg } from './activity-queries';
+export type RecordActivityCardProps = ActivityRecordLink & {
+    /** The site the record is read under, or `null` at the organization level. */
+    hostId: string | null;
+    org: CrmOrg;
+};
+/**
+ * The activity log of one record — a contact, a company, a deal or a lead
+ * (AGL-2615) — with the button that adds to it (AGL-2600).
+ *
+ * One card for all four record pages, because the log is the same thing on
+ * each of them: what people did about this record, newest first, bounded to
+ * a page of a hundred with a foot that asks for the next hundred. Which
+ * record is decided by whichever of the four ids the page passes, and that
+ * id is what the dialog files a new activity against — the page fixes it,
+ * the reader does not pick it.
+ *
+ * The contact's page does NOT use this card. A person has a second history
+ * the platform captured on the row itself, and the two belong in one
+ * stream; see `contact-timeline-card.tsx`, which is this card's superset.
+ */
+export declare function RecordActivityCard(props: RecordActivityCardProps): import("react").JSX.Element;
+export declare namespace RecordActivityCard {
+    var displayName: string;
+}
+export default RecordActivityCard;

package/src/lib/components/record-activity-card.js

@@ -0,0 +1,121 @@
+/**
+ * @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, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { pluginDocsHelp } from "@aglyn/aglyn";
+import { CardDisplay } from "@aglyn/shared-ui-jsx";
+import { Button, Typography } from "@mui/material";
+import { useCallback, useMemo, useState } from "react";
+import { ActivityList } from "./activity-list.js";
+import { useActivityScope, useActivityWindow } from "./activity-queries.js";
+import { LogActivityDialog } from "./log-activity-dialog.js";
+/**
+ * The activity log of one record — a contact, a company, a deal or a lead
+ * (AGL-2615) — with the button that adds to it (AGL-2600).
+ *
+ * One card for all four record pages, because the log is the same thing on
+ * each of them: what people did about this record, newest first, bounded to
+ * a page of a hundred with a foot that asks for the next hundred. Which
+ * record is decided by whichever of the four ids the page passes, and that
+ * id is what the dialog files a new activity against — the page fixes it,
+ * the reader does not pick it.
+ *
+ * The contact's page does NOT use this card. A person has a second history
+ * the platform captured on the row itself, and the two belong in one
+ * stream; see `contact-timeline-card.tsx`, which is this card's superset.
+ */ export function RecordActivityCard(props) {
+    const { hostId, org, contactId, companyId, dealId, leadId } = props;
+    const scope = useActivityScope(hostId, org);
+    /*
+   * Memoized because the link is a listener dependency by value inside
+   * `useActivityWindow` and the dialog's prop by reference: a fresh object
+   * each render would be harmless to the query, which reads the ids, and
+   * noisy for anything that compares the object.
+   */ const link = useMemo(()=>({
+            contactId,
+            companyId,
+            dealId,
+            leadId
+        }), [
+        contactId,
+        companyId,
+        dealId,
+        leadId
+    ]);
+    const activities = useActivityWindow(scope, link);
+    const [dialogOpen, setDialogOpen] = useState(false);
+    const [editing, setEditing] = useState(null);
+    const openNew = useCallback(()=>{
+        setEditing(null);
+        setDialogOpen(true);
+    }, []);
+    const openEdit = useCallback((activity)=>{
+        setEditing(activity);
+        setDialogOpen(true);
+    }, []);
+    const close = useCallback(()=>setDialogOpen(false), []);
+    return /*#__PURE__*/ _jsxs(_Fragment, {
+        children: [
+            /*#__PURE__*/ _jsx(CardDisplay, {
+                header: 'Activity',
+                help: pluginDocsHelp('contactActivities', {
+                    anchor: '#logging-an-activity'
+                }),
+                actions: /*#__PURE__*/ _jsx(Button, {
+                    size: "small",
+                    variant: "contained",
+                    color: "primary",
+                    onClick: openNew,
+                    disabled: !activities.ready,
+                    children: 'Log activity'
+                }),
+                contentGutterX: true,
+                contentGutterY: true,
+                children: activities.status === 'error' ? /*#__PURE__*/ _jsx(Typography, {
+                    variant: "body2",
+                    color: "error",
+                    children: 'The activity log could not be loaded.'
+                }) : /*#__PURE__*/ _jsx(ActivityList, {
+                    rows: activities.rows,
+                    scope: scope,
+                    onEdit: openEdit,
+                    hasMore: activities.hasMore,
+                    onShowMore: activities.showMore,
+                    emptyText: "A call, an email, a meeting or a note about this record goes here.",
+                    emptyAction: /*#__PURE__*/ _jsx(Button, {
+                        size: "small",
+                        variant: "contained",
+                        color: "primary",
+                        onClick: openNew,
+                        disabled: !activities.ready,
+                        children: 'Log activity'
+                    })
+                })
+            }),
+            /*#__PURE__*/ _jsx(LogActivityDialog, {
+                open: dialogOpen,
+                onClose: close,
+                scope: scope,
+                link: link,
+                activity: editing
+            })
+        ]
+    });
+}
+RecordActivityCard.displayName = 'RecordActivityCard';
+export default RecordActivityCard;
+
+//# sourceMappingURL=record-activity-card.js.map

package/src/lib/components/record-activity-card.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../libs/plugins/crm/src/lib/components/record-activity-card.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 type { CrmActivityRow } from '@aglyn/aglyn'\nimport { pluginDocsHelp } from '@aglyn/aglyn'\nimport { CardDisplay } from '@aglyn/shared-ui-jsx'\nimport { Button, Typography } from '@mui/material'\nimport { useCallback, useMemo, useState } from 'react'\nimport { ActivityList } from './activity-list'\nimport {\n  type ActivityRecordLink,\n  type CrmOrg,\n  useActivityScope,\n  useActivityWindow,\n} from './activity-queries'\nimport { LogActivityDialog } from './log-activity-dialog'\n\nexport type RecordActivityCardProps = ActivityRecordLink & {\n  /** The site the record is read under, or `null` at the organization level. */\n  hostId: string | null\n  org: CrmOrg\n}\n\n/**\n * The activity log of one record — a contact, a company, a deal or a lead\n * (AGL-2615) — with the button that adds to it (AGL-2600).\n *\n * One card for all four record pages, because the log is the same thing on\n * each of them: what people did about this record, newest first, bounded to\n * a page of a hundred with a foot that asks for the next hundred. Which\n * record is decided by whichever of the four ids the page passes, and that\n * id is what the dialog files a new activity against — the page fixes it,\n * the reader does not pick it.\n *\n * The contact's page does NOT use this card. A person has a second history\n * the platform captured on the row itself, and the two belong in one\n * stream; see `contact-timeline-card.tsx`, which is this card's superset.\n */\nexport function RecordActivityCard(props: RecordActivityCardProps) {\n  const { hostId, org, contactId, companyId, dealId, leadId } = props\n  const scope = useActivityScope(hostId, org)\n  /*\n   * Memoized because the link is a listener dependency by value inside\n   * `useActivityWindow` and the dialog's prop by reference: a fresh object\n   * each render would be harmless to the query, which reads the ids, and\n   * noisy for anything that compares the object.\n   */\n  const link = useMemo<ActivityRecordLink>(\n    () => ({ contactId, companyId, dealId, leadId }),\n    [contactId, companyId, dealId, leadId],\n  )\n  const activities = useActivityWindow(scope, link)\n  const [dialogOpen, setDialogOpen] = useState(false)\n  const [editing, setEditing] = useState<CrmActivityRow | null>(null)\n  const openNew = useCallback(() => {\n    setEditing(null)\n    setDialogOpen(true)\n  }, [])\n  const openEdit = useCallback((activity: CrmActivityRow) => {\n    setEditing(activity)\n    setDialogOpen(true)\n  }, [])\n  const close = useCallback(() => setDialogOpen(false), [])\n\n  return (\n    <>\n      <CardDisplay\n        header={'Activity'}\n        help={pluginDocsHelp('contactActivities', { anchor: '#logging-an-activity' })}\n        actions={\n          <Button\n            size=\"small\"\n            variant=\"contained\"\n            color=\"primary\"\n            onClick={openNew}\n            disabled={!activities.ready}\n          >\n            {'Log activity'}\n          </Button>\n        }\n        contentGutterX\n        contentGutterY\n      >\n        {activities.status === 'error' ? (\n          <Typography variant=\"body2\" color=\"error\">\n            {'The activity log could not be loaded.'}\n          </Typography>\n        ) : (\n          <ActivityList\n            rows={activities.rows}\n            scope={scope}\n            onEdit={openEdit}\n            hasMore={activities.hasMore}\n            onShowMore={activities.showMore}\n            emptyText=\"A call, an email, a meeting or a note about this record goes here.\"\n            emptyAction={\n              <Button\n                size=\"small\"\n                variant=\"contained\"\n                color=\"primary\"\n                onClick={openNew}\n                disabled={!activities.ready}\n              >\n                {'Log activity'}\n              </Button>\n            }\n          />\n        )}\n      </CardDisplay>\n      <LogActivityDialog\n        open={dialogOpen}\n        onClose={close}\n        scope={scope}\n        link={link}\n        activity={editing}\n      />\n    </>\n  )\n}\nRecordActivityCard.displayName = 'RecordActivityCard'\n\nexport default RecordActivityCard\n"],"names":["pluginDocsHelp","CardDisplay","Button","Typography","useCallback","useMemo","useState","ActivityList","useActivityScope","useActivityWindow","LogActivityDialog","RecordActivityCard","props","hostId","org","contactId","companyId","dealId","leadId","scope","link","activities","dialogOpen","setDialogOpen","editing","setEditing","openNew","openEdit","activity","close","header","help","anchor","actions","size","variant","color","onClick","disabled","ready","contentGutterX","contentGutterY","status","rows","onEdit","hasMore","onShowMore","showMore","emptyText","emptyAction","open","onClose","displayName"],"mappings":"AAAA;;;;;;;;;;;;;;;CAeC,GACD;;AAGA,SAASA,cAAc,QAAQ,eAAc;AAC7C,SAASC,WAAW,QAAQ,uBAAsB;AAClD,SAASC,MAAM,EAAEC,UAAU,QAAQ,gBAAe;AAClD,SAASC,WAAW,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,QAAO;AACtD,SAASC,YAAY,QAAQ,qBAAiB;AAC9C,SAGEC,gBAAgB,EAChBC,iBAAiB,QACZ,wBAAoB;AAC3B,SAASC,iBAAiB,QAAQ,2BAAuB;AAQzD;;;;;;;;;;;;;;CAcC,GACD,OAAO,SAASC,mBAAmBC,KAA8B;IAC/D,MAAM,EAAEC,MAAM,EAAEC,GAAG,EAAEC,SAAS,EAAEC,SAAS,EAAEC,MAAM,EAAEC,MAAM,EAAE,GAAGN;IAC9D,MAAMO,QAAQX,iBAAiBK,QAAQC;IACvC;;;;;GAKC,GACD,MAAMM,OAAOf,QACX,IAAO,CAAA;YAAEU;YAAWC;YAAWC;YAAQC;QAAO,CAAA,GAC9C;QAACH;QAAWC;QAAWC;QAAQC;KAAO;IAExC,MAAMG,aAAaZ,kBAAkBU,OAAOC;IAC5C,MAAM,CAACE,YAAYC,cAAc,GAAGjB,SAAS;IAC7C,MAAM,CAACkB,SAASC,WAAW,GAAGnB,SAAgC;IAC9D,MAAMoB,UAAUtB,YAAY;QAC1BqB,WAAW;QACXF,cAAc;IAChB,GAAG,EAAE;IACL,MAAMI,WAAWvB,YAAY,CAACwB;QAC5BH,WAAWG;QACXL,cAAc;IAChB,GAAG,EAAE;IACL,MAAMM,QAAQzB,YAAY,IAAMmB,cAAc,QAAQ,EAAE;IAExD,qBACE;;0BACE,KAACtB;gBACC6B,QAAQ;gBACRC,MAAM/B,eAAe,qBAAqB;oBAAEgC,QAAQ;gBAAuB;gBAC3EC,uBACE,KAAC/B;oBACCgC,MAAK;oBACLC,SAAQ;oBACRC,OAAM;oBACNC,SAASX;oBACTY,UAAU,CAACjB,WAAWkB,KAAK;8BAE1B;;gBAGLC,cAAc;gBACdC,cAAc;0BAEbpB,WAAWqB,MAAM,KAAK,wBACrB,KAACvC;oBAAWgC,SAAQ;oBAAQC,OAAM;8BAC/B;mCAGH,KAAC7B;oBACCoC,MAAMtB,WAAWsB,IAAI;oBACrBxB,OAAOA;oBACPyB,QAAQjB;oBACRkB,SAASxB,WAAWwB,OAAO;oBAC3BC,YAAYzB,WAAW0B,QAAQ;oBAC/BC,WAAU;oBACVC,2BACE,KAAC/C;wBACCgC,MAAK;wBACLC,SAAQ;wBACRC,OAAM;wBACNC,SAASX;wBACTY,UAAU,CAACjB,WAAWkB,KAAK;kCAE1B;;;;0BAMX,KAAC7B;gBACCwC,MAAM5B;gBACN6B,SAAStB;gBACTV,OAAOA;gBACPC,MAAMA;gBACNQ,UAAUJ;;;;AAIlB;AACAb,mBAAmByC,WAAW,GAAG;AAEjC,eAAezC,mBAAkB"}

package/src/lib/components/record-files-card.d.ts

@@ -0,0 +1,67 @@
+export interface RecordFilesCardProps {
+    /** `['orgs', orgId]`, or `null` while the org is unresolved. */
+    scope: readonly [string, string] | null;
+    /** The collection the record lives in under the org root. */
+    collection: string;
+    /** The record's document id. */
+    recordId: string;
+    /**
+     * The holder whose facet the field belongs to, for a CONTACT.
+     *
+     * A contact's fields live per holder — an agency running two client brands
+     * has one contact document between them, and a contract one client filed
+     * is not the other's to see — so the field is a facet's, and a facet is the
+     * server's to write (AGL-2804): a contact's files are saved through
+     * `crm/contact-update`, which writes the holder's facet and refuses a plan
+     * without the CRM. `null` for a company or a deal, whose fields are
+     * the organization's, sit at the top of the document and are written here.
+     */
+    facetGroupId?: string | null;
+    /**
+     * The site a contact's files are saved as: the mounted site, or `null` at
+     * the organization level, where the route writes each contact through its
+     * own holder. Read only for a contact.
+     */
+    hostId?: string | null;
+    /** The ids the record currently carries. */
+    mediaIds: readonly string[] | undefined;
+    /**
+     * The manual page this card's help opens — each record kind documents its
+     * own Files section, and a card that pointed all three at one page would
+     * send a company's reader to a page about people.
+     */
+    topic: 'contactRecord' | 'companies' | 'deals';
+}
+/**
+ * FILES ON A RECORD (AGL-2662): the organization's library, attached.
+ *
+ * ## Ids, not URLs
+ *
+ * The field stores media DOCUMENT ids and resolves them to the CDN at read
+ * time. A stored URL names an object's current location and dies on a folder
+ * move; it also pins a private asset to a raw storage link rather than the
+ * signed door that checks who is asking. `media-ref.ts` already made this
+ * choice for every placement on a page, and this is the same choice for a
+ * record.
+ *
+ * ## The picker is the console's, reached through the bridge
+ *
+ * The media library is coupled to the org and session context and lives in
+ * the console app, which a plugin may not import — so this asks for one
+ * through `MediaPickerContext`, the same door the commerce product editor
+ * uses. Where no provider is mounted the card says so rather than offering a
+ * button that does nothing.
+ *
+ * ## One read per attached file, and only for the files attached
+ *
+ * A name and a type are on the media document, not in the id, so each
+ * attachment costs one `getDoc` — bounded by {@link CRM_MEDIA_IDS_MAX} and
+ * paid only on a record that actually carries files. A file the library no
+ * longer holds is still listed, by its id and as missing: an attachment that
+ * silently vanished is worse than one that says it is gone.
+ */
+export declare function RecordFilesCard(props: RecordFilesCardProps): import("react").JSX.Element;
+export declare namespace RecordFilesCard {
+    var displayName: string;
+}
+export default RecordFilesCard;

package/src/lib/components/record-files-card.js

@@ -0,0 +1,290 @@
+/**
+ * @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, jsxs as _jsxs } from "react/jsx-runtime";
+import { CRM_MEDIA_IDS_FIELD, CRM_MEDIA_IDS_MAX, formatMediaRef, normalizeCrmMediaIds, pluginDocsHelp, resolveMediaSrc, useMediaPicker } from "@aglyn/aglyn";
+import { mdiClose, mdiFileOutline, mdiPaperclip } from "@aglyn/shared-data-mdi";
+import { CardDisplay, MdiIcon } from "@aglyn/shared-ui-jsx";
+import { Alert, Box, Button, IconButton, Link, Stack, Typography } from "@mui/material";
+import { doc, getDoc, serverTimestamp, updateDoc } from "firebase/firestore";
+import { useSnackbar } from "notistack";
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { useFirestore } from "@aglyn/tenant-feature-instance";
+import { useContactUpdate } from "../hooks/use-contact-update.js";
+/**
+ * FILES ON A RECORD (AGL-2662): the organization's library, attached.
+ *
+ * ## Ids, not URLs
+ *
+ * The field stores media DOCUMENT ids and resolves them to the CDN at read
+ * time. A stored URL names an object's current location and dies on a folder
+ * move; it also pins a private asset to a raw storage link rather than the
+ * signed door that checks who is asking. `media-ref.ts` already made this
+ * choice for every placement on a page, and this is the same choice for a
+ * record.
+ *
+ * ## The picker is the console's, reached through the bridge
+ *
+ * The media library is coupled to the org and session context and lives in
+ * the console app, which a plugin may not import — so this asks for one
+ * through `MediaPickerContext`, the same door the commerce product editor
+ * uses. Where no provider is mounted the card says so rather than offering a
+ * button that does nothing.
+ *
+ * ## One read per attached file, and only for the files attached
+ *
+ * A name and a type are on the media document, not in the id, so each
+ * attachment costs one `getDoc` — bounded by {@link CRM_MEDIA_IDS_MAX} and
+ * paid only on a record that actually carries files. A file the library no
+ * longer holds is still listed, by its id and as missing: an attachment that
+ * silently vanished is worse than one that says it is gone.
+ */ export function RecordFilesCard(props) {
+    var _ref;
+    const { scope, collection, recordId, facetGroupId, hostId, mediaIds, topic } = props;
+    const firestore = useFirestore();
+    const { pickMedia } = useMediaPicker();
+    const { enqueueSnackbar } = useSnackbar();
+    const contactUpdate = useContactUpdate(hostId != null ? hostId : null);
+    const [busy, setBusy] = useState(false);
+    const [files, setFiles] = useState(null);
+    const ids = useMemo(()=>normalizeCrmMediaIds(mediaIds), [
+        mediaIds
+    ]);
+    const key = ids.join('\n');
+    const orgId = (_ref = scope == null ? void 0 : scope[1]) != null ? _ref : '';
+    useEffect(()=>{
+        if (!orgId) return undefined;
+        const wanted = key ? key.split('\n') : [];
+        if (!wanted.length) {
+            setFiles([]);
+            return undefined;
+        }
+        let live = true;
+        void Promise.all(wanted.map(async (mediaId)=>{
+            try {
+                var _snapshot_data, _data_fileName, _data_contentType, _data_alt, _formatMediaRef;
+                const snapshot = await getDoc(doc(firestore, 'orgs', orgId, 'media', mediaId));
+                const data = (_snapshot_data = snapshot.data()) != null ? _snapshot_data : {};
+                return {
+                    mediaId,
+                    fileName: String((_data_fileName = data['fileName']) != null ? _data_fileName : ''),
+                    contentType: String((_data_contentType = data['contentType']) != null ? _data_contentType : ''),
+                    alt: String((_data_alt = data['alt']) != null ? _data_alt : ''),
+                    src: resolveMediaSrc((_formatMediaRef = formatMediaRef(`org:${orgId}`, mediaId)) != null ? _formatMediaRef : undefined)
+                };
+            } catch (unused) {
+                // A file the reader may not see, or one that is gone. Listed and
+                // named as unreadable rather than dropped — an attachment that
+                // silently disappears reads as one that was never made.
+                return {
+                    mediaId,
+                    fileName: '',
+                    contentType: '',
+                    alt: ''
+                };
+            }
+        })).then((resolved)=>{
+            if (live) setFiles(resolved);
+        });
+        return ()=>{
+            live = false;
+        };
+    }, [
+        firestore,
+        orgId,
+        key
+    ]);
+    const write = useCallback(async (next)=>{
+        if (!scope) return;
+        if (facetGroupId) {
+            await contactUpdate.updateOne(recordId, {
+                mediaIds: next
+            });
+            return;
+        }
+        await updateDoc(doc(firestore, scope[0], scope[1], collection, recordId), {
+            [CRM_MEDIA_IDS_FIELD]: next,
+            updatedAt: serverTimestamp()
+        });
+    }, [
+        firestore,
+        scope,
+        collection,
+        recordId,
+        facetGroupId,
+        contactUpdate
+    ]);
+    const handleAttach = useCallback(async ()=>{
+        if (!pickMedia || busy) return;
+        const picked = await pickMedia();
+        if (!(picked == null ? void 0 : picked.mediaId)) return;
+        if (ids.includes(picked.mediaId)) {
+            enqueueSnackbar('That file is already attached', {
+                variant: 'info'
+            });
+            return;
+        }
+        if (ids.length >= CRM_MEDIA_IDS_MAX) {
+            enqueueSnackbar(`A record holds at most ${CRM_MEDIA_IDS_MAX} files — remove one first.`, {
+                variant: 'warning'
+            });
+            return;
+        }
+        setBusy(true);
+        try {
+            await write(normalizeCrmMediaIds([
+                ...ids,
+                picked.mediaId
+            ]));
+        } catch (unused) {
+            enqueueSnackbar('The file could not be attached', {
+                variant: 'error'
+            });
+        } finally{
+            setBusy(false);
+        }
+    }, [
+        pickMedia,
+        busy,
+        ids,
+        write,
+        enqueueSnackbar
+    ]);
+    const handleRemove = useCallback(async (mediaId)=>{
+        if (busy) return;
+        setBusy(true);
+        try {
+            await write(ids.filter((id)=>id !== mediaId));
+        } catch (unused) {
+            enqueueSnackbar('The file could not be removed', {
+                variant: 'error'
+            });
+        } finally{
+            setBusy(false);
+        }
+    }, [
+        busy,
+        ids,
+        write,
+        enqueueSnackbar
+    ]);
+    return /*#__PURE__*/ _jsx(CardDisplay, {
+        header: 'Files',
+        help: pluginDocsHelp(topic, {
+            anchor: '#files',
+            excerpt: 'Files from the organization library attached to this record. ' + 'Stored by id, so a file moved between folders keeps its ' + 'attachment and a private one is still served through the signed ' + 'door.'
+        }),
+        contentGutterX: true,
+        contentGutterY: true,
+        HeaderProps: {
+            action: /*#__PURE__*/ _jsx(Button, {
+                size: "small",
+                startIcon: /*#__PURE__*/ _jsx(MdiIcon, {
+                    path: mdiPaperclip.path,
+                    size: 0.8
+                }),
+                disabled: !scope || !pickMedia || busy,
+                onClick: ()=>void handleAttach(),
+                children: 'Attach…'
+            })
+        },
+        children: /*#__PURE__*/ _jsxs(Stack, {
+            spacing: 1,
+            children: [
+                !pickMedia ? /*#__PURE__*/ _jsx(Alert, {
+                    severity: "info",
+                    children: 'The media library is not available on this surface.'
+                }) : null,
+                files === null ? /*#__PURE__*/ _jsx(Typography, {
+                    variant: "body2",
+                    color: "text.secondary",
+                    children: 'Reading…'
+                }) : files.length === 0 ? /*#__PURE__*/ _jsx(Typography, {
+                    variant: "body2",
+                    color: "text.secondary",
+                    children: 'No files attached.'
+                }) : files.map((file)=>/*#__PURE__*/ _jsxs(Stack, {
+                        direction: "row",
+                        spacing: 1.5,
+                        sx: {
+                            alignItems: 'center'
+                        },
+                        children: [
+                            file.src && file.contentType.startsWith('image/') ? /*#__PURE__*/ _jsx(Box, {
+                                component: "img",
+                                src: file.src,
+                                alt: file.alt || file.fileName,
+                                sx: {
+                                    width: 40,
+                                    height: 40,
+                                    objectFit: 'cover',
+                                    borderRadius: 1,
+                                    border: 1,
+                                    borderColor: 'divider'
+                                }
+                            }) : /*#__PURE__*/ _jsx(MdiIcon, {
+                                path: mdiFileOutline.path,
+                                size: 1,
+                                sx: {
+                                    color: 'text.disabled'
+                                }
+                            }),
+                            /*#__PURE__*/ _jsxs(Stack, {
+                                sx: {
+                                    flex: 1,
+                                    minWidth: 0
+                                },
+                                children: [
+                                    file.src ? /*#__PURE__*/ _jsx(Link, {
+                                        href: file.src,
+                                        target: "_blank",
+                                        rel: "noreferrer",
+                                        variant: "body2",
+                                        noWrap: true,
+                                        children: file.fileName || file.mediaId
+                                    }) : /*#__PURE__*/ _jsx(Typography, {
+                                        variant: "body2",
+                                        noWrap: true,
+                                        children: file.fileName || file.mediaId
+                                    }),
+                                    /*#__PURE__*/ _jsx(Typography, {
+                                        variant: "caption",
+                                        color: "text.secondary",
+                                        noWrap: true,
+                                        children: file.fileName ? file.contentType || 'Unknown type' : 'This file is no longer in the library, or you cannot see it'
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsx(IconButton, {
+                                size: "small",
+                                "aria-label": `Remove ${file.fileName || file.mediaId}`,
+                                disabled: busy || !scope,
+                                onClick: ()=>void handleRemove(file.mediaId),
+                                children: /*#__PURE__*/ _jsx(MdiIcon, {
+                                    path: mdiClose.path,
+                                    size: 0.8
+                                })
+                            })
+                        ]
+                    }, file.mediaId))
+            ]
+        })
+    });
+}
+RecordFilesCard.displayName = 'RecordFilesCard';
+export default RecordFilesCard;
+
+//# sourceMappingURL=record-files-card.js.map

package/src/lib/components/record-files-card.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../libs/plugins/crm/src/lib/components/record-files-card.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_MEDIA_IDS_FIELD,\n  CRM_MEDIA_IDS_MAX,\n  formatMediaRef,\n  normalizeCrmMediaIds,\n  pluginDocsHelp,\n  resolveMediaSrc,\n  useMediaPicker,\n} from '@aglyn/aglyn'\nimport { mdiClose, mdiFileOutline, mdiPaperclip } from '@aglyn/shared-data-mdi'\nimport { CardDisplay, MdiIcon } from '@aglyn/shared-ui-jsx'\nimport {\n  Alert,\n  Box,\n  Button,\n  IconButton,\n  Link,\n  Stack,\n  Typography,\n} from '@mui/material'\nimport { doc, getDoc, serverTimestamp, updateDoc } from 'firebase/firestore'\nimport { useSnackbar } from 'notistack'\nimport { useCallback, useEffect, useMemo, useState } from 'react'\nimport { useFirestore } from '@aglyn/tenant-feature-instance'\nimport { useContactUpdate } from '../hooks/use-contact-update'\n\n/** What one attached file is known by once its media document has been read. */\ninterface AttachedFile {\n  mediaId: string\n  fileName: string\n  contentType: string\n  alt: string\n  /** The CDN URL the id resolves to, or undefined when it cannot be built. */\n  src?: string\n}\n\nexport interface RecordFilesCardProps {\n  /** `['orgs', orgId]`, or `null` while the org is unresolved. */\n  scope: readonly [string, string] | null\n  /** The collection the record lives in under the org root. */\n  collection: string\n  /** The record's document id. */\n  recordId: string\n  /**\n   * The holder whose facet the field belongs to, for a CONTACT.\n   *\n   * A contact's fields live per holder — an agency running two client brands\n   * has one contact document between them, and a contract one client filed\n   * is not the other's to see — so the field is a facet's, and a facet is the\n   * server's to write (AGL-2804): a contact's files are saved through\n   * `crm/contact-update`, which writes the holder's facet and refuses a plan\n   * without the CRM. `null` for a company or a deal, whose fields are\n   * the organization's, sit at the top of the document and are written here.\n   */\n  facetGroupId?: string | null\n  /**\n   * The site a contact's files are saved as: the mounted site, or `null` at\n   * the organization level, where the route writes each contact through its\n   * own holder. Read only for a contact.\n   */\n  hostId?: string | null\n  /** The ids the record currently carries. */\n  mediaIds: readonly string[] | undefined\n  /**\n   * The manual page this card's help opens — each record kind documents its\n   * own Files section, and a card that pointed all three at one page would\n   * send a company's reader to a page about people.\n   */\n  topic: 'contactRecord' | 'companies' | 'deals'\n}\n\n/**\n * FILES ON A RECORD (AGL-2662): the organization's library, attached.\n *\n * ## Ids, not URLs\n *\n * The field stores media DOCUMENT ids and resolves them to the CDN at read\n * time. A stored URL names an object's current location and dies on a folder\n * move; it also pins a private asset to a raw storage link rather than the\n * signed door that checks who is asking. `media-ref.ts` already made this\n * choice for every placement on a page, and this is the same choice for a\n * record.\n *\n * ## The picker is the console's, reached through the bridge\n *\n * The media library is coupled to the org and session context and lives in\n * the console app, which a plugin may not import — so this asks for one\n * through `MediaPickerContext`, the same door the commerce product editor\n * uses. Where no provider is mounted the card says so rather than offering a\n * button that does nothing.\n *\n * ## One read per attached file, and only for the files attached\n *\n * A name and a type are on the media document, not in the id, so each\n * attachment costs one `getDoc` — bounded by {@link CRM_MEDIA_IDS_MAX} and\n * paid only on a record that actually carries files. A file the library no\n * longer holds is still listed, by its id and as missing: an attachment that\n * silently vanished is worse than one that says it is gone.\n */\nexport function RecordFilesCard(props: RecordFilesCardProps) {\n  const { scope, collection, recordId, facetGroupId, hostId, mediaIds, topic } = props\n  const firestore = useFirestore()\n  const { pickMedia } = useMediaPicker()\n  const { enqueueSnackbar } = useSnackbar()\n  const contactUpdate = useContactUpdate(hostId ?? null)\n  const [busy, setBusy] = useState(false)\n  const [files, setFiles] = useState<AttachedFile[] | null>(null)\n\n  const ids = useMemo(() => normalizeCrmMediaIds(mediaIds), [mediaIds])\n  const key = ids.join('\\n')\n  const orgId = scope?.[1] ?? ''\n\n  useEffect(() => {\n    if (!orgId) return undefined\n    const wanted = key ? key.split('\\n') : []\n    if (!wanted.length) {\n      setFiles([])\n      return undefined\n    }\n    let live = true\n    void Promise.all(\n      wanted.map(async (mediaId) => {\n        try {\n          const snapshot = await getDoc(\n            doc(firestore, 'orgs', orgId, 'media', mediaId),\n          )\n          const data = (snapshot.data() ?? {}) as Record<string, unknown>\n          return {\n            mediaId,\n            fileName: String(data['fileName'] ?? ''),\n            contentType: String(data['contentType'] ?? ''),\n            alt: String(data['alt'] ?? ''),\n            src: resolveMediaSrc(\n              formatMediaRef(`org:${orgId}`, mediaId) ?? undefined,\n            ),\n          }\n        } catch {\n          // A file the reader may not see, or one that is gone. Listed and\n          // named as unreadable rather than dropped — an attachment that\n          // silently disappears reads as one that was never made.\n          return { mediaId, fileName: '', contentType: '', alt: '' }\n        }\n      }),\n    ).then((resolved) => {\n      if (live) setFiles(resolved)\n    })\n    return () => {\n      live = false\n    }\n  }, [firestore, orgId, key])\n\n  const write = useCallback(\n    async (next: string[]) => {\n      if (!scope) return\n      if (facetGroupId) {\n        await contactUpdate.updateOne(recordId, { mediaIds: next })\n        return\n      }\n      await updateDoc(doc(firestore, scope[0], scope[1], collection, recordId), {\n        [CRM_MEDIA_IDS_FIELD]: next,\n        updatedAt: serverTimestamp(),\n      })\n    },\n    [firestore, scope, collection, recordId, facetGroupId, contactUpdate],\n  )\n\n  const handleAttach = useCallback(async () => {\n    if (!pickMedia || busy) return\n    const picked = await pickMedia()\n    if (!picked?.mediaId) return\n    if (ids.includes(picked.mediaId)) {\n      enqueueSnackbar('That file is already attached', { variant: 'info' })\n      return\n    }\n    if (ids.length >= CRM_MEDIA_IDS_MAX) {\n      enqueueSnackbar(\n        `A record holds at most ${CRM_MEDIA_IDS_MAX} files — remove one first.`,\n        { variant: 'warning' },\n      )\n      return\n    }\n    setBusy(true)\n    try {\n      await write(normalizeCrmMediaIds([...ids, picked.mediaId]))\n    } catch {\n      enqueueSnackbar('The file could not be attached', { variant: 'error' })\n    } finally {\n      setBusy(false)\n    }\n  }, [pickMedia, busy, ids, write, enqueueSnackbar])\n\n  const handleRemove = useCallback(\n    async (mediaId: string) => {\n      if (busy) return\n      setBusy(true)\n      try {\n        await write(ids.filter((id) => id !== mediaId))\n      } catch {\n        enqueueSnackbar('The file could not be removed', { variant: 'error' })\n      } finally {\n        setBusy(false)\n      }\n    },\n    [busy, ids, write, enqueueSnackbar],\n  )\n\n  return (\n    <CardDisplay\n      header={'Files'}\n      help={pluginDocsHelp(topic, {\n        anchor: '#files',\n        excerpt:\n          'Files from the organization library attached to this record. ' +\n          'Stored by id, so a file moved between folders keeps its ' +\n          'attachment and a private one is still served through the signed ' +\n          'door.',\n      })}\n      contentGutterX\n      contentGutterY\n      HeaderProps={{\n        action: (\n          <Button\n            size=\"small\"\n            startIcon={<MdiIcon path={mdiPaperclip.path} size={0.8} />}\n            disabled={!scope || !pickMedia || busy}\n            onClick={() => void handleAttach()}\n          >\n            {'Attach…'}\n          </Button>\n        ),\n      }}\n    >\n      <Stack spacing={1}>\n        {!pickMedia ? (\n          <Alert severity=\"info\">\n            {'The media library is not available on this surface.'}\n          </Alert>\n        ) : null}\n        {files === null ? (\n          <Typography variant=\"body2\" color=\"text.secondary\">\n            {'Reading…'}\n          </Typography>\n        ) : files.length === 0 ? (\n          <Typography variant=\"body2\" color=\"text.secondary\">\n            {'No files attached.'}\n          </Typography>\n        ) : (\n          files.map((file) => (\n            <Stack\n              key={file.mediaId}\n              direction=\"row\"\n              spacing={1.5}\n              sx={{ alignItems: 'center' }}\n            >\n              {file.src && file.contentType.startsWith('image/') ? (\n                <Box\n                  component=\"img\"\n                  src={file.src}\n                  alt={file.alt || file.fileName}\n                  sx={{\n                    width: 40,\n                    height: 40,\n                    objectFit: 'cover',\n                    borderRadius: 1,\n                    border: 1,\n                    borderColor: 'divider',\n                  }}\n                />\n              ) : (\n                <MdiIcon\n                  path={mdiFileOutline.path}\n                  size={1}\n                  sx={{ color: 'text.disabled' }}\n                />\n              )}\n              <Stack sx={{ flex: 1, minWidth: 0 }}>\n                {file.src ? (\n                  <Link\n                    href={file.src}\n                    target=\"_blank\"\n                    rel=\"noreferrer\"\n                    variant=\"body2\"\n                    noWrap\n                  >\n                    {file.fileName || file.mediaId}\n                  </Link>\n                ) : (\n                  <Typography variant=\"body2\" noWrap>\n                    {file.fileName || file.mediaId}\n                  </Typography>\n                )}\n                <Typography variant=\"caption\" color=\"text.secondary\" noWrap>\n                  {file.fileName\n                    ? file.contentType || 'Unknown type'\n                    : 'This file is no longer in the library, or you cannot see it'}\n                </Typography>\n              </Stack>\n              <IconButton\n                size=\"small\"\n                aria-label={`Remove ${file.fileName || file.mediaId}`}\n                disabled={busy || !scope}\n                onClick={() => void handleRemove(file.mediaId)}\n              >\n                <MdiIcon path={mdiClose.path} size={0.8} />\n              </IconButton>\n            </Stack>\n          ))\n        )}\n      </Stack>\n    </CardDisplay>\n  )\n}\nRecordFilesCard.displayName = 'RecordFilesCard'\n\nexport default RecordFilesCard\n"],"names":["CRM_MEDIA_IDS_FIELD","CRM_MEDIA_IDS_MAX","formatMediaRef","normalizeCrmMediaIds","pluginDocsHelp","resolveMediaSrc","useMediaPicker","mdiClose","mdiFileOutline","mdiPaperclip","CardDisplay","MdiIcon","Alert","Box","Button","IconButton","Link","Stack","Typography","doc","getDoc","serverTimestamp","updateDoc","useSnackbar","useCallback","useEffect","useMemo","useState","useFirestore","useContactUpdate","RecordFilesCard","props","scope","collection","recordId","facetGroupId","hostId","mediaIds","topic","firestore","pickMedia","enqueueSnackbar","contactUpdate","busy","setBusy","files","setFiles","ids","key","join","orgId","undefined","wanted","split","length","live","Promise","all","map","mediaId","snapshot","data","fileName","String","contentType","alt","src","then","resolved","write","next","updateOne","updatedAt","handleAttach","picked","includes","variant","handleRemove","filter","id","header","help","anchor","excerpt","contentGutterX","contentGutterY","HeaderProps","action","size","startIcon","path","disabled","onClick","spacing","severity","color","file","direction","sx","alignItems","startsWith","component","width","height","objectFit","borderRadius","border","borderColor","flex","minWidth","href","target","rel","noWrap","aria-label","displayName"],"mappings":"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"}