@open-mercato/core 0.4.5-develop-811deeb983 → 0.4.5-develop-3d8e759e45

package/dist/modules/inbox_ops/backend/inbox-ops/log/page.js

@@ -7,6 +7,8 @@ import { DataTable } from "@open-mercato/ui/backend/DataTable";
 import { Button } from "@open-mercato/ui/primitives/button";
 import { apiCall } from "@open-mercato/ui/backend/utils/apiCall";
 import { flash } from "@open-mercato/ui/backend/FlashMessages";
+import { ErrorMessage } from "@open-mercato/ui/backend/detail";
+import { useGuardedMutation } from "@open-mercato/ui/backend/injection/useGuardedMutation";
 import { useT } from "@open-mercato/shared/lib/i18n/context";
 import { ArrowLeft, RefreshCw } from "lucide-react";
 const STATUS_COLORS = {
@@ -24,37 +26,51 @@ function ProcessingLogPage() {
   const [pageSize] = React.useState(25);
   const [statusFilter, setStatusFilter] = React.useState();
   const [isLoading, setIsLoading] = React.useState(true);
+  const [error, setError] = React.useState(null);
   const [retryingEmailId, setRetryingEmailId] = React.useState(null);
+  const { runMutation } = useGuardedMutation({
+    contextId: "inbox-ops-log"
+  });
   const loadEmails = React.useCallback(async () => {
     setIsLoading(true);
+    setError(null);
     const params = new URLSearchParams();
     params.set("page", String(page));
     params.set("pageSize", String(pageSize));
     if (statusFilter) params.set("status", statusFilter);
-    const result = await apiCall(`/api/inbox_ops/emails?${params}`);
-    if (result?.ok && result.result?.items) {
-      setItems(result.result.items);
-      setTotal(result.result.total || 0);
+    try {
+      const result = await apiCall(`/api/inbox_ops/emails?${params}`);
+      if (result?.ok && result.result?.items) {
+        setItems(result.result.items);
+        setTotal(result.result.total || 0);
+      } else {
+        setError(t("inbox_ops.log.load_failed", "Failed to load processing log"));
+      }
+    } catch {
+      setError(t("inbox_ops.log.load_failed", "Failed to load processing log"));
     }
     setIsLoading(false);
-  }, [page, pageSize, statusFilter]);
+  }, [page, pageSize, statusFilter, t]);
   React.useEffect(() => {
     loadEmails();
   }, [loadEmails]);
   const handleRetryEmail = React.useCallback(async (emailId) => {
     setRetryingEmailId(emailId);
-    const result = await apiCall(
-      `/api/inbox_ops/emails/${emailId}/reprocess`,
-      { method: "POST" }
-    );
+    const result = await runMutation({
+      operation: () => apiCall(
+        `/api/inbox_ops/emails/${emailId}/reprocess`,
+        { method: "POST" }
+      ),
+      context: {}
+    });
     if (result?.ok && result.result?.ok) {
-      flash(`${t("inbox_ops.action.retry", "Retry")} ${t("inbox_ops.status.processing", "Processing")}`, "success");
+      flash(t("inbox_ops.flash.reprocessing_started", "Reprocessing started"), "success");
       await loadEmails();
     } else {
       flash(result?.result?.error || t("inbox_ops.extraction_failed", "Extraction failed"), "error");
     }
     setRetryingEmailId(null);
-  }, [loadEmails, t]);
+  }, [loadEmails, t, runMutation]);
   const columns = React.useMemo(() => [
     {
       accessorKey: "subject",
@@ -70,8 +86,16 @@ function ProcessingLogPage() {
       accessorKey: "status",
       header: t("inbox_ops.log.status", "Status"),
       cell: ({ row }) => {
+        const statusLabels = {
+          received: t("inbox_ops.log.tab_received", "Received"),
+          processing: t("inbox_ops.log.tab_processing", "Processing"),
+          processed: t("inbox_ops.log.tab_processed", "Processed"),
+          needs_review: t("inbox_ops.log.tab_needs_review", "Needs Review"),
+          failed: t("inbox_ops.log.tab_failed", "Failed")
+        };
         const color = STATUS_COLORS[row.original.status] || "bg-gray-100 text-gray-800";
-        return /* @__PURE__ */ jsx("span", { className: `inline-flex items-center px-2 py-0.5 rounded text-xs font-medium capitalize ${color}`, children: row.original.status });
+        const label = statusLabels[row.original.status] || row.original.status;
+        return /* @__PURE__ */ jsx("span", { className: `inline-flex items-center px-2 py-0.5 rounded text-xs font-medium ${color}`, children: label });
       }
     },
     {
@@ -103,6 +127,7 @@ function ProcessingLogPage() {
         return /* @__PURE__ */ jsxs(
           Button,
           {
+            type: "button",
             variant: "outline",
             size: "sm",
             className: "h-8",
@@ -127,13 +152,14 @@ function ProcessingLogPage() {
   ];
   return /* @__PURE__ */ jsxs(Page, { children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 px-3 py-3 md:px-6 md:py-4", children: [
-      /* @__PURE__ */ jsx(Link, { href: "/backend/inbox-ops", children: /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", children: /* @__PURE__ */ jsx(ArrowLeft, { className: "h-4 w-4" }) }) }),
+      /* @__PURE__ */ jsx(Link, { href: "/backend/inbox-ops", children: /* @__PURE__ */ jsx(Button, { type: "button", variant: "ghost", size: "sm", children: /* @__PURE__ */ jsx(ArrowLeft, { className: "h-4 w-4" }) }) }),
       /* @__PURE__ */ jsx("h1", { className: "text-lg font-semibold", children: t("inbox_ops.processing_log", "Processing Log") })
     ] }),
     /* @__PURE__ */ jsxs(PageBody, { children: [
       /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 px-3 py-2 md:px-0 overflow-x-auto", children: tabs.map((tab) => /* @__PURE__ */ jsx(
         Button,
         {
+          type: "button",
           variant: statusFilter === tab.value ? "default" : "outline",
           size: "sm",
           onClick: () => {
@@ -144,7 +170,7 @@ function ProcessingLogPage() {
         },
         tab.value ?? "all"
       )) }),
-      /* @__PURE__ */ jsx("div", { className: "overflow-auto", children: /* @__PURE__ */ jsx("div", { className: "min-w-[640px]", children: /* @__PURE__ */ jsx(
+      error ? /* @__PURE__ */ jsx(ErrorMessage, { label: error }) : /* @__PURE__ */ jsx("div", { className: "overflow-auto", children: /* @__PURE__ */ jsx("div", { className: "min-w-[640px]", children: /* @__PURE__ */ jsx(
         DataTable,
         {
           columns,

package/dist/modules/inbox_ops/backend/inbox-ops/log/page.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/modules/inbox_ops/backend/inbox-ops/log/page.tsx"],
-  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport Link from 'next/link'\nimport { Page, PageBody } from '@open-mercato/ui/backend/Page'\nimport { DataTable } from '@open-mercato/ui/backend/DataTable'\nimport type { ColumnDef } from '@tanstack/react-table'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { apiCall } from '@open-mercato/ui/backend/utils/apiCall'\nimport { flash } from '@open-mercato/ui/backend/FlashMessages'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { ArrowLeft, RefreshCw } from 'lucide-react'\n\ntype EmailRow = {\n  id: string\n  subject: string\n  forwardedByAddress: string\n  forwardedByName?: string\n  status: string\n  processingError?: string\n  receivedAt: string\n}\n\ntype EmailListResponse = {\n  items?: EmailRow[]\n  total?: number\n  page?: number\n  totalPages?: number\n}\n\nconst STATUS_COLORS: Record<string, string> = {\n  received: 'bg-blue-100 text-blue-800',\n  processing: 'bg-purple-100 text-purple-800',\n  processed: 'bg-green-100 text-green-800',\n  needs_review: 'bg-amber-100 text-amber-800',\n  failed: 'bg-red-100 text-red-800',\n}\n\nexport default function ProcessingLogPage() {\n  const t = useT()\n  const [items, setItems] = React.useState<EmailRow[]>([])\n  const [total, setTotal] = React.useState(0)\n  const [page, setPage] = React.useState(1)\n  const [pageSize] = React.useState(25)\n  const [statusFilter, setStatusFilter] = React.useState<string | undefined>()\n  const [isLoading, setIsLoading] = React.useState(true)\n  const [retryingEmailId, setRetryingEmailId] = React.useState<string | null>(null)\n\n  const loadEmails = React.useCallback(async () => {\n    setIsLoading(true)\n    const params = new URLSearchParams()\n    params.set('page', String(page))\n    params.set('pageSize', String(pageSize))\n    if (statusFilter) params.set('status', statusFilter)\n\n    const result = await apiCall<EmailListResponse>(`/api/inbox_ops/emails?${params}`)\n    if (result?.ok && result.result?.items) {\n      setItems(result.result.items)\n      setTotal(result.result.total || 0)\n    }\n    setIsLoading(false)\n  }, [page, pageSize, statusFilter])\n\n  React.useEffect(() => { loadEmails() }, [loadEmails])\n\n  const handleRetryEmail = React.useCallback(async (emailId: string) => {\n    setRetryingEmailId(emailId)\n    const result = await apiCall<{ ok: boolean; error?: string }>(\n      `/api/inbox_ops/emails/${emailId}/reprocess`,\n      { method: 'POST' },\n    )\n\n    if (result?.ok && result.result?.ok) {\n      flash(`${t('inbox_ops.action.retry', 'Retry')} ${t('inbox_ops.status.processing', 'Processing')}`, 'success')\n      await loadEmails()\n    } else {\n      flash(result?.result?.error || t('inbox_ops.extraction_failed', 'Extraction failed'), 'error')\n    }\n\n    setRetryingEmailId(null)\n  }, [loadEmails, t])\n\n  const columns: ColumnDef<EmailRow>[] = React.useMemo(() => [\n    {\n      accessorKey: 'subject',\n      header: t('inbox_ops.log.subject', 'Subject'),\n      cell: ({ row }) => (\n        <span className=\"text-sm font-medium truncate max-w-[300px] block\">{row.original.subject}</span>\n      ),\n    },\n    {\n      accessorKey: 'forwardedByAddress',\n      header: t('inbox_ops.log.from', 'From'),\n      cell: ({ row }) => (\n        <span className=\"text-sm text-muted-foreground truncate max-w-[200px] block\">\n          {row.original.forwardedByName || row.original.forwardedByAddress}\n        </span>\n      ),\n    },\n    {\n      accessorKey: 'status',\n      header: t('inbox_ops.log.status', 'Status'),\n      cell: ({ row }) => {\n        const color = STATUS_COLORS[row.original.status] || 'bg-gray-100 text-gray-800'\n        return <span className={`inline-flex items-center px-2 py-0.5 rounded text-xs font-medium capitalize ${color}`}>{row.original.status}</span>\n      },\n    },\n    {\n      accessorKey: 'receivedAt',\n      header: t('inbox_ops.received_at', 'Received'),\n      cell: ({ row }) => {\n        const d = new Date(row.original.receivedAt)\n        return <span className=\"text-sm text-muted-foreground\">{d.toLocaleDateString()} {d.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}</span>\n      },\n    },\n    {\n      accessorKey: 'processingError',\n      header: t('inbox_ops.extraction_failed', 'Error'),\n      cell: ({ row }) => (\n        <span className=\"text-xs text-red-600 truncate max-w-[280px] block\">\n          {row.original.processingError || '-'}\n        </span>\n      ),\n    },\n    {\n      id: 'actions',\n      header: t('ui.actions.actions', 'Actions'),\n      cell: ({ row }) => {\n        const canRetry = row.original.status === 'failed' || row.original.status === 'needs_review'\n        if (!canRetry) {\n          return <span className=\"text-xs text-muted-foreground\">-</span>\n        }\n\n        const isRetrying = retryingEmailId === row.original.id\n        return (\n          <Button\n            variant=\"outline\"\n            size=\"sm\"\n            className=\"h-8\"\n            disabled={isRetrying}\n            onClick={() => handleRetryEmail(row.original.id)}\n          >\n            <RefreshCw className={`h-3.5 w-3.5 mr-1 ${isRetrying ? 'animate-spin' : ''}`} />\n            {t('inbox_ops.action.retry', 'Retry')}\n          </Button>\n        )\n      },\n    },\n  ], [handleRetryEmail, retryingEmailId, t])\n\n  const tabs = [\n    { label: t('inbox_ops.log.tab_all', 'All'), value: undefined },\n    { label: t('inbox_ops.log.tab_received', 'Received'), value: 'received' },\n    { label: t('inbox_ops.log.tab_processing', 'Processing'), value: 'processing' },\n    { label: t('inbox_ops.log.tab_processed', 'Processed'), value: 'processed' },\n    { label: t('inbox_ops.log.tab_needs_review', 'Needs Review'), value: 'needs_review' },\n    { label: t('inbox_ops.log.tab_failed', 'Failed'), value: 'failed' },\n  ]\n\n  return (\n    <Page>\n      <div className=\"flex items-center gap-3 px-3 py-3 md:px-6 md:py-4\">\n        <Link href=\"/backend/inbox-ops\">\n          <Button variant=\"ghost\" size=\"sm\"><ArrowLeft className=\"h-4 w-4\" /></Button>\n        </Link>\n        <h1 className=\"text-lg font-semibold\">{t('inbox_ops.processing_log', 'Processing Log')}</h1>\n      </div>\n\n      <PageBody>\n        <div className=\"flex items-center gap-2 px-3 py-2 md:px-0 overflow-x-auto\">\n          {tabs.map((tab) => (\n            <Button\n              key={tab.value ?? 'all'}\n              variant={statusFilter === tab.value ? 'default' : 'outline'}\n              size=\"sm\"\n              onClick={() => { setStatusFilter(tab.value); setPage(1) }}\n            >\n              {tab.label}\n            </Button>\n          ))}\n        </div>\n\n        <div className=\"overflow-auto\">\n          <div className=\"min-w-[640px]\">\n            <DataTable\n              columns={columns}\n              data={items}\n              isLoading={isLoading}\n              pagination={{\n                page,\n                pageSize,\n                total,\n                totalPages: Math.ceil(total / pageSize),\n                onPageChange: setPage,\n              }}\n            />\n          </div>\n        </div>\n      </PageBody>\n    </Page>\n  )\n}\n"],
-  "mappings": ";AAuFQ,cAyBO,YAzBP;AArFR,YAAY,WAAW;AACvB,OAAO,UAAU;AACjB,SAAS,MAAM,gBAAgB;AAC/B,SAAS,iBAAiB;AAE1B,SAAS,cAAc;AACvB,SAAS,eAAe;AACxB,SAAS,aAAa;AACtB,SAAS,YAAY;AACrB,SAAS,WAAW,iBAAiB;AAmBrC,MAAM,gBAAwC;AAAA,EAC5C,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,cAAc;AAAA,EACd,QAAQ;AACV;AAEe,SAAR,oBAAqC;AAC1C,QAAM,IAAI,KAAK;AACf,QAAM,CAAC,OAAO,QAAQ,IAAI,MAAM,SAAqB,CAAC,CAAC;AACvD,QAAM,CAAC,OAAO,QAAQ,IAAI,MAAM,SAAS,CAAC;AAC1C,QAAM,CAAC,MAAM,OAAO,IAAI,MAAM,SAAS,CAAC;AACxC,QAAM,CAAC,QAAQ,IAAI,MAAM,SAAS,EAAE;AACpC,QAAM,CAAC,cAAc,eAAe,IAAI,MAAM,SAA6B;AAC3E,QAAM,CAAC,WAAW,YAAY,IAAI,MAAM,SAAS,IAAI;AACrD,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,MAAM,SAAwB,IAAI;AAEhF,QAAM,aAAa,MAAM,YAAY,YAAY;AAC/C,iBAAa,IAAI;AACjB,UAAM,SAAS,IAAI,gBAAgB;AACnC,WAAO,IAAI,QAAQ,OAAO,IAAI,CAAC;AAC/B,WAAO,IAAI,YAAY,OAAO,QAAQ,CAAC;AACvC,QAAI,aAAc,QAAO,IAAI,UAAU,YAAY;AAEnD,UAAM,SAAS,MAAM,QAA2B,yBAAyB,MAAM,EAAE;AACjF,QAAI,QAAQ,MAAM,OAAO,QAAQ,OAAO;AACtC,eAAS,OAAO,OAAO,KAAK;AAC5B,eAAS,OAAO,OAAO,SAAS,CAAC;AAAA,IACnC;AACA,iBAAa,KAAK;AAAA,EACpB,GAAG,CAAC,MAAM,UAAU,YAAY,CAAC;AAEjC,QAAM,UAAU,MAAM;AAAE,eAAW;AAAA,EAAE,GAAG,CAAC,UAAU,CAAC;AAEpD,QAAM,mBAAmB,MAAM,YAAY,OAAO,YAAoB;AACpE,uBAAmB,OAAO;AAC1B,UAAM,SAAS,MAAM;AAAA,MACnB,yBAAyB,OAAO;AAAA,MAChC,EAAE,QAAQ,OAAO;AAAA,IACnB;AAEA,QAAI,QAAQ,MAAM,OAAO,QAAQ,IAAI;AACnC,YAAM,GAAG,EAAE,0BAA0B,OAAO,CAAC,IAAI,EAAE,+BAA+B,YAAY,CAAC,IAAI,SAAS;AAC5G,YAAM,WAAW;AAAA,IACnB,OAAO;AACL,YAAM,QAAQ,QAAQ,SAAS,EAAE,+BAA+B,mBAAmB,GAAG,OAAO;AAAA,IAC/F;AAEA,uBAAmB,IAAI;AAAA,EACzB,GAAG,CAAC,YAAY,CAAC,CAAC;AAElB,QAAM,UAAiC,MAAM,QAAQ,MAAM;AAAA,IACzD;AAAA,MACE,aAAa;AAAA,MACb,QAAQ,EAAE,yBAAyB,SAAS;AAAA,MAC5C,MAAM,CAAC,EAAE,IAAI,MACX,oBAAC,UAAK,WAAU,oDAAoD,cAAI,SAAS,SAAQ;AAAA,IAE7F;AAAA,IACA;AAAA,MACE,aAAa;AAAA,MACb,QAAQ,EAAE,sBAAsB,MAAM;AAAA,MACtC,MAAM,CAAC,EAAE,IAAI,MACX,oBAAC,UAAK,WAAU,8DACb,cAAI,SAAS,mBAAmB,IAAI,SAAS,oBAChD;AAAA,IAEJ;AAAA,IACA;AAAA,MACE,aAAa;AAAA,MACb,QAAQ,EAAE,wBAAwB,QAAQ;AAAA,MAC1C,MAAM,CAAC,EAAE,IAAI,MAAM;AACjB,cAAM,QAAQ,cAAc,IAAI,SAAS,MAAM,KAAK;AACpD,eAAO,oBAAC,UAAK,WAAW,+EAA+E,KAAK,IAAK,cAAI,SAAS,QAAO;AAAA,MACvI;AAAA,IACF;AAAA,IACA;AAAA,MACE,aAAa;AAAA,MACb,QAAQ,EAAE,yBAAyB,UAAU;AAAA,MAC7C,MAAM,CAAC,EAAE,IAAI,MAAM;AACjB,cAAM,IAAI,IAAI,KAAK,IAAI,SAAS,UAAU;AAC1C,eAAO,qBAAC,UAAK,WAAU,iCAAiC;AAAA,YAAE,mBAAmB;AAAA,UAAE;AAAA,UAAE,EAAE,mBAAmB,CAAC,GAAG,EAAE,MAAM,WAAW,QAAQ,UAAU,CAAC;AAAA,WAAE;AAAA,MACpJ;AAAA,IACF;AAAA,IACA;AAAA,MACE,aAAa;AAAA,MACb,QAAQ,EAAE,+BAA+B,OAAO;AAAA,MAChD,MAAM,CAAC,EAAE,IAAI,MACX,oBAAC,UAAK,WAAU,qDACb,cAAI,SAAS,mBAAmB,KACnC;AAAA,IAEJ;AAAA,IACA;AAAA,MACE,IAAI;AAAA,MACJ,QAAQ,EAAE,sBAAsB,SAAS;AAAA,MACzC,MAAM,CAAC,EAAE,IAAI,MAAM;AACjB,cAAM,WAAW,IAAI,SAAS,WAAW,YAAY,IAAI,SAAS,WAAW;AAC7E,YAAI,CAAC,UAAU;AACb,iBAAO,oBAAC,UAAK,WAAU,iCAAgC,eAAC;AAAA,QAC1D;AAEA,cAAM,aAAa,oBAAoB,IAAI,SAAS;AACpD,eACE;AAAA,UAAC;AAAA;AAAA,YACC,SAAQ;AAAA,YACR,MAAK;AAAA,YACL,WAAU;AAAA,YACV,UAAU;AAAA,YACV,SAAS,MAAM,iBAAiB,IAAI,SAAS,EAAE;AAAA,YAE/C;AAAA,kCAAC,aAAU,WAAW,oBAAoB,aAAa,iBAAiB,EAAE,IAAI;AAAA,cAC7E,EAAE,0BAA0B,OAAO;AAAA;AAAA;AAAA,QACtC;AAAA,MAEJ;AAAA,IACF;AAAA,EACF,GAAG,CAAC,kBAAkB,iBAAiB,CAAC,CAAC;AAEzC,QAAM,OAAO;AAAA,IACX,EAAE,OAAO,EAAE,yBAAyB,KAAK,GAAG,OAAO,OAAU;AAAA,IAC7D,EAAE,OAAO,EAAE,8BAA8B,UAAU,GAAG,OAAO,WAAW;AAAA,IACxE,EAAE,OAAO,EAAE,gCAAgC,YAAY,GAAG,OAAO,aAAa;AAAA,IAC9E,EAAE,OAAO,EAAE,+BAA+B,WAAW,GAAG,OAAO,YAAY;AAAA,IAC3E,EAAE,OAAO,EAAE,kCAAkC,cAAc,GAAG,OAAO,eAAe;AAAA,IACpF,EAAE,OAAO,EAAE,4BAA4B,QAAQ,GAAG,OAAO,SAAS;AAAA,EACpE;AAEA,SACE,qBAAC,QACC;AAAA,yBAAC,SAAI,WAAU,qDACb;AAAA,0BAAC,QAAK,MAAK,sBACT,8BAAC,UAAO,SAAQ,SAAQ,MAAK,MAAK,8BAAC,aAAU,WAAU,WAAU,GAAE,GACrE;AAAA,MACA,oBAAC,QAAG,WAAU,yBAAyB,YAAE,4BAA4B,gBAAgB,GAAE;AAAA,OACzF;AAAA,IAEA,qBAAC,YACC;AAAA,0BAAC,SAAI,WAAU,6DACZ,eAAK,IAAI,CAAC,QACT;AAAA,QAAC;AAAA;AAAA,UAEC,SAAS,iBAAiB,IAAI,QAAQ,YAAY;AAAA,UAClD,MAAK;AAAA,UACL,SAAS,MAAM;AAAE,4BAAgB,IAAI,KAAK;AAAG,oBAAQ,CAAC;AAAA,UAAE;AAAA,UAEvD,cAAI;AAAA;AAAA,QALA,IAAI,SAAS;AAAA,MAMpB,CACD,GACH;AAAA,MAEA,oBAAC,SAAI,WAAU,iBACb,8BAAC,SAAI,WAAU,iBACb;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,MAAM;AAAA,UACN;AAAA,UACA,YAAY;AAAA,YACV;AAAA,YACA;AAAA,YACA;AAAA,YACA,YAAY,KAAK,KAAK,QAAQ,QAAQ;AAAA,YACtC,cAAc;AAAA,UAChB;AAAA;AAAA,MACF,GACF,GACF;AAAA,OACF;AAAA,KACF;AAEJ;",
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport Link from 'next/link'\nimport { Page, PageBody } from '@open-mercato/ui/backend/Page'\nimport { DataTable } from '@open-mercato/ui/backend/DataTable'\nimport type { ColumnDef } from '@tanstack/react-table'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { apiCall } from '@open-mercato/ui/backend/utils/apiCall'\nimport { flash } from '@open-mercato/ui/backend/FlashMessages'\nimport { ErrorMessage } from '@open-mercato/ui/backend/detail'\nimport { useGuardedMutation } from '@open-mercato/ui/backend/injection/useGuardedMutation'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { ArrowLeft, RefreshCw } from 'lucide-react'\n\ntype EmailRow = {\n  id: string\n  subject: string\n  forwardedByAddress: string\n  forwardedByName?: string\n  status: string\n  processingError?: string\n  receivedAt: string\n}\n\ntype EmailListResponse = {\n  items?: EmailRow[]\n  total?: number\n  page?: number\n  totalPages?: number\n}\n\nconst STATUS_COLORS: Record<string, string> = {\n  received: 'bg-blue-100 text-blue-800',\n  processing: 'bg-purple-100 text-purple-800',\n  processed: 'bg-green-100 text-green-800',\n  needs_review: 'bg-amber-100 text-amber-800',\n  failed: 'bg-red-100 text-red-800',\n}\n\nexport default function ProcessingLogPage() {\n  const t = useT()\n  const [items, setItems] = React.useState<EmailRow[]>([])\n  const [total, setTotal] = React.useState(0)\n  const [page, setPage] = React.useState(1)\n  const [pageSize] = React.useState(25)\n  const [statusFilter, setStatusFilter] = React.useState<string | undefined>()\n  const [isLoading, setIsLoading] = React.useState(true)\n  const [error, setError] = React.useState<string | null>(null)\n  const [retryingEmailId, setRetryingEmailId] = React.useState<string | null>(null)\n  const { runMutation } = useGuardedMutation<Record<string, unknown>>({\n    contextId: 'inbox-ops-log',\n  })\n\n  const loadEmails = React.useCallback(async () => {\n    setIsLoading(true)\n    setError(null)\n    const params = new URLSearchParams()\n    params.set('page', String(page))\n    params.set('pageSize', String(pageSize))\n    if (statusFilter) params.set('status', statusFilter)\n\n    try {\n      const result = await apiCall<EmailListResponse>(`/api/inbox_ops/emails?${params}`)\n      if (result?.ok && result.result?.items) {\n        setItems(result.result.items)\n        setTotal(result.result.total || 0)\n      } else {\n        setError(t('inbox_ops.log.load_failed', 'Failed to load processing log'))\n      }\n    } catch {\n      setError(t('inbox_ops.log.load_failed', 'Failed to load processing log'))\n    }\n    setIsLoading(false)\n  }, [page, pageSize, statusFilter, t])\n\n  React.useEffect(() => { loadEmails() }, [loadEmails])\n\n  const handleRetryEmail = React.useCallback(async (emailId: string) => {\n    setRetryingEmailId(emailId)\n    const result = await runMutation({\n      operation: () => apiCall<{ ok: boolean; error?: string }>(\n        `/api/inbox_ops/emails/${emailId}/reprocess`,\n        { method: 'POST' },\n      ),\n      context: {},\n    })\n\n    if (result?.ok && result.result?.ok) {\n      flash(t('inbox_ops.flash.reprocessing_started', 'Reprocessing started'), 'success')\n      await loadEmails()\n    } else {\n      flash(result?.result?.error || t('inbox_ops.extraction_failed', 'Extraction failed'), 'error')\n    }\n\n    setRetryingEmailId(null)\n  }, [loadEmails, t, runMutation])\n\n  const columns: ColumnDef<EmailRow>[] = React.useMemo(() => [\n    {\n      accessorKey: 'subject',\n      header: t('inbox_ops.log.subject', 'Subject'),\n      cell: ({ row }) => (\n        <span className=\"text-sm font-medium truncate max-w-[300px] block\">{row.original.subject}</span>\n      ),\n    },\n    {\n      accessorKey: 'forwardedByAddress',\n      header: t('inbox_ops.log.from', 'From'),\n      cell: ({ row }) => (\n        <span className=\"text-sm text-muted-foreground truncate max-w-[200px] block\">\n          {row.original.forwardedByName || row.original.forwardedByAddress}\n        </span>\n      ),\n    },\n    {\n      accessorKey: 'status',\n      header: t('inbox_ops.log.status', 'Status'),\n      cell: ({ row }) => {\n        const statusLabels: Record<string, string> = {\n          received: t('inbox_ops.log.tab_received', 'Received'),\n          processing: t('inbox_ops.log.tab_processing', 'Processing'),\n          processed: t('inbox_ops.log.tab_processed', 'Processed'),\n          needs_review: t('inbox_ops.log.tab_needs_review', 'Needs Review'),\n          failed: t('inbox_ops.log.tab_failed', 'Failed'),\n        }\n        const color = STATUS_COLORS[row.original.status] || 'bg-gray-100 text-gray-800'\n        const label = statusLabels[row.original.status] || row.original.status\n        return <span className={`inline-flex items-center px-2 py-0.5 rounded text-xs font-medium ${color}`}>{label}</span>\n      },\n    },\n    {\n      accessorKey: 'receivedAt',\n      header: t('inbox_ops.received_at', 'Received'),\n      cell: ({ row }) => {\n        const d = new Date(row.original.receivedAt)\n        return <span className=\"text-sm text-muted-foreground\">{d.toLocaleDateString()} {d.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}</span>\n      },\n    },\n    {\n      accessorKey: 'processingError',\n      header: t('inbox_ops.extraction_failed', 'Error'),\n      cell: ({ row }) => (\n        <span className=\"text-xs text-red-600 truncate max-w-[280px] block\">\n          {row.original.processingError || '-'}\n        </span>\n      ),\n    },\n    {\n      id: 'actions',\n      header: t('ui.actions.actions', 'Actions'),\n      cell: ({ row }) => {\n        const canRetry = row.original.status === 'failed' || row.original.status === 'needs_review'\n        if (!canRetry) {\n          return <span className=\"text-xs text-muted-foreground\">-</span>\n        }\n\n        const isRetrying = retryingEmailId === row.original.id\n        return (\n          <Button\n            type=\"button\"\n            variant=\"outline\"\n            size=\"sm\"\n            className=\"h-8\"\n            disabled={isRetrying}\n            onClick={() => handleRetryEmail(row.original.id)}\n          >\n            <RefreshCw className={`h-3.5 w-3.5 mr-1 ${isRetrying ? 'animate-spin' : ''}`} />\n            {t('inbox_ops.action.retry', 'Retry')}\n          </Button>\n        )\n      },\n    },\n  ], [handleRetryEmail, retryingEmailId, t])\n\n  const tabs = [\n    { label: t('inbox_ops.log.tab_all', 'All'), value: undefined },\n    { label: t('inbox_ops.log.tab_received', 'Received'), value: 'received' },\n    { label: t('inbox_ops.log.tab_processing', 'Processing'), value: 'processing' },\n    { label: t('inbox_ops.log.tab_processed', 'Processed'), value: 'processed' },\n    { label: t('inbox_ops.log.tab_needs_review', 'Needs Review'), value: 'needs_review' },\n    { label: t('inbox_ops.log.tab_failed', 'Failed'), value: 'failed' },\n  ]\n\n  return (\n    <Page>\n      <div className=\"flex items-center gap-3 px-3 py-3 md:px-6 md:py-4\">\n        <Link href=\"/backend/inbox-ops\">\n          <Button type=\"button\" variant=\"ghost\" size=\"sm\"><ArrowLeft className=\"h-4 w-4\" /></Button>\n        </Link>\n        <h1 className=\"text-lg font-semibold\">{t('inbox_ops.processing_log', 'Processing Log')}</h1>\n      </div>\n\n      <PageBody>\n        <div className=\"flex items-center gap-2 px-3 py-2 md:px-0 overflow-x-auto\">\n          {tabs.map((tab) => (\n            <Button\n              type=\"button\"\n              key={tab.value ?? 'all'}\n              variant={statusFilter === tab.value ? 'default' : 'outline'}\n              size=\"sm\"\n              onClick={() => { setStatusFilter(tab.value); setPage(1) }}\n            >\n              {tab.label}\n            </Button>\n          ))}\n        </div>\n\n        {error ? (\n          <ErrorMessage label={error} />\n        ) : (\n        <div className=\"overflow-auto\">\n          <div className=\"min-w-[640px]\">\n            <DataTable\n              columns={columns}\n              data={items}\n              isLoading={isLoading}\n              pagination={{\n                page,\n                pageSize,\n                total,\n                totalPages: Math.ceil(total / pageSize),\n                onPageChange: setPage,\n              }}\n            />\n          </div>\n        </div>\n        )}\n      </PageBody>\n    </Page>\n  )\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/modules/inbox_ops/backend/inbox-ops/log/page.meta.js

@@ -3,12 +3,12 @@ const metadata = {
   requireFeatures: ["inbox_ops.log.view"],
   pageTitle: "Processing Log",
   pageTitleKey: "inbox_ops.nav.log",
-  pageGroup: "InboxOps",
+  pageGroup: "AI Inbox Actions",
   pageGroupKey: "inbox_ops.nav.group",
   pageOrder: 910,
   navHidden: true,
   breadcrumb: [
-    { label: "InboxOps", labelKey: "inbox_ops.nav.group", href: "/backend/inbox-ops" },
+    { label: "AI Inbox Actions", labelKey: "inbox_ops.nav.group", href: "/backend/inbox-ops" },
     { label: "Processing Log", labelKey: "inbox_ops.nav.log" }
   ]
 };

package/dist/modules/inbox_ops/backend/inbox-ops/log/page.meta.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/modules/inbox_ops/backend/inbox-ops/log/page.meta.ts"],
-  "sourcesContent": ["export const metadata = {\n  requireAuth: true,\n  requireFeatures: ['inbox_ops.log.view'],\n  pageTitle: 'Processing Log',\n  pageTitleKey: 'inbox_ops.nav.log',\n  pageGroup: 'InboxOps',\n  pageGroupKey: 'inbox_ops.nav.group',\n  pageOrder: 910,\n  navHidden: true,\n  breadcrumb: [\n    { label: 'InboxOps', labelKey: 'inbox_ops.nav.group', href: '/backend/inbox-ops' },\n    { label: 'Processing Log', labelKey: 'inbox_ops.nav.log' },\n  ],\n}\n"],
-  "mappings": "AAAO,MAAM,WAAW;AAAA,EACtB,aAAa;AAAA,EACb,iBAAiB,CAAC,oBAAoB;AAAA,EACtC,WAAW;AAAA,EACX,cAAc;AAAA,EACd,WAAW;AAAA,EACX,cAAc;AAAA,EACd,WAAW;AAAA,EACX,WAAW;AAAA,EACX,YAAY;AAAA,IACV,EAAE,OAAO,YAAY,UAAU,uBAAuB,MAAM,qBAAqB;AAAA,IACjF,EAAE,OAAO,kBAAkB,UAAU,oBAAoB;AAAA,EAC3D;AACF;",
+  "sourcesContent": ["export const metadata = {\n  requireAuth: true,\n  requireFeatures: ['inbox_ops.log.view'],\n  pageTitle: 'Processing Log',\n  pageTitleKey: 'inbox_ops.nav.log',\n  pageGroup: 'AI Inbox Actions',\n  pageGroupKey: 'inbox_ops.nav.group',\n  pageOrder: 910,\n  navHidden: true,\n  breadcrumb: [\n    { label: 'AI Inbox Actions', labelKey: 'inbox_ops.nav.group', href: '/backend/inbox-ops' },\n    { label: 'Processing Log', labelKey: 'inbox_ops.nav.log' },\n  ],\n}\n"],
+  "mappings": "AAAO,MAAM,WAAW;AAAA,EACtB,aAAa;AAAA,EACb,iBAAiB,CAAC,oBAAoB;AAAA,EACtC,WAAW;AAAA,EACX,cAAc;AAAA,EACd,WAAW;AAAA,EACX,cAAc;AAAA,EACd,WAAW;AAAA,EACX,WAAW;AAAA,EACX,YAAY;AAAA,IACV,EAAE,OAAO,oBAAoB,UAAU,uBAAuB,MAAM,qBAAqB;AAAA,IACzF,EAAE,OAAO,kBAAkB,UAAU,oBAAoB;AAAA,EAC3D;AACF;",
   "names": []
 }

package/dist/modules/inbox_ops/backend/inbox-ops/page.js

@@ -1,14 +1,19 @@
 "use client";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import Link from "next/link";
 import { useRouter } from "next/navigation";
 import { Page, PageBody } from "@open-mercato/ui/backend/Page";
 import { DataTable } from "@open-mercato/ui/backend/DataTable";
+import { RowActions } from "@open-mercato/ui/backend/RowActions";
 import { Button } from "@open-mercato/ui/primitives/button";
 import { apiCall } from "@open-mercato/ui/backend/utils/apiCall";
+import { flash } from "@open-mercato/ui/backend/FlashMessages";
 import { useT } from "@open-mercato/shared/lib/i18n/context";
 import { useOrganizationScopeVersion } from "@open-mercato/shared/lib/frontend/useOrganizationScope";
+import { useConfirmDialog } from "@open-mercato/ui/backend/confirm-dialog";
+import { useGuardedMutation } from "@open-mercato/ui/backend/injection/useGuardedMutation";
+import { ErrorMessage } from "@open-mercato/ui/backend/detail";
 import { Settings, Inbox, Copy } from "lucide-react";
 const STATUS_COLORS = {
   pending: "bg-yellow-100 text-yellow-800",
@@ -42,30 +47,44 @@ function InboxOpsProposalsPage() {
   const t = useT();
   const router = useRouter();
   const scopeVersion = useOrganizationScopeVersion();
+  const { confirm, ConfirmDialogElement } = useConfirmDialog();
+  const { runMutation } = useGuardedMutation({
+    contextId: "inbox-ops-proposals"
+  });
   const [items, setItems] = React.useState([]);
   const [total, setTotal] = React.useState(0);
   const [page, setPage] = React.useState(1);
   const [pageSize] = React.useState(25);
-  const [statusFilter, setStatusFilter] = React.useState();
+  const [filterValues, setFilterValues] = React.useState({});
   const [search, setSearch] = React.useState("");
   const [isLoading, setIsLoading] = React.useState(true);
+  const [error, setError] = React.useState(null);
+  const [initialLoadComplete, setInitialLoadComplete] = React.useState(false);
   const [counts, setCounts] = React.useState({ pending: 0, partial: 0, accepted: 0, rejected: 0 });
   const [settings, setSettings] = React.useState(null);
   const [copied, setCopied] = React.useState(false);
+  const statusFilter = typeof filterValues.status === "string" ? filterValues.status : void 0;
   const loadProposals = React.useCallback(async () => {
     setIsLoading(true);
+    setError(null);
     const params = new URLSearchParams();
     params.set("page", String(page));
     params.set("pageSize", String(pageSize));
     if (statusFilter) params.set("status", statusFilter);
-    if (search) params.set("search", search);
-    const result = await apiCall(`/api/inbox_ops/proposals?${params}`);
-    if (result?.ok && result.result?.items) {
-      setItems(result.result.items);
-      setTotal(result.result.total || 0);
+    if (search.trim()) params.set("search", search.trim());
+    try {
+      const result = await apiCall(`/api/inbox_ops/proposals?${params}`);
+      if (result?.ok && result.result?.items) {
+        setItems(result.result.items);
+        setTotal(result.result.total || 0);
+      } else {
+        setError(t("inbox_ops.flash.load_failed", "Failed to load proposals"));
+      }
+    } catch {
+      setError(t("inbox_ops.flash.load_failed", "Failed to load proposals"));
     }
     setIsLoading(false);
-  }, [page, pageSize, statusFilter, search, scopeVersion]);
+  }, [page, pageSize, statusFilter, search, scopeVersion, t]);
   const loadCounts = React.useCallback(async () => {
     const result = await apiCall("/api/inbox_ops/proposals/counts");
     if (result?.ok && result.result) setCounts(result.result);
@@ -75,10 +94,13 @@ function InboxOpsProposalsPage() {
     if (result?.ok && result.result?.settings) setSettings(result.result.settings);
   }, [scopeVersion]);
   React.useEffect(() => {
-    loadProposals();
-    loadCounts();
-    loadSettings();
-  }, [loadProposals, loadCounts, loadSettings]);
+    Promise.all([loadProposals(), loadCounts(), loadSettings()]).then(() => {
+      setInitialLoadComplete(true);
+    });
+  }, []);
+  React.useEffect(() => {
+    if (initialLoadComplete) loadProposals();
+  }, [page, statusFilter, search, scopeVersion]);
   const handleCopyAddress = React.useCallback(() => {
     if (settings?.inboxAddress) {
       navigator.clipboard.writeText(settings.inboxAddress);
@@ -86,6 +108,52 @@ function InboxOpsProposalsPage() {
       setTimeout(() => setCopied(false), 2e3);
     }
   }, [settings]);
+  const handleRefresh = React.useCallback(() => {
+    loadProposals();
+    loadCounts();
+  }, [loadProposals, loadCounts]);
+  const handleFiltersApply = React.useCallback((values) => {
+    setFilterValues(values);
+    setPage(1);
+  }, []);
+  const handleFiltersClear = React.useCallback(() => {
+    setFilterValues({});
+    setPage(1);
+  }, []);
+  const handleRejectProposal = React.useCallback(async (proposalId) => {
+    const confirmed = await confirm({
+      title: t("inbox_ops.action.reject_all", "Reject Proposal"),
+      text: t("inbox_ops.action.reject_all_confirm", "Reject all pending actions in this proposal?")
+    });
+    if (!confirmed) return;
+    const result = await runMutation({
+      operation: () => apiCall(
+        `/api/inbox_ops/proposals/${proposalId}/reject`,
+        { method: "POST" }
+      ),
+      context: {}
+    });
+    if (result?.ok && result.result?.ok) {
+      flash(t("inbox_ops.action.proposal_rejected", "Proposal rejected"), "success");
+      loadProposals();
+      loadCounts();
+    } else {
+      flash(t("inbox_ops.flash.action_reject_failed", "Failed to reject"), "error");
+    }
+  }, [confirm, t, loadProposals, loadCounts, runMutation]);
+  const filters = React.useMemo(() => [
+    {
+      id: "status",
+      label: t("inbox_ops.list.filters.status", "Status"),
+      type: "select",
+      options: [
+        { value: "pending", label: `${t("inbox_ops.status.pending", "Pending")} (${counts.pending})` },
+        { value: "partial", label: `${t("inbox_ops.status.partial", "Partial")} (${counts.partial})` },
+        { value: "accepted", label: `${t("inbox_ops.status.accepted", "Accepted")} (${counts.accepted})` },
+        { value: "rejected", label: `${t("inbox_ops.status.rejected", "Rejected")} (${counts.rejected})` }
+      ]
+    }
+  ], [t, counts]);
   const columns = React.useMemo(() => [
     {
       accessorKey: "summary",
@@ -109,7 +177,7 @@ function InboxOpsProposalsPage() {
     },
     {
       id: "actions_count",
-      header: t("inbox_ops.actions_count", "Actions"),
+      header: t("inbox_ops.list.progress", "Progress"),
       cell: ({ row }) => {
         const pending = row.original.pendingActionCount ?? 0;
         const total2 = row.original.actionCount ?? 0;
@@ -137,77 +205,91 @@ function InboxOpsProposalsPage() {
     }
   ], [t]);
   const totalCount = counts.pending + counts.partial + counts.accepted + counts.rejected;
-  const isEmpty = totalCount === 0 && !isLoading;
-  const tabs = [
-    { label: `${t("common.all", "All")} (${totalCount})`, value: void 0 },
-    { label: `${t("inbox_ops.status.pending", "Pending")} (${counts.pending})`, value: "pending" },
-    { label: `${t("inbox_ops.status.partial", "Partial")} (${counts.partial})`, value: "partial" },
-    { label: `${t("inbox_ops.status.accepted", "Accepted")} (${counts.accepted})`, value: "accepted" },
-    { label: `${t("inbox_ops.status.rejected", "Rejected")} (${counts.rejected})`, value: "rejected" }
-  ];
-  return /* @__PURE__ */ jsxs(Page, { children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-3 py-3 md:px-6 md:py-4", children: [
-      /* @__PURE__ */ jsx("h1", { className: "text-lg font-semibold", children: t("inbox_ops.title", "InboxOps") }),
-      /* @__PURE__ */ jsx(Link, { href: "/backend/inbox-ops/settings", children: /* @__PURE__ */ jsxs(Button, { variant: "outline", size: "sm", children: [
-        /* @__PURE__ */ jsx(Settings, { className: "h-4 w-4" }),
-        /* @__PURE__ */ jsx("span", { className: "hidden md:inline ml-1", children: t("inbox_ops.settings.title", "Settings") })
-      ] }) })
+  const emptyStateContent = initialLoadComplete && totalCount === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center py-16 text-center", children: [
+    /* @__PURE__ */ jsx(Inbox, { className: "h-12 w-12 text-muted-foreground mb-4" }),
+    /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold mb-2", children: t("inbox_ops.empty.title", "Forward emails to start") }),
+    settings?.inboxAddress && /* @__PURE__ */ jsxs("div", { className: "mt-4 flex items-center gap-2 bg-muted rounded-lg px-4 py-3", children: [
+      /* @__PURE__ */ jsx("code", { className: "text-sm font-mono", children: settings.inboxAddress }),
+      /* @__PURE__ */ jsxs(Button, { type: "button", variant: "outline", size: "sm", onClick: handleCopyAddress, children: [
+        /* @__PURE__ */ jsx(Copy, { className: "h-4 w-4" }),
+        copied ? t("inbox_ops.settings.copied", "Copied") : t("inbox_ops.settings.copy", "Copy")
+      ] })
     ] }),
-    /* @__PURE__ */ jsx(PageBody, { children: isEmpty ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center py-16 text-center", children: [
-      /* @__PURE__ */ jsx(Inbox, { className: "h-12 w-12 text-muted-foreground mb-4" }),
-      /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold mb-2", children: t("inbox_ops.empty.title", "Forward emails to start") }),
-      settings?.inboxAddress && /* @__PURE__ */ jsxs("div", { className: "mt-4 flex items-center gap-2 bg-muted rounded-lg px-4 py-3", children: [
-        /* @__PURE__ */ jsx("code", { className: "text-sm font-mono", children: settings.inboxAddress }),
-        /* @__PURE__ */ jsxs(Button, { variant: "outline", size: "sm", onClick: handleCopyAddress, children: [
-          /* @__PURE__ */ jsx(Copy, { className: "h-4 w-4" }),
-          copied ? t("inbox_ops.settings.copied", "Copied") : t("inbox_ops.settings.copy", "Copy")
-        ] })
+    /* @__PURE__ */ jsxs("ol", { className: "mt-6 text-sm text-muted-foreground text-left space-y-2", children: [
+      /* @__PURE__ */ jsxs("li", { children: [
+        "1. ",
+        t("inbox_ops.empty.step1", "Forward any email thread to this address")
       ] }),
-      /* @__PURE__ */ jsxs("ol", { className: "mt-6 text-sm text-muted-foreground text-left space-y-2", children: [
-        /* @__PURE__ */ jsxs("li", { children: [
-          "1. ",
-          t("inbox_ops.empty.step1", "Forward any email thread to this address")
-        ] }),
-        /* @__PURE__ */ jsxs("li", { children: [
-          "2. ",
-          t("inbox_ops.empty.step2", "We'll analyze it and propose actions")
-        ] }),
-        /* @__PURE__ */ jsxs("li", { children: [
-          "3. ",
-          t("inbox_ops.empty.step3", "Review and accept with one click")
-        ] })
+      /* @__PURE__ */ jsxs("li", { children: [
+        "2. ",
+        t("inbox_ops.empty.step2", "We'll analyze it and propose actions")
+      ] }),
+      /* @__PURE__ */ jsxs("li", { children: [
+        "3. ",
+        t("inbox_ops.empty.step3", "Review and accept with one click")
       ] })
-    ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 px-3 py-2 md:px-0 overflow-x-auto", children: tabs.map((tab) => /* @__PURE__ */ jsx(
-        Button,
-        {
-          variant: statusFilter === tab.value ? "default" : "outline",
-          size: "sm",
-          onClick: () => {
-            setStatusFilter(tab.value);
-            setPage(1);
+    ] })
+  ] }) : void 0;
+  if (error && !initialLoadComplete) {
+    return /* @__PURE__ */ jsx(Page, { children: /* @__PURE__ */ jsx(PageBody, { children: /* @__PURE__ */ jsx(ErrorMessage, { label: error }) }) });
+  }
+  return /* @__PURE__ */ jsxs(Page, { children: [
+    /* @__PURE__ */ jsx(PageBody, { children: /* @__PURE__ */ jsx(
+      DataTable,
+      {
+        title: t("inbox_ops.title", "AI Inbox Actions"),
+        refreshButton: {
+          label: t("inbox_ops.list.actions.refresh", "Refresh"),
+          onRefresh: handleRefresh
+        },
+        actions: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          settings?.inboxAddress && /* @__PURE__ */ jsxs(Button, { type: "button", variant: "outline", size: "sm", onClick: handleCopyAddress, children: [
+            /* @__PURE__ */ jsx(Copy, { className: "h-4 w-4" }),
+            /* @__PURE__ */ jsx("span", { className: "hidden md:inline ml-1", children: copied ? t("inbox_ops.settings.copied", "Copied") : t("inbox_ops.settings.copy", "Copy") })
+          ] }),
+          /* @__PURE__ */ jsx(Button, { variant: "outline", size: "sm", asChild: true, children: /* @__PURE__ */ jsxs(Link, { href: "/backend/inbox-ops/settings", children: [
+            /* @__PURE__ */ jsx(Settings, { className: "h-4 w-4" }),
+            /* @__PURE__ */ jsx("span", { className: "hidden md:inline ml-1", children: t("inbox_ops.list.actions.settings", "Settings") })
+          ] }) })
+        ] }),
+        columns,
+        data: items,
+        searchValue: search,
+        onSearchChange: (value) => {
+          setSearch(value);
+          setPage(1);
+        },
+        searchPlaceholder: t("inbox_ops.list.searchPlaceholder", "Search proposals..."),
+        filters,
+        filterValues,
+        onFiltersApply: handleFiltersApply,
+        onFiltersClear: handleFiltersClear,
+        onRowClick: (row) => router.push(`/backend/inbox-ops/proposals/${row.id}`),
+        rowActions: (row) => /* @__PURE__ */ jsx(RowActions, { items: [
+          {
+            id: "view",
+            label: t("inbox_ops.list.actions.view", "View"),
+            onSelect: () => router.push(`/backend/inbox-ops/proposals/${row.id}`)
           },
-          children: tab.label
+          ...row.status === "pending" || row.status === "partial" ? [{
+            id: "reject",
+            label: t("inbox_ops.list.actions.reject", "Reject"),
+            destructive: true,
+            onSelect: () => handleRejectProposal(row.id)
+          }] : []
+        ] }),
+        pagination: {
+          page,
+          pageSize,
+          total,
+          totalPages: Math.ceil(total / pageSize),
+          onPageChange: setPage
         },
-        tab.value ?? "all"
-      )) }),
-      /* @__PURE__ */ jsx("div", { className: "overflow-auto", children: /* @__PURE__ */ jsx("div", { className: "min-w-[640px]", children: /* @__PURE__ */ jsx(
-        DataTable,
-        {
-          columns,
-          data: items,
-          isLoading,
-          onRowClick: (row) => router.push(`/backend/inbox-ops/proposals/${row.id}`),
-          pagination: {
-            page,
-            pageSize,
-            total,
-            totalPages: Math.ceil(total / pageSize),
-            onPageChange: setPage
-          }
-        }
-      ) }) })
-    ] }) })
+        isLoading,
+        emptyState: emptyStateContent
+      }
+    ) }),
+    ConfirmDialogElement
   ] });
 }
 export {