LAN-611: Add skeleton loading component to action cell

orangehrm · Jun 9, 2023 · e324302 · e324302
1 parent ae735c8
commit e324302
Showing 1 changed file with 5 additions and 1 deletion.
diff --git a/components/src/core/components/CardTable/Cell/Actions.vue b/components/src/core/components/CardTable/Cell/Actions.vue
@@ -1,6 +1,8 @@
 <template>
   <div class="oxd-table-cell-actions">
+    <oxd-skeleton v-if="loading" animate></oxd-skeleton>
     <component
+      v-else
       v-for="(action, key) in actions"
       :key="key"
       :is="getComponent(action, key)"
@@ -20,15 +22,17 @@ import {ActionsCellConfig, Action, RowItem, ActionCellEvent} from './types';
 import IconButton from '@orangehrm/oxd/core/components/Button/Icon.vue';
 import Button from '@orangehrm/oxd/core/components/Button/Button.vue';
 import Dropdown from '@orangehrm/oxd/core/components/CardTable/Cell/Dropdown.vue';
+import Skeleton from '@orangehrm/oxd/core/components/Skeleton/Skeleton.vue';
 
 export default defineComponent({
   name: 'oxd-table-cell-actions',
 
   mixins: [cellMixin],
 
   components: {
-    'oxd-icon-button': IconButton,
     'oxd-button': Button,
+    'oxd-skeleton': Skeleton,
+    'oxd-icon-button': IconButton,
     'oxd-table-dropdown': Dropdown,
   },