refactor: lint

components/realtime/Log.vue

@@ -1,10 +1,14 @@
 <template>
   <div class="flex flex-col">
     <label for="log">{{ title }}</label>
-    <div name="log" class="realtime-log" ref="log">
+    <div ref="log" name="log" class="realtime-log">
       <span v-if="log">
-        <span v-for="(logEntry, index) in log" :style="{ color: logEntry.color }" :key="index"
-          >@ {{ logEntry.ts }}{{ getSourcePrefix(logEntry.source) }}{{ logEntry.payload }}</span
+        <span
+          v-for="(logEntry, index) in log"
+          :key="index"
+          :style="{ color: logEntry.color }"
+          >@ {{ logEntry.ts }}{{ getSourcePrefix(logEntry.source)
+          }}{{ logEntry.payload }}</span
         >
       </span>
       <span v-else>{{ $t("waiting_for_connection") }}</span>
@@ -12,6 +16,30 @@
   </div>
 </template>
 
+<script>
+import { getSourcePrefix } from "~/helpers/utils/string"
+
+export default {
+  props: {
+    log: { type: Array, default: () => [] },
+    title: {
+      type: String,
+      default: "",
+    },
+  },
+  updated() {
+    this.$nextTick(function () {
+      if (this.$refs.log) {
+        this.$refs.log.scrollBy(0, this.$refs.log.scrollHeight + 100)
+      }
+    })
+  },
+  methods: {
+    getSourcePrefix,
+  },
+}
+</script>
+
 <style scoped lang="scss">
 .realtime-log {
   @apply p-4;
@@ -35,21 +63,3 @@
   }
 }
 </style>
-
-<script>
-import { getSourcePrefix } from "~/helpers/utils/string"
-
-export default {
-  props: ["log", "title"],
-  methods: {
-    getSourcePrefix,
-  },
-  updated() {
-    this.$nextTick(function () {
-      if (this.$refs.log) {
-        this.$refs.log.scrollBy(0, this.$refs.log.scrollHeight + 100)
-      }
-    })
-  },
-}
-</script>