fix set initial value of KeyValueArrayControl (#11756)

This commit is contained in:
rashmi rai 2022-03-16 19:56:57 +05:30 committed by GitHub
parent e86b169ead
commit f6ba19dcb7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 19 additions and 9 deletions

View File

@ -21,6 +21,7 @@ import Icon, { IconCollection, IconName, IconSize } from "./Icon";
import { AsyncControllableInput } from "@blueprintjs/core/lib/esm/components/forms/asyncControllableInput";
import _ from "lodash";
import { replayHighlightClass } from "globalStyles/portals";
import { useEffect } from "react";
export type InputType = "text" | "password" | "number" | "email" | "tel";
@ -315,10 +316,19 @@ const TextInput = forwardRef(
}, []);
const inputStyle = useMemo(
() => boxStyles(props, validation.isValid, props.theme),
[props, validation.isValid, props.theme],
() => boxStyles(props, validation?.isValid, props.theme),
[props, validation?.isValid, props.theme],
);
// set the default value
useEffect(() => {
if (props.defaultValue) {
const inputValue = props.defaultValue;
setInputValue(inputValue);
props.onChange && props.onChange(inputValue);
}
}, [props.defaultValue]);
const memoizedChangeHandler = useCallback(
(el) => {
const inputValue: string = trimValue
@ -357,7 +367,7 @@ const TextInput = forwardRef(
const ErrorMessage = (
<MsgWrapper>
<Text type={TextType.P3}>
{props.errorMsg ? props.errorMsg : validation.message}
{props.errorMsg ? props.errorMsg : validation?.message}
</Text>
</MsgWrapper>
);
@ -368,7 +378,7 @@ const TextInput = forwardRef(
</MsgWrapper>
);
const iconColor = !validation.isValid
const iconColor = !validation?.isValid
? props.theme.colors.danger.main
: props.theme.colors.textInput.icon;
@ -385,7 +395,7 @@ const TextInput = forwardRef(
height={props.height || undefined}
inputStyle={inputStyle}
isFocused={isFocused}
isValid={validation.isValid}
isValid={validation?.isValid}
noBorder={props.noBorder}
value={inputValue}
width={props.width || undefined}
@ -414,7 +424,7 @@ const TextInput = forwardRef(
autoFocus={props.autoFocus}
defaultValue={props.defaultValue}
inputStyle={inputStyle}
isValid={validation.isValid}
isValid={validation?.isValid}
ref={ref}
type={props.dataType || "text"}
{...props}
@ -429,7 +439,7 @@ const TextInput = forwardRef(
readOnly={props.readOnly}
rightSideComponentWidth={rightSideComponentWidth}
/>
{validation.isValid &&
{validation?.isValid &&
props.helperText &&
props.helperText.length > 0 &&
HelperMessage}

View File

@ -118,7 +118,7 @@ function KeyValueRow(
name={keyTextFieldName}
props={{
dataType: getType(extraData[0]?.dataType),
defaultValue: props.initialValue,
defaultValue: extraData[0]?.initialValue,
keyFieldValidate,
placeholder: props.extraData
? props.extraData[1]?.placeholderText
@ -139,7 +139,7 @@ function KeyValueRow(
name={valueTextFieldName}
props={{
dataType: getType(extraData[1]?.dataType),
defaultValue: props.initialValue,
defaultValue: extraData[1]?.initialValue,
placeholder: props.extraData
? props.extraData[1]?.placeholderText
: "",