@pilotiq/pilotiq 0.15.1 → 0.16.0

package/src/react/fields/relationshipRenameDispatch.ts

@@ -0,0 +1,97 @@
+/**
+ * PK-switch Phase B — client-side dispatcher.
+ *
+ * The pilotiq server returns `relationshipRenames: { field, old, new }[]`
+ * in the JSON form-submit response whenever a `Repeater.relationship` /
+ * `Builder.relationship` create persisted under a DB-assigned PK that
+ * differs from the submitter's pre-assigned `__id` (see
+ * `pilotiq-pro/docs/plans/repeater-relationship-pk-switch.md`,
+ * `pilotiq/src/elements/dispatchForm.ts` for the wire shape).
+ *
+ * The renames need to land on the form's collab binding so other peers
+ * see the CRDT row re-keyed from UUID → PK without reloading. But the
+ * binding lives inside `FormStateProvider` (it owns `bindingRef`), while
+ * the JSON success path lives in `FormRenderer`'s `onSubmit` — a sibling
+ * component, not a context consumer. We bridge them with a per-`formId`
+ * module-level registry: `FormStateProvider` registers a handler when
+ * its binding mounts; `FormRenderer` dispatches against it after a
+ * successful submit.
+ *
+ * Pattern parallels `repeaterReconcile.ts`'s sessionStorage flag — same
+ * formId-keyed seam, different storage. SessionStorage was right for
+ * Phase A (the flag has to survive a navigation between submit and
+ * next mount); Phase B has to fire BEFORE the navigation, so a plain
+ * in-memory Map is the right shape (no SSR / cross-tab concerns).
+ *
+ * No-op when no handler is registered (consumer has no collab plugin,
+ * or the active binding doesn't implement `renameRow`).
+ */
+
+/**
+ * One UUID → PK rename emitted by the server. Shape mirrors
+ * `pilotiq/src/elements/dispatchForm.ts` `RelationshipRename`; we
+ * duplicate the shape here so this module stays free of server-only
+ * imports (would otherwise pull the form-submit pipeline into the
+ * client bundle).
+ */
+export interface RelationshipRenameEntry {
+  field: string
+  old:   string
+  new:   string
+}
+
+export type RelationshipRenameHandler = (
+  renames: ReadonlyArray<RelationshipRenameEntry>,
+) => void
+
+const handlers = new Map<string, RelationshipRenameHandler>()
+
+/**
+ * Called by `FormStateProvider` when its `FormCollabBinding` mounts AND
+ * implements `renameRow`. Returns the unsubscribe fn to call on
+ * unmount. Idempotent under re-registration on the same `formId` —
+ * later writers replace earlier handlers (Forms only mount one
+ * provider per id; a second mount means the first unmounted without
+ * firing its cleanup, which is acceptable to overwrite).
+ */
+export function registerRelationshipRenameHandler(
+  formId: string,
+  fn:     RelationshipRenameHandler,
+): () => void {
+  if (!formId) return () => {}
+  handlers.set(formId, fn)
+  return () => {
+    // Only clear when the current handler is still ours — protects
+    // against StrictMode dev double-mount where the cleanup of the
+    // first mount fires AFTER the second mount has installed its
+    // handler. Without this guard, the second mount's handler would
+    // be wiped before any submit completes.
+    if (handlers.get(formId) === fn) handlers.delete(formId)
+  }
+}
+
+/**
+ * Called by `FormRenderer`'s `onSubmit` success path. Invokes the
+ * formId's registered handler with the rename list, or no-ops when
+ * either side is empty.
+ *
+ * Errors thrown by the handler propagate — pilotiq's submit path
+ * already catches in a `try`, so a misbehaving binding fails the
+ * navigate cleanly with a toast rather than wedging the form.
+ */
+export function applyRelationshipRenames(
+  formId:  string,
+  renames: ReadonlyArray<RelationshipRenameEntry> | undefined,
+): void {
+  if (!formId) return
+  if (!renames || renames.length === 0) return
+  const fn = handlers.get(formId)
+  if (!fn) return
+  fn(renames)
+}
+
+/** Test seam — drop every registered handler. Not exported from the
+ *  react barrel. */
+export function _resetRelationshipRenameRegistryForTests(): void {
+  handlers.clear()
+}

package/src/react/fields/rowChromeButton.tsx

@@ -131,17 +131,31 @@ export function RowChromeIconButton({
 }
 
 /**
- * Drag grip — a `<span>` not a `<button>`, since native HTML5 DnD only
- * fires `dragstart` on parents with `draggable=true`. Honors the
- * `reorderAction` customizer for icon / label / tooltip / color so users
- * can swap the glyph or copy without owning the drag wiring.
+ * Drag grip — a `<span>` not a `<button>`. Honors the `reorderAction`
+ * customizer for icon / label / tooltip / color so users can swap the
+ * glyph or copy without owning the drag wiring.
+ *
+ * When `dragHandleProps` is passed, the grip carries `draggable=true` +
+ * `onDragStart` and becomes the HTML5 drag source — required for row
+ * layouts whose body hosts a contenteditable (Tiptap-backed fields).
+ * If `draggable=true` lives on the row container instead, a dragstart
+ * that initiates over the contenteditable is absorbed by the text-
+ * selection handler and the row drag never fires. Moving the source to
+ * the grip sidesteps that. Drop-target handlers (`onDragOver/onDrop/
+ * onDragEnd`) stay on the row container — `dragend` bubbles so source-
+ * side cleanup still reaches it.
  */
 export function ReorderGrip({
   disabled,
   buttons,
+  dragHandleProps,
 }: {
   disabled: boolean
   buttons:  RowButtonsMeta | undefined
+  dragHandleProps?: {
+    draggable:   true
+    onDragStart: (e: React.DragEvent<HTMLElement>) => void
+  } | undefined
 }): React.ReactElement {
   const { Icon, label, tooltip, colorClass } = resolveRowChromeFor('reorder', DEFAULT_REORDER, buttons)
   return (
@@ -149,6 +163,7 @@ export function ReorderGrip({
       aria-label={label}
       title={tooltip}
       className={`${colorClass} ${disabled ? 'opacity-30' : 'cursor-grab active:cursor-grabbing'}`}
+      {...dragHandleProps}
     >
       <Icon className="size-4" />
     </span>

package/src/react/schemaRenderer/form/FormRenderer.tsx

@@ -7,6 +7,10 @@ import { getFormCollabBinding } from '../../FormCollabBindingRegistry.js'
 import { useNavigate } from '../../navigate.js'
 import { useToast } from '../../Toaster.js'
 import { markSubmitForReconcile } from '../../fields/repeaterReconcile.js'
+import {
+  applyRelationshipRenames,
+  type RelationshipRenameEntry,
+} from '../../fields/relationshipRenameDispatch.js'
 import { renderField } from './renderField.js'
 
 // ─── Form ───────────────────────────────────────────────────
@@ -113,6 +117,21 @@ export function FormRenderer({
 
       // Success — drain notifications and SPA-navigate to the redirect.
       //
+      // Apply PK-switch Phase B renames against the active form's collab
+      // binding FIRST (synchronous Yjs transact under the hood). The
+      // server emits `relationshipRenames: { field, old, new }[]` for
+      // every relationship-backed row that persisted under a new PK; we
+      // forward each through the formId-keyed dispatch so the binding's
+      // `renameRow` runs before the navigate destroys the provider that
+      // owns it. No-op when no binding is registered (no collab plugin)
+      // OR when the array is empty (no relationship-backed creates this
+      // submit). The submitter-only Phase A reconciler still fires below
+      // — Phase B closes the multi-peer gap WITHOUT obviating the
+      // single-peer cleanup path.
+      const renames = (data as { relationshipRenames?: RelationshipRenameEntry[] })
+        .relationshipRenames
+      applyRelationshipRenames(formId, renames)
+
       // Before navigating, mark this tab for the relationship-backed
       // Repeater/Builder PK-switch reconciler. The next mount of any
       // child Repeater/Builder under this formId will run a one-shot

package/src/routes/globals.ts

@@ -137,7 +137,9 @@ export function registerGlobalRoutes(
       }
 
       const redirect = normalizeRedirect(result.redirect, base) ?? editUrl
-      return sendRedirectResponse(req, res, json, redirect, result.notifications)
+      return sendRedirectResponse(req, res, json, redirect, result.notifications,
+        result.relationshipRenames.length > 0 ? { relationshipRenames: result.relationshipRenames } : undefined,
+      )
     })
   }
 

package/src/routes/helpers.ts

@@ -1,6 +1,7 @@
 import type { AppRequest, AppResponse } from '@rudderjs/contracts'
 import type { Pilotiq } from '../Pilotiq.js'
 import { findActions, findRowExtraActions, type DispatchActionResult } from '../elements/dispatchAction.js'
+import type { RelationshipRename } from '../elements/dispatchForm.js'
 import { flashNotifications } from '../notifications/flash.js'
 import type { NotificationMeta } from '../notifications/Notification.js'
 import { findRecord, type ModelQuery } from '../orm/modelDefaults.js'
@@ -105,18 +106,24 @@ export function sendDownload(
 }
 
 /** Low-level success-or-redirect responder. Either emits a JSON envelope
- *  (`{ ok: true, redirect, notifications?, force? }`) when the client
- *  asked for JSON, or flashes notifications to the next request and
- *  issues a 303 redirect. Shared by `sendActionResult`,
+ *  (`{ ok: true, redirect, notifications?, force?, relationshipRenames? }`)
+ *  when the client asked for JSON, or flashes notifications to the next
+ *  request and issues a 303 redirect. Shared by `sendActionResult`,
  *  `sendMutationSuccess`, and the form-submit success branches in
- *  resources / globals / pages / relations. */
+ *  resources / globals / pages / relations.
+ *
+ *  `relationshipRenames` are emitted only on the JSON path — they're a
+ *  collab-side concern (per-row UUID → PK renames from
+ *  `Repeater.relationship` / `Builder.relationship` creates) consumed
+ *  by client-side adapters that own a CRDT binding. The 303 path drops
+ *  them silently; non-collab flows are unaffected. */
 export function sendRedirectResponse(
   req:           AppRequest,
   res:           AppResponse,
   json:          boolean,
   redirect:      string,
   notifications: ReadonlyArray<NotificationMeta> | undefined,
-  extras?:       { force?: boolean },
+  extras?:       { force?: boolean; relationshipRenames?: ReadonlyArray<RelationshipRename> },
 ): unknown {
   if (json) {
     return res.json({
@@ -124,6 +131,9 @@ export function sendRedirectResponse(
       redirect,
       ...(extras?.force ? { force: true } : {}),
       ...(notifications && notifications.length > 0 ? { notifications } : {}),
+      ...(extras?.relationshipRenames && extras.relationshipRenames.length > 0
+        ? { relationshipRenames: extras.relationshipRenames }
+        : {}),
     })
   }
   flashNotifications(req, notifications)

package/src/routes/pages.ts

@@ -168,6 +168,8 @@ export function registerCustomPageRoutes(
     }
 
     const redirect = normalizeRedirect(result.redirect, base) ?? pageUrl
-    return sendRedirectResponse(req, res, json, redirect, result.notifications)
+    return sendRedirectResponse(req, res, json, redirect, result.notifications,
+      result.relationshipRenames.length > 0 ? { relationshipRenames: result.relationshipRenames } : undefined,
+    )
   })
 }

package/src/routes/relations.ts

@@ -215,7 +215,9 @@ export function registerRelationRoutes(
         }
 
         const redirect = normalizeRedirect(result.redirect, base) ?? listUrl
-        return sendRedirectResponse(req, res, json, redirect, result.notifications)
+        return sendRedirectResponse(req, res, json, redirect, result.notifications,
+          result.relationshipRenames.length > 0 ? { relationshipRenames: result.relationshipRenames } : undefined,
+        )
       })
 
       // View — GET ${resourceBase}/:id/${rel}/:childId  (Phase A nested
@@ -332,7 +334,9 @@ export function registerRelationRoutes(
         }
 
         const redirect = normalizeRedirect(result.redirect, base) ?? editUrl
-        return sendRedirectResponse(req, res, json, redirect, result.notifications)
+        return sendRedirectResponse(req, res, json, redirect, result.notifications,
+          result.relationshipRenames.length > 0 ? { relationshipRenames: result.relationshipRenames } : undefined,
+        )
       })
 
       // Delete — POST ${resourceBase}/:id/${rel}/:childId/delete
@@ -773,7 +777,9 @@ export function registerRelationRoutes(
           }
 
           const redirect = normalizeRedirect(result.redirect, base) ?? listUrl
-          return sendRedirectResponse(req, res, json, redirect, result.notifications)
+          return sendRedirectResponse(req, res, json, redirect, result.notifications,
+            result.relationshipRenames.length > 0 ? { relationshipRenames: result.relationshipRenames } : undefined,
+          )
         })
 
         // ── View ──
@@ -902,7 +908,9 @@ export function registerRelationRoutes(
           }
 
           const redirect = normalizeRedirect(result.redirect, base) ?? editUrl
-          return sendRedirectResponse(req, res, json, redirect, result.notifications)
+          return sendRedirectResponse(req, res, json, redirect, result.notifications,
+            result.relationshipRenames.length > 0 ? { relationshipRenames: result.relationshipRenames } : undefined,
+          )
         })
 
         // ── Delete ──

package/src/routes/resources.ts

@@ -451,7 +451,10 @@ export function registerResourceRoutes(
         const redirect = continueCreate
           ? createUrl
           : normalizeRedirect(result.redirect, base) ?? fallback
-        return sendRedirectResponse(req, res, json, redirect, result.notifications, continueCreate ? { force: true } : undefined)
+        return sendRedirectResponse(req, res, json, redirect, result.notifications, {
+          ...(continueCreate ? { force: true as const } : {}),
+          ...(result.relationshipRenames.length > 0 ? { relationshipRenames: result.relationshipRenames } : {}),
+        })
       })
 
       // Action dispatch — POST ${createUrl}/_action/:actionName
@@ -702,7 +705,9 @@ export function registerResourceRoutes(
         }
 
         const redirect = normalizeRedirect(result.redirect, base) ?? editUrl
-        return sendRedirectResponse(req, res, json, redirect, result.notifications)
+        return sendRedirectResponse(req, res, json, redirect, result.notifications,
+          result.relationshipRenames.length > 0 ? { relationshipRenames: result.relationshipRenames } : undefined,
+        )
       })
 
       // Action dispatch — POST ${editUrl}/_action/:actionName