[CodeFactor] Apply fixes

gui/src/components/dynamic_components2.vue

@@ -58,16 +58,8 @@ const gridWidgets = [
     { x: 1, y: 1, w: 3, h: 27 },
     "Mini Heard stations",
   ),
-  new gridWidget(
+  new gridWidget(s_meter, { x: 1, y: 1, w: 2, h: 4 }, "S-Meter"),
-    s_meter,
+  new gridWidget(dbfs_meter, { x: 1, y: 1, w: 2, h: 4 }, "Dbfs 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",
-  ),
 ];
 onMounted(() => {
   grid = GridStack.init({
@@ -77,8 +69,8 @@ onMounted(() => {
     minRow: 50,
     margin: 5,
     resizable: {
-      handles: 'se,sw'
+      handles: "se,sw",
-    }
+    },
   });
 
   grid.on("dragstop", function (event, element) {

gui/src/components/grid_active_audio.vue

@@ -16,14 +16,29 @@ function startStopRecordAudio() {
   <div class="card w-100 h-100">
     <div class="card-header">
       <div class="dropdown">
-        <button class="btn btn-sm btn-outline-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false">
+        <button
-          
+          class="btn btn-sm btn-outline-secondary dropdown-toggle"
-        </button>
+          type="button"
+          data-bs-toggle="dropdown"
+          aria-expanded="false"
+        ></button>
         <i class="bi bi-volume-up" style="font-size: 1rem"></i>&nbsp;
         <strong>Audio</strong>
         <ul class="dropdown-menu">
-          <li><a class="dropdown-item" data-bs-toggle="modal" data-bs-target="#audioModal" href="#">Tune</a></li>
+          <li>
-          <li><a class="dropdown-item" @click="startStopRecordAudio" href="#">Record</a></li>
+            <a
+              class="dropdown-item"
+              data-bs-toggle="modal"
+              data-bs-target="#audioModal"
+              href="#"
+              >Tune</a
+            >
+          </li>
+          <li>
+            <a class="dropdown-item" @click="startStopRecordAudio" href="#"
+              >Record</a
+            >
+          </li>
         </ul>
       </div>
     </div>

gui/src/components/grid_active_heard_stations.vue

@@ -84,7 +84,9 @@ function getMaidenheadDistance(dxGrid) {
                 >
               </td>
               <td>
-                <span class="badge bg-secondary">{{ item[1].activity_type }}</span>
+                <span class="badge bg-secondary">{{
+                  item[1].activity_type
+                }}</span>
               </td>
               <td>
                 <span class="badge bg-secondary">{{ item[1].snr }}</span>

gui/src/components/grid_active_heard_stations_mini.vue

@@ -60,13 +60,11 @@ function getMaidenheadDistance(dxGrid) {
             <!--https://vuejs.org/guide/essentials/list.html-->
             <tr v-for="item in state.activities" :key="item[0]">
               <td>
-                <span class="fs-6">{{
+                <span class="fs-6">{{ getDateTime(item[1].timestamp) }}</span>
-                  getDateTime(item[1].timestamp)
-                }}</span>
               </td>
 
               <td>
-                <span >{{ item[1].origin }}</span>
+                <span>{{ item[1].origin }}</span>
               </td>
               <td>
                 <span>{{ item[1].snr }}</span>

gui/src/components/grid_active_rig_control.vue

@@ -51,7 +51,11 @@ function set_hamlib_rf_level() {
             ></button>
 
             <!-- Dropdown Menu -->
-              <ul class="dropdown-menu" aria-labelledby="dropdownMenuButton" style="z-index: 50;">
+            <ul
+              class="dropdown-menu"
+              aria-labelledby="dropdownMenuButton"
+              style="z-index: 50"
+            >
               <li>
                 <div class="input-group p-1">
                   <span class="input-group-text">frequency</span>
@@ -223,7 +227,6 @@ function set_hamlib_rf_level() {
               <option value="90">90</option>
               <option value="100">100</option>
             </select>
-              
           </div>
         </div>
       </div>

gui/src/components/grid_active_stats.vue

@@ -174,13 +174,18 @@ onMounted(() => {
 
   // init waterfall
   localSpectrum = initWaterfall("waterfall-grid");
-  window.addEventListener("wf-data-avail",function(evt) {localSpectrum.addData(evt.detail);},false);
+  window.addEventListener(
+    "wf-data-avail",
+    function (evt) {
+      localSpectrum.addData(evt.detail);
+    },
+    false,
+  );
 });
-
 </script>
 
 <template>
-  <div class="card h-100" >
+  <div class="card h-100">
     <div class="card-header">
       <div class="btn-group" role="group">
         <div
@@ -324,8 +329,6 @@ onMounted(() => {
           data
         </button>
       </div>
-
-
     </div>
     <div class="card-body w-100 h-100 overflow-auto">
       <div class="tab-content h-100 w-100" id="nav-stats-tabContent">
@@ -338,10 +341,7 @@ onMounted(() => {
           role="stats_tabpanel"
           aria-labelledby="list-waterfall-list"
         >
-          <canvas
+          <canvas id="waterfall-grid" class="force-gpu"></canvas>
-            id="waterfall-grid"
-            class="force-gpu"
-          ></canvas>
         </div>
         <div
           class="tab-pane fade"

gui/src/components/grid_dbfs.vue

@@ -5,13 +5,9 @@ setActivePinia(pinia);
 
 import { useStateStore } from "../store/stateStore.js";
 const state = useStateStore(pinia);
-
 </script>
 <template>
-             <div
+  <div class="progress mb-0 me-4 rounded-0 rounded-top" style="height: 22px">
-              class="progress mb-0 me-4 rounded-0 rounded-top"
-              style="height: 22px"
-            >
     <div
       class="progress-bar progress-bar-striped bg-primary force-gpu"
       id="dbfs_level"
@@ -28,10 +24,7 @@ const state = useStateStore(pinia);
       {{ state.dbfs_level }} dBFS
     </p>
   </div>
-            <div
+  <div class="progress mb-0 me-4 rounded-0 rounded-bottom" style="height: 8px">
-              class="progress mb-0 me-4 rounded-0 rounded-bottom"
-              style="height: 8px"
-            >
     <div
       class="progress-bar progress-bar-striped bg-warning"
       role="progressbar"

gui/src/components/grid_s-meter.vue

@@ -5,13 +5,9 @@ setActivePinia(pinia);
 
 import { useStateStore } from "../store/stateStore.js";
 const state = useStateStore(pinia);
-
 </script>
 <template>
-             <div
+  <div class="progress mb-0 me-4 rounded-0 rounded-top" style="height: 22px">
-              class="progress mb-0 me-4 rounded-0 rounded-top"
-              style="height: 22px;"
-            >
     <div
       class="progress-bar progress-bar-striped bg-primary force-gpu"
       id="noise_level"
@@ -28,10 +24,7 @@ const state = useStateStore(pinia);
       S-Meter(dB): {{ state.s_meter_strength_raw }}
     </p>
   </div>
-            <div
+  <div class="progress mb-0 me-4 rounded-0 rounded-bottom" style="height: 8px">
-              class="progress mb-0 me-4 rounded-0 rounded-bottom"
-              style="height: 8px"
-            >
     <div
       class="progress-bar progress-bar-striped bg-warning"
       role="progressbar"

gui/src/components/main_active_heard_stations.vue

@@ -29,7 +29,6 @@ function getDateTime(timestampRaw) {
 
 function getMaidenheadDistance(dxGrid) {
   try {
-    
     return parseInt(distance(settings.remote.STATION.mygrid, dxGrid));
   } catch (e) {
     console.warn(e);
@@ -105,7 +104,9 @@ function getMaidenheadDistance(dxGrid) {
                 >
               </td>
               <td>
-                <span class="badge bg-secondary">{{ item[1].activity_type }}</span>
+                <span class="badge bg-secondary">{{
+                  item[1].activity_type
+                }}</span>
               </td>
               <td>
                 <span class="badge bg-secondary">{{ item[1].snr }}</span>

gui/src/components/main_active_stats.vue

@@ -179,7 +179,13 @@ export default {
 
     // init waterfall
     localSpectrum = initWaterfall("waterfall-main");
-    window.addEventListener("wf-data-avail",function(evt) {localSpectrum.addData(evt.detail);},false);
+    window.addEventListener(
+      "wf-data-avail",
+      function (evt) {
+        localSpectrum.addData(evt.detail);
+      },
+      false,
+    );
   },
 };
 </script>
@@ -362,7 +368,13 @@ export default {
           <canvas
             ref="waterfall-main"
             id="waterfall-main"
-            style="position: relative; z-index: 2;aspect-ratio:unset; width: 100%; height: 200px;"
+            style="
+              position: relative;
+              z-index: 2;
+              aspect-ratio: unset;
+              width: 100%;
+              height: 200px;
+            "
             class="force-gpu"
           ></canvas>
         </div>

gui/src/components/settings_exp.vue

@@ -9,7 +9,6 @@ import { settingsStore as settings } from "../store/settingsStore.js";
 </script>
 
 <template>
-
   <div class="input-group input-group-sm mb-1">
     <label class="input-group-text w-50">Enable FSK mode</label>
     <label class="input-group-text w-50">

gui/src/components/settings_gui.vue

@@ -130,5 +130,4 @@ function saveSettings() {
       </div>
     </label>
   </div>
-
 </template>

gui/src/js/waterfallHandler.js

@@ -20,7 +20,8 @@ export function initWaterfall(id) {
 
 export function addDataToWaterfall(data) {
   data = JSON.parse(data);
-  window.dispatchEvent(new CustomEvent("wf-data-avail", {detail: data}));}
+  window.dispatchEvent(new CustomEvent("wf-data-avail", { detail: data }));
+}
 /**
  * Setwaterfall colormap array by index
  * @param {number} index colormap index to use

gui/src/store/settingsStore.js

@@ -13,7 +13,6 @@ export const settingsStore = reactive({
     high_graphics: true,
     update_channel: "alpha",
     enable_sys_notification: true,
-
   },
   remote: {
     AUDIO: {