Merge aa5402387d into 54f2cea4e9

app/containers/Switch.tsx

@@ -0,0 +1,37 @@
+import React from 'react';
+import { Switch as SwitchRN } from 'react-native';
+
+import { useTheme } from '../theme';
+
+export const SWITCH_TRACK_COLOR = {
+    false: '#767577',
+    true: '#81b0ff'
+};
+  
+
+interface ISwitch {
+  value: boolean;
+  onValueChange: (value: boolean) => void;
+  testID?: string;
+  disabled?: boolean;
+  style?: object;
+  trackColor?: typeof SWITCH_TRACK_COLOR;
+}
+
+const Switch = ({ value, onValueChange, testID, disabled, style, trackColor }: ISwitch) => {
+  const { colors } = useTheme();
+
+  return (
+    <SwitchRN
+      value={value}
+      style={style}
+      onValueChange={onValueChange}
+      thumbColor={value ? colors.actionTintColor : colors.auxiliaryText}
+      trackColor={trackColor?? SWITCH_TRACK_COLOR}
+      disabled={disabled}
+      testID={testID}
+    />
+  );
+};
+
+export default Switch;

app/ee/omnichannel/containers/OmnichannelHeader/index.tsx

@@ -1,6 +1,7 @@
 import React, { memo, useEffect, useState } from 'react';
-import { Switch, View } from 'react-native';
+import { View } from 'react-native';
 
+import Switch from '../../../../containers/Switch';
 import * as List from '../../../../containers/List';
 import styles from './styles';
 import { SWITCH_TRACK_COLOR, themes } from '../../../../lib/constants';

app/views/CreateDiscussionView/index.tsx

@@ -1,8 +1,9 @@
 import React from 'react';
 import { connect } from 'react-redux';
-import { ScrollView, Switch, Text } from 'react-native';
+import { ScrollView, Text } from 'react-native';
 import { StackNavigationOptions } from '@react-navigation/stack';
 
+import Switch from '../../containers/Switch';
 import { sendLoadingEvent } from '../../containers/Loading';
 import KeyboardView from '../../containers/KeyboardView';
 import scrollPersistTaps from '../../lib/methods/helpers/scrollPersistTaps';

app/views/DirectoryView/Options.tsx

@@ -1,6 +1,7 @@
 import React, { PureComponent } from 'react';
-import { Animated, Easing, Switch, Text, TouchableWithoutFeedback, View } from 'react-native';
+import { Animated, Easing, Text, TouchableWithoutFeedback, View } from 'react-native';
 
+import Switch from '../../containers/Switch';
 import Touch from '../../containers/Touch';
 import { CustomIcon, TIconsName } from '../../containers/CustomIcon';
 import Check from '../../containers/Check';

app/views/DisplayPrefsView.tsx

@@ -1,10 +1,10 @@
 import React, { useEffect } from 'react';
 import { StackNavigationProp } from '@react-navigation/stack';
 import { useNavigation } from '@react-navigation/native';
-import { Switch } from 'react-native';
 import { RadioButton } from 'react-native-ui-lib';
 import { useDispatch } from 'react-redux';
 
+import Switch from '../containers/Switch';
 import { setPreference } from '../actions/sortPreferences';
 import { DisplayMode, SortBy } from '../lib/constants';
 import * as HeaderButton from '../containers/HeaderButton';

app/views/NotificationPreferencesView/index.tsx

@@ -1,7 +1,8 @@
 import { RouteProp, useNavigation, useRoute } from '@react-navigation/core';
 import React, { useEffect, useState } from 'react';
-import { Switch, Text } from 'react-native';
+import { Text } from 'react-native';
 
+import Switch from '../../containers/Switch';
 import { TActionSheetOptionsItem, useActionSheet } from '../../containers/ActionSheet';
 import { CustomIcon } from '../../containers/CustomIcon';
 import * as List from '../../containers/List';

app/views/RoomInfoEditView/SwitchContainer.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
-import { Switch, Text, TextStyle, View, ViewStyle } from 'react-native';
+import { Text, TextStyle, View, ViewStyle } from 'react-native';
 
+import Switch from '../../containers/Switch';
 import { TSupportedThemes } from '../../theme';
 import { SWITCH_TRACK_COLOR, themes } from '../../lib/constants';
 import styles from './styles';

app/views/ScreenLockConfigView.tsx

@@ -1,9 +1,9 @@
 import React from 'react';
-import { Switch } from 'react-native';
 import { connect } from 'react-redux';
 import { StackNavigationOptions } from '@react-navigation/stack';
 import { Subscription } from 'rxjs';
 
+import Switch from '../containers/Switch';
 import I18n from '../i18n';
 import { TSupportedThemes, withTheme } from '../theme';
 import StatusBar from '../containers/StatusBar';

app/views/SecurityPrivacyView.tsx

@@ -1,8 +1,8 @@
 import AsyncStorage from '@react-native-async-storage/async-storage';
 import { StackNavigationProp } from '@react-navigation/stack';
 import React, { useEffect, useState } from 'react';
-import { Switch } from 'react-native';
 
+import Switch from '../containers/Switch';
 import * as List from '../containers/List';
 import SafeAreaView from '../containers/SafeAreaView';
 import StatusBar from '../containers/StatusBar';

app/views/UserPreferencesView/index.tsx

@@ -1,8 +1,8 @@
 import { StackNavigationProp } from '@react-navigation/stack';
 import React, { useEffect } from 'react';
-import { Switch } from 'react-native';
 import { useDispatch } from 'react-redux';
 
+import Switch from '../../containers/Switch';
 import { setUser } from '../../actions/login';
 import I18n from '../../i18n';
 import log, { logEvent, events } from '../../lib/methods/helpers/log';