lightbox: Use tryGetFileDownloadUrl to download images.

Using the helper `tryGetFileDownloadUrl`, we try to generate and
use temporary authless URLs to download files from the lighbox.
This fixes an issue where redirects to S3 caused RNFetchBlob to
fail downloading the file.

If we fail to download the file, which happens if we failed to
generate the temporary URL because the server does not support it,
we open it in the browser instead, from where the user can easily
save it.

Also makes changes in other places required due to this change.

Fixes: #2115

Author: agrawal-d

src/lightbox/LightboxActionSheet.js

@@ -5,6 +5,8 @@ import share from './share';
 import shareImage from './shareImage';
 import { showToast } from '../utils/info';
 import { getFullUrl } from '../utils/url';
+import tryGetTemporaryFileUrl from '../api/tryGetFileDownloadUrl';
+import openLink from '../utils/openLink';
 
 type DownloadImageType = {|
   src: string,
@@ -33,8 +35,15 @@ type ButtonType = {|
 |};
 
 const tryToDownloadImage = async ({ src, auth }: DownloadImageType) => {
+  const tempUrl = await tryGetTemporaryFileUrl(src, auth);
+  if (tempUrl === null) {
+    showToast('Please download the image from your browser');
+    openLink(src);
+    return;
+  }
+
   try {
-    await downloadImage(src, auth);
+    await downloadImage(tempUrl, auth);
     showToast('Download complete');
   } catch (error) {
     showToast(error.message);

src/lightbox/downloadImage.js

@@ -3,9 +3,6 @@ import { CameraRoll, Platform, PermissionsAndroid } from 'react-native';
 import RNFetchBlob from 'rn-fetch-blob';
 
 import type { Auth } from '../api/transportTypes';
-import { getAuthHeaders } from '../api/transport';
-import { getFullUrl } from '../utils/url';
-import userAgent from '../utils/userAgent';
 
 /**
  * Request permission WRITE_EXTERNAL_STORAGE, or throw if can't get it.
@@ -34,28 +31,27 @@ const androidEnsureStoragePermission = async (): Promise<void> => {
   // result === GRANTED
 };
 
-export default async (src: string, auth: Auth): Promise<mixed> => {
-  const absoluteUrl = getFullUrl(src, auth.realm);
-
+/**
+ * Download a remote image to the device.
+ *
+ * @param url A URL to the image.  Should be a valid temporary URL generated
+ * using `getTemporaryFileUrl`.
+ * @param auth Authentication info for the current user.
+ */
+export default async (url: string, auth: Auth): Promise<mixed> => {
   if (Platform.OS === 'ios') {
-    const delimiter = absoluteUrl.includes('?') ? '&' : '?';
-    const urlWithApiKey = `${absoluteUrl}${delimiter}api_key=${auth.apiKey}`;
-    return CameraRoll.saveToCameraRoll(urlWithApiKey);
+    return CameraRoll.saveToCameraRoll(url);
   }
 
   // Platform.OS === 'android'
   await androidEnsureStoragePermission();
   return RNFetchBlob.config({
     addAndroidDownloads: {
-      path: `${RNFetchBlob.fs.dirs.DownloadDir}/${src.split('/').pop()}`,
+      path: `${RNFetchBlob.fs.dirs.DownloadDir}/${url.split('/').pop()}`,
       useDownloadManager: true,
       mime: 'text/plain', // Android DownloadManager fails if the url is missing a file extension
-      title: src.split('/').pop(),
+      title: url.split('/').pop(),
       notification: true,
     },
-  }).fetch('GET', absoluteUrl, {
-    'Content-Type': 'application/x-www-form-urlencoded; charset=utf-8',
-    'User-Agent': userAgent,
-    ...getAuthHeaders(auth),
-  });
+  }).fetch('GET', url);
 };

src/lightbox/shareImage.js

@@ -5,14 +5,24 @@ import downloadImage from './downloadImage';
 import type { Auth } from '../types';
 import ShareImageAndroid from '../nativeModules/ShareImageAndroid';
 import { showToast } from '../utils/info';
+import tryGetTemporaryFileUrl from '../api/tryGetFileDownloadUrl';
+import openLink from '../utils/openLink';
 
 export default async (url: string, auth: Auth) => {
+  const tempUrl = await tryGetTemporaryFileUrl(url, auth);
+
+  if (tempUrl === null) {
+    showToast('Please share the image from your browser');
+    openLink(url);
+    return;
+  }
+
   if (Platform.OS === 'android') {
-    const res: $FlowFixMe = await downloadImage(url, auth);
+    const res: $FlowFixMe = await downloadImage(tempUrl, auth);
     await ShareImageAndroid.shareImage(res.path());
   } else {
     try {
-      const uri = await downloadImage(url, auth);
+      const uri = await downloadImage(tempUrl, auth);
       try {
         await Share.share({ url: uri, message: url });
       } catch (error) {

static/translations/messages_en.json

@@ -182,7 +182,9 @@
   "Edit stream": "Edit stream",
   "OK": "OK",
   "Can not share": "Can not share",
+  "Please share the image from your browser": "Please share the image from your browser",
   "Download complete": "Download complete",
+  "Please download the image from your browser": "Please download the image from your browser",
   "Can not download": "Can not download",
   "Download file": "Download file",
   "Update": "Update",