diff --git a/android/app/build.gradle b/android/app/build.gradle index d224d8bb..b5061cd0 100644 --- a/android/app/build.gradle +++ b/android/app/build.gradle @@ -103,6 +103,7 @@ android { abiFilters "armeabi-v7a", "x86" } missingDimensionStrategy "RNN.reactNativeVersion", "reactNative55" + vectorDrawables.useSupportLibrary = true } compileOptions { @@ -178,17 +179,17 @@ repositories { } dependencies { + implementation project(':react-native-image-crop-picker') implementation project(':react-native-i18n') implementation project(':react-native-fabric') implementation project(':react-native-audio') implementation project(":reactnativekeyboardinput") implementation project(':react-native-video') implementation project(':react-native-svg') - implementation project(':react-native-image-picker') implementation project(':react-native-vector-icons') - implementation project(':react-native-fetch-blob') + implementation project(':rn-fetch-blob') implementation project(':react-native-zeroconf') - implementation project(':react-native-toast') + implementation project(':@remobile/react-native-toast') implementation project(':react-native-fast-image') implementation project(':realm') implementation project(':react-native-navigation') diff --git a/android/app/src/main/assets/fonts/MaterialCommunityIcons.ttf b/android/app/src/main/assets/fonts/MaterialCommunityIcons.ttf index 69404e3d..82524a0c 100644 Binary files a/android/app/src/main/assets/fonts/MaterialCommunityIcons.ttf and b/android/app/src/main/assets/fonts/MaterialCommunityIcons.ttf differ diff --git a/android/app/src/main/assets/fonts/Octicons.ttf b/android/app/src/main/assets/fonts/Octicons.ttf index 5b1f7d6e..09f5a96c 100644 Binary files a/android/app/src/main/assets/fonts/Octicons.ttf and b/android/app/src/main/assets/fonts/Octicons.ttf differ diff --git a/android/app/src/main/java/chat/rocket/reactnative/MainApplication.java b/android/app/src/main/java/chat/rocket/reactnative/MainApplication.java index 6f4059c8..fdd50ce0 100644 --- a/android/app/src/main/java/chat/rocket/reactnative/MainApplication.java +++ b/android/app/src/main/java/chat/rocket/reactnative/MainApplication.java @@ -4,6 +4,7 @@ import android.content.Context; import android.os.Bundle; import com.AlexanderZaytsev.RNI18n.RNI18nPackage; +import com.reactnative.ivpusic.imagepicker.PickerPackage; import com.RNFetchBlob.RNFetchBlobPackage; import com.balthazargronon.RCTZeroconf.ZeroconfReactPackage; import com.brentvatne.react.ReactVideoPackage; @@ -12,7 +13,6 @@ import com.dylanvann.fastimage.FastImageViewPackage; import com.facebook.react.ReactPackage; import com.facebook.react.shell.MainReactPackage; import com.horcrux.svg.SvgPackage; -import com.imagepicker.ImagePickerPackage; import com.oblador.vectoricons.VectorIconsPackage; import com.reactnativenavigation.NavigationApplication; import com.remobile.toast.RCTToastPackage; @@ -57,8 +57,8 @@ public class MainApplication extends NavigationApplication implements INotificat public List createAdditionalReactPackages() { return Arrays.asList( new MainReactPackage(), + new PickerPackage(), new SvgPackage(), - new ImagePickerPackage(), new VectorIconsPackage(), new RNFetchBlobPackage(), new ZeroconfReactPackage(), diff --git a/android/build.gradle b/android/build.gradle index d6cd4cf1..7b1e283f 100644 --- a/android/build.gradle +++ b/android/build.gradle @@ -25,6 +25,7 @@ allprojects { maven { url 'https://maven.google.com' } + maven { url "https://jitpack.io" } maven { // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm url "$rootDir/../node_modules/react-native/android" diff --git a/android/settings.gradle b/android/settings.gradle index 0cc5136b..7a757615 100644 --- a/android/settings.gradle +++ b/android/settings.gradle @@ -1,4 +1,10 @@ rootProject.name = 'RocketChatRN' +include ':@remobile/react-native-toast' +project(':@remobile/react-native-toast').projectDir = new File(rootProject.projectDir, '../node_modules/@remobile/react-native-toast/android') +include ':rn-fetch-blob' +project(':rn-fetch-blob').projectDir = new File(rootProject.projectDir, '../node_modules/rn-fetch-blob/android') +include ':react-native-image-crop-picker' +project(':react-native-image-crop-picker').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-image-crop-picker/android') include ':react-native-i18n' project(':react-native-i18n').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-i18n/android') include ':react-native-fast-image' @@ -13,18 +19,12 @@ include ':react-native-video' project(':react-native-video').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-video/android') include ':react-native-svg' project(':react-native-svg').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-svg/android') -include ':react-native-image-picker' -project(':react-native-image-picker').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-image-picker/android') include ':react-native-vector-icons' project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android') -include ':react-native-fetch-blob' -project(':react-native-fetch-blob').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-fetch-blob/android') include ':react-native-zeroconf' project(':react-native-zeroconf').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-zeroconf/android') include ':realm' project(':realm').projectDir = new File(rootProject.projectDir, '../node_modules/realm/android') -include ':react-native-toast' -project(':react-native-toast').projectDir = new File(settingsDir, '../node_modules/@remobile/react-native-toast/android') include ':react-native-navigation' project(':react-native-navigation').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-navigation/android/app/') include ':reactnativenotifications' diff --git a/app/containers/Button/index.js b/app/containers/Button/index.js index f72880b2..32eb7de9 100644 --- a/app/containers/Button/index.js +++ b/app/containers/Button/index.js @@ -16,8 +16,7 @@ const colors = { const styles = StyleSheet.create({ container: { paddingHorizontal: 15, - paddingVertical: 10, - borderRadius: 2 + paddingVertical: 10 }, text: { textAlign: 'center', @@ -40,6 +39,9 @@ const styles = StyleSheet.create({ }, disabled: { opacity: 0.5 + }, + border: { + borderRadius: 2 } }); @@ -48,7 +50,9 @@ export default class Button extends React.PureComponent { title: PropTypes.string, type: PropTypes.string, onPress: PropTypes.func, - disabled: PropTypes.bool + disabled: PropTypes.bool, + margin: PropTypes.any, + backgroundColor: PropTypes.string } static defaultProps = { @@ -60,21 +64,22 @@ export default class Button extends React.PureComponent { render() { const { - title, type, onPress, disabled, ...otherProps + title, type, onPress, disabled, margin, backgroundColor, ...otherProps } = this.props; return ( diff --git a/app/containers/MessageBox/FilesActions.js b/app/containers/MessageBox/FilesActions.js new file mode 100644 index 00000000..e7def299 --- /dev/null +++ b/app/containers/MessageBox/FilesActions.js @@ -0,0 +1,59 @@ +import React, { Component } from 'react'; +import PropTypes from 'prop-types'; +import ActionSheet from 'react-native-actionsheet'; + +import I18n from '../../i18n'; + +export default class FilesActions extends Component { + static propTypes = { + hideActions: PropTypes.func.isRequired, + takePhoto: PropTypes.func.isRequired, + chooseFromLibrary: PropTypes.func.isRequired + } + + constructor(props) { + super(props); + + // Cancel + this.options = [I18n.t('Cancel')]; + this.CANCEL_INDEX = 0; + + // Photo + this.options.push(I18n.t('Take_a_photo')); + this.PHOTO_INDEX = 1; + + // Library + this.options.push(I18n.t('Choose_from_library')); + this.LIBRARY_INDEX = 2; + + setTimeout(() => { + this.ActionSheet.show(); + }); + } + + handleActionPress = (actionIndex) => { + const { takePhoto, chooseFromLibrary } = this.props; + switch (actionIndex) { + case this.PHOTO_INDEX: + takePhoto(); + break; + case this.LIBRARY_INDEX: + chooseFromLibrary(); + break; + default: + break; + } + this.props.hideActions(); + } + + render() { + return ( + this.ActionSheet = o} + options={this.options} + cancelButtonIndex={this.CANCEL_INDEX} + onPress={this.handleActionPress} + /> + ); + } +} diff --git a/app/containers/MessageBox/UploadModal.js b/app/containers/MessageBox/UploadModal.js new file mode 100644 index 00000000..53f91ed4 --- /dev/null +++ b/app/containers/MessageBox/UploadModal.js @@ -0,0 +1,133 @@ +import React, { Component } from 'react'; +import { View, Text, StyleSheet, Image, ScrollView, Platform } from 'react-native'; +import PropTypes from 'prop-types'; +import Modal from 'react-native-modal'; +import { responsive } from 'react-native-responsive-ui'; +import equal from 'deep-equal'; + +import TextInput from '../TextInput'; +import Button from '../Button'; +import I18n from '../../i18n'; + +const cancelButtonColor = '#f7f8fa'; + +const styles = StyleSheet.create({ + titleContainer: { + flexDirection: 'row', + paddingHorizontal: 16, + paddingTop: 16 + }, + title: { + fontWeight: 'bold' + }, + container: { + height: Platform.OS === 'ios' ? 404 : 430, + backgroundColor: '#ffffff', + flexDirection: 'column' + }, + scrollView: { + flex: 1, + padding: 16 + }, + image: { + height: 150, + flex: 1, + marginBottom: 16, + resizeMode: 'contain' + }, + buttonContainer: { + flexDirection: 'row', + justifyContent: 'space-between', + padding: 16, + backgroundColor: '#f7f8fa' + }, + buttonMargin: { + margin: 0 + } +}); + +@responsive +export default class UploadModal extends Component { + static propTypes = { + isVisible: PropTypes.bool, + file: PropTypes.object, + close: PropTypes.func, + submit: PropTypes.func, + window: PropTypes.object + } + + state = { + name: '', + description: '', + file: {} + }; + + static getDerivedStateFromProps(props, state) { + if (!equal(props.file, state.file) && props.file && props.file.path) { + return { + file: props.file, + name: props.file.filename || 'Filename', + description: '' + }; + } + return null; + } + + _submit = () => { + const { file, submit } = this.props; + const { name, description } = this.state; + submit({ ...file, name, description }); + } + + render() { + const { window: { width }, isVisible, close } = this.props; + const { name, description, file } = this.state; + return ( + this.props.close()} + onBackButtonPress={() => this.props.close()} + animationIn='fadeIn' + animationOut='fadeOut' + useNativeDriver + hideModalContentWhileAnimating + > + + + Upload file? + + + + + this.setState({ name: value })} + /> + this.setState({ description: value })} + /> + + +