Add common download helper (#628)

* Refactor download functions into a common helper function

* Removed unused import

Author: ErikMichelson

src/components/common/download/download.ts

@@ -0,0 +1,9 @@
+export const download = (data: BlobPart, fileName: string, mimeType: string): void => {
+  const file = new Blob([data], { type: mimeType })
+  const helperElement = document.createElement('a')
+  helperElement.href = URL.createObjectURL(file)
+  helperElement.download = fileName
+  document.body.appendChild(helperElement)
+  helperElement.click()
+  helperElement.remove()
+}

src/components/editor/document-bar/revisions/utils.ts

@@ -1,18 +1,13 @@
 import { Revision } from '../../../../api/revisions/types'
 import { getUserById } from '../../../../api/users'
 import { UserResponse } from '../../../../api/users/types'
+import { download } from '../../../common/download/download'
 
 export const downloadRevision = (noteId: string, revision: Revision | null): void => {
   if (!revision) {
     return
   }
-  const encoded = Buffer.from(revision.content).toString('base64')
-  const wrapper = document.createElement('a')
-  wrapper.download = `${noteId}-${revision.timestamp}.md`
-  wrapper.href = `data:text/markdown;charset=utf-8;base64,${encoded}`
-  document.body.appendChild(wrapper)
-  wrapper.click()
-  document.body.removeChild(wrapper)
+  download(revision.content, `${noteId}-${revision.timestamp}.md`, 'text/markdown')
 }
 
 export const getUserDataForRevision = (authors: string[]): UserResponse[] => {

src/components/history-page/history-page.tsx

@@ -5,10 +5,10 @@ import { useSelector } from 'react-redux'
 import { deleteHistory, deleteHistoryEntry, getHistory, setHistory, updateHistoryEntry } from '../../api/history'
 import { deleteNote } from '../../api/notes'
 import { ApplicationState } from '../../redux'
+import { download } from '../common/download/download'
 
 import {
   collectEntries,
-  downloadHistory,
   loadHistoryFromLocalStore,
   mergeEntryArrays,
   setHistoryToLocalStore,
@@ -90,7 +90,7 @@ export const HistoryPage: React.FC = () => {
       version: 2,
       entries: mergeEntryArrays(localHistoryEntries, remoteHistoryEntries)
     }
-    downloadHistory(dataObject)
+    download(JSON.stringify(dataObject), `history_${(new Date()).getTime()}.json`, 'application/json')
   }, [localHistoryEntries, remoteHistoryEntries])
 
   const clearHistory = useCallback(() => {

src/components/history-page/utils.ts

@@ -3,7 +3,6 @@ import { SortModeEnum } from './sort-button/sort-button'
 import {
   HistoryEntry,
   HistoryEntryOrigin,
-  HistoryJson,
   LocatedHistoryEntry
 } from './history-page'
 import { HistoryToolbarState } from './history-toolbar/history-toolbar'
@@ -126,13 +125,3 @@ export function loadHistoryFromLocalStore (): HistoryEntry[] {
 export function setHistoryToLocalStore (entries: HistoryEntry[]): void {
   window.localStorage.setItem('history', JSON.stringify(entries))
 }
-
-export function downloadHistory (dataObject: HistoryJson): void {
-  const data = 'data:text/json;charset=utf-8;base64,' + Buffer.from(JSON.stringify(dataObject)).toString('base64')
-  const downloadLink = document.createElement('a')
-  downloadLink.setAttribute('href', data)
-  downloadLink.setAttribute('download', `history_${(new Date()).getTime()}.json`)
-  document.body.appendChild(downloadLink)
-  downloadLink.click()
-  downloadLink.remove()
-}