@focus-reactive/payload-plugin-translator 0.8.1 → 0.9.0

package/README.md

@@ -196,6 +196,43 @@ Dismiss acknowledges the drift without re-translating; the marker stays hidden u
 changes again. When `provenance` is disabled nothing is shown. Note the fingerprint is text-only, so
 formatting-only edits to rich text do not mark a locale stale.
 
+### Auto-translate on source change
+
+_Since v0.9.0._
+
+Opt in per collection with `withAutoTranslate` and the plugin queues translations automatically when a
+document's source-locale content changes — no manual trigger. Off by default; a collection is enabled
+only by wrapping it.
+
+```ts
+import { translatorPlugin, withAutoTranslate, createOpenAIProvider, createPayloadJobsRunner } from "@focus-reactive/payload-plugin-translator";
+
+translatorPlugin({
+  collections: [withAutoTranslate(Posts, { targets: ["de", "fr"], debounceMs: 2000 })],
+  translationProvider: createOpenAIProvider({ apiKey: process.env.OPENAI_API_KEY }),
+  runner: createPayloadJobsRunner(),
+});
+```
+
+| Option | Type | Default | Meaning |
+| ------ | ---- | ------- | ------- |
+| `targets` | `string[]` | — | Locales to translate into. The source locale is always excluded. |
+| `strategy` | `"overwrite" \| "skip_existing"` | `"overwrite"` | How target content is written. |
+| `debounceMs` | `number` | `0` | Delay before the job runs, coalescing rapid edits (see below). |
+| `sourceLocale` | `string` | `localization.defaultLocale` | Override the source locale for this collection. |
+
+Behaviour: fires only on a **published** source save (draft/autosave saves are ignored; a collection
+without drafts treats every save as published); skips when no translatable content actually changed
+(same fingerprint as stale-detection); coalesces rapid edits via `debounceMs`; the translation is saved
+with the source document's status (published source → published translation); never re-triggers on its
+own translation writes; and never fails the editor's save (best-effort — failures are logged).
+
+> **Requires a working job runner.** Auto-translate only **enqueues** jobs — they run via the task
+> runner (`createPayloadJobsRunner`) and its autorun loop. On serverless platforms such as **Vercel**,
+> cron-based autorun may not run automatically, so enqueued translations can sit unexecuted until
+> triggered — e.g. an external cron hitting the run endpoint, or a self-hosted worker. Make sure your
+> deployment actually executes queued jobs before relying on auto-translate.
+
 ### Lifecycle callbacks
 
 _Since v0.7.0._

package/dist/auto-translate-config.d.ts

@@ -0,0 +1,40 @@
+import type { CollectionConfig } from "payload";
+import type { AutoTranslateConfig } from "./core/auto-translate-config";
+export type { AutoTranslateConfig };
+export type { AutoTranslateStrategy } from "./core/auto-translate-config";
+/**
+ * Enable opt-in **auto-translate** for a collection: when a document's source-locale content changes
+ * (and is published), the plugin automatically queues translations into the configured target locales.
+ * Off by default — a collection is opted in only by wrapping it with this helper. The rule is stamped
+ * onto `collection.custom` (the input is not mutated; a new collection is returned), mirroring
+ * `withFieldTranslation` at the field level.
+ *
+ * Behaviour: fires only on a **published** source save (draft/autosave saves are ignored; a collection
+ * without drafts treats every save as published); skips when no translatable content actually changed
+ * (drift-gate); coalesces rapid edits via `debounceMs`; never re-triggers on its own translation
+ * writes; and never fails the editor's save (best-effort).
+ *
+ * **Requires a working job runner.** Auto-translate only ENQUEUES jobs — they run via the plugin's
+ * task runner (`createPayloadJobsRunner`) and its autorun loop. On serverless platforms such as
+ * **Vercel**, cron-based autorun may not run automatically, so enqueued translations can sit
+ * unexecuted until triggered — e.g. an external cron hitting the run-translation endpoint, or a
+ * self-hosted worker. Ensure your deployment actually executes queued jobs before relying on this.
+ *
+ * @param collection - The collection to opt in.
+ * @param config - Target locales (+ optional strategy, debounce, source-locale override).
+ * @returns A new collection with the auto-translate rule applied (the input is not mutated).
+ *
+ * @example
+ * ```ts
+ * import { withAutoTranslate } from '@focus-reactive/payload-plugin-translator'
+ *
+ * translatorPlugin({
+ *   collections: [withAutoTranslate(Posts, { targets: ['de', 'fr'], debounceMs: 2000 })],
+ *   translationProvider,
+ *   runner,
+ * })
+ * ```
+ *
+ * @since 0.9.0
+ */
+export declare function withAutoTranslate(collection: CollectionConfig, config: AutoTranslateConfig): CollectionConfig;

package/dist/auto-translate-config.js

@@ -0,0 +1,46 @@
+import { AUTO_TRANSLATE_CUSTOM_KEY } from "./core/auto-translate-config";
+/**
+ * Enable opt-in **auto-translate** for a collection: when a document's source-locale content changes
+ * (and is published), the plugin automatically queues translations into the configured target locales.
+ * Off by default — a collection is opted in only by wrapping it with this helper. The rule is stamped
+ * onto `collection.custom` (the input is not mutated; a new collection is returned), mirroring
+ * `withFieldTranslation` at the field level.
+ *
+ * Behaviour: fires only on a **published** source save (draft/autosave saves are ignored; a collection
+ * without drafts treats every save as published); skips when no translatable content actually changed
+ * (drift-gate); coalesces rapid edits via `debounceMs`; never re-triggers on its own translation
+ * writes; and never fails the editor's save (best-effort).
+ *
+ * **Requires a working job runner.** Auto-translate only ENQUEUES jobs — they run via the plugin's
+ * task runner (`createPayloadJobsRunner`) and its autorun loop. On serverless platforms such as
+ * **Vercel**, cron-based autorun may not run automatically, so enqueued translations can sit
+ * unexecuted until triggered — e.g. an external cron hitting the run-translation endpoint, or a
+ * self-hosted worker. Ensure your deployment actually executes queued jobs before relying on this.
+ *
+ * @param collection - The collection to opt in.
+ * @param config - Target locales (+ optional strategy, debounce, source-locale override).
+ * @returns A new collection with the auto-translate rule applied (the input is not mutated).
+ *
+ * @example
+ * ```ts
+ * import { withAutoTranslate } from '@focus-reactive/payload-plugin-translator'
+ *
+ * translatorPlugin({
+ *   collections: [withAutoTranslate(Posts, { targets: ['de', 'fr'], debounceMs: 2000 })],
+ *   translationProvider,
+ *   runner,
+ * })
+ * ```
+ *
+ * @since 0.9.0
+ */ export function withAutoTranslate(collection, config) {
+    return {
+        ...collection,
+        custom: {
+            ...collection.custom ?? {},
+            [AUTO_TRANSLATE_CUSTOM_KEY]: config
+        }
+    };
+}
+
+//# sourceMappingURL=auto-translate-config.js.map

package/dist/client/entities/translation/api/queries/useDocumentTranslation.d.ts

@@ -9,7 +9,7 @@ type Options = {
 };
 export declare function useDocumentTranslation({ collection, id }: Props, options?: Options): {
     invalidate: () => void;
-    data: NoInfer<DocumentTranslation>;
+    data: NoInfer<DocumentTranslation[]>;
     error: Error;
     isError: true;
     isPending: false;
@@ -32,12 +32,12 @@ export declare function useDocumentTranslation({ collection, id }: Props, option
     isRefetching: boolean;
     isStale: boolean;
     isEnabled: boolean;
-    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<NoInfer<DocumentTranslation>, Error>>;
+    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<NoInfer<DocumentTranslation[]>, Error>>;
     fetchStatus: import("@tanstack/react-query").FetchStatus;
-    promise: Promise<NoInfer<DocumentTranslation>>;
+    promise: Promise<NoInfer<DocumentTranslation[]>>;
 } | {
     invalidate: () => void;
-    data: NoInfer<DocumentTranslation>;
+    data: NoInfer<DocumentTranslation[]>;
     error: null;
     isError: false;
     isPending: false;
@@ -60,9 +60,9 @@ export declare function useDocumentTranslation({ collection, id }: Props, option
     isRefetching: boolean;
     isStale: boolean;
     isEnabled: boolean;
-    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<NoInfer<DocumentTranslation>, Error>>;
+    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<NoInfer<DocumentTranslation[]>, Error>>;
     fetchStatus: import("@tanstack/react-query").FetchStatus;
-    promise: Promise<NoInfer<DocumentTranslation>>;
+    promise: Promise<NoInfer<DocumentTranslation[]>>;
 } | {
     invalidate: () => void;
     data: undefined;
@@ -88,9 +88,9 @@ export declare function useDocumentTranslation({ collection, id }: Props, option
     isRefetching: boolean;
     isStale: boolean;
     isEnabled: boolean;
-    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<NoInfer<DocumentTranslation>, Error>>;
+    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<NoInfer<DocumentTranslation[]>, Error>>;
     fetchStatus: import("@tanstack/react-query").FetchStatus;
-    promise: Promise<NoInfer<DocumentTranslation>>;
+    promise: Promise<NoInfer<DocumentTranslation[]>>;
 } | {
     invalidate: () => void;
     data: undefined;
@@ -116,9 +116,9 @@ export declare function useDocumentTranslation({ collection, id }: Props, option
     isRefetching: boolean;
     isStale: boolean;
     isEnabled: boolean;
-    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<NoInfer<DocumentTranslation>, Error>>;
+    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<NoInfer<DocumentTranslation[]>, Error>>;
     fetchStatus: import("@tanstack/react-query").FetchStatus;
-    promise: Promise<NoInfer<DocumentTranslation>>;
+    promise: Promise<NoInfer<DocumentTranslation[]>>;
 } | {
     invalidate: () => void;
     data: undefined;
@@ -144,12 +144,12 @@ export declare function useDocumentTranslation({ collection, id }: Props, option
     isRefetching: boolean;
     isStale: boolean;
     isEnabled: boolean;
-    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<NoInfer<DocumentTranslation>, Error>>;
+    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<NoInfer<DocumentTranslation[]>, Error>>;
     fetchStatus: import("@tanstack/react-query").FetchStatus;
-    promise: Promise<NoInfer<DocumentTranslation>>;
+    promise: Promise<NoInfer<DocumentTranslation[]>>;
 } | {
     invalidate: () => void;
-    data: NoInfer<DocumentTranslation>;
+    data: NoInfer<DocumentTranslation[]>;
     isError: false;
     error: null;
     isPending: false;
@@ -172,8 +172,8 @@ export declare function useDocumentTranslation({ collection, id }: Props, option
     isRefetching: boolean;
     isStale: boolean;
     isEnabled: boolean;
-    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<NoInfer<DocumentTranslation>, Error>>;
+    refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<NoInfer<DocumentTranslation[]>, Error>>;
     fetchStatus: import("@tanstack/react-query").FetchStatus;
-    promise: Promise<NoInfer<DocumentTranslation>>;
+    promise: Promise<NoInfer<DocumentTranslation[]>>;
 };
 export {};

package/dist/client/entities/translation/api/queries/useDocumentTranslation.js

@@ -26,12 +26,16 @@ export function useDocumentTranslation({ collection, id }, options) {
                     method: "get",
                     signal
                 });
-                return response.data;
+                // Normalize to an array defensively: a stale admin tab from before the object→array response
+                // change (deploy skew) would otherwise feed a non-array here and break the polling callback.
+                return Array.isArray(response.data) ? response.data : [];
             });
         },
         enabled: options?.enabled,
+        // Keep polling while any locale's job is still in flight; stop once every job is terminal.
         refetchInterval: (query)=>{
-            return query.state.data?.status === "failed" || query.state.data?.status === "completed" ? false : POLLING_INTERVAL_MILLISECONDS;
+            const active = (query.state.data ?? []).some((job)=>job.status === "pending" || job.status === "running");
+            return active ? POLLING_INTERVAL_MILLISECONDS : false;
         }
     });
     const invalidate = useCallback(()=>{
@@ -49,23 +53,35 @@ export function useDocumentTranslation({ collection, id }, options) {
     // When a queued (async) translation transitions to "completed" in-session, the provenance
     // record's sourceFingerprint has just been updated server-side — invalidate staleness so the
     // "Out of date" notice clears without waiting for the next focus/remount refetch (#50).
-    // Seeded lazily (undefined) and gated on a *defined, non-completed → completed* transition, so a
-    // cold mount of an already-completed document does NOT fire a spurious extra refetch.
-    const previousStatusRef = useRef(undefined);
+    // Tracked as a *set* of completed target locales (the feed is now per-locale): fire whenever a
+    // locale newly reaches "completed". The snapshot is tagged with the document key and reset when
+    // the document changes, so a cold mount of an already-completed document — or navigating to a
+    // different document within the same component instance — does NOT fire a spurious extra refetch.
+    const docKey = `${collection}:${id}`;
+    const previousCompletedRef = useRef(undefined);
     useEffect(()=>{
-        const previousStatus = previousStatusRef.current;
-        const currentStatus = query.data?.status;
-        if (currentStatus === "completed" && previousStatus !== undefined && previousStatus !== "completed") {
+        const jobs = query.data;
+        if (!jobs) return;
+        const completed = new Set(jobs.filter((job)=>job.status === "completed").map((job)=>job.input.target_lng));
+        const previous = previousCompletedRef.current;
+        const sameDoc = previous?.docKey === docKey;
+        if (sameDoc && [
+            ...completed
+        ].some((locale)=>!previous.locales.has(locale))) {
             queryClient.invalidateQueries({
                 queryKey: [
                     DOCUMENT_STALENESS_QUERY_KEY
                 ]
             });
         }
-        previousStatusRef.current = currentStatus;
+        previousCompletedRef.current = {
+            docKey,
+            locales: completed
+        };
     }, [
-        query.data?.status,
-        queryClient
+        query.data,
+        queryClient,
+        docKey
     ]);
     return {
         ...query,

package/dist/client/entities/translation/index.d.ts

@@ -7,6 +7,7 @@ import { useCollectionTranslationStatus } from "./api/queries/useCollectionTrans
 import { useDocumentStaleness } from "./api/queries/useDocumentStaleness";
 import { useDocumentTranslation } from "./api/queries/useDocumentTranslation";
 export { TranslationStatusList } from "./ui/TranslationStatusList";
+export { AutoTranslateMarker } from "./ui/AutoTranslateMarker";
 export declare const TranslationsApi: {
     useRunDocumentTranslation: typeof useRunDocumentTranslation;
     useQueueDocumentTranslation: typeof useQueueDocumentTranslation;
@@ -19,7 +20,7 @@ export declare const TranslationsApi: {
 };
 export type { DocumentTranslation, DocumentTranslationCompleted, DocumentTranslationFailed, DocumentTranslationPending, DocumentTranslationRunning, CollectionTranslationStatus, CollectionTranslationStatusItem, GroupedCollectionTranslationStatus, DocumentStaleness, StalenessLocale, } from "./model/types";
 export { DocumentTranslationStatus } from "./model/enums";
-export { derivePanelStatus, deriveCollectionPanelStatus, describePanelStatus, } from "./model/panelStatus";
+export { derivePanelStatus, deriveCollectionPanelStatus, deriveDocumentRunStatus, describePanelStatus, } from "./model/panelStatus";
 export type { PanelStatus, MarkerTone } from "./model/panelStatus";
 export { PanelStatusMarker } from "./ui/PanelStatusMarker";
 export { ActionButton } from "./ui/ActionButton";

package/dist/client/entities/translation/index.js

@@ -7,6 +7,7 @@ import { useCollectionTranslationStatus } from "./api/queries/useCollectionTrans
 import { useDocumentStaleness } from "./api/queries/useDocumentStaleness";
 import { useDocumentTranslation } from "./api/queries/useDocumentTranslation";
 export { TranslationStatusList } from "./ui/TranslationStatusList";
+export { AutoTranslateMarker } from "./ui/AutoTranslateMarker";
 export const TranslationsApi = {
     useRunDocumentTranslation,
     useQueueDocumentTranslation,
@@ -18,7 +19,7 @@ export const TranslationsApi = {
     useDismissStaleness
 };
 export { DocumentTranslationStatus } from "./model/enums";
-export { derivePanelStatus, deriveCollectionPanelStatus, describePanelStatus } from "./model/panelStatus";
+export { derivePanelStatus, deriveCollectionPanelStatus, deriveDocumentRunStatus, describePanelStatus } from "./model/panelStatus";
 export { PanelStatusMarker } from "./ui/PanelStatusMarker";
 export { ActionButton } from "./ui/ActionButton";
 export { buildTranslationStatusRows } from "./model/statusRows";

package/dist/client/entities/translation/model/autoTranslateSummary.d.ts

@@ -0,0 +1,15 @@
+/** The auto-translate facts the marker renders — resolved from a collection's opt-in config. */
+export type AutoTranslateSummary = {
+    targets: string[];
+    sourceLocale: string;
+};
+/**
+ * Resolve a collection's auto-translate summary for the popup marker, or `null` when it should not
+ * render. Reads the opt-in from the collection's `custom` (propagated onto the registered collection at
+ * init), resolves the source locale (per-collection override else the config default), and drops the
+ * source from the displayed targets. Returns `null` when off, when no source locale is resolvable, or
+ * when no target remains — so the caller renders the marker only when it is both enabled and meaningful.
+ */
+export declare function resolveAutoTranslateSummary(collection: {
+    custom?: Record<string, unknown>;
+} | undefined, defaultLocale: string | undefined): AutoTranslateSummary | null;

package/dist/client/entities/translation/model/autoTranslateSummary.js

@@ -0,0 +1,22 @@
+import { getAutoTranslateConfig } from "../../../../core/auto-translate-config";
+/**
+ * Resolve a collection's auto-translate summary for the popup marker, or `null` when it should not
+ * render. Reads the opt-in from the collection's `custom` (propagated onto the registered collection at
+ * init), resolves the source locale (per-collection override else the config default), and drops the
+ * source from the displayed targets. Returns `null` when off, when no source locale is resolvable, or
+ * when no target remains — so the caller renders the marker only when it is both enabled and meaningful.
+ */ export function resolveAutoTranslateSummary(collection, defaultLocale) {
+    if (!collection) return null;
+    const config = getAutoTranslateConfig(collection);
+    if (!config) return null;
+    const sourceLocale = config.sourceLocale ?? defaultLocale;
+    if (!sourceLocale) return null;
+    const targets = config.targets.filter((target)=>target !== sourceLocale);
+    if (targets.length === 0) return null;
+    return {
+        targets,
+        sourceLocale
+    };
+}
+
+//# sourceMappingURL=autoTranslateSummary.js.map

package/dist/client/entities/translation/model/panelStatus.d.ts

@@ -1,6 +1,6 @@
 import { DocumentTranslationStatus } from "./enums";
 import type { StatusDotColor } from "./statusRows";
-import type { GroupedCollectionTranslationStatus } from "./types";
+import type { DocumentTranslation, GroupedCollectionTranslationStatus } from "./types";
 /**
  * The single aggregate signal shown on a translate trigger (document or collection). Detail lives in
  * the popup; the panel only surfaces the most urgent state at a glance (see the panel-UI design doc).
@@ -37,8 +37,14 @@ export declare function describePanelStatus(status: PanelStatus | undefined, fal
     tone?: MarkerTone;
     title: string;
 };
+/**
+ * Collapse the per-locale job feed into the single most-urgent run status for the trigger marker.
+ * Returns `undefined` when there are no jobs. The panel shows one aggregate signal; the popup's list
+ * carries the full per-locale detail.
+ */
+export declare function deriveDocumentRunStatus(runs: DocumentTranslation[] | undefined): DocumentTranslationStatus | undefined;
 type PanelStatusInput = {
-    /** Status of the latest translation job, if any. */
+    /** Status of the most-urgent translation job across locales, if any (see `deriveDocumentRunStatus`). */
     runStatus?: DocumentTranslationStatus | null;
     /** Target locales whose translation is out of date (from staleness detection). */
     staleLocales: string[];

package/dist/client/entities/translation/model/panelStatus.js

@@ -50,6 +50,22 @@ import { DocumentTranslationStatus } from "./enums";
             };
     }
 }
+// The most-urgent job status wins the single aggregate marker, in the order `derivePanelStatus`
+// itself ranks them: a failure to surface, then in-flight work, then a queued job, then completed.
+const RUN_STATUS_PRIORITY = [
+    DocumentTranslationStatus.FAILED,
+    DocumentTranslationStatus.RUNNING,
+    DocumentTranslationStatus.PENDING,
+    DocumentTranslationStatus.COMPLETED
+];
+/**
+ * Collapse the per-locale job feed into the single most-urgent run status for the trigger marker.
+ * Returns `undefined` when there are no jobs. The panel shows one aggregate signal; the popup's list
+ * carries the full per-locale detail.
+ */ export function deriveDocumentRunStatus(runs) {
+    const present = new Set(runs?.map((run)=>run.status));
+    return RUN_STATUS_PRIORITY.find((status)=>present.has(status));
+}
 /**
  * Collapse the latest run status + per-locale staleness into one panel marker, by priority:
  * `failed → running → stale → fresh → none`. A more urgent transient state (a failed or in-flight

package/dist/client/entities/translation/model/statusRows.d.ts

@@ -29,14 +29,17 @@ export declare const STATE_DOT: Record<TranslationRowState, {
     animated?: boolean;
 }>;
 /**
- * Build the unified status rows from per-locale staleness + the single latest job.
+ * Build the unified status rows from per-locale staleness + the latest job per target locale.
  *
- * Rows come from `staleness.locales` (one per translated target: `stale` or `translated`). The latest
- * job is overlaid onto its target locale: a **transient** job state (failed/running/pending) wins over
- * the durable signal for that locale, and a job for a target with no provenance row yet adds a row.
- * Sorted `failed → running → pending → stale → translated`, newest first within a group.
+ * Rows come from `staleness.locales` (one per translated target: `stale` or `translated`). Each job in
+ * `runs` (one per target locale — see `useDocumentTranslation`) is overlaid onto its target locale: a
+ * **transient** job state (failed/running/pending) wins over the durable signal for that locale, and a
+ * job for a target with no provenance row yet adds a row. Overlaying *every* job (not just one) is what
+ * lets several concurrent re-translations each show their own live state instead of the last one
+ * appearing to overwrite the rest. Sorted by the fixed source→target locale pair (not by state), so a
+ * row keeps its place when its state changes — re-translating a locale never reorders the list.
  */
 export declare function buildTranslationStatusRows(input: {
     staleness?: DocumentStaleness | null;
-    run?: DocumentTranslation;
+    runs?: DocumentTranslation[];
 }): TranslationStatusRow[];

package/dist/client/entities/translation/model/statusRows.js

@@ -20,32 +20,30 @@
         color: "green"
     }
 };
-// Most urgent first. Transient job states outrank the durable stale/translated signal.
-const ORDER = {
-    failed: 0,
-    running: 1,
-    pending: 2,
-    stale: 3,
-    translated: 4
-};
 const TRANSIENT = new Set([
     "failed",
     "running",
     "pending"
 ]);
+// A row's permanent identity for ordering: the source→target locale pair (unique per row, never
+// changes when the row's state does).
+const localePairKey = (row)=>`${row.sourceLocale}:${row.targetLocale}`;
 // Maps the closed 4-member job-status set to a row state. "completed" → "translated"; the transient
 // three pass through. If a new DocumentTranslationStatus is ever added, extend this explicitly —
 // otherwise it would silently render as "translated".
 const toRowState = (jobStatus)=>jobStatus === "failed" || jobStatus === "running" || jobStatus === "pending" ? jobStatus : "translated";
 /**
- * Build the unified status rows from per-locale staleness + the single latest job.
+ * Build the unified status rows from per-locale staleness + the latest job per target locale.
  *
- * Rows come from `staleness.locales` (one per translated target: `stale` or `translated`). The latest
- * job is overlaid onto its target locale: a **transient** job state (failed/running/pending) wins over
- * the durable signal for that locale, and a job for a target with no provenance row yet adds a row.
- * Sorted `failed → running → pending → stale → translated`, newest first within a group.
+ * Rows come from `staleness.locales` (one per translated target: `stale` or `translated`). Each job in
+ * `runs` (one per target locale — see `useDocumentTranslation`) is overlaid onto its target locale: a
+ * **transient** job state (failed/running/pending) wins over the durable signal for that locale, and a
+ * job for a target with no provenance row yet adds a row. Overlaying *every* job (not just one) is what
+ * lets several concurrent re-translations each show their own live state instead of the last one
+ * appearing to overwrite the rest. Sorted by the fixed source→target locale pair (not by state), so a
+ * row keeps its place when its state changes — re-translating a locale never reorders the list.
  */ export function buildTranslationStatusRows(input) {
-    const { staleness, run } = input;
+    const { staleness, runs } = input;
     const byTarget = new Map();
     for (const locale of staleness?.locales ?? []){
         byTarget.set(locale.target_lng, {
@@ -55,7 +53,7 @@ const toRowState = (jobStatus)=>jobStatus === "failed" || jobStatus === "running
             at: locale.translated_at
         });
     }
-    if (run) {
+    for (const run of runs ?? []){
         const state = toRowState(run.status);
         const target = run.input.target_lng;
         const existing = byTarget.get(target);
@@ -71,9 +69,13 @@ const toRowState = (jobStatus)=>jobStatus === "failed" || jobStatus === "running
             });
         }
     }
+    // Stable order by the source→target locale pair — the one thing about a row that never changes when
+    // its state does. Sorting by state/time instead would make a row jump (e.g. to the top) the moment
+    // you re-translate it; the locale pair keeps every row in a fixed place, and progress is conveyed by
+    // the badge/dot, not the position. The pair is unique (one row per target), so no tie-break needed.
     return [
         ...byTarget.values()
-    ].sort((a, b)=>ORDER[a.state] - ORDER[b.state] || (b.at ?? "").localeCompare(a.at ?? ""));
+    ].sort((a, b)=>localePairKey(a).localeCompare(localePairKey(b)));
 }
 
 //# sourceMappingURL=statusRows.js.map

package/dist/client/entities/translation/model/types.d.ts

@@ -35,7 +35,12 @@ export type DocumentTranslationCompleted = {
     completed_at: string;
     input: InputData;
 };
-export type DocumentTranslation = DocumentTranslationCompleted | DocumentTranslationRunning | DocumentTranslationFailed | DocumentTranslationPending | null;
+/**
+ * One translation job for a single target locale. The document status feed is an array of these —
+ * the latest job per target locale (see `useDocumentTranslation`), because re-translate queues an
+ * independent job per locale.
+ */
+export type DocumentTranslation = DocumentTranslationCompleted | DocumentTranslationRunning | DocumentTranslationFailed | DocumentTranslationPending;
 export type CollectionTranslationStatusItem = {
     id: string;
     status: DocumentTranslationStatus;

package/dist/client/entities/translation/ui/AutoTranslateMarker/AutoTranslateMarker.d.ts

@@ -0,0 +1,14 @@
+type AutoTranslateMarkerProps = {
+    /** Target locale codes this collection auto-translates into (source already excluded). */
+    targets: string[];
+    /** The resolved source locale code changes are watched on. */
+    sourceLocale: string;
+};
+/**
+ * A quiet, off-to-the-side marker in the translation popups' header (document + collection): a single
+ * muted icon that a collection is opted into auto-translate. The detail lives in the tooltip, not the
+ * layout — this is ambient config the editor rarely needs, so it stays out of the popup's main vertical
+ * flow (title / Translate / Status). Rendered only when auto-translate is enabled.
+ */
+export declare function AutoTranslateMarker({ targets, sourceLocale }: AutoTranslateMarkerProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/client/entities/translation/ui/AutoTranslateMarker/AutoTranslateMarker.js

@@ -0,0 +1,34 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AutoTranslateIcon } from "../../../../shared/lib/assets/icons/AutoTranslateIcon";
+import Tooltip from "../../../../shared/ui/Tooltip";
+import styles from "./styles.module.scss";
+/**
+ * A quiet, off-to-the-side marker in the translation popups' header (document + collection): a single
+ * muted icon that a collection is opted into auto-translate. The detail lives in the tooltip, not the
+ * layout — this is ambient config the editor rarely needs, so it stays out of the popup's main vertical
+ * flow (title / Translate / Status). Rendered only when auto-translate is enabled.
+ */ export function AutoTranslateMarker({ targets, sourceLocale }) {
+    return /*#__PURE__*/ _jsx(Tooltip, {
+        content: /*#__PURE__*/ _jsxs("span", {
+            className: styles.tip,
+            children: [
+                "Auto-translate is on. Publishing changes to the source (",
+                /*#__PURE__*/ _jsx("code", {
+                    children: sourceLocale
+                }),
+                ") content queues translations into ",
+                targets.join(" · "),
+                "."
+            ]
+        }),
+        children: /*#__PURE__*/ _jsx("span", {
+            className: styles.marker,
+            tabIndex: 0,
+            "aria-label": "Auto-translate enabled",
+            children: /*#__PURE__*/ _jsx(AutoTranslateIcon, {})
+        })
+    });
+}
+
+//# sourceMappingURL=AutoTranslateMarker.js.map

package/dist/client/entities/translation/ui/AutoTranslateMarker/index.d.ts

@@ -0,0 +1 @@
+export { AutoTranslateMarker } from "./AutoTranslateMarker";

package/dist/client/entities/translation/ui/AutoTranslateMarker/index.js

@@ -0,0 +1,3 @@
+export { AutoTranslateMarker } from "./AutoTranslateMarker";
+
+//# sourceMappingURL=index.js.map

package/dist/client/entities/translation/ui/AutoTranslateMarker/styles.module.scss

@@ -0,0 +1,30 @@
+// A muted, low-emphasis header marker — no border, no fill; it sits at the edge of the title row and
+// carries all detail in its tooltip, so it never competes with the popup's main flow.
+.marker {
+  display: inline-flex;
+  align-items: center;
+  flex-shrink: 0;
+  color: var(--theme-elevation-400, #a5a5a5);
+  cursor: help;
+  outline: none;
+}
+
+.marker:hover {
+  color: var(--theme-elevation-600, #6d6d6d);
+}
+
+.marker:focus-visible {
+  outline: 2px solid var(--theme-elevation-400, #a5a5a5);
+  outline-offset: 2px;
+  border-radius: 3px;
+}
+
+.tip {
+  display: block;
+  max-width: 15rem;
+  line-height: 1.35;
+}
+
+.tip code {
+  font-family: var(--font-mono, ui-monospace, monospace);
+}

package/dist/client/shared/lib/assets/icons/AutoTranslateIcon.d.ts

@@ -0,0 +1,3 @@
+/** A lightning bolt — connotes "fires automatically" (on the publish event). Used by the
+ * auto-translate marker to distinguish automatic translation from the manual translate control. */
+export declare const AutoTranslateIcon: () => import("react/jsx-runtime").JSX.Element;

package/dist/client/shared/lib/assets/icons/AutoTranslateIcon.js

@@ -0,0 +1,14 @@
+/** A lightning bolt — connotes "fires automatically" (on the publish event). Used by the
+ * auto-translate marker to distinguish automatic translation from the manual translate control. */ import { jsx as _jsx } from "react/jsx-runtime";
+export const AutoTranslateIcon = ()=>/*#__PURE__*/ _jsx("svg", {
+        fill: "currentColor",
+        width: "1em",
+        height: "1em",
+        viewBox: "0 0 24 24",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: /*#__PURE__*/ _jsx("path", {
+            d: "M13 2 L4.5 13.5 H11 L10 22 L19.5 10 H12.5 Z"
+        })
+    });
+
+//# sourceMappingURL=AutoTranslateIcon.js.map