Fix image rendering

Summary:
Images in the network plugin are rarely displayed in the network plugin, as it tries to use the public url to preview it. However, that won't if the endpoint is behind authentication, idempotent, etc. This diff changes the behavior to instead send the network body to flipper and use that to preview.

Changelog: [Network] Fixed image preview

Reviewed By: jknoxville, passy

Differential Revision: D23370743

fbshipit-source-id: 0070e9e38c10a5761b9f7190467e26f01a7b2471

android/plugins/network/src/main/java/com/facebook/flipper/plugins/network/NetworkFlipperPlugin.java

@@ -148,8 +148,6 @@ public class NetworkFlipperPlugin extends BufferingFlipperPlugin implements Netw
       return false;
     }
 
-    return contentType.value.contains("image/")
+    return contentType.value.contains("video/") || contentType.value.contains("application/zip");
-        || contentType.value.contains("video/")
-        || contentType.value.contains("application/zip");
   }
 }

desktop/plugins/network/RequestDetails.tsx

@@ -478,8 +478,17 @@ class ImageWithSize extends Component<ImageWithSizeProps, ImageWithSizeState> {
 
 class ImageFormatter {
   formatResponse = (request: Request, response: Response) => {
-    if (getHeaderValue(response.headers, 'content-type').startsWith('image')) {
+    if (getHeaderValue(response.headers, 'content-type').startsWith('image/')) {
-      return <ImageWithSize src={request.url} />;
+      if (response.data) {
+        const src = `data:${getHeaderValue(
+          response.headers,
+          'content-type',
+        )};base64,${response.data}`;
+        return <ImageWithSize src={src} />;
+      } else {
+        // fallback to using the request url
+        return <ImageWithSize src={request.url} />;
+      }
     }
   };
 }
@@ -492,7 +501,7 @@ class VideoFormatter {
 
   formatResponse = (request: Request, response: Response) => {
     const contentType = getHeaderValue(response.headers, 'content-type');
-    if (contentType.startsWith('video')) {
+    if (contentType.startsWith('video/')) {
       return (
         <MediaContainer>
           <VideoFormatter.Video controls={true}>