From afaa185fe7ef48470a1e32e5d7c5e522da06974f Mon Sep 17 00:00:00 2001 From: Reinaldo Neto <47038980+reinaldonetof@users.noreply.github.com> Date: Thu, 2 Dec 2021 10:29:01 -0300 Subject: [PATCH] Chore: Migrate SetUsernameView to Typescript (#3526) --- app/presentation/KeyboardView.tsx | 2 +- ...SetUsernameView.js => SetUsernameView.tsx} | 44 +++++++++++-------- 2 files changed, 27 insertions(+), 19 deletions(-) rename app/views/{SetUsernameView.js => SetUsernameView.tsx} (77%) diff --git a/app/presentation/KeyboardView.tsx b/app/presentation/KeyboardView.tsx index 5319df82b..aa4f1182d 100644 --- a/app/presentation/KeyboardView.tsx +++ b/app/presentation/KeyboardView.tsx @@ -4,7 +4,7 @@ import { KeyboardAwareScrollView, KeyboardAwareScrollViewProps } from '@codler/r import scrollPersistTaps from '../utils/scrollPersistTaps'; interface IKeyboardViewProps extends KeyboardAwareScrollViewProps { - keyboardVerticalOffset: number; + keyboardVerticalOffset?: number; scrollEnabled?: boolean; children: React.ReactNode; } diff --git a/app/views/SetUsernameView.js b/app/views/SetUsernameView.tsx similarity index 77% rename from app/views/SetUsernameView.js rename to app/views/SetUsernameView.tsx index 158c6d013..221561697 100644 --- a/app/views/SetUsernameView.js +++ b/app/views/SetUsernameView.tsx @@ -1,8 +1,10 @@ import React from 'react'; -import PropTypes from 'prop-types'; +import { StackNavigationOptions, StackNavigationProp } from '@react-navigation/stack'; +import { Dispatch } from 'redux'; import { ScrollView, StyleSheet, Text } from 'react-native'; import { connect } from 'react-redux'; import Orientation from 'react-native-orientation-locker'; +import { RouteProp } from '@react-navigation/native'; import { loginRequest as loginRequestAction } from '../actions/login'; import TextInput from '../containers/TextInput'; @@ -27,21 +29,27 @@ const styles = StyleSheet.create({ } }); -class SetUsernameView extends React.Component { - static navigationOptions = ({ route }) => ({ +interface ISetUsernameViewState { + username: string; + saving: boolean; +} + +interface ISetUsernameViewProps { + navigation: StackNavigationProp; + route: RouteProp<{ SetUsernameView: { title: string } }, 'SetUsernameView'>; + server: string; + userId: string; + loginRequest: ({ resume }: { resume: string }) => void; + token: string; + theme: string; +} + +class SetUsernameView extends React.Component { + static navigationOptions = ({ route }: Pick): StackNavigationOptions => ({ title: route.params?.title }); - static propTypes = { - navigation: PropTypes.object, - server: PropTypes.string, - userId: PropTypes.string, - loginRequest: PropTypes.func, - token: PropTypes.string, - theme: PropTypes.string - }; - - constructor(props) { + constructor(props: ISetUsernameViewProps) { super(props); this.state = { username: '', @@ -61,7 +69,7 @@ class SetUsernameView extends React.Component { } } - shouldComponentUpdate(nextProps, nextState) { + shouldComponentUpdate(nextProps: ISetUsernameViewProps, nextState: ISetUsernameViewState) { const { username, saving } = this.state; const { theme } = this.props; if (nextProps.theme !== theme) { @@ -88,7 +96,7 @@ class SetUsernameView extends React.Component { try { await RocketChat.saveUserProfile({ username }); await loginRequest({ resume: token }); - } catch (e) { + } catch (e: any) { showErrorAlert(e.message, I18n.t('Oops')); } this.setState({ saving: false }); @@ -136,13 +144,13 @@ class SetUsernameView extends React.Component { } } -const mapStateToProps = state => ({ +const mapStateToProps = (state: any) => ({ server: state.server.server, token: getUserSelector(state).token }); -const mapDispatchToProps = dispatch => ({ - loginRequest: params => dispatch(loginRequestAction(params)) +const mapDispatchToProps = (dispatch: Dispatch) => ({ + loginRequest: (params: { resume: string }) => dispatch(loginRequestAction(params)) }); export default connect(mapStateToProps, mapDispatchToProps)(withTheme(SetUsernameView));