feat: edit relay info

static/components/relay-details/relay-details.html

@@ -7,25 +7,54 @@
   </q-tabs>
   <q-tab-panels v-model="tab">
     <q-tab-panel name="info">
-      <div class="row items-center q-mt-md q-mb-lg">
+      <div v-if="relay">
-        <div class="col-6 q-pr-lg">
+        <div class="row items-center no-wrap q-mb-md">
-          <q-btn
+          <div class="col-3 q-pr-lg">Name:</div>
-            unelevated
+          <div class="col-6 q-pr-lg">
-            color="secondary"
+            <q-input
-            class="float-left"
+              filled
-            @click="updateRelay()"
+              dense
-            >Update Relay</q-btn
+              v-model.trim="relay.name"
-          >
+              type="text"
+            ></q-input>
+          </div>
+          <div class="col-3"></div>
         </div>
-        <div class="col-6">
+        <div class="row items-center no-wrap q-mb-md">
-          <q-btn
+          <div class="col-3 q-pr-lg">Description:</div>
-            unelevated
+          <div class="col-6 q-pr-lg">
-            color="pink"
+            <q-input
-            icon="cancel"
+              filled
-            class="float-right"
+              dense
-            @click="deleteRelay()"
+              v-model.trim="relay.description"
-            >Delete Relay</q-btn
+              type="text"
-          >
+            ></q-input>
+          </div>
+          <div class="col-3"></div>
+        </div>
+        <div class="row items-center no-wrap q-mb-md">
+          <div class="col-3 q-pr-lg">Relay Public Key:</div>
+          <div class="col-6 q-pr-lg">
+            <q-input
+              filled
+              dense
+              v-model.trim="relay.pubkey"
+              type="text"
+            ></q-input>
+          </div>
+          <div class="col-3"></div>
+        </div>
+        <div class="row items-center no-wrap q-mb-md">
+          <div class="col-3 q-pr-lg">Contact:</div>
+          <div class="col-6 q-pr-lg">
+            <q-input
+              filled
+              dense
+              v-model.trim="relay.contact"
+              type="text"
+            ></q-input>
+          </div>
+          <div class="col-3"></div>
         </div>
       </div>
     </q-tab-panel>
@@ -39,4 +68,25 @@
       <span>qqq</span>
     </q-tab-panel>
   </q-tab-panels>
+  <div class="row items-center q-mt-md q-mb-lg">
+    <div class="col-6 q-pr-lg">
+      <q-btn
+        unelevated
+        color="secondary"
+        class="float-left"
+        @click="updateRelay()"
+        >Update Relay</q-btn
+      >
+    </div>
+    <div class="col-6">
+      <q-btn
+        unelevated
+        color="pink"
+        icon="cancel"
+        class="float-right"
+        @click="deleteRelay()"
+        >Delete Relay</q-btn
+      >
+    </div>
+  </div>
 </div>

static/components/relay-details/relay-details.js

@@ -8,6 +8,7 @@ async function relayDetails(path) {
     data: function () {
       return {
         tab: 'info',
+        relay: null,
         formDialogItem: {
           show: false,
           data: {
@@ -40,9 +41,23 @@ async function relayDetails(path) {
               LNbits.utils.notifyApiError(error)
             }
           })
+      },
+      getRelay: async function () {
+        try {
+          const {data} = await LNbits.api.request(
+            'GET',
+            '/nostrrelay/api/v1/relay/' + this.relayId,
+            this.inkey
+          )
+          this.relay = data
+        } catch (error) {
+          LNbits.utils.notifyApiError(error)
+        }
       }
     },
 
-    created: async function () {}
+    created: async function () {
+      await this.getRelay()
+    }
   })
 }