verdnatura-mirror
/
verdnatura-chat
forked from verdnatura-mirror/Rocket.Chat.ReactNative
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Chore: Evaluate DisplayPrefsView - TypeScript (#4127) 

* Chore: Evaluate DisplayPrefsView - TypeScript

* minor tweak
This commit is contained in:
Reinaldo Neto 2022-05-02 09:12:41 -03:00 committed by GitHub
parent f04b15a432
commit a1e672df0e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 10 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
app/views/DisplayPrefsView.tsx
View File

@ -1,11 +1,12 @@
import { StackNavigationProp } from '@react-navigation/stack';
import React, { useEffect } from 'react'; import React, { useEffect } from 'react';
import { StackNavigationProp } from '@react-navigation/stack';
import { useNavigation } from '@react-navigation/native';
import { Switch } from 'react-native'; import { Switch } from 'react-native';
import { RadioButton } from 'react-native-ui-lib'; import { RadioButton } from 'react-native-ui-lib';
import { useDispatch, useSelector } from 'react-redux'; import { useDispatch, useSelector } from 'react-redux';
import { setPreference } from '../actions/sortPreferences'; import { setPreference } from '../actions/sortPreferences';
import { DisplayMode, SortBy, themes } from '../lib/constants'; import { DisplayMode, SortBy } from '../lib/constants';
import * as HeaderButton from '../containers/HeaderButton'; import * as HeaderButton from '../containers/HeaderButton';
import * as List from '../containers/List'; import * as List from '../containers/List';
import { ICON_SIZE } from '../containers/List/constants'; import { ICON_SIZE } from '../containers/List/constants';
@ -18,22 +19,17 @@ import { useTheme } from '../theme';
import { events, logEvent } from '../utils/log'; import { events, logEvent } from '../utils/log';
import { saveSortPreference } from '../lib/methods'; import { saveSortPreference } from '../lib/methods';
interface IDisplayPrefsView { const DisplayPrefsView = (): React.ReactElement => {
navigation: StackNavigationProp<SettingsStackParamList, 'DisplayPrefsView'>; const navigation = useNavigation<StackNavigationProp<SettingsStackParamList, 'DisplayPrefsView'>>();
isMasterDetail: boolean; const { colors } = useTheme();
}
const DisplayPrefsView = (props: IDisplayPrefsView): JSX.Element => {
const { theme } = useTheme();
const { sortBy, groupByType, showFavorites, showUnread, showAvatar, displayMode } = useSelector( const { sortBy, groupByType, showFavorites, showUnread, showAvatar, displayMode } = useSelector(
(state: IApplicationState) => state.sortPreferences (state: IApplicationState) => state.sortPreferences
); );
const { isMasterDetail } = useSelector((state: any) => state.app); const { isMasterDetail } = useSelector((state: IApplicationState) => state.app);
const dispatch = useDispatch(); const dispatch = useDispatch();
useEffect(() => { useEffect(() => {
const { navigation } = props;
navigation.setOptions({ navigation.setOptions({
title: I18n.t('Display') title: I18n.t('Display')
}); });
@ -42,7 +38,7 @@ const DisplayPrefsView = (props: IDisplayPrefsView): JSX.Element => {
headerLeft: () => <HeaderButton.Drawer navigation={navigation} testID='display-view-drawer' /> headerLeft: () => <HeaderButton.Drawer navigation={navigation} testID='display-view-drawer' />
}); });
} }
}, []); }, [isMasterDetail, navigation]);
const setSortPreference = (param: Partial<IPreferences>) => { const setSortPreference = (param: Partial<IPreferences>) => {
dispatch(setPreference(param)); dispatch(setPreference(param));
@ -90,7 +86,7 @@ const DisplayPrefsView = (props: IDisplayPrefsView): JSX.Element => {
}; };
const renderCheckBox = (value: boolean) => ( const renderCheckBox = (value: boolean) => (
<List.Icon name={value ? 'checkbox-checked' : 'checkbox-unchecked'} color={value ? themes[theme].actionTintColor : null} /> <List.Icon name={value ? 'checkbox-checked' : 'checkbox-unchecked'} color={value ? colors.actionTintColor : null} />
); );
const renderAvatarSwitch = (value: boolean) => ( const renderAvatarSwitch = (value: boolean) => (
@ -98,11 +94,7 @@ const DisplayPrefsView = (props: IDisplayPrefsView): JSX.Element => {
); );
const renderRadio = (value: boolean) => ( const renderRadio = (value: boolean) => (
<RadioButton <RadioButton selected={!!value} color={value ? colors.actionTintColor : colors.auxiliaryText} size={ICON_SIZE} />
selected={!!value}
color={value ? themes[theme].actionTintColor : themes[theme].auxiliaryText}
size={ICON_SIZE}
/>
); );
return ( return (
@ -188,6 +180,4 @@ const DisplayPrefsView = (props: IDisplayPrefsView): JSX.Element => {
); );
}; };
DisplayPrefsView.propTypes = {};
export default DisplayPrefsView; export default DisplayPrefsView;