From 96bc96506501d38d87579aeb71e67e75f69b8545 Mon Sep 17 00:00:00 2001
From: Juraci <juraci.vieira@gmail.com>
Date: Wed, 31 Jul 2024 18:52:27 -0300
Subject: [PATCH] adding ability to import saved nodes

---
 src/components/NodesArbor.vue | 28 +++++++++++++++++++++++++++-
 1 file changed, 27 insertions(+), 1 deletion(-)

diff --git a/src/components/NodesArbor.vue b/src/components/NodesArbor.vue
index cced593..2669762 100644
--- a/src/components/NodesArbor.vue
+++ b/src/components/NodesArbor.vue
@@ -1,11 +1,27 @@
 <script setup>
 import Card from 'primevue/card';
 import ScrollPanel from 'primevue/scrollpanel';
+import FileUpload from 'primevue/fileupload';
 import { useNodeStore } from '@/stores/NodeStore';
 import { storeToRefs } from 'pinia';
 
 const store = useNodeStore();
-const { nodesList } = storeToRefs(store);
+const { nodesList, nodes, searchQuery } = storeToRefs(store);
+
+const handleFileUpload = (input) => {
+  const reader = new FileReader();
+
+  reader.onload = (e) => {
+    try {
+      const json = JSON.parse(e.target.result);
+      nodes.value = json;
+    } catch (error) {
+      console.error('Error parsing JSON:', error);
+    }
+  };
+
+  reader.readAsText(input.files[0]);
+};
 </script>
 
 <template>
@@ -30,6 +46,16 @@ const { nodesList } = storeToRefs(store);
           </template>
         </Card>
       </router-link>
+      <FileUpload
+        v-show="searchQuery === ''"
+        mode="basic"
+        accept=".json"
+        :max-file-size="1000000"
+        :auto="true"
+        choose-label="Import existing nodes"
+        custom-upload
+        @uploader="handleFileUpload"
+      />
     </div>
   </ScrollPanel>
 </template>