[FEATURE] Share extension

__mocks__/react-native-realm-path.js

@@ -0,0 +1,3 @@
+export default {
+	realmPath: ''
+};

android/app/build.gradle

@@ -174,6 +174,8 @@ android {
 dependencies {
     addUnimodulesDependencies()
     implementation "org.webkit:android-jsc:r241213"
+    implementation project(':rn-extensions-share')
+    implementation project(':rn-fetch-blob')
     implementation project(':react-native-firebase')
     implementation project(':react-native-webview')
     implementation project(':react-native-orientation-locker')

android/app/src/main/AndroidManifest.xml

@@ -5,8 +5,10 @@
 	<uses-permission android:name="android.permission.INTERNET" />
 	<uses-permission android:name="android.permission.CAMERA" />
 	<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
+	<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />  
 	<uses-permission android:name="android.permission.RECORD_AUDIO" />
 	<uses-permission android:name="android.permission.WAKE_LOCK" />
+	<uses-permission android:name="android.permission.DOWNLOAD_WITHOUT_NOTIFICATION" />
 	<uses-permission-sdk-23 android:name="android.permission.VIBRATE"/>
 
 	<application
@@ -25,6 +27,7 @@
 			<intent-filter>
 				<action android:name="android.intent.action.MAIN" />
 				<category android:name="android.intent.category.LAUNCHER" />
+				<action android:name="android.intent.action.DOWNLOAD_COMPLETE"/>
 			</intent-filter>
 			<intent-filter android:label="@string/app_name">
 				<action android:name="android.intent.action.VIEW" />
@@ -36,6 +39,19 @@
 			</intent-filter>
 		</activity>
 		<activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
+		<activity
+				android:noHistory="true"
+				android:name=".share.ShareActivity"
+				android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
+				android:label="@string/share_extension_name"
+				android:screenOrientation="portrait"
+				android:theme="@style/AppTheme" >
+				<intent-filter>
+					<action android:name="android.intent.action.SEND" />
+					<category android:name="android.intent.category.DEFAULT" />
+					<data android:mimeType="*/*" />
+				</intent-filter>
+		</activity>
 	</application>
 
 </manifest>

android/app/src/main/java/chat/rocket/reactnative/MainApplication.java

@@ -33,6 +33,8 @@
 import com.actionsheet.ActionSheetPackage;
 import io.realm.react.RealmReactPackage;
 import com.swmansion.rnscreens.RNScreensPackage;
+import chat.rocket.SharePackage;
+import com.RNFetchBlob.RNFetchBlobPackage;
 
 import chat.rocket.reactnative.generated.BasePackageList;
 
@@ -67,6 +69,8 @@ protected List<ReactPackage> getPackages() {
             new RNCWebViewPackage(),
             new OrientationPackage(),
             new SplashScreenReactPackage(),
+            new SharePackage(),
+            new RNFetchBlobPackage(),
 		  		new RNGestureHandlerPackage(),
 					new RNScreensPackage(),
 					new ActionSheetPackage(),

android/app/src/main/java/chat/rocket/reactnative/share/ShareActivity.java

@@ -0,0 +1,23 @@
+package chat.rocket.reactnative.share;
+
+import com.facebook.react.ReactActivity;
+import com.facebook.react.ReactActivityDelegate;
+import com.facebook.react.ReactRootView;
+import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView;
+
+public class ShareActivity extends ReactActivity {
+    @Override
+    protected String getMainComponentName() {
+        return "ShareRocketChatRN";
+    }
+
+    @Override
+    protected ReactActivityDelegate createReactActivityDelegate() {
+      return new ReactActivityDelegate(this, getMainComponentName()) {
+        @Override
+        protected ReactRootView createRootView() {
+         return new RNGestureHandlerEnabledRootView(ShareActivity.this);
+        }
+      };
+    }
+}

android/app/src/main/java/chat/rocket/reactnative/share/ShareApplication.java

@@ -0,0 +1,38 @@
+package chat.rocket.reactnative.share;
+
+import chat.rocket.reactnative.BuildConfig;
+
+import chat.rocket.SharePackage;
+
+import android.app.Application;
+
+import com.facebook.react.shell.MainReactPackage;
+import com.facebook.react.ReactNativeHost;
+import com.facebook.react.ReactApplication;
+import com.facebook.react.ReactPackage;
+
+import java.util.Arrays;
+import java.util.List;
+
+
+public class ShareApplication extends Application implements ReactApplication {
+ private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
+   @Override
+   public boolean getUseDeveloperSupport() {
+     return BuildConfig.DEBUG;
+   }
+
+   @Override
+   protected List<ReactPackage> getPackages() {
+     return Arrays.<ReactPackage>asList(
+         new MainReactPackage(),
+         new SharePackage()
+     );
+   }
+ };
+
+ @Override
+ public ReactNativeHost getReactNativeHost() {
+     return mReactNativeHost;
+ }
+}

android/app/src/main/res/values/strings.xml

@@ -1,5 +1,5 @@
 <resources>
     <string name="app_name">Rocket.Chat Experimental</string>
-
+    <string name="share_extension_name">Rocket.Chat Experimental</string>
     <string name="no_browser_found">No Browser Found</string>
 </resources>

android/app/src/main/res/values/styles.xml

@@ -2,4 +2,19 @@
     <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
         <item name="android:colorEdgeEffect">#aaaaaa</item>
     </style>
+
+    <style name="Share.Window" parent="android:Theme">
+        <item name="android:windowEnterAnimation">@null</item>
+        <item name="android:windowExitAnimation">@null</item>
+    </style>
+
+    <style name="Theme.Share.Transparent" parent="android:Theme">
+        <item name="android:windowIsTranslucent">true</item>
+        <item name="android:windowBackground">@color/primary_dark</item>
+        <item name="android:windowContentOverlay">@null</item>
+        <item name="android:windowNoTitle">true</item>
+        <item name="android:windowIsFloating">true</item>
+        <item name="android:backgroundDimEnabled">true</item>
+        <item name="android:windowAnimationStyle">@style/Share.Window</item>
+    </style>
 </resources>

android/settings.gradle

@@ -36,4 +36,8 @@ include ':realm'
 project(':realm').projectDir = new File(rootProject.projectDir, '../node_modules/realm/android')
 include ':reactnativenotifications'
 project(':reactnativenotifications').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-notifications/android')
-include ':app'
+include ':rn-fetch-blob'                                                                                                  
+project(':rn-fetch-blob').projectDir = new File(rootProject.projectDir, '../node_modules/rn-fetch-blob/android')
+include ':app', ':rn-extensions-share'
+project(':rn-extensions-share').projectDir = new File(rootProject.projectDir, '../node_modules/rn-extensions-share/android')
+

app.json

@@ -1,4 +1,5 @@
 {
   "name": "RocketChatRN",
+  "share": "ShareRocketChatRN",
   "displayName": "RocketChatRN"
 }

app/constants/settings.js

@@ -68,6 +68,12 @@ export default {
 	Threads_enabled: {
 		type: null
 	},
+	FileUpload_MediaTypeWhiteList: {
+		type: 'valueAsString'
+	},
+	FileUpload_MaxFileSize: {
+		type: 'valueAsNumber'
+	},
 	API_Gitlab_URL: {
 		type: 'valueAsString'
 	},

app/containers/HeaderButton.js

@@ -32,6 +32,15 @@ export const CloseModalButton = React.memo(({ navigation, testID }) => (
 	</CustomHeaderButtons>
 ));
 
+export const CloseShareExtensionButton = React.memo(({ onPress, testID }) => (
+	<CustomHeaderButtons left>
+		{isIOS
+			? <Item title='cancel' onPress={onPress} testID={testID} />
+			: <Item title='close' iconName='cross' onPress={onPress} testID={testID} />
+		}
+	</CustomHeaderButtons>
+));
+
 export const MoreButton = React.memo(({ onPress, testID }) => (
 	<CustomHeaderButtons>
 		<Item title='more' iconName='menu' onPress={onPress} testID={testID} />
@@ -50,6 +59,10 @@ CloseModalButton.propTypes = {
 	navigation: PropTypes.object.isRequired,
 	testID: PropTypes.string.isRequired
 };
+CloseShareExtensionButton.propTypes = {
+	onPress: PropTypes.func.isRequired,
+	testID: PropTypes.string.isRequired
+};
 MoreButton.propTypes = {
 	onPress: PropTypes.func.isRequired,
 	testID: PropTypes.string.isRequired

app/containers/RoomTypeIcon.js

@@ -7,8 +7,12 @@ import { COLOR_TEXT_DESCRIPTION } from '../constants/colors';
 const styles = StyleSheet.create({
 	style: {
 		marginRight: 7,
-		marginTop: 3,
-		tintColor: COLOR_TEXT_DESCRIPTION,
+		marginTop: 3
+	},
+	imageColor: {
+		tintColor: COLOR_TEXT_DESCRIPTION
+	},
+	iconColor: {
 		color: COLOR_TEXT_DESCRIPTION
 	},
 	discussion: {
@@ -23,13 +27,15 @@ const RoomTypeIcon = React.memo(({ type, size, style }) => {
 
 	if (type === 'discussion') {
 		// FIXME: These are temporary only. We should have all room icons on <Customicon />, but our design team is still working on this.
-		return <CustomIcon name='chat' size={13} style={[styles.style, styles.discussion]} />;
+		return <CustomIcon name='chat' size={13} style={[styles.style, styles.iconColor, styles.discussion]} />;
 	}
 
 	if (type === 'c') {
-		return <Image source={{ uri: 'hashtag' }} style={[styles.style, style, { width: size, height: size }]} />;
+		return <Image source={{ uri: 'hashtag' }} style={[styles.style, styles.imageColor, style, { width: size, height: size }]} />;
+	} if (type === 'd') {
+		return <CustomIcon name='at' size={13} style={[styles.style, styles.iconColor, styles.discussion]} />;
 	}
-	return <Image source={{ uri: 'lock' }} style={[styles.style, style, { width: size, height: size }]} />;
+	return <Image source={{ uri: 'lock' }} style={[styles.style, styles.imageColor, style, { width: size, height: size }]} />;
 });
 
 RoomTypeIcon.propTypes = {

app/i18n/locales/en.js

@@ -103,6 +103,7 @@ export default {
 	Avatar_changed_successfully: 'Avatar changed successfully!',
 	Avatar_Url: 'Avatar URL',
 	Away: 'Away',
+	Back: 'Back',
 	Block_user: 'Block user',
 	Broadcast_channel_Description: 'Only authorized users can write new messages, but the other users will be able to reply',
 	Broadcast_Channel: 'Broadcast Channel',
@@ -308,6 +309,8 @@ export default {
 	Search_global_users: 'Search for global users',
 	Search_global_users_description: 'If you turn-on, you can search for any user from others companies or servers.',
 	Select_Avatar: 'Select Avatar',
+	Select_Channels: 'Select Channels',
+	Select_Server: 'Select Server',
 	Select_Users: 'Select Users',
 	Send: 'Send',
 	Send_audio_message: 'Send audio message',
@@ -346,6 +349,7 @@ export default {
 	Thread: 'Thread',
 	Threads: 'Threads',
 	Timezone: 'Timezone',
+	To: 'To',
 	topic: 'topic',
 	Topic: 'Topic',
 	Translate: 'Translate',
@@ -386,6 +390,7 @@ export default {
 	Welcome: 'Welcome',
 	Welcome_to_RocketChat: 'Welcome to Rocket.Chat',
 	Whats_your_2fa: 'What\'s your 2FA code?',
+	Without_Servers: 'Without Servers',
 	Yes_action_it: 'Yes, {{action}} it!',
 	Yesterday: 'Yesterday',
 	You_are_in_preview_mode: 'You are in preview mode',
@@ -395,6 +400,7 @@ export default {
 	you_were_mentioned: 'you were mentioned',
 	you: 'you',
 	You: 'You',
+	You_need_to_access_at_least_one_RocketChat_server_to_share_something: 'You need to access at least one Rocket.Chat server to share something.',
 	Version_no: 'Version: {{version}}',
 	You_will_not_be_able_to_recover_this_message: 'You will not be able to recover this message!',
 	Change_Language: 'Change Language',

app/i18n/locales/pt-BR.js

@@ -108,6 +108,7 @@ export default {
 	Avatar_changed_successfully: 'Avatar alterado com sucesso!',
 	Avatar_Url: 'Avatar URL',
 	Away: 'Ausente',
+	Back: 'Voltar',
 	Block_user: 'Bloquear usuário',
 	Broadcast_channel_Description: 'Somente usuários autorizados podem escrever novas mensagens, mas os outros usuários poderão responder',
 	Broadcast_Channel: 'Canal de Transmissão',
@@ -299,6 +300,8 @@ export default {
 	Search_global_users: 'Busca por usuários globais',
 	Search_global_users_description: 'Caso ativado, busca por usuários de outras empresas ou servidores.',
 	Select_Avatar: 'Selecionar Avatar',
+	Select_Channels: 'Selecionar Canais',
+	Select_Server: 'Selecionar Servidor',
 	Select_Users: 'Selecionar Usuários',
 	Send: 'Enviar',
 	Send_audio_message: 'Enviar mensagem de áudio',
@@ -330,6 +333,7 @@ export default {
 	Thread: 'Tópico',
 	Threads: 'Tópicos',
 	Timezone: 'Fuso horário',
+	To: 'Para',
 	topic: 'tópico',
 	Topic: 'Tópico',
 	Try_again: 'Tentar novamente',
@@ -366,6 +370,7 @@ export default {
 	Welcome: 'Bem vindo',
 	Welcome_to_RocketChat: 'Bem vindo ao Rocket.Chat',
 	Whats_your_2fa: 'Qual seu código de autenticação?',
+	Without_Servers: 'Sem Servidores',
 	Yes_action_it: 'Sim, {{action}}!',
 	Yesterday: 'Ontem',
 	You_are_in_preview_mode: 'Está é uma prévia do canal',

app/index.js

@@ -5,18 +5,17 @@ import {
 import { Provider } from 'react-redux';
 import { useScreens } from 'react-native-screens'; // eslint-disable-line import/no-unresolved
 import { Linking } from 'react-native';
-import firebase from 'react-native-firebase';
 import PropTypes from 'prop-types';
 
 import { appInit } from './actions';
 import { deepLinkingOpen } from './actions/deepLinking';
 import Navigation from './lib/Navigation';
 import Sidebar from './views/SidebarView';
-import { HEADER_BACKGROUND, HEADER_TITLE, HEADER_BACK } from './constants/colors';
 import parseQuery from './lib/methods/helpers/parseQuery';
 import { initializePushNotifications, onNotification } from './notifications/push';
 import store from './lib/createStore';
 import NotificationBadge from './notifications/inApp';
+import { defaultHeader, onNavigationStateChange } from './utils/navigation';
 
 useScreens();
 
@@ -34,17 +33,6 @@ const parseDeepLinking = (url) => {
 	return null;
 };
 
-const defaultHeader = {
-	headerStyle: {
-		backgroundColor: HEADER_BACKGROUND
-	},
-	headerTitleStyle: {
-		color: HEADER_TITLE
-	},
-	headerBackTitle: null,
-	headerTintColor: HEADER_BACK
-};
-
 // Outside
 const OutsideStack = createStackNavigator({
 	OnboardingView: {
@@ -262,28 +250,6 @@ const App = createAppContainer(createSwitchNavigator(
 	}
 ));
 
-// gets the current screen from navigation state
-const getActiveRouteName = (navigationState) => {
-	if (!navigationState) {
-		return null;
-	}
-	const route = navigationState.routes[navigationState.index];
-	// dive into nested navigators
-	if (route.routes) {
-		return getActiveRouteName(route);
-	}
-	return route.routeName;
-};
-
-const onNavigationStateChange = (prevState, currentState) => {
-	const currentScreen = getActiveRouteName(currentState);
-	const prevScreen = getActiveRouteName(prevState);
-
-	if (prevScreen !== currentScreen) {
-		firebase.analytics().setCurrentScreen(currentScreen);
-	}
-};
-
 export default class Root extends React.Component {
 	constructor(props) {
 		super(props);