-
Notifications
You must be signed in to change notification settings - Fork 8.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[react@18] fix field.helpText
type issue
#192083
Conversation
3cd6502
to
0760701
Compare
@@ -211,7 +211,7 @@ export interface FieldHook<T = unknown, I = T> { | |||
export interface FieldConfig<T = unknown, FormType extends FormData = FormData, I = T> { | |||
readonly label?: string; | |||
readonly labelAppend?: string | ReactNode; | |||
readonly helpText?: string | ReactNode; | |||
readonly helpText?: string | ReactNode | (() => ReactNode); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Here we allow a lazy helpText
. It is already used like this in some places, it worked because a function could be assigned to ReactNode
due to a mistake in @types/react@17. This is no longer allowed with @types/react@18
@@ -549,7 +549,7 @@ export const useField = <T, FormType = FormData, I = T>( | |||
type, | |||
label, | |||
labelAppend, | |||
helpText, | |||
helpText: typeof helpText === 'function' ? helpText() : helpText, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Here we're unwraping the lazy helpText
so that the useField()
receives the ReactNode
value. This allows to simplify a bunch of existing places and not to fix a bunch of other places where helpText={helpText}
is already used
💛 Build succeeded, but was flaky
Failed CI StepsMetrics [docs]Async chunks
Page load bundle
To update your PR or re-run it, just comment with: |
Pinging @elastic/appex-sharedux (Team:SharedUX) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Code-only review, Data Discovery changes LGTM 👍
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
ResponseOps changes LTGM!
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Index Management changes lgtm!
Summary
Part of #138222
This is one of the issues that
@types/react@18
upgrade highlights and that needs to be addressed with or before the upgrade.field.helpText
isReactNode
, a function is not a validReactNode
, but@types/react@17
allowed a function. That is whytypeof field.helpText === 'function' ? field.helpText() : field.helpText
doesn't fail with@17
, but fails with@18
asfield.helpText is not callable, as never is not callable
. You can check the types with @types/react@18 yourself here #191738It looks like the lazy
helpText
isn't needed apart from a hack for index management where documentation service is used as part of helpText that could be not available yet.To keep it supported, I specifically, allowed a function that returns a ReactNode for
helpText
onFieldConfig
, but to make consumption clean and to now break other placesuseField
will call it and pass just aReactNode
down