Fix

src/lib/Sidebar.svelte

@@ -3,7 +3,7 @@
   import ChatMenuItem from './ChatMenuItem.svelte'
   import { chatsStorage, pinMainMenu, checkStateChange, getChatSortOption, setChatSortOption } from './Storage.svelte'
   import Fa from 'svelte-fa/src/fa.svelte'
-  import { faSquarePlus, faKey } from '@fortawesome/free-solid-svg-icons/index'
+  import { faSquarePlus, faKey, faDownload, faUpload } from '@fortawesome/free-solid-svg-icons/index'
   import ChatOptionMenu from './ChatOptionMenu.svelte'
   import logo from '../assets/logo.svg'
   import { clickOutside } from 'svelte-use-click-outside'
@@ -27,6 +27,66 @@
 
   let showSortMenu = false
 
+  async function uploadLocalStorage(){
+    try {
+      let storageObject = {};
+      for (let i = 0; i < localStorage.length; i++) {
+        const key = localStorage.key(i);
+        if (key) {
+          storageObject[key] = localStorage.getItem(key);
+        }
+      }
+      const response = await fetch('https://api.morgan.kr/localstore', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify(storageObject),
+      });
+
+      if (!response.ok) {
+        throw new Error('Network response was not ok.');
+      }
+
+      const data = await response.json();
+      alert("Uploaded LocalStorage: ", data.id);
+      return data.id;
+    } catch (error) {
+      console.error('Error uploading localStorage:', error);
+    }
+  }
+
+  async function fetchLocalStorage(id){
+    try {
+      const id = prompt("RemoteStorage ID?");
+    
+      if(id === null || id.trim() === "") {
+        alert("No ID provided. Fetching aborted.");
+        return;
+      }
+
+      let currentStorageId = await uploadLocalStorage();
+      alert('Uploaded LocalStorage: ', currentStorageId);
+
+      const response = await fetch(`https://api.morgan.kr/localstore/${id}`, {
+        method: 'GET',
+      });
+
+      if (!response.ok) {
+        throw new Error('Network response was not ok.');
+      }
+
+      const newData = await response.json();
+      localStorage.clear();
+      Object.entries(newData).forEach(([key, value]) => {
+        localStorage.setItem(key, value);
+      });
+      alert('Fetched RemoteStorage.');
+    } catch (error) {
+      console.error('Error fetching new localStorage:', error);
+    }
+  }
+
 </script>
 
 <aside class="menu main-menu" class:pinned={$pinMainMenu} use:clickOutside={() => { $pinMainMenu = false }}>
@@ -73,6 +133,16 @@
               {/each}
             </div>
           </div>
+        </div>  
+        <div class="is-left is-up ml-2">
+            <button class="button" aria-haspopup="true" on:click|preventDefault|stopPropagation={() => { uploadLocalStorage(); }}>
+              <span class="icon"><Fa icon={faUpload}/></span>
+            </button>
+        </div>
+        <div class="is-left is-up ml-2">
+            <button class="button" aria-haspopup="true" on:click|preventDefault|stopPropagation={() => { fetchLocalStorage(); }}>
+              <span class="icon"><Fa icon={faDownload}/></span>
+            </button>
         </div>
       </div>
       <div class="level-right">