diff --git a/ios/Podfile.lock b/ios/Podfile.lock index eeff72b35c1..65bb8f947f1 100644 --- a/ios/Podfile.lock +++ b/ios/Podfile.lock @@ -723,4 +723,4 @@ SPEC CHECKSUMS: PODFILE CHECKSUM: 0eb2bf1b0f7972fc7183f5eac73708f76355c614 -COCOAPODS: 1.9.3 +COCOAPODS: 1.10.0 diff --git a/src/user-status/UserStatusScreen.js b/src/user-status/UserStatusScreen.js index 555981c0d34..755d87dc2f0 100644 --- a/src/user-status/UserStatusScreen.js +++ b/src/user-status/UserStatusScreen.js @@ -1,20 +1,17 @@ /* @flow strict-local */ -import React, { PureComponent } from 'react'; +import React, { useContext, useState } from 'react'; import { FlatList, View } from 'react-native'; import { TranslationContext } from '../boot/TranslationProvider'; import { createStyleSheet } from '../styles'; - -import type { RouteProp } from '../react-navigation'; import type { AppNavigationProp } from '../nav/AppNavigator'; -import * as NavigationService from '../nav/NavigationService'; -import type { GetText, Dispatch } from '../types'; -import { connect } from '../react-redux'; +import type { RouteProp } from '../react-navigation'; import { Input, OptionButton, Screen, ZulipButton } from '../common'; import { getSelfUserStatusText } from '../selectors'; import { IconCancel, IconDone } from '../common/Icons'; import statusSuggestions from './userStatusTextSuggestions'; import { updateUserStatusText } from './userStatusActions'; -import { navigateBack } from '../nav/navActions'; +import { useNavigation } from '../react-navigation'; +import { useSelector, useDispatch } from '../react-redux'; const styles = createStyleSheet({ statusTextInput: { @@ -32,93 +29,72 @@ const styles = createStyleSheet({ type Props = $ReadOnly<{| navigation: AppNavigationProp<'user-status'>, route: RouteProp<'user-status', void>, - - dispatch: Dispatch, - userStatusText: string, |}>; -type State = {| - statusText: string, -|}; - -class UserStatusScreen extends PureComponent { - static contextType = TranslationContext; - context: GetText; - - state = { - statusText: this.props.userStatusText, - }; +export default function UserStatusScreen(props: Props) { + const _ = useContext(TranslationContext); + const userStatusText = useSelector(state => getSelfUserStatusText(state)); + const [statusText, setStatusText] = useState(userStatusText); + const navigation = useNavigation(); + const dispatch = useDispatch(); - setStatusTextState = (statusText: string) => { - this.setState({ - statusText, - }); + const setStatusTextState = (text: string) => { + setStatusText(text); }; - updateStatusText = (statusText: string) => { - const { dispatch } = this.props; - dispatch(updateUserStatusText(statusText)); - NavigationService.dispatch(navigateBack()); + const updateStatusText = (text: string) => { + dispatch(updateUserStatusText(text)); + navigation.goBack(); }; - handleStatusTextUpdate = () => { - const { statusText } = this.state; - this.updateStatusText(statusText); + const handleStatusTextUpdate = () => { + updateStatusText(statusText); }; - handleStatusTextClear = () => { - this.setStatusTextState(''); - this.updateStatusText(''); + const handleStatusTextClear = () => { + setStatusTextState(''); + updateStatusText(''); }; - render() { - const { statusText } = this.state; - const _ = this.context; - - return ( - - + + item} + renderItem={({ item, index }) => ( + { + setStatusTextState(_(item)); + }} + /> + )} + /> + + - item} - renderItem={({ item, index }) => ( - { - this.setStatusTextState(_(item)); - }} - /> - )} + - - - - - - ); - } + + + ); } - -export default connect(state => ({ - userStatusText: getSelfUserStatusText(state), -}))(UserStatusScreen);