🚸 Internal signup: put focus on top most field at load

This commit is contained in:
Eric Doughty-Papassideris
2024-03-07 15:10:37 +01:00
committed by Anton Shepilov
parent 9793037133
commit 560bf0d732
@@ -37,8 +37,8 @@ export default class Signin extends Component {
Languages.addListener(this); Languages.addListener(this);
} }
componentDidMount() { componentDidMount() {
if (this.input) { if (this.inputToFocusFirst) {
this.input.focus(); this.inputToFocusFirst.focus();
} }
} }
componentWillUnmount() { componentWillUnmount() {
@@ -48,9 +48,9 @@ export default class Signin extends Component {
componentDidUpdate(_prevProps, prevState) { componentDidUpdate(_prevProps, prevState) {
if ( if (
(prevState.page === 1 && this.state.page === 2) || (prevState.page === 1 && this.state.page === 2) ||
(prevState.page === 2 && this.state.page === 3 && this.input) (prevState.page === 2 && this.state.page === 3 && this.inputToFocusFirst)
) { ) {
if (this.input) this.input.focus(); if (this.inputToFocusFirst) this.inputToFocusFirst.focus();
} }
} }
displayStep() { displayStep() {
@@ -75,6 +75,9 @@ export default class Signin extends Component {
<Input <Input
id="first_name_create" id="first_name_create"
refInput={ref => {
this.inputToFocusFirst = ref;
}}
className="bottom-margin medium full_width" className="bottom-margin medium full_width"
onKeyDown={e => { onKeyDown={e => {
if (e.keyCode === 13) { if (e.keyCode === 13) {
@@ -91,9 +94,6 @@ export default class Signin extends Component {
/> />
<Input <Input
id="last_name_create" id="last_name_create"
refInput={ref => {
this.input = ref;
}}
className="bottom-margin medium full_width" className="bottom-margin medium full_width"
onKeyDown={e => { onKeyDown={e => {
if (e.keyCode === 13) { if (e.keyCode === 13) {