Merge 4.27.0 into master (#4135)

.circleci/config.yml

@@ -3,7 +3,7 @@ defaults: &defaults
 
 macos: &macos
   macos:
-    xcode: "12.5.0"
+    xcode: "13.3.0"
   resource_class: large
 
 bash-env: &bash-env
@@ -339,7 +339,7 @@ jobs:
   lint-testunit:
     <<: *defaults
     docker:
-      - image: circleci/node:15
+      - image: cimg/node:16.14
     resource_class: large
     environment:
       CODECOV_TOKEN: caa771ab-3d45-4756-8e2a-e1f25996fef6
@@ -372,7 +372,7 @@ jobs:
   android-build-experimental:
     <<: *defaults
     docker:
-      - image: circleci/android:api-29-node
+      - image: cimg/android:2022.03.1-node
     environment:
       <<: *android-env
       <<: *bash-env
@@ -383,7 +383,7 @@ jobs:
   android-build-official:
     <<: *defaults
     docker:
-      - image: circleci/android:api-29-node
+      - image: cimg/android:2022.03.1-node
     environment:
       <<: *android-env
       <<: *bash-env
@@ -394,7 +394,7 @@ jobs:
   android-internal-app-sharing-experimental:
     <<: *defaults
     docker:
-      - image: circleci/android:api-28-node
+      - image: cimg/android:2022.03.1-node
 
     steps:
       - upload-to-internal-app-sharing
@@ -402,7 +402,7 @@ jobs:
   android-google-play-beta-experimental:
     <<: *defaults
     docker:
-      - image: circleci/android:api-29-node
+      - image: cimg/android:2022.03.1-node
 
     steps:
       - upload-to-google-play-beta:
@@ -411,14 +411,14 @@ jobs:
   android-google-play-production-experimental:
     <<: *defaults
     docker:
-      - image: circleci/android:api-29-node
+      - image: cimg/android:2022.03.1-node
     steps:
       - upload-to-google-play-production
 
   android-google-play-beta-official:
     <<: *defaults
     docker:
-      - image: circleci/android:api-29-node
+      - image: cimg/android:2022.03.1-node
 
     steps:
       - upload-to-google-play-beta:

.eslintrc.js

@@ -17,7 +17,7 @@ module.exports = {
 			legacyDecorators: true
 		}
 	},
-	plugins: ['react', 'jsx-a11y', 'import', 'react-native', '@babel', 'jest'],
+	plugins: ['react', 'jsx-a11y', 'import', 'react-native', '@babel', 'jest', 'react-hooks'],
 	env: {
 		browser: true,
 		commonjs: true,
@@ -148,7 +148,9 @@ module.exports = {
 		'no-async-promise-executor': [0],
 		'max-classes-per-file': [0],
 		'no-multiple-empty-lines': [0],
-		'no-sequences': 'off'
+		'no-sequences': 'off',
+		'react-hooks/rules-of-hooks': 'error',
+		'react-hooks/exhaustive-deps': 'warn'
 	},
 	globals: {
 		__DEV__: true
@@ -237,7 +239,9 @@ module.exports = {
 					}
 				],
 				'new-cap': 'off',
-				'lines-between-class-members': 'off'
+				'lines-between-class-members': 'off',
+				'react-hooks/rules-of-hooks': 'error',
+				'react-hooks/exhaustive-deps': 'warn'
 			},
 			globals: {
 				JSX: true

android/app/build.gradle

@@ -144,7 +144,7 @@ android {
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
         versionCode VERSIONCODE as Integer
-        versionName "4.26.2"
+        versionName "4.27.0"
         vectorDrawables.useSupportLibrary = true
         if (!isFoss) {
             manifestPlaceholders = [BugsnagAPIKey: BugsnagAPIKey as String]
@@ -277,14 +277,17 @@ android {
 dependencies {
     addUnimodulesDependencies()
     implementation project(':@react-native-community_viewpager')
-    playImplementation project(':reactnativenotifications')
+    playImplementation project(':react-native-notifications')
+    playImplementation 'com.google.firebase:firebase-core:16.0.0'
     playImplementation project(':@react-native-firebase_app')
     playImplementation project(':@react-native-firebase_analytics')
     playImplementation project(':@react-native-firebase_crashlytics')
+    implementation(project(':react-native-jitsi-meet')) { // https://github.com/skrafft/react-native-jitsi-meet#side-note
+      exclude group: 'com.facebook.react',module:'react-native-svg'
+    }
     implementation fileTree(dir: "libs", include: ["*.jar"])
     //noinspection GradleDynamicVersion
     implementation "com.facebook.react:react-native:+"  // From node_modules
-    playImplementation "com.google.firebase:firebase-messaging:18.0.0"
     implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.0.0"
     debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {
       exclude group:'com.facebook.fbjni'

android/app/src/play/java/chat/rocket/reactnative/AdditionalModules.java

@@ -3,7 +3,6 @@ package chat.rocket.reactnative;
 import android.app.Application;
 
 import com.facebook.react.ReactPackage;
-import com.wix.reactnativenotifications.RNNotificationsPackage;
 
 import java.util.Arrays;
 import java.util.List;
@@ -17,8 +16,7 @@ public class AdditionalModules {
         return Arrays.<ReactPackage>asList(
                 new ReactNativeFirebaseAnalyticsPackage(),
                 new ReactNativeFirebaseAppPackage(),
-                new ReactNativeFirebaseCrashlyticsPackage(),
-                new RNNotificationsPackage(application)
+                new ReactNativeFirebaseCrashlyticsPackage()
         );
     }
 }

android/settings.gradle

@@ -2,8 +2,6 @@ apply from: '../node_modules/react-native-unimodules/gradle.groovy'
 includeUnimodulesProjects()
 
 rootProject.name = 'RocketChatRN'
-include ':reactnativenotifications'
-project(':reactnativenotifications').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-notifications/android/app')
 include ':@react-native-community_viewpager'
 project(':@react-native-community_viewpager').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-community/viewpager/android')
 include ':@react-native-firebase_app'

app/AppContainer.tsx

-import React from 'react';
+import React, { useContext, memo, useEffect } from 'react';
 import { NavigationContainer } from '@react-navigation/native';
 import { createStackNavigator } from '@react-navigation/stack';
 import { connect } from 'react-redux';
 
 import { SetUsernameStackParamList, StackParamList } from './definitions/navigationTypes';
-import Navigation from './lib/Navigation';
+import Navigation from './lib/navigation/appNavigation';
 import { defaultHeader, getActiveRouteName, navigationTheme } from './utils/navigation';
 import { RootEnum } from './definitions';
 // Stacks
@@ -27,21 +27,23 @@ const SetUsernameStack = () => (
 
 // App
 const Stack = createStackNavigator<StackParamList>();
-const App = React.memo(({ root, isMasterDetail }: { root: string; isMasterDetail: boolean }) => {
+const App = memo(({ root, isMasterDetail }: { root: string; isMasterDetail: boolean }) => {
+	const { theme } = useContext(ThemeContext);
+	useEffect(() => {
+		if (root) {
+			const state = Navigation.navigationRef.current?.getRootState();
+			const currentRouteName = getActiveRouteName(state);
+			Navigation.routeNameRef.current = currentRouteName;
+			setCurrentScreen(currentRouteName);
+		}
+	}, [root]);
+
 	if (!root) {
 		return null;
 	}
 
-	const { theme } = React.useContext(ThemeContext);
 	const navTheme = navigationTheme(theme);
 
-	React.useEffect(() => {
-		const state = Navigation.navigationRef.current?.getRootState();
-		const currentRouteName = getActiveRouteName(state);
-		Navigation.routeNameRef.current = currentRouteName;
-		setCurrentScreen(currentRouteName);
-	}, []);
-
 	return (
 		<NavigationContainer
 			theme={navTheme}

app/actions/login.ts

@@ -25,6 +25,7 @@ interface ILoginFailure extends Action {
 
 interface ILogout extends Action {
 	forcedByServer: boolean;
+	message: string;
 }
 
 interface ISetUser extends Action {
@@ -79,10 +80,11 @@ export function loginFailure(err: Record<string, any>): ILoginFailure {
 	};
 }
 
-export function logout(forcedByServer = false): ILogout {
+export function logout(forcedByServer = false, message = ''): ILogout {
 	return {
 		type: types.LOGOUT,
-		forcedByServer
+		forcedByServer,
+		message
 	};
 }
 

app/actions/messages.ts

 import { Action } from 'redux';
 
 import { MESSAGES } from './actionsTypes';
-
-type IMessage = Record<string, string>;
+import { IMessage } from '../definitions';
 
 interface IReplyBroadcast extends Action {
 	message: IMessage;

app/containers/ActionSheet/ActionSheet.tsx

@@ -7,7 +7,7 @@ import Animated, { Easing, Extrapolate, interpolateNode, Value } from 'react-nat
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import ScrollBottomSheet from 'react-native-scroll-bottom-sheet';
 
-import { themes } from '../../constants/colors';
+import { themes } from '../../lib/constants';
 import { useDimensions, useOrientation } from '../../dimensions';
 import I18n from '../../i18n';
 import { useTheme } from '../../theme';

app/containers/ActionSheet/Handle.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { View } from 'react-native';
 
 import styles from './styles';
-import { themes } from '../../constants/colors';
+import { themes } from '../../lib/constants';
 import { useTheme } from '../../theme';
 
 export const Handle = React.memo(() => {

app/containers/ActionSheet/Item.tsx

 import React from 'react';
 import { Text, View } from 'react-native';
 
-import { themes } from '../../constants/colors';
+import { themes } from '../../lib/constants';
 import { CustomIcon } from '../../lib/Icons';
 import { useTheme } from '../../theme';
 import { Button } from './Button';

app/containers/ActionSheet/Provider.tsx

@@ -2,7 +2,7 @@ import React, { ForwardedRef, forwardRef, useContext, useRef } from 'react';
 
 import ActionSheet from './ActionSheet';
 
-export type TActionSheetOptionsItem = { title: string; icon: string; onPress: () => void };
+export type TActionSheetOptionsItem = { title: string; icon: string; onPress: () => void; danger?: boolean };
 
 export type TActionSheetOptions = {
 	options: TActionSheetOptionsItem[];

app/containers/ActivityIndicator.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { ActivityIndicator, ActivityIndicatorProps, StyleSheet } from 'react-native';
 
 import { useTheme } from '../theme';
-import { themes } from '../constants/colors';
+import { themes } from '../lib/constants';
 
 interface IActivityIndicator extends ActivityIndicatorProps {
 	absolute?: boolean;

app/containers/AppVersion.tsx

 import React from 'react';
 import { StyleSheet, Text, View } from 'react-native';
 
-import { themes } from '../constants/colors';
+import { themes } from '../lib/constants';
 import sharedStyles from '../views/Styles';
 import { getReadableVersion } from '../utils/deviceInfo';
 import I18n from '../i18n';
+import { TSupportedThemes } from '../theme';
 
 const styles = StyleSheet.create({
 	container: {
@@ -20,7 +21,7 @@ const styles = StyleSheet.create({
 	}
 });
 
-const AppVersion = React.memo(({ theme }: { theme: string }) => (
+const AppVersion = React.memo(({ theme }: { theme: TSupportedThemes }) => (
 	<View style={styles.container}>
 		<Text style={[styles.text, { color: themes[theme].auxiliaryText }]}>
 			{I18n.t('Version_no', { version: '' })}

app/containers/Avatar/Avatar.tsx

@@ -28,14 +28,15 @@ const Avatar = React.memo(
 		text,
 		size = 25,
 		borderRadius = 4,
-		type = SubscriptionType.DIRECT
+		type = SubscriptionType.DIRECT,
+		externalProviderUrl
 	}: IAvatar) => {
+		const { theme } = useTheme();
+
 		if ((!text && !avatar && !emoji && !rid) || !server) {
 			return null;
 		}
 
-		const { theme } = useTheme();
-
 		const avatarStyle = {
 			width: size,
 			height: size,
@@ -67,7 +68,8 @@ const Avatar = React.memo(
 					avatarETag,
 					serverVersion,
 					rid,
-					blockUnauthenticatedAccess
+					blockUnauthenticatedAccess,
+					externalProviderUrl
 				});
 			}
 

app/containers/Avatar/index.tsx

@@ -32,7 +32,10 @@ class AvatarContainer extends React.Component<IAvatar, any> {
 
 	shouldComponentUpdate(nextProps: IAvatar, nextState: { avatarETag: string }) {
 		const { avatarETag } = this.state;
-		const { text, type } = this.props;
+		const { text, type, size, externalProviderUrl } = this.props;
+		if (nextProps.externalProviderUrl !== externalProviderUrl) {
+			return true;
+		}
 		if (nextState.avatarETag !== avatarETag) {
 			return true;
 		}
@@ -42,6 +45,10 @@ class AvatarContainer extends React.Component<IAvatar, any> {
 		if (nextProps.type !== type) {
 			return true;
 		}
+		if (nextProps.size !== size) {
+			return true;
+		}
+
 		return false;
 	}
 
@@ -100,6 +107,7 @@ const mapStateToProps = (state: IApplicationState) => ({
 	blockUnauthenticatedAccess:
 		(state.share.settings?.Accounts_AvatarBlockUnauthenticatedAccess as boolean) ??
 		state.settings.Accounts_AvatarBlockUnauthenticatedAccess ??
-		true
+		true,
+	externalProviderUrl: state.settings.Accounts_AvatarExternalProviderUrl as string
 });
 export default connect(mapStateToProps)(AvatarContainer);

app/containers/Avatar/interfaces.ts

@@ -23,4 +23,5 @@ export interface IAvatar {
 	rid?: string;
 	blockUnauthenticatedAccess?: boolean;
 	serverVersion: string | null;
+	externalProviderUrl?: string;
 }

app/containers/BackgroundContainer/index.tsx

@@ -3,7 +3,7 @@ import { ActivityIndicator, ImageBackground, StyleSheet, Text, View } from 'reac
 
 import { useTheme } from '../../theme';
 import sharedStyles from '../../views/Styles';
-import { themes } from '../../constants/colors';
+import { themes } from '../../lib/constants';
 
 interface IBackgroundContainer {
 	text?: string;

app/containers/Button/index.tsx

@@ -2,7 +2,8 @@ import React from 'react';
 import { StyleSheet, Text } from 'react-native';
 import Touchable from 'react-native-platform-touchable';
 
-import { themes } from '../../constants/colors';
+import { TSupportedThemes } from '../../theme';
+import { themes } from '../../lib/constants';
 import sharedStyles from '../../views/Styles';
 import ActivityIndicator from '../ActivityIndicator';
 
@@ -13,7 +14,7 @@ interface IButtonProps {
 	disabled: boolean;
 	backgroundColor: string;
 	loading: boolean;
-	theme: string;
+	theme: TSupportedThemes;
 	color: string;
 	fontSize: any;
 	style: any;