portal-mojo 0.2.16 → 0.2.18

package/docs/admin-media-rendering.md

@@ -53,7 +53,12 @@ with raw `mojoList` — `SettingModel.normalizeListParams` strips `key`, so the
 model's list hook cannot do this. More than one global row for a key disables
 Save and Reset with a notice naming the ids: `Setting.Meta.ordering = ["key"]`
 leaves the server's `.first()` undefined among duplicates, so editing one could
-change a row the renderer never reads.
+change a row the renderer never reads. Save and Reset also stay disabled until
+the lookup succeeds (pending or failed reads say so beside the buttons), and a
+save with no known row (`saveCategoryValue(category, null, …)`) re-reads first:
+it refuses without writing when that read fails or finds a row, and creates
+only when the list is empty. `resetCategory(category, null)` resolves `null`,
+meaning nothing was reset.
 
 **Write:** the whole category as one object — `POST /api/settings` to create
 (`{key, is_secret: false, group: null, value}`) or `POST /api/settings/<id>`

package/docs/admin-members.md

@@ -135,3 +135,31 @@ Member product tabs only render `permissions.<grant>` fields whose grant is
 registered through `registerMemberPermissions()` and editable. System/derived
 grants, unregistered names and unrelated fields (such as `group` or `user`)
 are ignored; tabs with no valid fields do not appear.
+
+## Operation lifetime
+
+Member admission captures the initiating authentication session and active group.
+The selected group remains fixed throughout its form and the optional role-label
+write. An account/group change, even switching away and back, permanently ends
+the operation's client continuations. Ordinary JWT renewal keeps the session.
+The no-oracle success message is still shown for an accepted invitation with no
+member row, and a refused display-label write does not undo its accepted grants.
+
+`openMemberAdmissionDialog({ signal })` accepts the initiating panel's lifetime.
+`GroupMembersPanel`, global `MembersPage` and the Group detail admission action
+supply it automatically. Custom hosts should abort their controller when they
+unmount or change the record/authority used to open the dialog. Forms remain open
+through the request and disable repeated submission and Escape/backdrop dismissal
+while pending. Owner disposal always closes them. A request already received by
+the server is not cancelled or rolled back by closing its view.
+
+`MemberDetail` also accepts `ownerSignal` for a fixed-group host. Its activation,
+role, resend and permission changes bind the final pre-send check, returned row,
+cache invalidation and notices to the initiating detail scope. Disposed outcomes
+cannot populate a later account's cache. Live successful saves still update the
+shared member row immediately and invalidate the member lists. Errors keep the
+saved row and surface the server refusal; autosaved fields revert normally.
+
+The browser fixture sends no real invitations: start
+`node scripts/member-lifecycle-server.mjs`, then run
+`uv run --with playwright python scripts/verify-member-lifecycle.py`.

package/docs/admin-modals.md

@@ -31,7 +31,9 @@ fails; successful DetailView bodies supply the normal header close.
 Already-aborted signals resolve null without adding an entry. Later abort removes
 only that entry immediately and resolves null, even before `ModalHost` mounts;
 normal close removes the listener. Owner disposal bypasses `canDismiss` because
-it ends the data scope. An owner must also abort its controller on unmount.
+it ends the data scope. An owner must also abort its controller on unmount. `confirmGuardrail({ signal })`
+passes the same lifetime to its underlying modal, so an awaiting confirmation
+closes with its record or authority.
 
 ## Executable inventory
 

package/docs/admin-storage.md

@@ -60,9 +60,26 @@ closure, refetches authoritatively, and compares requested owner FKs.
 Creation supports runtime backends `file` and `s3`, explicitly starts private,
 and requires an authorized group/user owner unless the caller is superuser and
 chooses System. Supported payload actions are `test_connection`, `check_cors`,
-`fix_cors`, and `clone`; inner `{status:false}` rejects. CORS is S3-only.
+`fix_cors`, `clone`, and the CDN trio `enable_cdn`, `check_cdn`, `disable_cdn`
+(django-mojo #8250); inner `{status:false}` rejects. CORS and CDN are S3-only.
 FileManager DELETE and `check_public_access` are absent.
 
+**CDN delivery.** The manager graph carries a read-only `cdn` object
+(`projectCdn` keeps only its named keys; `{enabled: false}` otherwise), shown
+as the Overview's CDN row: not enabled, or the CDN address with "public
+links" or "signed links" and whether the distribution is still deploying.
+The detail menu offers **Check CDN**, **Enable CDN…** and **Disable CDN…**
+to every storage manager (`manage_files` / `files`; django-mojo enforces the
+same global grant on the actions), the two mutating ones behind a confirm
+that says what changes in AWS (enable provisions CloudFront for the whole
+bucket under the deployment's identity and creates nothing twice; disable
+reverts every manager on the bucket to S3 links and leaves AWS alone).
+Results render as a findings list — status badge, code, message, remedy —
+through `cdnFindings`, never raw JSON. The mock serves the field (the
+"Public media" backend starts enabled) and the three actions, with a
+MANUAL KMS finding on the private uploads backend so the remedy rendering
+is exercised.
+
 ## Files and capability URLs
 
 `FileModel` forces the list graph and normal saves to `filename`, `is_public`,

package/docs/forms.md

@@ -106,6 +106,7 @@ if (!data) return;   // cancelled → null
     onSaved={({ changes, fields, row }) => …}
     onSaveError={({ changes, fields, error }) => …}
     beforeSave={({ changes, names, row }) => …}   // once per batch, BEFORE the POST (below)
+    isCurrent={() => ownerScope.current()}      // optional owner lifetime fence
     onPendingChange={(uploading) => setDetailDismissLocked(uploading)}
 />
 ```
@@ -176,6 +177,21 @@ contract is pinned by `npm run verify:form-autosave`.
    Server normalization is visible: save `555 010 0142`, the field comes back
    `+15550100142`.
 
+### Owner lifetime
+
+`isCurrent?: () => boolean` is an optional, synchronous lifetime predicate for
+forms whose account, group or owning dialog can end while a save is pending.
+Returning `false` prevents the batch before and after its asynchronous
+`beforeSave` gate, and suppresses late success/error callbacks and autosave
+feedback. Capture a one-way scope: leaving and returning must not revive the
+old operation. Omitting it preserves the existing autosave behavior.
+
+This guard covers the form's continuations, not a model's own mutation effects.
+An owner-scoped model must also check its scope at the transport's final
+`beforeSend` boundary and before writing response data to a shared cache.
+MemberDetail provides that guarded mutation boundary. Already-sent server writes
+are not rolled back when the view closes.
+
 ### `file` / `image` relations
 
 Both registry bindings use the exported controlled `FileField`/`ImageField`

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "portal-mojo",
-    "version": "0.2.16",
+    "version": "0.2.18",
     "description": "React portal toolkit for django-mojo — typed client + params store, mission-control UI, dependency-free SVG charts, admin section bundles.",
     "type": "module",
     "license": "Apache-2.0",

package/src/admin/identity/groups/GroupDetail.tsx

@@ -37,6 +37,7 @@ import {
     MemberModel, openMemberAdmissionDialog,
 } from '../members';
 import { LogModel } from '../../monitoring';
+import { useMemberScope } from '../members/member-scope';
 import {
     GROUP_DESTRUCTIVE_PERMS, GROUP_MANAGE_PERMS,
     GroupModel, type GroupRow,
@@ -93,6 +94,8 @@ export function GroupDetail({ id, onClose }: { id: number; onClose: () => void }
     const { can: canCreateMember } = useCan(MEMBER_SAVE_PERMISSIONS);
     const { can: canReadUsers } = useCan(MEMBER_USER_DIRECTORY_PERMISSIONS);
 
+    const admissionScope = useMemberScope(`${id}:${canInviteMember}:${canCreateMember}:${canReadUsers}`);
+
     // Rail count badges (source setBadge wiring, as controlled props). The
     // member/apikey peeks share Overview's keys and dedupe; the gated ones
     // hold off until the caller could actually open the section.
@@ -148,6 +151,7 @@ export function GroupDetail({ id, onClose }: { id: number; onClose: () => void }
                     canCreate: canCreateMember,
                     canReadUsers,
                     queryClient: qc,
+                    signal: admissionScope.current?.signal,
                 });
             },
         },

package/src/admin/identity/members/GroupMembersPanel.tsx

@@ -4,6 +4,7 @@ import { useCan, type Params } from '../../../client/runtime';
 import { Badge, Eyebrow, SecurityItem, fmt, modal } from '../../../ui';
 import { MemberDetail, type MemberNavigationCallbacks } from './MemberDetail';
 import { openMemberAdmissionDialog, type AdmissionGroup, type AdmissionMode, type AdmissionRole } from './member-flows';
+import { useMemberScope } from './member-scope';
 import type { PermSpec } from '../../../client/runtime';
 import {
     MEMBER_GROUP_READ_PERMISSIONS,
@@ -83,6 +84,7 @@ export function GroupMembersPanel({
     const { can: canInvite } = useCan(invitePermissions);
     const { can: canCreate } = useCan(savePermissions);
     const { can: canReadUsers } = useCan(directoryPermissions);
+    const scope = useMemberScope(`${group.id}:${canInvite}:${canCreate}:${canReadUsers}`);
     const members = query.data?.rows ?? [];
     const count = query.data?.count ?? 0;
 
@@ -94,6 +96,7 @@ export function GroupMembersPanel({
         canCreate,
         canReadUsers,
         queryClient: qc,
+        signal: scope.current?.signal,
     });
     const openMember = (member: MemberRow) => {
         void MemberModel.fetchOne(qc, member.id).catch(() => {});
@@ -103,6 +106,7 @@ export function GroupMembersPanel({
                 onClose={() => close(null)}
                 readPermissions={MEMBER_GROUP_READ_PERMISSIONS}
                 savePermissions={savePermissions}
+                ownerSignal={scope.current?.signal}
                 onNavigateUser={onNavigateUser}
                 onNavigateGroup={onNavigateGroup}
             />

package/src/admin/identity/members/MemberDetail.tsx

@@ -1,9 +1,12 @@
-import { useSyncExternalStore, type ReactNode } from 'react';
-import { useQueryClient } from '@tanstack/react-query';
+import { useEffect, useMemo, useSyncExternalStore, type ReactNode } from 'react';
+import { useMutation, useQueryClient } from '@tanstack/react-query';
 import { useCan, type PermSpec } from '../../../client/runtime';
+import { mojoCall, withFreshAuth, type SaveVars } from '../../../client/runtime';
+import { saveMemberInScope, useMemberScope } from './member-scope';
+import { memberForm } from './member-dialog';
 import {
     Badge, DetailView, Eyebrow, FlatRow, FormView, JsonBlock, MetricCard,
-    ModelTable, confirmGuardrail, fmt, formModal, toast, getFormTabs, formTabsVersion, subscribeFormTabs,
+    ModelTable, confirmGuardrail, fmt, toast, getFormTabs, formTabsVersion, subscribeFormTabs,
     type Column, type DetailMenuEntry,
 } from '../../../ui';
 import { LOGS_ADMIN_PERMISSIONS, LogModel, type LogRow } from '../../monitoring';
@@ -35,6 +38,8 @@ export interface MemberDetailProps extends MemberNavigationCallbacks {
     readPermissions?: PermSpec;
     /** Same for writes: a fixed-group composition passes the group-local save gate. */
     savePermissions?: PermSpec;
+    /** Fixed-group owner lifetime; closing/changing its panel disposes this detail. */
+    ownerSignal?: AbortSignal;
 }
 
 function AuditTable({ memberId }: { memberId: number }) {
@@ -76,7 +81,7 @@ const ESCALATING_GRANTS: Record<string, { label: string; why: ReactNode }> = {
 };
 
 /** beforeSave gate: stops only when an escalating grant flips ON. */
-function confirmGrantEscalation(member: MemberRow, changes: Record<string, unknown>): Promise<boolean> | true {
+function confirmGrantEscalation(member: MemberRow, changes: Record<string, unknown>, signal?: AbortSignal): Promise<boolean> | true {
     const perms = changes.permissions;
     if (!perms || typeof perms !== 'object') return true;
     const granting = Object.keys(ESCALATING_GRANTS).filter((key) => (perms as Record<string, unknown>)[key] === true);
@@ -85,6 +90,7 @@ function confirmGrantEscalation(member: MemberRow, changes: Record<string, unkno
     const group = member.group?.name || 'this group';
     const labels = granting.map((key) => ESCALATING_GRANTS[key]!.label).join(' + ');
     return confirmGuardrail({
+        signal,
         title: `Grant ${labels} to ${who}?`,
         effect: <><b>{who}</b> holds <b>{granting.join(' and ')}</b> in <b>{group}</b> the moment this saves — there is no save button and no second step.</>,
         why: granting.map((key) => ESCALATING_GRANTS[key]!.why),
@@ -120,14 +126,46 @@ function GrantSummary({ member }: { member: MemberRow }) {
 export function MemberDetail({
     id, onClose, onNavigateUser, onNavigateGroup,
     readPermissions = MEMBER_READ_PERMISSIONS,
-    savePermissions = MEMBER_SAVE_PERMISSIONS,
+    savePermissions = MEMBER_SAVE_PERMISSIONS, ownerSignal,
 }: MemberDetailProps) {
     const qc = useQueryClient();
     const { can: canRead, isLoading: readLoading } = useCan(readPermissions);
     const query = MemberModel.useOne(canRead ? id : null);
-    const save = MemberModel.useSave();
-    const resend = MemberModel.useAction('resend_invite');
     const { can: canSave } = useCan(savePermissions);
+    const owner = `${id}:${canRead}:${canSave}`;
+    const scope = useMemberScope(owner, onClose);
+    useEffect(() => {
+        if (ownerSignal?.aborted) onClose();
+        ownerSignal?.addEventListener('abort', onClose, { once: true });
+        return () => ownerSignal?.removeEventListener('abort', onClose);
+    }, [ownerSignal, onClose]);
+    const isCurrent = () => scope.current?.owner === owner && scope.current.current() && !ownerSignal?.aborted;
+    // Local mutation boundary: generic model hooks publish unconditionally. A late
+    // member response must never write through into the next account's cache.
+    const guardedModel = useMemo(() => ({
+        useSave() {
+            return useMutation({
+                gcTime: 0,
+                mutationFn: async ({ id: target, changes }: SaveVars) => {
+                    const started = scope.current;
+                    const check = () => {
+                        started?.assert();
+                        if (!started || scope.current !== started || ownerSignal?.aborted)
+                            throw new DOMException('Membership context ended', 'AbortError');
+                    };
+                    const row = await withFreshAuth(() => {
+                        check();
+                        return saveMemberInScope(target, changes, check);
+                    });
+                    check();
+                    qc.setQueryData(MemberModel.keys.one(row.id), row);
+                    void MemberModel.invalidate(qc);
+                    return row;
+                },
+            });
+        },
+    }), [qc, scope, ownerSignal]);
+    const save = guardedModel.useSave();
     useSyncExternalStore(subscribeMemberPermissions, memberPermissionsVersion, memberPermissionsVersion);
     useSyncExternalStore(subscribeFormTabs, formTabsVersion, formTabsVersion);
 
@@ -163,39 +201,50 @@ export function MemberDetail({
     const deploymentOnly = raw.filter((name) => !catalogNames.has(name) && !ignoredMemberGrants(member.permissions).includes(name));
 
     const editRole = async () => {
-        const values = await formModal({
-            title: 'Edit role label',
-            submitText: 'Update label',
-            fields: [{
-                name: 'role', type: 'text', label: 'Role label',
-                help: 'Presentation only. This label does not grant authorization.',
-            }],
+        const started = scope.current;
+        if (!canSave || !isCurrent() || !started) return;
+        await memberForm(started, {
+            title: 'Edit role label', submitText: 'Update label',
+            fields: [{ name: 'role', type: 'text', label: 'Role label',
+                help: 'Presentation only. This label does not grant authorization.' }],
             initial: { role },
+        }, async (values, current) => {
+            if (!current() || scope.current !== started) return null;
+            const result = await save.mutateAsync({ id: member.id, changes: { metadata: { role: String(values.role ?? '').trim() } } });
+            if (current()) toast.success('Role label updated');
+            return result;
         });
-        if (!values) return;
-        try {
-            await save.mutateAsync({ id: member.id, changes: { metadata: { role: String(values.role ?? '').trim() } } });
-            toast.success('Role label updated');
-        } catch (error) {
-            toast.error(error instanceof Error ? error.message : 'Role update failed');
-        }
     };
 
     const setActive = async (next: boolean) => {
+        const started = scope.current;
+        if (!canSave || !isCurrent()) return;
         try {
             await save.mutateAsync({ id: member.id, changes: { is_active: next } });
-            toast.success(next ? 'Membership activated' : 'Membership deactivated');
+            if (started?.current() && scope.current === started)
+                toast.success(next ? 'Membership activated' : 'Membership deactivated');
         } catch (error) {
-            toast.error(error instanceof Error ? error.message : 'Membership update failed');
+            if (started?.current() && scope.current === started)
+                toast.error(error instanceof Error ? error.message : 'Membership update failed');
         }
     };
 
     const resendInvite = async () => {
+        const started = scope.current;
+        if (!canSave || !isCurrent() || !started) return;
         try {
-            await resend.mutateAsync({ id: member.id });
+            await withFreshAuth(() => mojoCall(`${MemberModel.endpoint}/${member.id}`, {
+                method: 'POST', body: { resend_invite: {} }, unscoped: true, beforeSend: () => {
+                    started.assert();
+                    if (ownerSignal?.aborted) throw new DOMException('Membership context ended', 'AbortError');
+                },
+            }));
+            if (!started.current() || scope.current !== started) return;
             toast.success('Invitation resent');
+            void MemberModel.invalidate(qc);
         } catch (error) {
-            toast.error(error instanceof Error ? error.message : 'Invitation resend failed');
+            if (started.current() && scope.current === started)
+                toast.error(error instanceof Error ? error.message : 'Invitation resend failed');
         }
     };
 
@@ -225,7 +274,7 @@ export function MemberDetail({
                 { icon: 'bi-person-badge', text: role, tone: 'primary' as const },
                 { text: `${effectiveMemberGrants(member.permissions).length} effective grants`, tone: 'muted' as const },
             ]}
-            active={canSave ? { value: member.is_active, onChange: (next) => { void setActive(next); } } : undefined}
+            active={canSave ? { value: member.is_active, disabled: save.isPending, onChange: (next) => { void setActive(next); } } : undefined}
             contextMenu={menu}
             menuContext={member}
             onClose={onClose}
@@ -259,11 +308,10 @@ export function MemberDetail({
                             {canSave
                                 ? (
                                     <FormView
-                                        model={MemberModel}
+                                        model={guardedModel} isCurrent={isCurrent}
                                         row={member}
                                         fields={groupFields}
-                                        beforeSave={({ changes }) => confirmGrantEscalation(member, changes)}
-                                        onSaved={() => { void MemberModel.invalidate(qc); }}
+                                        beforeSave={({ changes }) => confirmGrantEscalation(member, changes, scope.current?.signal)}
                                     />
                                 )
                                 : <GrantSummary member={member} />}
@@ -279,9 +327,9 @@ export function MemberDetail({
                             <Eyebrow>Product permissions</Eyebrow>
                             <p className="dim">These grants apply only to this membership’s group. Changes save automatically.</p>
                             {canSave ? (
-                                <FormView model={MemberModel} row={member} tabs={productTabs}
-                                    beforeSave={({ changes }) => confirmGrantEscalation(member, changes)}
-                                    onSaved={() => { void MemberModel.invalidate(qc); }} />
+                                <FormView model={guardedModel} isCurrent={isCurrent} row={member} tabs={productTabs}
+                                    beforeSave={({ changes }) => confirmGrantEscalation(member, changes, scope.current?.signal)}
+                                />
                             ) : <GrantSummary member={member} />}
                         </>
                     ),

package/src/admin/identity/members/MembersPage.tsx

@@ -6,6 +6,7 @@ import {
 } from '../../../ui';
 import { MemberDetail, type MemberNavigationCallbacks } from './MemberDetail';
 import { openMemberAdmissionDialog } from './member-flows';
+import { useMemberScope } from './member-scope';
 import {
     MEMBER_INVITE_PERMISSIONS,
     MEMBER_SAVE_PERMISSIONS,
@@ -67,6 +68,8 @@ export function MembersPage({ onNavigateUser, onNavigateGroup }: MemberNavigatio
     const { can: canInvite } = useCan(MEMBER_INVITE_PERMISSIONS);
     const { can: canReadUsers } = useCan(MEMBER_USER_DIRECTORY_PERMISSIONS);
 
+    const admissionScope = useMemberScope(`${canSave}:${canInvite}:${canReadUsers}`);
+
     const batchActions: BatchAction<MemberRow>[] = canSave ? [
         {
             key: 'activate', label: 'Activate', icon: 'bi-check-circle',
@@ -101,6 +104,7 @@ export function MembersPage({ onNavigateUser, onNavigateGroup }: MemberNavigatio
         void modal.detail((close) => (
             <MemberDetail
                 id={member.id}
+                ownerSignal={admissionScope.current?.signal}
                 onClose={() => close(null)}
                 onNavigateUser={onNavigateUser}
                 onNavigateGroup={onNavigateGroup}
@@ -113,6 +117,7 @@ export function MembersPage({ onNavigateUser, onNavigateGroup }: MemberNavigatio
         canCreate: canSave,
         canReadUsers,
         queryClient: qc,
+        signal: admissionScope.current?.signal,
     });
 
     return (

package/src/admin/identity/members/member-dialog.tsx

@@ -0,0 +1,31 @@
+import { SchemaForm, modal, type Field, type FormData } from '../../../ui';
+import type { MemberScope } from './member-scope';
+
+/** Focused form stays mounted through the write; abort/dismiss fences its continuations. */
+export async function memberForm<T = FormData>(scope: MemberScope, opts: {
+    title: string; fields: Field[]; initial?: FormData; submitText?: string;
+}, submit?: (data: FormData, current: () => boolean) => Promise<T>): Promise<T | null> {
+    let open = true;
+    let pending = false;
+    const current = () => open && scope.current();
+    try {
+        return await modal.open<T>((close) => (
+            <div className="modal-pad">
+                <h2 className="modal-title">{opts.title}</h2>
+                <SchemaForm {...opts}
+                    onCancel={() => { open = false; close(null as T); }}
+                    onBusyChange={(busy) => { pending = busy; }}
+                    onSubmit={async (data) => {
+                        if (!current() || pending) return;
+                        pending = true;
+                        try {
+                            const result = submit ? await submit(data, current) : data as T;
+                            if (current()) close(result);
+                        } catch (error) {
+                            if (current()) throw error;
+                        } finally { pending = false; }
+                    }} />
+            </div>
+        ), { signal: scope.signal, canDismiss: () => !pending });
+    } finally { open = false; }
+}

package/src/admin/identity/members/member-flows.tsx

@@ -1,6 +1,8 @@
 import type { QueryClient } from '@tanstack/react-query';
-import { mojoCall, mojoSave, type Group } from '../../../client/runtime';
-import { formModal, modal, toast } from '../../../ui';
+import { mojoCall, type Group } from '../../../client/runtime';
+import { modal, toast } from '../../../ui';
+import { memberForm } from './member-dialog';
+import { captureMemberScope, saveMemberInScope, type MemberScope } from './member-scope';
 import { MemberModel, type MemberRow } from './models';
 
 export interface AdmissionGroup extends Pick<Group, 'id' | 'name' | 'kind'> {}
@@ -14,9 +16,10 @@ export interface AdmissionRole {
 }
 
 /** Email-only, with no user-directory lookup or existence-dependent branch. */
-export async function inviteMemberByEmail(groupId: number, email: string, permissions?: string[]): Promise<MemberRow | null> {
+export async function inviteMemberByEmail(groupId: number, email: string, permissions?: string[], beforeSend?: () => void): Promise<MemberRow | null> {
     const response = await mojoCall('/api/group/member/invite', {
         method: 'POST',
+        beforeSend,
         body: {
             group: groupId, email: email.trim(),
             ...(permissions?.length ? { permissions: Object.fromEntries(permissions.map((name) => [name, true])) } : {}),
@@ -27,7 +30,7 @@ export async function inviteMemberByEmail(groupId: number, email: string, permis
 
 export type AdmissionMode = 'invite' | 'add';
 
-function chooseAdmissionMode(group: AdmissionGroup, showInvite: boolean, showAdd: boolean): Promise<AdmissionMode | null> {
+function chooseAdmissionMode(group: AdmissionGroup, showInvite: boolean, showAdd: boolean, signal: AbortSignal): Promise<AdmissionMode | null> {
     return modal.open<AdmissionMode>((close) => (
         <div className="modal-pad">
             <h2 className="modal-title">Add a member to {group.name}</h2>
@@ -50,11 +53,11 @@ function chooseAdmissionMode(group: AdmissionGroup, showInvite: boolean, showAdd
                 <button type="button" className="btn" onClick={() => close(null as unknown as AdmissionMode)}>Cancel</button>
             </div>
         </div>
-    ), { size: 'md' });
+    ), { size: 'md', signal });
 }
 
-async function pickGroup(): Promise<AdmissionGroup | null> {
-    const data = await formModal({
+async function pickGroup(scope: MemberScope): Promise<AdmissionGroup | null> {
+    const data = await memberForm(scope, {
         title: 'Choose a group',
         submitText: 'Continue',
         fields: [{
@@ -83,30 +86,26 @@ export interface OpenMemberAdmissionOptions {
     onCreated?: (member: MemberRow) => void | Promise<void>;
     /** Fixed roles shown as a select on the invite form; the first is the default. */
     roles?: AdmissionRole[];
+    /** Abort when the initiating panel unmounts or its group/authority changes. */
+    signal?: AbortSignal;
 }
 
 /** Shared explicit Invite/Add chooser used by global Members and GroupDetail. */
 export async function openMemberAdmissionDialog(options: OpenMemberAdmissionOptions): Promise<MemberRow | null> {
-    const group = options.group ?? await pickGroup();
-    if (!group) return null;
-    const canAddExisting = options.canCreate && options.canReadUsers;
-    if (!options.canInvite && !canAddExisting) return null;
-
-    const allowedInitial = options.initialMode === 'invite'
-        ? options.canInvite
-        : options.initialMode === 'add'
-            ? canAddExisting
-            : false;
-    const mode = allowedInitial
-        ? options.initialMode!
-        : await chooseAdmissionMode(group, options.canInvite, canAddExisting);
-    if (!mode) return null;
-
+    const scope = captureMemberScope(options.signal);
     try {
-        let member: MemberRow | null;
-        if (mode === 'invite') {
-            const roles = options.roles ?? [];
-            const data = await formModal({
+        const group = options.group ?? await pickGroup(scope);
+        if (!scope.current() || !group) return null;
+        const canAddExisting = options.canCreate && options.canReadUsers;
+        if (!options.canInvite && !canAddExisting) return null;
+        const allowedInitial = options.initialMode === 'invite' ? options.canInvite
+            : options.initialMode === 'add' ? canAddExisting : false;
+        const mode = allowedInitial ? options.initialMode!
+            : await chooseAdmissionMode(group, options.canInvite, canAddExisting, scope.signal);
+        if (!scope.current() || !mode) return null;
+        const roles = options.roles ?? [];
+        const result = mode === 'invite'
+            ? await memberForm<{ member: MemberRow | null } | null>(scope, {
                 title: `Invite a member to ${group.name}`,
                 submitText: 'Send invitation',
                 fields: [{
@@ -118,21 +117,28 @@ export async function openMemberAdmissionDialog(options: OpenMemberAdmissionOpti
                     help: roles.map((role) => role.help ? `${role.label}: ${role.help}` : null).filter(Boolean).join(' '),
                 }] : [])],
                 ...(roles.length ? { initial: { role: roles[0].value } } : {}),
-            });
-            if (!data?.email) return null;
-            const role = roles.find((candidate) => candidate.value === data.role) ?? roles[0];
-            member = await inviteMemberByEmail(group.id, String(data.email), role?.permissions);
-            // The role label is display-only; the grants above are the authority. A failed
-            // label write leaves a correctly permissioned member, so it is not fatal.
-            if (member && role) {
-                try { member = await mojoSave<MemberRow>(MemberModel.endpoint, member.id, { metadata: { role: role.label } }); }
-                catch { /* label stays "Member"; grants already applied */ }
-            }
-            toast.success('Invitation request accepted');
-        } else {
-            const data = await formModal({
-                title: `Add an existing user to ${group.name}`,
-                submitText: 'Add to group',
+            }, async (data, current) => {
+                const role = roles.find((candidate) => candidate.value === data.role) ?? roles[0];
+                let result = await inviteMemberByEmail(group.id, String(data.email), role?.permissions, () => {
+                    scope.assert();
+                    if (!current()) throw new DOMException('Member dialog closed', 'AbortError');
+                });
+                if (!current()) return null;
+                // The grants are authoritative. A refused display-label write is non-fatal.
+                if (result && role) {
+                    try {
+                        result = await saveMemberInScope(result.id, { metadata: { role: role.label } }, () => {
+                            scope.assert();
+                            if (!current()) throw new DOMException('Member dialog closed', 'AbortError');
+                        });
+                    } catch { /* invitation already accepted; keep its authoritative row */ }
+                }
+                if (!current()) return null;
+                toast.success('Invitation request accepted');
+                return { member: result };
+            })
+            : await memberForm<{ member: MemberRow }>(scope, {
+                title: `Add an existing user to ${group.name}`, submitText: 'Add to group',
                 fields: [{
                     name: 'user', type: 'collection', label: 'User', required: true,
                     endpoint: '/api/user', labelField: 'email', valueField: 'id',
@@ -140,19 +146,23 @@ export async function openMemberAdmissionDialog(options: OpenMemberAdmissionOpti
                     placeholder: 'Search users by email…',
                     help: 'This directory-backed option is available only to authorized user-directory viewers.',
                 }],
+            }, async (data, current) => {
+                const result = await saveMemberInScope(null,
+                    { group: group.id, user: Number(data.user) }, () => {
+                        scope.assert();
+                        if (!current()) throw new DOMException('Member dialog closed', 'AbortError');
+                    });
+                if (current()) toast.success('Existing user added to the group');
+                return { member: result };
             });
-            if (data?.user == null || data.user === '') return null;
-            member = await mojoSave<MemberRow>(MemberModel.endpoint, null, {
-                group: group.id,
-                user: Number(data.user),
-            });
-            toast.success('Existing user added to the group');
-        }
+        if (!scope.current() || !result) return null;
+        const member = result.member;
         if (member) await options.onCreated?.(member);
+        if (!scope.current()) return null;
         if (options.queryClient) await MemberModel.invalidate(options.queryClient);
-        return member;
+        return scope.current() ? member : null;
     } catch (error) {
-        toast.error(error instanceof Error ? error.message : 'Member admission failed');
+        if (scope.current()) toast.error(error instanceof Error ? error.message : 'Member admission failed');
         return null;
-    }
+    } finally { scope.dispose(); }
 }

package/src/admin/identity/members/member-scope.ts

@@ -0,0 +1,61 @@
+import { useLayoutEffect, useMemo, useRef } from 'react';
+import { getAuthSessionRevision, getAuthSnapshot, subscribeAuth } from '../../../client/auth';
+import { mojoCall } from '../../../client/client';
+import { MemberModel, type MemberRow } from './models';
+import { getActiveGroupId, subscribeActiveGroup } from '../../../client/active-group';
+
+/** A one-way fence: switching away and back never revives an old operation. */
+export function captureMemberScope(owner?: AbortSignal) {
+    const controller = new AbortController();
+    const actor = getAuthSnapshot();
+    const revision = getAuthSessionRevision();
+    const group = getActiveGroupId();
+    const abort = () => controller.abort();
+    const current = () => !controller.signal.aborted
+        && getAuthSessionRevision() === revision
+        && getAuthSnapshot().uid === actor.uid
+        && getAuthSnapshot().authenticated === actor.authenticated
+        && getActiveGroupId() === group;
+    const observe = () => { if (!current()) abort(); };
+    const offAuth = subscribeAuth(observe);
+    const offGroup = subscribeActiveGroup(observe);
+    owner?.addEventListener('abort', abort, { once: true });
+    if (owner?.aborted) abort();
+    return {
+        signal: controller.signal,
+        current,
+        assert() { if (!current()) throw new DOMException('Membership context ended', 'AbortError'); },
+        dispose() { offAuth(); offGroup(); owner?.removeEventListener('abort', abort); abort(); },
+    };
+}
+
+export type MemberScope = ReturnType<typeof captureMemberScope>;
+
+/** Mounted owner lifetime, also replaced when its record or authority changes. */
+export function useMemberScope(owner: string, onInvalidated?: () => void) {
+    // A new reference per owner keeps old async callbacks attached to the disposed
+    // scope even if authority changes away and back to the same values.
+    const scope = useMemo<{ current: (MemberScope & { owner: string }) | null }>(
+        () => ({ current: null }), [owner]);
+    const callback = useRef(onInvalidated);
+    callback.current = onInvalidated;
+    useLayoutEffect(() => {
+        const next = { ...captureMemberScope(), owner };
+        scope.current = next;
+        const invalidated = () => callback.current?.();
+        next.signal.addEventListener('abort', invalidated, { once: true });
+        return () => {
+            next.signal.removeEventListener('abort', invalidated);
+            next.dispose();
+        };
+    }, [owner, scope]);
+    return scope;
+}
+
+/** Keep the final pre-send check after the transport's asynchronous auth refresh. */
+export async function saveMemberInScope(id: number | string | null, changes: Record<string, unknown>, beforeSend: () => void): Promise<MemberRow> {
+    const response = await mojoCall(id == null ? MemberModel.endpoint : `${MemberModel.endpoint}/${id}`, {
+        method: 'POST', body: changes, unscoped: id != null, beforeSend,
+    });
+    return response.data as MemberRow;
+}

package/src/admin/storage/FileManagerDetail.tsx

@@ -3,7 +3,7 @@ import { useState } from 'react';
 import { useCan } from '../../client/runtime';
 import { Badge, DetailView, FlatRow, fmt, modal, toast } from '../../ui';
 import { FileView } from './FileView';
-import { FileManagerModel, FileModel, GROUP_DIRECTORY_PERMS, STORAGE_MANAGE_PERMS, USER_DIRECTORY_PERMS, runFileManagerAction, saveFileManagerAtomic, storageRelationId } from './models';
+import { FileManagerModel, FileModel, GROUP_DIRECTORY_PERMS, STORAGE_MANAGE_PERMS, USER_DIRECTORY_PERMS, cdnFindings, runFileManagerAction, saveFileManagerAtomic, storageRelationId, type CdnFinding, type FileManagerCdn } from './models';
 import { openFileManagerEditor } from './storage-dialogs';
 
 function NestedFiles({ managerId }: { managerId: number }) {
@@ -14,6 +14,30 @@ function NestedFiles({ managerId }: { managerId: number }) {
     return <div className="storage-child-files">{rows.length === 0 ? <p className="dim">No files. Upload is unavailable in this release.</p> : rows.map((file) => <button key={file.id} className="storage-child-file" onClick={() => void modal.detail((close) => <FileView id={file.id} onClose={() => close(null)} />)}><span><b>{file.filename}</b><small>{file.content_type} · {fmt.filesize(file.file_size ?? 0)}</small></span><i className="bi bi-chevron-right" /></button>)}</div>;
 }
 
+const CDN_TONES: Record<string, 'success' | 'warning' | 'danger' | 'info' | 'muted'> = {
+    PASS: 'success', PENDING: 'info', DRIFT: 'warning', MISSING: 'warning', MANUAL: 'danger', BLOCKED: 'danger', BLIND: 'danger',
+};
+
+/** The findings of a CDN enable/check/disable report: status, code, message, remedy. Never raw JSON. */
+function CdnReport({ title, findings, summary }: { title: string; findings: CdnFinding[]; summary: string }) {
+    return <div className="modal-pad storage-cdn-report">
+        <h2 className="modal-title">{title}</h2>
+        <p className="modal-message">{summary}</p>
+        {findings.length === 0 ? <p className="dim">No findings.</p> : <div className="storage-cdn-findings">{findings.map((item, index) => <div className="storage-cdn-finding" key={`${item.code}-${index}`}>
+            <div><Badge tone={CDN_TONES[item.status] ?? 'muted'}>{item.status}</Badge> <code>{item.step}/{item.code}</code></div>
+            <p>{item.message}</p>
+            {item.remedy && <pre className="storage-result-json">{item.remedy}</pre>}
+        </div>)}</div>}
+    </div>;
+}
+
+function cdnSummary(cdn: FileManagerCdn | undefined): string {
+    if (!cdn?.enabled) return 'Not enabled';
+    const delivery = cdn.signed ? 'signed links' : 'public links';
+    const state = cdn.status === 'deployed' ? 'ready' : cdn.status === 'pending' ? 'deploying' : cdn.status ?? 'unknown';
+    return `${cdn.url ?? '—'} · ${delivery} · ${state}${cdn.source === 'byo' ? ' · brought by the operator' : ''}`;
+}
+
 export function FileManagerDetail({ id, onClose }: { id: number; onClose: () => void }) {
     const queryClient = useQueryClient();
     const [pending, setPending] = useState(false);
@@ -28,6 +52,36 @@ export function FileManagerDetail({ id, onClose }: { id: number; onClose: () =>
     const row = query.data;
     const edit = async (mode: 'general' | 'credentials' | 'owner') => { const saved = await openFileManagerEditor(mode, row); if (saved) { toast.success(`${saved.name} updated`); await query.refetch(); } };
     const action = async (name: 'test_connection' | 'check_cors' | 'fix_cors') => { try { const result = await runFileManagerAction(id, name); toast.success(name === 'test_connection' ? 'Connection succeeded' : `${name.replace('_', ' ')} completed`); await modal.open((close) => <div className="modal-pad"><h2 className="modal-title">{name.replaceAll('_', ' ')}</h2><pre className="storage-result-json">{JSON.stringify(result, null, 2)}</pre><div className="modal-actions"><button className="btn" onClick={() => close(null)}>Close</button></div></div>); } catch (error) { toast.error(error instanceof Error ? error.message : `${name} failed`); } };
+    const cdnAction = async (name: 'enable_cdn' | 'check_cdn' | 'disable_cdn', value: unknown = true) => {
+        try {
+            const result = await runFileManagerAction(id, name, value);
+            const report = (result.result ?? {}) as Record<string, unknown>;
+            const findings = cdnFindings(report);
+            const summary = name === 'disable_cdn'
+                ? (report.disabled ? `Every backend on this bucket now hands out S3 links again${report.retired ? '; the distribution is disabled' : ''}. Nothing was deleted.` : 'No CDN was configured for this bucket.')
+                : report.converged
+                    ? (name === 'enable_cdn' ? 'CDN delivery is set up. Links are issued now and start working once CloudFront reports Deployed.' : 'The CDN setup is complete.')
+                    : 'Something still needs attention. Each finding below says what, and how to fix it.';
+            await query.refetch();
+            await modal.open((close) => <><CdnReport title={name === 'enable_cdn' ? 'Enable CDN' : name === 'check_cdn' ? 'Check CDN' : 'Disable CDN'} findings={findings} summary={summary} /><div className="modal-actions"><button className="btn" onClick={() => close(null)}>Close</button></div></>, { size: 'lg' });
+        } catch (error) { toast.error(error instanceof Error ? error.message : `${name} failed`); }
+    };
+    const enableCdn = async () => {
+        const ok = await modal.confirm({
+            title: 'Enable CDN delivery?',
+            message: <>django-mojo will set up CloudFront for the whole bucket behind <b>{row.name}</b> under the deployment's AWS identity: the distribution, its private access to the bucket, the signing key, and the bucket and encryption-key policies. Running it again creates nothing. Public backends on the bucket get public links; private ones get signed links.</>,
+            confirmText: 'Enable CDN',
+        });
+        if (ok) await cdnAction('enable_cdn', { harden: false });
+    };
+    const disableCdn = async () => {
+        const ok = await modal.confirm({
+            title: 'Disable CDN delivery?',
+            message: <>Every backend on the bucket behind <b>{row.name}</b> goes back to S3 links on its next request. Nothing in AWS is changed or deleted; the distribution stays and can be enabled again.</>,
+            confirmText: 'Disable CDN', danger: true,
+        });
+        if (ok) await cdnAction('disable_cdn', { retire: false });
+    };
     const clone = async () => { const ok = await modal.confirm({ title: 'Clone backend?', message: <>Create a private clone of <b>{row.name}</b> under the same explicit owner scope?</>, confirmText: 'Clone' }); if (!ok) return; try { await runFileManagerAction(id, 'clone'); await FileManagerModel.invalidate(queryClient); toast.success(`${row.name} cloned`); } catch (error) { toast.error(error instanceof Error ? error.message : 'Clone failed'); } };
     const toggle = async () => { const ok = await modal.confirm({ title: row.is_public ? 'Make backend private?' : 'Make backend public?', message: 'This changes prefix policy on the storage provider. Continue?', confirmText: row.is_public ? 'Make private' : 'Make public', danger: !row.is_public }); if (!ok) return; try { await saveFileManagerAtomic({ queryClient, id, changes: { is_public: !row.is_public } }); await query.refetch(); } catch (error) { toast.error(error instanceof Error ? error.message : 'Access change failed'); } };
     const setActive = async (next: boolean) => {
@@ -45,9 +99,13 @@ export function FileManagerDetail({ id, onClose }: { id: number; onClose: () =>
             { label: row.is_public ? 'Make private…' : 'Make public…', onSelect: () => void toggle() },
             { label: 'Test connection', onSelect: () => void action('test_connection') },
             ...(row.backend_type === 's3' ? [{ label: 'Check CORS', onSelect: () => void action('check_cors') }, { label: 'Fix CORS', onSelect: () => void action('fix_cors') }] : []),
+            ...(row.backend_type === 's3' ? [
+                { label: 'Check CDN', onSelect: () => void cdnAction('check_cdn') },
+                ...(row.cdn?.enabled ? [{ label: 'Disable CDN…', danger: true, onSelect: () => void disableCdn() }] : [{ label: 'Enable CDN…', onSelect: () => void enableCdn() }]),
+            ] : []),
             { label: 'Clone…', onSelect: () => void clone() },
         ] : []} title={row.name} subtitle={`${row.backend_type} · ${row.backend_url}`} icon="bi-hdd-stack" chips={[{ text: row.is_active ? 'Active' : 'Inactive', tone: row.is_active ? 'success' : 'muted' }, { text: row.is_public ? 'Public' : 'Private', tone: row.is_public ? 'warning' : 'success' }]} sections={[
-        { key: 'overview', label: 'Overview', icon: 'bi-info-circle', render: () => <div className="detail-section"><FlatRow label="Backend"><Badge tone="info">{row.backend_type}</Badge></FlatRow><FlatRow label="Use">{row.use || '—'}</FlatRow><FlatRow label="URL"><code>{row.backend_url}</code></FlatRow><FlatRow label="Owner">{storageRelationId(row.group) != null ? `Group #${storageRelationId(row.group)}` : storageRelationId(row.user) != null ? `User #${storageRelationId(row.user)}` : 'System'}</FlatRow><FlatRow label="Default">{row.is_default ? 'Yes' : 'No'}</FlatRow><FlatRow label="Region">{row.aws_region || '—'}</FlatRow><FlatRow label="Access key">{row.aws_key_masked || 'Not configured'}</FlatRow><FlatRow label="Secret key">{row.aws_secret_masked || 'Not configured'}</FlatRow><FlatRow label="Created">{fmt.datetime(row.created)}</FlatRow></div> },
+        { key: 'overview', label: 'Overview', icon: 'bi-info-circle', render: () => <div className="detail-section"><FlatRow label="Backend"><Badge tone="info">{row.backend_type}</Badge></FlatRow><FlatRow label="Use">{row.use || '—'}</FlatRow><FlatRow label="URL"><code>{row.backend_url}</code></FlatRow><FlatRow label="Owner">{storageRelationId(row.group) != null ? `Group #${storageRelationId(row.group)}` : storageRelationId(row.user) != null ? `User #${storageRelationId(row.user)}` : 'System'}</FlatRow><FlatRow label="Default">{row.is_default ? 'Yes' : 'No'}</FlatRow><FlatRow label="Region">{row.aws_region || '—'}</FlatRow><FlatRow label="Access key">{row.aws_key_masked || 'Not configured'}</FlatRow><FlatRow label="Secret key">{row.aws_secret_masked || 'Not configured'}</FlatRow>{row.backend_type === 's3' && <FlatRow label="CDN">{cdnSummary(row.cdn)}</FlatRow>}<FlatRow label="Created">{fmt.datetime(row.created)}</FlatRow></div> },
         { key: 'files', label: 'Files', icon: 'bi-files', render: () => <div className="detail-section"><h3>Recent files</h3><p className="dim">Newest 10 for this backend. This bounded child inventory does not own URL table state.</p><NestedFiles managerId={id} /></div> },
 
     ]} initialSection="overview" onClose={onClose} />;

package/src/admin/storage/MediaRenderingPage.tsx

@@ -94,9 +94,10 @@ function RoleField({ category, draft, role, kind, name, error, disabled, onChang
 function CategoryPanel({ category, categoryKey }: { category: RenditionCategory; categoryKey: string }) {
     const queryClient = useQueryClient();
     const rowsQuery = useQuery({ queryKey: rowQueryKey(category.key), queryFn: () => findCategoryRows(category.key), retry: false, refetchOnWindowFocus: false });
-    const rows = rowsQuery.data ?? [];
-    const row: SettingRow | null = rows[0] ?? null;
-    const duplicates = rows.length > 1;
+    // Rows only from a successful read: a failed or pending read is "unknown", never "no row".
+    const rows = rowsQuery.isSuccess ? rowsQuery.data : null;
+    const row: SettingRow | null = rows?.[0] ?? null;
+    const duplicates = (rows?.length ?? 0) > 1;
     const [draft, setDraft] = useState<CategoryDraft>(() => valueToDraft(category, category.override));
     const [errors, setErrors] = useState<Record<string, string>>({});
     const [formError, setFormError] = useState('');
@@ -134,6 +135,7 @@ function CategoryPanel({ category, categoryKey }: { category: RenditionCategory;
         setErrors((current) => ({ ...current, [key]: routed.message }));
     };
     const save = async () => {
+        if (!rowsQuery.isSuccess || duplicates) return;
         setBusy(true); setFormError(''); setErrors({});
         try {
             await saveCategoryValue(category, row, value);
@@ -146,6 +148,7 @@ function CategoryPanel({ category, categoryKey }: { category: RenditionCategory;
         }
     };
     const reset = async () => {
+        if (!rowsQuery.isSuccess || duplicates) return;
         const ok = await modal.confirm({
             title: `Reset ${renditionCategoryLabel(categoryKey).toLowerCase()} rendering to defaults?`,
             message: 'Every role goes back to the framework defaults and the default set of roles runs on upload. Existing files are not touched.',
@@ -155,8 +158,9 @@ function CategoryPanel({ category, categoryKey }: { category: RenditionCategory;
         if (!ok) return;
         setBusy(true); setFormError(''); setErrors({});
         try {
-            await resetCategory(category, row);
-            toast.success(`${renditionCategoryLabel(categoryKey)} rendering reset to defaults`);
+            const resetRow = await resetCategory(category, row);
+            if (resetRow) toast.success(`${renditionCategoryLabel(categoryKey)} rendering reset to defaults`);
+            else toast.info('There was no stored override to reset.');
             await refresh();
         } catch (reason) {
             fail(reason);
@@ -165,14 +169,17 @@ function CategoryPanel({ category, categoryKey }: { category: RenditionCategory;
         }
     };
 
-    const disabled = busy || duplicates || rowsQuery.isPending;
+    const disabled = busy || duplicates || !rowsQuery.isSuccess;
+    const status = rowsQuery.isPending ? 'Reading the current override…'
+        : rowsQuery.isError ? 'The current override could not be read — Save is disabled until it loads.'
+        : row ? `Override row #${row.id}` : 'No override row yet — Save creates one.';
     return <div className="media-rendering-panel">
         {hasH265 && <p className="media-rendering-note">
             <b>H.265 (HEVC)</b> encodes take several times longer than H.264 and do not play in every browser. Keep <code>video_mp4</code> as the H.264 compatibility rendition and enable <code>video_hevc</code> on upload only when the extra encode time is worth it.
         </p>}
         {rowsQuery.error && <div className="form-alert" role="alert">The current override could not be read: {rowsQuery.error.message} <button className="btn btn-compact" onClick={() => void rowsQuery.refetch()}>Retry</button></div>}
         {duplicates && <div className="form-alert" role="alert">
-            More than one global row exists for <code>{category.key}</code> (ids {rows.map((entry) => entry.id).join(', ')}). The server reads an undefined one, so this page will not edit them; remove the duplicates on the server first.
+            More than one global row exists for <code>{category.key}</code> (ids {rows?.map((entry) => entry.id).join(', ')}). The server reads an undefined one, so this page will not edit them; remove the duplicates on the server first.
         </div>}
         {formError && <div className="form-alert" role="alert">{formError}</div>}
         <div className="media-rendering-roles">
@@ -210,7 +217,7 @@ function CategoryPanel({ category, categoryKey }: { category: RenditionCategory;
         <div className="media-rendering-actions">
             <button className="btn btn-primary" disabled={disabled || !dirty} onClick={() => void save()}>{busy ? 'Saving…' : 'Save'}</button>
             <button className="btn" disabled={disabled || !row || category.override == null} onClick={() => void reset()}>Reset to defaults…</button>
-            <span className="dim">{row ? `Override row #${row.id}` : 'No override row yet — Save creates one.'}</span>
+            <span className="dim">{status}</span>
         </div>
     </div>;
 }

package/src/admin/storage/models.ts

@@ -13,6 +13,23 @@ export const USER_DIRECTORY_PERMS = USER_VIEW_PERMISSIONS;
 
 export interface RelationRow { id: number; name?: string | null; display_name?: string | null; email?: string | null }
 
+/** The manager graph's read-only `cdn` object (django-mojo #8250). */
+export interface FileManagerCdn {
+    enabled: boolean;
+    url?: string;
+    bucket?: string;
+    distribution_id?: string;
+    source?: string;
+    status?: string;
+    signed?: boolean;
+    signing_key_id?: string | null;
+}
+
+export type FileManagerAction = 'test_connection' | 'check_cors' | 'fix_cors' | 'clone' | 'enable_cdn' | 'check_cdn' | 'disable_cdn';
+
+/** One finding of a CDN enable/check/disable report, aws-check shaped. */
+export interface CdnFinding { step: string; status: string; code: string; message: string; remedy: string | null }
+
 export interface FileManagerRow {
     id: number;
     created: number;
@@ -29,6 +46,7 @@ export interface FileManagerRow {
     allowed_origins?: string[];
     assume_role_arn?: string | null;
     has_external_id?: boolean;
+    cdn?: FileManagerCdn;
     group?: RelationRow | number | null;
     user?: RelationRow | number | null;
 }
@@ -181,11 +199,41 @@ export function sanitizeFileManagerRow(input: FileManagerRow): FileManagerRow {
         allowed_origins: Array.isArray(raw.allowed_origins) ? raw.allowed_origins.map(String) : [],
         assume_role_arn: raw.assume_role_arn == null ? null : String(raw.assume_role_arn),
         has_external_id: Boolean(raw.has_external_id),
+        cdn: projectCdn(raw.cdn),
         group: relation(raw.group),
         user: relation(raw.user),
     };
 }
 
+/** Positive projection of the `cdn` object: named keys only, never key material. */
+export function projectCdn(value: unknown): FileManagerCdn {
+    if (value == null || typeof value !== 'object' || Array.isArray(value)) return { enabled: false };
+    const raw = value as Record<string, unknown>;
+    if (raw.enabled !== true) return { enabled: false };
+    const text = (key: string) => (typeof raw[key] === 'string' ? raw[key] as string : undefined);
+    return {
+        enabled: true,
+        url: text('url'), bucket: text('bucket'), distribution_id: text('distribution_id'),
+        source: text('source'), status: text('status'), signed: raw.signed === true,
+        signing_key_id: typeof raw.signing_key_id === 'string' ? raw.signing_key_id : null,
+    };
+}
+
+/** The findings list out of an enable/check/disable action result. */
+export function cdnFindings(result: unknown): CdnFinding[] {
+    if (result == null || typeof result !== 'object') return [];
+    const items = (result as Record<string, unknown>).items;
+    if (!Array.isArray(items)) return [];
+    return items.flatMap((item) => {
+        if (item == null || typeof item !== 'object') return [];
+        const raw = item as Record<string, unknown>;
+        return [{
+            step: String(raw.step ?? ''), status: String(raw.status ?? ''), code: String(raw.code ?? ''),
+            message: String(raw.message ?? ''), remedy: typeof raw.remedy === 'string' ? raw.remedy : null,
+        }];
+    });
+}
+
 export function sanitizeFileManagerUploadPolicyRow(input: FileManagerUploadPolicyRow): FileManagerUploadPolicyRow {
     const raw = input as unknown as Record<string, unknown>;
     const id = Number(raw.id);
@@ -367,7 +415,7 @@ export function storageRefreshFailure(error: unknown): unknown {
 // hand-normalize the wrapped `{data:{status:false, error}}` shape themselves
 // and answer a caller-shaped `{status, id, result}` evidence dict — migrating
 // would change both the thrown type and the resolved shape for no gain.
-export async function runFileManagerAction(id: number, action: 'test_connection' | 'check_cors' | 'fix_cors' | 'clone', value: unknown = true): Promise<Record<string, unknown>> {
+export async function runFileManagerAction(id: number, action: FileManagerAction, value: unknown = true): Promise<Record<string, unknown>> {
     const body = await mojoCall(`${FileManagerModel.endpoint}/${id}`, { method: 'POST', body: { [action]: value } });
     const data = body.data;
     if (!data || typeof data !== 'object' || Array.isArray(data)) throw new Error(`${action} returned no result`);

package/src/admin/storage/rendition-settings.ts

@@ -6,7 +6,7 @@
 // Everything about roles, fields, choices and limits comes from the
 // descriptor. The ONE rule this module hardcodes is the mp4-only trio
 // (`codec`/`crf`/`preset`), which the server refuses on a non-mp4 role.
-import { mojoCall, mojoList, mojoSave, withFreshAuth } from '../../client/runtime';
+import { isReauthRequired, mojoCall, mojoList, mojoSave, withFreshAuth } from '../../client/runtime';
 import type { SettingRow } from '../settings/model';
 
 export type RenditionCategoryKey = 'image' | 'video' | 'document';
@@ -251,13 +251,36 @@ export function routeRenditionError(message: string, knownRoles: readonly string
     return { role: role!, field: field ?? null, message: rest! };
 }
 
-/** Create or update the category's global row. Imperative; a failure rejects. */
+/**
+ * Create or update the category's global row. Imperative; a failure rejects.
+ * With `row === null` the handler proves the row is absent before creating:
+ * it re-reads the global rows and refuses (no write) when that read fails or
+ * finds a row, so no caller creates one blind. The read and the create are
+ * separate requests: two admins saving at the same moment can still both
+ * create (#8200 Challenge row 2); server-side uniqueness is #8201.
+ */
 export async function saveCategoryValue(category: RenditionCategory, row: SettingRow | null, value: Record<string, unknown>): Promise<SettingRow> {
     const changes: Record<string, unknown> = row ? { value } : { key: category.key, is_secret: false, group: null, value };
-    return withFreshAuth(() => mojoSave<SettingRow>('/api/settings', row?.id ?? null, changes));
+    return withFreshAuth(async () => {
+        if (!row) {
+            let existing: SettingRow[];
+            try {
+                existing = await findCategoryRows(category.key);
+            } catch (error) {
+                // A step-up refusal goes back to withFreshAuth, which re-runs the read after re-login.
+                if (isReauthRequired(error)) throw error;
+                throw new Error('The current override could not be read, so nothing was saved. Retry the read first.');
+            }
+            if (existing.length) throw new Error(`A global row for ${category.key} already exists (id ${existing.map((entry) => entry.id).join(', ')}); reload before saving.`);
+        }
+        return mojoSave<SettingRow>('/api/settings', row?.id ?? null, changes);
+    });
 }
 
-/** Reset = write `{}`. The live Setting model refuses DELETE, and `{}` is reported as `override: null`. */
+/**
+ * Reset = write `{}`. The live Setting model refuses DELETE, and `{}` is reported as `override: null`.
+ * Resolves `null` when `row` is null: nothing was reset and nothing was sent.
+ */
 export async function resetCategory(category: RenditionCategory, row: SettingRow | null): Promise<SettingRow | null> {
     if (!row) return null;
     return saveCategoryValue(category, row, {});

package/src/client/mock.ts

@@ -4149,6 +4149,7 @@ interface MockFileManager {
     aws_key_masked: string | null; aws_secret_masked: string | null; allowed_origins: string[];
     assume_role_arn: string | null; has_external_id: boolean; group: number | null; user: number | null;
     max_file_size: number; allowed_extensions: string[]; allowed_mime_types: string[]; supports_direct_upload: boolean;
+    cdn?: Record<string, unknown>;
 }
 
 interface MockStorageFile {
@@ -4267,7 +4268,7 @@ function buildFileManagers(): MockFileManager[] {
     const now = Math.floor(Date.now() / 1000);
     return [
         { id: 4101, created: now - 410 * 86400, name: 'Private uploads', use: 'uploads', backend_type: 's3', backend_url: 's3://mojo-private-assets/uploads', is_active: true, is_default: true, is_public: false, aws_region: 'us-west-2', aws_key_masked: 'AKIA••••7D2Q', aws_secret_masked: '••••••••••m9p', allowed_origins: ['https://admin.example.test'], assume_role_arn: null, has_external_id: false, group: 1, user: null, max_file_size: 25_000_000, allowed_extensions: ['jpg', 'png', 'pdf', 'txt'], allowed_mime_types: ['image/*', 'application/pdf', 'text/plain'], supports_direct_upload: true },
-        { id: 4102, created: now - 320 * 86400, name: 'Public media', use: 'media', backend_type: 's3', backend_url: 's3://mojo-public-media/media', is_active: true, is_default: false, is_public: true, aws_region: 'us-west-2', aws_key_masked: 'AKIA••••3K8M', aws_secret_masked: '••••••••••r2x', allowed_origins: ['https://example.test'], assume_role_arn: null, has_external_id: false, group: null, user: 14, max_file_size: 50_000_000, allowed_extensions: [], allowed_mime_types: ['image/*', 'video/*'], supports_direct_upload: true },
+        { cdn: { enabled: true, url: 'https://d2mockmedia.cloudfront.net', bucket: 'mojo-public-media', distribution_id: 'E2MOCKMEDIA', source: 'provisioned', status: 'deployed', signed: false, signing_key_id: 'K2MOCKKEY' }, id: 4102, created: now - 320 * 86400, name: 'Public media', use: 'media', backend_type: 's3', backend_url: 's3://mojo-public-media/media', is_active: true, is_default: false, is_public: true, aws_region: 'us-west-2', aws_key_masked: 'AKIA••••3K8M', aws_secret_masked: '••••••••••r2x', allowed_origins: ['https://example.test'], assume_role_arn: null, has_external_id: false, group: null, user: 14, max_file_size: 50_000_000, allowed_extensions: [], allowed_mime_types: ['image/*', 'video/*'], supports_direct_upload: true },
         { id: 4103, created: now - 70 * 86400, name: 'Local archive', use: 'archive', backend_type: 'file', backend_url: '/srv/mojo/archive', is_active: false, is_default: false, is_public: false, aws_region: null, aws_key_masked: null, aws_secret_masked: null, allowed_origins: [], assume_role_arn: null, has_external_id: false, group: 2, user: null, max_file_size: 0, allowed_extensions: [], allowed_mime_types: [], supports_direct_upload: false },
         { id: 4104, created: now - 30 * 86400, name: 'System uploads', use: 'uploads', backend_type: 'file', backend_url: '/srv/mojo/uploads', is_active: true, is_default: false, is_public: false, aws_region: null, aws_key_masked: null, aws_secret_masked: null, allowed_origins: [], assume_role_arn: null, has_external_id: false, group: null, user: null, max_file_size: 0, allowed_extensions: [], allowed_mime_types: [], supports_direct_upload: false },
         { id: 4105, created: now - 20 * 86400, name: 'Ian uploads', use: 'uploads', backend_type: 'file', backend_url: '/srv/mojo/users/1', is_active: true, is_default: false, is_public: false, aws_region: null, aws_key_masked: null, aws_secret_masked: null, allowed_origins: [], assume_role_arn: null, has_external_id: false, group: null, user: 1, max_file_size: 0, allowed_extensions: [], allowed_mime_types: [], supports_direct_upload: false },
@@ -6631,10 +6632,33 @@ function serializeStorageManager(row: MockFileManager): Record<string, unknown>
         aws_region: row.aws_region, aws_key_masked: row.aws_key_masked,
         aws_secret_masked: row.aws_secret_masked, allowed_origins: [...row.allowed_origins],
         assume_role_arn: row.assume_role_arn, has_external_id: row.has_external_id,
+        cdn: row.cdn ? { ...row.cdn } : { enabled: false },
         group: storageRelation('group', row.group), user: storageRelation('user', row.user),
     };
 }
 
+/** django-mojo #8250: the aws-check-shaped report the three CDN actions return. */
+function storageCdnReport(manager: MockFileManager, mode: 'enable' | 'check' | 'disable'): Record<string, unknown> {
+    const bucket = manager.backend_url.replace(/^s3:\/\//, '').split('/')[0];
+    const items = mode === 'disable'
+        ? []
+        : [
+            { step: 'preflight', status: 'PASS', code: 'identity.ok', message: 'running as arn:aws:iam::123456789012:role/django-mojo-setup', remedy: null },
+            { step: 'bucket', status: 'PASS', code: 'public_access_block.ok', message: 'Block Public Access is on for every setting', remedy: null },
+            { step: 'signing_key', status: 'PASS', code: 'signing_key.ok', message: 'signing key K2MOCKKEY is active', remedy: null },
+            { step: 'oac', status: 'PASS', code: 'oac.ok', message: `origin access control mojo-fm-oac-${bucket.slice(0, 6)} exists`, remedy: null },
+            { step: 'distribution', status: mode === 'enable' ? 'PENDING' : 'PASS', code: mode === 'enable' ? 'distribution.deploying' : 'distribution.ok', message: mode === 'enable' ? 'distribution EMOCK1 is still deploying to the edge' : `distribution EMOCK1 serves ${bucket} through OAC with the expected behaviors`, remedy: mode === 'enable' ? 'links are issued now and start working when CloudFront reports Deployed' : null },
+            { step: 'bucket_policy', status: 'PASS', code: 'bucket_policy.ok', message: 'the bucket policy lets this distribution read objects', remedy: null },
+            { step: 'kms', status: 'MANUAL', code: 'kms.aws_managed', message: 'objects are encrypted with the AWS-managed aws/s3 key, whose policy cannot be changed, so CloudFront can never decrypt them', remedy: 'create a customer-managed KMS key dedicated to media, set it as the manager\'s kms_key_id and the bucket\'s default encryption, re-encrypt existing objects, then re-run' },
+        ].filter((item) => !(item.step === 'kms' && manager.id !== 4101));
+    const worst = items.some((i) => i.status === 'MANUAL') ? 'MANUAL' : items.some((i) => i.status === 'PENDING') ? 'PENDING' : 'PASS';
+    return {
+        version: 1, mode, bucket, manager: manager.id, harden: false, items, actions: [],
+        worst, blocking: false, converged: worst !== 'MANUAL',
+        distribution: { distribution_id: 'EMOCK1', domain_name: 'emock1.cloudfront.net', status: mode === 'enable' ? 'pending' : 'deployed' },
+    };
+}
+
 function serializeUploadPolicy(row: MockFileManager): Record<string, unknown> {
     return {
         id: row.id, name: row.name, use: row.use, is_active: row.is_active,
@@ -6946,6 +6970,22 @@ function storageFetch(path: string, opts: MockFetchOpts): Record<string, unknown
         }
         if (method !== 'POST' || !hasGlobalPermission(caller, STORAGE_MANAGE_GRANTS)) return permissionDenied();
         const body = opts.body ?? {};
+        for (const action of ['enable_cdn', 'check_cdn', 'disable_cdn'] as const) {
+            if (!(action in body)) continue;
+            if (!manager) return { status: false, error: 'FileManager not found', error_code: 404 };
+            if (manager.backend_type !== 's3') return { status: true, data: { status: false, error: 'CDN delivery is only supported for S3 backends.' } };
+            const bucket = manager.backend_url.replace(/^s3:\/\//, '').split('/')[0];
+            const report = storageCdnReport(manager, action === 'enable_cdn' ? 'enable' : action === 'check_cdn' ? 'check' : 'disable');
+            const siblings = db.fileManagers.filter((row) => row.backend_type === 's3' && row.backend_url.replace(/^s3:\/\//, '').split('/')[0] === bucket);
+            if (action === 'enable_cdn' && report.converged) {
+                for (const row of siblings) row.cdn = { enabled: true, url: 'https://emock1.cloudfront.net', bucket, distribution_id: 'EMOCK1', source: 'provisioned', status: 'pending', signed: !row.is_public, signing_key_id: 'K2MOCKKEY' };
+            }
+            if (action === 'disable_cdn') {
+                for (const row of siblings) row.cdn = { enabled: false };
+                return { status: true, data: { status: true, result: { status: true, disabled: true, distribution_id: 'EMOCK1', retired: Boolean((body[action] as Record<string, unknown> | undefined)?.retire) } } };
+            }
+            return { status: true, data: { status: true, result: report } };
+        }
         for (const action of ['test_connection', 'check_cors', 'fix_cors', 'clone'] as const) {
             if (!(action in body)) continue;
             if (!manager) return { status: false, error: 'FileManager not found', error_code: 404 };

package/src/styles/components/admin-storage.css

@@ -1,4 +1,4 @@
 .storage-bucket-tools,.storage-bucket-create,.storage-action-row,.storage-counts,.storage-section-head{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}.storage-bucket-tools{padding:14px 16px;border-bottom:1px solid var(--line)}.storage-bucket-tools>.field{min-width:220px;flex:1}.storage-bucket-create{flex:2}.storage-bucket-create .field{min-width:260px;flex:1}.storage-footnote{padding:10px 16px;margin:0;color:var(--mute);font-size:12px}.storage-error{color:var(--bad)}.storage-danger{border:1px solid var(--bad);background:var(--bad-soft);border-radius:10px;padding:16px}.storage-operation-result,.storage-operation-evidence{margin-top:14px;padding:12px;border-radius:8px;background:var(--surface2);border:1px solid var(--line)}.storage-operation-result.is-error{border-color:var(--bad)}.storage-operation-evidence dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}.storage-operation-evidence dl>div{padding:8px;background:var(--surface);border-radius:6px}.storage-operation-evidence dt{font-size:11px;color:var(--mute);text-transform:uppercase}.storage-operation-evidence dd{margin:2px 0 0;font-weight:700}.storage-counts span{padding:6px 9px;border-radius:999px;background:var(--surface2)}.storage-manager-editor form,.storage-manager-editor .form-grid{display:grid;gap:12px}.storage-manager-editor .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.storage-span{grid-column:1/-1}.storage-owner-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}.storage-child-files,.storage-renditions,.storage-shares{display:grid;gap:8px}.storage-child-file,.storage-rendition,.storage-shares>div{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;padding:10px 12px;text-align:left;color:var(--ink);background:var(--surface2);border:1px solid var(--line);border-radius:8px}.storage-child-file span,.storage-rendition>div:first-child,.storage-shares span{display:grid;gap:2px}.storage-child-file small,.storage-rendition small,.storage-shares small{color:var(--mute)}.storage-result-json{max-height:360px;overflow:auto;padding:12px;background:var(--surface2);border-radius:8px}.storage-preview{display:grid;gap:12px;justify-items:start}.storage-preview img{max-width:100%;max-height:480px;object-fit:contain;border-radius:8px;background:var(--surface2)}.storage-media{width:min(100%,760px);max-height:480px}.storage-audio{min-height:54px}.storage-generic-preview{display:grid;gap:10px;justify-items:center;padding:34px;border:1px dashed var(--line);border-radius:10px;background:var(--surface2)}.storage-generic-preview>i{font-size:40px;color:var(--mute)}.storage-unsafe{color:var(--bad);padding:10px;background:var(--bad-soft);border-radius:8px}.storage-capability{display:block;overflow-wrap:anywhere;padding:12px;background:var(--surface2);border:1px solid var(--line);border-radius:8px}.storage-section-head{justify-content:space-between;align-items:start}.storage-section-head h3{margin-top:0}.storage-rendition .storage-action-row{flex-wrap:nowrap}
 @media(max-width:720px){.storage-manager-editor .form-grid,.storage-owner-grid{grid-template-columns:1fr}.storage-bucket-create{flex-basis:100%}.storage-child-file,.storage-rendition,.storage-shares>div{align-items:flex-start;flex-direction:column}.storage-rendition .storage-action-row{align-self:flex-end}}
 .storage-file-upload-surface{position:relative}.storage-page-drop-overlay{position:absolute;inset:0;z-index:20;display:grid;place-content:center;justify-items:center;gap:10px;pointer-events:none;border:2px dashed var(--accent);border-radius:12px;background:color-mix(in srgb,var(--surface) 88%,transparent);color:var(--accent);font-size:16px}.storage-page-drop-overlay i{font-size:42px}.storage-upload-dialog{display:grid;gap:14px}.storage-upload-scope{justify-self:start}.storage-upload-policy{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0}.storage-upload-policy>div{padding:10px;border:1px solid var(--line);border-radius:8px;background:var(--surface2)}.storage-upload-policy dt{font-size:11px;text-transform:uppercase;color:var(--mute)}.storage-upload-policy dd{margin:4px 0 0;overflow-wrap:anywhere}.storage-upload-selection{margin:0;padding:10px;border-radius:8px;background:var(--surface2)}.storage-upload-rejections{margin:0;color:var(--bad)}.storage-upload-queue{margin-top:14px}.storage-upload-refresh{margin:10px 0 0;padding:10px 12px;border:1px solid var(--line);border-radius:8px;color:var(--mute)}.storage-upload-refresh.is-error{border-color:var(--bad);color:var(--bad);background:var(--bad-soft)}
-@media(max-width:720px){.storage-upload-policy{grid-template-columns:1fr}}
+@media(max-width:720px){.storage-upload-policy{grid-template-columns:1fr}}.storage-cdn-findings{display:grid;gap:10px;margin-top:12px}.storage-cdn-finding{padding:10px 12px;background:var(--surface2);border:1px solid var(--line);border-radius:8px}.storage-cdn-finding>div{display:flex;gap:8px;align-items:center}.storage-cdn-finding p{margin:6px 0 0}.storage-cdn-finding pre{margin-top:8px;white-space:pre-wrap;overflow-wrap:anywhere}

package/src/ui/FormView.tsx

@@ -111,6 +111,8 @@ export interface FormViewProps<T extends { id: number | string }> {
      * proceeds. Put a `confirmGuardrail` here for grants/identity fields.
      */
     beforeSave?: AutosaveBeforeSave<T>;
+    /** Owner scope fence for delayed writes and feedback after account/group changes. */
+    isCurrent?: () => boolean;
     /** True while any FileField transfer is active. Owners can block dismissal. */
     onPendingChange?: (pending: boolean) => void;
     className?: string;
@@ -186,12 +188,18 @@ function OwnedFormView<T extends { id: number | string }>(props: FormViewProps<T
         save: (changes) => save.mutateAsync({ id: row.id, changes } satisfies SaveVars),
         debounceMs,
         savedFlashMs,
-        beforeSave,
+        beforeSave: props.isCurrent ? async (info) => {
+            if (props.isCurrent?.() === false) return false;
+            const result = await beforeSave?.(info);
+            return props.isCurrent?.() === false ? false : result;
+        } : beforeSave,
         onSaved: (info) => {
+            if (props.isCurrent?.() === false) return;
             publishOwnerResult(info.fields, 'success', info.changes, info.row);
             onSaved?.(info);
         },
         onSaveError: (info) => {
+            if (props.isCurrent?.() === false) return;
             publishOwnerResult(info.fields, 'failed', info.changes);
             // Unmissable failure (workspec): pinned field error + toast.
             toast.error(info.error.message);

package/src/ui/guardrail.tsx

@@ -41,6 +41,8 @@ export interface Guardrail {
     typeToConfirm?: string;
     /** false = primary button + warn tint for a stop that is not destructive. Default true. */
     danger?: boolean;
+    /** End this confirmation when its initiating record or authority is disposed. */
+    signal?: AbortSignal;
 }
 
 function GuardrailBody({ g, close }: { g: Guardrail; close: (v: boolean) => void }) {
@@ -102,7 +104,7 @@ function GuardrailBody({ g, close }: { g: Guardrail; close: (v: boolean) => void
 
 /** Open the guardrail and resolve true only when the operator confirms. */
 export function confirmGuardrail(g: Guardrail): Promise<boolean> {
-    return modal.open<boolean>((close) => <GuardrailBody g={g} close={close} />, { size: 'sm' })
+    return modal.open<boolean>((close) => <GuardrailBody g={g} close={close} />, { size: 'sm', signal: g.signal })
         .then((v) => v === true);
 }