@aglyn/plugins-ai 1.0.0-beta.226 → 1.0.0-beta.228

package/src/lib/components/staff-org-ai-card.component.js

@@ -27,7 +27,8 @@ import { useUser } from "@aglyn/tenant-feature-instance";
 import { authorizedFetch } from "@aglyn/shared-util-http/authorized-token";
 import { Alert, Chip, Stack, TableBody, TableCell, TableHead, TableRow, Typography } from "@mui/material";
 import { useRouter } from "next/navigation";
-import { useEffect, useMemo, useRef, useState } from "react";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { StaffCreditReturnActions, StaffCreditReturnDialog } from "./staff-ai-credit-return.component.js";
 /**
  * THE STAFF AI CARD (AGL-2930): everything about one org's AI usage on the
  * page staff already open to look at that org.
@@ -52,6 +53,11 @@ import { useEffect, useMemo, useRef, useState } from "react";
  *    sends and generates, and how much of its prompt the cache served.
  *  - **Margin** — spend against what AI brings in, red when it is over.
  *  - **Actions** — where the override editor and the AI pause live.
+ *
+ * The header carries the card's two acts (AGL-3595): give credits back to
+ * the band (and, on a Free workspace, to the owner's allowance), or reset
+ * the month — and each recent job offers the same give-back, prefilled with
+ * that job's spend.
  */ const credits = (value)=>value == null ? '—' : Math.round(value).toLocaleString();
 /**
  * Four decimals under a dollar, two above (the assist-signals page's rule):
@@ -131,7 +137,10 @@ function RefusalsRow({ refusals }) {
         })
     });
 }
-function JobsSection({ jobs }) {
+function JobsSection({ jobs, onGiveBack }) {
+    const columns = useMemo(()=>jobColumns(onGiveBack), [
+        onGiveBack
+    ]);
     if (jobs === null) {
         return /*#__PURE__*/ _jsx(Alert, {
             severity: "warning",
@@ -182,7 +191,7 @@ function JobsSection({ jobs }) {
             }) : null,
             /*#__PURE__*/ _jsx(ListTable, {
                 rows: jobs.recent,
-                columns: JOB_COLUMNS,
+                columns: columns,
                 getRowId: (job)=>job.id,
                 rowHeight: TABLE_ROW_HEIGHT,
                 noRowsLabel: "No recent jobs",
@@ -198,69 +207,81 @@ function JobsSection({ jobs }) {
  * The recent jobs, one column per fact. Who started a job is a column of
  * its own rather than a link tucked beside the date, so it sorts like the
  * rest; the credits sort by what was SPENT, which is the figure the
- * pool was charged.
- */ const JOB_COLUMNS = [
-    {
-        field: 'id',
-        headerName: 'Job',
-        flex: 1,
-        minWidth: 200,
-        renderCell: ({ row })=>/*#__PURE__*/ _jsx(Typography, {
-                variant: "body2",
-                noWrap: true,
-                title: row.id,
-                sx: {
-                    fontFamily: 'monospace'
-                },
-                children: row.id
-            })
-    },
-    {
-        field: 'kind',
-        headerName: 'Kind',
-        width: 120,
-        valueFormatter: (value)=>value || '—'
-    },
-    {
-        field: 'status',
-        headerName: 'Status',
-        width: 130,
-        valueFormatter: (value)=>String(value != null ? value : '').replace('_', ' ')
-    },
-    {
-        field: 'creditsSpent',
-        headerName: 'Credits',
-        type: 'number',
-        align: 'right',
-        headerAlign: 'right',
-        width: 140,
-        valueFormatter: (value, row)=>`${credits(value)} / ${credits(row.creditsReserved)}`
-    },
-    {
-        field: 'createdAt',
-        headerName: 'Started',
-        width: 120,
-        valueFormatter: (value)=>when(value)
-    },
-    {
-        field: 'createdBy',
-        headerName: 'Started by',
-        flex: 1,
-        minWidth: 240,
-        renderCell: ({ row })=>row.createdBy ? /*#__PURE__*/ _jsx(AppLink, {
-                href: buildRoute(Route.ADMIN_USER_DETAIL, {
-                    uid: row.createdBy
-                }),
-                variant: "body2",
-                underline: "hover",
-                noWrap: true,
-                sx: {
-                    fontFamily: 'monospace'
-                },
-                children: row.createdBy
-            }) : '—'
-    }
-];
+ * pool was charged. The row's action gives that spend back (AGL-3595).
+ */ const jobColumns = (onGiveBack)=>[
+        {
+            field: 'id',
+            headerName: 'Job',
+            flex: 1,
+            minWidth: 200,
+            renderCell: ({ row })=>/*#__PURE__*/ _jsx(Typography, {
+                    variant: "body2",
+                    noWrap: true,
+                    title: row.id,
+                    sx: {
+                        fontFamily: 'monospace'
+                    },
+                    children: row.id
+                })
+        },
+        {
+            field: 'kind',
+            headerName: 'Kind',
+            width: 120,
+            valueFormatter: (value)=>value || '—'
+        },
+        {
+            field: 'status',
+            headerName: 'Status',
+            width: 130,
+            valueFormatter: (value)=>String(value != null ? value : '').replace('_', ' ')
+        },
+        {
+            field: 'creditsSpent',
+            headerName: 'Credits',
+            type: 'number',
+            align: 'right',
+            headerAlign: 'right',
+            width: 140,
+            valueFormatter: (value, row)=>`${credits(value)} / ${credits(row.creditsReserved)}`
+        },
+        {
+            field: 'createdAt',
+            headerName: 'Started',
+            width: 120,
+            valueFormatter: (value)=>when(value)
+        },
+        {
+            field: 'createdBy',
+            headerName: 'Started by',
+            flex: 1,
+            minWidth: 240,
+            renderCell: ({ row })=>row.createdBy ? /*#__PURE__*/ _jsx(AppLink, {
+                    href: buildRoute(Route.ADMIN_USER_DETAIL, {
+                        uid: row.createdBy
+                    }),
+                    variant: "body2",
+                    underline: "hover",
+                    noWrap: true,
+                    sx: {
+                        fontFamily: 'monospace'
+                    },
+                    children: row.createdBy
+                }) : '—'
+        },
+        listActionsColumn((row)=>/*#__PURE__*/ _jsx(ListRowActions, {
+                label: row.id,
+                items: [
+                    {
+                        key: 'give-back',
+                        label: 'Give back this job’s credits',
+                        disabled: row.creditsSpent <= 0,
+                        disabledReason: row.creditsSpent <= 0 ? 'This job spent no credits.' : undefined,
+                        onClick: ()=>onGiveBack(row)
+                    }
+                ]
+            }))
+    ];
 const tokenCount = (value)=>Math.round(value).toLocaleString();
 const rate = (value)=>value == null ? '—' : `${Math.round(value * 100)}%`;
 /** The month's tokens, and what each kind of request spends of them (AGL-2937). */ function TokensSection({ tokens }) {
@@ -472,7 +493,7 @@ const rate = (value)=>value == null ? '—' : `${Math.round(value * 100)}%`;
     });
 }
 const StaffOrgAiCard = ({ orgId })=>{
-    var _ref;
+    var _ref, _ref1, _ref2, _ref3;
     const { data: user } = useUser();
     // Keyed on who is signed in, not on the user object's identity.
     const signedInUid = (_ref = user == null ? void 0 : user.uid) != null ? _ref : null;
@@ -481,6 +502,15 @@ const StaffOrgAiCard = ({ orgId })=>{
     const [data, setData] = useState(null);
     const [ready, setReady] = useState(false);
     const [error, setError] = useState(null);
+    // Bumped after a give-back, so the card re-reads the figures it changed.
+    const [version, setVersion] = useState(0);
+    const [notice, setNotice] = useState(null);
+    const [returning, setReturning] = useState(null);
+    const giveBackJob = useCallback((job)=>setReturning({
+            mode: 'give',
+            jobId: job.id,
+            jobCredits: job.creditsSpent
+        }), []);
     useEffect(()=>{
         // Mounted only for a confirmed staff reader — the `staffOrg` zone sits
         // inside the page's `StaffOnly`, which renders nothing while the claim
@@ -518,227 +548,282 @@ const StaffOrgAiCard = ({ orgId })=>{
         };
     }, [
         orgId,
-        signedInUid
+        signedInUid,
+        version
     ]);
     const name = aiAddonName();
-    return /*#__PURE__*/ _jsx(CardDisplay, {
+    return /*#__PURE__*/ _jsxs(CardDisplay, {
         header: name,
         help: pluginDocsHelp('aiMonitoring', {
             anchor: '#the-ai-card',
             excerpt: 'The add-on, the credit pool and its parts, this month’s overage and refusals, generation jobs, tokens and the cache hit rate by kind, the people spending the most, and the margin — for this organization.'
         }),
+        HeaderProps: {
+            action: /*#__PURE__*/ _jsx(StaffCreditReturnActions, {
+                disabled: !data,
+                onGive: ()=>setReturning({
+                        mode: 'give'
+                    }),
+                onReset: ()=>setReturning({
+                        mode: 'reset'
+                    })
+            })
+        },
         contentGutterX: true,
         contentGutterY: true,
-        children: !ready ? /*#__PURE__*/ _jsx(Typography, {
-            variant: "body2",
-            color: "text.secondary",
-            children: 'Loading…'
-        }) : error || !data ? /*#__PURE__*/ _jsx(Alert, {
-            severity: "warning",
-            children: `Could not read this organization’s AI usage — ${error != null ? error : 'a failed read'}, not zero usage.`
-        }) : /*#__PURE__*/ _jsxs(Stack, {
-            spacing: 2,
-            children: [
-                /*#__PURE__*/ _jsxs(Stack, {
-                    spacing: 0.5,
-                    children: [
-                        /*#__PURE__*/ _jsx(Typography, {
-                            variant: "overline",
-                            color: "text.secondary",
-                            children: 'Add-on'
-                        }),
-                        /*#__PURE__*/ _jsxs(Stack, {
-                            direction: "row",
-                            spacing: 1,
-                            sx: {
-                                alignItems: 'center',
-                                flexWrap: 'wrap'
-                            },
-                            children: [
-                                /*#__PURE__*/ _jsx(Chip, {
-                                    size: "small",
-                                    color: data.addon.on ? 'primary' : 'default',
-                                    label: data.addon.on ? `${name} on` : `${name} off`
-                                }),
-                                data.addon.priceUsd !== null ? /*#__PURE__*/ _jsx(Typography, {
-                                    variant: "body2",
-                                    children: `${usd(data.addon.priceUsd)}/mo on this plan`
-                                }) : /*#__PURE__*/ _jsx(Typography, {
-                                    variant: "body2",
-                                    color: "text.secondary",
-                                    children: 'Not sold on this plan'
-                                }),
-                                data.addon.on ? /*#__PURE__*/ _jsx(Typography, {
-                                    variant: "body2",
-                                    color: "text.secondary",
-                                    children: data.addon.since ? `since ${when(data.addon.since)}` : data.addon.sinceSource === 'unavailable' ? 'since — (Stripe not reachable)' : 'since — (no subscription item)'
-                                }) : null
-                            ]
-                        })
-                    ]
-                }),
-                /*#__PURE__*/ _jsxs(Stack, {
-                    spacing: 0.5,
-                    children: [
-                        /*#__PURE__*/ _jsx(Typography, {
-                            variant: "overline",
-                            color: "text.secondary",
-                            children: `Credit pool · ${data.month}`
-                        }),
-                        data.pool.totalCredits === null && data.pool.uncapped ? /*#__PURE__*/ _jsx(Typography, {
-                            variant: "body2",
-                            color: "text.secondary",
-                            children: 'Uncapped staff comp — no AI credit band. Bounded only by the message cap and an operator’s explicit spend ceiling.'
-                        }) : data.pool.totalCredits === null ? /*#__PURE__*/ _jsx(Typography, {
-                            variant: "body2",
-                            color: "text.secondary",
-                            children: 'No AI credit band on this plan — bounded by the message cap and the operator backstop.'
-                        }) : /*#__PURE__*/ _jsx(Typography, {
-                            variant: "body2",
-                            children: `${credits(data.pool.totalCredits)} credits = ${poolPartsSentence(data.pool)}`
-                        }),
-                        /*#__PURE__*/ _jsxs(Typography, {
-                            variant: "body2",
-                            children: [
-                                `Used ${credits(data.pool.usedCredits)} credits (${usd(data.pool.providerUsd)} provider spend)`,
-                                data.pool.remainingCredits !== null ? ` · ${credits(data.pool.remainingCredits)} remaining` : ''
-                            ]
-                        }),
-                        /*#__PURE__*/ _jsx(Typography, {
-                            variant: "body2",
-                            color: "text.secondary",
-                            children: `Projected month-end at this pace: ${credits(data.pool.projectedCredits)} credits (${usd(data.pool.projectedUsd)}) · ${data.pool.messages.toLocaleString()} model turns, ${data.pool.deflected.toLocaleString()} answered from the docs`
-                        })
-                    ]
-                }),
-                /*#__PURE__*/ _jsxs(Stack, {
-                    spacing: 0.5,
-                    children: [
-                        /*#__PURE__*/ _jsx(Typography, {
-                            variant: "overline",
-                            color: "text.secondary",
-                            children: 'Overage'
-                        }),
-                        /*#__PURE__*/ _jsx(Typography, {
-                            variant: "body2",
-                            children: `${credits(data.overage.overageCredits)} credits over the band · ${usd(data.overage.accruedUsd)} accrued`
-                        }),
-                        /*#__PURE__*/ _jsx(Typography, {
-                            variant: "body2",
-                            color: "text.secondary",
-                            children: overageStateSentence(data.overage, data.pool.uncapped === true)
-                        })
-                    ]
-                }),
-                /*#__PURE__*/ _jsxs(Stack, {
-                    spacing: 0.5,
-                    children: [
-                        /*#__PURE__*/ _jsx(Typography, {
-                            variant: "overline",
-                            color: "text.secondary",
-                            children: `Refusals this month · ${data.refusals.total.toLocaleString()}`
-                        }),
-                        /*#__PURE__*/ _jsx(RefusalsRow, {
-                            refusals: data.refusals
-                        })
-                    ]
-                }),
-                /*#__PURE__*/ _jsxs(Stack, {
-                    spacing: 0.5,
-                    children: [
-                        /*#__PURE__*/ _jsx(Typography, {
-                            variant: "overline",
-                            color: "text.secondary",
-                            children: 'Generation jobs'
-                        }),
-                        /*#__PURE__*/ _jsx(JobsSection, {
-                            jobs: data.jobs
-                        })
-                    ]
-                }),
-                data.tokens ? /*#__PURE__*/ _jsxs(Stack, {
-                    spacing: 0.5,
-                    children: [
-                        /*#__PURE__*/ _jsx(Typography, {
-                            variant: "overline",
-                            color: "text.secondary",
-                            children: `Tokens · ${data.month}`
-                        }),
-                        /*#__PURE__*/ _jsx(TokensSection, {
-                            tokens: data.tokens
-                        })
-                    ]
-                }) : null,
-                /*#__PURE__*/ _jsxs(Stack, {
-                    spacing: 0.5,
-                    children: [
-                        /*#__PURE__*/ _jsx(Typography, {
-                            variant: "overline",
-                            color: "text.secondary",
-                            children: 'Top users this month'
-                        }),
-                        data.users.length === 0 ? /*#__PURE__*/ _jsx(Typography, {
-                            variant: "body2",
-                            color: "text.secondary",
-                            children: 'No AI usage attributed to a person this month.'
-                        }) : /*#__PURE__*/ _jsx(TopUsersSection, {
-                            users: data.users
-                        })
-                    ]
-                }),
-                /*#__PURE__*/ _jsxs(Stack, {
-                    spacing: 0.5,
-                    children: [
-                        /*#__PURE__*/ _jsx(Typography, {
-                            variant: "overline",
-                            color: "text.secondary",
-                            children: 'Margin'
-                        }),
-                        /*#__PURE__*/ _jsxs(Alert, {
-                            severity: marginTone(data.margin),
-                            children: [
-                                `Spend ${usd(data.margin.spendUsd)} against ${usd(data.margin.revenueUsd)} in — ` + `${usd(data.margin.addonRevenueUsd)} add-on, ${usd(data.margin.planAssistShareUsd)} plan assist share, ` + `${usd(data.margin.overageRevenueUsd)} overage.`,
-                                data.margin.underwater ? ' Spend exceeds the add-on plus the plan’s assist share.' : '',
-                                data.margin.multiple >= 1 ? ` ${data.margin.multiple}× the ${usd(data.margin.thresholdUsd)} staff review threshold.` : ''
-                            ]
-                        }),
-                        data.margin.contribution.marginPct !== null ? /*#__PURE__*/ _jsx(Typography, {
-                            variant: "caption",
-                            color: "text.secondary",
-                            children: `Whole-org contribution margin ${Math.round(data.margin.contribution.marginPct * 100)}% on the ${data.margin.contribution.month} rollup with this month’s AI spend.`
-                        }) : null
-                    ]
-                }),
-                /*#__PURE__*/ _jsxs(Stack, {
-                    spacing: 0.5,
-                    children: [
-                        /*#__PURE__*/ _jsx(Typography, {
-                            variant: "overline",
-                            color: "text.secondary",
-                            children: 'Actions'
-                        }),
-                        /*#__PURE__*/ _jsxs(Typography, {
-                            variant: "body2",
-                            children: [
-                                'Credit override and feature toggles: ',
-                                /*#__PURE__*/ _jsx(AppLink, {
-                                    href: buildRoute(Route.ADMIN_ORGS),
-                                    underline: "hover",
-                                    children: 'the entitlement override editor'
-                                }),
-                                ' (also under Staff actions above). Pause AI for this org: ',
-                                /*#__PURE__*/ _jsx(AppLink, {
-                                    href: buildRoute(Route.ADMIN_LOCKDOWN),
-                                    underline: "hover",
-                                    children: 'Lockdown'
-                                }),
-                                ', feature keys ai-assist and ai-generate scoped to the org.'
-                            ]
-                        })
-                    ]
-                })
-            ]
-        })
+        children: [
+            data ? /*#__PURE__*/ _jsx(StaffCreditReturnDialog, {
+                open: returning !== null,
+                mode: (_ref1 = returning == null ? void 0 : returning.mode) != null ? _ref1 : 'give',
+                target: {
+                    orgId
+                },
+                workspace: {
+                    used: data.pool.usedCredits,
+                    limit: data.pool.totalCredits
+                },
+                account: data.account ? {
+                    used: data.account.usedCredits,
+                    limit: data.account.limitCredits
+                } : null,
+                jobId: (_ref2 = returning == null ? void 0 : returning.jobId) != null ? _ref2 : null,
+                jobCredits: (_ref3 = returning == null ? void 0 : returning.jobCredits) != null ? _ref3 : null,
+                onClose: ()=>setReturning(null),
+                onReturned: (message)=>{
+                    setReturning(null);
+                    setNotice(message);
+                    setVersion((current)=>current + 1);
+                }
+            }) : null,
+            notice ? /*#__PURE__*/ _jsx(Alert, {
+                severity: "success",
+                onClose: ()=>setNotice(null),
+                sx: {
+                    mb: 2
+                },
+                children: notice
+            }) : null,
+            !ready ? /*#__PURE__*/ _jsx(Typography, {
+                variant: "body2",
+                color: "text.secondary",
+                children: 'Loading…'
+            }) : error || !data ? /*#__PURE__*/ _jsx(Alert, {
+                severity: "warning",
+                children: `Could not read this organization’s AI usage — ${error != null ? error : 'a failed read'}, not zero usage.`
+            }) : /*#__PURE__*/ _jsxs(Stack, {
+                spacing: 2,
+                children: [
+                    /*#__PURE__*/ _jsxs(Stack, {
+                        spacing: 0.5,
+                        children: [
+                            /*#__PURE__*/ _jsx(Typography, {
+                                variant: "overline",
+                                color: "text.secondary",
+                                children: 'Add-on'
+                            }),
+                            /*#__PURE__*/ _jsxs(Stack, {
+                                direction: "row",
+                                spacing: 1,
+                                sx: {
+                                    alignItems: 'center',
+                                    flexWrap: 'wrap'
+                                },
+                                children: [
+                                    /*#__PURE__*/ _jsx(Chip, {
+                                        size: "small",
+                                        color: data.addon.on ? 'primary' : 'default',
+                                        label: data.addon.on ? `${name} on` : `${name} off`
+                                    }),
+                                    data.addon.priceUsd !== null ? /*#__PURE__*/ _jsx(Typography, {
+                                        variant: "body2",
+                                        children: `${usd(data.addon.priceUsd)}/mo on this plan`
+                                    }) : /*#__PURE__*/ _jsx(Typography, {
+                                        variant: "body2",
+                                        color: "text.secondary",
+                                        children: 'Not sold on this plan'
+                                    }),
+                                    data.addon.on ? /*#__PURE__*/ _jsx(Typography, {
+                                        variant: "body2",
+                                        color: "text.secondary",
+                                        children: data.addon.since ? `since ${when(data.addon.since)}` : data.addon.sinceSource === 'unavailable' ? 'since — (Stripe not reachable)' : 'since — (no subscription item)'
+                                    }) : null
+                                ]
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs(Stack, {
+                        spacing: 0.5,
+                        children: [
+                            /*#__PURE__*/ _jsx(Typography, {
+                                variant: "overline",
+                                color: "text.secondary",
+                                children: `Credit pool · ${data.month}`
+                            }),
+                            data.pool.totalCredits === null && data.pool.uncapped ? /*#__PURE__*/ _jsx(Typography, {
+                                variant: "body2",
+                                color: "text.secondary",
+                                children: 'Uncapped staff comp — no AI credit band. Bounded only by the message cap and an operator’s explicit spend ceiling.'
+                            }) : data.pool.totalCredits === null ? /*#__PURE__*/ _jsx(Typography, {
+                                variant: "body2",
+                                color: "text.secondary",
+                                children: 'No AI credit band on this plan — bounded by the message cap and the operator backstop.'
+                            }) : /*#__PURE__*/ _jsx(Typography, {
+                                variant: "body2",
+                                children: `${credits(data.pool.totalCredits)} credits = ${poolPartsSentence(data.pool)}`
+                            }),
+                            /*#__PURE__*/ _jsxs(Typography, {
+                                variant: "body2",
+                                children: [
+                                    `Used ${credits(data.pool.usedCredits)} credits (${usd(data.pool.providerUsd)} provider spend)`,
+                                    data.pool.remainingCredits !== null ? ` · ${credits(data.pool.remainingCredits)} remaining` : ''
+                                ]
+                            }),
+                            data.pool.returnedCredits ? /*#__PURE__*/ _jsx(Typography, {
+                                variant: "body2",
+                                color: "text.secondary",
+                                children: `${credits(data.pool.returnedCredits)} credits given back this month — already taken off the figure above.`
+                            }) : null,
+                            data.account ? /*#__PURE__*/ _jsx(Typography, {
+                                variant: "body2",
+                                children: `Owner’s Free allowance: ${credits(data.account.usedCredits)} of ${credits(data.account.limitCredits)} used across their free workspaces` + (data.account.returnedCredits ? ` (${credits(data.account.returnedCredits)} given back)` : '')
+                            }) : null,
+                            /*#__PURE__*/ _jsx(Typography, {
+                                variant: "body2",
+                                color: "text.secondary",
+                                children: `Projected month-end at this pace: ${credits(data.pool.projectedCredits)} credits (${usd(data.pool.projectedUsd)}) · ${data.pool.messages.toLocaleString()} model turns, ${data.pool.deflected.toLocaleString()} answered from the docs`
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs(Stack, {
+                        spacing: 0.5,
+                        children: [
+                            /*#__PURE__*/ _jsx(Typography, {
+                                variant: "overline",
+                                color: "text.secondary",
+                                children: 'Overage'
+                            }),
+                            /*#__PURE__*/ _jsx(Typography, {
+                                variant: "body2",
+                                children: `${credits(data.overage.overageCredits)} credits over the band · ${usd(data.overage.accruedUsd)} accrued`
+                            }),
+                            /*#__PURE__*/ _jsx(Typography, {
+                                variant: "body2",
+                                color: "text.secondary",
+                                children: overageStateSentence(data.overage, data.pool.uncapped === true)
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs(Stack, {
+                        spacing: 0.5,
+                        children: [
+                            /*#__PURE__*/ _jsx(Typography, {
+                                variant: "overline",
+                                color: "text.secondary",
+                                children: `Refusals this month · ${data.refusals.total.toLocaleString()}`
+                            }),
+                            /*#__PURE__*/ _jsx(RefusalsRow, {
+                                refusals: data.refusals
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs(Stack, {
+                        spacing: 0.5,
+                        children: [
+                            /*#__PURE__*/ _jsx(Typography, {
+                                variant: "overline",
+                                color: "text.secondary",
+                                children: 'Generation jobs'
+                            }),
+                            /*#__PURE__*/ _jsx(JobsSection, {
+                                jobs: data.jobs,
+                                onGiveBack: giveBackJob
+                            })
+                        ]
+                    }),
+                    data.tokens ? /*#__PURE__*/ _jsxs(Stack, {
+                        spacing: 0.5,
+                        children: [
+                            /*#__PURE__*/ _jsx(Typography, {
+                                variant: "overline",
+                                color: "text.secondary",
+                                children: `Tokens · ${data.month}`
+                            }),
+                            /*#__PURE__*/ _jsx(TokensSection, {
+                                tokens: data.tokens
+                            })
+                        ]
+                    }) : null,
+                    /*#__PURE__*/ _jsxs(Stack, {
+                        spacing: 0.5,
+                        children: [
+                            /*#__PURE__*/ _jsx(Typography, {
+                                variant: "overline",
+                                color: "text.secondary",
+                                children: 'Top users this month'
+                            }),
+                            data.users.length === 0 ? /*#__PURE__*/ _jsx(Typography, {
+                                variant: "body2",
+                                color: "text.secondary",
+                                children: 'No AI usage attributed to a person this month.'
+                            }) : /*#__PURE__*/ _jsx(TopUsersSection, {
+                                users: data.users
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs(Stack, {
+                        spacing: 0.5,
+                        children: [
+                            /*#__PURE__*/ _jsx(Typography, {
+                                variant: "overline",
+                                color: "text.secondary",
+                                children: 'Margin'
+                            }),
+                            /*#__PURE__*/ _jsxs(Alert, {
+                                severity: marginTone(data.margin),
+                                children: [
+                                    `Spend ${usd(data.margin.spendUsd)} against ${usd(data.margin.revenueUsd)} in — ` + `${usd(data.margin.addonRevenueUsd)} add-on, ${usd(data.margin.planAssistShareUsd)} plan assist share, ` + `${usd(data.margin.overageRevenueUsd)} overage.`,
+                                    data.margin.underwater ? ' Spend exceeds the add-on plus the plan’s assist share.' : '',
+                                    data.margin.multiple >= 1 ? ` ${data.margin.multiple}× the ${usd(data.margin.thresholdUsd)} staff review threshold.` : ''
+                                ]
+                            }),
+                            data.margin.contribution.marginPct !== null ? /*#__PURE__*/ _jsx(Typography, {
+                                variant: "caption",
+                                color: "text.secondary",
+                                children: `Whole-org contribution margin ${Math.round(data.margin.contribution.marginPct * 100)}% on the ${data.margin.contribution.month} rollup with this month’s AI spend.`
+                            }) : null
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs(Stack, {
+                        spacing: 0.5,
+                        children: [
+                            /*#__PURE__*/ _jsx(Typography, {
+                                variant: "overline",
+                                color: "text.secondary",
+                                children: 'Actions'
+                            }),
+                            /*#__PURE__*/ _jsxs(Typography, {
+                                variant: "body2",
+                                children: [
+                                    'Credit override and feature toggles: ',
+                                    /*#__PURE__*/ _jsx(AppLink, {
+                                        href: buildRoute(Route.ADMIN_ORGS),
+                                        underline: "hover",
+                                        children: 'the entitlement override editor'
+                                    }),
+                                    ' (also under Staff actions above). Pause AI for this org: ',
+                                    /*#__PURE__*/ _jsx(AppLink, {
+                                        href: buildRoute(Route.ADMIN_LOCKDOWN),
+                                        underline: "hover",
+                                        children: 'Lockdown'
+                                    }),
+                                    ', feature keys ai-assist and ai-generate scoped to the org.'
+                                ]
+                            })
+                        ]
+                    })
+                ]
+            })
+        ]
     });
 };
 StaffOrgAiCard.displayName = 'StaffOrgAiCard';