From 9261aac0860b0a2403003a8b161779f8caced4be Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tom=C3=A1=C5=A1=20Ml=C3=A1dek?= <tmladek@protonmail.ch>
Date: Sun, 21 Feb 2021 17:48:15 +0100
Subject: [PATCH] add possibility to add attributes to an object

---
 ui/src/views/Inspect.vue | 45 +++++++++++++++++++++++++++++++++++++---
 1 file changed, 42 insertions(+), 3 deletions(-)

diff --git a/ui/src/views/Inspect.vue b/ui/src/views/Inspect.vue
index 9775125..7f35bd4 100644
--- a/ui/src/views/Inspect.vue
+++ b/ui/src/views/Inspect.vue
@@ -14,7 +14,7 @@
           </tr>
           <tr v-for="[id, entry] in attributes">
             <td>
-              <sl-icon-button name="x-circle" @click="removeAttribute(id)"/>
+              <sl-icon-button name="x-circle" @click="removeEntry(id)"/>
             </td>
             <td>{{ entry.key }}</td>
             <td>
@@ -24,6 +24,17 @@
               </template>
             </td>
           </tr>
+          <tr>
+            <td>
+              <sl-icon-button name="plus-circle" @click="addEntry()"/>
+            </td>
+            <td>
+              <sl-input v-sl-model:newEntryKey/>
+            </td>
+            <td>
+              <sl-input v-sl-model:newEntryValue/>
+            </td>
+          </tr>
         </table>
       </template>
       <template v-if="backlinks.length">
@@ -63,7 +74,16 @@ export default defineComponent({
     Address,
   },
   props: {
-    "address": String
+    "address": {
+      type: String,
+      required: true
+    }
+  },
+  data: () => {
+    return {
+      newEntryKey: "",
+      newEntryValue: ""
+    };
   },
   computed: {
     objectEntries(): [string, IEntry][] {
@@ -85,11 +105,30 @@ export default defineComponent({
     }
   },
   methods: {
-    async removeAttribute(id: string) {
+    async removeEntry(id: string) {
       if (confirm("Are you sure you want to remove the attribute?")) {
         await fetch(`/api/obj/${id}`, {method: "DELETE"});
         await this.mutate();
       }
+    },
+    async addEntry() {
+      await fetch(`/api/obj`, {
+        method: "PUT",
+        headers: {"Content-Type": "application/json"},
+        body: JSON.stringify({
+          target: this.address,
+          key: this.newEntryKey,
+          value: {
+            t: "Value",
+            c: this.newEntryValue
+          }
+        })
+      });
+
+      await this.mutate();
+
+      this.newEntryKey = "";
+      this.newEntryValue = "";
     }
   },
   setup(props) {