diff --git a/app/stacks/InsideStack.tsx b/app/stacks/InsideStack.tsx
index 544edb32d..95fdac203 100644
--- a/app/stacks/InsideStack.tsx
+++ b/app/stacks/InsideStack.tsx
@@ -178,11 +178,7 @@ const SettingsStackNavigator = () => {
/>
-
+
{
/>
-
+
;
-
-class DefaultBrowserView extends React.Component {
- static navigationOptions = (): StackNavigationOptions => ({
- title: I18n.t('Default_browser')
- });
-
- constructor(props: IDefaultBrowserViewProps) {
- super(props);
- this.state = {
- browser: null,
- supported: []
- };
- if (isIOS) {
- this.init();
- }
- }
-
- componentDidMount() {
- const browser = UserPreferences.getString(DEFAULT_BROWSER_KEY);
- this.setState({ browser });
- }
-
- init = () => {
- BROWSERS.forEach(browser => {
- const { value } = browser;
- Linking.canOpenURL(value).then(installed => {
- if (installed) {
- this.setState(({ supported }) => ({ supported: [...supported, browser] }));
- }
- });
- });
- };
-
- isSelected = (value: TValue) => {
- const { browser } = this.state;
- if (!browser && value === 'systemDefault:') {
- return true;
- }
- return browser === value;
- };
-
- changeDefaultBrowser = (newBrowser: TValue) => {
- logEvent(events.DB_CHANGE_DEFAULT_BROWSER, { browser: newBrowser });
- try {
- const browser = newBrowser || 'systemDefault:';
- UserPreferences.setString(DEFAULT_BROWSER_KEY, browser);
- this.setState({ browser });
- } catch {
- logEvent(events.DB_CHANGE_DEFAULT_BROWSER_F);
- }
- };
-
- renderIcon = () => {
- const { theme } = this.props;
- return ;
- };
-
- renderItem = ({ item }: { item: IBrowsersValues }) => {
- const { title, value } = item;
- return (
- this.changeDefaultBrowser(value)}
- testID={`default-browser-view-${title}`}
- right={() => (this.isSelected(value) ? this.renderIcon() : null)}
- translateTitle={false}
- />
- );
- };
-
- renderHeader = () => (
- <>
-
-
-
- );
-
- render() {
- const { supported } = this.state;
- return (
-
-
- item.value}
- contentContainerStyle={List.styles.contentContainerStyleFlatList}
- renderItem={this.renderItem}
- ListHeaderComponent={this.renderHeader}
- ListFooterComponent={List.Separator}
- ItemSeparatorComponent={List.Separator}
- />
-
- );
- }
-}
-
-export default withTheme(DefaultBrowserView);
diff --git a/app/views/DefaultBrowserView/Item.tsx b/app/views/DefaultBrowserView/Item.tsx
new file mode 100644
index 000000000..fc5e221cc
--- /dev/null
+++ b/app/views/DefaultBrowserView/Item.tsx
@@ -0,0 +1,34 @@
+import React from 'react';
+
+import I18n from '../../i18n';
+import { useTheme } from '../../theme';
+import * as List from '../../containers/List';
+import { IBrowsersValues, TValue } from '.';
+
+interface IRenderItem extends IBrowsersValues {
+ browser: string | null;
+ changeDefaultBrowser: (newBrowser: TValue) => void;
+}
+
+const Item = ({ title, value, browser, changeDefaultBrowser }: IRenderItem) => {
+ const { colors } = useTheme();
+
+ let isSelected = false;
+ if (!browser && value === 'systemDefault:') {
+ isSelected = true;
+ } else {
+ isSelected = browser === value;
+ }
+
+ return (
+ changeDefaultBrowser(value)}
+ testID={`default-browser-view-${title}`}
+ right={() => (isSelected ? : null)}
+ translateTitle={false}
+ />
+ );
+};
+
+export default Item;
diff --git a/app/views/DefaultBrowserView/index.tsx b/app/views/DefaultBrowserView/index.tsx
new file mode 100644
index 000000000..8711ab6de
--- /dev/null
+++ b/app/views/DefaultBrowserView/index.tsx
@@ -0,0 +1,110 @@
+import React, { useCallback, useEffect, useLayoutEffect, useState } from 'react';
+import { FlatList, Linking } from 'react-native';
+import { useNavigation } from '@react-navigation/native';
+
+import I18n from '../../i18n';
+import StatusBar from '../../containers/StatusBar';
+import * as List from '../../containers/List';
+import { DEFAULT_BROWSER_KEY } from '../../lib/methods/helpers/openLink';
+import { isIOS } from '../../lib/methods/helpers';
+import SafeAreaView from '../../containers/SafeAreaView';
+import UserPreferences from '../../lib/methods/userPreferences';
+import { events, logEvent } from '../../lib/methods/helpers/log';
+import Item from './Item';
+
+export type TValue = 'inApp' | 'systemDefault:' | 'googlechrome:' | 'firefox:' | 'brave:';
+
+export interface IBrowsersValues {
+ title: string;
+ value: TValue;
+}
+
+const DEFAULT_BROWSERS: IBrowsersValues[] = [
+ {
+ title: 'In_app',
+ value: 'inApp'
+ },
+ {
+ title: isIOS ? 'Safari' : 'Browser',
+ value: 'systemDefault:'
+ }
+];
+
+const BROWSERS: IBrowsersValues[] = [
+ {
+ title: 'Chrome',
+ value: 'googlechrome:'
+ },
+ {
+ title: 'Firefox',
+ value: 'firefox:'
+ },
+ {
+ title: 'Brave',
+ value: 'brave:'
+ }
+];
+
+const DefaultBrowserView = () => {
+ const [browser, setBrowser] = useState(null);
+ const [supported, setSupported] = useState([]);
+
+ const navigation = useNavigation();
+
+ useLayoutEffect(() => {
+ navigation.setOptions({
+ title: I18n.t('Close_Chat')
+ });
+ }, [navigation]);
+
+ useEffect(() => {
+ const getBrowser = UserPreferences.getString(DEFAULT_BROWSER_KEY);
+ setBrowser(getBrowser);
+
+ if (isIOS) {
+ BROWSERS.forEach(browser => {
+ const { value } = browser;
+ Linking.canOpenURL(value).then(installed => {
+ if (installed) {
+ setSupported(supported => [...supported, browser]);
+ }
+ });
+ });
+ }
+ }, []);
+
+ const changeDefaultBrowser = useCallback((newBrowser: TValue) => {
+ logEvent(events.DB_CHANGE_DEFAULT_BROWSER, { browser: newBrowser });
+ try {
+ const browser = newBrowser || 'systemDefault:';
+ UserPreferences.setString(DEFAULT_BROWSER_KEY, browser);
+ setBrowser(browser);
+ } catch {
+ logEvent(events.DB_CHANGE_DEFAULT_BROWSER_F);
+ }
+ }, []);
+
+ return (
+
+
+ item.value}
+ contentContainerStyle={List.styles.contentContainerStyleFlatList}
+ renderItem={({ item }) => (
+