Fix all the eslint issues

src/dispatch/static/dispatch/src/case/CaseSignalInstanceTab.vue

@@ -36,31 +36,28 @@
 </template>
 
 <script setup lang="ts">
-import { ref, watch, withDefaults, toRef } from "vue"
+import { ref, watch, toRef } from "vue"
 import { useRoute, useRouter } from "vue-router"
 import { formatRelativeDate } from "@/filters"
 
 import RawSignalViewer from "@/signal/NewRawSignalViewer.vue"
 
-// Define props
-const props = withDefaults(
-  defineProps<{
-    modelValue: {
-      type: any[]
-      required: true
-    }
-    loading: {
-      type: boolean
-      default: false
-      required: true
-    }
-    selectedSignalId: string
-  }>(),
-  {
-    modelValue: [],
-    loading: false,
-  }
-)
+const props = defineProps({
+  modelValue: {
+    type: Array as () => any[],
+    default: () => [],
+    required: true,
+  },
+  loading: {
+    type: Boolean,
+    default: () => false,
+    required: true,
+  },
+  selectedSignalId: {
+    type: String,
+    default: () => "",
+  },
+})
 
 const signalInstances = toRef(props, "modelValue")
 const internalLoading = toRef(props, "loading")

src/dispatch/static/dispatch/src/case/GraphTab.vue

@@ -138,21 +138,6 @@ onConnect((params) => addEdges(params))
 
 const dark = ref(false)
 
-/**
- * To update node properties you can simply use your elements v-model and mutate the elements directly
- * Changes should always be reflected on the graph reactively, without the need to overwrite the elements
- */
-function updatePos() {
-  return elements.value.forEach((el) => {
-    if (isNode(el)) {
-      el.position = {
-        x: Math.random() * 400,
-        y: Math.random() * 400,
-      }
-    }
-  })
-}
-
 /**
  * toObject transforms your current graph data to an easily persist-able object
  */

src/dispatch/static/dispatch/src/case/TimelineTab.vue

@@ -29,7 +29,6 @@ watchEffect(async () => {
   }
 })
 
-const showDetails = ref(false)
 const exportLoading = ref(false)
 
 const sortedEvents = computed(() => {
@@ -79,8 +78,6 @@ const descriptionMap = {
   "Case participants added to conversation.": "added case participants to conversation",
   // Add more mappings as needed...
 }
-
-const menu = ref(false)
 </script>
 
 <template>

src/dispatch/static/dispatch/src/components/DMenu.vue

@@ -7,8 +7,8 @@
       offset="10"
       transition="false"
     >
-      <template #activator="{ props: menu }">
-        <v-btn class="text-subtitle-2 font-weight-regular" variant="text" v-bind="menu">
+      <template #activator="{ props: menuProps }">
+        <v-btn class="text-subtitle-2 font-weight-regular" variant="text" v-bind="menuProps">
           <v-icon>mdi-dots-horizontal</v-icon>
         </v-btn>
       </template>
@@ -36,7 +36,7 @@
 import { ref } from "vue"
 import type { Ref } from "vue"
 
-const props = defineProps<{ options: string[] }>()
+defineProps<{ options: string[] }>()
 
 const menu: Ref<boolean> = ref(false)
 

src/dispatch/static/dispatch/src/components/SearchPopover.vue

@@ -67,11 +67,11 @@ const toggleMenu = () => {
       offset="10"
       transition="false"
     >
-      <template #activator="{ props: menu }">
+      <template #activator="{ props: menuProps }">
         <v-btn
           class="menu-activator text-subtitle-2 font-weight-regular"
           variant="text"
-          v-bind="menu"
+          v-bind="menuProps"
           :ripple="false"
         >
           <span class="dispatch-text-subtitle">
@@ -104,7 +104,7 @@ const toggleMenu = () => {
         </v-row>
         <v-divider />
         <v-list lines="one">
-          <template v-for="(item, _) in filteredItems" :key="index">
+          <div v-for="(item, index) in filteredItems" :key="`item-${index}`">
             <v-list-item
               @click="selectItem(item)"
               @mouseover="hoveredData = item"
@@ -118,7 +118,7 @@ const toggleMenu = () => {
                 <slot :item="item">{{ item }}</slot>
               </span>
             </v-list-item>
-          </template>
+          </div>
         </v-list>
       </v-card>
     </v-menu>

src/dispatch/static/dispatch/src/participant/ParticipantAvatarGroup.vue

@@ -97,8 +97,8 @@ const toggleMenu = () => {
       offset="10"
       transition="false"
     >
-      <template #activator="{ props: menu }">
-        <v-btn variant="text" v-bind="menu">
+      <template #activator="{ props: menuProps }">
+        <v-btn variant="text" v-bind="menuProps">
           <!-- Display Visible Participants -->
           <div class="avatar-row">
             <!-- Display +n Avatar -->

src/dispatch/static/dispatch/src/participant/ParticipantSearchPopover.vue

@@ -169,13 +169,13 @@ const toggleMenu = () => {
       offset="10"
       transition="false"
     >
-      <template #activator="{ props: menu }">
+      <template #activator="{ props: menuProps }">
         <DTooltip :text="props.tooltipLabel" :hotkeys="[hotkey.toUpperCase()]">
           <template #activator="{ tooltip }">
             <v-btn
               class="menu-activator text-subtitle-2 font-weight-regular"
               variant="text"
-              v-bind="{ ...tooltip, ...menu }"
+              v-bind="{ ...tooltip, ...menuProps }"
             >
               <template #prepend>
                 <v-avatar
@@ -214,10 +214,10 @@ const toggleMenu = () => {
         <v-divider />
         <v-list lines="one">
           <v-list-item
-            v-for="(participant, index) in filteredParticipants"
+            v-for="(filteredParticipant, index) in filteredParticipants"
             :key="index"
-            @click="selectParticipant(participant)"
-            @mouseover="hoveredParticipant = participant"
+            @click="selectParticipant(filteredParticipant)"
+            @mouseover="hoveredParticipant = filteredParticipant"
             @mouseleave="hoveredParticipant = ''"
             density="compact"
             rounded="lg"
@@ -228,14 +228,16 @@ const toggleMenu = () => {
               <v-avatar
                 class="mr-n2"
                 size="12px"
-                :style="{ background: getAvatarGradient(participant) }"
+                :style="{ background: getAvatarGradient(filteredParticipant) }"
               />
               <!-- <v-icon class="mr-n6 ml-n2" size="x-small" icon="mdi-account"></v-icon> -->
             </template>
-            <v-list-item-title class="dispatch-text-title">{{ participant }}</v-list-item-title>
+            <v-list-item-title class="dispatch-text-title">
+              {{ filteredParticipant }}
+            </v-list-item-title>
             <template #append>
               <v-icon
-                v-if="participant === selectedParticipant"
+                v-if="filteredParticipant === selectedParticipant"
                 class="ml-2"
                 size="x-small"
                 :color="hoveredParticipant === selectedParticipant ? 'black' : ''"

src/dispatch/static/dispatch/src/signal/SignalInstanceNode.vue

@@ -6,7 +6,7 @@ defineProps<{
   data: any
 }>()
 
-const emit = defineEmits(["openViewer"])
+defineEmits(["openViewer"])
 
 // TODO: (wshel) Future release
 // function openViewer() {