autoformat

ui/src/App.vue

@@ -11,9 +11,9 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from "vue";
-import Jobs from "@/components/Jobs.vue";
 import Header from "@/components/Header.vue";
+import Jobs from "@/components/Jobs.vue";
+import { defineComponent } from "vue";
 
 export default defineComponent({
   name: "App",

ui/src/components/Header.vue

@@ -13,11 +13,7 @@
 </template>
 
 <script lang="ts">
-import { ListingResult } from "@/types/base";
-import { fetcher } from "@/utils";
-import useSWRV from "swrv";
-import { computed, defineComponent } from "vue";
-import HashBadge from "./HashBadge.vue";
+import { defineComponent } from "vue";
 
 export default defineComponent({
   name: "Header",

ui/src/components/Jobs.vue

@@ -2,14 +2,16 @@
   <transition-group name="fade">
     <div class="job" v-for="job in activeJobs" :key="job.id">
       <div class="job-label">{{ job.title }}</div>
-      <sl-progress-bar :percentage="job.progress">{{ Math.round(job.progress) }}%</sl-progress-bar>
+      <sl-progress-bar :percentage="job.progress"
+        >{{ Math.round(job.progress) }}%</sl-progress-bar
+      >
     </div>
   </transition-group>
 </template>
 
 <script lang="ts">
-import {defineComponent} from "vue";
-import {Job} from "@/types/base";
+import { Job } from "@/types/base";
+import { defineComponent } from "vue";
 
 interface JobWithId extends Job {
   id: string;
@@ -19,22 +21,24 @@ export default defineComponent({
   name: "Jobs",
   data: () => {
     return {
-      jobs: {} as { [key: string]: Job }
+      jobs: {} as { [key: string]: Job },
     };
   },
   computed: {
     activeJobs(): JobWithId[] {
-      return Object.entries(this.jobs).filter(([_, job]) => job.progress < 100).map(([id, job]) => {
-        return {id, ...job};
-      });
-    }
+      return Object.entries(this.jobs)
+        .filter(([_, job]) => job.progress < 100)
+        .map(([id, job]) => {
+          return { id, ...job };
+        });
+    },
   },
   mounted() {
     setInterval(async () => {
       let request = await fetch("/api/jobs");
       this.jobs = await request.json();
     }, 3333);
-  }
+  },
 });
 </script>
 

ui/src/components/SearchResult.vue

@@ -1,5 +1,8 @@
 <template>
-  <router-link :to="{name: 'inspect', params: {'address': result.entity}}" class="search-result">
+  <router-link
+    :to="{ name: 'inspect', params: { address: result.entity } }"
+    class="search-result"
+  >
     <div class="search-result-container">
       <div class="search-result-attribute">{{ result.attribute }}</div>
       <div class="search-result-value">{{ result.value.c }}</div>
@@ -8,18 +11,17 @@
 </template>
 
 <script lang="ts">
-import {defineComponent, PropType} from "vue";
-import {IEntry} from "@/types/base";
-
+import { IEntry } from "@/types/base";
+import { defineComponent, PropType } from "vue";
 
 export default defineComponent({
   name: "SearchResult",
   props: {
     result: {
       type: Object as PropType<IEntry>,
-      required: true
-    }
-  }
+      required: true,
+    },
+  },
 });
 </script>
 
@@ -27,7 +29,7 @@ export default defineComponent({
 .search-result {
   .search-result-container {
     box-shadow: var(--sl-shadow-medium);
-    margin: .5rem;
+    margin: 0.5rem;
     padding: 1rem;
   }
 
@@ -37,7 +39,7 @@ export default defineComponent({
   text-decoration: inherit;
 
   div {
-    margin: .5rem 0;
+    margin: 0.5rem 0;
   }
 
   .search-result-attribute {

ui/src/main.ts

@@ -1,8 +1,8 @@
+import { defineCustomElements, setAssetPath, SlInput } from "@shoelace-style/shoelace";
 import * as Vue from "vue";
 import { DirectiveBinding } from "vue";
 import App from "./App.vue";
 import router from "./router";
-import { defineCustomElements, setAssetPath, SlInput, } from "@shoelace-style/shoelace";
 
 // TODO: Remove when UI settles!
 defineCustomElements();

ui/src/router/index.ts

@@ -1,7 +1,7 @@
-import { createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router'
-import Home from "../views/About.vue";
-import Search from '../views/Search.vue'
 import Inspect from "@/views/Inspect.vue";
+import { createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router';
+import Home from "../views/About.vue";
+import Search from '../views/Search.vue';
 
 const routes: Array<RouteRecordRaw> = [
   {

ui/src/types/base.ts

@@ -4,7 +4,7 @@ export type VALUE_TYPE = "Value" | "Address" | "Invalid";
 export interface IEntry {
   entity: Address,
   attribute: string,
-  value: {t: VALUE_TYPE, c: string}
+  value: { t: VALUE_TYPE, c: string }
 }
 
 export interface ListingResult {

ui/src/views/Inspect.vue

@@ -1,7 +1,11 @@
 <template>
   <div class="inspect">
     <h2>
-      <Address :address="address" :is-file="backlinks.some(([_, e]) => e.attribute === 'FILE_IS')" :resolve="false"/>
+      <Address
+        :address="address"
+        :is-file="backlinks.some(([_, e]) => e.attribute === 'FILE_IS')"
+        :resolve="false"
+      />
     </h2>
     <div v-if="!error">
       <template v-if="attributes.length">
@@ -12,13 +16,17 @@
             <th>Attribute name</th>
             <th>Value</th>
           </tr>
-          <tr v-for="[id, entry] in attributes" :key=id>
+          <tr v-for="[id, entry] in attributes" :key="id">
             <td>
-              <sl-icon-button name="x-circle" @click="removeEntry(id)"/>
+              <sl-icon-button name="x-circle" @click="removeEntry(id)" />
             </td>
             <td>{{ entry.attribute }}</td>
             <td>
-              <Address link v-if="entry.value.t === 'Address'" :address="entry.value.c"/>
+              <Address
+                link
+                v-if="entry.value.t === 'Address'"
+                :address="entry.value.c"
+              />
               <template v-else>
                 {{ entry.value.c }}
               </template>
@@ -26,13 +34,13 @@
           </tr>
           <tr>
             <td>
-              <sl-icon-button name="plus-circle" @click="addEntry()"/>
+              <sl-icon-button name="plus-circle" @click="addEntry()" />
             </td>
             <td>
-              <sl-input v-sl-model:newEntryAttribute/>
+              <sl-input v-sl-model:newEntryAttribute />
             </td>
             <td>
-              <sl-input v-sl-model:newEntryValue/>
+              <sl-input v-sl-model:newEntryValue />
             </td>
           </tr>
         </table>
@@ -46,7 +54,7 @@
           </tr>
           <tr v-for="[id, entry] in backlinks" :key="id">
             <td>
-              <Address link :address="entry.entity"/>
+              <Address link :address="entry.entity" />
             </td>
             <td>
               {{ entry.attribute }}
@@ -62,10 +70,10 @@
 </template>
 
 <script lang="ts">
-import {defineComponent} from "vue";
+import { defineComponent } from "vue";
 import useSWRV from "swrv";
-import {fetcher} from "@/utils";
-import {IEntry, ListingResult} from "@/types/base";
+import { fetcher } from "@/utils";
+import { IEntry, ListingResult } from "@/types/base";
 import Address from "@/components/Address.vue";
 
 export default defineComponent({
@@ -74,15 +82,15 @@ export default defineComponent({
     Address,
   },
   props: {
-    "address": {
+    address: {
       type: String,
-      required: true
-    }
+      required: true,
+    },
   },
   data: () => {
     return {
       newEntryAttribute: "",
-      newEntryValue: ""
+      newEntryValue: "",
     };
   },
   computed: {
@@ -102,44 +110,47 @@ export default defineComponent({
     },
     backlinks(): [string, IEntry][] {
       return this.objectEntries.filter(([_, e]) => e.entity !== this.address);
-    }
+    },
   },
   methods: {
     async removeEntry(id: string) {
       if (confirm("Are you sure you want to remove the attribute?")) {
-        await fetch(`/api/obj/${id}`, {method: "DELETE"});
+        await fetch(`/api/obj/${id}`, { method: "DELETE" });
         await this.mutate();
       }
     },
     async addEntry() {
       await fetch(`/api/obj`, {
         method: "PUT",
-        headers: {"Content-Type": "application/json"},
+        headers: { "Content-Type": "application/json" },
         body: JSON.stringify({
           entity: this.address,
           attribute: this.newEntryAttribute,
           value: {
             t: "Value",
-            c: this.newEntryValue
-          }
-        })
+            c: this.newEntryValue,
+          },
+        }),
       });
 
       await this.mutate();
 
       this.newEntryAttribute = "";
       this.newEntryValue = "";
-    }
+    },
   },
   setup(props) {
-    const {data, error, mutate} = useSWRV<ListingResult, unknown>(() => `/api/obj/${props.address}`, fetcher);
+    const { data, error, mutate } = useSWRV<ListingResult, unknown>(
+      () => `/api/obj/${props.address}`,
+      fetcher
+    );
 
     return {
       data,
       error,
-      mutate
+      mutate,
     };
-  }
+  },
 });
 </script>
 

ui/src/views/Search.vue

@@ -9,13 +9,13 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from "vue";
-import { construct } from "@/utils";
 import SearchResult from "@/components/SearchResult.vue";
 import { ListingResult } from "@/types/base";
+import { construct } from "@/utils";
 import useSWRV from "swrv";
-import { fetcher } from "../utils";
+import { defineComponent } from "vue";
 import { useRoute } from "vue-router";
+import { fetcher } from "../utils";
 
 export default defineComponent({
   name: "Search",