remove await from load

.circleci/config.yml

@@ -1,9 +1,6 @@
 defaults: &defaults
   working_directory: ~/repo
 
-orbs:
-  android: circleci/android@2.1.2
-
 macos: &macos
   macos:
     xcode: "14.2.0"
@@ -330,14 +327,6 @@ commands:
           working_directory: ios
       - save_cache: *save-gems-cache
 
-  create-e2e-account-file:
-    description: "Create e2e account file"
-    steps:
-      - run:
-          command: |
-            echo $E2E_ACCOUNT | base64 --decode > ./e2e_account.ts
-          working_directory: e2e
-
 version: 2.1
 
 # EXECUTORS
@@ -449,94 +438,6 @@ jobs:
       - upload-to-google-play-beta:
           official: true
 
-  e2e-build-android:
-    <<: *defaults
-    executor:
-      name: android/android-machine
-      resource-class: xlarge
-      tag: 2022.12.1
-    environment:
-      <<: *android-env
-    steps:
-      - checkout
-      - restore_cache: *restore-npm-cache-linux
-      - run: *install-npm-modules
-      - save_cache: *save-npm-cache-linux
-      - restore_cache: *restore-gradle-cache
-      - run:
-          name: Configure Gradle
-          command: |
-            echo -e "" > ./gradle.properties
-            # echo -e "android.enableAapt2=false" >> ./gradle.properties
-            echo -e "android.useAndroidX=true" >> ./gradle.properties
-            echo -e "android.enableJetifier=true" >> ./gradle.properties
-            echo -e "newArchEnabled=false" >> ./gradle.properties
-            echo -e "FLIPPER_VERSION=0.125.0" >> ./gradle.properties
-            echo -e "VERSIONCODE=$CIRCLE_BUILD_NUM" >> ./gradle.properties
-            echo -e "APPLICATION_ID=chat.rocket.reactnative" >> ./gradle.properties
-            echo -e "BugsnagAPIKey=$BUGSNAG_KEY" >> ./gradle.properties
-            echo $KEYSTORE_EXPERIMENTAL_BASE64 | base64 --decode > ./app/$KEYSTORE_EXPERIMENTAL
-            echo -e "KEYSTORE=$KEYSTORE_EXPERIMENTAL" >> ./gradle.properties
-            echo -e "KEYSTORE_PASSWORD=$KEYSTORE_EXPERIMENTAL_PASSWORD" >> ./gradle.properties
-            echo -e "KEY_ALIAS=$KEYSTORE_EXPERIMENTAL_ALIAS" >> ./gradle.properties
-            echo -e "KEY_PASSWORD=$KEYSTORE_EXPERIMENTAL_PASSWORD" >> ./gradle.properties
-          working_directory: android
-      - run:
-          name: Build Android
-          command: |
-            echo "RUNNING_E2E_TESTS=true" > ./.env
-            yarn e2e:android-build
-      - save_cache: *save-gradle-cache
-      - store_artifacts:
-          path: android/app/build/outputs/apk/experimentalPlay/release/app-experimental-play-release.apk
-      - store_artifacts:
-          path: android/app/build/outputs/apk/androidTest/experimentalPlay/release/app-experimental-play-release-androidTest.apk
-      - persist_to_workspace:
-          root: /home/circleci/repo
-          paths:
-            - android/app/build/outputs/apk/
-
-  e2e-test-android:
-    <<: *defaults
-    executor:
-      name: android/android-machine
-      resource-class: xlarge
-      tag: 2022.12.1
-    parallelism: 4
-    steps:
-      - checkout
-      - attach_workspace:
-          at: /home/circleci/repo
-      - restore_cache: *restore-npm-cache-linux
-      - run: *install-npm-modules
-      - save_cache: *save-npm-cache-linux
-      - run: mkdir ~/junit
-      - create-e2e-account-file
-      - android/create-avd:
-          avd-name: Pixel_API_31_AOSP
-          install: true
-          system-image: system-images;android-31;default;x86_64
-      - run:
-          name: Setup emulator
-          command: |
-            echo "hw.lcd.density = 440" >> ~/.android/avd/Pixel_API_31_AOSP.avd/config.ini
-            echo "hw.lcd.height = 2280" >> ~/.android/avd/Pixel_API_31_AOSP.avd/config.ini
-            echo "hw.lcd.width = 1080" >> ~/.android/avd/Pixel_API_31_AOSP.avd/config.ini
-      - run:
-          name: Run Detox Tests
-          command: |
-            TEST=$(circleci tests glob "e2e/tests/**/*.ts" | circleci tests split --split-by=timings)
-            yarn e2e:android-test $TEST
-      - store_artifacts:
-          path: artifacts
-      - run:
-          command: cp junit.xml ~/junit/
-          when: always
-      - store_test_results:
-          path: ~/junit
-      - store_artifacts:
-          path: ~/junit
-
   # iOS builds
   ios-build-experimental:
     executor: mac-env
@@ -560,89 +461,11 @@ jobs:
       - upload-to-testflight:
           official: true
 
-  e2e-build-ios:
-    executor: mac-env
-    steps:
-      - checkout
-      - restore_cache: *restore-gems-cache
-      - restore_cache: *restore-npm-cache-mac
-      - run: *install-npm-modules
-      - run: *update-fastlane-ios
-      - save_cache: *save-npm-cache-mac
-      - save_cache: *save-gems-cache
-      - manage-pods
-      - run:
-          name: Configure Detox
-          command: |
-            brew tap wix/brew
-            brew install applesimutils
-      - run:
-          name: Build
-          command: |
-            /usr/libexec/PlistBuddy -c "Set :bugsnag:apiKey $BUGSNAG_KEY" ./ios/RocketChatRN/Info.plist
-            /usr/libexec/PlistBuddy -c "Set :bugsnag:apiKey $BUGSNAG_KEY" ./ios/ShareRocketChatRN/Info.plist
-            yarn detox clean-framework-cache && yarn detox build-framework-cache
-            echo "RUNNING_E2E_TESTS=true" > ./.env
-            yarn e2e:ios-build
-      - persist_to_workspace:
-          root: /Users/distiller/project
-          paths:
-            - ios/build/Build/Products/Release-iphonesimulator/Rocket.Chat Experimental.app
-  
-  e2e-test-ios:
-    executor: mac-env
-    parallelism: 5
-    steps:
-      - checkout
-      - attach_workspace:
-          at: /Users/distiller/project
-      - restore_cache: *restore-npm-cache-mac
-      - run: *install-npm-modules
-      - save_cache: *save-npm-cache-mac
-      - run: mkdir ~/junit
-      - run:
-          name: Configure Detox
-          command: |
-            brew tap wix/brew
-            brew install applesimutils
-            yarn detox clean-framework-cache && yarn detox build-framework-cache
-      - create-e2e-account-file
-      - run:
-          name: Run tests
-          command: |
-            TEST=$(circleci tests glob "e2e/tests/**/*.ts" | circleci tests split --split-by=timings)
-            yarn e2e:ios-test $TEST
-      - store_artifacts:
-          path: artifacts
-      - run:
-          command: cp junit.xml ~/junit/
-          when: always
-      - store_test_results:
-          path: ~/junit
-      - store_artifacts:
-          path: ~/junit
-
 workflows:
   build-and-test:
     jobs:
       - lint-testunit
 
-      # E2E tests
-      - e2e-hold:
-          type: approval
-      - e2e-build-ios:
-          requires:
-            - e2e-hold
-      - e2e-test-ios:
-          requires:
-            - e2e-build-ios
-      - e2e-build-android:
-          requires:
-            - e2e-hold
-      - e2e-test-android:
-          requires:
-            - e2e-build-android
-
       # iOS Experimental
       - ios-hold-build-experimental:
           type: approval

.detoxrc.js

@@ -1,91 +0,0 @@
-/** @type {Detox.DetoxConfig} */
-module.exports = {
-	testRunner: {
-		args: {
-			$0: 'jest',
-			config: 'e2e/jest.config.js'
-		},
-		retries: process.env.CI ? 3 : 0
-	},
-	artifacts: {
-		plugins: {
-			screenshot: 'failing',
-			video: 'failing',
-			uiHierarchy: 'enabled'
-		}
-	},
-	apps: {
-		'ios.debug': {
-			type: 'ios.app',
-			binaryPath: 'ios/build/Build/Products/Debug-iphonesimulator/Rocket.Chat Experimental.app',
-			build:
-				'xcodebuild -workspace ios/RocketChatRN.xcworkspace -scheme RocketChatRN -configuration Debug -sdk iphonesimulator -derivedDataPath ios/build'
-		},
-		'ios.release': {
-			type: 'ios.app',
-			binaryPath: 'ios/build/Build/Products/Release-iphonesimulator/Rocket.Chat Experimental.app',
-			build:
-				'xcodebuild -workspace ios/RocketChatRN.xcworkspace -scheme RocketChatRN -configuration Release -sdk iphonesimulator -derivedDataPath ios/build'
-		},
-		'android.debug': {
-			type: 'android.apk',
-			binaryPath: 'android/app/build/outputs/apk/experimentalPlay/debug/app-experimental-play-debug.apk',
-			build:
-				'cd android ; ./gradlew assembleExperimentalPlayDebug assembleExperimentalPlayDebugAndroidTest -DtestBuildType=debug ; cd -',
-			reversePorts: [8081]
-		},
-		'android.release': {
-			type: 'android.apk',
-			binaryPath: 'android/app/build/outputs/apk/experimentalPlay/release/app-experimental-play-release.apk',
-			build:
-				'cd android ; ./gradlew assembleExperimentalPlayRelease assembleExperimentalPlayReleaseAndroidTest -DtestBuildType=release ; cd -'
-		}
-	},
-	devices: {
-		simulator: {
-			type: 'ios.simulator',
-			device: {
-				type: 'iPhone 14'
-			}
-		},
-		attached: {
-			type: 'android.attached',
-			device: {
-				adbName: '.*'
-			}
-		},
-		emulator: {
-			type: 'android.emulator',
-			device: {
-				avdName: 'Pixel_API_31_AOSP'
-			},
-			headless: process.env.CI ? true : false
-		}
-	},
-	configurations: {
-		'ios.sim.debug': {
-			device: 'simulator',
-			app: 'ios.debug'
-		},
-		'ios.sim.release': {
-			device: 'simulator',
-			app: 'ios.release'
-		},
-		'android.att.debug': {
-			device: 'attached',
-			app: 'android.debug'
-		},
-		'android.att.release': {
-			device: 'attached',
-			app: 'android.release'
-		},
-		'android.emu.debug': {
-			device: 'emulator',
-			app: 'android.debug'
-		},
-		'android.emu.release': {
-			device: 'emulator',
-			app: 'android.release'
-		}
-	}
-};

.env

@@ -1,2 +0,0 @@
-# DON'T COMMIT THIS FILE
-RUNNING_E2E_TESTS=

.eslintrc.js

@@ -240,8 +240,19 @@ module.exports = {
 		},
 		{
 			files: ['e2e/**'],
+			globals: {
+				by: true,
+				detox: true,
+				device: true,
+				element: true,
+				waitFor: true
+			},
 			rules: {
-				'no-await-in-loop': 0
+				'import/no-extraneous-dependencies': 0,
+				'no-await-in-loop': 0,
+				'no-restricted-syntax': 0,
+				// TODO: remove this rule when update Detox to 20 and test if the namespace Detox is available
+				'no-undef': 1
 			}
 		}
 	]

.gitignore

@@ -67,6 +67,5 @@ e2e/docker/rc_test_env/docker-compose.yml
 e2e/docker/data/db
 e2e/e2e_account.js
 e2e/e2e_account.ts
-junit.xml
 
 *.p8

android/app/build.gradle

@@ -147,7 +147,7 @@ android {
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
         versionCode VERSIONCODE as Integer
-        versionName "4.37.0"
+        versionName "4.35.1"
         vectorDrawables.useSupportLibrary = true
         if (!isFoss) {
             manifestPlaceholders = [BugsnagAPIKey: BugsnagAPIKey as String]
@@ -250,7 +250,6 @@ android {
         release {
             minifyEnabled enableProguardInReleaseBuilds
             setProguardFiles([getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'])
-            proguardFile "${rootProject.projectDir}/../node_modules/detox/android/detox/proguard-rules-app.pro"
             signingConfig signingConfigs.release
             if (!isFoss) {
                 firebaseCrashlytics {
@@ -269,11 +268,6 @@ android {
     //     pickFirst '**/x86_64/libc++_shared.so'
     // }
 
-    // FIXME: Remove when we update RN
-    packagingOptions {
-        pickFirst '**/*.so'
-    }
-
     // applicationVariants are e.g. debug, release
 
     flavorDimensions "app", "type"
@@ -286,6 +280,10 @@ android {
             dimension = "app"
             buildConfigField "boolean", "IS_OFFICIAL", "false"
         }
+        e2e {
+            dimension = "app"
+            buildConfigField "boolean", "IS_OFFICIAL", "false"
+        }
         foss {
             dimension = "type"
             buildConfigField "boolean", "FDROID_BUILD", "true"
@@ -313,6 +311,16 @@ android {
             java.srcDirs = ['src/main/java', 'src/play/java']
             manifest.srcFile 'src/play/AndroidManifest.xml'
         }
+        e2ePlayDebug {
+            java.srcDirs = ['src/main/java', 'src/play/java']
+            res.srcDirs = ['src/experimental/res']
+            manifest.srcFile 'src/play/AndroidManifest.xml'
+        }
+        e2ePlayRelease {
+            java.srcDirs = ['src/main/java', 'src/play/java']
+            res.srcDirs = ['src/experimental/res']
+            manifest.srcFile 'src/play/AndroidManifest.xml'
+        }
     }
 
     applicationVariants.all { variant ->
@@ -377,9 +385,8 @@ dependencies {
     implementation "com.github.bumptech.glide:glide:4.9.0"
     annotationProcessor "com.github.bumptech.glide:compiler:4.9.0"
     implementation "com.tencent:mmkv-static:1.2.10"
-    androidTestImplementation('com.wix:detox:+')
+    androidTestImplementation('com.wix:detox:+') { transitive = true }
-    implementation 'androidx.appcompat:appcompat:1.1.0'
+    androidTestImplementation 'junit:junit:4.12'
-    implementation 'com.facebook.soloader:soloader:0.10.4'
 }
 
 if (isNewArchitectureEnabled()) {

android/app/src/androidTest/java/chat/rocket/reactnative/DetoxTest.java

@@ -18,7 +18,7 @@ public class DetoxTest {
     @Rule
     // Replace 'MainActivity' with the value of android:name entry in 
     // <activity> in AndroidManifest.xml
-    public ActivityTestRule<chat.rocket.reactnative.MainActivity> mActivityRule = new ActivityTestRule<>(chat.rocket.reactnative.MainActivity.class, false, false);
+    public ActivityTestRule<MainActivity> mActivityRule = new ActivityTestRule<>(MainActivity.class, false, false);
 
     @Test
     public void runDetoxTests() {

android/app/src/e2e/res/xml/network_security_config.xml

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="utf-8"?>
+<network-security-config xmlns:tools="http://schemas.android.com/tools">
+	<base-config cleartextTrafficPermitted="true">
+		<trust-anchors>
+			<certificates src="system" />
+			<certificates src="user"
+				tools:ignore="AcceptsUserCertificates" />
+		</trust-anchors>
+	</base-config>
+</network-security-config>

android/app/src/main/AndroidManifest.xml

@@ -12,7 +12,13 @@
     <uses-permission android:name="android.permission.AUDIO_CAPTURE" />
 
     <!-- permissions related to jitsi call -->
-    <uses-permission android:name="android.permission.BLUETOOTH" />
+    <uses-permission android:name="android.permission.BLUETOOTH" android:maxSdkVersion="30" />
+    <uses-permission android:name="android.permission.BLUETOOTH_ADMIN" android:maxSdkVersion="30" />
+    <uses-permission android:name="android.permission.BLUETOOTH_CONNECT" android:usesPermissionFlags="neverForLocation" tools:targetApi="s" />
+    <uses-permission android:name="android.permission.BLUETOOTH_SCAN" />
+    <uses-permission android:name="android.permission.BLUETOOTH_ADVERTISE" />
+    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" android:maxSdkVersion="28"/>
+    <uses-permission-sdk-23 android:name="android.permission.ACCESS_FINE_LOCATION" tools:targetApi="Q"/>
 
     <application
         android:name="chat.rocket.reactnative.MainApplication"

android/app/src/main/res/xml/network_security_config.xml

@@ -7,8 +7,4 @@
                 tools:ignore="AcceptsUserCertificates" />
         </trust-anchors>
     </base-config>
-    <domain-config cleartextTrafficPermitted="true">
-        <domain includeSubdomains="true">10.0.2.2</domain>
-        <domain includeSubdomains="true">localhost</domain>
-	</domain-config>
 </network-security-config>

android/build.gradle

@@ -1,5 +1,9 @@
 import org.apache.tools.ant.taskdefs.condition.Os
 
+def safeExtGet(prop, fallback) {
+    rootProject.ext.has(prop) ? rootProject.ext.get(prop) : fallback
+}
+
 // Top-level build file where you can add configuration options common to all sub-projects/modules.
 buildscript {
     def taskRequests = getGradle().getStartParameter().getTaskRequests().toString().toLowerCase()
@@ -71,38 +75,5 @@ allprojects {
         google()
         maven { url 'https://maven.google.com' }
         maven { url 'https://www.jitpack.io' }
-
-        // https://stackoverflow.com/a/74333788/5447468
-        // TODO: remove once we update RN
-        exclusiveContent {
-            // We get React Native's Android binaries exclusively through npm,
-            // from a local Maven repo inside node_modules/react-native/.
-            // (The use of exclusiveContent prevents looking elsewhere like Maven Central
-            // and potentially getting a wrong version.)
-            filter {
-                includeGroup "com.facebook.react"
-            }
-            forRepository {
-                maven {
-                    // NOTE: if you are in a monorepo, you may have "$rootDir/../../../node_modules/react-native/android"
-                    url "$rootDir/../node_modules/react-native/android"
-                }
-            }
-        }
-    }
-}
-
-subprojects { subproject ->	
-    afterEvaluate {	
-        if (!project.name.equalsIgnoreCase("app") && project.hasProperty("android")) {	
-            android {	
-                compileSdkVersion 31	
-                buildToolsVersion "31.0.0"
-                defaultConfig {	
-                    minSdkVersion 23	
-                    targetSdkVersion 31
-                }	
-            }	
-        }	
     }
 }

app/actions/actionsTypes.ts

@@ -40,14 +40,7 @@ export const INQUIRY = createRequestTypes('INQUIRY', [
 	'QUEUE_UPDATE',
 	'QUEUE_REMOVE'
 ]);
-export const APP = createRequestTypes('APP', [
+export const APP = createRequestTypes('APP', ['START', 'READY', 'INIT', 'INIT_LOCAL_SETTINGS', 'SET_MASTER_DETAIL']);
-	'START',
-	'READY',
-	'INIT',
-	'INIT_LOCAL_SETTINGS',
-	'SET_MASTER_DETAIL',
-	'SET_NOTIFICATION_PRESENCE_CAP'
-]);
 export const MESSAGES = createRequestTypes('MESSAGES', ['REPLY_BROADCAST']);
 export const CREATE_CHANNEL = createRequestTypes('CREATE_CHANNEL', [...defaultTypes]);
 export const CREATE_DISCUSSION = createRequestTypes('CREATE_DISCUSSION', [...defaultTypes]);

app/actions/app.ts

@@ -12,11 +12,7 @@ interface ISetMasterDetail extends Action {
 	isMasterDetail: boolean;
 }
 
-interface ISetNotificationPresenceCap extends Action {
+export type TActionApp = IAppStart & ISetMasterDetail;
-	show: boolean;
-}
-
-export type TActionApp = IAppStart & ISetMasterDetail & ISetNotificationPresenceCap;
 
 interface Params {
 	root: RootEnum;
@@ -55,10 +51,3 @@ export function setMasterDetail(isMasterDetail: boolean): ISetMasterDetail {
 		isMasterDetail
 	};
 }
-
-export function setNotificationPresenceCap(show: boolean): ISetNotificationPresenceCap {
-	return {
-		type: APP.SET_NOTIFICATION_PRESENCE_CAP,
-		show
-	};
-}

app/containers/CustomIcon/mappedIcons.js

@@ -1,5 +1,4 @@
 export const mappedIcons = {
-	'status-disabled': 59837,
 	'lamp-bulb': 59836,
 	'phone-in': 59835,
 	'basketball': 59776,

app/containers/EmojiPicker/EmojiCategory.tsx

@@ -1,31 +1,34 @@
 import React from 'react';
+import { useWindowDimensions } from 'react-native';
 import { FlatList } from 'react-native-gesture-handler';
 
-import { IEmoji } from '../../definitions/IEmoji';
-import scrollPersistTaps from '../../lib/methods/helpers/scrollPersistTaps';
-import { PressableEmoji } from './PressableEmoji';
 import { EMOJI_BUTTON_SIZE } from './styles';
+import scrollPersistTaps from '../../lib/methods/helpers/scrollPersistTaps';
+import { IEmoji } from '../../definitions/IEmoji';
+import { PressableEmoji } from './PressableEmoji';
 
 interface IEmojiCategoryProps {
 	emojis: IEmoji[];
 	onEmojiSelected: (emoji: IEmoji) => void;
 	tabLabel?: string; // needed for react-native-scrollable-tab-view only
-	parentWidth: number;
 }
 
-const EmojiCategory = ({ onEmojiSelected, emojis, parentWidth }: IEmojiCategoryProps): React.ReactElement | null => {
+const EmojiCategory = ({ onEmojiSelected, emojis }: IEmojiCategoryProps): React.ReactElement | null => {
-	if (!parentWidth) {
+	const { width } = useWindowDimensions();
-		return null;
-	}
 
-	const numColumns = Math.trunc(parentWidth / EMOJI_BUTTON_SIZE);
+	const numColumns = Math.trunc(width / EMOJI_BUTTON_SIZE);
-	const marginHorizontal = (parentWidth % EMOJI_BUTTON_SIZE) / 2;
+	const marginHorizontal = (width % EMOJI_BUTTON_SIZE) / 2;
 
 	const renderItem = ({ item }: { item: IEmoji }) => <PressableEmoji emoji={item} onPress={onEmojiSelected} />;
 
+	if (!width) {
+		return null;
+	}
+
 	return (
 		<FlatList
-			key={`emoji-category-${parentWidth}`}
+			// needed to update the numColumns when the width changes
+			key={`emoji-category-${width}`}
 			keyExtractor={item => (typeof item === 'string' ? item : item.name)}
 			data={emojis}
 			renderItem={renderItem}

app/containers/EmojiPicker/index.tsx

@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React from 'react';
 import { View } from 'react-native';
 import ScrollableTabView from 'react-native-scrollable-tab-view';
 
@@ -20,8 +20,6 @@ const EmojiPicker = ({
 	searchedEmojis = []
 }: IEmojiPickerProps): React.ReactElement | null => {
 	const { colors } = useTheme();
-	const [parentWidth, setParentWidth] = useState(0);
-
 	const { frequentlyUsed, loaded } = useFrequentlyUsedEmoji();
 
 	const allCustomEmojis: ICustomEmojis = useAppSelector(
@@ -52,14 +50,7 @@ const EmojiPicker = ({
 		if (!emojis.length) {
 			return null;
 		}
-		return (
+		return <EmojiCategory emojis={emojis} onEmojiSelected={(emoji: IEmoji) => handleEmojiSelect(emoji)} tabLabel={label} />;
-			<EmojiCategory
-				parentWidth={parentWidth}
-				emojis={emojis}
-				onEmojiSelected={(emoji: IEmoji) => handleEmojiSelect(emoji)}
-				tabLabel={label}
-			/>
-		);
 	};
 
 	if (!loaded) {
@@ -67,13 +58,9 @@ const EmojiPicker = ({
 	}
 
 	return (
-		<View style={styles.emojiPickerContainer} onLayout={e => setParentWidth(e.nativeEvent.layout.width)}>
+		<View style={styles.emojiPickerContainer}>
 			{searching ? (
-				<EmojiCategory
+				<EmojiCategory emojis={searchedEmojis} onEmojiSelected={(emoji: IEmoji) => handleEmojiSelect(emoji)} />
-					emojis={searchedEmojis}
-					onEmojiSelected={(emoji: IEmoji) => handleEmojiSelect(emoji)}
-					parentWidth={parentWidth}
-				/>
 			) : (
 				<ScrollableTabView
 					renderTabBar={() => <TabBar />}

app/containers/HeaderButton/HeaderButtonItemBadge.tsx

@@ -1,7 +1,6 @@
 import React from 'react';
-import { StyleSheet, View } from 'react-native';
+import { StyleSheet } from 'react-native';
 
-import { STATUS_COLORS } from '../../lib/constants';
 import UnreadBadge from '../UnreadBadge';
 
 const styles = StyleSheet.create({
@@ -16,8 +15,6 @@ const styles = StyleSheet.create({
 	}
 });
 
-export const BadgeUnread = ({ ...props }): React.ReactElement => <UnreadBadge {...props} style={styles.badgeContainer} small />;
+export const Badge = ({ ...props }): React.ReactElement => <UnreadBadge {...props} style={styles.badgeContainer} small />;
 
-export const BadgeWarn = (): React.ReactElement => (
+export default Badge;
-	<View style={[styles.badgeContainer, { width: 10, height: 10, backgroundColor: STATUS_COLORS.disabled }]} />
-);

app/containers/HeaderButton/HeaderButtons.stories.tsx

@@ -1,5 +1,4 @@
 import React from 'react';
-import { View } from 'react-native';
 import { Header, HeaderBackground } from '@react-navigation/elements';
 import { NavigationContainer } from '@react-navigation/native';
 import { SafeAreaProvider } from 'react-native-safe-area-context';
@@ -104,10 +103,9 @@ export const Badge = () => (
 		<HeaderExample
 			left={() => (
 				<HeaderButton.Container left>
-					<HeaderButton.Item iconName='threads' badge={() => <HeaderButton.BadgeUnread tunread={[1]} />} />
+					<HeaderButton.Item iconName='threads' badge={() => <HeaderButton.Badge tunread={[1]} />} />
-					<HeaderButton.Item iconName='threads' badge={() => <HeaderButton.BadgeUnread tunread={[1]} tunreadUser={[1]} />} />
+					<HeaderButton.Item iconName='threads' badge={() => <HeaderButton.Badge tunread={[1]} tunreadUser={[1]} />} />
-					<HeaderButton.Item iconName='threads' badge={() => <HeaderButton.BadgeUnread tunread={[1]} tunreadGroup={[1]} />} />
+					<HeaderButton.Item iconName='threads' badge={() => <HeaderButton.Badge tunread={[1]} tunreadGroup={[1]} />} />
-					<HeaderButton.Drawer badge={() => <HeaderButton.BadgeWarn />} />
 				</HeaderButton.Container>
 			)}
 		/>
@@ -116,23 +114,20 @@ export const Badge = () => (
 
 const ThemeStory = ({ theme }: { theme: TSupportedThemes }) => (
 	<ThemeContext.Provider value={{ theme, colors: colors[theme] }}>
-		<View style={{ flexDirection: 'column' }}>
+		<HeaderExample
-			<HeaderExample
+			left={() => (
-				left={() => (
+				<HeaderButton.Container left>
-					<HeaderButton.Container left>
+					<HeaderButton.Item iconName='threads' />
-						<HeaderButton.Drawer badge={() => <HeaderButton.BadgeWarn />} />
+				</HeaderButton.Container>
-						<HeaderButton.Item iconName='threads' />
+			)}
-					</HeaderButton.Container>
+			right={() => (
-				)}
+				<HeaderButton.Container>
-				right={() => (
+					<HeaderButton.Item title='Threads' />
-					<HeaderButton.Container>
+					<HeaderButton.Item iconName='threads' badge={() => <HeaderButton.Badge tunread={[1]} />} />
-						<HeaderButton.Item title='Threads' />
+				</HeaderButton.Container>
-						<HeaderButton.Item iconName='threads' badge={() => <HeaderButton.BadgeUnread tunread={[1]} />} />
+			)}
-					</HeaderButton.Container>
+			colors={colors[theme]}
-				)}
+		/>
-				colors={colors[theme]}
-			/>
-		</View>
 	</ThemeContext.Provider>
 );
 

app/containers/HeaderButton/index.ts

@@ -1,4 +1,4 @@
 export { default as Container } from './HeaderButtonContainer';
 export { default as Item } from './HeaderButtonItem';
-export * from './HeaderButtonItemBadge';
+export { default as Badge } from './HeaderButtonItemBadge';
 export * from './Common';

app/containers/RoomHeader/index.tsx

@@ -46,7 +46,6 @@ const RoomHeaderContainer = React.memo(
 		const connecting = useSelector((state: IApplicationState) => state.meteor.connecting || state.server.loading);
 		const usersTyping = useSelector((state: IApplicationState) => state.usersTyping, shallowEqual);
 		const connected = useSelector((state: IApplicationState) => state.meteor.connected);
-		const presenceDisabled = useSelector((state: IApplicationState) => state.settings.Presence_broadcast_disabled);
 		const activeUser = useSelector(
 			(state: IApplicationState) => (roomUserId ? state.activeUsers?.[roomUserId] : undefined),
 			shallowEqual
@@ -62,13 +61,9 @@ const RoomHeaderContainer = React.memo(
 
 		if (connected) {
 			if ((type === 'd' || (tmid && roomUserId)) && activeUser) {
-				if (presenceDisabled) {
+				const { status: statusActiveUser, statusText: statusTextActiveUser } = activeUser;
-					status = 'disabled';
+				status = statusActiveUser;
-				} else {
+				statusText = statusTextActiveUser;
-					const { status: statusActiveUser, statusText: statusTextActiveUser } = activeUser;
-					status = statusActiveUser;
-					statusText = statusTextActiveUser;
-				}
 			} else if (type === 'l' && visitor?.status) {
 				const { status: statusVisitor } = visitor;
 				status = statusVisitor;

app/containers/RoomItem/RoomItem.stories.tsx

@@ -65,7 +65,6 @@ export const UserStatus = () => (
 		<RoomItem status='busy' />
 		<RoomItem status='offline' />
 		<RoomItem status='loading' />
-		<RoomItem status='disabled' />
 		<RoomItem status='wrong' />
 	</>
 );

app/containers/RoomItem/useUserStatus.tsx

@@ -8,17 +8,11 @@ export const useUserStatus = (
 	id?: string
 ): { connected: boolean; status: TUserStatus } => {
 	const connected = useAppSelector(state => state.meteor.connected);
-	const presenceDisabled = useAppSelector(state => state.settings.Presence_broadcast_disabled);
 	const userStatus = useAppSelector(state => state.activeUsers[id || '']?.status);
-
 	let status = 'loading';
 	if (connected) {
 		if (type === 'd') {
-			if (presenceDisabled) {
+			status = userStatus || 'loading';
-				status = 'disabled';
-			} else {
-				status = userStatus || 'loading';
-			}
 		} else if (type === 'l' && liveChatStatus) {
 			status = liveChatStatus;
 		}

app/containers/RoomTypeIcon/OmnichannelRoomIcon.tsx

@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React from 'react';
 import { StyleProp, ViewStyle } from 'react-native';
 import { SvgUri } from 'react-native-svg';
 
@@ -29,12 +29,22 @@ interface IOmnichannelRoomIconProps {
 }
 
 export const OmnichannelRoomIcon = ({ size, style, sourceType, status }: IOmnichannelRoomIconProps) => {
-	const [loading, setLoading] = useState(true);
-	const [svgError, setSvgError] = useState(false);
 	const baseUrl = useAppSelector(state => state.server?.server);
 	const connected = useAppSelector(state => state.meteor?.connected);
 
-	const customIcon = (
+	if (sourceType?.type === OmnichannelSourceType.APP && sourceType.id && sourceType.sidebarIcon && connected) {
+		return (
+			<SvgUri
+				height={size}
+				width={size}
+				color={STATUS_COLORS[status || 'offline']}
+				uri={`${baseUrl}/api/apps/public/${sourceType.id}/get-sidebar-icon?icon=${sourceType.sidebarIcon}`}
+				style={style}
+			/>
+		);
+	}
+
+	return (
 		<CustomIcon
 			name={iconMap[sourceType?.type || 'other']}
 			size={size}
@@ -42,23 +52,4 @@ export const OmnichannelRoomIcon = ({ size, style, sourceType, status }: IOmnich
 			color={STATUS_COLORS[status || 'offline']}
 		/>
 	);
-
-	if (!svgError && sourceType?.type === OmnichannelSourceType.APP && sourceType.id && sourceType.sidebarIcon && connected) {
-		return (
-			<>
-				<SvgUri
-					height={size}
-					width={size}
-					color={STATUS_COLORS[status || 'offline']}
-					uri={`${baseUrl}/api/apps/public/${sourceType.id}/get-sidebar-icon?icon=${sourceType.sidebarIcon}`}
-					style={style}
-					onError={() => setSvgError(true)}
-					onLoad={() => setLoading(false)}
-				/>
-				{loading ? customIcon : null}
-			</>
-		);
-	}
-
-	return customIcon;
 };

app/containers/Status/index.tsx

@@ -6,15 +6,9 @@ import { IStatus } from './definition';
 import { useAppSelector } from '../../lib/hooks';
 
 const StatusContainer = ({ id, style, size = 32, ...props }: Omit<IStatus, 'status'>): React.ReactElement => {
-	const status = useAppSelector(state => {
+	const status = useAppSelector(state =>
-		if (state.settings.Presence_broadcast_disabled) {
+		state.meteor.connected ? state.activeUsers[id] && state.activeUsers[id].status : 'loading'
-			return 'disabled';
+	) as TUserStatus;
-		}
-		if (state.meteor.connected) {
-			return state.activeUsers[id] && state.activeUsers[id].status;
-		}
-		return 'loading';
-	}) as TUserStatus;
 	return <Status size={size} style={style} status={status} {...props} />;
 };
 

app/containers/UIKit/VideoConferenceBlock/components/CallAgainActionSheet.tsx

@@ -6,6 +6,7 @@ import i18n from '../../../../i18n';
 import { getSubscriptionByRoomId } from '../../../../lib/database/services/Subscription';
 import { useAppSelector } from '../../../../lib/hooks';
 import { getRoomAvatar, getUidDirectMessage } from '../../../../lib/methods/helpers';
+import { videoConfStartAndJoin } from '../../../../lib/methods/videoConf';
 import { useTheme } from '../../../../theme';
 import { useActionSheet } from '../../../ActionSheet';
 import AvatarContainer from '../../../Avatar';
@@ -15,12 +16,12 @@ import { BUTTON_HIT_SLOP } from '../../../message/utils';
 import StatusContainer from '../../../Status';
 import useStyle from './styles';
 
-export default function StartACallActionSheet({ rid, initCall }: { rid: string; initCall: Function }): React.ReactElement {
+export default function CallAgainActionSheet({ rid }: { rid: string }): React.ReactElement {
 	const style = useStyle();
 	const { colors } = useTheme();
-	const [user, setUser] = useState({ username: '', avatar: '', uid: '' });
+	const [user, setUser] = useState({ username: '', avatar: '', uid: '', rid: '' });
-	const [mic, setMic] = useState(true);
+	const [phone, setPhone] = useState(true);
-	const [cam, setCam] = useState(false);
+	const [camera, setCamera] = useState(false);
 	const username = useAppSelector(state => state.login.user.username);
 
 	const { hideActionSheet } = useActionSheet();
@@ -30,7 +31,7 @@ export default function StartACallActionSheet({ rid, initCall }: { rid: string;
 			const room = await getSubscriptionByRoomId(rid);
 			const uid = (await getUidDirectMessage(room)) as string;
 			const avt = getRoomAvatar(room);
-			setUser({ uid, username: room?.name || '', avatar: avt });
+			setUser({ uid, username: room?.name || '', avatar: avt, rid: room?.id || '' });
 		})();
 	}, [rid]);
 
@@ -42,27 +43,25 @@ export default function StartACallActionSheet({ rid, initCall }: { rid: string;
 				<Text style={style.actionSheetHeaderTitle}>{i18n.t('Start_a_call')}</Text>
 				<View style={style.actionSheetHeaderButtons}>
 					<Touchable
-						onPress={() => setCam(!cam)}
+						onPress={() => setCamera(!camera)}
-						style={[style.iconCallContainer, cam && style.enabledBackground, { marginRight: 6 }]}
+						style={[style.iconCallContainer, camera && style.enabledBackground, { marginRight: 6 }]}
 						hitSlop={BUTTON_HIT_SLOP}
 					>
-						<CustomIcon name={cam ? 'camera' : 'camera-disabled'} size={20} color={handleColor(cam)} />
+						<CustomIcon name={camera ? 'camera' : 'camera-disabled'} size={16} color={handleColor(camera)} />
 					</Touchable>
 					<Touchable
-						onPress={() => setMic(!mic)}
+						onPress={() => setPhone(!phone)}
-						style={[style.iconCallContainer, mic && style.enabledBackground]}
+						style={[style.iconCallContainer, phone && style.enabledBackground]}
 						hitSlop={BUTTON_HIT_SLOP}
 					>
-						<CustomIcon name={mic ? 'microphone' : 'microphone-disabled'} size={20} color={handleColor(mic)} />
+						<CustomIcon name={phone ? 'microphone' : 'microphone-disabled'} size={16} color={handleColor(phone)} />
 					</Touchable>
 				</View>
 			</View>
 			<View style={style.actionSheetUsernameContainer}>
 				<AvatarContainer text={user.avatar} size={36} />
 				<StatusContainer size={16} id={user.uid} style={{ marginLeft: 8, marginRight: 6 }} />
-				<Text style={style.actionSheetUsername} numberOfLines={1}>
+				<Text style={style.actionSheetUsername}>{user.username}</Text>
-					{user.username}
-				</Text>
 			</View>
 			<View style={style.actionSheetPhotoContainer}>
 				<AvatarContainer size={62} text={username} />
@@ -71,7 +70,7 @@ export default function StartACallActionSheet({ rid, initCall }: { rid: string;
 				onPress={() => {
 					hideActionSheet();
 					setTimeout(() => {
-						initCall({ cam, mic });
+						videoConfStartAndJoin(user.rid, camera);
 					}, 100);
 				}}
 				title={i18n.t('Call')}

app/containers/UIKit/VideoConferenceBlock/components/VideoConferenceDirect.tsx

@@ -3,16 +3,17 @@ import { Text } from 'react-native';
 import Touchable from 'react-native-platform-touchable';
 
 import i18n from '../../../../i18n';
-import { videoConfJoin } from '../../../../lib/methods/videoConf';
+import { useVideoConf } from '../../../../lib/hooks/useVideoConf';
 import useStyle from './styles';
 import { VideoConferenceBaseContainer } from './VideoConferenceBaseContainer';
 
 const VideoConferenceDirect = React.memo(({ blockId }: { blockId: string }) => {
 	const style = useStyle();
+	const { joinCall } = useVideoConf();
 
 	return (
 		<VideoConferenceBaseContainer variant='incoming'>
-			<Touchable style={style.callToActionButton} onPress={() => videoConfJoin(blockId)}>
+			<Touchable style={style.callToActionButton} onPress={() => joinCall(blockId)}>
 				<Text style={style.callToActionButtonText}>{i18n.t('Join')}</Text>
 			</Touchable>
 			<Text style={style.callBack}>{i18n.t('Waiting_for_answer')}</Text>

app/containers/UIKit/VideoConferenceBlock/components/VideoConferenceEnded.tsx

@@ -6,7 +6,9 @@ import { IUser } from '../../../../definitions';
 import { VideoConferenceType } from '../../../../definitions/IVideoConference';
 import i18n from '../../../../i18n';
 import { useAppSelector } from '../../../../lib/hooks';
-import { useVideoConf } from '../../../../lib/hooks/useVideoConf';
+import { useSnaps } from '../../../../lib/hooks/useSnaps';
+import { useActionSheet } from '../../../ActionSheet';
+import CallAgainActionSheet from './CallAgainActionSheet';
 import { CallParticipants, TCallUsers } from './CallParticipants';
 import useStyle from './styles';
 import { VideoConferenceBaseContainer } from './VideoConferenceBaseContainer';
@@ -24,7 +26,8 @@ export default function VideoConferenceEnded({
 }): React.ReactElement {
 	const style = useStyle();
 	const username = useAppSelector(state => state.login.user.username);
-	const { showInitCallActionSheet } = useVideoConf(rid);
+	const { showActionSheet } = useActionSheet();
+	const snaps = useSnaps([1250]);
 
 	const onlyAuthorOnCall = users.length === 1 && users.some(user => user.username === createdBy.username);
 
@@ -32,7 +35,15 @@ export default function VideoConferenceEnded({
 		<VideoConferenceBaseContainer variant='ended'>
 			{type === 'direct' ? (
 				<>
-					<Touchable style={style.callToActionCallBack} onPress={showInitCallActionSheet}>
+					<Touchable
+						style={style.callToActionCallBack}
+						onPress={() =>
+							showActionSheet({
+								children: <CallAgainActionSheet rid={rid} />,
+								snaps
+							})
+						}
+					>
 						<Text style={style.callToActionCallBackText}>
 							{createdBy.username === username ? i18n.t('Call_back') : i18n.t('Call_again')}
 						</Text>

app/containers/UIKit/VideoConferenceBlock/components/VideoConferenceOutgoing.tsx

@@ -3,17 +3,18 @@ import { Text } from 'react-native';
 import Touchable from 'react-native-platform-touchable';
 
 import i18n from '../../../../i18n';
-import { videoConfJoin } from '../../../../lib/methods/videoConf';
+import { useVideoConf } from '../../../../lib/hooks/useVideoConf';
 import { CallParticipants, TCallUsers } from './CallParticipants';
 import useStyle from './styles';
 import { VideoConferenceBaseContainer } from './VideoConferenceBaseContainer';
 
 export default function VideoConferenceOutgoing({ users, blockId }: { users: TCallUsers; blockId: string }): React.ReactElement {
 	const style = useStyle();
+	const { joinCall } = useVideoConf();
 
 	return (
 		<VideoConferenceBaseContainer variant='outgoing'>
-			<Touchable style={style.callToActionButton} onPress={() => videoConfJoin(blockId)}>
+			<Touchable style={style.callToActionButton} onPress={() => joinCall(blockId)}>
 				<Text style={style.callToActionButtonText}>{i18n.t('Join')}</Text>
 			</Touchable>
 			<CallParticipants users={users} />

app/containers/UIKit/VideoConferenceBlock/components/styles.ts

@@ -100,8 +100,7 @@ export default function useStyle() {
 		actionSheetUsername: {
 			fontSize: 16,
 			...sharedStyles.textBold,
-			color: colors.passcodePrimary,
+			color: colors.passcodePrimary
-			flexShrink: 1
 		},
 		enabledBackground: {
 			backgroundColor: colors.conferenceCallEnabledIconBackground

app/containers/UIKit/utils.ts

@@ -2,7 +2,7 @@
 import { BlockContext } from '@rocket.chat/ui-kit';
 import React, { useContext, useState } from 'react';
 
-import { videoConfJoin } from '../../lib/methods/videoConf';
+import { useVideoConf } from '../../lib/hooks/useVideoConf';
 import { IText } from './interfaces';
 
 export const textParser = ([{ text }]: IText[]) => text;
@@ -40,6 +40,7 @@ export const useBlockContext = ({ blockId, actionId, appId, initialValue }: IUse
 	const { action, appId: appIdFromContext, viewId, state, language, errors, values = {} } = useContext(KitContext);
 	const { value = initialValue } = values[actionId] || {};
 	const [loading, setLoading] = useState(false);
+	const { joinCall } = useVideoConf();
 
 	const error = errors && actionId && errors[actionId];
 
@@ -57,7 +58,7 @@ export const useBlockContext = ({ blockId, actionId, appId, initialValue }: IUse
 				try {
 					if (appId === 'videoconf-core' && blockId) {
 						setLoading(false);
-						return videoConfJoin(blockId);
+						return joinCall(blockId);
 					}
 					await action({
 						blockId,

app/containers/UserGeneratedContentRules.tsx

@@ -16,13 +16,11 @@ const styles = StyleSheet.create({
 	},
 	bottomContainerText: {
 		...sharedStyles.textRegular,
-		fontSize: 13,
+		fontSize: 13
-		textAlign: 'center'
 	},
 	bottomContainerTextBold: {
 		...sharedStyles.textSemibold,
-		fontSize: 13,
+		fontSize: 13
-		textAlign: 'center'
 	}
 });
 

app/containers/markdown/new/Plain.tsx

@@ -8,7 +8,7 @@ interface IPlainProps {
 	value: PlainProps['value'];
 }
 
-const Plain = ({ value }: IPlainProps): React.ReactElement => (
+const Plain = ({ value }: IPlainProps) => (
 	<Text accessibilityLabel={value} style={styles.plainText}>
 		{value}
 	</Text>

app/containers/markdown/new/TaskList.tsx

@@ -4,6 +4,7 @@ import { Tasks as TasksProps } from '@rocket.chat/message-parser';
 
 import Inline from './Inline';
 import styles from '../styles';
+import { themes } from '../../../lib/constants';
 import { useTheme } from '../../../theme';
 
 interface ITasksProps {
@@ -11,15 +12,13 @@ interface ITasksProps {
 }
 
 const TaskList = ({ value = [] }: ITasksProps) => {
-	const { colors } = useTheme();
+	const { theme } = useTheme();
 	return (
 		<View>
 			{value.map(item => (
 				<View style={styles.row}>
-					<Text style={[styles.text, { color: colors.bodyText }]}>{item.status ? '- [x] ' : '- [ ] '}</Text>
+					<Text style={[styles.text, { color: themes[theme].bodyText }]}>{item.status ? '- [x] ' : '- [ ] '}</Text>
-					<Text style={[styles.inline, { color: colors.bodyText }]}>
+					<Inline value={item.value} />
-						<Inline value={item.value} />
-					</Text>
 				</View>
 			))}
 		</View>

app/containers/message/CallButton.tsx

@@ -10,12 +10,12 @@ import { themes } from '../../lib/constants';
 import { IMessageCallButton } from './interfaces';
 import { useTheme } from '../../theme';
 
-const CallButton = React.memo(({ handleEnterCall }: IMessageCallButton) => {
+const CallButton = React.memo(({ callJitsi }: IMessageCallButton) => {
 	const { theme } = useTheme();
 	return (
 		<View style={styles.buttonContainer}>
 			<Touchable
-				onPress={handleEnterCall}
+				onPress={callJitsi}
 				background={Touchable.Ripple(themes[theme].bannerBackground)}
 				style={[styles.button, { backgroundColor: themes[theme].tintColor }]}
 				hitSlop={BUTTON_HIT_SLOP}

app/containers/message/Content.tsx

@@ -53,7 +53,7 @@ const Content = React.memo(
 			content = (
 				<Markdown
 					msg={props.msg}
-					md={props.type !== 'e2e' ? props.md : undefined}
+					md={props.md}
 					getCustomEmoji={props.getCustomEmoji}
 					enableMessageParser={user.enableMessageParserEarlyAdoption}
 					username={user.username}

app/containers/message/MessageAvatar.tsx

@@ -18,7 +18,7 @@ const MessageAvatar = React.memo(({ isHeader, avatar, author, small, navToRoomIn
 				style={small ? styles.avatarSmall : styles.avatar}
 				text={avatar ? '' : author.username}
 				size={small ? 20 : 36}
-				borderRadius={4}
+				borderRadius={small ? 2 : 4}
 				onPress={author._id === user.id ? undefined : () => navToRoomInfo(navParam)}
 				getCustomEmoji={getCustomEmoji}
 				avatar={avatar}

app/containers/message/Reply.tsx

@@ -247,8 +247,6 @@ const Reply = React.memo(
 				>
 					<View style={styles.attachmentContainer}>
 						<Title attachment={attachment} timeFormat={timeFormat} theme={theme} />
-						<Description attachment={attachment} getCustomEmoji={getCustomEmoji} theme={theme} />
-						<UrlImage image={attachment.thumb_url} />
 						<Attachments
 							attachments={attachment.attachments}
 							getCustomEmoji={getCustomEmoji}
@@ -257,6 +255,8 @@ const Reply = React.memo(
 							isReply
 							id={messageId}
 						/>
+						<UrlImage image={attachment.thumb_url} />
+						<Description attachment={attachment} getCustomEmoji={getCustomEmoji} theme={theme} />
 						<Fields attachment={attachment} getCustomEmoji={getCustomEmoji} theme={theme} />
 						{loading ? (
 							<View style={[styles.backdrop]}>

app/containers/message/index.tsx

@@ -50,7 +50,7 @@ interface IMessageContainerProps {
 	showAttachment: (file: IAttachment) => void;
 	onReactionLongPress?: (item: TAnyMessageModel) => void;
 	navToRoomInfo: (navParam: IRoomInfoParam) => void;
-	handleEnterCall?: () => void;
+	callJitsi?: () => void;
 	blockAction?: (params: { actionId: string; appId: string; value: string; blockId: string; rid: string; mid: string }) => void;
 	onAnswerButtonPress?: (message: string, tmid?: string, tshow?: boolean) => void;
 	threadBadgeColor?: string;
@@ -69,6 +69,7 @@ class MessageContainer extends React.Component<IMessageContainerProps, IMessageC
 	static defaultProps = {
 		getCustomEmoji: () => null,
 		onLongPress: () => {},
+		callJitsi: () => {},
 		blockAction: () => {},
 		archived: false,
 		broadcast: false,
@@ -337,7 +338,7 @@ class MessageContainer extends React.Component<IMessageContainerProps, IMessageC
 			navToRoomInfo,
 			getCustomEmoji,
 			isThreadRoom,
-			handleEnterCall,
+			callJitsi,
 			blockAction,
 			rid,
 			threadBadgeColor,
@@ -455,7 +456,7 @@ class MessageContainer extends React.Component<IMessageContainerProps, IMessageC
 					showAttachment={showAttachment}
 					getCustomEmoji={getCustomEmoji}
 					navToRoomInfo={navToRoomInfo}
-					handleEnterCall={handleEnterCall}
+					callJitsi={callJitsi}
 					blockAction={blockAction}
 					highlighted={highlighted}
 					comment={comment}

app/containers/message/interfaces.ts

@@ -40,7 +40,7 @@ export interface IMessageBroadcast {
 }
 
 export interface IMessageCallButton {
-	handleEnterCall?: () => void;
+	callJitsi?: () => void;
 }
 
 export interface IMessageContent {

app/definitions/IVideoConference.ts

@@ -4,34 +4,37 @@ import type { IRoom } from './IRoom';
 import type { IUser } from './IUser';
 import type { IMessage } from './IMessage';
 
-export declare enum VideoConferenceStatus {
+export enum VideoConferenceStatus {
 	CALLING = 0,
 	STARTED = 1,
 	EXPIRED = 2,
 	ENDED = 3,
 	DECLINED = 4
 }
-export declare type DirectCallInstructions = {
+
+export type DirectCallInstructions = {
 	type: 'direct';
-	calleeId: IUser['_id'];
+	callee: IUser['_id'];
 	callId: string;
 };
-export declare type ConferenceInstructions = {
+
+export type ConferenceInstructions = {
 	type: 'videoconference';
 	callId: string;
 	rid: IRoom['_id'];
 };
-export declare type LivechatInstructions = {
+
+export type LivechatInstructions = {
 	type: 'livechat';
 	callId: string;
 };
-export declare type VideoConferenceType =
+
-	| DirectCallInstructions['type']
+export type VideoConferenceType = DirectCallInstructions['type'] | ConferenceInstructions['type'] | LivechatInstructions['type'];
-	| ConferenceInstructions['type']
+
-	| LivechatInstructions['type'];
 export interface IVideoConferenceUser extends Pick<Required<IUser>, '_id' | 'username' | 'name' | 'avatarETag'> {
 	ts: Date;
 }
+
 export interface IVideoConference extends IRocketChatRecord {
 	type: VideoConferenceType;
 	rid: string;
@@ -42,68 +45,51 @@ export interface IVideoConference extends IRocketChatRecord {
 		ended?: IMessage['_id'];
 	};
 	url?: string;
-	createdBy: Pick<Required<IUser>, '_id' | 'username' | 'name'>;
+
+	createdBy: Pick<IUser, '_id' | 'username' | 'name'>;
 	createdAt: Date;
-	endedBy?: Pick<Required<IUser>, '_id' | 'username' | 'name'>;
+
+	endedBy?: Pick<IUser, '_id' | 'username' | 'name'>;
 	endedAt?: Date;
+
 	providerName: string;
 	providerData?: Record<string, any>;
+
 	ringing?: boolean;
 }
+
 export interface IDirectVideoConference extends IVideoConference {
 	type: 'direct';
 }
+
 export interface IGroupVideoConference extends IVideoConference {
 	type: 'videoconference';
 	anonymousUsers: number;
 	title: string;
 }
+
 export interface ILivechatVideoConference extends IVideoConference {
 	type: 'livechat';
 }
-export declare type VideoConference = IDirectVideoConference | IGroupVideoConference | ILivechatVideoConference;
+
-export declare type VideoConferenceInstructions = DirectCallInstructions | ConferenceInstructions | LivechatInstructions;
+export type VideoConference = IDirectVideoConference | IGroupVideoConference | ILivechatVideoConference;
-export declare const isDirectVideoConference: (call: VideoConference | undefined | null) => call is IDirectVideoConference;
+
-export declare const isGroupVideoConference: (call: VideoConference | undefined | null) => call is IGroupVideoConference;
+export type VideoConferenceInstructions = DirectCallInstructions | ConferenceInstructions | LivechatInstructions;
-export declare const isLivechatVideoConference: (call: VideoConference | undefined | null) => call is ILivechatVideoConference;
+
-declare type GroupVideoConferenceCreateData = Omit<IGroupVideoConference, 'createdBy'> & {
+export const isDirectVideoConference = (call: VideoConference | undefined | null): call is IDirectVideoConference =>
-	createdBy: IUser['_id'];
+	call?.type === 'direct';
-};
+
-declare type DirectVideoConferenceCreateData = Omit<IDirectVideoConference, 'createdBy'> & {
+export const isGroupVideoConference = (call: VideoConference | undefined | null): call is IGroupVideoConference =>
-	createdBy: IUser['_id'];
+	call?.type === 'videoconference';
-};
+
-declare type LivechatVideoConferenceCreateData = Omit<ILivechatVideoConference, 'createdBy'> & {
+export const isLivechatVideoConference = (call: VideoConference | undefined | null): call is ILivechatVideoConference =>
-	createdBy: IUser['_id'];
+	call?.type === 'livechat';
-};
+
-export declare type VideoConferenceCreateData = AtLeast<
+type GroupVideoConferenceCreateData = Omit<IGroupVideoConference, 'createdBy'> & { createdBy: IUser['_id'] };
+type DirectVideoConferenceCreateData = Omit<IDirectVideoConference, 'createdBy'> & { createdBy: IUser['_id'] };
+type LivechatVideoConferenceCreateData = Omit<ILivechatVideoConference, 'createdBy'> & { createdBy: IUser['_id'] };
+
+export type VideoConferenceCreateData = AtLeast<
 	DirectVideoConferenceCreateData | GroupVideoConferenceCreateData | LivechatVideoConferenceCreateData,
 	'createdBy' | 'type' | 'rid' | 'providerName' | 'providerData'
 >;
-
-export type VideoConferenceCapabilities = {
-	mic?: boolean;
-	cam?: boolean;
-	title?: boolean;
-};
-
-export type VideoConfStartProps = { roomId: string; title?: string; allowRinging?: boolean };
-
-export type VideoConfJoinProps = {
-	callId: string;
-	state?: {
-		mic?: boolean;
-		cam?: boolean;
-	};
-};
-
-export type VideoConfCancelProps = {
-	callId: string;
-};
-
-export type VideoConfListProps = {
-	roomId: string;
-	count?: number;
-	offset?: number;
-};
-
-export type VideoConfInfoProps = { callId: string };

app/definitions/TUserStatus.ts

@@ -1,3 +1,3 @@
-export const STATUSES = ['offline', 'online', 'away', 'busy', 'disabled'] as const;
+export const STATUSES = ['offline', 'online', 'away', 'busy'] as const;
 
 export type TUserStatus = typeof STATUSES[number];

app/definitions/rest/v1/chat.ts

@@ -33,6 +33,7 @@ export type ChatEndpoints = {
 		GET: (params: { roomId: IServerRoom['_id']; text?: string; offset: number; count: number }) => {
 			messages: IMessageFromServer[];
 			total: number;
+			count: number;
 		};
 	};
 	'chat.getThreadsList': {

app/definitions/rest/v1/videoConference.ts

@@ -1,45 +1,27 @@
-import {
+import { VideoConference } from '../../IVideoConference';
-	VideoConfCancelProps,
-	VideoConference,
-	VideoConferenceCapabilities,
-	VideoConferenceInstructions,
-	VideoConfInfoProps,
-	VideoConfJoinProps,
-	VideoConfListProps,
-	VideoConfStartProps
-} from '../../IVideoConference';
-import { PaginatedResult } from '../helpers/PaginatedResult';
 
 export type VideoConferenceEndpoints = {
-	'video-conference.start': {
-		POST: (params: VideoConfStartProps) => { data: VideoConferenceInstructions & { providerName: string } };
-	};
-
-	'video-conference.join': {
-		POST: (params: VideoConfJoinProps) => { url: string; providerName: string };
-	};
-
-	'video-conference.cancel': {
-		POST: (params: VideoConfCancelProps) => void;
-	};
-
-	'video-conference.info': {
-		GET: (params: VideoConfInfoProps) => VideoConference & { capabilities: VideoConferenceCapabilities };
-	};
-
-	'video-conference.list': {
-		GET: (params: VideoConfListProps) => PaginatedResult<{ data: VideoConference[] }>;
-	};
-
-	'video-conference.capabilities': {
-		GET: () => { providerName: string; capabilities: VideoConferenceCapabilities };
-	};
-
-	'video-conference.providers': {
-		GET: () => { data: { key: string; label: string }[] };
-	};
-
 	'video-conference/jitsi.update-timeout': {
 		POST: (params: { roomId: string }) => void;
 	};
+	'video-conference.join': {
+		POST: (params: { callId: string; state: { cam: boolean } }) => { url: string; providerName: string };
+	};
+	'video-conference.start': {
+		POST: (params: { roomId: string }) => { url: string };
+	};
+
+	'video-conference.cancel': {
+		POST: (params: { callId: string }) => void;
+	};
+
+	'video-conference.info': {
+		GET: (params: { callId: string }) => VideoConference & {
+			capabilities: {
+				mic?: boolean;
+				cam?: boolean;
+				title?: boolean;
+			};
+		};
+	};
 };

app/externalModules.d.ts

@@ -12,6 +12,3 @@ declare module 'react-native-restart';
 declare module 'react-native-jitsi-meet';
 declare module 'rn-root-view';
 declare module 'react-native-math-view';
-declare module '@env' {
-	export const RUNNING_E2E_TESTS: string;
-}

app/i18n/locales/en.json

@@ -876,20 +876,5 @@
   "Call": "Call",
   "Reply_in_direct_message": "Reply in Direct Message",
   "room_archived": "archived room",
-  "room_unarchived": "unarchived room",
+  "room_unarchived": "unarchived room"
-  "no-videoconf-provider-app-header": "Conference call not available",
-  "no-videoconf-provider-app-body": "Conference call apps can be installed in the Rocket.Chat marketplace by a workspace admin.",
-  "admin-no-videoconf-provider-app-header": "Conference call not enabled",
-  "admin-no-videoconf-provider-app-body": "Conference call apps are available in the Rocket.Chat marketplace.",
-  "no-active-video-conf-provider-header": "Conference call not enabled",
-  "no-active-video-conf-provider-body": "A workspace admin needs to enable the conference call feature first.",
-  "admin-no-active-video-conf-provider-header": "Conference call not enabled",
-  "admin-no-active-video-conf-provider-body": "Configure conference calls in order to make it available on this workspace.",
-  "video-conf-provider-not-configured-header": "Conference call not enabled",
-  "video-conf-provider-not-configured-body": "A workspace admin needs to enable the conference calls feature first.",
-  "admin-video-conf-provider-not-configured-header": "Conference call not enabled",
-  "admin-video-conf-provider-not-configured-body": "Configure conference calls in order to make it available on this workspace.",
-  "Presence_Cap_Warning_Title": "User status temporarily disabled",
-  "Presence_Cap_Warning_Description": "Active connections have reached the limit for the workspace, thus the service that handles user status is disabled. It can be re-enabled manually in workspace settings.",
-  "Learn_more": "Learn more"
 }

app/i18n/locales/pt-BR.json

@@ -875,7 +875,5 @@
   "Call": "Ligar",
   "Reply_in_direct_message": "Responder por mensagem direta",
   "room_archived": "{{username}} arquivou a sala",
-  "room_unarchived": "{{username}} desarquivou a sala",
+  "room_unarchived": "{{username}} desarquivou a sala"
-  "Presence_Cap_Warning_Title": "Status do usuário desabilitado temporariamente",
-  "Presence_Cap_Warning_Description": "O limite de conexões ativas para a workspace foi atingido, por isso o serviço responsável pela presença dos usuários está temporariamente desabilitado. Ele pode ser reabilitado manualmente nas configurações da workspace."
 }

app/lib/constants/colors.ts

@@ -3,8 +3,7 @@ export const STATUS_COLORS: any = {
 	busy: '#f5455c',
 	away: '#ffd21f',
 	offline: '#cbced1',
-	loading: '#9ea2a8',
+	loading: '#9ea2a8'
-	disabled: '#F38C39'
 };
 
 export const SWITCH_TRACK_COLOR = {

app/lib/constants/defaultSettings.ts

@@ -1,4 +1,3 @@
-// 🚨🚨 48 settings after login. Pay attention not to reach 50 as that's the limit per request.
 export const defaultSettings = {
 	Accounts_AllowEmailChange: {
 		type: 'valueAsBoolean'
@@ -230,8 +229,5 @@ export const defaultSettings = {
 	},
 	Number_of_users_autocomplete_suggestions: {
 		type: 'valueAsNumber'
-	},
-	Presence_broadcast_disabled: {
-		type: 'valueAsBoolean'
 	}
 } as const;

app/lib/constants/index.ts

@@ -8,6 +8,5 @@ export * from './localAuthentication';
 export * from './localPath';
 export * from './messagesStatus';
 export * from './messageTypeLoad';
-export * from './notifications';
 export * from './defaultSettings';
 export * from './tablet';

app/lib/constants/notifications.ts

@@ -1 +0,0 @@
-export const NOTIFICATION_PRESENCE_CAP = 'NOTIFICATION_PRESENCE_CAP';

app/lib/hooks/useVideoConf.ts

@@ -0,0 +1,27 @@
+import { useCallback } from 'react';
+
+import { TActionSheetOptionsItem, useActionSheet } from '../../containers/ActionSheet';
+import i18n from '../../i18n';
+import { videoConfJoin } from '../methods/videoConf';
+
+export const useVideoConf = (): { joinCall: (blockId: string) => void } => {
+	const { showActionSheet } = useActionSheet();
+
+	const joinCall = useCallback(blockId => {
+		const options: TActionSheetOptionsItem[] = [
+			{
+				title: i18n.t('Video_call'),
+				icon: 'camera',
+				onPress: () => videoConfJoin(blockId, true)
+			},
+			{
+				title: i18n.t('Voice_call'),
+				icon: 'microphone',
+				onPress: () => videoConfJoin(blockId, false)
+			}
+		];
+		showActionSheet({ options });
+	}, []);
+
+	return { joinCall };
+};

app/lib/hooks/useVideoConf.tsx

@@ -1,113 +0,0 @@
-import React, { useEffect, useState } from 'react';
-import { Q } from '@nozbe/watermelondb';
-
-import { useActionSheet } from '../../containers/ActionSheet';
-import StartACallActionSheet from '../../containers/UIKit/VideoConferenceBlock/components/StartACallActionSheet';
-import { ISubscription, SubscriptionType, TSubscriptionModel } from '../../definitions';
-import i18n from '../../i18n';
-import { getUserSelector } from '../../selectors/login';
-import database from '../database';
-import { getSubscriptionByRoomId } from '../database/services/Subscription';
-import { callJitsi } from '../methods';
-import { compareServerVersion, showErrorAlert } from '../methods/helpers';
-import { videoConfStartAndJoin } from '../methods/videoConf';
-import { Services } from '../services';
-import { useAppSelector } from './useAppSelector';
-import { useSnaps } from './useSnaps';
-
-const availabilityErrors = {
-	NOT_CONFIGURED: 'video-conf-provider-not-configured',
-	NOT_ACTIVE: 'no-active-video-conf-provider',
-	NO_APP: 'no-videoconf-provider-app'
-} as const;
-
-const handleErrors = (isAdmin: boolean, error: typeof availabilityErrors[keyof typeof availabilityErrors]) => {
-	if (isAdmin) return showErrorAlert(i18n.t(`admin-${error}-body`), i18n.t(`admin-${error}-header`));
-	return showErrorAlert(i18n.t(`${error}-body`), i18n.t(`${error}-header`));
-};
-
-export const useVideoConf = (rid: string): { showInitCallActionSheet: () => Promise<void>; showCallOption: boolean } => {
-	const [showCallOption, setShowCallOption] = useState(false);
-
-	const serverVersion = useAppSelector(state => state.server.version);
-	const jitsiEnabled = useAppSelector(state => state.settings.Jitsi_Enabled);
-	const jitsiEnableTeams = useAppSelector(state => state.settings.Jitsi_Enable_Teams);
-	const jitsiEnableChannels = useAppSelector(state => state.settings.Jitsi_Enable_Channels);
-	const user = useAppSelector(state => getUserSelector(state));
-
-	const isServer5OrNewer = compareServerVersion(serverVersion, 'greaterThanOrEqualTo', '5.0.0');
-
-	const { showActionSheet } = useActionSheet();
-	const snaps = useSnaps([1250]);
-
-	const handleShowCallOption = (room: TSubscriptionModel) => {
-		if (isServer5OrNewer) return setShowCallOption(true);
-		const isJitsiDisabledForTeams = room.teamMain && !jitsiEnableTeams;
-		const isJitsiDisabledForChannels = !room.teamMain && (room.t === 'p' || room.t === 'c') && !jitsiEnableChannels;
-
-		if (room.t === SubscriptionType.DIRECT) return setShowCallOption(!!jitsiEnabled);
-		if (room.t === SubscriptionType.CHANNEL) return setShowCallOption(!isJitsiDisabledForChannels);
-		if (room.t === SubscriptionType.GROUP) return setShowCallOption(!isJitsiDisabledForTeams);
-
-		return setShowCallOption(false);
-	};
-
-	const canInitAnCall = async () => {
-		if (isServer5OrNewer) {
-			try {
-				await Services.videoConferenceGetCapabilities();
-				return true;
-			} catch (error: any) {
-				const isAdmin = !!['admin'].find(role => user.roles?.includes(role));
-				switch (error?.error) {
-					case availabilityErrors.NOT_CONFIGURED:
-						return handleErrors(isAdmin, availabilityErrors.NOT_CONFIGURED);
-					case availabilityErrors.NOT_ACTIVE:
-						return handleErrors(isAdmin, availabilityErrors.NOT_ACTIVE);
-					case availabilityErrors.NO_APP:
-						return handleErrors(isAdmin, availabilityErrors.NO_APP);
-					default:
-						return handleErrors(isAdmin, availabilityErrors.NOT_CONFIGURED);
-				}
-			}
-		}
-		return true;
-	};
-
-	const initCall = async ({ cam, mic }: { cam: boolean; mic: boolean }) => {
-		if (isServer5OrNewer) return videoConfStartAndJoin({ rid, cam, mic });
-		const room = (await getSubscriptionByRoomId(rid)) as ISubscription;
-		callJitsi({ room, cam });
-	};
-
-	const showInitCallActionSheet = async () => {
-		const canInit = await canInitAnCall();
-		if (canInit) {
-			showActionSheet({
-				children: <StartACallActionSheet rid={rid} initCall={initCall} />,
-				snaps
-			});
-		}
-	};
-
-	const initSubscription = () => {
-		try {
-			const db = database.active;
-			const observeSubCollection = db.get('subscriptions').query(Q.where('rid', rid)).observe();
-			const subObserveQuery = observeSubCollection.subscribe(data => {
-				if (data[0]) {
-					handleShowCallOption(data[0]);
-					subObserveQuery.unsubscribe();
-				}
-			});
-		} catch (e) {
-			console.log("observeSubscriptions: Can't find subscription to observe");
-		}
-	};
-
-	useEffect(() => {
-		initSubscription();
-	}, []);
-
-	return { showInitCallActionSheet, showCallOption };
-};

app/lib/methods/audioFile.ts

@@ -52,7 +52,7 @@ export const deleteAllAudioFiles = async (serverUrl: string): Promise<void> => {
 	try {
 		const serverUrlParsed = sanitizeString(serverUrl);
 		const path = `${FileSystem.documentDirectory}audios/${serverUrlParsed}`;
-		await FileSystem.deleteAsync(path, { idempotent: true });
+		await FileSystem.deleteAsync(path);
 	} catch (error) {
 		log(error);
 	}

app/lib/methods/callJitsi.ts

@@ -46,8 +46,8 @@ export function callJitsiWithoutServer(path: string): void {
 	Navigation.navigate('JitsiMeetView', { url, onlyAudio: false });
 }
 
-export async function callJitsi({ room, cam = false }: { room: ISubscription; cam?: boolean }): Promise<void> {
+export async function callJitsi(room: ISubscription, onlyAudio = false): Promise<void> {
-	logEvent(cam ? events.RA_JITSI_AUDIO : events.RA_JITSI_VIDEO);
+	logEvent(onlyAudio ? events.RA_JITSI_AUDIO : events.RA_JITSI_VIDEO);
 	const url = await jitsiURL({ room });
-	Navigation.navigate('JitsiMeetView', { url, onlyAudio: cam, rid: room?.rid });
+	Navigation.navigate('JitsiMeetView', { url, onlyAudio, rid: room?.rid });
 }

app/lib/methods/getSettings.ts

@@ -11,7 +11,6 @@ import database from '../database';
 import sdk from '../services/sdk';
 import protectedFunction from './helpers/protectedFunction';
 import { parseSettings, _prepareSettings } from './parseSettings';
-import { setPresenceCap } from './getUsersPresence';
 
 const serverInfoKeys = [
 	'Site_Name',
@@ -158,11 +157,8 @@ export async function getSettings(): Promise<void> {
 		const data: IData[] = result.settings || [];
 		const filteredSettings: IPreparedSettings[] = _prepareSettings(data);
 		const filteredSettingsIds = filteredSettings.map(s => s._id);
-		const parsedSettings = parseSettings(filteredSettings);
 
-		reduxStore.dispatch(addSettings(parsedSettings));
+		reduxStore.dispatch(addSettings(parseSettings(filteredSettings)));
-
-		setPresenceCap(parsedSettings.Presence_broadcast_disabled);
 
 		// filter server info
 		const serverInfo = filteredSettings.filter(i1 => serverInfoKeys.includes(i1._id));

app/lib/methods/getUsersPresence.ts

@@ -9,9 +9,6 @@ import database from '../database';
 import { IUser } from '../../definitions';
 import sdk from '../services/sdk';
 import { compareServerVersion } from './helpers';
-import userPreferences from './userPreferences';
-import { NOTIFICATION_PRESENCE_CAP } from '../constants';
-import { setNotificationPresenceCap } from '../../actions/app';
 
 export const _activeUsersSubTimeout: { activeUsersSubTimeout: boolean | ReturnType<typeof setTimeout> | number } = {
 	activeUsersSubTimeout: false
@@ -127,16 +124,3 @@ export function getUserPresence(uid: string) {
 		usersBatch.push(uid);
 	}
 }
-
-export const setPresenceCap = async (enabled: boolean) => {
-	if (enabled) {
-		const notificationPresenceCap = await userPreferences.getBool(NOTIFICATION_PRESENCE_CAP);
-		if (notificationPresenceCap !== false) {
-			userPreferences.setBool(NOTIFICATION_PRESENCE_CAP, true);
-			reduxStore.dispatch(setNotificationPresenceCap(true));
-		}
-	} else {
-		userPreferences.removeItem(NOTIFICATION_PRESENCE_CAP);
-		reduxStore.dispatch(setNotificationPresenceCap(false));
-	}
-};

app/lib/methods/helpers/review.ts

@@ -1,7 +1,5 @@
 import { Alert, Linking } from 'react-native';
 import AsyncStorage from '@react-native-async-storage/async-storage';
-// eslint-disable-next-line import/no-unresolved
-import { RUNNING_E2E_TESTS } from '@env';
 
 import I18n from '../../../i18n';
 import { isFDroidBuild, STORE_REVIEW_LINK } from '../../constants';
@@ -88,15 +86,14 @@ class ReviewApp {
 	positiveEventCount = 0;
 
 	pushPositiveEvent = () => {
-		if (isFDroidBuild || RUNNING_E2E_TESTS === 'true') {
+		if (!isFDroidBuild) {
-			return;
+			if (this.positiveEventCount >= numberOfPositiveEvent) {
-		}
+				return;
-		if (this.positiveEventCount >= numberOfPositiveEvent) {
+			}
-			return;
+			this.positiveEventCount += 1;
-		}
+			if (this.positiveEventCount === numberOfPositiveEvent) {
-		this.positiveEventCount += 1;
+				tryReview();
-		if (this.positiveEventCount === numberOfPositiveEvent) {
+			}
-			tryReview();
 		}
 	};
 }

app/lib/methods/subscriptions/room.ts

@@ -138,23 +138,6 @@ export default class RoomSubscription {
 					reduxStore.dispatch(removeUserTyping(name));
 				}
 			}
-		} else if (ev === 'user-activity') {
-			const { user } = reduxStore.getState().login;
-			const { UI_Use_Real_Name } = reduxStore.getState().settings;
-			const { subscribedRoom } = reduxStore.getState().room;
-			if (subscribedRoom !== _rid) {
-				return;
-			}
-			const [name, activities] = ddpMessage.fields.args;
-			const key = UI_Use_Real_Name ? 'name' : 'username';
-			if (name !== user[key]) {
-				if (activities.includes('user-typing')) {
-					reduxStore.dispatch(addUserTyping(name));
-				}
-				if (!activities.length) {
-					reduxStore.dispatch(removeUserTyping(name));
-				}
-			}
 		} else if (ev === 'deleteMessage') {
 			InteractionManager.runAfterInteractions(async () => {
 				if (ddpMessage && ddpMessage.fields && ddpMessage.fields.args.length > 0) {

app/lib/methods/userPreferences.ts

@@ -16,43 +16,42 @@ class UserPreferences {
 
 	getString(key: string): string | null {
 		try {
-			return this.mmkv.getString(key) ?? null;
+			return this.mmkv.getString(key) || null;
 		} catch {
 			return null;
 		}
 	}
 
 	setString(key: string, value: string): boolean | undefined {
-		return this.mmkv.setString(key, value) ?? undefined;
+		return this.mmkv.setString(key, value) || undefined;
 	}
 
 	getBool(key: string): boolean | null {
 		try {
-			console.log(this.mmkv.getBool(key));
+			return this.mmkv.getBool(key) || null;
-			return this.mmkv.getBool(key) ?? null;
 		} catch {
 			return null;
 		}
 	}
 
 	setBool(key: string, value: boolean): boolean | undefined {
-		return this.mmkv.setBool(key, value) ?? undefined;
+		return this.mmkv.setBool(key, value) || undefined;
 	}
 
 	getMap(key: string): object | null {
 		try {
-			return this.mmkv.getMap(key) ?? null;
+			return this.mmkv.getMap(key) || null;
 		} catch {
 			return null;
 		}
 	}
 
 	setMap(key: string, value: object): boolean | undefined {
-		return this.mmkv.setMap(key, value) ?? undefined;
+		return this.mmkv.setMap(key, value) || undefined;
 	}
 
 	removeItem(key: string): boolean | undefined {
-		return this.mmkv.removeItem(key) ?? undefined;
+		return this.mmkv.removeItem(key) || undefined;
 	}
 }
 

app/lib/methods/videoConf.ts

@@ -19,9 +19,9 @@ const handleBltPermission = async (): Promise<Permission[]> => {
 	return [PermissionsAndroid.PERMISSIONS.ACCESS_COARSE_LOCATION];
 };
 
-export const videoConfJoin = async (callId: string, cam?: boolean, mic?: boolean): Promise<void> => {
+export const videoConfJoin = async (callId: string, cam: boolean) => {
 	try {
-		const result = await Services.videoConferenceJoin(callId, cam, mic);
+		const result = await Services.videoConferenceJoin(callId, cam);
 		if (result.success) {
 			if (isAndroid) {
 				const bltPermission = await handleBltPermission();
@@ -44,11 +44,11 @@ export const videoConfJoin = async (callId: string, cam?: boolean, mic?: boolean
 	}
 };
 
-export const videoConfStartAndJoin = async ({ rid, cam, mic }: { rid: string; cam?: boolean; mic?: boolean }): Promise<void> => {
+export const videoConfStartAndJoin = async (rid: string, cam: boolean) => {
 	try {
-		const videoConfResponse = await Services.videoConferenceStart(rid);
+		const videoConfResponse: any = await Services.videoConferenceStart(rid);
 		if (videoConfResponse.success) {
-			videoConfJoin(videoConfResponse.data.callId, cam, mic);
+			videoConfJoin(videoConfResponse.data.callId, cam);
 		}
 	} catch (e) {
 		showErrorAlert(i18n.t('error-init-video-conf'));

app/lib/methods/videoConfTimer.ts

@@ -1,27 +0,0 @@
-import BackgroundTimer from 'react-native-background-timer';
-
-import { Services } from '../services';
-
-let interval: number | null = null;
-
-export const initVideoConfTimer = (rid: string): void => {
-	if (rid) {
-		Services.updateJitsiTimeout(rid).catch((e: unknown) => console.log(e));
-		if (interval) {
-			BackgroundTimer.clearInterval(interval);
-			BackgroundTimer.stopBackgroundTimer();
-			interval = null;
-		}
-		interval = BackgroundTimer.setInterval(() => {
-			Services.updateJitsiTimeout(rid).catch((e: unknown) => console.log(e));
-		}, 10000);
-	}
-};
-
-export const endVideoConfTimer = (): void => {
-	if (interval) {
-		BackgroundTimer.clearInterval(interval);
-		interval = null;
-		BackgroundTimer.stopBackgroundTimer();
-	}
-};

app/lib/services/connect.ts

@@ -20,16 +20,7 @@ import { updatePermission } from '../../actions/permissions';
 import EventEmitter from '../methods/helpers/events';
 import { updateSettings } from '../../actions/settings';
 import { defaultSettings, MIN_ROCKETCHAT_VERSION } from '../constants';
-import {
+import { getSettings, IActiveUsers, unsubscribeRooms, _activeUsers, _setUser, _setUserTimer, onRolesChanged } from '../methods';
-	getSettings,
-	IActiveUsers,
-	unsubscribeRooms,
-	_activeUsers,
-	_setUser,
-	_setUserTimer,
-	onRolesChanged,
-	setPresenceCap
-} from '../methods';
 import { compareServerVersion, isIOS, isSsl } from '../methods/helpers';
 
 interface IServices {
@@ -153,10 +144,6 @@ function connect({ server, logoutOnError = false }: { server: string; logoutOnEr
 							});
 						}
 						store.dispatch(updateSettings(_id, value));
-
-						if (_id === 'Presence_broadcast_disabled') {
-							setPresenceCap(value);
-						}
 					} catch (e) {
 						log(e);
 					}

app/lib/services/restApi.ts

@@ -812,14 +812,10 @@ export const addUsersToRoom = (rid: string): Promise<boolean> => {
 };
 
 export const emitTyping = (room: IRoom, typing = true) => {
-	const { login, settings, server } = reduxStore.getState();
+	const { login, settings } = reduxStore.getState();
 	const { UI_Use_Real_Name } = settings;
-	const { version: serverVersion } = server;
 	const { user } = login;
 	const name = UI_Use_Real_Name ? user.name : user.username;
-	if (compareServerVersion(serverVersion, 'greaterThanOrEqualTo', '4.0.0')) {
-		return sdk.methodCall('stream-notify-room', `${room}/user-activity`, name, typing ? ['user-typing'] : []);
-	}
 	return sdk.methodCall('stream-notify-room', `${room}/typing`, name, typing);
 };
 
@@ -936,10 +932,8 @@ export function getUserInfo(userId: string) {
 
 export const toggleFavorite = (roomId: string, favorite: boolean) => sdk.post('rooms.favorite', { roomId, favorite });
 
-export const videoConferenceJoin = (callId: string, cam?: boolean, mic?: boolean) =>
+export const videoConferenceJoin = (callId: string, cam: boolean) =>
-	sdk.post('video-conference.join', { callId, state: { cam: !!cam, mic: mic === undefined ? true : mic } });
+	sdk.post('video-conference.join', { callId, state: { cam } });
-
-export const videoConferenceGetCapabilities = () => sdk.get('video-conference.capabilities');
 
 export const videoConferenceStart = (roomId: string) => sdk.post('video-conference.start', { roomId });
 

app/lib/services/sdk.ts

@@ -6,7 +6,7 @@ import { twoFactor } from './twoFactor';
 import { isSsl } from '../methods/helpers/url';
 import { store as reduxStore } from '../store/auxStore';
 import { Serialized, MatchPathPattern, OperationParams, PathFor, ResultFor } from '../../definitions/rest/helpers';
-import { compareServerVersion, random } from '../methods/helpers';
+import { random } from '../methods/helpers';
 
 class Sdk {
 	private sdk: typeof Rocketchat;
@@ -162,22 +162,7 @@ class Sdk {
 	}
 
 	subscribeRoom(...args: any[]) {
-		const { server } = reduxStore.getState();
+		return this.current.subscribeRoom(...args);
-		const { version: serverVersion } = server;
-		const topic = 'stream-notify-room';
-		let eventUserTyping;
-		if (compareServerVersion(serverVersion, 'greaterThanOrEqualTo', '4.0.0')) {
-			eventUserTyping = this.subscribe(topic, `${args[0]}/user-activity`, ...args);
-		} else {
-			eventUserTyping = this.subscribe(topic, `${args[0]}/typing`, ...args);
-		}
-
-		// Taken from https://github.com/RocketChat/Rocket.Chat.js.SDK/blob/454b4ba784095057b8de862eb99340311b672e15/lib/drivers/ddp.ts#L555
-		return Promise.all([
-			this.subscribe('stream-room-messages', args[0], ...args),
-			eventUserTyping,
-			this.subscribe(topic, `${args[0]}/deleteMessage`, ...args)
-		]);
 	}
 
 	unsubscribe(subscription: any[]) {

app/reducers/app.test.ts

@@ -1,4 +1,4 @@
-import { appStart, appInit, setMasterDetail, setNotificationPresenceCap, appReady } from '../actions/app';
+import { appStart, appInit, setMasterDetail } from '../actions/app';
 import { initialState } from './app';
 import { mockedStore } from './mockedStore';
 import { RootEnum } from '../definitions';
@@ -20,9 +20,6 @@ describe('test reducer', () => {
 		mockedStore.dispatch(appInit());
 		const { ready } = mockedStore.getState().app;
 		expect(ready).toEqual(false);
-		mockedStore.dispatch(appReady());
-		const { ready: ready2 } = mockedStore.getState().app;
-		expect(ready2).toEqual(true);
 	});
 
 	it('should return ready state after dispatch setMasterDetail action', () => {
@@ -44,13 +41,4 @@ describe('test reducer', () => {
 		expect(foreground).toEqual(false);
 		expect(background).toEqual(true);
 	});
-
-	it('should return correct state after dispatch setNotificationPresenceCap action', () => {
-		mockedStore.dispatch(setNotificationPresenceCap(true));
-		const { notificationPresenceCap } = mockedStore.getState().app;
-		expect(notificationPresenceCap).toEqual(true);
-		mockedStore.dispatch(setNotificationPresenceCap(false));
-		const { notificationPresenceCap: notificationPresenceCap2 } = mockedStore.getState().app;
-		expect(notificationPresenceCap2).toEqual(false);
-	});
 });

app/reducers/app.ts

@@ -9,7 +9,6 @@ export interface IApp {
 	ready: boolean;
 	foreground: boolean;
 	background: boolean;
-	notificationPresenceCap: boolean;
 }
 
 export const initialState: IApp = {
@@ -18,8 +17,7 @@ export const initialState: IApp = {
 	text: undefined,
 	ready: false,
 	foreground: true,
-	background: false,
+	background: false
-	notificationPresenceCap: false
 };
 
 export default function app(state = initialState, action: TActionApp): IApp {
@@ -57,11 +55,6 @@ export default function app(state = initialState, action: TActionApp): IApp {
 				...state,
 				isMasterDetail: action.isMasterDetail
 			};
-		case APP.SET_NOTIFICATION_PRESENCE_CAP:
-			return {
-				...state,
-				notificationPresenceCap: action.show
-			};
 		default:
 			return state;
 	}

app/stacks/InsideStack.tsx

@@ -105,7 +105,11 @@ const ChatsStackNavigator = () => {
 			/>
 			<ChatsStack.Screen name='SelectedUsersView' component={SelectedUsersView} />
 			<ChatsStack.Screen name='InviteUsersView' component={InviteUsersView} />
-			<ChatsStack.Screen name='InviteUsersEditView' component={InviteUsersEditView} />
+			<ChatsStack.Screen
+				name='InviteUsersEditView'
+				component={InviteUsersEditView}
+				options={InviteUsersEditView.navigationOptions}
+			/>
 			<ChatsStack.Screen name='MessagesView' component={MessagesView} />
 			<ChatsStack.Screen name='AutoTranslateView' component={AutoTranslateView} options={AutoTranslateView.navigationOptions} />
 			<ChatsStack.Screen name='DirectoryView' component={DirectoryView} options={DirectoryView.navigationOptions} />

app/stacks/MasterDetailStack/index.tsx

@@ -142,7 +142,11 @@ const ModalStackNavigator = React.memo(({ navigation }: INavigation) => {
 					component={AddExistingChannelView}
 					options={AddExistingChannelView.navigationOptions}
 				/>
-				<ModalStack.Screen name='InviteUsersEditView' component={InviteUsersEditView} />
+				<ModalStack.Screen
+					name='InviteUsersEditView'
+					component={InviteUsersEditView}
+					options={InviteUsersEditView.navigationOptions}
+				/>
 				<ModalStack.Screen name='MessagesView' component={MessagesView} />
 				<ModalStack.Screen name='AutoTranslateView' component={AutoTranslateView} options={AutoTranslateView.navigationOptions} />
 				<ModalStack.Screen

app/views/DirectoryView/index.tsx

@@ -243,7 +243,7 @@ class DirectoryView extends React.Component<IDirectoryViewProps, IDirectoryViewS
 			title: item.name as string,
 			onPress: () => this.onPressItem(item),
 			baseUrl,
-			testID: `directory-view-item-${item.name}`,
+			testID: `directory-view-item-${item.name}`.toLowerCase(),
 			style,
 			user,
 			theme,

app/views/DiscussionsView/index.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useLayoutEffect, useState } from 'react';
+import React, { useEffect, useLayoutEffect, useRef, useState } from 'react';
 import { FlatList, StyleSheet } from 'react-native';
 import { StackNavigationOptions, StackNavigationProp } from '@react-navigation/stack';
 import { HeaderBackButton } from '@react-navigation/elements';
@@ -46,12 +46,13 @@ const DiscussionsView = ({ navigation, route }: IDiscussionsViewProps): React.Re
 	const [discussions, setDiscussions] = useState<IMessageFromServer[]>([]);
 	const [search, setSearch] = useState<IMessageFromServer[]>([]);
 	const [isSearching, setIsSearching] = useState(false);
-	const [total, setTotal] = useState(0);
+	const total = useRef(0);
-	const [searchTotal, setSearchTotal] = useState(0);
+	const searchText = useRef('');
+	const offset = useRef(0);
 
 	const { colors } = useTheme();
 
-	const load = async (text = '') => {
+	const load = async () => {
 		if (loading) {
 			return;
 		}
@@ -60,18 +61,18 @@ const DiscussionsView = ({ navigation, route }: IDiscussionsViewProps): React.Re
 		try {
 			const result = await Services.getDiscussions({
 				roomId: rid,
-				offset: isSearching ? search.length : discussions.length,
+				offset: offset.current,
 				count: API_FETCH_COUNT,
-				text
+				text: searchText.current
 			});
 
 			if (result.success) {
+				offset.current += result.count;
+				total.current = result.total;
 				if (isSearching) {
-					setSearch(result.messages);
+					setSearch(prevState => (offset.current ? [...prevState, ...result.messages] : result.messages));
-					setSearchTotal(result.total);
 				} else {
 					setDiscussions(result.messages);
-					setTotal(result.total);
 				}
 			}
 			setLoading(false);
@@ -81,15 +82,19 @@ const DiscussionsView = ({ navigation, route }: IDiscussionsViewProps): React.Re
 		}
 	};
 
-	const onSearchChangeText = useDebounce(async (text: string) => {
+	const onSearchChangeText = useDebounce((text: string) => {
 		setIsSearching(true);
-		await load(text);
+		setSearch([]);
+		searchText.current = text;
+		offset.current = 0;
+		load();
 	}, 500);
 
 	const onCancelSearchPress = () => {
 		setIsSearching(false);
 		setSearch([]);
-		setSearchTotal(0);
+		searchText.current = '';
+		offset.current = 0;
 	};
 
 	const onSearchPress = () => {
@@ -181,12 +186,12 @@ const DiscussionsView = ({ navigation, route }: IDiscussionsViewProps): React.Re
 			<FlatList
 				data={isSearching ? search : discussions}
 				renderItem={renderItem}
-				keyExtractor={(item: any) => item.msg}
+				keyExtractor={(item: any) => item._id}
 				style={{ backgroundColor: colors.backgroundColor }}
 				contentContainerStyle={styles.contentContainer}
 				onEndReachedThreshold={0.5}
 				removeClippedSubviews={isIOS}
-				onEndReached={() => (isSearching ? searchTotal : total) > API_FETCH_COUNT ?? load()}
+				onEndReached={() => isSearching && offset.current < total.current && load()}
 				ItemSeparatorComponent={List.Separator}
 				ListFooterComponent={loading ? <ActivityIndicator /> : null}
 				scrollIndicatorInsets={{ right: 1 }}

app/views/InviteUsersEditView/Picker.tsx

@@ -1,92 +0,0 @@
-import React from 'react';
-import { TextInputProps } from 'react-native';
-import RNPickerSelect from 'react-native-picker-select';
-import { useDispatch } from 'react-redux';
-
-import { inviteLinksSetParams } from '../../actions/inviteLinks';
-import { useTheme } from '../../theme';
-import { useAppSelector } from '../../lib/hooks';
-import I18n from '../../i18n';
-import styles from './styles';
-import { events, logEvent } from '../../lib/methods/helpers/log';
-
-const OPTIONS = {
-	days: [
-		{
-			label: '1',
-			value: 1
-		},
-		{
-			label: '7',
-			value: 7
-		},
-		{
-			label: '15',
-			value: 15
-		},
-		{
-			label: '30',
-			value: 30
-		}
-	],
-	maxUses: [
-		{
-			label: '1',
-			value: 1
-		},
-		{
-			label: '5',
-			value: 5
-		},
-		{
-			label: '10',
-			value: 10
-		},
-		{
-			label: '25',
-			value: 25
-		},
-		{
-			label: '50',
-			value: 50
-		},
-		{
-			label: '100',
-			value: 100
-		}
-	]
-};
-
-const Picker = ({ param, first }: { param: 'days' | 'maxUses'; first: string }): JSX.Element => {
-	const { colors } = useTheme();
-	const inviteLinkParam = useAppSelector(state => state.inviteLinks[param]);
-	const dispatch = useDispatch();
-
-	const onValueChangePicker = (value: number) => {
-		logEvent(events.IU_EDIT_SET_LINK_PARAM);
-		const params = {
-			[param]: value
-		};
-		dispatch(inviteLinksSetParams(params));
-	};
-
-	const textInputStyle: TextInputProps = { style: { ...styles.pickerText, color: colors.actionTintColor } };
-	const firstEl = [
-		{
-			label: I18n.t(first),
-			value: 0
-		}
-	];
-	return (
-		<RNPickerSelect
-			style={{ viewContainer: styles.viewContainer }}
-			value={inviteLinkParam}
-			textInputProps={textInputStyle}
-			useNativeAndroidPickerStyle={false}
-			onValueChange={value => onValueChangePicker(value)}
-			items={firstEl.concat(OPTIONS[param])}
-		/>
-	);
-};
-
-export default Picker;

app/views/InviteUsersEditView/index.tsx

@@ -1,54 +1,149 @@
-import { StackNavigationProp } from '@react-navigation/stack';
+import { StackNavigationOptions } from '@react-navigation/stack';
-import React, { useLayoutEffect } from 'react';
+import React from 'react';
-import { View } from 'react-native';
+import { TextInputProps, View } from 'react-native';
-import { useDispatch } from 'react-redux';
+import RNPickerSelect from 'react-native-picker-select';
-import { RouteProp, useNavigation, useRoute } from '@react-navigation/native';
+import { connect } from 'react-redux';
 
-import { inviteLinksCreate } from '../../actions/inviteLinks';
+import { inviteLinksCreate, inviteLinksSetParams } from '../../actions/inviteLinks';
+import { themes } from '../../lib/constants';
 import Button from '../../containers/Button';
 import * as List from '../../containers/List';
 import SafeAreaView from '../../containers/SafeAreaView';
 import StatusBar from '../../containers/StatusBar';
+import { IApplicationState, IBaseScreen } from '../../definitions';
 import I18n from '../../i18n';
 import { ChatsStackParamList } from '../../stacks/types';
+import { withTheme } from '../../theme';
 import { events, logEvent } from '../../lib/methods/helpers/log';
 import styles from './styles';
-import Picker from './Picker';
 
-const InviteUsersEditView = () => {
+const OPTIONS = {
-	const navigation = useNavigation<StackNavigationProp<ChatsStackParamList, 'InviteUsersEditView'>>();
+	days: [
-	const { rid } = useRoute<RouteProp<ChatsStackParamList, 'InviteUsersEditView'>>().params;
+		{
-	const dispatch = useDispatch();
+			label: '1',
+			value: 1
+		},
+		{
+			label: '7',
+			value: 7
+		},
+		{
+			label: '15',
+			value: 15
+		},
+		{
+			label: '30',
+			value: 30
+		}
+	],
+	maxUses: [
+		{
+			label: '1',
+			value: 1
+		},
+		{
+			label: '5',
+			value: 5
+		},
+		{
+			label: '10',
+			value: 10
+		},
+		{
+			label: '25',
+			value: 25
+		},
+		{
+			label: '50',
+			value: 50
+		},
+		{
+			label: '100',
+			value: 100
+		}
+	]
+};
 
-	useLayoutEffect(() => {
+interface IInviteUsersEditViewProps extends IBaseScreen<ChatsStackParamList, 'InviteUsersEditView'> {
-		navigation.setOptions({
+	days: number;
-			title: I18n.t('Invite_users')
+	maxUses: number;
-		});
+}
-	}, [navigation]);
 
-	const createInviteLink = () => {
+class InviteUsersEditView extends React.Component<IInviteUsersEditViewProps, any> {
+	static navigationOptions = (): StackNavigationOptions => ({
+		title: I18n.t('Invite_users')
+	});
+
+	private rid: string;
+
+	constructor(props: IInviteUsersEditViewProps) {
+		super(props);
+		this.rid = props.route.params?.rid;
+	}
+
+	onValueChangePicker = (key: string, value: number) => {
+		const { dispatch } = this.props;
+		logEvent(events.IU_EDIT_SET_LINK_PARAM);
+		const params = {
+			[key]: value
+		};
+		dispatch(inviteLinksSetParams(params));
+	};
+
+	createInviteLink = () => {
+		const { dispatch, navigation } = this.props;
 		logEvent(events.IU_EDIT_CREATE_LINK);
-		dispatch(inviteLinksCreate(rid));
+		dispatch(inviteLinksCreate(this.rid));
 		navigation.pop();
 	};
 
-	return (
+	renderPicker = (key: 'days' | 'maxUses', first: string) => {
-		<SafeAreaView>
+		const { props } = this;
-			<List.Container>
+		const { theme } = props;
-				<StatusBar />
+		const textInputStyle: TextInputProps = { style: { ...styles.pickerText, color: themes[theme].actionTintColor } };
-				<List.Section>
+		const firstEl = [
-					<List.Separator />
+			{
-					<List.Item title='Expiration_Days' right={() => <Picker param={'days'} first={'Never'} />} />
+				label: I18n.t(first),
-					<List.Separator />
+				value: 0
-					<List.Item title='Max_number_of_uses' right={() => <Picker param='maxUses' first='No_limit' />} />
+			}
-					<List.Separator />
+		];
-				</List.Section>
+		return (
-				<View style={styles.innerContainer}>
+			<RNPickerSelect
-					<Button title={I18n.t('Generate_New_Link')} type='primary' onPress={createInviteLink} />
+				style={{ viewContainer: styles.viewContainer }}
-				</View>
+				value={props[key]}
-			</List.Container>
+				textInputProps={textInputStyle}
-		</SafeAreaView>
+				useNativeAndroidPickerStyle={false}
-	);
+				placeholder={{}}
-};
+				onValueChange={value => this.onValueChangePicker(key, value)}
+				items={firstEl.concat(OPTIONS[key])}
+			/>
+		);
+	};
 
-export default InviteUsersEditView;
+	render() {
+		return (
+			<SafeAreaView>
+				<List.Container>
+					<StatusBar />
+					<List.Section>
+						<List.Separator />
+						<List.Item title='Expiration_Days' right={() => this.renderPicker('days', 'Never')} />
+						<List.Separator />
+						<List.Item title='Max_number_of_uses' right={() => this.renderPicker('maxUses', 'No_limit')} />
+						<List.Separator />
+					</List.Section>
+					<View style={styles.innerContainer}>
+						<Button title={I18n.t('Generate_New_Link')} type='primary' onPress={this.createInviteLink} />
+					</View>
+				</List.Container>
+			</SafeAreaView>
+		);
+	}
+}
+
+const mapStateToProps = (state: IApplicationState) => ({
+	days: state.inviteLinks.days,
+	maxUses: state.inviteLinks.maxUses
+});
+
+export default connect(mapStateToProps)(withTheme(InviteUsersEditView));

app/views/JitsiMeetView.android.tsx

@@ -1,13 +1,14 @@
-import { activateKeepAwake, deactivateKeepAwake } from 'expo-keep-awake';
 import React from 'react';
 import { BackHandler, NativeEventSubscription } from 'react-native';
+import BackgroundTimer from 'react-native-background-timer';
 import { isAppInstalled, openAppWithUri } from 'react-native-send-intent';
 import WebView from 'react-native-webview';
 import { WebViewMessage, WebViewNavigation } from 'react-native-webview/lib/WebViewTypes';
+import { activateKeepAwake, deactivateKeepAwake } from 'expo-keep-awake';
 
 import { IBaseScreen } from '../definitions';
 import { events, logEvent } from '../lib/methods/helpers/log';
-import { endVideoConfTimer, initVideoConfTimer } from '../lib/methods/videoConfTimer';
+import { Services } from '../lib/services';
 import { ChatsStackParamList } from '../stacks/types';
 import { withTheme } from '../theme';
 
@@ -19,6 +20,7 @@ class JitsiMeetView extends React.Component<TJitsiMeetViewProps> {
 	private rid: string;
 	private url: string;
 	private videoConf: boolean;
+	private jitsiTimeout: number | null;
 	private backHandler!: NativeEventSubscription;
 
 	constructor(props: TJitsiMeetViewProps) {
@@ -26,6 +28,7 @@ class JitsiMeetView extends React.Component<TJitsiMeetViewProps> {
 		this.rid = props.route.params?.rid;
 		this.url = props.route.params?.url;
 		this.videoConf = !!props.route.params?.videoConf;
+		this.jitsiTimeout = null;
 	}
 
 	componentDidMount() {
@@ -47,8 +50,10 @@ class JitsiMeetView extends React.Component<TJitsiMeetViewProps> {
 
 	componentWillUnmount() {
 		logEvent(this.videoConf ? events.LIVECHAT_VIDEOCONF_TERMINATE : events.JM_CONFERENCE_TERMINATE);
-		if (!this.videoConf) {
+		if (this.jitsiTimeout && !this.videoConf) {
-			endVideoConfTimer();
+			BackgroundTimer.clearInterval(this.jitsiTimeout);
+			this.jitsiTimeout = null;
+			BackgroundTimer.stopBackgroundTimer();
 		}
 		this.backHandler.remove();
 		deactivateKeepAwake();
@@ -59,7 +64,15 @@ class JitsiMeetView extends React.Component<TJitsiMeetViewProps> {
 	onConferenceJoined = () => {
 		logEvent(this.videoConf ? events.LIVECHAT_VIDEOCONF_JOIN : events.JM_CONFERENCE_JOIN);
 		if (this.rid && !this.videoConf) {
-			initVideoConfTimer(this.rid);
+			Services.updateJitsiTimeout(this.rid).catch((e: unknown) => console.log(e));
+			if (this.jitsiTimeout) {
+				BackgroundTimer.clearInterval(this.jitsiTimeout);
+				BackgroundTimer.stopBackgroundTimer();
+				this.jitsiTimeout = null;
+			}
+			this.jitsiTimeout = BackgroundTimer.setInterval(() => {
+				Services.updateJitsiTimeout(this.rid).catch((e: unknown) => console.log(e));
+			}, 10000);
 		}
 	};
 
@@ -77,7 +90,7 @@ class JitsiMeetView extends React.Component<TJitsiMeetViewProps> {
 	render() {
 		return (
 			<WebView
-				source={{ uri: `${this.url}${this.url.includes('#config') ? '&' : '#'}config.disableDeepLinking=true` }}
+				source={{ uri: `${this.url}&config.disableDeepLinking=true` }}
 				onMessage={({ nativeEvent }) => this.onNavigationStateChange(nativeEvent)}
 				onNavigationStateChange={this.onNavigationStateChange}
 				style={{ flex: 1 }}

app/views/JitsiMeetView.ios.tsx

@@ -9,7 +9,6 @@ import { useAppSelector } from '../lib/hooks';
 import { events, logEvent } from '../lib/methods/helpers/log';
 import { getUserSelector } from '../selectors/login';
 import { ChatsStackParamList } from '../stacks/types';
-import { endVideoConfTimer, initVideoConfTimer } from '../lib/methods/videoConfTimer';
 
 const formatUrl = (url: string, baseUrl: string, uriSize: number, avatarAuthURLFragment: string) =>
 	`${baseUrl}/avatar/${url}?format=png&width=${uriSize}&height=${uriSize}${avatarAuthURLFragment}`;
@@ -17,7 +16,7 @@ const formatUrl = (url: string, baseUrl: string, uriSize: number, avatarAuthURLF
 const JitsiMeetView = (): React.ReactElement => {
 	const { goBack } = useNavigation();
 	const {
-		params: { url, onlyAudio, videoConf, rid }
+		params: { url, onlyAudio, videoConf }
 	} = useRoute<RouteProp<ChatsStackParamList, 'JitsiMeetView'>>();
 	const user = useAppSelector(state => getUserSelector(state));
 	const baseUrl = useAppSelector(state => state.server.server);
@@ -61,10 +60,8 @@ const JitsiMeetView = (): React.ReactElement => {
 			}
 		};
 		logEvent(videoConf ? events.LIVECHAT_VIDEOCONF_JOIN : events.JM_CONFERENCE_JOIN);
-		if (!videoConf) initVideoConfTimer(rid);
 		await JitsiMeet.launchJitsiMeetView(conferenceOptions);
 		logEvent(videoConf ? events.LIVECHAT_VIDEOCONF_TERMINATE : events.JM_CONFERENCE_TERMINATE);
-		if (!videoConf) endVideoConfTimer();
 		goBack();
 	};
 

app/views/RoomActionsView/components/CallSection.tsx

@@ -1,25 +0,0 @@
-import React from 'react';
-
-import * as List from '../../../containers/List';
-import i18n from '../../../i18n';
-import { useVideoConf } from '../../../lib/hooks/useVideoConf';
-
-export default function CallSection({ rid }: { rid: string }): React.ReactElement | null {
-	const { showCallOption, showInitCallActionSheet } = useVideoConf(rid);
-
-	if (showCallOption)
-		return (
-			<List.Section>
-				<List.Separator />
-				<List.Item
-					title={i18n.t('Call')}
-					onPress={showInitCallActionSheet}
-					testID='room-actions-call'
-					left={() => <List.Icon name='phone' />}
-					showActionIndicator
-				/>
-				<List.Separator />
-			</List.Section>
-		);
-	return null;
-}

app/views/RoomActionsView/index.tsx

@@ -33,7 +33,7 @@ import sharedStyles from '../Styles';
 import styles from './styles';
 import { ERoomType } from '../../definitions/ERoomType';
 import { E2E_ROOM_TYPES, SWITCH_TRACK_COLOR, themes } from '../../lib/constants';
-import { getPermalinkChannel } from '../../lib/methods';
+import { callJitsi, getPermalinkChannel } from '../../lib/methods';
 import {
 	canAutoTranslate as canAutoTranslateMethod,
 	getRoomAvatar,
@@ -48,9 +48,9 @@ import { getSubscriptionByRoomId } from '../../lib/database/services/Subscriptio
 import { IActionSheetProvider, withActionSheet } from '../../containers/ActionSheet';
 import { MasterDetailInsideStackParamList } from '../../stacks/MasterDetailStack/types';
 import { closeLivechat } from '../../lib/methods/helpers/closeLivechat';
+import { videoConfStartAndJoin } from '../../lib/methods/videoConf';
 import { ILivechatDepartment } from '../../definitions/ILivechatDepartment';
 import { ILivechatTag } from '../../definitions/ILivechatTag';
-import CallSection from './components/CallSection';
 
 interface IOnPressTouch {
 	<T extends keyof ChatsStackParamList>(item: { route?: T; params?: ChatsStackParamList[T]; event?: Function }): void;
@@ -730,6 +730,16 @@ class RoomActionsView extends React.Component<IRoomActionsViewProps, IRoomAction
 		}
 	};
 
+	startVideoConf = ({ video }: { video: boolean }): void => {
+		const { room } = this.state;
+		const { serverVersion } = this.props;
+		if (compareServerVersion(serverVersion, 'greaterThanOrEqualTo', '5.0.0')) {
+			videoConfStartAndJoin(room.rid, video);
+		} else {
+			callJitsi(room, !video);
+		}
+	};
+
 	renderRoomInfo = () => {
 		const { room, member } = this.state;
 		const { rid, name, t, topic, source } = room;
@@ -805,6 +815,63 @@ class RoomActionsView extends React.Component<IRoomActionsViewProps, IRoomAction
 		);
 	};
 
+	renderJitsi = () => {
+		const { room } = this.state;
+		const {
+			jitsiEnabled,
+			jitsiEnableTeams,
+			jitsiEnableChannels,
+			serverVersion,
+			videoConf_Enable_DMs,
+			videoConf_Enable_Channels,
+			videoConf_Enable_Groups,
+			videoConf_Enable_Teams
+		} = this.props;
+
+		const isJitsiDisabledForTeams = room.teamMain && !jitsiEnableTeams;
+		const isJitsiDisabledForChannels = !room.teamMain && (room.t === 'p' || room.t === 'c') && !jitsiEnableChannels;
+
+		const isVideoConfDisabledForTeams = !!room.teamMain && !videoConf_Enable_Teams;
+		const isVideoConfDisabledForChannels = !room.teamMain && room.t === 'c' && !videoConf_Enable_Channels;
+		const isVideoConfDisabledForGroups = !room.teamMain && room.t === 'p' && !videoConf_Enable_Groups;
+		const isVideoConfDisabledForDirect = !room.teamMain && room.t === 'd' && !videoConf_Enable_DMs;
+
+		if (compareServerVersion(serverVersion, 'greaterThanOrEqualTo', '5.0.0')) {
+			if (
+				isVideoConfDisabledForTeams ||
+				isVideoConfDisabledForChannels ||
+				isVideoConfDisabledForGroups ||
+				isVideoConfDisabledForDirect
+			) {
+				return null;
+			}
+		} else if (!jitsiEnabled || isJitsiDisabledForTeams || isJitsiDisabledForChannels) {
+			return null;
+		}
+
+		return (
+			<List.Section>
+				<List.Separator />
+				<List.Item
+					title='Voice_call'
+					onPress={() => this.startVideoConf({ video: false })}
+					testID='room-actions-voice'
+					left={() => <List.Icon name='phone' />}
+					showActionIndicator
+				/>
+				<List.Separator />
+				<List.Item
+					title='Video_call'
+					onPress={() => this.startVideoConf({ video: true })}
+					testID='room-actions-video'
+					left={() => <List.Icon name='camera' />}
+					showActionIndicator
+				/>
+				<List.Separator />
+			</List.Section>
+		);
+	};
+
 	renderE2EEncryption = () => {
 		const { room } = this.state;
 		const { encryptionEnabled } = this.props;
@@ -1041,7 +1108,7 @@ class RoomActionsView extends React.Component<IRoomActionsViewProps, IRoomAction
 				<StatusBar />
 				<List.Container testID='room-actions-scrollview'>
 					{this.renderRoomInfo()}
-					<CallSection rid={rid} />
+					{this.renderJitsi()}
 					{this.renderE2EEncryption()}
 					<List.Section>
 						<List.Separator />
@@ -1232,6 +1299,13 @@ class RoomActionsView extends React.Component<IRoomActionsViewProps, IRoomAction
 
 const mapStateToProps = (state: IApplicationState) => ({
 	userId: getUserSelector(state).id,
+	jitsiEnabled: (state.settings.Jitsi_Enabled || false) as boolean,
+	jitsiEnableTeams: (state.settings.Jitsi_Enable_Teams || false) as boolean,
+	jitsiEnableChannels: (state.settings.Jitsi_Enable_Channels || false) as boolean,
+	videoConf_Enable_DMs: (state.settings.VideoConf_Enable_DMs ?? true) as boolean,
+	videoConf_Enable_Channels: (state.settings.VideoConf_Enable_Channels ?? true) as boolean,
+	videoConf_Enable_Groups: (state.settings.VideoConf_Enable_Groups ?? true) as boolean,
+	videoConf_Enable_Teams: (state.settings.VideoConf_Enable_Teams ?? true) as boolean,
 	encryptionEnabled: state.encryption.enabled,
 	serverVersion: state.server.version,
 	isMasterDetail: state.app.isMasterDetail,

app/views/RoomInfoEditView/index.tsx

@@ -655,6 +655,7 @@ class RoomInfoEditView extends React.Component<IRoomInfoEditViewProps, IRoomInfo
 							label={I18n.t('Password')}
 							value={joinCode}
 							onChangeText={value => this.setState({ joinCode: value })}
+							onSubmitEditing={this.submit}
 							secureTextEntry
 							testID='room-info-edit-view-password'
 						/>

app/views/RoomInfoView/components/UserInfoButton.tsx

@@ -1,48 +0,0 @@
-import React from 'react';
-import { Text } from 'react-native';
-import { BorderlessButton } from 'react-native-gesture-handler';
-
-import { CustomIcon, TIconsName } from '../../../containers/CustomIcon';
-import styles from '../styles';
-import { useTheme } from '../../../theme';
-import { useVideoConf } from '../../../lib/hooks/useVideoConf';
-import i18n from '../../../i18n';
-import { useAppSelector } from '../../../lib/hooks';
-import { compareServerVersion } from '../../../lib/methods/helpers';
-
-// TODO: change other icons on future
-function UserInfoButton({
-	danger,
-	iconName,
-	onPress,
-	label,
-	showIcon
-}: {
-	danger?: boolean;
-	iconName: TIconsName;
-	onPress?: (prop: any) => void;
-	label: string;
-	showIcon?: boolean;
-}): React.ReactElement | null {
-	const { colors } = useTheme();
-	const color = danger ? colors.dangerColor : colors.actionTintColor;
-
-	if (showIcon)
-		return (
-			<BorderlessButton testID={`room-info-view-${iconName}`} onPress={onPress} style={styles.roomButton}>
-				<CustomIcon name={iconName} size={30} color={color} />
-				<Text style={[styles.roomButtonText, { color }]}>{label}</Text>
-			</BorderlessButton>
-		);
-	return null;
-}
-
-export function CallButton({ rid, isDirect }: { rid: string; isDirect: boolean }): React.ReactElement | null {
-	const { showCallOption, showInitCallActionSheet } = useVideoConf(rid);
-	const serverVersion = useAppSelector(state => state.server.version);
-	const greaterThanFive = compareServerVersion(serverVersion, 'greaterThanOrEqualTo', '5.0.0');
-
-	const showIcon = greaterThanFive ? showCallOption : showCallOption && isDirect;
-
-	return <UserInfoButton onPress={showInitCallActionSheet} iconName='phone' label={i18n.t('Call')} showIcon={showIcon} />;
-}

app/views/RoomInfoView/index.tsx

@@ -1,43 +1,43 @@
-import { CompositeNavigationProp, RouteProp } from '@react-navigation/native';
-import { StackNavigationProp } from '@react-navigation/stack';
-import isEmpty from 'lodash/isEmpty';
 import React from 'react';
 import { ScrollView, Text, View } from 'react-native';
 import { BorderlessButton } from 'react-native-gesture-handler';
 import { connect } from 'react-redux';
-import { Observable, Subscription } from 'rxjs';
 import UAParser from 'ua-parser-js';
+import isEmpty from 'lodash/isEmpty';
+import { StackNavigationProp } from '@react-navigation/stack';
+import { CompositeNavigationProp, RouteProp } from '@react-navigation/native';
+import { Observable, Subscription } from 'rxjs';
 
-import Avatar from '../../containers/Avatar';
 import { CustomIcon, TIconsName } from '../../containers/CustomIcon';
-import * as HeaderButton from '../../containers/HeaderButton';
-import { MarkdownPreview } from '../../containers/markdown';
-import RoomTypeIcon from '../../containers/RoomTypeIcon';
-import SafeAreaView from '../../containers/SafeAreaView';
 import Status from '../../containers/Status';
-import StatusBar from '../../containers/StatusBar';
+import Avatar from '../../containers/Avatar';
-import { LISTENER } from '../../containers/Toast';
-import { IApplicationState, ISubscription, IUser, SubscriptionType, TSubscriptionModel } from '../../definitions';
-import { ILivechatVisitor } from '../../definitions/ILivechatVisitor';
-import I18n from '../../i18n';
-import { themes } from '../../lib/constants';
-import { getSubscriptionByRoomId } from '../../lib/database/services/Subscription';
-import { getRoomTitle, getUidDirectMessage, hasPermission } from '../../lib/methods/helpers';
-import EventEmitter from '../../lib/methods/helpers/events';
-import { goRoom } from '../../lib/methods/helpers/goRoom';
-import { handleIgnore } from '../../lib/methods/helpers/handleIgnore';
-import log, { events, logEvent } from '../../lib/methods/helpers/log';
-import Navigation from '../../lib/navigation/appNavigation';
-import { Services } from '../../lib/services';
-import { MasterDetailInsideStackParamList } from '../../stacks/MasterDetailStack/types';
-import { ChatsStackParamList } from '../../stacks/types';
-import { TSupportedThemes, withTheme } from '../../theme';
 import sharedStyles from '../Styles';
-import Channel from './Channel';
+import RoomTypeIcon from '../../containers/RoomTypeIcon';
-import { CallButton } from './components/UserInfoButton';
+import I18n from '../../i18n';
-import Direct from './Direct';
+import * as HeaderButton from '../../containers/HeaderButton';
+import StatusBar from '../../containers/StatusBar';
+import log, { events, logEvent } from '../../lib/methods/helpers/log';
+import { themes } from '../../lib/constants';
+import { TSupportedThemes, withTheme } from '../../theme';
+import { MarkdownPreview } from '../../containers/markdown';
+import { LISTENER } from '../../containers/Toast';
+import EventEmitter from '../../lib/methods/helpers/events';
+import SafeAreaView from '../../containers/SafeAreaView';
+import { goRoom } from '../../lib/methods/helpers/goRoom';
+import Navigation from '../../lib/navigation/appNavigation';
 import Livechat from './Livechat';
+import Channel from './Channel';
+import Direct from './Direct';
 import styles from './styles';
+import { ChatsStackParamList } from '../../stacks/types';
+import { MasterDetailInsideStackParamList } from '../../stacks/MasterDetailStack/types';
+import { SubscriptionType, TSubscriptionModel, ISubscription, IUser, IApplicationState } from '../../definitions';
+import { ILivechatVisitor } from '../../definitions/ILivechatVisitor';
+import { callJitsi } from '../../lib/methods';
+import { getRoomTitle, getUidDirectMessage, hasPermission } from '../../lib/methods/helpers';
+import { Services } from '../../lib/services';
+import { getSubscriptionByRoomId } from '../../lib/database/services/Subscription';
+import { handleIgnore } from '../../lib/methods/helpers/handleIgnore';
 
 interface IGetRoomTitle {
 	room: ISubscription;
@@ -386,6 +386,11 @@ class RoomInfoView extends React.Component<IRoomInfoViewProps, IRoomInfoViewStat
 		}
 	};
 
+	videoCall = () => {
+		const { room } = this.state;
+		callJitsi(room);
+	};
+
 	handleBlockUser = async (rid: string, blocked: string, block: boolean) => {
 		logEvent(events.RI_TOGGLE_BLOCK_USER);
 		try {
@@ -420,7 +425,8 @@ class RoomInfoView extends React.Component<IRoomInfoViewProps, IRoomInfoViewStat
 	};
 
 	renderButtons = () => {
-		const { roomFromRid, roomUser, room } = this.state;
+		const { roomFromRid, roomUser } = this.state;
+		const { jitsiEnabled } = this.props;
 
 		const isFromDm = roomFromRid?.rid ? new RegExp(roomUser._id).test(roomFromRid.rid) : false;
 		const isDirectFromSaved = this.isDirect && this.fromRid && roomFromRid;
@@ -436,7 +442,9 @@ class RoomInfoView extends React.Component<IRoomInfoViewProps, IRoomInfoViewStat
 		return (
 			<View style={styles.roomButtonsContainer}>
 				{this.renderButton(() => this.handleCreateDirectMessage(this.goRoom), 'message', I18n.t('Message'))}
-				<CallButton isDirect={this.isDirect} rid={room.rid} />
+				{jitsiEnabled && this.isDirect
+					? this.renderButton(() => this.handleCreateDirectMessage(this.videoCall), 'camera', I18n.t('Video_call'))
+					: null}
 				{isDirectFromSaved && !isFromDm && !isDmWithMyself
 					? this.renderButton(
 							() => handleIgnore(roomUser._id, !isIgnored, roomFromRid.rid),

app/views/RoomView/RightButtons.tsx

@@ -10,7 +10,8 @@ import * as HeaderButton from '../../containers/HeaderButton';
 import database from '../../lib/database';
 import { getUserSelector } from '../../selectors/login';
 import { events, logEvent } from '../../lib/methods/helpers/log';
-import { IApplicationState, ISubscription, SubscriptionType, TMessageModel, TSubscriptionModel } from '../../definitions';
+import { isTeamRoom } from '../../lib/methods/helpers/room';
+import { IApplicationState, SubscriptionType, TMessageModel, TSubscriptionModel } from '../../definitions';
 import { ChatsStackParamList } from '../../stacks/types';
 import { TActionSheetOptionsItem } from '../../containers/ActionSheet';
 import i18n from '../../i18n';
@@ -19,11 +20,12 @@ import { onHoldLivechat, returnLivechat } from '../../lib/services/restApi';
 import { closeLivechat as closeLivechatService } from '../../lib/methods/helpers/closeLivechat';
 import { Services } from '../../lib/services';
 import { ILivechatDepartment } from '../../definitions/ILivechatDepartment';
-import HeaderCallButton from './components/HeaderCallButton';
 
-interface IRightButtonsProps extends Pick<ISubscription, 't'> {
+interface IRightButtonsProps {
 	userId?: string;
 	threadsEnabled: boolean;
+	rid?: string;
+	t: string;
 	tmid?: string;
 	teamId?: string;
 	isMasterDetail: boolean;
@@ -41,7 +43,6 @@ interface IRightButtonsProps extends Pick<ISubscription, 't'> {
 	livechatRequestComment: boolean;
 	showActionSheet: Function;
 	departmentId?: string;
-	rid?: string;
 }
 
 interface IRigthButtonsState {
@@ -337,7 +338,7 @@ class RightButtonsContainer extends Component<IRightButtonsProps, IRigthButtonsS
 
 	render() {
 		const { isFollowingThread, tunread, tunreadUser, tunreadGroup } = this.state;
-		const { t, tmid, threadsEnabled, rid } = this.props;
+		const { t, tmid, threadsEnabled, teamId, joined } = this.props;
 
 		if (t === 'l') {
 			if (!this.isOmnichannelPreview()) {
@@ -362,13 +363,15 @@ class RightButtonsContainer extends Component<IRightButtonsProps, IRigthButtonsS
 		}
 		return (
 			<HeaderButton.Container>
-				{rid ? <HeaderCallButton rid={rid} /> : null}
+				{isTeamRoom({ teamId, joined }) ? (
+					<HeaderButton.Item iconName='channel-public' onPress={this.goTeamChannels} testID='room-view-header-team-channels' />
+				) : null}
 				{threadsEnabled ? (
 					<HeaderButton.Item
 						iconName='threads'
 						onPress={this.goThreadsView}
 						testID='room-view-header-threads'
-						badge={() => <HeaderButton.BadgeUnread tunread={tunread} tunreadUser={tunreadUser} tunreadGroup={tunreadGroup} />}
+						badge={() => <HeaderButton.Badge tunread={tunread} tunreadUser={tunreadUser} tunreadGroup={tunreadGroup} />}
 					/>
 				) : null}
 				<HeaderButton.Item iconName='search' onPress={this.goSearchView} testID='room-view-search' />

app/views/RoomView/components/HeaderCallButton.tsx

@@ -1,12 +0,0 @@
-import React from 'react';
-
-import * as HeaderButton from '../../../containers/HeaderButton';
-import { useVideoConf } from '../../../lib/hooks/useVideoConf';
-
-export default function HeaderCallButton({ rid }: { rid: string }): React.ReactElement | null {
-	const { showInitCallActionSheet, showCallOption } = useVideoConf(rid);
-
-	if (showCallOption)
-		return <HeaderButton.Item iconName='phone' onPress={showInitCallActionSheet} testID='room-view-header-call' />;
-	return null;
-}

app/views/RoomView/index.tsx

@@ -627,7 +627,7 @@ class RoomView extends React.Component<IRoomViewProps, IRoomViewState> {
 					joined={joined}
 					status={room.status}
 					omnichannelPermissions={omnichannelPermissions}
-					t={(this.t || t) as SubscriptionType}
+					t={this.t || t}
 					encrypted={encrypted}
 					navigation={navigation}
 					toggleFollowThread={this.toggleFollowThread}
@@ -785,22 +785,13 @@ class RoomView extends React.Component<IRoomViewProps, IRoomViewState> {
 		});
 	};
 
-	handleCloseEmoji = (action?: Function, params?: any) => {
-		if (this.messagebox?.current) {
-			return this.messagebox?.current.closeEmojiAndAction(action, params);
-		}
-		if (action) {
-			return action(params);
-		}
-	};
-
 	errorActionsShow = (message: TAnyMessageModel) => {
-		this.handleCloseEmoji(this.messageErrorActions?.showMessageErrorActions, message);
+		this.messagebox?.current?.closeEmojiAndAction(this.messageErrorActions?.showMessageErrorActions, message);
 	};
 
 	showActionSheet = (options: any) => {
 		const { showActionSheet } = this.props;
-		this.handleCloseEmoji(showActionSheet, options);
+		this.messagebox?.current?.closeEmojiAndAction(showActionSheet, options);
 	};
 
 	onEditInit = (message: TAnyMessageModel) => {
@@ -859,7 +850,7 @@ class RoomView extends React.Component<IRoomViewProps, IRoomViewState> {
 	};
 
 	onReactionInit = (message: TAnyMessageModel) => {
-		this.handleCloseEmoji(() => {
+		this.messagebox?.current?.closeEmojiAndAction(() => {
 			this.setState({ selectedMessage: message }, this.showReactionPicker);
 		});
 	};
@@ -874,7 +865,7 @@ class RoomView extends React.Component<IRoomViewProps, IRoomViewState> {
 		if (message.tmid && !this.tmid) {
 			return;
 		}
-		this.handleCloseEmoji(this.messageActions?.showMessageActions, message);
+		this.messagebox?.current?.closeEmojiAndAction(this.messageActions?.showMessageActions, message);
 	};
 
 	showAttachment = (attachment: IAttachment) => {
@@ -903,7 +894,7 @@ class RoomView extends React.Component<IRoomViewProps, IRoomViewState> {
 		this.setState({ selectedMessage: message });
 		const { showActionSheet } = this.props;
 		const { selectedMessage } = this.state;
-		this.handleCloseEmoji(showActionSheet, {
+		this.messagebox?.current?.closeEmojiAndAction(showActionSheet, {
 			children: <ReactionsList reactions={selectedMessage?.reactions} getCustomEmoji={this.getCustomEmoji} />,
 			snaps: ['50%', '80%'],
 			enableContentPanningGesture: false
@@ -1197,11 +1188,6 @@ class RoomView extends React.Component<IRoomViewProps, IRoomViewState> {
 			if ('id' in item && item.t === E2E_MESSAGE_TYPE && item.e2e !== E2E_STATUS.DONE) {
 				name = I18n.t('Encrypted_message');
 			}
-			if (!jumpToMessageId) {
-				setTimeout(() => {
-					sendLoadingEvent({ visible: false });
-				}, 300);
-			}
 			return navigation.push('RoomView', {
 				rid: this.rid,
 				tmid: item.tmid,
@@ -1234,15 +1220,14 @@ class RoomView extends React.Component<IRoomViewProps, IRoomViewState> {
 		});
 	};
 
-	// OLD METHOD - support versions before 5.0.0
+	handleCallJitsi = () => {
-	handleEnterCall = () => {
 		const { room } = this.state;
 		if ('id' in room) {
 			const { jitsiTimeout } = room;
 			if (jitsiTimeout && jitsiTimeout < new Date()) {
 				showErrorAlert(I18n.t('Call_already_ended'));
 			} else {
-				callJitsi({ room });
+				callJitsi(room);
 			}
 		}
 	};
@@ -1388,14 +1373,14 @@ class RoomView extends React.Component<IRoomViewProps, IRoomViewState> {
 					autoTranslateLanguage={'id' in room ? room.autoTranslateLanguage : undefined}
 					navToRoomInfo={this.navToRoomInfo}
 					getCustomEmoji={this.getCustomEmoji}
-					handleEnterCall={this.handleEnterCall}
+					callJitsi={this.handleCallJitsi}
 					blockAction={this.blockAction}
 					threadBadgeColor={this.getBadgeColor(item?.id)}
 					toggleFollowThread={this.toggleFollowThread}
 					jumpToMessage={this.jumpToMessageByUrl}
 					highlighted={highlightedMessage === item.id}
 					theme={theme}
-					closeEmojiAndAction={this.handleCloseEmoji}
+					closeEmojiAndAction={this.messagebox?.current?.closeEmojiAndAction}
 				/>
 			);
 		}

app/views/RoomsListView/index.tsx

@@ -86,7 +86,6 @@ interface IRoomsListViewProps {
 	StoreLastMessage: boolean;
 	useRealName: boolean;
 	isMasterDetail: boolean;
-	notificationPresenceCap: boolean;
 	subscribedRoom: string;
 	width: number;
 	insets: {
@@ -147,7 +146,6 @@ const shouldUpdateProps = [
 	'StoreLastMessage',
 	'theme',
 	'isMasterDetail',
-	'notificationPresenceCap',
 	'refreshing',
 	'queueSize',
 	'inquiryEnabled',
@@ -257,18 +255,21 @@ class RoomsListView extends React.Component<IRoomsListViewProps, IRoomsListViewS
 
 	shouldComponentUpdate(nextProps: IRoomsListViewProps, nextState: IRoomsListViewState) {
 		const { chatsUpdate, searching, item, canCreateRoom, omnichannelsUpdate } = this.state;
+		// eslint-disable-next-line react/destructuring-assignment
 		const propsUpdated = shouldUpdateProps.some(key => nextProps[key] !== this.props[key]);
 		if (propsUpdated) {
 			return true;
 		}
 
 		// check if some display props are changed to force update when focus this view again
+		// eslint-disable-next-line react/destructuring-assignment
 		const displayUpdated = displayPropsShouldUpdate.some(key => nextProps[key] !== this.props[key]);
 		if (displayUpdated) {
 			this.shouldUpdate = true;
 		}
 
 		// check if some sort preferences are changed to getSubscription() when focus this view again
+		// eslint-disable-next-line react/destructuring-assignment
 		const sortPreferencesUpdate = sortPreferencesShouldUpdate.some(key => nextProps[key] !== this.props[key]);
 		if (sortPreferencesUpdate) {
 			this.sortPreferencesChanged = true;
@@ -338,7 +339,6 @@ class RoomsListView extends React.Component<IRoomsListViewProps, IRoomsListViewS
 			showUnread,
 			subscribedRoom,
 			isMasterDetail,
-			notificationPresenceCap,
 			insets,
 			createTeamPermission,
 			createPublicChannelPermission,
@@ -366,11 +366,7 @@ class RoomsListView extends React.Component<IRoomsListViewProps, IRoomsListViewS
 		if (isMasterDetail && item?.rid !== subscribedRoom && subscribedRoom !== prevProps.subscribedRoom) {
 			this.setState({ item: { rid: subscribedRoom } as ISubscription });
 		}
-		if (
+		if (insets.left !== prevProps.insets.left || insets.right !== prevProps.insets.right) {
-			insets.left !== prevProps.insets.left ||
-			insets.right !== prevProps.insets.right ||
-			notificationPresenceCap !== prevProps.notificationPresenceCap
-		) {
 			this.setHeader();
 		}
 
@@ -425,7 +421,7 @@ class RoomsListView extends React.Component<IRoomsListViewProps, IRoomsListViewS
 
 	getHeader = (): StackNavigationOptions => {
 		const { searching, canCreateRoom } = this.state;
-		const { navigation, isMasterDetail, notificationPresenceCap } = this.props;
+		const { navigation, isMasterDetail } = this.props;
 		if (searching) {
 			return {
 				headerTitleAlign: 'left',
@@ -455,7 +451,6 @@ class RoomsListView extends React.Component<IRoomsListViewProps, IRoomsListViewS
 							: // @ts-ignore
 							  () => navigation.toggleDrawer()
 					}
-					badge={() => (notificationPresenceCap ? <HeaderButton.BadgeWarn /> : null)}
 				/>
 			),
 			headerTitle: () => <RoomsListHeaderView />,
@@ -1039,7 +1034,6 @@ class RoomsListView extends React.Component<IRoomsListViewProps, IRoomsListViewS
 const mapStateToProps = (state: IApplicationState) => ({
 	user: getUserSelector(state),
 	isMasterDetail: state.app.isMasterDetail,
-	notificationPresenceCap: state.app.notificationPresenceCap,
 	server: state.server.server,
 	changingServer: state.server.changingServer,
 	searchText: state.rooms.searchText,

app/views/SidebarView/index.tsx

@@ -1,19 +1,17 @@
 import React, { Component } from 'react';
 import { DrawerNavigationProp } from '@react-navigation/drawer';
 import { DrawerNavigationState } from '@react-navigation/native';
-import { Alert, ScrollView, Text, TouchableWithoutFeedback, View, Linking } from 'react-native';
+import { ScrollView, Text, TouchableWithoutFeedback, View } from 'react-native';
 import { connect } from 'react-redux';
 import { dequal } from 'dequal';
-import { Dispatch } from 'redux';
 
 import Avatar from '../../containers/Avatar';
 import Status from '../../containers/Status/Status';
 import { events, logEvent } from '../../lib/methods/helpers/log';
 import I18n from '../../i18n';
 import scrollPersistTaps from '../../lib/methods/helpers/scrollPersistTaps';
-import userPreferences from '../../lib/methods/userPreferences';
 import { CustomIcon } from '../../containers/CustomIcon';
-import { NOTIFICATION_PRESENCE_CAP, STATUS_COLORS, themes } from '../../lib/constants';
+import { themes } from '../../lib/constants';
 import { TSupportedThemes, withTheme } from '../../theme';
 import { getUserSelector } from '../../selectors/login';
 import SafeAreaView from '../../containers/SafeAreaView';
@@ -23,7 +21,6 @@ import styles from './styles';
 import { DrawerParamList } from '../../stacks/types';
 import { IApplicationState, IUser } from '../../definitions';
 import * as List from '../../containers/List';
-import { setNotificationPresenceCap } from '../../actions/app';
 
 interface ISidebarState {
 	showStatus: boolean;
@@ -32,7 +29,6 @@ interface ISidebarState {
 interface ISidebarProps {
 	baseUrl: string;
 	navigation?: DrawerNavigationProp<DrawerParamList>;
-	dispatch: Dispatch;
 	state?: DrawerNavigationState<DrawerParamList>;
 	Site_Name: string;
 	user: IUser;
@@ -40,8 +36,6 @@ interface ISidebarProps {
 	loadingServer: boolean;
 	useRealName: boolean;
 	allowStatusMessage: boolean;
-	notificationPresenceCap: boolean;
-	Presence_broadcast_disabled: boolean;
 	isMasterDetail: boolean;
 	viewStatisticsPermission: string[];
 	viewRoomAdministrationPermission: string[];
@@ -65,10 +59,8 @@ class Sidebar extends Component<ISidebarProps, ISidebarState> {
 			baseUrl,
 			state,
 			isMasterDetail,
-			notificationPresenceCap,
 			useRealName,
 			theme,
-			Presence_broadcast_disabled,
 			viewStatisticsPermission,
 			viewRoomAdministrationPermission,
 			viewUserAdministrationPermission,
@@ -99,15 +91,9 @@ class Sidebar extends Component<ISidebarProps, ISidebarState> {
 		if (nextProps.isMasterDetail !== isMasterDetail) {
 			return true;
 		}
-		if (nextProps.notificationPresenceCap !== notificationPresenceCap) {
-			return true;
-		}
 		if (nextProps.useRealName !== useRealName) {
 			return true;
 		}
-		if (nextProps.Presence_broadcast_disabled !== Presence_broadcast_disabled) {
-			return true;
-		}
 		if (!dequal(nextProps.viewStatisticsPermission, viewStatisticsPermission)) {
 			return true;
 		}
@@ -170,33 +156,6 @@ class Sidebar extends Component<ISidebarProps, ISidebarState> {
 		navigation?.closeDrawer();
 	};
 
-	onPressLearnMorePresenceCap = () => {
-		Linking.openURL('https://go.rocket.chat/i/presence-cap-learn-more');
-	};
-
-	onPressPresenceLearnMore = () => {
-		const { dispatch } = this.props;
-		dispatch(setNotificationPresenceCap(false));
-		userPreferences.setBool(NOTIFICATION_PRESENCE_CAP, false);
-
-		Alert.alert(
-			I18n.t('Presence_Cap_Warning_Title'),
-			I18n.t('Presence_Cap_Warning_Description'),
-			[
-				{
-					text: I18n.t('Learn_more'),
-					onPress: this.onPressLearnMorePresenceCap,
-					style: 'cancel'
-				},
-				{
-					text: I18n.t('Close'),
-					style: 'default'
-				}
-			],
-			{ cancelable: false }
-		);
-	};
-
 	renderAdmin = () => {
 		const { theme, isMasterDetail } = this.props;
 		if (!this.getIsAdmin()) {
@@ -260,27 +219,14 @@ class Sidebar extends Component<ISidebarProps, ISidebarState> {
 	};
 
 	renderCustomStatus = () => {
-		const { user, theme, Presence_broadcast_disabled, notificationPresenceCap } = this.props;
+		const { user, theme } = this.props;
-
-		let status = user?.status;
-		if (Presence_broadcast_disabled) {
-			status = 'disabled';
-		}
-
-		let right: React.ReactElement | undefined = <CustomIcon name='edit' size={20} color={themes[theme!].titleText} />;
-		if (notificationPresenceCap) {
-			right = <View style={[styles.customStatusDisabled, { backgroundColor: STATUS_COLORS.disabled }]} />;
-		} else if (Presence_broadcast_disabled) {
-			right = undefined;
-		}
-
 		return (
 			<SidebarItem
 				text={user.statusText || I18n.t('Edit_Status')}
-				left={<Status size={24} status={status} />}
+				left={<Status size={24} status={user?.status} />}
 				theme={theme!}
-				right={right}
+				right={<CustomIcon name='edit' size={20} color={themes[theme!].titleText} />}
-				onPress={() => (Presence_broadcast_disabled ? this.onPressPresenceLearnMore() : this.sidebarNavigate('StatusView'))}
+				onPress={() => this.sidebarNavigate('StatusView')}
 				testID={`sidebar-custom-status-${user.status}`}
 			/>
 		);
@@ -348,8 +294,6 @@ const mapStateToProps = (state: IApplicationState) => ({
 	loadingServer: state.server.loading,
 	useRealName: state.settings.UI_Use_Real_Name as boolean,
 	allowStatusMessage: state.settings.Accounts_AllowUserStatusMessageChange as boolean,
-	Presence_broadcast_disabled: state.settings.Presence_broadcast_disabled as boolean,
-	notificationPresenceCap: state.app.notificationPresenceCap,
 	isMasterDetail: state.app.isMasterDetail,
 	viewStatisticsPermission: state.permissions['view-statistics'] as string[],
 	viewRoomAdministrationPermission: state.permissions['view-room-administration'] as string[],

app/views/SidebarView/styles.ts

@@ -63,10 +63,5 @@ export default StyleSheet.create({
 	},
 	inverted: {
 		transform: [{ scaleY: -1 }]
-	},
-	customStatusDisabled: {
-		width: 10,
-		height: 10,
-		borderRadius: 5
 	}
 });

app/views/WorkspaceView/ServerAvatar.tsx

@@ -1,11 +1,16 @@
 import React from 'react';
-import { StyleSheet, View } from 'react-native';
+import { StyleSheet, Text, View } from 'react-native';
+import { createImageProgress } from 'react-native-image-progress';
+import * as Progress from 'react-native-progress';
 import FastImage from 'react-native-fast-image';
 
+import sharedStyles from '../Styles';
 import { themes } from '../../lib/constants';
 import { isTablet } from '../../lib/methods/helpers';
 import { TSupportedThemes } from '../../theme';
 
+const ImageProgress = createImageProgress(FastImage);
+
 const SIZE = 96;
 const MARGIN_TOP = isTablet ? 0 : 64;
 const BORDER_RADIUS = 8;
@@ -22,20 +27,50 @@ const styles = StyleSheet.create({
 		width: SIZE,
 		height: SIZE,
 		borderRadius: BORDER_RADIUS
+	},
+	fallback: {
+		width: SIZE,
+		height: SIZE,
+		borderRadius: BORDER_RADIUS,
+		alignItems: 'center',
+		justifyContent: 'center'
+	},
+	initial: {
+		...sharedStyles.textBold,
+		fontSize: 42
 	}
 });
 
+const getInitial = (url: string) => url && url.replace(/http(s?):\/\//, '').slice(0, 1);
+
+interface IFallback {
+	theme: TSupportedThemes;
+	initial: string;
+}
+const Fallback = ({ theme, initial }: IFallback) => (
+	<View style={[styles.container, styles.fallback, { backgroundColor: themes[theme].dangerColor }]}>
+		<Text style={[styles.initial, { color: themes[theme].buttonText }]}>{initial}</Text>
+	</View>
+);
+
 interface IServerAvatar {
 	theme: TSupportedThemes;
 	url: string;
 	image: string;
 }
-
-// TODO: missing skeleton
 const ServerAvatar = React.memo(({ theme, url, image }: IServerAvatar) => (
 	<View style={styles.container}>
 		{image && (
-			<FastImage style={[styles.image, { borderColor: themes[theme].borderColor }]} source={{ uri: `${url}/${image}` }} />
+			<ImageProgress
+				style={[styles.image, { borderColor: themes[theme].borderColor }]}
+				source={{ uri: `${url}/${image}` }}
+				resizeMode={FastImage.resizeMode.cover}
+				indicator={Progress.Pie}
+				indicatorProps={{
+					color: themes[theme].actionTintColor
+				}}
+				renderError={() => <Fallback theme={theme} initial={getInitial(url)} />}
+			/>
 		)}
 	</View>
 ));

babel.config.js

@@ -3,8 +3,7 @@ module.exports = {
 	plugins: [
 		['@babel/plugin-proposal-decorators', { legacy: true }],
 		'react-native-reanimated/plugin',
-		'@babel/plugin-transform-named-capturing-groups-regex',
+		'@babel/plugin-transform-named-capturing-groups-regex'
-		['module:react-native-dotenv']
 	],
 	env: {
 		production: {

e2e/.mocharc.json

@@ -0,0 +1,8 @@
+{
+	"timeout": 300000,
+	"recursive": true,
+	"bail": true,
+	"require": ["ts-node/register"],
+	"file": "e2e/tests/init.ts",
+	"extension": ["ts"]
+}

e2e/README.md

@@ -1,69 +1,84 @@
-## Overview and folder structure
+# E2E Testing
 
-WIP: End-to-end tests are a work in progress and they're going to change.
+## Contents
 
-```
+1. [Prepare test environment](##-1.-Prepare-test-environment)
-|-- e2e
+2. [Prepare test data](##-2.-Prepare-test-data)
-  |-- helpers
+3. [Running tests](##-3.-Running-tests)
-	|-- tests
+4. [FAQ](##-FAQ)
-	|-- data.ts
-	|-- e2e_account.ts
-```
 
-- `e2e/helpers`
+### 1. Prepare test environment
-  - This folder contains a few functions to setup and help write tests.
-- `e2e/tests`
-  - This folder contains the actual test files
-  - It's currently split into `assorted`, `onboarding`, `room`, and `team` folders
-  - There's not a clear convention on where a test should be placed yet, but the folders above exist to try to separate them into features
-  - Keep every test file truly idempotent
-    - Each file can only impact on the tests written inside of it
-    - They should not impact on other files, so pay attention on the data you use
-- `data.ts`
-  - Contains seeds to common test data, like server url, public channels, etc
-  - Currently we point to https://mobile.rocket.chat as main server
-    - Pointing to a local server is not recommended yet, as you would need to create a few public channels and change some permissions
-    - Ideally we should point to a docker or even a mocked server, but that's tbd
-  - Try not to add new data there. Use random values instead.
-    - It's hard to keep track of where each value is used
-- `e2e_account.ts`
-  - Contains user and password with correct permissions on main server
-    - Check `e2e_account.example.ts` for structure
-  - It needs to be added manually on local (it's already set on CI)
-    - Ask Diego Mello for credentials
 
-## Shared config
+#### 1.1. A Rocket.Chat server
-- Change `.env` to `RUNNING_E2E_TESTS=true`
-  - You can also `RUNNING_E2E_TESTS=true yarn start reset-cache`, but it's easier to change the file as long as you don't commit it
 
-## Setup and run iOS
+Either
 
-- Install applesimutils
+* Install Rocket.Chat meteor app by following this [guide](https://developer.rocket.chat/rocket.chat/rocket-chat-environment-setup).
-```
-brew tap wix/brew
-brew install applesimutils
-```
 
-### Run on debug mode
+Or
-- Build the app with `yarn e2e:ios-build-debug`
-- Test the app with `yarn e2e:ios-test-debug`
 
-### Run on release mode
+* Use the local Docker environment available in this folder. You can start the environment using `./e2e/docker/controlRCDemoEnv.sh startandwait`, or you can use the packaged start & run script (see step 3). Either way, you'll need [Docker](https://docs.docker.com/engine/install/) and [Docker Compose](https://docs.docker.com/compose/install/).
-- Build the app with `yarn e2e:ios-build`
-- Test the app with `yarn e2e:ios-test`
 
-## Setup and run Android
+#### 1.2. Set up detox
 
-- Create AVD
+* Install dependencies by following this [guide](https://github.com/wix/Detox/blob/master/docs/Introduction.GettingStarted.md#step-1-install-dependencies) (only Step 1).
-  - It's important to create the same emulator as on CI. Read more: https://wix.github.io/Detox/docs/guide/android-dev-env
-```
-sh ./scripts/create-avd.sh
-```
 
-### Run on debug mode
+### 2. Prepare test data
-- Build the app with `yarn e2e:android-build-debug`
-- Test the app with `yarn e2e:android-test-debug`
 
-### Run on release mode
+* If you're running your own Rocket.Chat server, ensure it's started (e.g. `meteor npm start` in the server project directory).
-- Build the app with `yarn e2e:android-build`
+* Edit `e2e/data.ts`:
-- Test the app with `yarn e2e:android-test`
+  * Set the `server` to the address of the server under test
+  * Create a file called `e2e_account.ts`, in the same folder as `data.ts`. Set the `adminUser` and `adminPassword` to an admin user on that environment (or a user with at least `create-user` and `create-c` permissions). The example of how to create this file is on `e2e/e2e_account.example.ts`
+* Working example configs exist in `./e2e/data/`. Setting `FORCE_DEFAULT_DOCKER_DATA` to `1` in the `runTestsInDocker.sh` script will use the example config automatically
+
+### 3. Running tests
+
+#### 3.1. iOS
+
+* Build app with detox: `detox build -c ios.sim.release`
+* Open Simulator which is used in tests (check in package.json under detox section) from Xcode and make sure that software keyboard is being displayed. To toggle keyboard press `cmd+K`.
+* Run tests: `detox test -c ios.sim.release`, or, if choosing Docker you can run the packaged environment & runner (`./e2e/docker/runTestsInDocker.sh`) which will start the Docker infrastructure, run the tests and tear it down again once done.
+
+#### 3.2. Android
+
+* Build app with detox: `detox build -c android.emu.debug`
+* Run: `react-native start`
+* Run Android emulator with name `ANDROID_API_28` via Android studio or `cd /Users/USERNAME/Library/Android/sdk/emulator/ && ./emulator -avd ANDROID_API_28`
+Note: if you need to run tests on different Android emulator then simply change emulator name in ./package.json detox configurations
+* Run tests: `detox test -c android.emu.debug`
+
+#### 3.3 Running a subset of tests
+
+Tests have been grouped into subfolders. You can choose to run just one group of tests by running, for example:
+
+`detox test ./e2e/tests/onboarding -c ios.sim.release`
+
+To do the same with the Docker runner:
+
+`./e2e/docker/runTestsInDocker.sh onboarding`
+
+### 4. FAQ
+
+#### 4.1. Detox build fails
+
+* Delete `node_modules`, `ios/build`, `android/build`:
+`rm -rf node_modules && rm -rf ios/build && rm -rf android/build`
+* Install packages: `yarn install`
+* Kill metro bundler server by closing terminal or with following command: `lsof -ti:8081 | xargs kill`
+* Clear metro bundler cache: `watchman watch-del-all && rm -rf $TMPDIR/react-native-packager-cache-* &&  rm -rf $TMPDIR/metro-bundler-cache-*`
+* Make sure you have all required [environment](##-1.-Prepare-test-environment).
+* Now try building again with `detox build` (with specific configuration).
+
+#### 4.2. Detox iOS test run fails
+
+* Check if your meteor app is running by opening `localhost:3000` in browser.
+* Make sure software keyboard is displayed in simulator when focusing some input. To enable keyboard press `cmd+K`.
+* Make sure you have prepared all [test data](##-2.-Prepare-test-data).
+* Sometimes detox e2e tests fail for no reason so all you can do is simply re-run again.
+
+### 5. Todo
+
+* TOTP test
+* Push notifications
+* Deep linking
+* Intermittent connectivity

e2e/data.ts

@@ -1,7 +1,7 @@
-// @ts-ignore
+/* eslint-disable import/extensions, import/no-unresolved */
-// eslint-disable-next-line import/no-unresolved, import/extensions
-import account from './e2e_account';
 import random from './helpers/random';
+// @ts-ignore
+import account from './e2e_account';
 
 export interface IUser {
 	username: string;
@@ -11,12 +11,40 @@ export interface IUser {
 
 export type TData = typeof data;
 export type TDataKeys = keyof TData;
+export type TDataUsers = keyof typeof data.users;
 export type TDataChannels = keyof typeof data.channels;
+export type TUserRegularChannels = keyof typeof data.userRegularChannels;
+export type TDataGroups = keyof typeof data.groups;
+export type TDataTeams = keyof typeof data.teams;
 
+const value: string = random(20);
 const data = {
 	server: 'https://mobile.rocket.chat',
-	alternateServer: 'https://stable.rocket.chat',
 	...account,
+	alternateServer: 'https://stable.rocket.chat',
+	users: {
+		regular: {
+			username: `userone${value}`,
+			password: '123',
+			email: `mobile+regular${value}@rocket.chat`
+		},
+		alternate: {
+			username: `usertwo${value}`,
+			password: '123',
+			email: `mobile+alternate${value}@rocket.chat`,
+			totpSecret: 'NA4GOMZGHBQSK6KEFRVT62DMGJJGSYZJFZIHO3ZOGVXWCYZ6MMZQ'
+		},
+		profileChanges: {
+			username: `userthree${value}`,
+			password: '123',
+			email: `mobile+profileChanges${value}@rocket.chat`
+		},
+		existing: {
+			username: `existinguser${value}`,
+			password: '123',
+			email: `mobile+existing${value}@rocket.chat`
+		}
+	},
 	channels: {
 		detoxpublic: {
 			name: 'detox-public'
@@ -26,15 +54,48 @@ const data = {
 			joinCode: '123'
 		}
 	},
-	randomUser: (): { username: string; name: string; password: string; email: string } => {
+	userRegularChannels: {
-		const randomVal = random();
+		detoxpublic: {
-		return {
+			name: `detox-public-${value}`
-			username: `user${randomVal}`,
+		}
-			name: `user${randomVal}`, // FIXME: apply a different name
+	},
-			password: `password${randomVal}`,
+	groups: {
-			email: `mobile+${randomVal}@rocket.chat`
+		private: {
-		};
+			name: `detox-private-${value}`
-	}
+		},
+		alternate: {
+			name: `detox-alternate-${value}`
+		},
+		alternate2: {
+			name: `detox-alternate2-${value}`
+		}
+	},
+	teams: {
+		private: {
+			name: `detox-team-${value}`
+		}
+	},
+	registeringUser: {
+		username: `newuser${value}`,
+		password: `password${value}`,
+		email: `mobile+registering${value}@rocket.chat`
+	},
+	registeringUser2: {
+		username: `newusertwo${value}`,
+		password: `passwordtwo${value}`,
+		email: `mobile+registeringtwo${value}@rocket.chat`
+	},
+	registeringUser3: {
+		username: `newuserthree${value}`,
+		password: `passwordthree${value}`,
+		email: `mobile+registeringthree${value}@rocket.chat`
+	},
+	registeringUser4: {
+		username: `newuserfour${value}`,
+		password: `passwordfour${value}`,
+		email: `mobile+registeringfour${value}@rocket.chat`
+	},
+	random: value
 };
 
 export default data;

e2e/data/data.cloud.ts

@@ -0,0 +1,96 @@
+/* eslint-disable import/extensions, import/no-unresolved */
+// @ts-ignore
+import random from './helpers/random';
+// @ts-ignore
+import account from './e2e_account';
+
+export interface IUser {
+	username: string;
+	password: string;
+	email: string;
+}
+
+export type TData = typeof data;
+export type TDataKeys = keyof TData;
+export type TDataUsers = keyof typeof data.users;
+export type TDataChannels = keyof typeof data.channels;
+export type TUserRegularChannels = keyof typeof data.userRegularChannels;
+export type TDataGroups = keyof typeof data.groups;
+export type TDataTeams = keyof typeof data.teams;
+
+const value = random(20);
+const data = {
+	server: 'https://mobile.rocket.chat',
+	...account,
+	alternateServer: 'https://stable.rocket.chat',
+	users: {
+		regular: {
+			username: `userone${value}`,
+			password: '123',
+			email: `mobile+regular${value}@rocket.chat`
+		},
+		alternate: {
+			username: `usertwo${value}`,
+			password: '123',
+			email: `mobile+alternate${value}@rocket.chat`,
+			totpSecret: 'NA4GOMZGHBQSK6KEFRVT62DMGJJGSYZJFZIHO3ZOGVXWCYZ6MMZQ'
+		},
+		profileChanges: {
+			username: `userthree${value}`,
+			password: '123',
+			email: `mobile+profileChanges${value}@rocket.chat`
+		},
+		existing: {
+			username: `existinguser${value}`,
+			password: '123',
+			email: `mobile+existing${value}@rocket.chat`
+		}
+	},
+	channels: {
+		detoxpublic: {
+			name: 'detox-public'
+		},
+		detoxpublicprotected: {
+			name: 'detox-public-protected',
+			joinCode: '123'
+		}
+	},
+	userRegularChannels: {
+		detoxpublic: {
+			name: `detox-public-${value}`
+		}
+	},
+	groups: {
+		private: {
+			name: `detox-private-${value}`
+		}
+	},
+	teams: {
+		private: {
+			name: `detox-team-${value}`
+		}
+	},
+	registeringUser: {
+		username: `newuser${value}`,
+		password: `password${value}`,
+		email: `mobile+registering${value}@rocket.chat`
+	},
+	registeringUser2: {
+		username: `newusertwo${value}`,
+		password: `passwordtwo${value}`,
+		email: `mobile+registeringtwo${value}@rocket.chat`
+	},
+	registeringUser3: {
+		username: `newuserthree${value}`,
+		password: `passwordthree${value}`,
+		email: `mobile+registeringthree${value}@rocket.chat`
+	},
+	registeringUser4: {
+		username: `newuserfour${value}`,
+		password: `passwordfour${value}`,
+		email: `mobile+registeringfour${value}@rocket.chat`
+	},
+	random: value
+};
+
+export default data;

e2e/data/data.docker.ts

@@ -0,0 +1,101 @@
+/* eslint-disable import/extensions, import/no-unresolved */
+// @ts-ignore
+import random from './helpers/random';
+
+export interface IUser {
+	username: string;
+	password: string;
+	email: string;
+}
+
+export type TData = typeof data;
+export type TDataKeys = keyof TData;
+export type TDataUsers = keyof typeof data.users;
+export type TDataChannels = keyof typeof data.channels;
+export type TUserRegularChannels = keyof typeof data.userRegularChannels;
+export type TDataGroups = keyof typeof data.groups;
+export type TDataTeams = keyof typeof data.teams;
+
+const value = random(20);
+const data = {
+	server: 'http://localhost:3000',
+	adminUser: 'admin',
+	adminPassword: 'password',
+	alternateServer: 'https://stable.rocket.chat',
+	users: {
+		regular: {
+			username: `userone${value}`,
+			password: '123',
+			email: `mobile+regular${value}@rocket.chat`
+		},
+		alternate: {
+			username: `usertwo${value}`,
+			password: '123',
+			email: `mobile+alternate${value}@rocket.chat`,
+			totpSecret: 'NA4GOMZGHBQSK6KEFRVT62DMGJJGSYZJFZIHO3ZOGVXWCYZ6MMZQ'
+		},
+		profileChanges: {
+			username: `userthree${value}`,
+			password: '123',
+			email: `mobile+profileChanges${value}@rocket.chat`
+		},
+		existing: {
+			username: `existinguser${value}`,
+			password: '123',
+			email: `mobile+existing${value}@rocket.chat`
+		}
+	},
+	channels: {
+		detoxpublic: {
+			name: 'detox-public'
+		},
+		detoxpublicprotected: {
+			name: 'detox-public-protected',
+			joinCode: '123'
+		}
+	},
+	userRegularChannels: {
+		detoxpublic: {
+			name: `detox-public-${value}`
+		}
+	},
+	groups: {
+		private: {
+			name: `detox-private-${value}`
+		},
+		alternate: {
+			name: `detox-alternate-${value}`
+		},
+		alternate2: {
+			name: `detox-alternate2-${value}`
+		}
+	},
+	teams: {
+		private: {
+			name: `detox-team-${value}`
+		}
+	},
+	registeringUser: {
+		username: `newuser${value}`,
+		password: `password${value}`,
+		email: `mobile+registering${value}@rocket.chat`
+	},
+	registeringUser2: {
+		username: `newusertwo${value}`,
+		password: `passwordtwo${value}`,
+		email: `mobile+registeringtwo${value}@rocket.chat`
+	},
+	registeringUser3: {
+		username: `newuserthree${value}`,
+		password: `passwordthree${value}`,
+		email: `mobile+registeringthree${value}@rocket.chat`
+	},
+	registeringUser4: {
+		username: `newuserfour${value}`,
+		password: `passwordfour${value}`,
+		email: `mobile+registeringfour${value}@rocket.chat`
+	},
+	random: value
+};
+
+export default data;

e2e/docker/controlRCDemoEnv.sh

@@ -0,0 +1,70 @@
+#!/bin/bash
+SCRIPTPATH="$( cd "$(dirname "$0")" ; pwd -P )"
+
+PAUSE_ON_FAIL_FOR_DEBUG=0
+
+COMMAND="start"
+if [ "$1" != "" ]; then
+    if [[ "$1" =~ ^(start|startandwait|stop)$ ]]; then
+        COMMAND=$1
+    else
+        echo "Invalid command. Must be one of: start,stop"
+        exit 1
+    fi
+fi
+
+WAIT=0
+if [ "$COMMAND" == "startandwait" ]; then
+    COMMAND="start"
+    WAIT=1
+fi
+
+COMPOSEPATH="$SCRIPTPATH/rc_test_env"
+export DATAROOT="$SCRIPTPATH"
+
+if [ "$COMMAND" == "start" ]; then
+    echo "Fetching infrastructure config from GitHub"
+    COMPOSEURL=https://raw.githubusercontent.com/RocketChat/Rocket.Chat/develop/docker-compose.yml
+    COMPOSEFILE="$COMPOSEPATH/docker-compose.yml"
+    curl -s "$COMPOSEURL" -o "$COMPOSEFILE"
+    
+    echo "Starting infrastructure"
+    (
+        if [ -d "$SCRIPTPATH/data/db" ]; then rm -rf "$SCRIPTPATH/data/db"; fi
+        cd "$COMPOSEPATH"
+        docker-compose up -d
+    )
+
+    if [ $WAIT == 1 ]; then
+        echo "Waiting for RocketChat to be ready"
+
+        ATTEMPT_NUMBER=0
+        MAX_ATTEMPTS=60
+        while [ $ATTEMPT_NUMBER -lt $MAX_ATTEMPTS ]; do # https://stackoverflow.com/a/21189312/399007
+            ATTEMPT_NUMBER=$((ATTEMPT_NUMBER + 1 ))
+            echo "Checking if servers are ready (attempt $ATTEMPT_NUMBER of $MAX_ATTEMPTS)"
+            LOGS=$(docker logs rc_test_env_rocketchat_1  2> /dev/null)
+            if grep -q 'SERVER RUNNING' <<< $LOGS ; then
+                echo "RocketChat is ready!"
+                break
+            else
+                if [ $ATTEMPT_NUMBER == $MAX_ATTEMPTS ]; then
+                    echo "RocketChat failed to start"
+                    if [ $PAUSE_ON_FAIL_FOR_DEBUG == 1 ]; then
+                        read -n 1 -s -r -p "Press any key to tear down infrastructure." && echo
+                    fi
+                    docker-compose down --volumes
+                    exit 1
+                fi
+            fi
+            sleep 4
+        done
+    fi
+fi
+
+if [ "$COMMAND" == "stop" ]; then
+    (
+        cd "$COMPOSEPATH"
+        docker-compose down --volumes
+    )
+fi

e2e/docker/docker-entrypoint-initdb.d/aaa_configureAndWaitForMongo.js

@@ -0,0 +1,11 @@
+rs.initiate({
+    _id: 'rs0',
+    members: [ { _id: 0, host: 'localhost:27017' } ]})
+
+var masterness = db.isMaster().ismaster
+print("MongoDB Master initial state: " + masterness)
+while(db.isMaster().ismaster==false) {
+    print("Waiting for MongoDB election")
+    sleep(1000)
+}
+print("Election complete! Ready for data imports.")

e2e/docker/docker-entrypoint-initdb.d/migrations.js

@@ -0,0 +1 @@
+db.getCollection("migrations").insert({"_id":"control","locked":false,"version":NumberInt(188),"buildAt":"2020-05-11T19:06:54.422Z","lockedAt":new Date(1591734393789)});