diff --git a/x-pack/plugins/spaces/public/views/management/edit_space/space_identifier.tsx b/x-pack/plugins/spaces/public/views/management/edit_space/space_identifier.tsx index b23c1fd9d68e3..73a3905c92698 100644 --- a/x-pack/plugins/spaces/public/views/management/edit_space/space_identifier.tsx +++ b/x-pack/plugins/spaces/public/views/management/edit_space/space_identifier.tsx @@ -4,11 +4,7 @@ * you may not use this file except in compliance with the Elastic License. */ -import { - EuiFieldText, - EuiFormRow, - EuiLink, -} from '@elastic/eui'; +import { EuiFieldText, EuiFormRow, EuiLink } from '@elastic/eui'; import { FormattedMessage, InjectedIntl, injectI18n } from '@kbn/i18n/react'; import React, { ChangeEvent, Component, Fragment } from 'react'; import { Space } from '../../../../common/model/space'; @@ -27,7 +23,6 @@ interface State { } class SpaceIdentifierUI extends Component { - private textFieldRef: HTMLInputElement | null = null; constructor(props: Props) { @@ -39,9 +34,7 @@ class SpaceIdentifierUI extends Component { public render() { const { intl } = this.props; - const { - id = '' - } = this.props.space; + const { id = '' } = this.props.space; return ( @@ -64,7 +57,7 @@ class SpaceIdentifierUI extends Component { } value={id} onChange={this.onChange} - inputRef={(ref) => this.textFieldRef = ref} + inputRef={ref => (this.textFieldRef = ref)} fullWidth /> @@ -75,12 +68,13 @@ class SpaceIdentifierUI extends Component { public getLabel = () => { if (!this.props.editable) { return ( -

- -

); +

+ +

+ ); } const editLinkText = this.state.editing ? ( @@ -124,7 +118,9 @@ class SpaceIdentifierUI extends Component { nextLine:
, engineeringKibanaUrl: ( - https://my-kibana.example/s/engineering/app/kibana + {`https://my-kibana.example`} + /s/engineering/ + app/kibana ), }} @@ -134,17 +130,22 @@ class SpaceIdentifierUI extends Component { }; public onEditClick = () => { - this.setState({ - editing: !this.state.editing - }, () => { - if (this.textFieldRef && this.state.editing) { - this.textFieldRef.focus(); + this.setState( + { + editing: !this.state.editing, + }, + () => { + if (this.textFieldRef && this.state.editing) { + this.textFieldRef.focus(); + } } - }); + ); }; public onChange = (e: ChangeEvent) => { - if (!this.state.editing) { return; } + if (!this.state.editing) { + return; + } this.props.onChange(e); }; }