From 925355bc32f381b02775d3b8833c1b40c8c13034 Mon Sep 17 00:00:00 2001
From: I Made Setia Baruna <setia.baruna@sprintasia.co.id>
Date: Thu, 5 Nov 2020 17:27:12 +0700
Subject: [PATCH] WIP: add download data backup

---
 src/components/DataSync.svelte          | 22 ++++++++++++++++++++++
 src/components/SyncConflictModal.svelte |  3 ++-
 2 files changed, 24 insertions(+), 1 deletion(-)

diff --git a/src/components/DataSync.svelte b/src/components/DataSync.svelte
index e018af04..92ef240f 100644
--- a/src/components/DataSync.svelte
+++ b/src/components/DataSync.svelte
@@ -15,6 +15,8 @@
   const DISCOVERY_DOCS = ['https://www.googleapis.com/discovery/v1/apis/drive/v3/rest'];
   const SCOPES = 'https://www.googleapis.com/auth/drive.appdata';
 
+  let remoteSave = null;
+
   $: localSaveExists = $updateTime !== null;
 
   onMount(() => {
@@ -52,6 +54,8 @@
   async function compareLocalSave() {
     try {
       const data = await getData();
+      remoteSave = data;
+
       const remoteTime = dayjs(data[UPDATE_TIME_KEY]);
       if ($updateTime !== null && remoteTime.diff($updateTime) !== 0) {
         console.log('DRIVE SYNC CONFLICT!');
@@ -60,6 +64,7 @@
           {
             remoteTime: remoteTime,
             localTime: $updateTime,
+            downloadBackup: exportData,
           },
           {
             closeButton: false,
@@ -176,4 +181,21 @@
         },
       );
   }
+
+  function exportData() {
+    downloadData(getLocalSaveJson(), 'paimon-moe-local-data');
+    downloadData(JSON.stringify(remoteSave), 'paimon-moe-drive-data');
+  }
+
+  function downloadData(data, name) {
+    const fileLink = document.createElement('a');
+
+    const filename = `${name}.json`;
+    const dataStr = encodeURIComponent(data);
+
+    fileLink.setAttribute('href', `data:text/json;charset=utf-8,${dataStr}`);
+    fileLink.setAttribute('download', filename);
+    document.body.appendChild(fileLink);
+    fileLink.click();
+  }
 </script>
diff --git a/src/components/SyncConflictModal.svelte b/src/components/SyncConflictModal.svelte
index 41a89b8f..efe63ef0 100644
--- a/src/components/SyncConflictModal.svelte
+++ b/src/components/SyncConflictModal.svelte
@@ -6,6 +6,7 @@
 
   export let remoteTime;
   export let localTime;
+  export let downloadBackup = () => {};
 
   const remoteFormatted = remoteTime.format('dddd, MMMM D, YYYY h:mm A');
   const localFormatted = localTime.format('dddd, MMMM D, YYYY h:mm A');
@@ -42,7 +43,7 @@
   </Button>
 </div>
 <div class="flex mt-6 justify-end">
-  <Button className="w-full md:w-auto">
+  <Button className="w-full md:w-auto" on:click={downloadBackup}>
     <Icon path={mdiContentSave} className="mr-1" />Download Both Data
   </Button>
 </div>