autofocus on input only if autoFocus prop is present

src/components/SelectCurrency/index.js

@@ -18,6 +18,7 @@ type OwnProps = {
   currencies?: CryptoCurrency[],
   value?: CryptoCurrency,
   placeholder: string,
+  autoFocus?: boolean,
   t: T,
 }
 
@@ -29,12 +30,21 @@ const mapStateToProps = (state, props: OwnProps) => ({
   currencies: props.currencies || availableCurrencies(state),
 })
 
-const SelectCurrency = ({ onChange, value, t, placeholder, currencies, ...props }: Props) => {
+const SelectCurrency = ({
+  onChange,
+  value,
+  t,
+  placeholder,
+  currencies,
+  autoFocus,
+  ...props
+}: Props) => {
   const options = currencies
     ? currencies.map(c => ({ ...c, value: c.id, label: c.name, currency: c }))
     : []
   return (
     <Select
+      autoFocus={autoFocus}
       value={value}
       renderOption={renderOption}
       renderValue={renderOption}

src/components/base/Select/index.js

@@ -28,6 +28,7 @@ type Props = {
   small: boolean,
   width: number,
   minWidth: number,
+  autoFocus: boolean,
 }
 
 export type Option = {
@@ -38,15 +39,15 @@ export type Option = {
 
 class Select extends PureComponent<Props> {
   componentDidMount() {
-    if (this.ref) {
+    if (this.ref && this.props.autoFocus) {
       // $FlowFixMe
-      this.timeout = setTimeout(() => this.ref.focus(), 16)
+      this.timeout = requestAnimationFrame(() => this.ref.focus())
     }
   }
 
   componentWillUnmount() {
     if (this.timeout) {
-      clearTimeout(this.timeout)
+      cancelAnimationFrame(this.timeout)
     }
   }