feat: Add support for InVision live images

closes #946

app/components/Editor/Embed.js

@@ -44,6 +44,7 @@ export default class Embed extends React.Component<*> {
 }
 
 const Container = styled.div`
+  text-align: center;
   animation: ${fadeIn} 500ms ease-in-out;
   line-height: 0;
 

app/embeds/InVision.js

@@ -1,19 +1,39 @@
 // @flow
 import * as React from 'react';
+import ImageZoom from 'react-medium-image-zoom';
 import Frame from './components/Frame';
 
-const URL_REGEX = new RegExp(
+const IFRAME_REGEX = new RegExp(
   '^https://(invis.io/.*)|(projects.invisionapp.com/share/.*)$'
 );
 
+const IMAGE_REGEX = new RegExp(
+  '^https://(opal.invisionapp.com/static-signed/live-embed/.*)$'
+);
+
 type Props = {
   url: string,
 };
 
 export default class InVision extends React.Component<Props> {
-  static ENABLED = [URL_REGEX];
+  static ENABLED = [IFRAME_REGEX, IMAGE_REGEX];
 
   render() {
+    if (IMAGE_REGEX.test(this.props.url)) {
+      return (
+        <ImageZoom
+          image={{
+            src: this.props.url,
+            alt: 'InVision Embed',
+            style: {
+              maxWidth: '100%',
+              maxHeight: '75vh',
+            },
+          }}
+          shouldRespectMaxDimension
+        />
+      );
+    }
     return <Frame src={this.props.url} title="InVision Embed" />;
   }
 }