diff --git a/packages/app-record-locking/src/components/HeadlessCmsContentEntry/ContentEntryLocker.tsx b/packages/app-record-locking/src/components/HeadlessCmsContentEntry/ContentEntryLocker.tsx index 6e7944059aa..1ba1d3b0890 100644 --- a/packages/app-record-locking/src/components/HeadlessCmsContentEntry/ContentEntryLocker.tsx +++ b/packages/app-record-locking/src/components/HeadlessCmsContentEntry/ContentEntryLocker.tsx @@ -35,6 +35,7 @@ const ForceUnlocked = ({ user }: IForceUnlockedProps) => { }; export const ContentEntryLocker = ({ children }: IContentEntryLockerProps) => { + const disablePrompt = useRef(false); const { entry, contentModel: model } = useContentEntry(); const { updateEntryLock, unlockEntry, fetchLockedEntryLockRecord, removeEntryLock } = useRecordLocking(); @@ -50,9 +51,8 @@ export const ContentEntryLocker = ({ children }: IContentEntryLockerProps) => { const PromptDecorator = useMemo(() => { return Prompt.createDecorator(Original => { return function Prompt(props) { - return ; - // const when = disablePrompt.current === true ? false : props.when; - // return ; + const when = disablePrompt.current === true ? false : props.when; + return ; }; }); }, []); @@ -74,6 +74,7 @@ export const ContentEntryLocker = ({ children }: IContentEntryLockerProps) => { $lockingType: model.modelId }; removeEntryLock(record); + disablePrompt.current = true; showDialog({ title: "Entry was forcefully unlocked", content: , diff --git a/packages/form/src/Form.tsx b/packages/form/src/Form.tsx index 6d8573b9d87..1f1a3f623fa 100644 --- a/packages/form/src/Form.tsx +++ b/packages/form/src/Form.tsx @@ -9,22 +9,32 @@ import { FormContext } from "./FormContext"; import { FormPresenter } from "./FormPresenter"; import { FormAPI } from "./FormApi"; +type Callbacks = Pick, "onChange" | "onInvalid">; + function FormInner( props: FormProps, ref: React.ForwardedRef ) { const dataRef = useRef(props.data); + const callbacksRef = useRef>({ + onChange: props.onChange, + onInvalid: props.onInvalid + }); const presenter = useMemo(() => { const presenter = new FormPresenter(); presenter.init({ data: (props.data || {}) as T, onChange: data => { - if (typeof props.onChange === "function") { - props.onChange(data, formApi); + if (typeof callbacksRef.current.onChange === "function") { + callbacksRef.current.onChange(data, formApi); } }, - onInvalid: props.onInvalid + onInvalid: (...args) => { + if (typeof callbacksRef.current.onInvalid === "function") { + callbacksRef.current.onInvalid(...args); + } + } }); return presenter; }, []); @@ -45,6 +55,13 @@ function FormInner( }); }, [props.onSubmit, props.disabled, props.validateOnFirstSubmit]); + useEffect(() => { + callbacksRef.current = { + onChange: props.onChange, + onInvalid: props.onInvalid + }; + }, [props.onChange, props.onInvalid]); + useEffect(() => { presenter.setInvalidFields(props.invalidFields || {}); }, [props.invalidFields]); @@ -117,3 +134,5 @@ export const Form = observer( props: FormProps & { ref?: React.ForwardedRef } ) => ReturnType> ); + +Form.displayName = "Form"; diff --git a/packages/form/src/FormPresenter.ts b/packages/form/src/FormPresenter.ts index 5053301a2d8..1f7095450e3 100644 --- a/packages/form/src/FormPresenter.ts +++ b/packages/form/src/FormPresenter.ts @@ -160,11 +160,13 @@ export class FormPresenter { const defaultValue = field.getDefaultValue(); requestAnimationFrame(() => { - if (emptyValues.includes(currentFieldValue) && defaultValue !== undefined) { - lodashSet(this.data, fieldName, defaultValue); - } + runInAction(() => { + if (emptyValues.includes(currentFieldValue) && defaultValue !== undefined) { + lodashSet(this.data, fieldName, defaultValue); + } - this.formFields.set(props.name, field); + this.formFields.set(props.name, field); + }); }); }