@purposeinplay/payload-ai-translate 0.1.0

package/dist/views/TranslationHub/AdvancedPanel.js

@@ -0,0 +1,996 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+const SECTION_STYLE = {
+    background: 'var(--theme-elevation-50)',
+    border: '1px solid var(--theme-elevation-150)',
+    borderRadius: '6px',
+    padding: '1rem 1.25rem'
+};
+const CARD_STYLE = {
+    flex: 1,
+    minWidth: '140px',
+    padding: '0.75rem 1rem',
+    background: 'var(--theme-elevation-50)',
+    border: '1px solid var(--theme-elevation-150)',
+    borderRadius: '6px'
+};
+const LABEL_STYLE = {
+    fontSize: '0.7rem',
+    fontWeight: 600,
+    textTransform: 'uppercase',
+    letterSpacing: '0.05em',
+    color: 'var(--theme-elevation-500)'
+};
+const VALUE_STYLE = {
+    fontSize: '1.5rem',
+    fontWeight: 600,
+    marginTop: '0.25rem',
+    color: 'var(--theme-elevation-1000)'
+};
+const SUBVALUE_STYLE = {
+    fontSize: '0.7rem',
+    color: 'var(--theme-elevation-500)',
+    marginTop: '0.15rem'
+};
+function fmtNum(n) {
+    if (n == null) {
+        return '—';
+    }
+    if (n >= 1_000_000) {
+        return `${(n / 1_000_000).toFixed(1)}M`;
+    }
+    if (n >= 1000) {
+        return `${(n / 1000).toFixed(1)}K`;
+    }
+    return n.toString();
+}
+const FlagBadge = ({ value, onLabel, offLabel })=>{
+    if (value === null) {
+        return /*#__PURE__*/ _jsx(_Fragment, {
+            children: "—"
+        });
+    }
+    if (value) {
+        return /*#__PURE__*/ _jsx("span", {
+            style: {
+                color: 'var(--theme-success-500)'
+            },
+            children: onLabel
+        });
+    }
+    return /*#__PURE__*/ _jsx("span", {
+        style: {
+            color: 'var(--theme-elevation-500)'
+        },
+        children: offLabel
+    });
+};
+export const AdvancedPanel = ({ basePath })=>{
+    const [counts, setCounts] = useState({
+        usageRows: null,
+        alertsTotal: null,
+        alertsOpen: null,
+        jobsRunning: null,
+        jobsStaleCandidate: null,
+        metaRows: null
+    });
+    const [config, setConfig] = useState(null);
+    const [flags, setFlags] = useState({
+        usageTracking: null,
+        preserveManualEdits: null,
+        persistJobs: null,
+        alertsPersistence: null
+    });
+    const [error, setError] = useState(null);
+    const [refreshTick, setRefreshTick] = useState(0);
+    // HUB-7 (v1.2.6): inline force-reset for stale ai-translate-jobs rows.
+    // The "View stale jobs →" link was the only affordance — admins had
+    // to navigate, multi-select, and bulk-delete. This button calls
+    // DELETE /api/ai-translate-jobs with a `where` filter matching the
+    // same `status=running AND createdAt < now-5min` predicate used to
+    // compute `jobsStaleCandidate`. Two-step confirm because the action
+    // is destructive (deletes rows that COULD still be in flight on a
+    // healthy worker, just over the 5-min threshold).
+    const [resetState, setResetState] = useState({
+        kind: 'idle'
+    });
+    async function forceResetStaleJobs() {
+        setResetState({
+            kind: 'resetting'
+        });
+        const fiveMinAgo = new Date(Date.now() - 5 * 60 * 1000).toISOString();
+        const query = new URLSearchParams();
+        query.set('where[status][equals]', 'running');
+        query.set('where[createdAt][less_than]', fiveMinAgo);
+        try {
+            const res = await fetch(`${basePath}/api/ai-translate-jobs?${query.toString()}`, {
+                method: 'DELETE',
+                credentials: 'include'
+            });
+            if (!res.ok) {
+                const text = await res.text();
+                throw new Error(`HTTP ${res.status}: ${text.slice(0, 200)}`);
+            }
+            const body = await res.json().catch(()=>null);
+            const deleted = Array.isArray(body?.docs) ? body.docs.length : 0;
+            setResetState({
+                kind: 'done',
+                deleted
+            });
+            // Refresh counters so the warning banner clears.
+            setRefreshTick((n)=>n + 1);
+        } catch (e) {
+            setResetState({
+                kind: 'error',
+                message: e instanceof Error ? e.message : String(e)
+            });
+        }
+    }
+    useEffect(()=>{
+        let cancelled = false;
+        setError(null);
+        // Use limit=0 + depth=0 to fetch only `totalDocs` — Payload returns
+        // it on every list response and we don't actually need the rows.
+        const fifteenMinAgo = new Date(Date.now() - 15 * 60 * 1000).toISOString();
+        const fiveMinAgo = new Date(Date.now() - 5 * 60 * 1000).toISOString();
+        const queries = [
+            [
+                'usageRows',
+                `${basePath}/api/translation-usage?limit=0&depth=0`
+            ],
+            [
+                'alertsTotal',
+                `${basePath}/api/translation-alerts?limit=0&depth=0`
+            ],
+            [
+                'alertsOpen',
+                `${basePath}/api/translation-alerts?limit=0&depth=0&where[dismissed][equals]=false`
+            ],
+            [
+                'jobsRunning',
+                `${basePath}/api/ai-translate-jobs?limit=0&depth=0&where[status][equals]=running&where[createdAt][greater_than]=${encodeURIComponent(fifteenMinAgo)}`
+            ],
+            [
+                'jobsStaleCandidate',
+                `${basePath}/api/ai-translate-jobs?limit=0&depth=0&where[status][equals]=running&where[createdAt][less_than]=${encodeURIComponent(fiveMinAgo)}`
+            ],
+            [
+                'metaRows',
+                `${basePath}/api/ai-translate-meta?limit=0&depth=0`
+            ]
+        ];
+        Promise.all(queries.map(([key, url])=>fetch(url, {
+                credentials: 'include'
+            }).then(async (r)=>{
+                if (!r.ok) {
+                    throw new Error(`${key}: HTTP ${r.status}`);
+                }
+                const d = await r.json();
+                return [
+                    key,
+                    d.totalDocs ?? null
+                ];
+            }).catch((e)=>{
+                if (!cancelled) {
+                    const msg = e instanceof Error ? e.message : String(e);
+                    setError(`Failed to load diagnostics — ${msg}`);
+                }
+                return [
+                    key,
+                    null
+                ];
+            }))).then((entries)=>{
+            if (cancelled) {
+                return;
+            }
+            setCounts((prev)=>{
+                const next = {
+                    ...prev
+                };
+                for (const [key, value] of entries){
+                    next[key] = value;
+                }
+                return next;
+            });
+        });
+        // Client-config endpoint returns locale + translatable field map.
+        fetch(`${basePath}/api/ai-translate/client-config`, {
+            credentials: 'include'
+        }).then(async (r)=>{
+            if (!r.ok) {
+                return null;
+            }
+            return await r.json();
+        }).then((cfg)=>{
+            if (cancelled) {
+                return;
+            }
+            if (cfg) {
+                setConfig(cfg);
+            }
+        }).catch(()=>{
+        // Endpoint optional — render falls back to "—".
+        });
+        // Feature-flag probe: each plugin-owned collection only registers
+        // when the matching feature is enabled. A 404 = feature off; a 200
+        // or 403 (access-denied for non-admin) = collection exists =
+        // feature on. Cheaper than parsing server config and survives the
+        // plugin not exposing flags via client-config.
+        const probe = (path)=>fetch(`${basePath}${path}?limit=0&depth=0`, {
+                credentials: 'include'
+            }).then((r)=>r.status !== 404).catch(()=>null);
+        Promise.all([
+            probe('/api/translation-usage'),
+            probe('/api/ai-translate-meta'),
+            probe('/api/ai-translate-jobs'),
+            probe('/api/translation-alerts')
+        ]).then(([usage, meta, jobs, alerts])=>{
+            if (cancelled) {
+                return;
+            }
+            setFlags({
+                usageTracking: usage,
+                preserveManualEdits: meta,
+                persistJobs: jobs,
+                alertsPersistence: alerts
+            });
+        });
+        return ()=>{
+            cancelled = true;
+        };
+    }, [
+        basePath,
+        refreshTick
+    ]);
+    return /*#__PURE__*/ _jsxs("div", {
+        style: {
+            display: 'flex',
+            flexDirection: 'column',
+            gap: '1rem'
+        },
+        children: [
+            error && /*#__PURE__*/ _jsx("div", {
+                style: {
+                    ...SECTION_STYLE,
+                    background: 'var(--theme-error-100, #fee2e2)',
+                    color: 'var(--theme-error-500, #b91c1c)',
+                    fontSize: '0.875rem'
+                },
+                children: error
+            }),
+            /*#__PURE__*/ _jsxs("section", {
+                style: SECTION_STYLE,
+                children: [
+                    /*#__PURE__*/ _jsxs("div", {
+                        style: {
+                            display: 'flex',
+                            alignItems: 'center',
+                            justifyContent: 'space-between',
+                            marginBottom: '0.5rem'
+                        },
+                        children: [
+                            /*#__PURE__*/ _jsx("h3", {
+                                style: {
+                                    margin: 0,
+                                    fontSize: '0.95rem',
+                                    color: 'var(--theme-elevation-1000)'
+                                },
+                                children: "Plugin configuration"
+                            }),
+                            /*#__PURE__*/ _jsx("button", {
+                                onClick: ()=>setRefreshTick((n)=>n + 1),
+                                style: {
+                                    padding: '0.25rem 0.7rem',
+                                    background: 'transparent',
+                                    border: '1px solid var(--theme-elevation-150)',
+                                    borderRadius: '4px',
+                                    fontSize: '0.75rem',
+                                    cursor: 'pointer',
+                                    color: 'var(--theme-elevation-700)'
+                                },
+                                type: "button",
+                                children: "↻ Refresh"
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs("div", {
+                        style: {
+                            display: 'flex',
+                            flexWrap: 'wrap',
+                            gap: '1.5rem',
+                            fontSize: '0.85rem'
+                        },
+                        children: [
+                            /*#__PURE__*/ _jsxs("div", {
+                                children: [
+                                    /*#__PURE__*/ _jsx("span", {
+                                        style: LABEL_STYLE,
+                                        children: "Source locale"
+                                    }),
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: {
+                                            marginTop: '0.15rem',
+                                            fontFamily: 'monospace'
+                                        },
+                                        children: config?.sourceLocale ?? '—'
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsxs("div", {
+                                children: [
+                                    /*#__PURE__*/ _jsx("span", {
+                                        style: LABEL_STYLE,
+                                        children: "Target locales"
+                                    }),
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: {
+                                            marginTop: '0.15rem',
+                                            fontFamily: 'monospace'
+                                        },
+                                        children: config?.targetLocales?.length ? config.targetLocales.join(', ') : '—'
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsxs("div", {
+                                children: [
+                                    /*#__PURE__*/ _jsx("span", {
+                                        style: LABEL_STYLE,
+                                        children: "Translatable surfaces"
+                                    }),
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: {
+                                            marginTop: '0.15rem'
+                                        },
+                                        children: config?.translatableFieldsBySlug ? `${Object.keys(config.translatableFieldsBySlug).length} collections / globals` : '—'
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsxs("div", {
+                                children: [
+                                    /*#__PURE__*/ _jsx("span", {
+                                        style: LABEL_STYLE,
+                                        children: "Per-field button"
+                                    }),
+                                    /*#__PURE__*/ _jsxs("div", {
+                                        style: {
+                                            marginTop: '0.15rem'
+                                        },
+                                        children: [
+                                            config && /*#__PURE__*/ _jsx(FlagBadge, {
+                                                offLabel: "off",
+                                                onLabel: "enabled",
+                                                value: config.perFieldButton ?? false
+                                            }),
+                                            !config && '—'
+                                        ]
+                                    })
+                                ]
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs("div", {
+                        style: {
+                            display: 'flex',
+                            flexWrap: 'wrap',
+                            gap: '1.5rem',
+                            fontSize: '0.85rem',
+                            marginTop: '1rem',
+                            paddingTop: '0.75rem',
+                            borderTop: '1px solid var(--theme-elevation-150)'
+                        },
+                        children: [
+                            /*#__PURE__*/ _jsxs("div", {
+                                children: [
+                                    /*#__PURE__*/ _jsx("span", {
+                                        style: LABEL_STYLE,
+                                        children: "Usage tracking"
+                                    }),
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: {
+                                            marginTop: '0.15rem'
+                                        },
+                                        children: /*#__PURE__*/ _jsx(FlagBadge, {
+                                            offLabel: "disabled",
+                                            onLabel: "enabled",
+                                            value: flags.usageTracking
+                                        })
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsxs("div", {
+                                children: [
+                                    /*#__PURE__*/ _jsx("span", {
+                                        style: LABEL_STYLE,
+                                        children: "Manual-edit guard"
+                                    }),
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: {
+                                            marginTop: '0.15rem'
+                                        },
+                                        children: /*#__PURE__*/ _jsx(FlagBadge, {
+                                            offLabel: "off",
+                                            onLabel: "active",
+                                            value: flags.preserveManualEdits
+                                        })
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsxs("div", {
+                                children: [
+                                    /*#__PURE__*/ _jsx("span", {
+                                        style: LABEL_STYLE,
+                                        children: "Persist jobs"
+                                    }),
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: {
+                                            marginTop: '0.15rem'
+                                        },
+                                        children: /*#__PURE__*/ _jsx(FlagBadge, {
+                                            offLabel: "disabled",
+                                            onLabel: "enabled",
+                                            value: flags.persistJobs
+                                        })
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsxs("div", {
+                                children: [
+                                    /*#__PURE__*/ _jsx("span", {
+                                        style: LABEL_STYLE,
+                                        children: "Alerts persistence"
+                                    }),
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: {
+                                            marginTop: '0.15rem'
+                                        },
+                                        children: /*#__PURE__*/ _jsx(FlagBadge, {
+                                            offLabel: "disabled",
+                                            onLabel: "enabled",
+                                            value: flags.alertsPersistence
+                                        })
+                                    })
+                                ]
+                            })
+                        ]
+                    })
+                ]
+            }),
+            config?.translatableFieldsBySlug && Object.keys(config.translatableFieldsBySlug).length > 0 && /*#__PURE__*/ _jsxs("section", {
+                style: SECTION_STYLE,
+                children: [
+                    /*#__PURE__*/ _jsx("h3", {
+                        style: {
+                            margin: '0 0 0.5rem',
+                            fontSize: '0.95rem',
+                            color: 'var(--theme-elevation-1000)'
+                        },
+                        children: "Translatable fields per surface"
+                    }),
+                    /*#__PURE__*/ _jsx("p", {
+                        style: {
+                            margin: '0 0 0.75rem',
+                            fontSize: '0.75rem',
+                            color: 'var(--theme-elevation-500)'
+                        },
+                        children: 'Field paths the plugin recognises as translatable for each collection / global. Excluded paths from per-collection overrides are NOT shown here — this is the pre-exclusion set. Surfaces flagged "Excluded from bulk translate" are still translatable per-document via the Translate button but skipped by Bulk Translate runs.'
+                    }),
+                    /*#__PURE__*/ _jsx("div", {
+                        style: {
+                            overflowX: 'auto'
+                        },
+                        children: /*#__PURE__*/ _jsxs("table", {
+                            style: {
+                                width: '100%',
+                                borderCollapse: 'collapse',
+                                fontSize: '0.85rem'
+                            },
+                            children: [
+                                /*#__PURE__*/ _jsx("thead", {
+                                    children: /*#__PURE__*/ _jsxs("tr", {
+                                        children: [
+                                            /*#__PURE__*/ _jsx("th", {
+                                                style: {
+                                                    textAlign: 'left',
+                                                    padding: '0.4rem 0.5rem',
+                                                    fontSize: '0.7rem',
+                                                    fontWeight: 600,
+                                                    textTransform: 'uppercase',
+                                                    letterSpacing: '0.05em',
+                                                    color: 'var(--theme-elevation-500)',
+                                                    borderBottom: '1px solid var(--theme-elevation-150)'
+                                                },
+                                                children: "Surface"
+                                            }),
+                                            /*#__PURE__*/ _jsx("th", {
+                                                style: {
+                                                    textAlign: 'right',
+                                                    padding: '0.4rem 0.5rem',
+                                                    fontSize: '0.7rem',
+                                                    fontWeight: 600,
+                                                    textTransform: 'uppercase',
+                                                    letterSpacing: '0.05em',
+                                                    color: 'var(--theme-elevation-500)',
+                                                    borderBottom: '1px solid var(--theme-elevation-150)'
+                                                },
+                                                children: "Field count"
+                                            }),
+                                            /*#__PURE__*/ _jsx("th", {
+                                                style: {
+                                                    textAlign: 'left',
+                                                    padding: '0.4rem 0.5rem',
+                                                    fontSize: '0.7rem',
+                                                    fontWeight: 600,
+                                                    textTransform: 'uppercase',
+                                                    letterSpacing: '0.05em',
+                                                    color: 'var(--theme-elevation-500)',
+                                                    borderBottom: '1px solid var(--theme-elevation-150)'
+                                                },
+                                                children: "Paths"
+                                            })
+                                        ]
+                                    })
+                                }),
+                                /*#__PURE__*/ _jsx("tbody", {
+                                    children: Object.entries(config.translatableFieldsBySlug).sort(([, a], [, b])=>b.length - a.length).map(([slug, fields])=>{
+                                        const bulkExcluded = config.bulkExcludedCollections?.includes(slug) ?? false;
+                                        return /*#__PURE__*/ _jsxs("tr", {
+                                            children: [
+                                                /*#__PURE__*/ _jsxs("td", {
+                                                    style: {
+                                                        padding: '0.4rem 0.5rem',
+                                                        fontFamily: 'monospace',
+                                                        fontSize: '0.8rem',
+                                                        borderTop: '1px solid var(--theme-elevation-100)',
+                                                        whiteSpace: 'nowrap',
+                                                        verticalAlign: 'top'
+                                                    },
+                                                    children: [
+                                                        slug,
+                                                        bulkExcluded && // NEW-9 (v1.2.6): badge for surfaces the
+                                                        // consumer has excluded from bulk-translate
+                                                        // runs (e.g. `users` for PII). Editors
+                                                        // see them in the per-field button +
+                                                        // override picker but not in the Bulk
+                                                        // Translate modal — this clarifies why.
+                                                        /*#__PURE__*/ _jsx("span", {
+                                                            "data-testid": `bulk-excluded-${slug}`,
+                                                            style: {
+                                                                marginLeft: '0.4rem',
+                                                                padding: '0.05rem 0.4rem',
+                                                                borderRadius: '999px',
+                                                                fontSize: '0.65rem',
+                                                                fontFamily: 'inherit',
+                                                                fontWeight: 600,
+                                                                background: 'var(--theme-warning-100, #fef3c7)',
+                                                                color: 'var(--theme-warning-800, #92400e)',
+                                                                border: '1px solid var(--theme-warning-300, #fde68a)',
+                                                                whiteSpace: 'nowrap'
+                                                            },
+                                                            title: "This surface is translated per-document via the Translate button but is excluded from Bulk Translate runs (consumer config: bulk.excludeCollections).",
+                                                            children: "Excluded from bulk translate"
+                                                        })
+                                                    ]
+                                                }),
+                                                /*#__PURE__*/ _jsx("td", {
+                                                    style: {
+                                                        padding: '0.4rem 0.5rem',
+                                                        textAlign: 'right',
+                                                        borderTop: '1px solid var(--theme-elevation-100)',
+                                                        color: 'var(--theme-elevation-800)',
+                                                        whiteSpace: 'nowrap',
+                                                        verticalAlign: 'top'
+                                                    },
+                                                    children: fields.length
+                                                }),
+                                                /*#__PURE__*/ _jsxs("td", {
+                                                    style: {
+                                                        padding: '0.4rem 0.5rem',
+                                                        borderTop: '1px solid var(--theme-elevation-100)',
+                                                        color: 'var(--theme-elevation-700)',
+                                                        fontSize: '0.75rem',
+                                                        fontFamily: 'monospace'
+                                                    },
+                                                    children: [
+                                                        fields.slice(0, 4).join(', '),
+                                                        fields.length > 4 && /*#__PURE__*/ _jsxs("span", {
+                                                            style: {
+                                                                color: 'var(--theme-elevation-500)'
+                                                            },
+                                                            children: [
+                                                                ' · ',
+                                                                "+",
+                                                                fields.length - 4,
+                                                                " more"
+                                                            ]
+                                                        })
+                                                    ]
+                                                })
+                                            ]
+                                        }, slug);
+                                    })
+                                })
+                            ]
+                        })
+                    })
+                ]
+            }),
+            /*#__PURE__*/ _jsxs("div", {
+                children: [
+                    /*#__PURE__*/ _jsx("div", {
+                        style: {
+                            ...LABEL_STYLE,
+                            marginBottom: '0.5rem'
+                        },
+                        children: "Diagnostic counters"
+                    }),
+                    /*#__PURE__*/ _jsxs("div", {
+                        style: {
+                            display: 'flex',
+                            flexWrap: 'wrap',
+                            gap: '0.75rem'
+                        },
+                        children: [
+                            /*#__PURE__*/ _jsxs("div", {
+                                style: CARD_STYLE,
+                                children: [
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: LABEL_STYLE,
+                                        children: "Usage rows total"
+                                    }),
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: VALUE_STYLE,
+                                        children: fmtNum(counts.usageRows)
+                                    }),
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: SUBVALUE_STYLE,
+                                        children: "Every translate run, ever."
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsxs("div", {
+                                style: CARD_STYLE,
+                                children: [
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: LABEL_STYLE,
+                                        children: "Alerts"
+                                    }),
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: VALUE_STYLE,
+                                        children: fmtNum(counts.alertsTotal)
+                                    }),
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: SUBVALUE_STYLE,
+                                        children: counts.alertsOpen != null && counts.alertsTotal != null ? `${counts.alertsOpen} open · ${counts.alertsTotal - counts.alertsOpen} dismissed` : '—'
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsxs("div", {
+                                style: CARD_STYLE,
+                                children: [
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: LABEL_STYLE,
+                                        children: "Running jobs (15m)"
+                                    }),
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: {
+                                            ...VALUE_STYLE,
+                                            color: (counts.jobsRunning ?? 0) > 0 ? 'var(--theme-success-500)' : 'var(--theme-elevation-1000)'
+                                        },
+                                        children: fmtNum(counts.jobsRunning)
+                                    }),
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: SUBVALUE_STYLE,
+                                        children: "Jobs flagged `running` in last 15 minutes."
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsxs("div", {
+                                style: CARD_STYLE,
+                                children: [
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: LABEL_STYLE,
+                                        children: "Stale candidates"
+                                    }),
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: {
+                                            ...VALUE_STYLE,
+                                            color: (counts.jobsStaleCandidate ?? 0) > 0 ? 'var(--theme-warning-500, #d97706)' : 'var(--theme-elevation-1000)'
+                                        },
+                                        children: fmtNum(counts.jobsStaleCandidate)
+                                    }),
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: SUBVALUE_STYLE,
+                                        children: "Jobs `running` for > 5min. Server probably died mid-run."
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsxs("div", {
+                                style: CARD_STYLE,
+                                children: [
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: LABEL_STYLE,
+                                        children: "Meta rows"
+                                    }),
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: VALUE_STYLE,
+                                        children: fmtNum(counts.metaRows)
+                                    }),
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: SUBVALUE_STYLE,
+                                        children: "Per-(collection, doc, locale, field) hashes powering skip and manual-edit guard."
+                                    })
+                                ]
+                            })
+                        ]
+                    })
+                ]
+            }),
+            counts.jobsStaleCandidate != null && counts.jobsStaleCandidate > 0 && /*#__PURE__*/ _jsxs("section", {
+                style: {
+                    ...SECTION_STYLE,
+                    background: 'var(--theme-warning-100, #fef3c7)',
+                    border: '1px solid var(--theme-warning-500, #d97706)'
+                },
+                children: [
+                    /*#__PURE__*/ _jsxs("strong", {
+                        style: {
+                            color: 'var(--theme-warning-500, #d97706)'
+                        },
+                        children: [
+                            "⚠ ",
+                            counts.jobsStaleCandidate,
+                            " stale running job",
+                            counts.jobsStaleCandidate === 1 ? '' : 's',
+                            " detected."
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs("p", {
+                        style: {
+                            margin: '0.4rem 0 0',
+                            fontSize: '0.85rem',
+                            color: 'var(--theme-elevation-900)'
+                        },
+                        children: [
+                            "These rows were marked `running` more than 5 minutes ago and haven't been touched since — usually a sign the server process died mid-translation. They don't block new translations but pollute the in-flight panel.",
+                            ' ',
+                            /*#__PURE__*/ _jsx("a", {
+                                href: `${basePath}/admin/collections/ai-translate-jobs?where[status][equals]=running&sort=createdAt`,
+                                style: {
+                                    color: 'var(--theme-success-500)'
+                                },
+                                children: "View stale jobs →"
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs("div", {
+                        style: {
+                            marginTop: '0.6rem',
+                            display: 'flex',
+                            alignItems: 'center',
+                            gap: '0.5rem',
+                            flexWrap: 'wrap'
+                        },
+                        children: [
+                            resetState.kind === 'idle' && /*#__PURE__*/ _jsx("button", {
+                                onClick: ()=>setResetState({
+                                        kind: 'confirming'
+                                    }),
+                                style: {
+                                    padding: '0.35rem 0.85rem',
+                                    background: 'var(--theme-warning-500, #d97706)',
+                                    border: 'none',
+                                    borderRadius: '4px',
+                                    color: '#fff',
+                                    fontWeight: 600,
+                                    fontSize: '0.8rem',
+                                    cursor: 'pointer'
+                                },
+                                type: "button",
+                                children: "Force-reset stale jobs"
+                            }),
+                            resetState.kind === 'confirming' && /*#__PURE__*/ _jsxs(_Fragment, {
+                                children: [
+                                    /*#__PURE__*/ _jsxs("span", {
+                                        style: {
+                                            fontSize: '0.8rem',
+                                            color: 'var(--theme-elevation-900)'
+                                        },
+                                        children: [
+                                            "Delete ",
+                                            counts.jobsStaleCandidate,
+                                            " stale job row",
+                                            counts.jobsStaleCandidate === 1 ? '' : 's',
+                                            "?"
+                                        ]
+                                    }),
+                                    /*#__PURE__*/ _jsx("button", {
+                                        onClick: ()=>setResetState({
+                                                kind: 'idle'
+                                            }),
+                                        style: {
+                                            padding: '0.35rem 0.85rem',
+                                            background: 'transparent',
+                                            border: '1px solid var(--theme-elevation-200)',
+                                            borderRadius: '4px',
+                                            color: 'var(--theme-elevation-700)',
+                                            fontSize: '0.8rem',
+                                            cursor: 'pointer'
+                                        },
+                                        type: "button",
+                                        children: "Cancel"
+                                    }),
+                                    /*#__PURE__*/ _jsx("button", {
+                                        onClick: ()=>{
+                                            void forceResetStaleJobs();
+                                        },
+                                        style: {
+                                            padding: '0.35rem 0.85rem',
+                                            background: 'var(--theme-error-500, #b91c1c)',
+                                            border: 'none',
+                                            borderRadius: '4px',
+                                            color: '#fff',
+                                            fontWeight: 600,
+                                            fontSize: '0.8rem',
+                                            cursor: 'pointer'
+                                        },
+                                        type: "button",
+                                        children: "Confirm reset"
+                                    })
+                                ]
+                            }),
+                            resetState.kind === 'resetting' && /*#__PURE__*/ _jsx("span", {
+                                style: {
+                                    fontSize: '0.8rem',
+                                    color: 'var(--theme-elevation-700)'
+                                },
+                                children: "Resetting…"
+                            }),
+                            resetState.kind === 'done' && /*#__PURE__*/ _jsxs("span", {
+                                role: "status",
+                                style: {
+                                    fontSize: '0.8rem',
+                                    color: 'var(--theme-success-500, #15803d)'
+                                },
+                                children: [
+                                    "Deleted ",
+                                    resetState.deleted,
+                                    " stale job row",
+                                    resetState.deleted === 1 ? '' : 's',
+                                    "."
+                                ]
+                            }),
+                            resetState.kind === 'error' && /*#__PURE__*/ _jsxs("span", {
+                                role: "alert",
+                                style: {
+                                    fontSize: '0.8rem',
+                                    color: 'var(--theme-error-500, #b91c1c)'
+                                },
+                                children: [
+                                    "Reset failed — ",
+                                    resetState.message
+                                ]
+                            })
+                        ]
+                    })
+                ]
+            }),
+            /*#__PURE__*/ _jsxs("section", {
+                style: SECTION_STYLE,
+                children: [
+                    /*#__PURE__*/ _jsx("h3", {
+                        style: {
+                            margin: '0 0 0.5rem',
+                            fontSize: '0.95rem',
+                            color: 'var(--theme-elevation-1000)'
+                        },
+                        children: "Raw collection access"
+                    }),
+                    /*#__PURE__*/ _jsxs("div", {
+                        style: {
+                            display: 'grid',
+                            gridTemplateColumns: 'repeat(auto-fit, minmax(220px, 1fr))',
+                            gap: '0.5rem',
+                            fontSize: '0.85rem'
+                        },
+                        children: [
+                            /*#__PURE__*/ _jsxs("a", {
+                                href: `${basePath}/admin/collections/translation-usage`,
+                                style: {
+                                    padding: '0.6rem 0.75rem',
+                                    background: 'var(--theme-elevation-100)',
+                                    borderRadius: '4px',
+                                    color: 'var(--theme-elevation-1000)',
+                                    textDecoration: 'none',
+                                    display: 'block'
+                                },
+                                children: [
+                                    /*#__PURE__*/ _jsx("strong", {
+                                        children: "Translation Usage"
+                                    }),
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: {
+                                            color: 'var(--theme-elevation-500)',
+                                            fontSize: '0.75rem'
+                                        },
+                                        children: "Per-run rows with full filter / sort controls."
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsxs("a", {
+                                href: `${basePath}/admin/collections/translation-alerts`,
+                                style: {
+                                    padding: '0.6rem 0.75rem',
+                                    background: 'var(--theme-elevation-100)',
+                                    borderRadius: '4px',
+                                    color: 'var(--theme-elevation-1000)',
+                                    textDecoration: 'none',
+                                    display: 'block'
+                                },
+                                children: [
+                                    /*#__PURE__*/ _jsx("strong", {
+                                        children: "Translation Alerts"
+                                    }),
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: {
+                                            color: 'var(--theme-elevation-500)',
+                                            fontSize: '0.75rem'
+                                        },
+                                        children: "Cost-guard, persistent-failure, provider-outage events."
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsxs("a", {
+                                href: `${basePath}/admin/collections/ai-translate-jobs`,
+                                style: {
+                                    padding: '0.6rem 0.75rem',
+                                    background: 'var(--theme-elevation-100)',
+                                    borderRadius: '4px',
+                                    color: 'var(--theme-elevation-1000)',
+                                    textDecoration: 'none',
+                                    display: 'block'
+                                },
+                                children: [
+                                    /*#__PURE__*/ _jsx("strong", {
+                                        children: "Translate Jobs"
+                                    }),
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: {
+                                            color: 'var(--theme-elevation-500)',
+                                            fontSize: '0.75rem'
+                                        },
+                                        children: "Job-level state including in-flight + historical."
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsxs("a", {
+                                href: `${basePath}/admin/collections/ai-translate-meta`,
+                                style: {
+                                    padding: '0.6rem 0.75rem',
+                                    background: 'var(--theme-elevation-100)',
+                                    borderRadius: '4px',
+                                    color: 'var(--theme-elevation-1000)',
+                                    textDecoration: 'none',
+                                    display: 'block'
+                                },
+                                children: [
+                                    /*#__PURE__*/ _jsx("strong", {
+                                        children: "AI Translate Meta"
+                                    }),
+                                    /*#__PURE__*/ _jsx("div", {
+                                        style: {
+                                            color: 'var(--theme-elevation-500)',
+                                            fontSize: '0.75rem'
+                                        },
+                                        children: "Per-field hashes (source + last-written)."
+                                    })
+                                ]
+                            })
+                        ]
+                    })
+                ]
+            })
+        ]
+    });
+};
+export default AdvancedPanel;