diff --git a/x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/multi_text_input.tsx b/x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/multi_text_input.tsx index 158b5d5a6a3b0a..e4e724199b493a 100644 --- a/x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/multi_text_input.tsx +++ b/x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/components/multi_text_input.tsx @@ -38,48 +38,55 @@ interface RowProps { showDeleteButton?: boolean; } -const Row: FunctionComponent = React.memo( - ({ index, value, onChange, onDelete, onBlur, autoFocus, isDisabled, showDeleteButton }) => { - const onDeleteHandler = useCallback(() => { - onDelete(index); - }, [onDelete, index]); +const Row: FunctionComponent = ({ + index, + value, + onChange, + onDelete, + onBlur, + autoFocus, + isDisabled, + showDeleteButton, +}) => { + const onDeleteHandler = useCallback(() => { + onDelete(index); + }, [onDelete, index]); - const onChangeHandler = useCallback( - (e: ChangeEvent) => { - onChange(index, e.target.value); - }, - [onChange, index] - ); + const onChangeHandler = useCallback( + (e: ChangeEvent) => { + onChange(index, e.target.value); + }, + [onChange, index] + ); - return ( - - - + + + + {showDeleteButton && ( + + - {showDeleteButton && ( - - - - )} - - ); - } -); + )} + + ); +}; function defaultValue(value: string[]) { return value.length > 0 ? value : [''];