[CodeFactor] Apply fixes

gui/src/components/dynamic_components2.vue

@@ -61,11 +61,7 @@ const gridWidgets = [
   ),
   new gridWidget(s_meter, { x: 1, y: 1, w: 2, h: 4 }, "S-Meter"),
   new gridWidget(dbfs_meter, { x: 1, y: 1, w: 2, h: 4 }, "Dbfs Meter"),
-  new gridWidget(
+  new gridWidget(grid_activities, { x: 1, y: 1, w: 3, h: 27 }, "Activities"),
-    grid_activities,
-    { x: 1, y: 1, w: 3, h: 27 },
-    "Activities",
-  ),
 ];
 onMounted(() => {
   grid = GridStack.init({
@@ -157,30 +153,30 @@ function quickfill() {
 <template>
   <button type="button" @click="showModal">Add Widget pos [0,0]</button>
   <button type="button" @click="quickfill">Quickfill</button>
-  <div class="grid-container vh-100"> 
+  <div class="grid-container vh-100">
-  <div class="grid-stack">
+    <div class="grid-stack">
-    <div
+      <div
-      v-for="(w, indexs) in items"
+        v-for="(w, indexs) in items"
-      class="grid-stack-item"
+        class="grid-stack-item"
-      :gs-x="w.x"
+        :gs-x="w.x"
-      :gs-y="w.y"
+        :gs-y="w.y"
-      :gs-w="w.w"
+        :gs-w="w.w"
-      :gs-h="w.h"
+        :gs-h="w.h"
-      :gs-id="w.id"
+        :gs-id="w.id"
-      :id="w.id"
+        :id="w.id"
-      :key="w.id"
+        :key="w.id"
-      :gs-auto-position="true"
+        :gs-auto-position="true"
-    >
+      >
-      <div class="grid-stack-item-content">
+        <div class="grid-stack-item-content">
-        <button
+          <button
-          @click="remove(w)"
+            @click="remove(w)"
-          class="btn-close grid-stack-floaty-btn"
+            class="btn-close grid-stack-floaty-btn"
-        ></button>
+          ></button>
-        <component :is="w.component2" />
+          <component :is="w.component2" />
+        </div>
       </div>
     </div>
   </div>
-  </div>
   <div class="modal fade" id="tileModal" tabindex="-1">
     <div class="modal-dialog">
       <div class="modal-content">
@@ -269,7 +265,7 @@ function quickfill() {
   top: 6px;
 }
 .grid-container {
-      border: 1px solid blue;
+  border: 1px solid blue;
-      overflow-y: auto;
+  overflow-y: auto;
-    }
+}
 </style>

gui/src/components/grid_activities.vue

@@ -1,5 +1,4 @@
 <script setup lang="ts">
-
 import { setActivePinia } from "pinia";
 import pinia from "../store/index";
 setActivePinia(pinia);
@@ -24,16 +23,19 @@ function getDateTime(timestampRaw) {
 }
 </script>
 <template>
-<div class="card h-100" >
+  <div class="card h-100">
-  <div class="card-header">
+    <div class="card-header">
-    <strong>Activity</strong>
+      <strong>Activity</strong>
-  </div>
+    </div>
-  <div class="card-body overflow-auto" style="align-items: start;">
+    <div class="card-body overflow-auto" style="align-items: start">
-    <div v-for="item in state.activities" :key="item[0]">
+      <div v-for="item in state.activities" :key="item[0]">
-    <h6 style="text-align: start;" >{{ item[1].origin }} - {{ getDateTime(item[1].timestamp) }}</h6>
+        <h6 style="text-align: start">
-    <p  style="text-align: start;">{{item[1].activity_type}} - {{ item[1].direction }}</p>
+          {{ item[1].origin }} - {{ getDateTime(item[1].timestamp) }}
+        </h6>
+        <p style="text-align: start">
+          {{ item[1].activity_type }} - {{ item[1].direction }}
+        </p>
+      </div>
     </div>
-
   </div>
-</div>
 </template>

gui/src/js/eventHandler.js

@@ -140,31 +140,40 @@ export function stateDispatcher(data) {
 }
 function build_HSL() {
   //Use data from activities to build HSL list
-  for (let i=0; i < stateStore.activities.length; i++) {
+  for (let i = 0; i < stateStore.activities.length; i++) {
-    if (stateStore.activities[i][1].direction != "received" || stateStore.activities[i][1].origin == undefined){
+    if (
+      stateStore.activities[i][1].direction != "received" ||
+      stateStore.activities[i][1].origin == undefined
+    ) {
       //Ignore stations without origin and not received type
       //console.warn("HSL: Ignoring " + stateStore.activities[i][0]);
       continue;
     }
     let found = false;
-    for (let ii=0; ii < stateStore.heard_stations.length;ii++) {
+    for (let ii = 0; ii < stateStore.heard_stations.length; ii++) {
-      if (stateStore.heard_stations[ii].origin == stateStore.activities[i][1].origin) {
+      if (
+        stateStore.heard_stations[ii].origin ==
+        stateStore.activities[i][1].origin
+      ) {
         //Station already in HSL, check if newer than one in HSL
-        found=true;
+        found = true;
-        if (stateStore.heard_stations[ii].timestamp < stateStore.activities[i][1].timestamp) {
+        if (
+          stateStore.heard_stations[ii].timestamp <
+          stateStore.activities[i][1].timestamp
+        ) {
           //Update existing entry in HSL
           stateStore.heard_stations[ii] = stateStore.activities[i][1];
         }
-      }  
+      }
     }
     if (found == false) {
       //Station not in HSL, let us add it
       stateStore.heard_stations.push(stateStore.activities[i][1]);
     }
-    }
-    stateStore.heard_stations.sort((a,b) => b.timestamp - a.timestamp); // b - a for reverse sort
   }
-  
+  stateStore.heard_stations.sort((a, b) => b.timestamp - a.timestamp); // b - a for reverse sort
+}
+
 export function eventDispatcher(data) {
   data = JSON.parse(data);
 
@@ -211,10 +220,18 @@ export function eventDispatcher(data) {
             5000,
           );
           return;
-          case "PING_ACK":
+        case "PING_ACK":
-            //Qrv received
+          //Qrv received
-        displayToast("success", "bi-arrow-left-right", "Received ping-ack from " + "callsignisbroken" + " | " +  data["dxgrid"], 5000);
+          displayToast(
-            return;
+            "success",
+            "bi-arrow-left-right",
+            "Received ping-ack from " +
+              "callsignisbroken" +
+              " | " +
+              data["dxgrid"],
+            5000,
+          );
+          return;
       }
 
     case "modem-event":