Merge pull request #1521 from wordpress-mobile/release/1.16.0

Prepare Release 1.16.0

RELEASE-NOTES.txt

@@ -1,3 +1,8 @@
+1.16.0
+------
+* [Android] Add support for pexels images
+* Add left, center, and right image alignment controls
+
 1.15.2
 ------
 * Fix issue when copy/paste photos from other apps, was not inserting an image on the post.

android/app/src/main/java/com/gutenberg/MainApplication.java

@@ -37,7 +37,7 @@ public void responseHtml(String title, String html, boolean changed) {
             }
 
             @Override
-            public void requestMediaImport(String url, MediaSelectedCallback mediaSelectedCallback) {
+            public void requestMediaImport(String url, MediaUploadCallback mediaUploadCallback) {
             }
 
             @Override
@@ -49,7 +49,7 @@ public void requestMediaPickFromDeviceLibrary(MediaUploadCallback mediaUploadCal
             }
 
             @Override
-            public void requestMediaPickFromMediaLibrary(MediaSelectedCallback mediaSelectedCallback, Boolean allowMultipleSelection, MediaType mediaType) {
+            public void requestMediaPickFromMediaLibrary(MediaUploadCallback mediaUploadCallback, Boolean allowMultipleSelection, MediaType mediaType) {
             }
 
 
@@ -77,6 +77,16 @@ public void editorDidMount(ReadableArray unsupportedBlockNames) {
             public void editorDidAutosave() {
             }
 
+            @Override
+            public void getOtherMediaPickerOptions(OtherMediaOptionsReceivedCallback otherMediaOptionsReceivedCallback, MediaType mediaType) {
+
+            }
+
+            @Override
+            public void requestMediaPickFrom(String mediaSource, MediaUploadCallback mediaUploadCallback, Boolean allowMultipleSelection) {
+
+            }
+
             @Override
             public void editorDidEmitLog(String message, LogLevel logLevel) {
                 switch (logLevel) {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "gutenberg-mobile",
-  "version": "1.15.2",
+  "version": "1.16.0",
   "private": true,
   "config": {
     "jsfiles": "./*.js src/*.js src/**/*.js src/**/**/*.js",
@@ -65,12 +65,14 @@
     "start:inside-gb:debug": "node --inspect-brk node_modules/.bin/react-native start:inside-gb",
     "patch-metro-no-file-watch": "cp node_modules/metro/src/node-haste/DependencyGraph.js ./ && cp DependencyGraph.js.patched node_modules/metro/src/node-haste/DependencyGraph.js",
     "un-patch-metro-no-file-watch": "cp ./DependencyGraph.js node_modules/metro/src/node-haste/DependencyGraph.js",
+    "prebundle": "yarn i18n-cache:force",
     "prebundle:android": "yarn patch-metro-no-file-watch",
     "postbundle:android": "yarn un-patch-metro-no-file-watch",
     "bundle": "yarn bundle:android && yarn bundle:ios",
     "bundle:android": "mkdir -p bundle/android && react-native bundle --platform android --dev false --entry-file index.js --assets-dest bundle/android --bundle-output bundle/android/App.js --sourcemap-output bundle/android/App.js.map",
     "bundle:ios": "mkdir -p bundle/ios && react-native bundle --platform ios --dev false --entry-file index.js --assets-dest bundle/ios --bundle-output bundle/ios/App.js --sourcemap-output bundle/ios/App.js.map",
     "i18n-cache": "node i18n-cache/index.js",
+    "i18n-cache:force": "cross-env REFRESH_I18N_CACHE=1 node i18n-cache/index.js",
     "postinstall": "yarn i18n-cache",
     "install:wpcli": "(test -x bin/wp-cli.phar || curl -Ls https://raw.githubusercontent.com/wp-cli/builds/gh-pages/phar/wp-cli.phar -o bin/wp-cli.phar && chmod +x bin/wp-cli.phar) && bin/wp-cli.phar --info",
     "prewp": "yarn install:wpcli",

react-native-gutenberg-bridge/android/build.gradle

@@ -117,6 +117,9 @@ dependencies {
     implementation "org.webkit:android-jsc:r241213"
     implementation project(':react-native-aztec')
 
+    // For animated GIF support
+    implementation 'com.facebook.fresco:animated-gif:2.0.0'
+
     if (rootProject.ext.buildGutenbergFromSource) {
         println "using gutenberg from source"
         implementation project(':react-native-svg')

react-native-gutenberg-bridge/android/src/main/java/org/wordpress/mobile/ReactNativeGutenbergBridge/GutenbergBridgeJS2Parent.java

@@ -3,6 +3,9 @@
 import com.facebook.react.bridge.ReadableArray;
 import com.facebook.react.bridge.WritableMap;
 
+import org.wordpress.mobile.WPAndroidGlue.MediaOption;
+
+import java.util.ArrayList;
 import java.util.List;
 
 public interface GutenbergBridgeJS2Parent {
@@ -17,8 +20,8 @@ interface RNMedia {
 
     void editorDidMount(ReadableArray unsupportedBlockNames);
 
-    interface MediaSelectedCallback {
-        void onMediaSelected(List<RNMedia> mediaList);
+    interface OtherMediaOptionsReceivedCallback {
+        void onOtherMediaOptionsReceived(ArrayList<MediaOption> mediaList);
     }
 
     interface MediaUploadCallback {
@@ -76,13 +79,13 @@ public static MediaType getEnum(String value) {
         }
     }
 
-    void requestMediaPickFromMediaLibrary(MediaSelectedCallback mediaSelectedCallback, Boolean allowMultipleSelection, MediaType mediaType);
+    void requestMediaPickFromMediaLibrary(MediaUploadCallback mediaUploadCallback, Boolean allowMultipleSelection, MediaType mediaType);
 
     void requestMediaPickFromDeviceLibrary(MediaUploadCallback mediaUploadCallback, Boolean allowMultipleSelection, MediaType mediaType);
 
     void requestMediaPickerFromDeviceCamera(MediaUploadCallback mediaUploadCallback, MediaType mediaType);
 
-    void requestMediaImport(String url, MediaSelectedCallback mediaSelectedCallback);
+    void requestMediaImport(String url, MediaUploadCallback mediaUploadCallback);
 
     void mediaUploadSync(MediaUploadCallback mediaUploadCallback);
 
@@ -95,4 +98,8 @@ public static MediaType getEnum(String value) {
     void editorDidEmitLog(String message, LogLevel logLevel);
 
     void editorDidAutosave();
+
+    void getOtherMediaPickerOptions(OtherMediaOptionsReceivedCallback otherMediaOptionsReceivedCallback, MediaType mediaType);
+
+    void requestMediaPickFrom(String mediaSource, MediaUploadCallback mediaUploadCallback, Boolean allowMultipleSelection);
 }

react-native-gutenberg-bridge/android/src/main/java/org/wordpress/mobile/ReactNativeGutenbergBridge/RNReactNativeGutenbergBridgeModule.java

@@ -13,10 +13,12 @@
 import com.facebook.react.bridge.WritableNativeMap;
 import com.facebook.react.modules.core.DeviceEventManagerModule;
 
-import org.wordpress.mobile.ReactNativeGutenbergBridge.GutenbergBridgeJS2Parent.MediaSelectedCallback;
 import org.wordpress.mobile.ReactNativeGutenbergBridge.GutenbergBridgeJS2Parent.MediaType;
+import org.wordpress.mobile.ReactNativeGutenbergBridge.GutenbergBridgeJS2Parent.OtherMediaOptionsReceivedCallback;
 import org.wordpress.mobile.ReactNativeGutenbergBridge.GutenbergBridgeJS2Parent.RNMedia;
+import org.wordpress.mobile.WPAndroidGlue.MediaOption;
 
+import java.util.ArrayList;
 import java.util.List;
 
 public class RNReactNativeGutenbergBridgeModule extends ReactContextBaseJavaModule {
@@ -110,14 +112,19 @@ public void editorDidMount(ReadableArray unsupportedBlockNames) {
     public void requestMediaPickFrom(String mediaSource, ReadableArray filter, Boolean allowMultipleSelection, final Callback onUploadMediaSelected) {
         MediaType mediaType = getMediaTypeFromFilter(filter);
         if (mediaSource.equals(MEDIA_SOURCE_MEDIA_LIBRARY)) {
-            mGutenbergBridgeJS2Parent.requestMediaPickFromMediaLibrary(getNewMediaSelectedCallback(allowMultipleSelection, onUploadMediaSelected), allowMultipleSelection, mediaType);
+            mGutenbergBridgeJS2Parent.requestMediaPickFromMediaLibrary(getNewUploadMediaCallback(allowMultipleSelection, onUploadMediaSelected), allowMultipleSelection, mediaType);
         } else if (mediaSource.equals(MEDIA_SOURCE_DEVICE_LIBRARY)) {
             mGutenbergBridgeJS2Parent.requestMediaPickFromDeviceLibrary(getNewUploadMediaCallback(allowMultipleSelection, onUploadMediaSelected), allowMultipleSelection, mediaType);
         } else if (mediaSource.equals(MEDIA_SOURCE_DEVICE_CAMERA)) {
             mGutenbergBridgeJS2Parent.requestMediaPickerFromDeviceCamera(getNewUploadMediaCallback(false, onUploadMediaSelected), mediaType);
         }
     }
 
+    @ReactMethod
+    public void requestOtherMediaPickFrom(String mediaSource, Boolean allowMultipleSelection, final Callback onUploadMediaSelected) {
+        mGutenbergBridgeJS2Parent.requestMediaPickFrom(mediaSource, getNewUploadMediaCallback(allowMultipleSelection, onUploadMediaSelected), allowMultipleSelection);
+    }
+
     private MediaType getMediaTypeFromFilter(ReadableArray filter) {
         switch (filter.size()) {
             case 1:
@@ -137,7 +144,7 @@ private MediaType getMediaTypeFromFilter(ReadableArray filter) {
 
     @ReactMethod
     public void requestMediaImport(String url, final Callback onUploadMediaSelected) {
-        mGutenbergBridgeJS2Parent.requestMediaImport(url, getNewMediaSelectedCallback(false, onUploadMediaSelected));
+        mGutenbergBridgeJS2Parent.requestMediaImport(url, getNewUploadMediaCallback(false, onUploadMediaSelected));
     }
 
     @ReactMethod
@@ -170,18 +177,21 @@ public void editorDidAutosave() {
         mGutenbergBridgeJS2Parent.editorDidAutosave();
     }
 
-    private MediaSelectedCallback getNewMediaSelectedCallback(final Boolean allowMultipleSelection, final Callback jsCallback) {
-        return new MediaSelectedCallback() {
-            @Override public void onMediaSelected(List<RNMedia> mediaList) {
-                if(allowMultipleSelection) {
-                    WritableArray writableArray = new WritableNativeArray();
-                    for (RNMedia media : mediaList) {
-                        writableArray.pushMap(media.toMap());
-                    }
-                    jsCallback.invoke(writableArray);
-                } else {
-                    jsCallback.invoke(mediaList.get(0).toMap());
+    @ReactMethod
+    public void getOtherMediaOptions(ReadableArray filter, final Callback jsCallback) {
+        OtherMediaOptionsReceivedCallback otherMediaOptionsReceivedCallback = getNewOtherMediaReceivedCallback(jsCallback);
+        MediaType mediaType = getMediaTypeFromFilter(filter);
+        mGutenbergBridgeJS2Parent.getOtherMediaPickerOptions(otherMediaOptionsReceivedCallback, mediaType);
+    }
+
+    private OtherMediaOptionsReceivedCallback getNewOtherMediaReceivedCallback(final Callback jsCallback) {
+        return new OtherMediaOptionsReceivedCallback() {
+            @Override public void onOtherMediaOptionsReceived(ArrayList<MediaOption> mediaOptions) {
+                WritableArray writableArray = new WritableNativeArray();
+                for (MediaOption mediaOption : mediaOptions) {
+                    writableArray.pushMap(mediaOption.toMap());
                 }
+                jsCallback.invoke(writableArray);
             }
         };
     }

react-native-gutenberg-bridge/android/src/main/java/org/wordpress/mobile/WPAndroidGlue/MediaOption.java

@@ -0,0 +1,33 @@
+package org.wordpress.mobile.WPAndroidGlue;
+
+import com.facebook.react.bridge.WritableMap;
+import com.facebook.react.bridge.WritableNativeMap;
+
+public class MediaOption {
+
+    private static final String KEY_VALUE = "value";
+    private static final String KEY_LABEL = "label";
+
+    private String mId;
+    private String mName;
+
+    public MediaOption(String id, String name) {
+        mId = id;
+        mName = name;
+    }
+
+    public String getId() {
+        return mId;
+    }
+
+    public String getName() {
+        return mName;
+    }
+
+    public WritableMap toMap() {
+        WritableMap map = new WritableNativeMap();
+        map.putString(KEY_VALUE, mId);
+        map.putString(KEY_LABEL, mName);
+        return map;
+    }
+}

react-native-gutenberg-bridge/android/src/main/java/org/wordpress/mobile/WPAndroidGlue/WPAndroidGlueCode.java

@@ -35,7 +35,6 @@
 import org.wordpress.android.util.AppLog;
 import org.wordpress.mobile.ReactNativeAztec.ReactAztecPackage;
 import org.wordpress.mobile.ReactNativeGutenbergBridge.GutenbergBridgeJS2Parent;
-import org.wordpress.mobile.ReactNativeGutenbergBridge.GutenbergBridgeJS2Parent.MediaSelectedCallback;
 import org.wordpress.mobile.ReactNativeGutenbergBridge.GutenbergBridgeJS2Parent.MediaUploadCallback;
 import org.wordpress.mobile.ReactNativeGutenbergBridge.GutenbergBridgeJS2Parent.RNMedia;
 import org.wordpress.mobile.ReactNativeGutenbergBridge.RNReactNativeGutenbergBridgePackage;
@@ -59,7 +58,6 @@ public class WPAndroidGlueCode {
     private ReactInstanceManager mReactInstanceManager;
     private ReactContext mReactContext;
     private RNReactNativeGutenbergBridgePackage mRnReactNativeGutenbergBridgePackage;
-    private MediaSelectedCallback mPendingMediaSelectedCallback;
     private MediaUploadCallback mPendingMediaUploadCallback;
     private boolean mMediaPickedByUserOnBlock;
 
@@ -116,6 +114,8 @@ public interface OnMediaLibraryButtonListener {
         void onRetryUploadForMediaClicked(int mediaId);
         void onCancelUploadForMediaClicked(int mediaId);
         void onCancelUploadForMediaDueToDeletedBlock(int mediaId);
+        ArrayList<MediaOption> onGetOtherMediaImageOptions();
+        void onOtherMediaButtonClicked(String mediaSource, boolean allowMultipleSelection);
     }
 
     public interface OnReattachQueryListener {
@@ -153,9 +153,9 @@ public void responseHtml(String title, String html, boolean changed) {
             }
 
             @Override
-            public void requestMediaPickFromMediaLibrary(MediaSelectedCallback mediaSelectedCallback, Boolean allowMultipleSelection, MediaType mediaType) {
+            public void requestMediaPickFromMediaLibrary(MediaUploadCallback mediaSelectedCallback, Boolean allowMultipleSelection, MediaType mediaType) {
                 mMediaPickedByUserOnBlock = true;
-                mPendingMediaSelectedCallback = mediaSelectedCallback;
+                mPendingMediaUploadCallback = mediaSelectedCallback;
                 if (mediaType == MediaType.IMAGE) {
                     mOnMediaLibraryButtonListener.onMediaLibraryImageButtonClicked(allowMultipleSelection);
                 } else if (mediaType == MediaType.VIDEO) {
@@ -190,7 +190,7 @@ public void requestMediaPickerFromDeviceCamera(MediaUploadCallback mediaUploadCa
             }
 
             @Override
-            public void requestMediaImport(String url, MediaSelectedCallback mediaSelectedCallback) {
+            public void requestMediaImport(String url, MediaUploadCallback mediaSelectedCallback) {
                 // no op - we don't need to paste images on Android, but the method needs to exist
                 // to match the iOS counterpart
             }
@@ -252,6 +252,26 @@ public void editorDidEmitLog(String message, LogLevel logLevel) {
                         break;
                 }
             }
+
+            @Override
+            public void getOtherMediaPickerOptions(OtherMediaOptionsReceivedCallback otherMediaOptionsReceivedCallback,
+                                                   MediaType mediaType) {
+                if (mediaType == MediaType.IMAGE || mediaType == MediaType.MEDIA) {
+                    ArrayList<MediaOption> otherMediaImageOptions = mOnMediaLibraryButtonListener.onGetOtherMediaImageOptions();
+                    otherMediaOptionsReceivedCallback.onOtherMediaOptionsReceived(otherMediaImageOptions);
+                } else {
+                    otherMediaOptionsReceivedCallback.onOtherMediaOptionsReceived(new ArrayList<MediaOption>());
+                }
+            }
+
+            @Override
+            public void requestMediaPickFrom(String mediaSource,
+                                                       MediaUploadCallback mediaSelectedCallback,
+                                                       Boolean allowMultipleSelection) {
+                mPendingMediaUploadCallback = mediaSelectedCallback;
+                mMediaPickedByUserOnBlock = true;
+                mOnMediaLibraryButtonListener.onOtherMediaButtonClicked(mediaSource, allowMultipleSelection);
+            }
         });
 
         return Arrays.asList(
@@ -522,21 +542,6 @@ private String getMediaType(final boolean isVideo) {
         return isVideo ? "video" : "image";
     }
 
-    public void appendMediaFile(int mediaId, final String mediaUrl, final boolean isVideo) {
-        if (mPendingMediaSelectedCallback != null && mMediaPickedByUserOnBlock) {
-            String mediaType = getMediaType(isVideo);
-            mMediaPickedByUserOnBlock = false;
-            List<RNMedia> mediaList = new ArrayList<>();
-            mediaList.add(new Media(mediaId, mediaUrl, mediaType));
-            mPendingMediaSelectedCallback.onMediaSelected(mediaList);
-            mPendingMediaSelectedCallback = null;
-        } else {
-            // we can assume we're being passed a new image from share intent as there was no selectMedia callback
-            sendOrDeferAppendMediaSignal(mediaId, mediaUrl, isVideo);
-        }
-    }
-
-
     public void toggleEditorMode(boolean htmlModeEnabled) {
         // Turn off hardware acceleration for Oreo
         // see https://github.com/wordpress-mobile/gutenberg-mobile/issues/1268#issuecomment-535887390
@@ -551,23 +556,6 @@ public void toggleEditorMode(boolean htmlModeEnabled) {
         mRnReactNativeGutenbergBridgePackage.getRNReactNativeGutenbergBridgeModule().toggleEditorMode();
     }
 
-    public void appendMediaFiles(ArrayList<Media> mediaList) {
-        if (mPendingMediaSelectedCallback != null && mMediaPickedByUserOnBlock) {
-            mMediaPickedByUserOnBlock = false;
-            List<RNMedia> rnMediaList = new ArrayList<>();
-            for (Media media : mediaList) {
-                rnMediaList.add(new Media(media.getId(), media.getUrl()));
-            }
-            mPendingMediaSelectedCallback.onMediaSelected(rnMediaList);
-            mPendingMediaSelectedCallback = null;
-        }
-    }
-
-
-    public void toggleEditorMode() {
-        mRnReactNativeGutenbergBridgePackage.getRNReactNativeGutenbergBridgeModule().toggleEditorMode();
-    }
-
     public void appendUploadMediaFile(final int mediaId, final String mediaUri, final boolean isVideo) {
        if (isMediaUploadCallbackRegistered() && mMediaPickedByUserOnBlock) {
            String mediaType = getMediaType(isVideo);

react-native-gutenberg-bridge/index.js

@@ -89,4 +89,12 @@ export function requestImageUploadCancel( mediaId ) {
 	return RNReactNativeGutenbergBridge.requestImageUploadCancel( mediaId );
 }
 
+export function getOtherMediaOptions( filter, callback ) {
+	return RNReactNativeGutenbergBridge.getOtherMediaOptions( filter, callback );
+}
+
+export function requestOtherMediaPickFrom( mediaSource, multiple, callback ) {
+	return RNReactNativeGutenbergBridge.requestOtherMediaPickFrom( mediaSource, multiple, callback );
+}
+
 export default RNReactNativeGutenbergBridge;

react-native-gutenberg-bridge/ios/RNReactNativeGutenbergBridge.m

@@ -4,6 +4,8 @@ @interface RCT_EXTERN_MODULE(RNReactNativeGutenbergBridge, NSObject)
 
 RCT_EXTERN_METHOD(provideToNative_Html:(NSString *)html title:(NSString *)title changed:(BOOL)changed)
 RCT_EXTERN_METHOD(requestMediaPickFrom:(NSString *)source filter:(NSArray<NSString *> *)filter allowMultipleSelection:(BOOL)allowMultipleSelection callback:(RCTResponseSenderBlock)callback)
+RCT_EXTERN_METHOD(requestOtherMediaPickFrom:(NSString *)source allowMultipleSelection:(BOOL)allowMultipleSelection callback:(RCTResponseSenderBlock)callback)
+RCT_EXTERN_METHOD(getOtherMediaOptions:(NSArray<NSString *> *)filter callback:(RCTResponseSenderBlock)callback)
 RCT_EXTERN_METHOD(mediaUploadSync)
 RCT_EXTERN_METHOD(requestImageFailedRetryDialog:(int)mediaID)
 RCT_EXTERN_METHOD(requestImageUploadCancelDialog:(int)mediaID)

react-native-gutenberg-bridge/ios/RNReactNativeGutenbergBridge.swift

@@ -45,6 +45,16 @@ public class RNReactNativeGutenbergBridge: RCTEventEmitter {
             })
         }
     }
+
+    @objc
+    func requestOtherMediaPickFrom(_ source: String, allowMultipleSelection: Bool, callback: @escaping RCTResponseSenderBlock) {
+        //TODO implement me
+    }
+
+    @objc
+    func getOtherMediaOptions(_ filter: [String]?, callback: @escaping RCTResponseSenderBlock) {
+        //TODO implement me
+    }
 
     @objc
     func requestMediaImport(_ urlString: String, callback: @escaping RCTResponseSenderBlock) {