phone number widget fixes

src/views/create-account-view.jsx

@@ -70,7 +70,6 @@ export default class CreateAccountView extends React.PureComponent {
   }
 
   handlePhoneChange(number) {
-    console.log('handlePhoneChange', number)
     this.setState({meth: 'tel', tel: number});
   }
 

src/views/tinode-web.jsx

@@ -1728,14 +1728,12 @@ class TinodeWeb extends React.Component {
   }
 
   handleShowCountrySelector(code, dial, selectedCallback) {
-    console.log('handleShowCountrySelector', code, dial);
     this.handleShowAlert("Select country",
       <Suspense fallback={<div><FormattedMessage id="loading_note" defaultMessage="Loading..."
         description="Message shown when component is loading"/></div>}>
         <PhoneCountrySelector
           selected={code}
           onSubmit={(c, d) => {
-            console.log("handleShowCountrySelector click", c, d);
             this.setState({alertVisible: false});
             selectedCallback(c, d);
           }} />

src/widgets/phone-country-selector.jsx

@@ -28,12 +28,20 @@ class PhoneCountrySelector extends React.PureComponent {
     this.countries.sort((a, b) => a.name.localeCompare(b.name));
   }
 
+  componentDidMount() {
+    if (this.selectedRef) {
+      this.selectedRef.scrollIntoView({block: 'center', inline: 'nearest'});
+    }
+  }
+
   render() {
     const countries = [];
     const selected = this.props.selected || 'US';
     this.countries.forEach((c, idx) => {
       const style = (c.code == selected ? 'selected ' : '');
-      countries.push(<li className={style} key={idx} onClick={_ => this.props.onSubmit(c.code, c.dial)}>
+      countries.push(<li className={style} key={idx}
+        ref={ref => {if (c.code == selected) {this.selectedRef = ref}}}
+        onClick={_ => this.props.onSubmit(c.code, c.dial)}>
         <span className="country-flag">{c.flag}</span>
         <span className="country">&nbsp;{c.name}</span>
         <span className="dial-code">&nbsp;+{c.dial}</span>

src/widgets/phone-edit.jsx

@@ -60,7 +60,6 @@ class PhoneEdit extends React.PureComponent {
   showCountrySelector() {
     this.props.onShowCountrySelector(this.state.countryCode, this.state.dialCode,
       (code, dial) => {
-          console.log('Callback', code, dial);
           this.setState({
             countryCode: code,
             dialCode: dial,
@@ -80,13 +79,11 @@ class PhoneEdit extends React.PureComponent {
   }
 
   placeholderNumber(code, dial) {
-    console.log('In nplaceholder', code, dial);
-    const number = getExampleNumber(code, examples).formatInternational();
-    return number.substring(dial.length + 1).trim();
+    const sample = getExampleNumber(code, examples);
+    return sample ? sample.formatInternational().substring(dial.length + 1).trim() : '123 456';
   }
 
   render() {
-    console.log('placeholder:', this.state.placeholderNumber);
     return (
       <>
         <span className="dial-code" onClick={this.showCountrySelector}>