react-native-share - npm Package Compare versions

Comparing version 1.0.27 to 1.1.0

components/Button.js

@@ -1,4 +0,6 @@
-import React from 'react';
-import {StyleSheet, Text, TouchableOpacity, Image} from 'react-native';
+// @flow
 
+import * as React from 'react';
+import { StyleSheet, Text, TouchableOpacity, Image } from 'react-native';
+
 const styles = StyleSheet.create({
@@ -10,3 +12,3 @@ buttonText: {
     fontWeight: 'bold',
-    textAlignVertical: 'center'
+    textAlignVertical: 'center',
   },
@@ -17,3 +19,3 @@ button: {
     padding: 10,
-    flexDirection: 'row'
+    flexDirection: 'row',
   },
@@ -24,15 +26,19 @@ icon: {
     marginLeft: 10,
-    marginRight: 30
-  }
+    marginRight: 30,
+  },
 });
 
-export default ({buttonStyle, onPress, iconSrc, textStyle, children}) =>
-  <TouchableOpacity
-    activeOpacity={0.5}
-    style={[styles.button, buttonStyle]}
-    onPress={onPress}>
+type Props = {
+  buttonStyle: Object,
+  onPress: () => void,
+  iconSrc: string,
+  textStyle: Object,
+  children: React.Node,
+};
+
+export default ({ buttonStyle, onPress, iconSrc, textStyle, children }: Props) => (
+  <TouchableOpacity activeOpacity={0.5} style={[styles.button, buttonStyle]} onPress={onPress}>
     <Image style={styles.icon} source={iconSrc} />
-    <Text style={[styles.buttonText, textStyle]}>
-      {children}
-    </Text>
-  </TouchableOpacity>;
+    <Text style={[styles.buttonText, textStyle]}>{children}</Text>
+  </TouchableOpacity>
+);

components/Overlay.js

@@ -1,4 +0,6 @@
-import React from 'react';
-import {Animated, StyleSheet, TouchableHighlight} from 'react-native';
+// @flow
 
+import * as React from 'react';
+import { Animated, StyleSheet } from 'react-native';
+
 const DEFAULT_ANIMATE_TIME = 300;
@@ -12,3 +14,3 @@ const styles = StyleSheet.create({
     backgroundColor: 'transparent',
-    position: 'absolute'
+    position: 'absolute',
   },
@@ -19,10 +21,21 @@ emptyOverlay: {
     backgroundColor: 'transparent',
-    position: 'absolute'
-  }
+    position: 'absolute',
+  },
 });
 
-export default class extends React.Component {
+type Props = {
+  visible: boolean,
+  onCancel: () => void,
+  children: React.Node,
+};
+
+type State = {
+  fadeAnim: Object,
+  overlayStyle: Object,
+};
+
+class Overlay extends React.Component<Props, State> {
   state = {
     fadeAnim: new Animated.Value(0),
-    overlayStyle: styles.emptyOverlay
+    overlayStyle: styles.emptyOverlay,
   };
@@ -32,12 +45,12 @@
     if (!this.props.visible) {
-      this.setState({overlayStyle: styles.emptyOverlay});
+      this.setState({ overlayStyle: styles.emptyOverlay });
     }
   }
-  componentWillReceiveProps(newProps) {
+  UNSAFE_componentWillReceiveProps(newProps: Props) {
     if (newProps.visible) {
-      this.setState({overlayStyle: styles.fullOverlay});
+      this.setState({ overlayStyle: styles.fullOverlay });
     }
     return Animated.timing(this.state.fadeAnim, {
       toValue: newProps.visible ? 1 : 0,
-      duration: DEFAULT_ANIMATE_TIME
+      duration: DEFAULT_ANIMATE_TIME,
     }).start(this.onAnimatedEnd.bind(this));
@@ -47,4 +60,3 @@ }
     return (
-      <Animated.View
-        style={[this.state.overlayStyle, {opacity: this.state.fadeAnim}]}>
+      <Animated.View style={[this.state.overlayStyle, { opacity: this.state.fadeAnim }]}>
         {this.props.children}
@@ -55,1 +67,3 @@ </Animated.View>
 }
+
+export default Overlay;

components/Sheet.js

@@ -1,16 +0,27 @@
-import React from 'react';
-import {Animated} from 'react-native';
+// @flow
 
+import * as React from 'react';
+import { Animated } from 'react-native';
+
 const DEFAULT_BOTTOM = -300;
 const DEFAULT_ANIMATE_TIME = 300;
 
-export default class extends React.Component {
+type Props = {
+  children: React.Node,
+  visible: boolean,
+};
+
+type State = {
+  bottom: Object,
+};
+
+export default class extends React.Component<Props, State> {
   state = {
-    bottom: new Animated.Value(DEFAULT_BOTTOM)
+    bottom: new Animated.Value(DEFAULT_BOTTOM),
   };
 
-  componentWillReceiveProps(newProps) {
+  UNSAFE_componentWillReceiveProps(newProps: Props) {
     return Animated.timing(this.state.bottom, {
       toValue: newProps.visible ? 0 : DEFAULT_BOTTOM,
-      duration: DEFAULT_ANIMATE_TIME
+      duration: DEFAULT_ANIMATE_TIME,
     }).start();
@@ -21,7 +32,5 @@ }
     return (
-      <Animated.View style={{bottom: this.state.bottom}}>
-        {this.props.children}
-      </Animated.View>
+      <Animated.View style={{ bottom: this.state.bottom }}>{this.props.children}</Animated.View>
     );
   }
 }

index.js

@@ -1,5 +0,6 @@
-import React from 'react';
+// @flow
+
+import * as React from 'react';
 import {
   View,
-  Text,
   StyleSheet,
@@ -11,2 +12,3 @@ TouchableOpacity,
   ActionSheetIOS,
+  PermissionsAndroid,
 } from 'react-native';
@@ -19,89 +21,233 @@
 const styles = StyleSheet.create({
-    actionSheetContainer: {
-      flex: 1,
-      paddingTop: 10,
-      paddingBottom: 0,
-      justifyContent: "flex-end",
-      backgroundColor: 'rgba(0, 0, 0, 0.5)',
-    },
-    buttonContainer: {
-      overflow: 'hidden',
-      backgroundColor: 'white',
-      paddingBottom: 5,
-      paddingTop: 5
-    }
+  actionSheetContainer: {
+    flex: 1,
+    paddingTop: 10,
+    paddingBottom: 0,
+    justifyContent: 'flex-end',
+    backgroundColor: 'rgba(0, 0, 0, 0.5)',
+  },
+  buttonContainer: {
+    overflow: 'hidden',
+    backgroundColor: 'white',
+    paddingBottom: 5,
+    paddingTop: 5,
+  },
 });
 
-class RNShare {
-  static open(options) {
-    return new Promise((resolve, reject) => {
-      if (Platform.OS === "ios") {
-        ActionSheetIOS.showShareActionSheetWithOptions(options, (error) => {
-          return reject({ error: error });
-        }, (success, activityType) => {
-          if(success) {
-            return resolve({
-              app: activityType
-            });
-          } else {
-            reject({ error: "User did not share" });
-          }
-        });
-      } else {
-        NativeModules.RNShare.open(options,(e) => {
-          return reject({ error: e });
-        },(e) => {
-          resolve({
-            message: e
-          });
-        });
-      }
-    });
+type Props = {
+  visible: boolean,
+  onCancel: () => void,
+  children: React.Node,
+};
+
+class ShareSheet extends React.Component<Props> {
+  backButtonHandler: () => boolean;
+
+  componentDidMount() {
+    this.backButtonHandler = this.backButtonHandler.bind(this);
+    BackHandler.addEventListener('backPress', this.backButtonHandler);
   }
-  static shareSingle(options){
-    if (Platform.OS === "ios" || Platform.OS === "android") {
-      return new Promise((resolve, reject) => {
-        NativeModules.RNShare.shareSingle(options,(e) => {
-          return reject({ error: e });
-        },(e) => {
-          return resolve({
-            message: e
-          });
-        });
-      });
-    } else {
-      throw new Exception("not implemented");
+
+  componentWillUnmount() {
+    BackHandler.removeEventListener('backPress', this.backButtonHandler);
+  }
+
+  backButtonHandler() {
+    if (this.props.visible) {
+      this.props.onCancel();
+      return true;
     }
+    return false;
   }
-}
-class ShareSheet extends React.Component {
-  componentDidMount() {
-    BackHandler.addEventListener('hardwareBackPress',() => {
-      if (this.props.visible) {
-        this.props.onCancel();
-        return true;
-      }
-      return false;
-    });
-  }
-  render(){
+  render() {
     return (
       <Overlay visible={this.props.visible} {...this.props}>
         <View style={styles.actionSheetContainer}>
-          <TouchableOpacity
-              style={{flex:1}}
-              onPress={this.props.onCancel}>
-          </TouchableOpacity>
+          <TouchableOpacity style={{ flex: 1 }} onPress={this.props.onCancel} />
           <Sheet visible={this.props.visible}>
-            <View style={styles.buttonContainer}>
-              {this.props.children}
-            </View>
+            <View style={styles.buttonContainer}>{this.props.children}</View>
           </Sheet>
         </View>
       </Overlay>
-    )
+    );
   }
 }
 
+type Options = {
+  url: string,
+  urls?: Array<string>,
+  type?: string,
+  message?: string,
+  title?: string,
+  subject?: string,
+  excludedActivityTypes?: string,
+  failOnCancel?: boolean,
+  showAppsToView?: boolean,
+};
+type MultipleOptions = {
+  url?: string,
+  urls: Array<string>,
+  type?: string,
+  message?: string,
+  title?: string,
+  subject?: string,
+  excludedActivityTypes?: string,
+  failOnCancel?: boolean,
+  showAppsToView?: boolean,
+};
 
+type OpenReturn = { app?: string, dismissedAction?: boolean };
+type ShareSingleReturn = { message: string };
+
+const requireAndAskPermissions = async (options: Options | MultipleOptions): Promise<any> => {
+  if ((options.url || options.urls) && Platform.OS === 'android') {
+    const urls: Array<string> = options.urls || [options.url];
+    try {
+      const resultArr = await Promise.all(
+        urls.map(
+          url =>
+            new Promise((res, rej) => {
+              NativeModules.RNShare.isBase64File(
+                url,
+                e => {
+                  rej(e);
+                },
+                isBase64 => {
+                  res(isBase64);
+                },
+              );
+            }),
+        ),
+      );
+
+      const requirePermission = resultArr.includes(true);
+      if (!requirePermission) {
+        return Promise.resolve(true);
+      }
+      const hasPermission = await PermissionsAndroid.check(
+        PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE,
+      );
+      if (hasPermission) {
+        return Promise.resolve(true);
+      }
+      const result = await PermissionsAndroid.request(
+        PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE,
+      );
+      if (result === PermissionsAndroid.RESULTS.GRANTED) {
+        return Promise.resolve();
+      }
+      throw new Error('Write Permission not available');
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  }
+  return Promise.resolve(true);
+};
+
+class RNShare {
+  static Button: any;
+  static ShareSheet: React.createElement;
+  static Overlay: any;
+  static Sheet: any;
+  static Social = {
+    FACEBOOK: NativeModules.RNShare.FACEBOOK || 'facebook',
+    PAGESMANAGER: NativeModules.RNShare.PAGESMANAGER || 'pagesmanager',
+    TWITTER: NativeModules.RNShare.TWITTER || 'twitter',
+    WHATSAPP: NativeModules.RNShare.WHATSAPP || 'whatsapp',
+    INSTAGRAM: NativeModules.RNShare.INSTAGRAM || 'instagram',
+    GOOGLEPLUS: NativeModules.RNShare.GOOGLEPLUS || 'googleplus',
+    EMAIL: NativeModules.RNShare.EMAIL || 'email',
+  };
+
+  static open(options: Options | MultipleOptions): Promise<OpenReturn> {
+    return new Promise((resolve, reject) => {
+      requireAndAskPermissions(options)
+        .then(() => {
+          if (Platform.OS === 'ios') {
+            if (options.urls) {
+              // Handle for multiple file share
+              NativeModules.RNShare.open(
+                options,
+                error => {
+                  return reject({ error: error });
+                },
+                (success, activityType) => {
+                  if (success) {
+                    return resolve({
+                      app: activityType,
+                    });
+                  } else if (options.failOnCancel === false) {
+                    return resolve({
+                      dismissedAction: true,
+                    });
+                  } else {
+                    reject({ error: 'User did not share' });
+                  }
+                },
+              );
+            } else {
+              // Handle for single file share
+              ActionSheetIOS.showShareActionSheetWithOptions(
+                options,
+                error => {
+                  return reject({ error: error });
+                },
+                (success, activityType) => {
+                  if (success) {
+                    return resolve({
+                      app: activityType,
+                    });
+                  } else if (options.failOnCancel === false) {
+                    return resolve({
+                      dismissedAction: true,
+                    });
+                  } else {
+                    reject({ error: 'User did not share' });
+                  }
+                },
+              );
+            }
+          } else {
+            NativeModules.RNShare.open(
+              options,
+              e => {
+                return reject({ error: e });
+              },
+              e => {
+                resolve({
+                  message: e,
+                });
+              },
+            );
+          }
+        })
+        .catch(e => reject(e));
+    });
+  }
+
+  static shareSingle(options: Options): Promise<ShareSingleReturn> {
+    if (Platform.OS === 'ios' || Platform.OS === 'android') {
+      return new Promise((resolve, reject) => {
+        requireAndAskPermissions(options)
+          .then(() => {
+            NativeModules.RNShare.shareSingle(
+              options,
+              e => {
+                return reject({ error: e });
+              },
+              e => {
+                return resolve({
+                  message: e,
+                });
+              },
+            );
+          })
+          .catch(e => reject(e));
+      });
+    } else {
+      throw new Error('Not implemented');
+    }
+  }
+}
+
 module.exports = RNShare;
@@ -108,0 +254,0 @@ module.exports.Overlay = Overlay;

package.json

 {
   "name": "react-native-share",
-  "description": "Social Share, Sending Simple Data to Other Apps",
-  "version": "1.0.27",
+  "description": "Social share, sending simple data to other apps.",
+  "version": "1.1.0",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/EstebanFuentealba/react-native-share.git"
+    "url": "git+https://github.com/react-native-community/react-native-share.git"
   },
-  "keywords": ["react-component", "react-native", "android", "ios", "windows"],
+  "devDependencies": {
+    "@commitlint/cli": "^6.1.0",
+    "@commitlint/config-conventional": "^6.1.0",
+    "babel-eslint": "^8.2.1",
+    "eslint": "^4.17.0",
+    "eslint-plugin-flowtype": "^2.46.2",
+    "eslint-plugin-import": "^2.11.0",
+    "eslint-plugin-react": "^7.6.1",
+    "eslint-plugin-react-native": "^3.2.0",
+    "flow-bin": "^0.77.0",
+    "generate-changelog": "1.7.0",
+    "husky": "^0.14.3",
+    "idx": "^2.4.0",
+    "lint-staged": "^7.0.0",
+    "minimist": "1.2.0",
+    "pre-commit": "^1.2.2",
+    "prettier": "^1.12.0",
+    "react": "16.3.1",
+    "react-native": "0.55.2",
+    "simple-git": "1.89.0"
+  },
+  "keywords": [
+    "react-native",
+    "android",
+    "ios",
+    "windows",
+    "bridge",
+    "react",
+    "share"
+  ],
   "nativePackage": true,
@@ -15,4 +44,23 @@ "author": {
   },
+  "homepage": "https://github.com/react-native-community/react-native-share",
   "license": "MIT",
-  "readmeFilename": "README.md"
+  "lint-staged": {
+    "*.js": [
+      "yarn prettier",
+      "eslint --fix",
+      "git add"
+    ]
+  },
+  "pre-commit": "lint:staged",
+  "readmeFilename": "README.md",
+  "scripts": {
+    "commitmsg": "commitlint -e $GIT_PARAMS",
+    "lint": "eslint src --max-warnings=0",
+    "lint:staged": "lint-staged",
+    "prettier": "prettier --write --single-quote true --trailing-comma all --print-width 100",
+    "release:major": "node ./changelog --major && npm version major && git push origin && git push origin --follow-tags",
+    "release:minor": "node ./changelog --minor && npm version minor && git push origin && git push origin --follow-tags",
+    "release:patch": "node ./changelog --patch && npm version patch && git push origin && git push origin --follow-tags",
+    "release:version": "node ./changelog --version $VERSION && git push origin && git push origin --follow-tags"
+  }
 }

README.md

@@ -1,2 +0,2 @@
-# react-native-share [![npm version](https://badge.fury.io/js/react-native-share.svg)](http://badge.fury.io/js/react-native-share)
+# react-native-share [![CircleCI](https://circleci.com/gh/react-native-community/react-native-share/tree/master.svg?style=svg&circle-token=0c6860240abba4e16bd07df0ea805a72b67b8d41)](https://circleci.com/gh/react-native-community/react-native-share/tree/master) [![npm version](https://badge.fury.io/js/react-native-share.svg)](http://badge.fury.io/js/react-native-share)
 Share Social , Sending Simple Data to Other Apps
@@ -14,4 +14,13 @@
 
-#### iOS
+`npm install react-native-share --save`
 
+- [iOS](https://github.com/react-native-community/react-native-share#iOS-Install)
+
+- [Android](https://github.com/react-native-community/react-native-share#Android-Install)
+
+- [Windows](https://github.com/react-native-community/react-native-share#Windows-Install)
+
+
+#### iOS Install
+
 1. `npm install react-native-share --save`
@@ -33,3 +42,3 @@ 2. In XCode, in the project navigator, right click `Libraries` ➜ `Add Files to [your project's name]`
 
-#### Android
+#### Android Install
 
@@ -107,5 +116,5 @@ 1. `npm install react-native-share --save`
     ```
-
-
-#### Windows
+  
+#### Windows Install
+    
 [Read it! :D](https://github.com/ReactWindows/react-native)
@@ -129,3 +138,5 @@
 ```javascript
-Share.open(options).catch((err) => { err && console.log(err); })
+  Share.open(options)
+    .then((res) => { console.log(res) })
+    .catch((err) => { err && console.log(err); });
 ```
@@ -138,2 +149,3 @@
 | url | string   | URL you want to share (you can share a base64 file url only in iOS & Android ) |
+| urls | Array[string]   | URL's you want to share, Only for iOS and Android (you can share a base64 file url only in iOS & Android ) |
 | type | string   | File mime type (optional) |
@@ -144,2 +156,4 @@ | message | string   |  |
 | excludedActivityTypes | string   | (optional) |
+| failOnCancel | boolean | (defaults to true) On iOS, specifies whether promise should reject if user cancels share dialog (optional) |
+| showAppsToView | boolean | (optional) only android|
 
@@ -161,7 +175,30 @@ #### shareSingle(options) (in iOS & Android)
 | subject | string   | (optional) |
-| social | string   | supported social apps: twitter, facebook, whatsapp, googleplus, email |
+| social | string   | supported social apps: [List](#static-values-for-social)  |
 
 ***NOTE: If both `message` and `url` are provided `url` will be concatenated to the end of `message` to form the body of the message. If only one is provided it will be used***
 
+### Static Values for social
 
+These can be assessed using Share.Social property  
+For eg.
+```javascript
+import Share from 'react-native-share';
+
+const shareOptions = {
+    title: 'Share via',
+    url: 'some share url',
+    social: Share.Social.WHATSAPP
+};
+Share.shareSingle(shareOptions);
+```
+
+| Name  | Android     | iOS | Windows |
+| :---- | :------: | :--- | :---
+| **FACEBOOK** | yes   | yes | no |
+| **PAGESMANAGER** | yes   | no | no |
+| **WHATSAPP** | yes   | yes | no |
+| **INSTAGRAM** | yes   | yes | no |
+| **GOOGLEPLUS** | yes   | yes | no |
+| **EMAIL** | yes   | yes | no |
+
 ## how it looks:
@@ -397,1 +434,65 @@
 ```
+
+### Troubleshooting
+
+#### Share Remote PDF File with Gmail & WhatsApp (iOS)
+
+When sharing a pdf file with base64, there are two current problems.
+
+1. On WhatsApp base64 wont be recognized => nothing to share
+2. In the GmailApp the file extension is wrong (.dat). 
+
+Therefore we use this "workaround" in order to handle pdf sharing for iOS Apps to mentioned Apps
+
+1. Install react-native-fetch-blob
+2. Set a specific path in the RNFetchBlob configurations
+3. Download the PDF file to temp device storage
+4. Share the response's path() of the donwloaded file directly
+
+Code: 
+
+```
+static sharePDFWithIOS(fileUrl, type) {
+  let filePath = null;
+  let file_url_length = fileUrl.length;
+  const configOptions = {
+    fileCache: true,
+    path:
+      DIRS.DocumentDir + (type === 'application/pdf' ? '/SomeFileName.pdf' : '/SomeFileName.png') // no difference when using jpeg / jpg / png /
+  };
+  RNFetchBlob.config(configOptions)
+    .fetch('GET', fileUrl)
+    .then(async resp => {
+      filePath = resp.path();
+      let options = {
+        type: type,
+        url: filePath // (Platform.OS === 'android' ? 'file://' + filePath)
+      };
+      await Share.open(options);
+      // remove the image or pdf from device's storage
+      await RNFS.unlink(filePath);
+    });
+}
+```
+
+Nothing to do on Android. You can share the pdf file with base64
+
+```
+static sharePDFWithAndroid(fileUrl, type) {
+  let filePath = null;
+  let file_url_length = fileUrl.length;
+  const configOptions = { fileCache: true };
+  RNFetchBlob.config(configOptions)
+    .fetch('GET', fileUrl)
+    .then(resp => {
+      filePath = resp.path();
+      return resp.readFile('base64');
+    })
+    .then(async base64Data => {
+      base64Data = `data:${type};base64,` + base64Data;
+      await Share.open({ url: base64Data });
+      // remove the image or pdf from device's storage
+      await RNFS.unlink(filePath);
+    });
+}
+```

windows/RNShare/project.json

@@ -0,0 +0,0 @@ {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Native code

Supply chain risk

Contains native code (e.g., compiled binaries or shared libraries). Including native code can obscure malicious behavior.

Found 19 instances in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Filesystem access

Supply chain risk

Accesses the file system, and could potentially read sensitive data.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No website

Quality

Package does not have a website.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

7649562

increased by719.34%

Number of package files

368

increased by607.69%

Lines of code

403

increased by75.98%

Number of low quality alerts

0

decreased by-100%

Number of lines in readme file

491

increased by25.9%

Worsened metrics

Dev dependency count

19

increased byInfinity%

Number of low supply chain risk alerts

1

increased byInfinity%

Number of medium supply chain risk alerts

21

increased byInfinity%

No dependency changes