feat: Implement Facebook stories share (#761)

* feat: Implement Facebook stories share

* Update index.js

Co-Authored-By: Mateus Andrade <mateus.andrade47@outlook.com>

* Update README.md

Co-Authored-By: Mateus Andrade <mateus.andrade47@outlook.com>

* Update README.md

Co-Authored-By: Mateus Andrade <mateus.andrade47@outlook.com>

Co-authored-by: Mateus Andrade <mateus.andrade47@outlook.com>

README.md

@@ -17,12 +17,12 @@ This gives you the power to prioritize our work and support the project contribu
 
 ## Automatic Way
 ---
-``` 
+```
 yarn add react-native-share
 ```
 
 or if you're using npm
-``` 
+```
 npm install react-native-share --save
 ```
 ---
@@ -35,7 +35,7 @@ npm install react-native-share --save
 #### Important:
 Linking is not needed anymore. ``react-native@0.60.0+`` supports dependencies auto linking.
 For iOS you also need additional step to install auto linked Pods (Cocoapods should be installed):
-``` 
+```
 cd ios && pod install && cd ../
 ```
 ___
@@ -47,28 +47,28 @@ After installing jetifier, runs a ```npx jetify -r``` and test if this works by
 ## Automatic Way
 
 ---
-``` 
+```
 yarn add react-native-share
 react-native link react-native-share # not needed for react-native >= 0.60.0
 ```
 
 or if you're using npm
-``` 
+```
 npm install react-native-share --save
 react-native link react-native-share # not needed for react-native >= 0.60.0
 ```
 ---
 
-We recommend using the releases from npm, however you can use the master branch if you need any feature that is not available on NPM. By doing this you will be able to use unreleased features, but the module may be less stable. 
-**yarn**: 
-``` 
+We recommend using the releases from npm, however you can use the master branch if you need any feature that is not available on NPM. By doing this you will be able to use unreleased features, but the module may be less stable.
+**yarn**:
+```
 yarn add react-native-share@git+https://git@github.com/react-native-community/react-native-share.git
 ```
 ---
 
 #### LSApplicationQueriesSchemes on iOS
 Remember to add `instagram`, `facebook` or whatever queries schemes you need to LSApplicationQueriesSchemes
-field in your Info.plist. This is required to share content directly to other apps like Instagram, Facebook etc.  
+field in your Info.plist. This is required to share content directly to other apps like Instagram, Facebook etc.
 Values for queries schemes can be found in `Social` field of `RNShare` class.
 
 
@@ -84,7 +84,7 @@ Values for queries schemes can be found in `Social` field of `RNShare` class.
 4. In XCode, in the project navigator, select your project. Add `libRNShare.a` to your project's `Build Phases` ➜ `Link Binary With Libraries`
 5. In XCode, in the project navigator, select your project. Add `Social.framework` and `MessageUI.framework` to your project's `General` ➜ `Linked Frameworks and Libraries`
 6. In iOS 9 or higher, you should add app list that you will share.
-If you want to share Whatsapp and Mailto, you should write `LSApplicationQueriesSchemes` in info.plist  
+If you want to share Whatsapp and Mailto, you should write `LSApplicationQueriesSchemes` in info.plist
     ```xml
     <key>LSApplicationQueriesSchemes</key>
     <array>
@@ -111,7 +111,7 @@ You just need to add to your Podfile the react-native-share dependency.
   pod 'RNShare', :path => '../node_modules/react-native-share'
 ```
 
-After that, just run a `pod install` or `pod udpate` to get up and running with react-native-share. 
+After that, just run a `pod install` or `pod udpate` to get up and running with react-native-share.
 
 Then run a `react-native link react-native-share`, and doing the steps 6 and 7.
 
@@ -351,7 +351,7 @@ Supported options:
 
 ---
 ### isPackageInstalled(<app>) (in Android)
-It's a method that checks if an app (package) is installed on Android. 
+It's a method that checks if an app (package) is installed on Android.
 It returns a promise with `isInstalled`. e.g.
 
 Checking if Instagram is installed on Android.
@@ -376,14 +376,15 @@ const shareOptions = {
     url: 'some share url',
     social: Share.Social.WHATSAPP,
     whatsAppNumber: "9199999999",  // country code + phone number
-    filename: 'test' , // only for base64 file in Android 
+    filename: 'test' , // only for base64 file in Android
 };
 Share.shareSingle(shareOptions);
 ```
 
 | Name  | Android     | iOS | Windows |
 | :---- | :------: | :--- | :---
 | **FACEBOOK** | yes   | yes | no |
+| **FACEBOOK_STORIES** | no   | yes | no |
 | **PAGESMANAGER** | yes   | no | no |
 | **WHATSAPP** | yes   | yes | no |
 | **INSTAGRAM** | yes   | yes | no |
@@ -526,10 +527,49 @@ Supported options for INSTAGRAM_STORIES:
 | **SHARE_STICKER_IMAGE** | stickerImage   |
 | **SHARE_BACKGROUND_AND_STICKER_IMAGE** | backgroundImage, stickerImage   |
 
+### Static Values for Facebook Stories
+These can be assessed using Share.Social property
+For eg.
+```javascript
+import Share from 'react-native-share';
+
+const shareOptions = {
+    method: Share.FacebookStories.SHARE_BACKGROUND_AND_STICKER_IMAGE,
+    backgroundImage: 'http://urlto.png', // url or an base64 string
+    stickerImage: 'data:image/png;base64,<imageInBase64>', //or you can use "data:" url
+    backgroundBottomColor: '#fefefe',
+    backgroundTopColor: '#906df4',
+    attributionURL: 'http://deep-link-to-app', //in beta
+    appId: '219376304', //facebook appId
+    social: Share.Social.FACEBOOK_STORIES
+};
+Share.shareSingle(shareOptions);
+```
+
+Supported options for FACEBOOK_STORIES:
+
+| Name  | Type     | Description |
+| :---- | :------: | :--- |
+| appId | string   | (required) facebook appId |
+| backgroundImage | string   | URL you want to share |
+| stickerImage | string   | URL you want to share |
+| method | string   | [List](#instagram-stories-method-list) |
+| backgroundBottomColor | string   |  (optional) default #837DF4 |
+| backgroundTopColor | string   | (optional) default #906df4 |
+| attributionURL | string   | (optional) facebook beta-test |
+
+### Facebook stories method list
+| Name  | Required options    |
+| :---- | :------: |
+| **SHARE_BACKGROUND_IMAGE** | backgroundImage   |
+| **SHARE_STICKER_IMAGE** | stickerImage   |
+| **SHARE_BACKGROUND_AND_STICKER_IMAGE** | backgroundImage, stickerImage   |
+
+
 #### Adding your implementation of FileProvider
 
 [Android guide](https://developer.android.com/training/secure-file-sharing/setup-sharing.html).
-   
+
 - `applicationId` should be defined in the `defaultConfig` section in your `android/app/build.gradle`:
 
 - File: `android/app/build.gradle`
@@ -540,7 +580,7 @@ Supported options for INSTAGRAM_STORIES:
         ...
     }
     ```
-    
+
 - Add this `<provider>` section to your `AndroidManifest.xml`
 
     File: `AndroidManifest.xml`
@@ -559,10 +599,10 @@ Supported options for INSTAGRAM_STORIES:
     ```
 
 - Create a `filepaths.xml` under this directory:
-`android/app/src/main/res/xml`. 
+`android/app/src/main/res/xml`.
 
     In this file, add the following contents:
-    
+
     File: `android/app/src/main/res/xml/filepaths.xml`
     ```xml
     <?xml version="1.0" encoding="utf-8"?>
@@ -578,7 +618,7 @@ Supported options for INSTAGRAM_STORIES:
     ```java
     import cl.json.ShareApplication
     public class MainApplication extends Application implements ShareApplication, ReactApplication {
-    
+
          @Override
          public String getFileProviderAuthority() {
                 return BuildConfig.APPLICATION_ID + ".provider";

index.js

@@ -92,6 +92,7 @@ type Options = {
   failOnCancel?: boolean,
   showAppsToView?: boolean,
   saveToFiles?: boolean,
+  appId: string,
 };
 type MultipleOptions = {
   url?: string,
@@ -201,6 +202,7 @@ class RNShare {
   static Sheet: any;
   static Social = {
     FACEBOOK: NativeModules.RNShare.FACEBOOK || 'facebook',
+    FACEBOOK_STORIES: NativeModules.RNShare.FACEBOOK_STORIES || 'facebook-stories',
     PAGESMANAGER: NativeModules.RNShare.PAGESMANAGER || 'pagesmanager',
     TWITTER: NativeModules.RNShare.TWITTER || 'twitter',
     WHATSAPP: NativeModules.RNShare.WHATSAPP || 'whatsapp',
@@ -219,6 +221,13 @@ class RNShare {
       NativeModules.RNShare.SHARE_BACKGROUND_AND_STICKER_IMAGE || 'shareBackgroundAndStickerImage',
   };
 
+  static FacebookStories = {
+    SHARE_BACKGROUND_IMAGE: NativeModules.RNShare.SHARE_BACKGROUND_IMAGE || 'shareBackgroundImage',
+    SHARE_STICKER_IMAGE: NativeModules.RNShare.SHARE_STICKER_IMAGE || 'shareStickerImage',
+    SHARE_BACKGROUND_AND_STICKER_IMAGE:
+      NativeModules.RNShare.SHARE_BACKGROUND_AND_STICKER_IMAGE || 'shareBackgroundAndStickerImage',
+  };
+
   static open(options: Options | MultipleOptions): Promise<OpenReturn> {
     return new Promise((resolve, reject) => {
       requireAndAskPermissions(options)

ios/FacebookStories.h

@@ -0,0 +1,54 @@
+//
+//  FacebookStories.h
+//  RNShare
+//
+//  Created by Quynh Nguyen on 4/13/20.
+//  Link: https://github.com/Quynh-Nguyen
+//  Copyright © 2020 Facebook. All rights reserved.
+//
+
+#import <UIKit/UIKit.h>
+// import RCTConvert
+#if __has_include(<React/RCTConvert.h>)
+#import <React/RCTConvert.h>
+#elif __has_include("RCTConvert.h")
+#import "RCTConvert.h"
+#else
+#import "React/RCTConvert.h"   // Required when used as a Pod in a Swift project
+#endif
+// import RCTBridge
+#if __has_include(<React/RCTBridge.h>)
+#import <React/RCTBridge.h>
+#elif __has_include("RCTBridge.h")
+#import "RCTBridge.h"
+#else
+#import "React/RCTBridge.h"   // Required when used as a Pod in a Swift project
+#endif
+// import RCTUIManager
+#if __has_include(<React/RCTUIManager.h>)
+#import <React/RCTUIManager.h>
+#elif __has_include("RCTUIManager.h")
+#import "RCTUIManager.h"
+#else
+#import "React/RCTUIManager.h"   // Required when used as a Pod in a Swift project
+#endif
+// import RCTLog
+#if __has_include(<React/RCTLog.h>)
+#import <React/RCTLog.h>
+#elif __has_include("RCTLog.h")
+#import "RCTLog.h"
+#else
+#import "React/RCTLog.h"   // Required when used as a Pod in a Swift project
+#endif
+// import RCTUtils
+#if __has_include(<React/RCTUtils.h>)
+#import <React/RCTUtils.h>
+#elif __has_include("RCTUtils.h")
+#import "RCTUtils.h"
+#else
+#import "React/RCTUtils.h"   // Required when used as a Pod in a Swift project
+#endif
+@interface FacebookStories : NSObject <RCTBridgeModule>
+
+- (void *) shareSingle:(NSDictionary *)options failureCallback:(RCTResponseErrorBlock)failureCallback successCallback:(RCTResponseSenderBlock)successCallback;
+@end