This is an automated email from the ASF dual-hosted git repository.
thiagoelg pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/incubator-kie-tools.git
The following commit(s) were added to refs/heads/main by this push:
new 20af0bbc49e NO-ISSUE: Fix missing reference to editor envelope and
defaultProps + spread props with key errors (#3617)
20af0bbc49e is described below
commit 20af0bbc49e41fc559b26939a6defe241a2148d9
Author: Thiago Lugli <[email protected]>
AuthorDate: Sun Jun 7 22:33:07 2026 -0300
NO-ISSUE: Fix missing reference to editor envelope and defaultProps +
spread props with key errors (#3617)
---
.../src/embedded/embedded/EmbeddedEditor.tsx | 19 ++++++-
.../editor/src/envelope/KogitoEditorEnvelope.tsx | 58 ++++++++++++----------
packages/uniforms-patternfly/src/BaseForm.tsx | 3 +-
packages/uniforms-patternfly/src/BoolField.tsx | 14 ++++--
packages/uniforms-patternfly/src/ErrorField.tsx | 24 +++++----
packages/uniforms-patternfly/src/ErrorsField.tsx | 24 ++++-----
packages/uniforms-patternfly/src/SubmitField.tsx | 4 +-
packages/uniforms-patternfly/src/wrapField.tsx | 4 +-
8 files changed, 90 insertions(+), 60 deletions(-)
diff --git a/packages/editor/src/embedded/embedded/EmbeddedEditor.tsx
b/packages/editor/src/embedded/embedded/EmbeddedEditor.tsx
index 0d19034d22c..dc079a88a0f 100644
--- a/packages/editor/src/embedded/embedded/EmbeddedEditor.tsx
+++ b/packages/editor/src/embedded/embedded/EmbeddedEditor.tsx
@@ -196,6 +196,19 @@ const RefForwardingEmbeddedEditor:
React.ForwardRefRenderFunction<EmbeddedEditor
};
}, [props.isReady, isReady, stateControl, envelopeServer, onKeyDown]);
+ const editorIframeProps = useMemo(() => {
+ if (!envelopeMapping) {
+ return undefined;
+ }
+ const props = getEditorIframeProps(envelopeMapping);
+ return {
+ key: undefined,
+ src: undefined,
+ srcDoc: undefined,
+ ...props,
+ };
+ }, [envelopeMapping]);
+
return (
<>
{!envelopeMapping && (
@@ -203,7 +216,7 @@ const RefForwardingEmbeddedEditor:
React.ForwardRefRenderFunction<EmbeddedEditor
<span>{i18n.editorNotAvailable(props.file.fileExtension)}</span>
</>
)}
- {envelopeMapping && (
+ {envelopeMapping && editorIframeProps && (
<iframe
ref={iframeRef}
id={"kogito-iframe"}
@@ -211,7 +224,9 @@ const RefForwardingEmbeddedEditor:
React.ForwardRefRenderFunction<EmbeddedEditor
title={i18n.kogitoEditor}
style={containerStyles}
data-envelope-channel={props.channelType}
- {...getEditorIframeProps(envelopeMapping)}
+ key={editorIframeProps.key}
+ src={editorIframeProps.src}
+ srcDoc={editorIframeProps.srcDoc}
/>
)}
</>
diff --git a/packages/editor/src/envelope/KogitoEditorEnvelope.tsx
b/packages/editor/src/envelope/KogitoEditorEnvelope.tsx
index 31c38b389d1..527f4c096b0 100644
--- a/packages/editor/src/envelope/KogitoEditorEnvelope.tsx
+++ b/packages/editor/src/envelope/KogitoEditorEnvelope.tsx
@@ -26,6 +26,7 @@ import {
} from "../api";
import { EditorEnvelopeView, EditorEnvelopeViewApi } from
"./EditorEnvelopeView";
import { createRoot } from "react-dom/client";
+import { flushSync } from "react-dom";
import * as React from "react";
import { Envelope, EnvelopeApiFactory } from "@kie-tools-core/envelope";
import { I18nService } from "@kie-tools-core/i18n/dist/envelope";
@@ -72,35 +73,38 @@ export class KogitoEditorEnvelope<
}
private renderView(container: HTMLElement) {
- return new Promise<() => EditorEnvelopeViewApi<E>>((res) => {
- const editorEnvelopeViewRef = (ref: EditorEnvelopeViewApi<E> | null) => {
- if (ref) {
- res(() => ref);
- }
- };
+ const editorEnvelopeViewRef = React.createRef<EditorEnvelopeViewApi<E>>();
- const app = (
- <KogitoEditorEnvelopeContext.Provider value={this.context}>
- <I18nDictionariesProvider
- defaults={editorEnvelopeI18nDefaults}
- dictionaries={editorEnvelopeI18nDictionaries}
- ctx={EditorEnvelopeI18nContext}
- initialLocale={navigator.language}
- >
- <EditorEnvelopeI18nContext.Consumer>
- {({ setLocale }) => (
- <EditorEnvelopeView
- ref={editorEnvelopeViewRef}
- setLocale={setLocale}
-
showKeyBindingsOverlay={this.keyboardShortcutsService.isEnabled()}
- />
- )}
- </EditorEnvelopeI18nContext.Consumer>
- </I18nDictionariesProvider>
- </KogitoEditorEnvelopeContext.Provider>
- );
+ const app = (
+ <KogitoEditorEnvelopeContext.Provider value={this.context}>
+ <I18nDictionariesProvider
+ defaults={editorEnvelopeI18nDefaults}
+ dictionaries={editorEnvelopeI18nDictionaries}
+ ctx={EditorEnvelopeI18nContext}
+ initialLocale={navigator.language}
+ >
+ <EditorEnvelopeI18nContext.Consumer>
+ {({ setLocale }) => (
+ <EditorEnvelopeView
+ ref={editorEnvelopeViewRef}
+ setLocale={setLocale}
+
showKeyBindingsOverlay={this.keyboardShortcutsService.isEnabled()}
+ />
+ )}
+ </EditorEnvelopeI18nContext.Consumer>
+ </I18nDictionariesProvider>
+ </KogitoEditorEnvelopeContext.Provider>
+ );
- createRoot(container).render(app);
+ return new Promise<() => EditorEnvelopeViewApi<E>>((res) => {
+ setTimeout(() => {
+ const root = createRoot(container);
+ // Force `render` to be synchronous to avoid race conditions with the
`envelopeServer` initialization.
+ flushSync(() => {
+ root.render(app);
+ });
+ res(() => editorEnvelopeViewRef.current!);
+ }, 0);
});
}
}
diff --git a/packages/uniforms-patternfly/src/BaseForm.tsx
b/packages/uniforms-patternfly/src/BaseForm.tsx
index 0cf6271a1b5..f34d37b945f 100644
--- a/packages/uniforms-patternfly/src/BaseForm.tsx
+++ b/packages/uniforms-patternfly/src/BaseForm.tsx
@@ -28,9 +28,10 @@ function Patternfly(parent: any): any {
static displayName = `Patternfly${parent.displayName}`;
render() {
+ const { key, ...propsWithoutKey } = this.getNativeFormProps();
return (
<context.Provider value={this.getContext()}>
- <Form data-testid="base-form" {...this.getNativeFormProps()} />
+ <Form data-testid="base-form" key={key} {...propsWithoutKey} />
</context.Provider>
);
}
diff --git a/packages/uniforms-patternfly/src/BoolField.tsx
b/packages/uniforms-patternfly/src/BoolField.tsx
index 4315e0d8a52..d2b2251afb0 100644
--- a/packages/uniforms-patternfly/src/BoolField.tsx
+++ b/packages/uniforms-patternfly/src/BoolField.tsx
@@ -37,7 +37,17 @@ export type BoolFieldProps = FieldProps<
}
>;
-function BoolField({ appearance, disabled, id, inputRef, label, name,
onChange, value, ...props }: BoolFieldProps) {
+function BoolField({
+ appearance = ComponentType.checkbox,
+ disabled,
+ id,
+ inputRef,
+ label,
+ name,
+ onChange,
+ value,
+ ...props
+}: BoolFieldProps) {
const Component = appearance === ComponentType.switch ? Switch : Checkbox;
return wrapField(
{ id, ...props },
@@ -54,6 +64,4 @@ function BoolField({ appearance, disabled, id, inputRef,
label, name, onChange,
);
}
-BoolField.defaultProps = { appearance: ComponentType.checkbox };
-
export default connectField(BoolField);
diff --git a/packages/uniforms-patternfly/src/ErrorField.tsx
b/packages/uniforms-patternfly/src/ErrorField.tsx
index 26ffaacc12d..51fc55fc9fc 100644
--- a/packages/uniforms-patternfly/src/ErrorField.tsx
+++ b/packages/uniforms-patternfly/src/ErrorField.tsx
@@ -29,22 +29,24 @@ export type ErrorFieldProps = Override<
}
>;
-function ErrorField({ children, error, errorMessage, ...props }:
ErrorFieldProps) {
- return !error ? null : (
- <div data-testid={"error-field"} {...filterDOMProps(props)}>
- {children ? children : <div style={{ margin: "3px"
}}>{errorMessage}</div>}
- </div>
- );
-}
-
-ErrorField.defaultProps = {
- style: {
+function ErrorField({
+ children,
+ error,
+ errorMessage,
+ style = {
backgroundColor: "rgba(255, 85, 0, 0.2)",
border: "1px solid rgb(255, 85, 0)",
borderRadius: "7px",
margin: "20px 0px",
padding: "10px",
},
-};
+ ...props
+}: ErrorFieldProps) {
+ return !error ? null : (
+ <div data-testid={"error-field"} {...filterDOMProps(props)} style={style}>
+ {children ? children : <div style={{ margin: "3px"
}}>{errorMessage}</div>}
+ </div>
+ );
+}
export default connectField<ErrorFieldProps>(ErrorField, { initialValue: false
});
diff --git a/packages/uniforms-patternfly/src/ErrorsField.tsx
b/packages/uniforms-patternfly/src/ErrorsField.tsx
index d28151897c9..b5f6e5b8cc8 100644
--- a/packages/uniforms-patternfly/src/ErrorsField.tsx
+++ b/packages/uniforms-patternfly/src/ErrorsField.tsx
@@ -23,11 +23,21 @@ import { useForm, filterDOMProps } from "uniforms";
export type ErrorsFieldProps = HTMLProps<HTMLDivElement>;
-function ErrorsField({ children, ...props }: ErrorsFieldProps) {
+function ErrorsField({
+ children,
+ style = {
+ backgroundColor: "rgba(255, 85, 0, 0.2)",
+ border: "1px solid rgb(255, 85, 0)",
+ borderRadius: "7px",
+ margin: "20px 0px",
+ padding: "10px",
+ },
+ ...props
+}: ErrorsFieldProps) {
const { error, schema } = useForm();
return !error && !children ? null : (
- <div data-testid={"errors-field"} {...filterDOMProps(props)}>
+ <div data-testid={"errors-field"} {...filterDOMProps(props)} style={style}>
{children}
<ul>
{schema.getErrorMessages(error).map((message, index) => (
@@ -40,14 +50,4 @@ function ErrorsField({ children, ...props }:
ErrorsFieldProps) {
);
}
-ErrorsField.defaultProps = {
- style: {
- backgroundColor: "rgba(255, 85, 0, 0.2)",
- border: "1px solid rgb(255, 85, 0)",
- borderRadius: "7px",
- margin: "20px 0px",
- padding: "10px",
- },
-};
-
export default ErrorsField;
diff --git a/packages/uniforms-patternfly/src/SubmitField.tsx
b/packages/uniforms-patternfly/src/SubmitField.tsx
index 717ff504348..071ef9d120c 100644
--- a/packages/uniforms-patternfly/src/SubmitField.tsx
+++ b/packages/uniforms-patternfly/src/SubmitField.tsx
@@ -23,7 +23,7 @@ import { Override, useForm } from "uniforms";
export type SubmitFieldProps = Override<ButtonProps, { inputRef?:
React.RefObject<HTMLButtonElement> }>;
-function SubmitField({ disabled, inputRef, value, ...props }:
SubmitFieldProps) {
+function SubmitField({ disabled, inputRef, value = "Submit", ...props }:
SubmitFieldProps) {
const { error, state } = useForm();
return (
@@ -39,6 +39,4 @@ function SubmitField({ disabled, inputRef, value, ...props }:
SubmitFieldProps)
);
}
-SubmitField.defaultProps = { value: "Submit" };
-
export default SubmitField;
diff --git a/packages/uniforms-patternfly/src/wrapField.tsx
b/packages/uniforms-patternfly/src/wrapField.tsx
index d639093cec6..7b1deffe8e4 100644
--- a/packages/uniforms-patternfly/src/wrapField.tsx
+++ b/packages/uniforms-patternfly/src/wrapField.tsx
@@ -82,6 +82,7 @@ export default function wrapField(
}: WrapperProps,
children: React.ReactNode
) {
+ const { key, ...propsWithoutKey } = filterDOMProps(props);
return (
<FormGroup
data-testid={"wrapper-field"}
@@ -105,7 +106,8 @@ export default function wrapField(
}
isRequired={required}
type={type}
- {...filterDOMProps(props)}
+ key={key}
+ {...propsWithoutKey}
>
{children}
{error ? (
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
