code adaptation for API changes; tons changed to kilos

src/components/utils/StockThumbnails.vue

@@ -28,18 +28,18 @@
 </template>
 
 <script setup lang="ts">
-import { Ref, computed, nextTick, ref, watch } from 'vue';
-import { useStore } from '../../store';
-import { IStock } from '../../types';
+import { Ref, computed, nextTick, ref, watch } from "vue";
+import { useStore } from "../../store";
+import { IStock } from "../../types";
 
 const store = useStore();
-const emit = defineEmits(['listItemClick']);
+const emit = defineEmits(["listItemClick"]);
 
 const thumbnailsRef = ref() as Ref<HTMLElement>;
 const draggedIndex = ref(-1);
 
 const onListItemClick = (index: number) => {
-  emit('listItemClick', index);
+  emit("listItemClick", index);
 };
 
 const stockImageError = (e: Event, stock: IStock) => {
@@ -52,13 +52,15 @@ watch(
     if (index < 0) return;
 
     nextTick(() => {
-      (thumbnailsRef.value as HTMLElement).querySelector(`div:nth-child(${index + 1})`)?.scrollIntoView({
-        block: 'nearest',
-        inline: 'start',
-        behavior: 'smooth',
-      });
+      (thumbnailsRef.value as HTMLElement)
+        .querySelector(`div:nth-child(${index + 1})`)
+        ?.scrollIntoView({
+          block: "nearest",
+          inline: "start",
+          behavior: "smooth",
+        });
     });
-  }
+  },
 );
 
 // Dragging images
@@ -69,7 +71,9 @@ const onDragStart = (vehicleIndex: number) => {
 const onDrop = (e: DragEvent, vehicleIndex: number) => {
   e.preventDefault();
 
-  let targetEl = thumbnailsRef.value.querySelector(`div:nth-child(${vehicleIndex + 1})`);
+  let targetEl = thumbnailsRef.value.querySelector(
+    `div:nth-child(${vehicleIndex + 1})`,
+  );
 
   if (!targetEl && draggedIndex.value != -1) return;
 
@@ -110,7 +114,7 @@ const allowDrop = (e: DragEvent) => {
   -moz-user-select: none;
   -webkit-user-select: none;
 
-  &[data-selected='true'] {
+  &[data-selected="true"] {
     background-color: rebeccapurple;
   }
 
@@ -119,7 +123,7 @@ const allowDrop = (e: DragEvent) => {
     margin: 0 1em;
   }
 
-  &[data-sponsor='true'] > b {
+  &[data-sponsor="true"] > b {
     color: salmon;
   }