From c18e538371352be6d5077d9e148e308d5ebc9bf8 Mon Sep 17 00:00:00 2001
From: Sthefani <silveira.sthefani1@gmail.com>
Date: Thu, 19 Oct 2023 16:47:02 -0300
Subject: [PATCH 1/2] fix spacing pagination

---
 .../config/channels/whatsapp/components/tabs/AccountTab.vue   | 4 ++--
 src/views/whatsAppCatalogs/Base.vue                           | 1 +
 .../components/tabs/__snapshots__/AccountTab.spec.js.snap     | 4 ++--
 3 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/components/config/channels/whatsapp/components/tabs/AccountTab.vue b/src/components/config/channels/whatsapp/components/tabs/AccountTab.vue
index 79f286bf..84b8d290 100644
--- a/src/components/config/channels/whatsapp/components/tabs/AccountTab.vue
+++ b/src/components/config/channels/whatsapp/components/tabs/AccountTab.vue
@@ -8,7 +8,7 @@
               {{ $t('WhatsApp.config.templates.title') }}
             </div>
 
-            <unnnic-button
+            <unnnic-button-next
               class="account-tab__content__info__templates__buttons__button"
               @click="navigateToTemplates"
               type="secondary"
@@ -16,7 +16,7 @@
               scheme="feedback-green"
             >
               {{ $t('WhatsApp.config.templates.button') }}
-            </unnnic-button>
+            </unnnic-button-next>
           </div>
           <div class="account-tab__content__info__templates__buttons">
             <div class="account-tab__content__info__templates__buttons__title">
diff --git a/src/views/whatsAppCatalogs/Base.vue b/src/views/whatsAppCatalogs/Base.vue
index c7ffdeba..3e8b5c91 100644
--- a/src/views/whatsAppCatalogs/Base.vue
+++ b/src/views/whatsAppCatalogs/Base.vue
@@ -54,5 +54,6 @@
     display: flex;
     flex-direction: column;
     height: 100%;
+    overflow: auto;
   }
 </style>
diff --git a/tests/unit/specs/components/config/channels/whatsapp/components/tabs/__snapshots__/AccountTab.spec.js.snap b/tests/unit/specs/components/config/channels/whatsapp/components/tabs/__snapshots__/AccountTab.spec.js.snap
index 102ac6c6..b1af6032 100644
--- a/tests/unit/specs/components/config/channels/whatsapp/components/tabs/__snapshots__/AccountTab.spec.js.snap
+++ b/tests/unit/specs/components/config/channels/whatsapp/components/tabs/__snapshots__/AccountTab.spec.js.snap
@@ -9,9 +9,9 @@ exports[`whatsapp/components/tabs/AccountTab.vue should be rendered properly 1`]
           <div class="account-tab__content__info__templates__buttons__title">
             Templates
           </div>
-          <unnnicbutton-stub type="secondary" size="small" scheme="feedback-green" class="account-tab__content__info__templates__buttons__button">
+          <unnnic-button-next type="secondary" size="small" scheme="feedback-green" class="account-tab__content__info__templates__buttons__button">
             See my templates
-          </unnnicbutton-stub>
+          </unnnic-button-next>
         </div>
         <div class="account-tab__content__info__templates__buttons">
           <div class="account-tab__content__info__templates__buttons__title">

From e918cade5a36cd6228b354ab41614a5942ae155c Mon Sep 17 00:00:00 2001
From: Paulo Bernardo <paulo.bernardo@weni.ai>
Date: Mon, 30 Oct 2023 16:43:42 -0300
Subject: [PATCH 2/2] fix: set scroll only to catalog list

---
 .../whatsapp/components/tabs/AccountTab.vue         |  6 +++---
 src/components/whatsAppCatalogs/List.vue            |  3 ++-
 src/views/whatsAppCatalogs/Base.vue                 |  5 +++--
 src/views/whatsAppCatalogs/List.vue                 | 13 ++++++++++---
 4 files changed, 18 insertions(+), 9 deletions(-)

diff --git a/src/components/config/channels/whatsapp/components/tabs/AccountTab.vue b/src/components/config/channels/whatsapp/components/tabs/AccountTab.vue
index 84b8d290..5d7d3442 100644
--- a/src/components/config/channels/whatsapp/components/tabs/AccountTab.vue
+++ b/src/components/config/channels/whatsapp/components/tabs/AccountTab.vue
@@ -8,15 +8,15 @@
               {{ $t('WhatsApp.config.templates.title') }}
             </div>
 
-            <unnnic-button-next
+            <unnnic-button
               class="account-tab__content__info__templates__buttons__button"
               @click="navigateToTemplates"
-              type="secondary"
+              type="alternative"
               size="small"
               scheme="feedback-green"
             >
               {{ $t('WhatsApp.config.templates.button') }}
-            </unnnic-button-next>
+            </unnnic-button>
           </div>
           <div class="account-tab__content__info__templates__buttons">
             <div class="account-tab__content__info__templates__buttons__title">
diff --git a/src/components/whatsAppCatalogs/List.vue b/src/components/whatsAppCatalogs/List.vue
index 2827ad85..de2f73a7 100644
--- a/src/components/whatsAppCatalogs/List.vue
+++ b/src/components/whatsAppCatalogs/List.vue
@@ -284,7 +284,6 @@
     flex-direction: column;
     flex: 1;
     overflow: hidden;
-    margin-top: $unnnic-spacing-lg;
 
     &__header {
       display: flex;
@@ -320,6 +319,8 @@
       flex-direction: column;
       flex: 1;
       gap: $unnnic-spacing-md;
+      overflow: auto;
+      padding-right: $unnnic-spacing-xs;
     }
 
     &__pagination {
diff --git a/src/views/whatsAppCatalogs/Base.vue b/src/views/whatsAppCatalogs/Base.vue
index 3e8b5c91..2ee1b719 100644
--- a/src/views/whatsAppCatalogs/Base.vue
+++ b/src/views/whatsAppCatalogs/Base.vue
@@ -53,7 +53,8 @@
   .whatsapp-catalogs-base {
     display: flex;
     flex-direction: column;
-    height: 100%;
-    overflow: auto;
+    gap: $unnnic-spacing-lg;
+    height: 100vh;
+    overflow: hidden;
   }
 </style>
diff --git a/src/views/whatsAppCatalogs/List.vue b/src/views/whatsAppCatalogs/List.vue
index 1bfb0929..cc790854 100644
--- a/src/views/whatsAppCatalogs/List.vue
+++ b/src/views/whatsAppCatalogs/List.vue
@@ -1,8 +1,7 @@
 <template>
   <div class="whatsapp-catalogs">
-    <div v-if="$route.name === 'WhatsApp Catalogs List'">
-      <List />
-    </div>
+    <List v-if="$route.name === 'WhatsApp Catalogs List'" />
+
     <router-view v-else />
   </div>
 </template>
@@ -17,3 +16,11 @@
     },
   };
 </script>
+
+<styles scoped lang="scss">
+.whatsapp-catalogs {
+  display: flex;
+  overflow: hidden;
+  height: 100%;
+}
+</styles>