@clawpump/claw-agent 0.1.7 → 0.1.9

package/agent/web/src/components/PodCredits.tsx

@@ -0,0 +1,57 @@
+import { useEffect, useRef, useState } from "react";
+import { api } from "@/lib/api";
+
+/**
+ * Compact "Pod $X.XX" credits pill, shown next to the model badge only when the
+ * active provider is UsePod (Pod). Polls /api/clawpump/pod/status; keeps the
+ * last value so a transient probe failure never blanks it. Mirrors the desktop
+ * PodCredits.
+ */
+export default function PodCredits({ provider }: { provider: string }) {
+  const isPod = provider === "usepod";
+  const [balance, setBalance] = useState<number | null>(null);
+  const [connected, setConnected] = useState(false);
+  const lastBalance = useRef<number | null>(null);
+
+  useEffect(() => {
+    if (!isPod) return;
+    let cancelled = false;
+    const tick = () => {
+      void api
+        .getPodStatus()
+        .then((r) => {
+          if (cancelled) return;
+          setConnected(!!r.connected);
+          if (r.balance_usdc != null) {
+            lastBalance.current = r.balance_usdc;
+            setBalance(r.balance_usdc);
+          } else if (lastBalance.current != null) {
+            setBalance(lastBalance.current);
+          }
+        })
+        .catch(() => undefined);
+    };
+    tick();
+    const id = window.setInterval(tick, 60_000);
+    return () => {
+      cancelled = true;
+      window.clearInterval(id);
+    };
+  }, [isPod]);
+
+  if (!isPod || !connected) return null;
+
+  const low = balance != null && balance < 0.5;
+  return (
+    <span
+      title={balance != null ? `Pod credits: $${balance.toFixed(4)} USDC` : "Pod connected"}
+      className={`inline-flex shrink-0 items-center gap-1 rounded-md border px-1.5 py-0.5 text-[0.6875rem] font-medium ${
+        low
+          ? "border-amber-500/40 bg-amber-500/10 text-amber-300"
+          : "border-emerald-500/30 bg-emerald-500/10 text-emerald-300"
+      }`}
+    >
+      ⚡ {balance != null ? `$${balance.toFixed(2)}` : "Pod"}
+    </span>
+  );
+}

package/agent/web/src/components/PodSetupDialog.tsx

@@ -0,0 +1,240 @@
+import { useEffect, useMemo, useRef, useState } from "react";
+import { Zap } from "lucide-react";
+import { api } from "@/lib/api";
+import type { AgentWalletBalance } from "@/lib/api";
+import { Button } from "@nous-research/ui/ui/components/button";
+import { Input } from "@nous-research/ui/ui/components/input";
+import { Select, SelectOption } from "@nous-research/ui/ui/components/select";
+import { Spinner } from "@nous-research/ui/ui/components/spinner";
+
+const DEFAULT_AMOUNT = "5";
+
+const walletLabel = (w: AgentWalletBalance): string =>
+  w.name ||
+  (w.wallet_address
+    ? `${w.wallet_address.slice(0, 4)}…${w.wallet_address.slice(-4)}`
+    : w.agent_id);
+
+/**
+ * One-screen Pod setup for the web dashboard: pick a ClawPump agent wallet, pick
+ * an amount, confirm. `usepod_provision` registers + funds a pod from that wallet
+ * on-chain in one call, and the backend switches the session onto Pod as the
+ * provider. The single confirm is the on-chain USDC spend; everything else is
+ * prefilled. Mirrors the desktop PodSetupDialog.
+ */
+export default function PodSetupDialog({
+  onClose,
+  onProvisioned,
+}: {
+  onClose: () => void;
+  onProvisioned: (model: string) => void;
+}) {
+  const [wallets, setWallets] = useState<AgentWalletBalance[] | null>(null);
+  const [loadError, setLoadError] = useState<string | null>(null);
+  const [agentId, setAgentId] = useState("");
+  const [amount, setAmount] = useState(DEFAULT_AMOUNT);
+  const [busy, setBusy] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+  const [done, setDone] = useState<{
+    model: string;
+    amount: number;
+    signature?: string;
+    fundingError?: string;
+  } | null>(null);
+
+  useEffect(() => {
+    let cancelled = false;
+    void api
+      .getWalletBalances()
+      .then((r) => {
+        if (cancelled) return;
+        const rows = (r.wallets ?? []).filter((w) => w.agent_id);
+        setWallets(rows);
+        if (rows.length > 0) {
+          const best = [...rows].sort(
+            (a, b) => (b.usdc_balance ?? 0) - (a.usdc_balance ?? 0),
+          )[0];
+          setAgentId(best.agent_id);
+        }
+      })
+      .catch((e) => !cancelled && setLoadError(e instanceof Error ? e.message : "Failed to load wallets"));
+    return () => {
+      cancelled = true;
+    };
+  }, []);
+
+  const rows = wallets ?? [];
+  const selected = rows.find((w) => w.agent_id === agentId) ?? null;
+  const amountNum = Number(amount);
+  const balance = selected?.usdc_balance ?? 0;
+  const insufficient = Number.isFinite(amountNum) && amountNum > 0 && amountNum > balance;
+  const canFund =
+    !busy && Boolean(agentId) && Number.isFinite(amountNum) && amountNum > 0 && !insufficient;
+
+  const heading = useMemo(() => (done ? "Pod ready" : "Set up Pod"), [done]);
+
+  // Ref guard: setBusy is async, so a fast double-click could fire two
+  // provisions (= double on-chain spend) before the disabled state re-renders.
+  const submitting = useRef(false);
+
+  const fund = async () => {
+    if (!canFund || submitting.current) return;
+    submitting.current = true;
+    setBusy(true);
+    setError(null);
+    try {
+      const res = await api.provisionPod(agentId, amountNum);
+      if (!res.ok || !res.model) {
+        setError(res.error || res.funding_error || "Pod setup failed. Check the wallet balance and try again.");
+        return;
+      }
+      // Show the "Pod ready" view; the actual session switch + close happens on
+      // Done (onProvisioned), because the switch unmounts this dialog.
+      setDone({
+        amount: amountNum,
+        model: res.model,
+        signature: res.signature,
+        fundingError: res.funding_error || undefined,
+      });
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Pod setup failed.");
+    } finally {
+      setBusy(false);
+      submitting.current = false;
+    }
+  };
+
+  return (
+    <div
+      className="fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4"
+      onClick={() => {
+        if (busy) return;
+        // After a successful provision, dismissing applies the switch (same as
+        // Done) so a backdrop click doesn't silently skip using the new Pod.
+        if (done) onProvisioned(done.model);
+        else onClose();
+      }}
+    >
+      <div
+        className="w-full max-w-md rounded-lg border border-border bg-card shadow-xl"
+        onClick={(e) => e.stopPropagation()}
+      >
+        <div className="flex items-center gap-2 border-b border-border px-4 py-3">
+          <Zap className="h-4 w-4 text-primary" />
+          <h2 className="text-sm font-semibold">
+            {done?.fundingError ? "Pod created — funding failed" : heading}
+          </h2>
+        </div>
+
+        {done ? (
+          <div className="flex flex-col gap-3 p-4">
+            {done.fundingError ? (
+              <div className="rounded-md border border-amber-500/40 bg-amber-500/10 px-3 py-3 text-sm">
+                <div className="font-semibold text-amber-300">⚠ Pod created but not funded</div>
+                <div className="mt-0.5 text-muted-foreground">
+                  The on-chain deposit didn’t confirm ({done.fundingError}). The pod (
+                  <span className="font-mono">{done.model}</span>) is selected but has no balance — it
+                  may settle shortly, or run Set up Pod again to top it up.
+                </div>
+              </div>
+            ) : (
+              <div className="rounded-md border border-emerald-500/30 bg-emerald-500/10 px-3 py-3 text-sm">
+                <div className="font-semibold text-emerald-300">⚡ Using Pod</div>
+                <div className="mt-0.5 text-muted-foreground">
+                  Funded <span className="font-mono">${done.amount.toFixed(2)} USDC</span> · model{" "}
+                  <span className="font-mono">{done.model}</span>. New chats run on Pod automatically.
+                </div>
+              </div>
+            )}
+            {done.signature && (
+              <a
+                className="text-xs text-primary hover:underline"
+                href={`https://solscan.io/tx/${done.signature}`}
+                rel="noreferrer"
+                target="_blank"
+              >
+                View funding transaction ↗
+              </a>
+            )}
+            <div className="flex justify-end">
+              <Button onClick={() => onProvisioned(done.model)}>Done</Button>
+            </div>
+          </div>
+        ) : (
+          <>
+            <div className="flex flex-col gap-4 p-4">
+              <p className="text-xs leading-relaxed text-muted-foreground">
+                Fund a private inference Pod from a ClawPump agent wallet and use it as your model
+                provider. You only pay for what you use — the Pod holds a prepaid USDC balance.
+              </p>
+
+              {wallets === null ? (
+                <div className="flex items-center gap-2 text-sm text-muted-foreground">
+                  <Spinner className="text-xs" /> Loading your wallets…
+                </div>
+              ) : loadError || rows.length === 0 ? (
+                <div className="rounded-md border border-amber-500/40 bg-amber-500/10 px-3 py-2 text-xs text-amber-300">
+                  {loadError ||
+                    "No ClawPump agent wallets found. Create one in the ClawPump dashboard first."}
+                </div>
+              ) : (
+                <>
+                  <label className="flex flex-col gap-1.5 text-sm">
+                    <span className="font-medium">Pay from wallet</span>
+                    <Select value={agentId} onValueChange={setAgentId}>
+                      {rows.map((w) => (
+                        <SelectOption key={w.agent_id} value={w.agent_id}>
+                          {`${walletLabel(w)} — $${(w.usdc_balance ?? 0).toFixed(2)} USDC`}
+                        </SelectOption>
+                      ))}
+                    </Select>
+                  </label>
+
+                  <label className="flex flex-col gap-1.5 text-sm">
+                    <span className="font-medium">Amount to fund (USDC)</span>
+                    <Input
+                      type="number"
+                      min="0"
+                      step="1"
+                      value={amount}
+                      onChange={(e) => setAmount(e.target.value)}
+                    />
+                    <span className="text-xs text-muted-foreground">
+                      Wallet balance: <span className="font-mono">${balance.toFixed(2)} USDC</span>
+                    </span>
+                  </label>
+
+                  {insufficient && (
+                    <div className="rounded-md border border-amber-500/40 bg-amber-500/10 px-3 py-2 text-xs text-amber-300">
+                      Not enough USDC in this wallet for ${amountNum.toFixed(2)}. Pick a smaller amount.
+                    </div>
+                  )}
+                  {error && (
+                    <div className="rounded-md border border-destructive/40 bg-destructive/10 px-3 py-2 text-xs text-destructive">
+                      {error}
+                    </div>
+                  )}
+                </>
+              )}
+            </div>
+
+            <div className="flex justify-end gap-2 border-t border-border px-4 py-3">
+              <Button variant="outline" disabled={busy} onClick={onClose}>
+                Cancel
+              </Button>
+              <Button disabled={!canFund} onClick={() => void fund()}>
+                {busy ? (
+                  <span className="flex items-center gap-2">
+                    <Spinner className="text-xs" /> Funding Pod…
+                  </span>
+                ) : (
+                  `Fund $${Number.isFinite(amountNum) ? amountNum.toFixed(2) : "0.00"} & use Pod`
+                )}
+              </Button>
+            </div>
+          </>
+        )}
+      </div>
+    </div>
+  );
+}

package/agent/web/src/lib/api.ts

@@ -313,6 +313,8 @@ function appendProfileParam(url: string, profile?: string): string {
 export interface AgentWalletBalance {
   agent_id: string;
   name?: string | null;
+  avatar_url?: string | null;
+  token_mint?: string | null;
   wallet_address: string | null;
   sol_balance: number | null;
   usdc_balance: number | null;
@@ -341,6 +343,19 @@ export interface WalletTransferResponse {
   result?: unknown;
 }
 
+export interface PodStatusResponse {
+  connected: boolean;
+  balance_usdc?: number | null;
+}
+
+export interface PodProvisionResponse {
+  ok: boolean;
+  model?: string;
+  signature?: string;
+  funding_error?: string;
+  error?: string;
+}
+
 export interface X402Pricing {
   network?: string;
   asset?: string;
@@ -369,6 +384,86 @@ export interface X402SearchResponse {
   results: X402Result[];
 }
 
+// ── Agent Mail (AgentMail, via the ClawPump MCP) ───────────────────────
+export interface MailInbox {
+  id: string;
+  agentId: string;
+  provider: string;
+  inboxId: string;
+  emailAddress: string;
+  username: string;
+  domain: string;
+  webhookId: string | null;
+  verified: boolean;
+  status: string;
+  createdAt: string;
+  updatedAt: string;
+}
+
+export interface MailMessage {
+  id: string;
+  agentId: string;
+  inboxId: string;
+  messageId: string;
+  threadId: string | null;
+  direction: "inbound" | "outbound";
+  fromAddress: string | null;
+  toAddresses: string[];
+  ccAddresses: string[];
+  subject: string | null;
+  textBody: string | null;
+  htmlBody: string | null;
+  preview: string | null;
+  read: boolean;
+  agentmailCreatedAt: string | null;
+  createdAt: string;
+}
+
+export interface MailAddressResponse {
+  ok: boolean;
+  error?: string;
+  has_inbox: boolean;
+  inbox: MailInbox | null;
+}
+
+export interface MailMessagesResponse {
+  ok: boolean;
+  error?: string;
+  messages: MailMessage[];
+}
+
+export interface MailMessageResponse {
+  ok: boolean;
+  error?: string;
+  message: MailMessage | null;
+}
+
+export interface MailCreateResponse {
+  ok: boolean;
+  error?: string;
+  inbox?: MailInbox | null;
+  alreadyExisted?: boolean;
+  note?: string | null;
+}
+
+export interface MailSendBody {
+  agent_id: string;
+  to: string[];
+  subject: string;
+  text?: string;
+  html?: string;
+  cc?: string[];
+  bcc?: string[];
+  reply_to?: string;
+  confirm: boolean;
+}
+
+export interface MailSendResponse {
+  ok: boolean;
+  error?: string;
+  result?: unknown;
+}
+
 export const api = {
   getStatus: () => fetchJSON<StatusResponse>("/api/status"),
   getWalletBalances: () =>
@@ -381,6 +476,46 @@ export const api = {
       headers: { "Content-Type": "application/json" },
       body: JSON.stringify(body),
     }),
+
+  // ── UsePod "Pod" — pay-as-you-go inference funded from a ClawPump wallet ──
+  getPodStatus: () =>
+    fetchJSON<PodStatusResponse>("/api/clawpump/pod/status"),
+  provisionPod: (agentId: string, amount: number) =>
+    fetchJSON<PodProvisionResponse>("/api/clawpump/pod/provision", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ agent_id: agentId, amount }),
+    }),
+
+  // ── Agent Mail (AgentMail) ─────────────────────────────────────────
+  // Every call carries an explicit agent_id — the MCP requires it once the
+  // account has more than one agent.
+  getMailAddress: (agentId: string) =>
+    fetchJSON<MailAddressResponse>(
+      `/api/mail/address?agent_id=${encodeURIComponent(agentId)}`,
+    ),
+  listMail: (opts: { agentId: string; direction?: "inbound" | "outbound"; limit?: number }) => {
+    const qs = new URLSearchParams({ agent_id: opts.agentId });
+    if (opts.direction) qs.set("direction", opts.direction);
+    if (opts.limit) qs.set("limit", String(opts.limit));
+    return fetchJSON<MailMessagesResponse>(`/api/mail/messages?${qs.toString()}`);
+  },
+  readMail: (messageId: string, agentId: string) =>
+    fetchJSON<MailMessageResponse>(
+      `/api/mail/message?message_id=${encodeURIComponent(messageId)}&agent_id=${encodeURIComponent(agentId)}`,
+    ),
+  createInbox: (body: { agent_id: string; username?: string; confirm: boolean }) =>
+    fetchJSON<MailCreateResponse>("/api/mail/create", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify(body),
+    }),
+  sendMail: (body: MailSendBody) =>
+    fetchJSON<MailSendResponse>("/api/mail/send", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify(body),
+    }),
   /**
    * Identity probe for the dashboard auth gate (Phase 7).
    *