diff --git a/src/components/PersonnelTable.vue b/src/components/PersonnelTable.vue
index f3314be1f9ab0922adb4223052aed7a37cabee3f..f6d500b88ec52f014574f8eb36463364ea178ce7 100644
--- a/src/components/PersonnelTable.vue
+++ b/src/components/PersonnelTable.vue
@@ -16,6 +16,7 @@
       :options.sync="options"
       :footer-props="footerProps"
       :server-items-length="total"
+      :hide-default-footer="personnelList.length === 0"
     >
       <template v-slot:[`item.permission`]="{ item }">
         <span v-if="userPermission !== permissionTypes.SUPER_ADMIN">
diff --git a/src/views/super-admin/Teams.vue b/src/views/super-admin/Teams.vue
index 908940efb2c3920648767426d6cf74b7a3ab9ac5..ddfb2e133c9041f4e3b8f519debf93e982a4f677 100644
--- a/src/views/super-admin/Teams.vue
+++ b/src/views/super-admin/Teams.vue
@@ -20,6 +20,7 @@
           mobile-breakpoint="800"
           loading-text="Loading Teams ..."
           class="background-transparent position-relative"
+          :hide-default-footer="selectedTeams.length === 0"
         >
           <template v-slot:top>
             <div
@@ -120,7 +121,7 @@
           </template>
         </v-data-table>
 
-        <div class="d-flex flex-wrap mb-3">
+        <div class="d-flex flex-wrap mt-5 mb-3">
           <v-tooltip top>
             <template v-slot:activator="{ on, attrs }">
               <v-btn
diff --git a/src/views/super-admin/Training.vue b/src/views/super-admin/Training.vue
index 1176ca6e225afcd99dceafcb3826061eff7004b2..3cb4c933ce35c1bb3df166c44ae0560e8709977b 100644
--- a/src/views/super-admin/Training.vue
+++ b/src/views/super-admin/Training.vue
@@ -20,6 +20,7 @@
           mobile-breakpoint="800"
           loading-text="Loading Courses..."
           class="background-transparent position-relative"
+          :hide-default-footer="selectedCourses === 0"
         >
           <template v-slot:top>
             <div
@@ -189,7 +190,7 @@
           </template>
         </v-data-table>
 
-        <div class="d-flex flex-wrap mb-3">
+        <div class="d-flex flex-wrap mt-5 mb-3">
           <v-tooltip top>
             <template v-slot:activator="{ on, attrs }">
               <v-btn
diff --git a/tests/unit/components/PersonnelTable.spec.js b/tests/unit/components/PersonnelTable.spec.js
index 3dd83e5a13c144600542340691abb6a4251b79f7..b8dc4c7248fb55260b9255a3e21a8209ef7f77a7 100644
--- a/tests/unit/components/PersonnelTable.spec.js
+++ b/tests/unit/components/PersonnelTable.spec.js
@@ -26,7 +26,7 @@ describe("PersonnelTable", () => {
       .fn()
       .mockResolvedValue(mockUsersResponse);
 
-    UserService.updateUserPersonnelType = jest.fn().mockResolvedValue();
+    UserService.updateUserPersonnelType = jest.fn().mockResolvedValue([]);
 
     const store = new Vuex.Store({
       state: {
@@ -37,6 +37,14 @@ describe("PersonnelTable", () => {
     });
 
     const wrapper = shallowMount(PersonnelTable, {
+      data() {
+        return {
+          personnel: {
+            listItems: [{ id: 1 }],
+          },
+          params: {},
+        };
+      },
       store,
       localVue,
     });
@@ -79,7 +87,7 @@ describe("PersonnelTable", () => {
       .mockResolvedValue({ users: [], meta: { total: 0 } });
 
     const wrapper = shallowMount(PersonnelTable);
-    await wrapper.vm.fetchData({});
+    await wrapper.vm.fetchData({ personnelType: "test" });
     expect(wrapper.vm.personnel.listItems).toEqual([]);
   });