From f099630d0105602189a85adda24cdf4ef4b964fd Mon Sep 17 00:00:00 2001
From: Steve Ruiz <steveruizok@gmail.com>
Date: Wed, 9 Mar 2022 11:26:37 +0000
Subject: [PATCH] adds export to vscode extension (#608)

---
 apps/vscode/editor/src/app.tsx         |  2 ++
 apps/vscode/editor/src/utils/export.ts | 29 ++++++++++++++++++++++++++
 2 files changed, 31 insertions(+)
 create mode 100644 apps/vscode/editor/src/utils/export.ts

diff --git a/apps/vscode/editor/src/app.tsx b/apps/vscode/editor/src/app.tsx
index 0f9e035df..5f34a9df9 100644
--- a/apps/vscode/editor/src/app.tsx
+++ b/apps/vscode/editor/src/app.tsx
@@ -4,6 +4,7 @@ import { Tldraw, TldrawApp, TDFile, TDDocument } from '@tldraw/tldraw'
 import { vscode } from './utils/vscode'
 import { defaultDocument } from './utils/defaultDocument'
 import type { MessageFromExtension, MessageFromWebview } from './types'
+import { exportToImage } from 'utils/export'
 
 // Will be placed in global scope by extension
 declare let currentFile: TDFile
@@ -60,6 +61,7 @@ export default function App(): JSX.Element {
         document={rInitialDocument.current}
         onMount={handleMount}
         onPersist={handlePersist}
+        onExport={exportToImage}
         autofocus
       />
     </div>
diff --git a/apps/vscode/editor/src/utils/export.ts b/apps/vscode/editor/src/utils/export.ts
new file mode 100644
index 000000000..09e2adb46
--- /dev/null
+++ b/apps/vscode/editor/src/utils/export.ts
@@ -0,0 +1,29 @@
+import { TDExport } from '@tldraw/tldraw'
+
+export const EXPORT_ENDPOINT =
+  process.env.NODE_ENV === 'development'
+    ? 'http://localhost:3000/api/export'
+    : 'https://www.tldraw.com/api/export'
+
+export async function exportToImage(info: TDExport) {
+  if (info.serialized) {
+    const link = document.createElement('a')
+    link.href = 'data:text/plain;charset=utf-8,' + encodeURIComponent(info.serialized)
+    link.download = info.name + '.' + info.type
+    link.click()
+
+    return
+  }
+
+  const response = await fetch(EXPORT_ENDPOINT, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify(info),
+  })
+  const blob = await response.blob()
+  const blobUrl = URL.createObjectURL(blob)
+  const link = document.createElement('a')
+  link.href = blobUrl
+  link.download = info.name + '.' + info.type
+  link.click()
+}