feat(inboxes): add inbox disable toggle

app/javascript/dashboard/components-next/Conversation/InboxName.vue

@@ -10,10 +10,16 @@ defineProps({
 </script>
 
 <template>
-  <div :title="inbox.name" class="flex items-center gap-0.5 min-w-0">
+  <div :title="inbox.name" class="flex items-center gap-1 min-w-0">
     <ChannelIcon :inbox="inbox" class="size-4 flex-shrink-0 text-n-slate-11" />
     <span class="truncate text-body-main text-n-slate-11">
       {{ inbox.name }}
     </span>
+    <span
+      v-if="inbox.active === false"
+      class="shrink-0 rounded-md bg-n-ruby-3 px-1 py-0.5 text-xs font-medium text-n-ruby-11"
+    >
+      {{ $t('INBOX_MGMT.DISABLED') }}
+    </span>
   </div>
 </template>

app/javascript/dashboard/components-next/sidebar/ChannelLeaf.vue

@@ -27,6 +27,10 @@ const props = defineProps({
 const reauthorizationRequired = computed(() => {
   return props.inbox.reauthorization_required;
 });
+
+const inboxDisabled = computed(() => {
+  return props.inbox.active === false;
+});
 </script>
 
 <template>
@@ -34,6 +38,13 @@ const reauthorizationRequired = computed(() => {
     <ChannelIcon :inbox="inbox" class="size-4" />
   </span>
   <div class="flex-1 truncate min-w-0">{{ label }}</div>
+  <div
+    v-if="inboxDisabled"
+    v-tooltip.top-end="$t('INBOX_MGMT.DISABLED')"
+    class="grid place-content-center size-5 bg-n-ruby-3 rounded-full"
+  >
+    <Icon icon="i-woot-alert" class="size-3 text-n-ruby-9" />
+  </div>
   <SidebarUnreadBadge :count="badgeCount" />
   <div
     v-if="reauthorizationRequired"