eslint & prettier update; api fetching from static server

src/components/sections/StockSection.vue

@@ -23,12 +23,12 @@
 </template>
 
 <script lang="ts" setup>
-import { computed, onMounted, ref } from "vue";
-import { useStore } from "../../store";
-import StockListTab from "../tabs/StockListTab.vue";
-import StockGeneratorTab from "../tabs/StockGeneratorTab.vue";
-import NumberGeneratorTab from "../tabs/NumberGeneratorTab.vue";
-import WikiListTab from "../tabs/WikiListTab.vue";
+import { computed, onMounted, ref } from 'vue';
+import { useStore } from '../../store';
+import StockListTab from '../tabs/StockListTab.vue';
+import StockGeneratorTab from '../tabs/StockGeneratorTab.vue';
+import NumberGeneratorTab from '../tabs/NumberGeneratorTab.vue';
+import WikiListTab from '../tabs/WikiListTab.vue';
 
 const sectionButtonRefs = ref([]);
 
@@ -36,36 +36,36 @@ const store = useStore();
 type SectionMode = typeof store.stockSectionMode;
 
 const sectionModes: SectionMode[] = [
-  "stock-list",
-  "wiki-list",
-  "number-generator",
-  "stock-generator",
+  'stock-list',
+  'wiki-list',
+  'number-generator',
+  'stock-generator',
 ];
 
 onMounted(() => {
-  window.addEventListener("keydown", (e) => {
+  window.addEventListener('keydown', (e) => {
     if (e.target instanceof HTMLInputElement) return;
 
     if (/[1234]/.test(e.key)) {
       const keyNum = Number(e.key);
       store.stockSectionMode = sectionModes[keyNum - 1];
-      (sectionButtonRefs.value[keyNum - 1] as HTMLButtonElement).focus();
+      (sectionButtonRefs.value[keyNum - 1] as HTMLButtonElement)?.focus();
     }
   });
 });
 
 const chosenSectionComponent = computed(() => {
   switch (store.stockSectionMode) {
-    case "stock-list":
+    case 'stock-list':
       return StockListTab;
 
-    case "wiki-list":
+    case 'wiki-list':
       return WikiListTab;
 
-    case "stock-generator":
+    case 'stock-generator':
       return StockGeneratorTab;
 
-    case "number-generator":
+    case 'number-generator':
       return NumberGeneratorTab;
 
     default:
@@ -79,7 +79,7 @@ function chooseSection(sectionId: SectionMode) {
 </script>
 
 <style lang="scss">
-@import "../../styles/global.scss";
+@import '../../styles/global.scss';
 
 // Tab change animation
 .tab-change {
@@ -121,14 +121,14 @@ function chooseSection(sectionId: SectionMode) {
       left: 50%;
       transform: translateX(-50%);
 
-      content: "";
+      content: '';
       width: 0;
       height: 2px;
       transition: all 100ms;
       background-color: $accentColor;
     }
 
-    &[data-selected="true"]::after {
+    &[data-selected='true']::after {
       width: 100%;
     }
   }