@open-mercato/ui 0.6.8-develop.6930.1.1e5976efc3 → 0.6.8-develop.6940.1.177ea30c6e

package/dist/backend/CrudForm.js

@@ -423,6 +423,14 @@ function CrudForm({
     () => ({ ...initialValues ?? {} })
   );
   const valuesRef = React.useRef(values);
+  const pendingFieldChangeEventsRef = React.useRef([]);
+  const nextFieldChangeEventIdRef = React.useRef(0);
+  const fieldChangeRevisionByFieldRef = React.useRef(/* @__PURE__ */ new Map());
+  const fieldChangeFormGenerationRef = React.useRef(0);
+  const fieldChangeFormSnapshotRef = React.useRef(void 0);
+  const fieldChangeDispatcherMountedRef = React.useRef(false);
+  const activeFieldChangeDispatchRef = React.useRef(null);
+  const [fieldChangeDispatchVersion, setFieldChangeDispatchVersion] = React.useState(0);
   const [errors, setErrors] = React.useState({});
   const [pending, setPending] = React.useState(false);
   const submittingRef = React.useRef(false);
@@ -496,9 +504,32 @@ function CrudForm({
   React.useEffect(() => {
     injectionContextRef.current = injectionContext;
   }, [injectionContext]);
-  React.useEffect(() => {
+  React.useLayoutEffect(() => {
     valuesRef.current = values;
   }, [values]);
+  const fieldChangeFormSnapshot = React.useMemo(
+    () => createDirtySnapshot(initialValues ?? {}),
+    [initialValues]
+  );
+  React.useLayoutEffect(() => {
+    const fieldChangeRevisions = fieldChangeRevisionByFieldRef.current;
+    fieldChangeDispatcherMountedRef.current = true;
+    return () => {
+      fieldChangeDispatcherMountedRef.current = false;
+      fieldChangeFormGenerationRef.current += 1;
+      pendingFieldChangeEventsRef.current = [];
+      fieldChangeRevisions.clear();
+      activeFieldChangeDispatchRef.current = null;
+    };
+  }, []);
+  React.useLayoutEffect(() => {
+    if (fieldChangeFormSnapshotRef.current === fieldChangeFormSnapshot) return;
+    fieldChangeFormSnapshotRef.current = fieldChangeFormSnapshot;
+    fieldChangeFormGenerationRef.current += 1;
+    pendingFieldChangeEventsRef.current = [];
+    fieldChangeRevisionByFieldRef.current.clear();
+    activeFieldChangeDispatchRef.current = null;
+  }, [fieldChangeFormSnapshot]);
   const isDirtyRef = React.useRef(false);
   const navigationPromptBypassRef = React.useRef(false);
   const navigationConfirmPendingRef = React.useRef(false);
@@ -563,6 +594,7 @@ function CrudForm({
   }, [clearSubmitNavigationBypass]);
   const clearDirtyState = React.useCallback((snapshotSource) => {
     const source = snapshotSource ?? valuesRef.current;
+    pendingDirtyBaselineCommitRef.current = null;
     dirtyBaselineSnapshotRef.current = createDirtySnapshot(source);
     dirtyBaselineValuesRef.current = { ...source };
     userEditedFieldIdsRef.current.clear();
@@ -1713,29 +1745,30 @@ function CrudForm({
     everEditedFieldIdsRef.current.add(id);
   }, []);
   const setValue = React.useCallback((id, nextValue) => {
-    let nextData = null;
-    let nextDirty = null;
-    const currentValue = valuesRef.current[id];
-    if (!Object.is(currentValue, nextValue)) {
-      updateEditedFieldMarker(id, nextValue);
-    }
-    setValues((prev) => {
-      if (Object.is(prev[id], nextValue)) return prev;
-      const baselineSource = dirtyBaselineValuesRef.current ?? prev;
+    const currentValues = valuesRef.current;
+    if (!Object.is(currentValues[id], nextValue)) {
+      pendingDirtyBaselineCommitRef.current = null;
+      const baselineSource = dirtyBaselineValuesRef.current ?? currentValues;
       updateEditedFieldMarker(id, nextValue, baselineSource);
-      nextData = { ...prev, [id]: nextValue };
-      valuesRef.current = nextData;
       if (!(embedded && !trackDirtyWhenEmbedded)) {
-        const baseline = dirtyBaselineSnapshotRef.current ?? createDirtySnapshot(prev);
-        dirtyBaselineSnapshotRef.current = baseline;
+        dirtyBaselineSnapshotRef.current ??= createDirtySnapshot(currentValues);
         dirtyBaselineValuesRef.current = baselineSource;
-        nextDirty = createDirtySnapshot(nextData) !== baseline;
       }
-      return nextData;
-    });
-    if (nextDirty !== null) {
-      isDirtyRef.current = nextDirty;
-      setHasUnsavedChanges(nextDirty);
+      if (extendedInjectionEventsEnabled) {
+        const fieldRevision = (fieldChangeRevisionByFieldRef.current.get(id) ?? 0) + 1;
+        fieldChangeRevisionByFieldRef.current.set(id, fieldRevision);
+        nextFieldChangeEventIdRef.current += 1;
+        pendingFieldChangeEventsRef.current.push({
+          eventId: nextFieldChangeEventIdRef.current,
+          fieldId: id,
+          fieldValue: nextValue,
+          fieldRevision,
+          fieldRevisionsAtEnqueue: new Map(fieldChangeRevisionByFieldRef.current),
+          formGeneration: fieldChangeFormGenerationRef.current
+        });
+        setFieldChangeDispatchVersion((version) => version + 1);
+      }
+      setValues((prev) => Object.is(prev[id], nextValue) ? prev : { ...prev, [id]: nextValue });
     }
     const clearedMessages = [];
     setErrors((prev) => {
@@ -1766,19 +1799,43 @@ function CrudForm({
         return prev;
       });
     }
-    if (!nextData || !extendedInjectionEventsEnabled) return;
-    void triggerInjectionEvent("onFieldChange", nextData, injectionContextRef.current, {
-      fieldId: id,
-      fieldValue: nextValue
+  }, [embedded, extendedInjectionEventsEnabled, t, trackDirtyWhenEmbedded, translateValidationMessage, updateEditedFieldMarker]);
+  React.useEffect(() => {
+    if (!extendedInjectionEventsEnabled) {
+      pendingFieldChangeEventsRef.current = [];
+      return;
+    }
+    if (!fieldChangeDispatcherMountedRef.current || activeFieldChangeDispatchRef.current) return;
+    let pendingEvent = pendingFieldChangeEventsRef.current.shift();
+    while (pendingEvent && pendingEvent.formGeneration !== fieldChangeFormGenerationRef.current) {
+      pendingEvent = pendingFieldChangeEventsRef.current.shift();
+    }
+    if (!pendingEvent) return;
+    const dispatchToken = {
+      eventId: pendingEvent.eventId,
+      formGeneration: pendingEvent.formGeneration
+    };
+    activeFieldChangeDispatchRef.current = dispatchToken;
+    void triggerInjectionEvent("onFieldChange", values, injectionContextRef.current, {
+      fieldId: pendingEvent.fieldId,
+      fieldValue: pendingEvent.fieldValue
     }).then((result) => {
+      const isCurrentEvent = fieldChangeDispatcherMountedRef.current && fieldChangeFormGenerationRef.current === pendingEvent.formGeneration && fieldChangeRevisionByFieldRef.current.get(pendingEvent.fieldId) === pendingEvent.fieldRevision;
+      if (!isCurrentEvent) return;
       if (!result.ok) return;
       const change = result.fieldChange;
       if (!change) return;
-      const updates = { ...change.sideEffects ?? {} };
+      const candidateUpdates = { ...change.sideEffects ?? {} };
       if (change.value !== void 0) {
-        updates[id] = change.value;
+        candidateUpdates[pendingEvent.fieldId] = change.value;
+      }
+      const updates = {};
+      for (const [fieldId, value] of Object.entries(candidateUpdates)) {
+        if (fieldChangeRevisionByFieldRef.current.get(fieldId) !== pendingEvent.fieldRevisionsAtEnqueue.get(fieldId)) continue;
+        updates[fieldId] = value;
       }
       if (Object.keys(updates).length > 0) {
+        pendingDirtyBaselineCommitRef.current = null;
         setValues((prev) => {
           let changed = false;
           const next = { ...prev };
@@ -1795,8 +1852,16 @@ function CrudForm({
       }
     }).catch((err) => {
       logger.error("Error in onFieldChange", { err });
+    }).finally(() => {
+      const activeDispatch = activeFieldChangeDispatchRef.current;
+      if (activeDispatch?.eventId === dispatchToken.eventId && activeDispatch.formGeneration === dispatchToken.formGeneration) {
+        activeFieldChangeDispatchRef.current = null;
+      }
+      if (fieldChangeDispatcherMountedRef.current && fieldChangeFormGenerationRef.current === dispatchToken.formGeneration) {
+        setFieldChangeDispatchVersion((version) => version + 1);
+      }
     });
-  }, [embedded, extendedInjectionEventsEnabled, flash, t, trackDirtyWhenEmbedded, translateValidationMessage, triggerInjectionEvent, updateEditedFieldMarker]);
+  }, [extendedInjectionEventsEnabled, fieldChangeDispatchVersion, triggerInjectionEvent, values]);
   const onBlurRequest = React.useCallback((fieldId) => {
     void validateFieldOnBlur(fieldId);
   }, [validateFieldOnBlur]);
@@ -1825,67 +1890,84 @@ function CrudForm({
     [buildCustomFieldsManageHref, customFieldsManageMode]
   );
   const appliedInitialValuesSnapshotRef = React.useRef(void 0);
+  const initialValuesTransformMountedRef = React.useRef(true);
   const dirtyBaselineSnapshotRef = React.useRef(void 0);
   const dirtyBaselineValuesRef = React.useRef(void 0);
+  const pendingDirtyBaselineCommitRef = React.useRef(null);
   const userEditedFieldIdsRef = React.useRef(/* @__PURE__ */ new Set());
   const everEditedFieldIdsRef = React.useRef(/* @__PURE__ */ new Set());
+  React.useLayoutEffect(() => {
+    initialValuesTransformMountedRef.current = true;
+    return () => {
+      initialValuesTransformMountedRef.current = false;
+    };
+  }, []);
+  React.useLayoutEffect(() => {
+    const pendingBaseline = pendingDirtyBaselineCommitRef.current;
+    if (!pendingBaseline) return;
+    pendingDirtyBaselineCommitRef.current = null;
+    if (pendingBaseline.guardSnapshot !== void 0 && appliedInitialValuesSnapshotRef.current !== pendingBaseline.guardSnapshot) return;
+    const committedValues = values;
+    if (createDirtySnapshot(committedValues) !== pendingBaseline.valuesSnapshot) return;
+    dirtyBaselineSnapshotRef.current = pendingBaseline.valuesSnapshot;
+    dirtyBaselineValuesRef.current = { ...pendingBaseline.values };
+  }, [values]);
   React.useLayoutEffect(() => {
     if (!initialValues) return;
     const snapshot = JSON.stringify({
       initialValues,
       injectedFieldIds: injectedFieldDefinitions.map((definition) => definition.id),
+      injectionWidgetIds: injectionWidgets.map((widget) => `${widget.moduleId}:${widget.widgetId}:${widget.key}`),
       customFieldMappings: cfDefinitions.map((definition) => definition.key),
       dotPathBaseFieldIds: Array.from(dotPathBaseFieldIds)
     });
     if (appliedInitialValuesSnapshotRef.current === snapshot) return;
     appliedInitialValuesSnapshotRef.current = snapshot;
     const initialRecord = initialValues;
-    let mergedValues = null;
-    let hadUnsavedEdits = false;
-    setValues((prev) => {
-      const priorBaseline = dirtyBaselineSnapshotRef.current;
-      const editedFieldIds = userEditedFieldIdsRef.current;
-      hadUnsavedEdits = editedFieldIds.size > 0 || priorBaseline !== void 0 && createDirtySnapshot(prev) !== priorBaseline;
-      const merged = { ...prev };
-      const mergedRecord = merged;
-      for (const [key, value] of Object.entries(initialValues)) {
-        if (editedFieldIds.has(key)) continue;
-        mergedRecord[key] = value;
-      }
-      for (const definition of injectedFieldDefinitions) {
-        if (merged[definition.id] !== void 0) continue;
-        const extracted = readByDotPath(initialRecord, definition.id);
-        if (extracted !== void 0) {
-          ;
-          merged[definition.id] = extracted;
-        }
+    const currentValues = valuesRef.current;
+    const priorBaseline = dirtyBaselineSnapshotRef.current;
+    const editedFieldIds = userEditedFieldIdsRef.current;
+    const hadUnsavedEdits = editedFieldIds.size > 0 || priorBaseline !== void 0 && createDirtySnapshot(currentValues) !== priorBaseline;
+    const mergedValues = { ...currentValues };
+    const mergedRecord = mergedValues;
+    for (const [key, value] of Object.entries(initialValues)) {
+      if (editedFieldIds.has(key)) continue;
+      mergedRecord[key] = value;
+    }
+    for (const definition of injectedFieldDefinitions) {
+      if (mergedValues[definition.id] !== void 0) continue;
+      const extracted = readByDotPath(initialRecord, definition.id);
+      if (extracted !== void 0) {
+        mergedRecord[definition.id] = extracted;
       }
-      for (const definition of cfDefinitions) {
-        const targetId = customEntity ? definition.key : `cf_${definition.key}`;
-        if (!targetId || merged[targetId] !== void 0) continue;
-        const extracted = readInitialCustomFieldValue(initialRecord, definition.key);
-        if (extracted !== void 0) {
-          ;
-          merged[targetId] = extracted;
-        }
+    }
+    for (const definition of cfDefinitions) {
+      const targetId = customEntity ? definition.key : `cf_${definition.key}`;
+      if (!targetId || mergedValues[targetId] !== void 0) continue;
+      const extracted = readInitialCustomFieldValue(initialRecord, definition.key);
+      if (extracted !== void 0) {
+        mergedRecord[targetId] = extracted;
       }
-      for (const fieldId of dotPathBaseFieldIds) {
-        if (merged[fieldId] !== void 0) continue;
-        const extracted = readByDotPath(initialRecord, fieldId);
-        if (extracted !== void 0) {
-          ;
-          merged[fieldId] = extracted;
-        }
+    }
+    for (const fieldId of dotPathBaseFieldIds) {
+      if (mergedValues[fieldId] !== void 0) continue;
+      const extracted = readByDotPath(initialRecord, fieldId);
+      if (extracted !== void 0) {
+        mergedRecord[fieldId] = extracted;
       }
-      mergedValues = merged;
-      return mergedValues;
-    });
-    if (mergedValues && !hadUnsavedEdits) {
-      dirtyBaselineSnapshotRef.current = createDirtySnapshot(mergedValues);
-      dirtyBaselineValuesRef.current = { ...mergedValues };
     }
-    if (!extendedInjectionEventsEnabled || !mergedValues) return;
-    let cancelled = false;
+    if (!hadUnsavedEdits) {
+      pendingDirtyBaselineCommitRef.current = {
+        guardSnapshot: snapshot,
+        valuesSnapshot: createDirtySnapshot(mergedValues),
+        values: { ...mergedValues }
+      };
+    } else {
+      pendingDirtyBaselineCommitRef.current = null;
+    }
+    setValues(mergedValues);
+    if (!extendedInjectionEventsEnabled || hadUnsavedEdits) return;
+    const transformSourceSnapshot = createDirtySnapshot(mergedValues);
     const run = async () => {
       try {
         const result = await triggerInjectionEvent(
@@ -1894,19 +1976,23 @@ function CrudForm({
           injectionContextRef.current
         );
         const transformed = result.data;
-        if (cancelled || !transformed) return;
-        if (isDirtyRef.current) return;
-        dirtyBaselineSnapshotRef.current = createDirtySnapshot(transformed);
-        dirtyBaselineValuesRef.current = { ...transformed };
-        setValues(transformed);
+        if (!initialValuesTransformMountedRef.current || appliedInitialValuesSnapshotRef.current !== snapshot || !transformed) return;
+        if (createDirtySnapshot(valuesRef.current) !== transformSourceSnapshot) return;
+        const transformedValues = transformed;
+        pendingDirtyBaselineCommitRef.current = {
+          guardSnapshot: snapshot,
+          valuesSnapshot: createDirtySnapshot(transformedValues),
+          values: { ...transformedValues }
+        };
+        setValues((current) => {
+          if (createDirtySnapshot(current) !== transformSourceSnapshot) return current;
+          return transformedValues;
+        });
       } catch (err) {
         logger.error("Error in transformDisplayData", { err });
       }
     };
     void run();
-    return () => {
-      cancelled = true;
-    };
   }, [
     cfDefinitions,
     customEntity,
@@ -1914,6 +2000,7 @@ function CrudForm({
     extendedInjectionEventsEnabled,
     initialValues,
     injectedFieldDefinitions,
+    injectionWidgets,
     triggerInjectionEvent
   ]);
   const cfDefaultsAppliedRef = React.useRef(false);
@@ -1936,23 +2023,20 @@ function CrudForm({
       defaults[fieldId] = def.defaultValue;
     }
     if (Object.keys(defaults).length === 0) return;
-    let mergedValues = null;
-    setValues((prev) => {
-      const merged = { ...prev };
-      let applied = false;
-      for (const [fieldId, defaultVal] of Object.entries(defaults)) {
-        if (merged[fieldId] !== void 0) continue;
-        merged[fieldId] = defaultVal;
-        applied = true;
-      }
-      if (!applied) return prev;
-      mergedValues = merged;
-      return mergedValues;
-    });
-    if (mergedValues) {
-      dirtyBaselineSnapshotRef.current = createDirtySnapshot(mergedValues);
-      dirtyBaselineValuesRef.current = { ...mergedValues };
+    const currentValues = valuesRef.current;
+    const mergedValues = { ...currentValues };
+    let applied = false;
+    for (const [fieldId, defaultVal] of Object.entries(defaults)) {
+      if (mergedValues[fieldId] !== void 0) continue;
+      mergedValues[fieldId] = defaultVal;
+      applied = true;
     }
+    if (!applied) return;
+    pendingDirtyBaselineCommitRef.current = {
+      valuesSnapshot: createDirtySnapshot(mergedValues),
+      values: { ...mergedValues }
+    };
+    setValues(mergedValues);
   }, [isLoading, initialValuesHasId, cfDefinitions, customEntity]);
   const markFormAsClean = React.useCallback((snapshotSource) => {
     clearDirtyState(snapshotSource);