From 65af76c6271c0f8df40c837f2c715d82d947cb24 Mon Sep 17 00:00:00 2001
From: Marc Vilanova <39573146+mvilanova@users.noreply.github.com>
Date: Wed, 1 Nov 2023 15:34:41 -0700
Subject: [PATCH] Fixes issues with Signals table after migration to Vue3
 (#3922)

---
 .../dispatch/src/signal/SignalPopover.vue     |  2 +-
 .../dispatch/src/signal/TableInstance.vue     | 28 +++++++++----------
 2 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/src/dispatch/static/dispatch/src/signal/SignalPopover.vue b/src/dispatch/static/dispatch/src/signal/SignalPopover.vue
index 59d0fd9981ae..0396617cc5d7 100644
--- a/src/dispatch/static/dispatch/src/signal/SignalPopover.vue
+++ b/src/dispatch/static/dispatch/src/signal/SignalPopover.vue
@@ -4,7 +4,7 @@
       <template #activator="{ props }">
         <v-chip pill size="small" v-bind="props">
           <template #prepend>
-            <v-avatar color="teal">
+            <v-avatar color="teal" start>
               {{ initials(value.name) }}
             </v-avatar>
           </template>
diff --git a/src/dispatch/static/dispatch/src/signal/TableInstance.vue b/src/dispatch/static/dispatch/src/signal/TableInstance.vue
index 7d736848a36b..9a90cdbb9148 100644
--- a/src/dispatch/static/dispatch/src/signal/TableInstance.vue
+++ b/src/dispatch/static/dispatch/src/signal/TableInstance.vue
@@ -32,8 +32,8 @@
             :loading="loading"
             loading-text="Loading... Please wait"
           >
-            <template #item.create_case="{ value }">
-              <v-checkbox-btn model="value.signal.create_case" disabled />
+            <template #item.signal.create_case="{ value }">
+              <v-checkbox-btn :model-value="value" disabled />
             </template>
             <template #item.case="{ value }">
               <case-popover v-if="value" :value="value" />
@@ -41,11 +41,11 @@
             <template #item.signal="{ value }">
               <signal-popover :value="value" />
             </template>
-            <template #item.canary="{ value }">
-              <v-checkbox-btn v-model="value.signal.canary" disabled />
+            <template #item.signal.canary="{ value }">
+              <v-checkbox-btn :model-value="value" disabled />
             </template>
-            <template #item.project.name="{ item, value }">
-              <v-chip size="small" :color="item.project.color">
+            <template #item.signal.project.name="{ item, value }">
+              <v-chip size="small" :color="item.signal.project.color">
                 {{ value }}
               </v-chip>
             </template>
@@ -107,14 +107,14 @@ export default {
   data() {
     return {
       headers: [
-        { text: "Create Case", value: "create_case", sortable: false },
-        { text: "Case", value: "case", sortable: false },
-        { text: "Signal Definition", value: "signal", sortable: false },
-        { text: "Canary", value: "canary", sortable: false },
-        { text: "Filter Action", value: "filter_action", sortable: true },
-        { text: "Project", value: "project.name", sortable: true },
-        { text: "Created At", value: "created_at" },
-        { text: "", value: "data-table-actions", sortable: false, align: "end" },
+        { title: "Create Case", value: "signal.create_case", sortable: false },
+        { title: "Case", value: "case", sortable: false },
+        { title: "Signal Definition", value: "signal", sortable: false },
+        { title: "Canary", value: "signal.canary", sortable: false },
+        { title: "Filter Action", value: "filter_action", sortable: true },
+        { title: "Project", value: "signal.project.name", sortable: true },
+        { title: "Created At", value: "created_at" },
+        { title: "", value: "data-table-actions", sortable: false, align: "end" },
       ],
     }
   },