fix: Bulk actions agent loading (#4874)

app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/AgentSelector.vue

@@ -22,7 +22,10 @@
       />
     </div>
     <div class="container">
-      <div v-if="uiFlags.isUpdating" class="agent__list-loading">
+      <div
+        v-if="assignableAgentsUiFlags.isFetching"
+        class="agent__list-loading"
+      >
         <spinner />
         <p>{{ $t('BULK_ACTION.AGENT_LIST_LOADING') }}</p>
       </div>
@@ -171,7 +174,7 @@ export default {
   transform-origin: top right;
   width: auto;
   z-index: var(--z-index-twenty);
-
+  min-width: var(--space-giga);
   .header {
     padding: var(--space-one);
 
@@ -182,7 +185,7 @@ export default {
   }
 
   .container {
-    max-height: 24rem;
+    max-height: var(--space-giga);
     overflow-y: auto;
     .agent__list-container {
       height: 100%;
@@ -264,5 +267,6 @@ ul {
   align-items: center;
   justify-content: center;
   flex-direction: column;
+  padding: var(--space-two);
 }
 </style>

app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/LabelActions.vue

@@ -110,7 +110,7 @@ export default {
 .labels-list {
   display: flex;
   flex-direction: column;
-  max-height: 24rem;
+  max-height: var(--space-giga);
   min-height: auto;
 
   .labels-list__header {
@@ -157,8 +157,8 @@ export default {
   border-radius: var(--border-radius-large);
   border: 1px solid var(--s-50);
   box-shadow: var(--shadow-dropdown-pane);
-  max-width: 24rem;
-  min-width: 24rem;
+  max-width: var(--space-giga);
+  min-width: var(--space-giga);
   position: absolute;
   right: 4.5rem;
   top: var(--space-larger);
@@ -176,7 +176,7 @@ export default {
   }
 
   .container {
-    max-height: 24rem;
+    max-height: var(--space-giga);
     overflow-y: auto;
 
     .label__list-container {
@@ -204,7 +204,7 @@ export default {
   .triangle {
     display: block;
     position: absolute;
-    right: 2rem;
+    right: var(--space-two);
     text-align: left;
     top: calc(var(--space-slab) * -1);
     z-index: var(--z-index-one);

app/javascript/shared/assets/stylesheets/spacing.scss

@@ -15,7 +15,8 @@
   --space-larger: 4.8rem;
   --space-jumbo: 6.4rem;
   --space-mega: 10rem;
-
+  --space-giga: 24rem;
+  
   --space-minus-micro: -0.2rem;
   --space-minus-smaller: -0.4rem;
   --space-minus-small: -0.8rem;