From dc1bc44c8f71df4d05e1f44ecc426fab037531e1 Mon Sep 17 00:00:00 2001
From: milesstoetzner <miles.stoetzner@googlemail.com>
Date: Tue, 26 Jan 2021 05:47:23 +0100
Subject: [PATCH] feat: Google Drawings Integration (#1814)

* add google drawings integration

* add google drawings image

* update google drawings image and regex

* allow query parameter in google drawings regex

* support CDN for google drawings image
---
 app/embeds/GoogleDrawings.js      |  39 ++++++++++++++++++++++++++++++
 app/embeds/GoogleDrawings.test.js |  29 ++++++++++++++++++++++
 app/embeds/index.js               |   8 ++++++
 public/images/google-drawings.png | Bin 0 -> 1447 bytes
 4 files changed, 76 insertions(+)
 create mode 100644 app/embeds/GoogleDrawings.js
 create mode 100644 app/embeds/GoogleDrawings.test.js
 create mode 100644 public/images/google-drawings.png

diff --git a/app/embeds/GoogleDrawings.js b/app/embeds/GoogleDrawings.js
new file mode 100644
index 000000000..6be5db510
--- /dev/null
+++ b/app/embeds/GoogleDrawings.js
@@ -0,0 +1,39 @@
+// @flow
+import * as React from "react";
+import Image from "components/Image";
+import Frame from "./components/Frame";
+
+const URL_REGEX = new RegExp(
+  "^https://docs.google.com/drawings/d/(.*)/(edit|preview)(.*)$"
+);
+
+type Props = {|
+  attrs: {|
+    href: string,
+    matches: string[],
+  |},
+|};
+
+export default class GoogleDrawings extends React.Component<Props> {
+  static ENABLED = [URL_REGEX];
+
+  render() {
+    return (
+      <Frame
+        {...this.props}
+        src={this.props.attrs.href.replace("/edit", "/preview")}
+        icon={
+          <Image
+            src="/images/google-drawings.png"
+            alt="Google Drawings"
+            width={16}
+            height={16}
+          />
+        }
+        canonicalUrl={this.props.attrs.href.replace("/preview", "/edit")}
+        title="Google Drawings"
+        border
+      />
+    );
+  }
+}
diff --git a/app/embeds/GoogleDrawings.test.js b/app/embeds/GoogleDrawings.test.js
new file mode 100644
index 000000000..27617ed8c
--- /dev/null
+++ b/app/embeds/GoogleDrawings.test.js
@@ -0,0 +1,29 @@
+/* eslint-disable flowtype/require-valid-file-annotation */
+import GoogleDrawings from "./GoogleDrawings";
+
+describe("GoogleDrawings", () => {
+  const match = GoogleDrawings.ENABLED[0];
+  test("to be enabled on share link", () => {
+    expect(
+      "https://docs.google.com/drawings/d/1zDLtJ4HSCnjGCGSoCgqGe3F8p6o7R8Vjk8MDR6dKf-U/edit".match(
+        match
+      )
+    ).toBeTruthy();
+    expect(
+      "https://docs.google.com/drawings/d/1zDLtJ4HSCnjGCGSoCgqGe3F8p6o7R8Vjk8MDR6dKf-U/edit?usp=sharing".match(
+        match
+      )
+    ).toBeTruthy();
+  });
+
+  test("to not be enabled elsewhere", () => {
+    expect(
+      "https://docs.google.com/drawings/d/e/2PACX-1vRtzIzEWN6svSrIYZq-kq2XZEN6WaOFXHbPKRLXNOFRlxLIdJg0Vo6RfretGqs9SzD-fUazLeS594Kw/pub?w=960&h=720".match(
+        match
+      )
+    ).toBe(null);
+    expect("https://docs.google.com/drawings".match(match)).toBe(null);
+    expect("https://docs.google.com".match(match)).toBe(null);
+    expect("https://www.google.com".match(match)).toBe(null);
+  });
+});
diff --git a/app/embeds/index.js b/app/embeds/index.js
index 0e1c07e6f..1e389a53f 100644
--- a/app/embeds/index.js
+++ b/app/embeds/index.js
@@ -10,6 +10,7 @@ import Figma from "./Figma";
 import Framer from "./Framer";
 import Gist from "./Gist";
 import GoogleDocs from "./GoogleDocs";
+import GoogleDrawings from "./GoogleDrawings";
 import GoogleDrive from "./GoogleDrive";
 import GoogleSheets from "./GoogleSheets";
 import GoogleSlides from "./GoogleSlides";
@@ -95,6 +96,13 @@ export default [
     component: Gist,
     matcher: matcher(Gist),
   },
+  {
+    title: "Google Drawings",
+    keywords: "drawings",
+    icon: () => <Img src="/images/google-drawings.png" />,
+    component: GoogleDrawings,
+    matcher: matcher(GoogleDrawings),
+  },
   {
     title: "Google Drive",
     keywords: "drive",
diff --git a/public/images/google-drawings.png b/public/images/google-drawings.png
new file mode 100644
index 0000000000000000000000000000000000000000..d690ddff904062d3cffa919d35a9e22a89a8d79a
GIT binary patch
literal 1447
zcmZuxYd8}M7~Wy7BU>cbLp(*fbq*CrC)8ZVNiFyLNDPr|nHj@6ZmGyM#xxqq5R?1m
zEM_ie?i~!db0VXx<rYV$^Q+E}_j{k`eZKF{_df5Nc-7imTvSdJ004-?ETGp8IP43A
z1rMfy_u0V%5(&0&LID7v!(Z^j;3R$*01$A3K}~GKa#!=*kS;f5nE4&CRn#-D?N^qW
z?FsfK8l!A$sP1z3G2z!B6HmDbu+deV1BD+V73#aH@Wxh{sLVN4pfB7#`@qMZ0`EUr
zcE3b&>^aQP#<KF!(z{%(0Quhnrz)0qqk@&wc};8BsL0l-ji=;mC0DhIgtna%ko~Qx
zP^pTo9%HrRD%}uxTm|&32Q`EDoDf-gX-}Xew5`f~%lR@_ls?2Ci2=iN5*l8)hdhKU
z7uc#0^QpZ&Q$l3D!LYOM3_F*asUUK}xLkPDtrzolMufLBp*MdoTCpgycqw2VyzL4{
zZ&{ak`upk-FT}7l4sntzk~dMVof$%gief<i>@Y%Fibke4kVQkzJ^~v>s7E7aj9&yR
zJL-cq6@;Y^0YO59SbqAev3d5KX+=;Wl9?gZ{QU0Om$!c1-=MTEAw8GX)==1497?uY
zY(;?9UxZsDYmM)eRMLt$tuDI@<~jQu8P?I3BAR*fNme0i9Ur`kq6sD%g&8q~FmNuL
zIFgr0`JlkUqf>m6708UKUVWWFEl0J-40qlr4Gjy3Pu<D?ta+)J*@5&cr_S%ycs`hR
z>?<4Qao6L9NB0Q<==Y!bxg$8)1;6YLQF<9J6yBrS=XV7&vkA<Tla+QOKCn(xVg1zL
zbF&pvFDAjRQQVG}Gpv<`c?fj?aUteY?n9l9unS(S;mTXCRBu%RfBi4p<KZcqV+jc2
zyr4w})h&3Z)9SA-aYUDk2evK1^XU`2;Gu`^{tbN`n}+lIK~dOtLhem5HV{=-H_I47
zAFtK+n*996s1R5!5;U3jA;;JOiSw5sti+xZ(~g|Jtq2R0nXuicDp^57BC!6+X^i%O
z+44fy)1R6vNqDs+*hMXS?K%T&txe=wh}Sq~G=qGm!1cw7K)b4c))He`0Mj^j-a&Gu
zg+=<43ZW3N$qszPMh=>HGF>#N>HUd}+7Yuk@mhT%hC)zvnNW1KlWZ;@`nr2=3ZK<I
z9?-Vn1US_4pSv;tnw~C7+UHq8C`_RRH`5XXe(nlil3Mbmb$?(5s-gE)pOO9!(9%Qc
z%tsQ3Yn=ZG9SGf0F5P`yY%P6XY8bRPi$sbJnWckBJ&_!)`tY4}(4vEGk0i3_GWiC1
zu8&)nA)zE#ExcGKLsL=`!#T;DxTNQ0V+M!QBRV(V_^S}l<?Myri=QgUeviqR^cZ*6
z`@|@onkdyUm@d3Si<z^#oi6`GVzm(#)zs1lx+cg)csH((kbRY%B+Y=RD6y{a(={_n
z7K@H{#)@WF&|#?_VWfNU62_G(RQ)PlU3>yw348c*4IkAYje%pTVT??Cd25s?A8V%+
zRar;O-{ssHHT3L2{I3Jg23DBt=xNQIihX&oLT=l3!derY?iqErzxCtqT%n`E97B1>
z&H87no9=Ppf6y`io0zXZ{Vqt~$;|rew3XQFUZYU#2YE`p-(&WeOXYGRJ&tg~`I``a
za|_arZ3Y8vyy*2WvIvL}O&LhTLaGR`Fgw${OER}}F$t<C#~TE9syB+84QSSZd50m;
zW6!Edh*s(1e%qvjl87iix=2sFiBC;PO?jvHPWx>mw+=}zwEQ_I;FG#$mQ`t)w;c?B
z<mH%%WlQOiknA{13Xk0VHl{^dMUJbJ`J)8R&za9^LEsc=)`zecDgfo`<ZRrE175e%
QIcQ!0%+wlMei1?V2O~4M2><{9

literal 0
HcmV?d00001