style : update revisi style

src/module/division_new/ui/list_division.tsx

@@ -1,5 +1,5 @@
 'use client'
-import { currentScroll, globalRole, LayoutDrawer, LayoutNavbarNew, SkeletonSingle, TEMA } from '@/module/_global';
+import { currentScroll, globalRole, LayoutDrawer, LayoutNavbarNew, SkeletonList, SkeletonSingle, TEMA } from '@/module/_global';
 import { ActionIcon, Avatar, Box, Card, Center, Divider, Flex, Grid, Group, Skeleton, Text, TextInput, Title } from '@mantine/core';
 import { useRouter, useSearchParams } from 'next/navigation';
 import React, { useEffect, useState } from 'react';
@@ -12,6 +12,7 @@ import { IDataDivison } from '../lib/type_division';
 import { funGetAllDivision } from '../lib/api_division';
 import toast from 'react-hot-toast';
 import { useHookstate } from '@hookstate/core';
+import _ from 'lodash';
 
 export default function ListDivision() {
   const [isList, setIsList] = useState(false)
@@ -138,18 +139,12 @@ export default function ListDivision() {
         </Grid>
         <Box pt={20}>
           {roleLogin.get() == 'supadmin' && <Text>Filter by: {nameGroup}</Text>}
-          {loading ?
-            <>
-              <Skeleton width={"100%"} height={100} radius={"md"} />
-            </>
-            :
-            <Box bg={tema.get().utama} p={10} style={{ borderRadius: 10 }}>
-              <Text fw={'bold'} c={'white'}>Total Divisi</Text>
+            <Box bg={tema.get().bgTotalKegiatan} p={10} style={{ borderRadius: 10 }}>
+              <Text fw={'bold'} c={tema.get().utama}>Total Divisi</Text>
               <Flex justify={'center'} align={'center'} h={'100%'}>
-                <Text fz={40} fw={'bold'} c={'white'}>{jumlah}</Text>
+                <Text fz={40} fw={'bold'} c={tema.get().utama}>{jumlah}</Text>
               </Flex>
             </Box>
-          }
         </Box>
         {isList ? (
           <Box pt={20}>
@@ -158,10 +153,16 @@ export default function ListDivision() {
                 .fill(null)
                 .map((_, i) => (
                   <Box key={i}>
-                    <SkeletonSingle />
+                    <SkeletonList/>
                   </Box>
                 ))
               :
+              _.isEmpty(data)
+              ?
+              <Box style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', height: '50vh' }}>
+                <Text c="dimmed" ta={"center"} fs={"italic"}>Tidak ada Divisi</Text>
+              </Box>
+              :
               data?.map((v: any, i: any) => {
                 return (
                   <Box key={i}>
@@ -181,11 +182,6 @@ export default function ListDivision() {
                               size={50}
                               aria-label="Gradient action icon"
                               radius={100}
-                              // gradient={{
-                              //   from: '#DFDA7C',
-                              //   to: '#F2AF46',
-                              //   deg: 174
-                              // }}
                               bg={tema.get().bgFiturHome}
                             >
                               <HiMiniUserGroup size={25} color={tema.get().utama} />