Chore: Migrate AutoTranslateView to Typescript (#3380)

* [improve] - migrate the view: AutoTranslateView to typescript

* TODO -> TODO:

Co-authored-by: Diego Mello <diegolmello@gmail.com>
This commit is contained in:
Alex Junior 2021-09-15 11:38:51 -03:00 committed by GitHub
parent 93d734bfa9
commit 212d7baea0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 32 additions and 14 deletions

View File

@ -235,7 +235,8 @@ module.exports = {
ignoreRestSiblings: true ignoreRestSiblings: true
} }
], ],
'new-cap': 'off' 'new-cap': 'off',
'lines-between-class-members': 'off'
}, },
globals: { globals: {
JSX: true JSX: true

View File

@ -1,5 +1,4 @@
import React from 'react'; import React from 'react';
import PropTypes from 'prop-types';
import { FlatList, StyleSheet, Switch } from 'react-native'; import { FlatList, StyleSheet, Switch } from 'react-native';
import RocketChat from '../../lib/rocketchat'; import RocketChat from '../../lib/rocketchat';
@ -17,17 +16,33 @@ const styles = StyleSheet.create({
} }
}); });
class AutoTranslateView extends React.Component { interface IRoom {
observe: Function;
autoTranslateLanguage: boolean;
autoTranslate: boolean;
}
interface IAutoTranslateViewProps {
route: {
params: {
rid?: string;
room?: IRoom;
};
};
theme: string;
}
class AutoTranslateView extends React.Component<IAutoTranslateViewProps, any> {
static navigationOptions = () => ({ static navigationOptions = () => ({
title: I18n.t('Auto_Translate') title: I18n.t('Auto_Translate')
}); });
static propTypes = { private mounted: boolean;
route: PropTypes.object, private rid: string | undefined;
theme: PropTypes.string private roomObservable: any;
}; private subscription: any;
constructor(props) { constructor(props: IAutoTranslateViewProps) {
super(props); super(props);
this.mounted = false; this.mounted = false;
this.rid = props.route.params?.rid; this.rid = props.route.params?.rid;
@ -35,7 +50,7 @@ class AutoTranslateView extends React.Component {
if (room && room.observe) { if (room && room.observe) {
this.roomObservable = room.observe(); this.roomObservable = room.observe();
this.subscription = this.roomObservable.subscribe(changes => { this.subscription = this.roomObservable.subscribe((changes: IRoom) => {
if (this.mounted) { if (this.mounted) {
const { selectedLanguage, enableAutoTranslate } = this.state; const { selectedLanguage, enableAutoTranslate } = this.state;
if (selectedLanguage !== changes.autoTranslateLanguage) { if (selectedLanguage !== changes.autoTranslateLanguage) {
@ -49,8 +64,8 @@ class AutoTranslateView extends React.Component {
} }
this.state = { this.state = {
languages: [], languages: [],
selectedLanguage: room.autoTranslateLanguage, selectedLanguage: room?.autoTranslateLanguage,
enableAutoTranslate: room.autoTranslate enableAutoTranslate: room?.autoTranslate
}; };
} }
@ -87,13 +102,15 @@ class AutoTranslateView extends React.Component {
} }
}; };
saveAutoTranslateLanguage = async language => { saveAutoTranslateLanguage = async (language: string) => {
logEvent(events.AT_SET_LANG); logEvent(events.AT_SET_LANG);
try { try {
// TODO: remove the parameter options, after migrate the RocketChat
await RocketChat.saveAutoTranslate({ await RocketChat.saveAutoTranslate({
rid: this.rid, rid: this.rid,
field: 'autoTranslateLanguage', field: 'autoTranslateLanguage',
value: language value: language,
options: null
}); });
this.setState({ selectedLanguage: language }); this.setState({ selectedLanguage: language });
} catch (error) { } catch (error) {
@ -112,7 +129,7 @@ class AutoTranslateView extends React.Component {
return <Switch value={enableAutoTranslate} trackColor={SWITCH_TRACK_COLOR} onValueChange={this.toggleAutoTranslate} />; return <Switch value={enableAutoTranslate} trackColor={SWITCH_TRACK_COLOR} onValueChange={this.toggleAutoTranslate} />;
}; };
renderItem = ({ item }) => { renderItem = ({ item }: { item: { language: string; name: string } }) => {
const { selectedLanguage } = this.state; const { selectedLanguage } = this.state;
const { language, name } = item; const { language, name } = item;
const isSelected = selectedLanguage === language; const isSelected = selectedLanguage === language;