UserStatusScreen: Use new SelectableOptionRow.

Which doesn't have the right-facing arrows; those have been
misleading here because they make the user think something will
expand when they interact with them.

See discussion:
  https://chat.zulip.org/#narrow/stream/48-mobile/topic/User.20status.20items.20look.20odd/near/1166000.

Author: chrisbobbe

src/user-status/UserStatusScreen.js

@@ -9,7 +9,7 @@ import type { AppNavigationProp } from '../nav/AppNavigator';
 import * as NavigationService from '../nav/NavigationService';
 import type { GetText, Dispatch } from '../types';
 import { connect } from '../react-redux';
-import { Input, OptionButton, Screen, ZulipButton } from '../common';
+import { Input, SelectableOptionRow, Screen, ZulipButton } from '../common';
 import { getSelfUserStatusText } from '../selectors';
 import { IconCancel, IconDone } from '../common/Icons';
 import statusSuggestions from './userStatusTextSuggestions';
@@ -90,11 +90,13 @@ class UserStatusScreen extends PureComponent<Props, State> {
           keyboardShouldPersistTaps="always"
           keyExtractor={item => item}
           renderItem={({ item, index }) => (
-            <OptionButton
+            <SelectableOptionRow
               key={item}
-              label={item}
-              onPress={() => {
-                this.setStatusTextState(_(item));
+              itemKey={item}
+              title={item}
+              selected={item === statusText}
+              onRequestSelectionChange={itemKey => {
+                this.setStatusTextState(_(itemKey));
               }}
             />
           )}