@humaan/payload-plugin-ai-assistant 0.0.0-stage → 0.1.1

package/dist/admin/BudgetField.js

@@ -0,0 +1,145 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { dayIn, monthStart, usageTotals } from '../chat/usage.js';
+import { accountAllowance, budgetView } from '../endpoints/allowance.js';
+import { formatReset, nextReset } from '../endpoints/budget.js';
+import { pluginRuntime } from '../runtime.js';
+import { AiSourceSwitch } from './AiSourceSwitch.js';
+import styles from './BudgetField.module.scss';
+import { percentOf, usdOf } from './percent.js';
+/**
+ * What the model costs, on the settings screen, for AI Source as it stands in the form. On Humaan AI: how much of the
+ * project's budget is used, as shares only. On the own key: the site's spend on it, which is the client's own money,
+ * so it is shown in US dollars. Both are rendered here, on the server, so no token or key reaches the browser, and
+ * `AiSourceSwitch` shows the one that matches. The settings global is admin-only, and so is this screen.
+ */ export async function BudgetField({ payload, req }) {
+    const runtime = pluginRuntime(payload.config);
+    const allowance = await accountAllowance(req);
+    const humaanAi = /*#__PURE__*/ _jsx(HumaanAiBudget, {
+        allowance: allowance,
+        timeZone: runtime.timeZone
+    });
+    // Only the summary on the config: the credentials never reach this component.
+    if (!runtime.ownKey) {
+        return humaanAi;
+    }
+    const today = dayIn(runtime.timeZone);
+    const [month, day] = await Promise.all([
+        usageTotals(req, monthStart(today), today),
+        usageTotals(req, today, today)
+    ]);
+    return /*#__PURE__*/ _jsx(AiSourceSwitch, {
+        humaanAi: humaanAi,
+        ownKey: /*#__PURE__*/ _jsx(OwnKeyUsage, {
+            allowance: allowance,
+            month: month,
+            ownKey: runtime.ownKey,
+            today: day
+        })
+    });
+}
+/** How much of the project's Humaan AI budget is used, or why it cannot be read. */ function HumaanAiBudget({ allowance, timeZone }) {
+    return /*#__PURE__*/ _jsxs("section", {
+        "aria-labelledby": "ai-assistant-budget-heading",
+        className: styles.budget,
+        children: [
+            /*#__PURE__*/ _jsx("h3", {
+                className: styles.budget__heading,
+                id: "ai-assistant-budget-heading",
+                children: "Humaan AI Budget"
+            }),
+            typeof allowance === 'string' ? /*#__PURE__*/ _jsx("p", {
+                className: styles.budget__note,
+                children: allowance
+            }) : /*#__PURE__*/ _jsx(BudgetDetails, {
+                allowance: allowance,
+                timeZone: timeZone,
+                view: budgetView(allowance)
+            })
+        ]
+    });
+}
+/** A gauge of the budget used. The text carries the figure; the bar only helps scanning. */ function BudgetDetails({ allowance, view, timeZone }) {
+    const usedShare = Math.min(Math.max(1 - view.remainingShare, 0), 1);
+    const used = percentOf(usedShare, 1);
+    const reset = nextReset(allowance.refreshPeriod);
+    return /*#__PURE__*/ _jsxs(_Fragment, {
+        children: [
+            /*#__PURE__*/ _jsxs("p", {
+                className: styles.budget__figure,
+                id: "ai-assistant-budget-used",
+                children: [
+                    used,
+                    " used",
+                    view.low ? /*#__PURE__*/ _jsx("strong", {
+                        className: styles.budget__low,
+                        children: " (low)"
+                    }) : null
+                ]
+            }),
+            /*#__PURE__*/ _jsx("div", {
+                "aria-labelledby": "ai-assistant-budget-used",
+                "aria-valuemax": 100,
+                "aria-valuemin": 0,
+                "aria-valuenow": Math.round(usedShare * 100),
+                "aria-valuetext": `${used} used`,
+                className: styles.budget__bar,
+                "data-low": view.low || undefined,
+                role: "meter",
+                children: /*#__PURE__*/ _jsx("span", {
+                    className: styles['budget__bar-fill'],
+                    style: {
+                        width: `${usedShare * 100}%`
+                    }
+                })
+            }),
+            /*#__PURE__*/ _jsx("p", {
+                className: styles.budget__note,
+                children: reset ? `Share of this project's ${allowance.refreshPeriod} budget. Resets on ${formatReset(reset, timeZone)}.` : "Share of this project's budget, which does not reset."
+            })
+        ]
+    });
+}
+/**
+ * The site's spend on its own key, this month and today, as the gateway prices it. The provider's invoice is the
+ * record. Fallbacks are flagged at the top of the screen; this shows the budget that caps them.
+ */ function OwnKeyUsage({ ownKey, month, today, allowance }) {
+    return /*#__PURE__*/ _jsxs("section", {
+        "aria-labelledby": "ai-assistant-budget-heading",
+        className: styles.budget,
+        children: [
+            /*#__PURE__*/ _jsxs("h3", {
+                className: styles.budget__heading,
+                id: "ai-assistant-budget-heading",
+                children: [
+                    "Own provider key: ",
+                    ownKey.label
+                ]
+            }),
+            /*#__PURE__*/ _jsxs("p", {
+                className: styles.budget__figure,
+                children: [
+                    usdOf(month.ownKeyUsd),
+                    " this month"
+                ]
+            }),
+            /*#__PURE__*/ _jsxs("p", {
+                className: styles.budget__note,
+                children: [
+                    "Today: ",
+                    usdOf(today.ownKeyUsd),
+                    " across ",
+                    today.replies,
+                    ' ',
+                    today.replies === 1 ? 'reply' : 'replies',
+                    ". The provider bills the account that owns the credentials; figures are the gateway's prices, and the provider's invoice is the record. Months follow the site's time zone."
+                ]
+            }),
+            /*#__PURE__*/ _jsx("p", {
+                className: styles.budget__note,
+                children: typeof allowance === 'string' ? `Fallbacks are capped by the project's Vercel budget, which could not be read: ${allowance}` : `Fallbacks are capped by the project's Vercel budget, ${percentOf(1 - budgetView(allowance).remainingShare, 1)} used.`
+            })
+        ]
+    });
+}
+
+//# sourceMappingURL=BudgetField.js.map

package/dist/admin/BudgetField.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/admin/BudgetField.tsx"],"sourcesContent":["import type { UIFieldServerProps } from 'payload'\n\nimport type { OwnKeySummary } from '../billing.js'\nimport type { UsageTotals } from '../chat/usage.js'\nimport type { Allowance } from '../endpoints/allowance.js'\nimport type { BudgetView } from '../types.js'\n\nimport { dayIn, monthStart, usageTotals } from '../chat/usage.js'\nimport { accountAllowance, budgetView } from '../endpoints/allowance.js'\nimport { formatReset, nextReset } from '../endpoints/budget.js'\nimport { pluginRuntime } from '../runtime.js'\nimport { AiSourceSwitch } from './AiSourceSwitch.js'\nimport styles from './BudgetField.module.scss'\nimport { percentOf, usdOf } from './percent.js'\n\n/**\n * What the model costs, on the settings screen, for AI Source as it stands in the form. On Humaan AI: how much of the\n * project's budget is used, as shares only. On the own key: the site's spend on it, which is the client's own money,\n * so it is shown in US dollars. Both are rendered here, on the server, so no token or key reaches the browser, and\n * `AiSourceSwitch` shows the one that matches. The settings global is admin-only, and so is this screen.\n */\nexport async function BudgetField({ payload, req }: UIFieldServerProps) {\n  const runtime = pluginRuntime(payload.config)\n  const allowance = await accountAllowance(req)\n  const humaanAi = <HumaanAiBudget allowance={allowance} timeZone={runtime.timeZone} />\n  // Only the summary on the config: the credentials never reach this component.\n  if (!runtime.ownKey) {\n    return humaanAi\n  }\n\n  const today = dayIn(runtime.timeZone)\n  const [month, day] = await Promise.all([\n    usageTotals(req, monthStart(today), today),\n    usageTotals(req, today, today),\n  ])\n  return (\n    <AiSourceSwitch\n      humaanAi={humaanAi}\n      ownKey={\n        <OwnKeyUsage allowance={allowance} month={month} ownKey={runtime.ownKey} today={day} />\n      }\n    />\n  )\n}\n\n/** How much of the project's Humaan AI budget is used, or why it cannot be read. */\nfunction HumaanAiBudget({\n  allowance,\n  timeZone,\n}: {\n  allowance: Allowance | string\n  timeZone: string\n}) {\n  return (\n    <section aria-labelledby=\"ai-assistant-budget-heading\" className={styles.budget}>\n      <h3 className={styles.budget__heading} id=\"ai-assistant-budget-heading\">\n        Humaan AI Budget\n      </h3>\n      {typeof allowance === 'string' ? (\n        <p className={styles.budget__note}>{allowance}</p>\n      ) : (\n        <BudgetDetails allowance={allowance} timeZone={timeZone} view={budgetView(allowance)} />\n      )}\n    </section>\n  )\n}\n\n/** A gauge of the budget used. The text carries the figure; the bar only helps scanning. */\nfunction BudgetDetails({\n  allowance,\n  view,\n  timeZone,\n}: {\n  allowance: Allowance\n  timeZone: string\n  view: BudgetView\n}) {\n  const usedShare = Math.min(Math.max(1 - view.remainingShare, 0), 1)\n  const used = percentOf(usedShare, 1)\n  const reset = nextReset(allowance.refreshPeriod)\n  return (\n    <>\n      <p className={styles.budget__figure} id=\"ai-assistant-budget-used\">\n        {used} used\n        {view.low ? <strong className={styles.budget__low}> (low)</strong> : null}\n      </p>\n      <div\n        aria-labelledby=\"ai-assistant-budget-used\"\n        aria-valuemax={100}\n        aria-valuemin={0}\n        aria-valuenow={Math.round(usedShare * 100)}\n        aria-valuetext={`${used} used`}\n        className={styles.budget__bar}\n        data-low={view.low || undefined}\n        role=\"meter\"\n      >\n        <span className={styles['budget__bar-fill']} style={{ width: `${usedShare * 100}%` }} />\n      </div>\n      <p className={styles.budget__note}>\n        {reset\n          ? `Share of this project's ${allowance.refreshPeriod} budget. Resets on ${formatReset(reset, timeZone)}.`\n          : \"Share of this project's budget, which does not reset.\"}\n      </p>\n    </>\n  )\n}\n\n/**\n * The site's spend on its own key, this month and today, as the gateway prices it. The provider's invoice is the\n * record. Fallbacks are flagged at the top of the screen; this shows the budget that caps them.\n */\nfunction OwnKeyUsage({\n  ownKey,\n  month,\n  today,\n  allowance,\n}: {\n  allowance: Allowance | string\n  month: UsageTotals\n  ownKey: OwnKeySummary\n  today: UsageTotals\n}) {\n  return (\n    <section aria-labelledby=\"ai-assistant-budget-heading\" className={styles.budget}>\n      <h3 className={styles.budget__heading} id=\"ai-assistant-budget-heading\">\n        Own provider key: {ownKey.label}\n      </h3>\n      <p className={styles.budget__figure}>{usdOf(month.ownKeyUsd)} this month</p>\n      <p className={styles.budget__note}>\n        Today: {usdOf(today.ownKeyUsd)} across {today.replies}{' '}\n        {today.replies === 1 ? 'reply' : 'replies'}. The provider bills the account that owns the\n        credentials; figures are the gateway&apos;s prices, and the provider&apos;s invoice is the\n        record. Months follow the site&apos;s time zone.\n      </p>\n      <p className={styles.budget__note}>\n        {typeof allowance === 'string'\n          ? `Fallbacks are capped by the project's Vercel budget, which could not be read: ${allowance}`\n          : `Fallbacks are capped by the project's Vercel budget, ${percentOf(1 - budgetView(allowance).remainingShare, 1)} used.`}\n      </p>\n    </section>\n  )\n}\n"],"names":["dayIn","monthStart","usageTotals","accountAllowance","budgetView","formatReset","nextReset","pluginRuntime","AiSourceSwitch","styles","percentOf","usdOf","BudgetField","payload","req","runtime","config","allowance","humaanAi","HumaanAiBudget","timeZone","ownKey","today","month","day","Promise","all","OwnKeyUsage","section","aria-labelledby","className","budget","h3","budget__heading","id","p","budget__note","BudgetDetails","view","usedShare","Math","min","max","remainingShare","used","reset","refreshPeriod","budget__figure","low","strong","budget__low","div","aria-valuemax","aria-valuemin","aria-valuenow","round","aria-valuetext","budget__bar","data-low","undefined","role","span","style","width","label","ownKeyUsd","replies"],"mappings":"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"}

package/dist/admin/BudgetField.module.scss

@@ -0,0 +1,47 @@
+// Read-only AI Gateway budget on the Humaan AI settings screen.
+.budget {
+  margin-block-end: var(--spacing-field, calc(var(--base) * 1));
+  padding: calc(var(--base) * 0.75) calc(var(--base) * 1);
+  border: 1px solid var(--theme-elevation-150);
+  border-radius: var(--style-radius-m, 4px);
+
+  &__heading {
+    margin: 0 0 calc(var(--base) * 0.5);
+    font-size: 1rem;
+    font-weight: 600;
+  }
+
+  &__figure {
+    margin: 0 0 calc(var(--base) * 0.375);
+    font-size: 1.125rem;
+    font-weight: 600;
+  }
+
+  &__bar {
+    overflow: hidden;
+    height: calc(var(--base) * 0.5);
+    border-radius: 999px;
+    background: var(--theme-elevation-100);
+
+    &[data-low] {
+      --budget-bar-fill: var(--theme-warning-500);
+    }
+
+    &-fill {
+      display: block;
+      height: 100%;
+      border-radius: inherit;
+      background: var(--budget-bar-fill, var(--theme-success-500));
+    }
+  }
+
+  &__low {
+    color: var(--theme-warning-750, var(--theme-warning-800));
+  }
+
+  &__note {
+    margin: calc(var(--base) * 0.5) 0 0;
+    color: var(--theme-elevation-600);
+    font-size: 0.8125rem;
+  }
+}

package/dist/admin/Conversation.d.ts

@@ -0,0 +1,12 @@
+import type { LoadedThread } from './threads.js';
+interface ConversationProps {
+    apiRoute: string;
+    /** Whether the project registered the attachments collection. */
+    attachmentsEnabled: boolean;
+    /** Called when a reply finishes and the thread has been saved. */
+    onReply: () => void;
+    session: LoadedThread;
+}
+/** One conversation. Remounted with a new key to switch conversations. */
+export declare function Conversation({ apiRoute, session, attachmentsEnabled, onReply, }: ConversationProps): import("react").JSX.Element;
+export {};