feat : update revisi

Deskripsi:
- update tambah anggota
- update list anggota
- update tambah kalender
- update kalender name indonesia

No Issue

src/module/calender/ui/update_list_users.tsx

@@ -1,5 +1,5 @@
 "use client"
-import { LayoutNavbarNew, WARNA } from '@/module/_global';
+import { LayoutNavbarNew, SkeletonSingle, WARNA } from '@/module/_global';
 import { funGetDivisionById, IDataMemberDivision } from '@/module/division_new';
 import { useHookstate } from '@hookstate/core';
 import { Avatar, Box, Button, Center, Divider, Flex, Group, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
@@ -51,21 +51,26 @@ export default function UpdateListUsers({ onClose }: { onClose: (val: any) => vo
   const [isData, setData] = useState<IDataMemberDivision[]>([])
   const member = useHookstate(globalCalender)
   const [selectAll, setSelectAll] = useState(false)
+  const [loading, setLoading] = useState(true)
 
   async function getData() {
     try {
+      setLoading(true)
       const response = await funGetDivisionById(param.id)
       if (response.success) {
         setData(response.data.member)
         if (member.length > 0) {
           setSelectedFiles(JSON.parse(JSON.stringify(member.get())))
         }
+        setLoading(false)
       } else {
         toast.error(response.message)
       }
     } catch (error) {
       console.log(error)
       toast.error("Gagal mendapatkan anggota, coba lagi nanti");
+    } finally {
+      setLoading(false)
     }
   }
 
@@ -112,64 +117,74 @@ export default function UpdateListUsers({ onClose }: { onClose: (val: any) => vo
 
   return (
     <Box>
-    <LayoutNavbarNew
-      // back=""
-      title="Pilih Anggota"
-      menu
-    />
-    <Box p={20}>
-      <Group justify="space-between" mt={20} onClick={handleSelectAll}>
-        <Text c={WARNA.biruTua} fw={"bold"}>
-          Pilih Semua Anggota
-        </Text>
-        {selectAll ? <FaCheck style={{ marginRight: 10 }} /> : ""}
-      </Group>
-      <Box mt={15}>
-        {isData.map((v, i) => {
-          const isSelected = selectedFiles.some((i: any) => i?.idUser == v.idUser);
-          return (
-            <Box mb={15} key={i} onClick={() => handleFileClick(i)}>
-              <Flex justify={"space-between"} align={"center"}>
-                <Group>
-                  <Avatar src={"v.image"} alt="it's me" size="lg" />
-                  <Text style={{
-                    cursor: 'pointer',
-                    display: 'flex',
-                    alignItems: 'center',
-                  }}>
-                    {v.name}
-                  </Text>
-                </Group>
-                <Text
-                  style={{
-                    cursor: 'pointer',
-                    display: 'flex',
-                    alignItems: 'center',
-                    paddingLeft: 20,
-                  }}
-                >
-                  {isSelected ? <FaCheck style={{ marginRight: 10 }} /> : ""}
-                </Text>
-              </Flex>
-              <Divider my={"md"} />
-            </Box>
-          );
-        })}
-      </Box>
-      <Box mt={"xl"}>
-        <Button
-          c={"white"}
-          bg={WARNA.biruTua}
-          size="lg"
-          radius={30}
-          fullWidth
-          onClick={() => {onSubmit()}}
-        >
-          Simpan
-        </Button>
+      <LayoutNavbarNew
+        // back=""
+        title="Pilih Anggota"
+        menu
+      />
+      <Box p={20}>
+        <Group justify="space-between" mt={20} onClick={handleSelectAll}>
+          <Text c={WARNA.biruTua} fw={"bold"}>
+            Pilih Semua Anggota
+          </Text>
+          {selectAll ? <FaCheck style={{ marginRight: 10 }} /> : ""}
+        </Group>
+        {loading ?
+          Array(4)
+          .fill(null)
+          .map((_, i) => (
+             <Box key={i}>
+                <SkeletonSingle />
+             </Box>
+          ))
+          :
+          <Box mt={20}>
+            {isData.map((v, i) => {
+              const isSelected = selectedFiles.some((i: any) => i?.idUser == v.idUser);
+              return (
+                <Box mb={15} key={i} onClick={() => handleFileClick(i)}>
+                  <Flex justify={"space-between"} align={"center"}>
+                    <Group>
+                      <Avatar src={"v.image"} alt="it's me" size="lg" />
+                      <Text style={{
+                        cursor: 'pointer',
+                        display: 'flex',
+                        alignItems: 'center',
+                      }}>
+                        {v.name}
+                      </Text>
+                    </Group>
+                    <Text
+                      style={{
+                        cursor: 'pointer',
+                        display: 'flex',
+                        alignItems: 'center',
+                        paddingLeft: 20,
+                      }}
+                    >
+                      {isSelected ? <FaCheck style={{ marginRight: 10 }} /> : ""}
+                    </Text>
+                  </Flex>
+                  <Divider my={"md"} />
+                </Box>
+              );
+            })}
+          </Box>
+        }
+        <Box mt={"xl"}>
+          <Button
+            c={"white"}
+            bg={WARNA.biruTua}
+            size="lg"
+            radius={30}
+            fullWidth
+            onClick={() => { onSubmit() }}
+          >
+            Simpan
+          </Button>
+        </Box>
       </Box>
     </Box>
-  </Box>
   );
 }