From 46cfd0fbc55ab552d01c5f1ec8d327d31b7722f4 Mon Sep 17 00:00:00 2001
From: amel <amel@amel.local>
Date: Fri, 27 Sep 2024 12:04:14 +0800
Subject: [PATCH 1/2] upd

Deskripsi:
- tugas hari ini di halaman detail divisi

No Issues
---
 src/app/api/division/[id]/detail/route.ts    | 22 ++++++++++++++++----
 src/module/division_new/lib/type_division.ts |  3 ++-
 src/module/division_new/ui/list_task.tsx     |  4 ++--
 3 files changed, 22 insertions(+), 7 deletions(-)

diff --git a/src/app/api/division/[id]/detail/route.ts b/src/app/api/division/[id]/detail/route.ts
index 1f8d403..730e272 100644
--- a/src/app/api/division/[id]/detail/route.ts
+++ b/src/app/api/division/[id]/detail/route.ts
@@ -86,7 +86,12 @@ export async function GET(request: Request, context: { params: { id: string } })
                idDivision: String(id),
                status: 0,
                isActive: true,
-               dateStart: new Date(),
+               dateStart: {
+                  lte: new Date()
+               },
+               dateEnd: {
+                  gte: new Date()
+               },
                DivisionProject: {
                   status: {
                      lt: 3
@@ -98,13 +103,22 @@ export async function GET(request: Request, context: { params: { id: string } })
                title: true,
                dateStart: true,
                dateEnd: true,
+               DivisionProject: {
+                  select: {
+                     title: true
+                  }
+               }
+            },
+            orderBy: {
+               dateEnd: "asc"
             }
          })
 
          allData = tugas.map((v: any) => ({
-            ..._.omit(v, ["dateStart", "dateEnd"]),
-            dateStart: moment(v.dateStart).format("LL"),
-            dateEnd: moment(v.dateEnd).format("LL")
+            ..._.omit(v, ["dateStart", "dateEnd", "DivisionProject"]),
+            dateStart: moment(v.dateStart).format("ll"),
+            dateEnd: moment(v.dateEnd).format("ll"),
+            projectTitle: v.DivisionProject.title
          }))
       } else if (kategori == "new-file") {
          allData = await prisma.divisionDocumentFolderFile.findMany({
diff --git a/src/module/division_new/lib/type_division.ts b/src/module/division_new/lib/type_division.ts
index 6487148..4bd051a 100644
--- a/src/module/division_new/lib/type_division.ts
+++ b/src/module/division_new/lib/type_division.ts
@@ -33,7 +33,8 @@ export interface IDataTaskOnDetailDivision {
    id: string,
    title: string,
    dateStart: string,
-   dateEnd: string
+   dateEnd: string,
+   projectTitle: string
 }
 
 export interface IDataKalenderOnDetailDivision {
diff --git a/src/module/division_new/ui/list_task.tsx b/src/module/division_new/ui/list_task.tsx
index 9ae596f..b989569 100644
--- a/src/module/division_new/ui/list_task.tsx
+++ b/src/module/division_new/ui/list_task.tsx
@@ -73,11 +73,11 @@ export default function ListTaskOnDetailDivision() {
                      base: isMobile ? 230 : 300,
                      md: 400
                   }} onClick={() => router.push(`/task/${v.id}`)} bg={"white"}  style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }}>
-                     <Text fw={'bold'} c={tema.get().utama} lineClamp={1}>{_.startCase(v.title)}</Text>
+                     <Text fw={'bold'} c={tema.get().utama} lineClamp={1}>{v.title+' - '+ v.projectTitle}</Text>
                      <Group justify="space-between" mt={20}>
                         <Group gap={5} align="center">
                            <CiClock2 size={18} />
-                           <Text fz={13}>{v.dateStart}</Text>
+                           <Text fz={13}>{v.dateStart} - {v.dateEnd}</Text>
                         </Group >
                      </Group>
                   </Box>

From 5e6079785aea76c7d3aff62e5af83516d4745963 Mon Sep 17 00:00:00 2001
From: amel <amel@amel.local>
Date: Fri, 27 Sep 2024 15:36:37 +0800
Subject: [PATCH 2/2] fix: edit profile

Deskripsi:
- validasi edit profile

No Issues
---
 src/app/(application)/profile/edit/page.tsx   |   4 +-
 src/module/_global/layout/layout_modal.tsx    |  11 +-
 .../user/profile/ui/edit_profile copy.tsx     | 311 ------------------
 src/module/user/profile/ui/edit_profile.tsx   | 160 ++++-----
 4 files changed, 85 insertions(+), 401 deletions(-)
 delete mode 100644 src/module/user/profile/ui/edit_profile copy.tsx

diff --git a/src/app/(application)/profile/edit/page.tsx b/src/app/(application)/profile/edit/page.tsx
index e87a120..da3e588 100644
--- a/src/app/(application)/profile/edit/page.tsx
+++ b/src/app/(application)/profile/edit/page.tsx
@@ -1,10 +1,8 @@
 import { EditProfile } from "@/module/user"
-import EditProfileCopy from "@/module/user/profile/ui/edit_profile copy"
 
 function Page() {
    return (
-      // <EditProfile />
-      <EditProfileCopy/>
+      <EditProfile />
    )
 }
 
diff --git a/src/module/_global/layout/layout_modal.tsx b/src/module/_global/layout/layout_modal.tsx
index 88b9cdb..b93d8b7 100644
--- a/src/module/_global/layout/layout_modal.tsx
+++ b/src/module/_global/layout/layout_modal.tsx
@@ -1,12 +1,9 @@
 import { Button, Flex, Modal, SimpleGrid, Text } from '@mantine/core';
-import React, { useState } from 'react';
-import { BsQuestionCircleFill } from 'react-icons/bs';
 import { useMediaQuery } from '@mantine/hooks';
+import { BsQuestionCircleFill } from 'react-icons/bs';
 
-export default function LayoutModal({ opened, onClose, description, onYes }: { opened: boolean, onClose: () => void, description: string, onYes: (val: boolean) => void }) {
-  const [isValModal, setValModal] = useState(opened)
+export default function LayoutModal({ opened, onClose, description, onYes, loading }: { opened: boolean, onClose: () => void, loading?: boolean, description: string, onYes: (val: boolean) => void }) {
   const isMobile = useMediaQuery('(max-width: 768px)');
-  const [loading, setLoading] = useState(false)
   return (
     <Modal styles={{
       body: {
@@ -28,9 +25,7 @@ export default function LayoutModal({ opened, onClose, description, onYes }: { o
         {isMobile ?
           <>
             <Button loading={loading} fullWidth size="lg" radius={'xl'} bg={'green'} onClick={() => {
-              setLoading(true)
               onYes(true)
-              setLoading(false)
             }}>YA</Button>
             <Button fullWidth size="lg" radius={'xl'} bg={'#F1C1CF'} c={'#D30B30'} onClick={() => onYes(false)}>TIDAK</Button>
           </>
@@ -38,9 +33,7 @@ export default function LayoutModal({ opened, onClose, description, onYes }: { o
           <>
             <Button fullWidth size="lg" radius={'xl'} bg={'#F1C1CF'} c={'#D30B30'} onClick={() => onYes(false)}>TIDAK</Button>
             <Button loading={loading} fullWidth size="lg" radius={'xl'} bg={'green'} onClick={() => {
-              setLoading(true)
               onYes(true)
-              setLoading(false)
             }}>YA</Button>
           </>
 
diff --git a/src/module/user/profile/ui/edit_profile copy.tsx b/src/module/user/profile/ui/edit_profile copy.tsx
deleted file mode 100644
index 16776f0..0000000
--- a/src/module/user/profile/ui/edit_profile copy.tsx	
+++ /dev/null
@@ -1,311 +0,0 @@
-"use client";
-import { LayoutNavbarNew, TEMA } from "@/module/_global";
-import {
-  Avatar,
-  Box,
-  Button,
-  Flex,
-  Indicator,
-  Modal,
-  rem,
-  Select,
-  Skeleton,
-  Stack,
-  Text,
-  TextInput,
-} from "@mantine/core";
-import toast from "react-hot-toast";
-import LayoutModal from "@/module/_global/layout/layout_modal";
-import { useRef, useState } from "react";
-import { IEditDataProfile, IProfileById } from "../lib/type_profile";
-import {
-  funEditProfileByCookies,
-  funGetProfileByCookies,
-} from "../lib/api_profile";
-import { useShallowEffect } from "@mantine/hooks";
-import { FaCamera, FaShare } from "react-icons/fa6";
-import { Dropzone } from "@mantine/dropzone";
-import _ from "lodash";
-import { useRouter } from "next/navigation";
-import { useHookstate } from "@hookstate/core";
-import { useForm } from "@mantine/form";
-
-export default function EditProfileCopy() {
-  const [isValModal, setValModal] = useState(false);
-  const [isDataEdit, setDataEdit] = useState<IProfileById[]>([]);
-  const openRef = useRef<() => void>(null);
-  const [img, setIMG] = useState<any | null>();
-  const [imgForm, setImgForm] = useState<any>();
-  const router = useRouter();
-  const [loading, setLoading] = useState(true);
-  const tema = useHookstate(TEMA);
-
-  const [data, setData] = useState<IEditDataProfile>({
-    id: "",
-    nik: "",
-    name: "",
-    phone: "",
-    email: "",
-    gender: "",
-    img: "",
-  });
-
-  async function getAllProfile() {
-    try {
-      setLoading(true);
-      const res = await funGetProfileByCookies();
-      setData(res.data);
-      setIMG(`https://wibu-storage.wibudev.com/api/files/${res.data.img}`);
-      setLoading(false);
-    } catch (error) {
-      console.error(error);
-    } finally {
-      setLoading(false);
-    }
-  }
-
-  useShallowEffect(() => {
-    getAllProfile();
-  }, []);
-
-  async function onEditProfile(val: boolean) {
-    try {
-      if (val) {
-        const fd = new FormData();
-        fd.append("file", imgForm);
-        fd.append("data", JSON.stringify(data));
-
-        const res = await funEditProfileByCookies(fd);
-        if (res.success) {
-          setValModal(false);
-          toast.success(res.message);
-          router.push("/profile");
-        } else {
-          toast.error(res.message);
-        }
-      }
-      setValModal(false);
-    } catch (error) {
-      console.error(error);
-      toast.error("Gagal edit profil, coba lagi nanti");
-    }
-  }
-
-  return (
-    <Box>
-      <LayoutNavbarNew back="" title="Edit Profill" menu="" />
-        <Stack
-          align="center"
-          justify="center"
-          gap="xs"
-          pt={30}
-          px={20}
-          pb={100}
-        >
-          <Dropzone
-            openRef={openRef}
-            onDrop={async (files) => {
-              if (!files || _.isEmpty(files))
-                return toast.error("Tidak ada gambar yang dipilih");
-              setImgForm(files[0]);
-              const buffer = URL.createObjectURL(
-                new Blob([new Uint8Array(await files[0].arrayBuffer())])
-              );
-              setIMG(buffer);
-            }}
-            activateOnClick={false}
-            maxSize={1 * 1024 ** 2}
-            accept={["image/png", "image/jpeg", "image/heic"]}
-            onReject={(files) => {
-              return toast.error(
-                "File yang diizinkan: .png, .jpg, dan .heic  dengan ukuran maksimal 1 MB"
-              );
-            }}
-          ></Dropzone>
-
-          {loading ? (
-            <Skeleton height={150} width={150} radius={"100"} />
-          ) : (
-            <Indicator
-              offset={20}
-              withBorder
-              inline
-              color={tema.get().bgFiturHome}
-              position="bottom-end"
-              label={<FaCamera size={20} />}
-              size={40}
-              onClick={() => openRef.current?.()}
-            >
-              <Avatar
-                size="150"
-                radius={"100"}
-                src={img}
-                style={{
-                  border: `1px solid ${"#C1BFBFFF"}`,
-                }}
-              />
-            </Indicator>
-          )}
-          {loading ? (
-            <>
-              <Skeleton height={40} mt={20} radius={30} />
-              <Skeleton height={40} mt={20} radius={30} />
-              <Skeleton height={40} mt={20} radius={30} />
-              <Skeleton height={40} mt={20} radius={30} />
-              <Skeleton height={40} mt={20} radius={30} />
-            </>
-          ) : (
-            <>
-              <TextInput
-                size="md"
-                type="number"
-                radius={30}
-                placeholder="NIK"
-                withAsterisk
-                label="NIK"
-                w={"100%"}
-                styles={{
-                  input: {
-                    color: tema.get().utama,
-                    borderRadius: tema.get().utama,
-                    borderColor: tema.get().utama,
-                  },
-                }}
-                onChange={(e) => {
-                  setData({ ...data, nik: e.target.value });
-                }}
-                value={data.nik}
-              />
-              <TextInput
-                size="md"
-                type="text"
-                radius={30}
-                placeholder="Nama"
-                withAsterisk
-                  label="Nama"
-                  value={data.name}
-                w={"100%"}
-                styles={{
-                  input: {
-                    color: tema.get().utama,
-                    borderRadius: tema.get().utama,
-                    borderColor: tema.get().utama,
-                  },
-                }}
-                onChange={(e) => {
-                  setData({ ...data, name: e.target.value });
-                }}
-              />
-              <TextInput
-                size="md"
-                type="email"
-                radius={30}
-                placeholder="Email"
-                withAsterisk
-                label="Email"
-                w={"100%"}
-                styles={{
-                  input: {
-                    color: tema.get().utama,
-                    borderRadius: tema.get().utama,
-                    borderColor: tema.get().utama,
-                  },
-                }}
-                onChange={(e) => {
-                  setData({ ...data, email: e.target.value });
-                }}
-                value={data.email}
-              />
-              <TextInput
-                size="md"
-                type="number"
-                radius={30}
-                placeholder="8xx xxxx xxxx"
-                withAsterisk
-                label="Nomor Telepon"
-                w={"100%"}
-                styles={{
-                  input: {
-                    color: tema.get().utama,
-                    borderRadius: tema.get().utama,
-                    borderColor: tema.get().utama,
-                  },
-                }}
-                leftSection={<Text>+62</Text>}
-                onChange={(e) => {
-                  setData({ ...data, phone: e.target.value });
-                }}
-                value={data.phone}
-              />
-              <Select
-                placeholder="Jenis Kelamin"
-                label="Jenis Kelamin"
-                w={"100%"}
-                size="md"
-                required
-                withAsterisk
-                radius={30}
-                styles={{
-                  input: {
-                    color: tema.get().utama,
-                    borderRadius: tema.get().utama,
-                    borderColor: tema.get().utama,
-                  },
-                }}
-                data={[
-                  {
-                    value: "M",
-                    label: "Laki-laki",
-                  },
-                  {
-                    value: "F",
-                    label: "Perempuan",
-                  },
-                ]}
-                onChange={(val: any) => {
-                  setData({ ...data, gender: val });
-                }}
-                value={data.gender}
-              />
-            </>
-          )}
-        </Stack>
-        <Box
-          pos={"fixed"}
-          bottom={0}
-          p={rem(20)}
-          w={"100%"}
-          style={{
-            maxWidth: rem(550),
-            zIndex: 999,
-            backgroundColor: `${tema.get().bgUtama}`,
-          }}
-        >
-          {loading ? (
-            <Skeleton height={50} radius={30} />
-          ) : (
-            <Button
-              c={"white"}
-              bg={tema.get().utama}
-              size="md"
-              radius={30}
-              fullWidth
-                type="submit"
-                
-            >
-              Simpan
-            </Button>
-          )}
-        </Box>
-      <LayoutModal
-        opened={isValModal}
-        onClose={() => setValModal(false)}
-        description="Apakah Anda yakin ingin
-        melakukan perubahan data?"
-        onYes={(val) => {
-          onEditProfile(val);
-        }}
-      />
-    </Box>
-  );
-}
diff --git a/src/module/user/profile/ui/edit_profile.tsx b/src/module/user/profile/ui/edit_profile.tsx
index d3190ec..9421ed3 100644
--- a/src/module/user/profile/ui/edit_profile.tsx
+++ b/src/module/user/profile/ui/edit_profile.tsx
@@ -1,33 +1,17 @@
 "use client";
 import { LayoutNavbarNew, TEMA } from "@/module/_global";
-import {
-  Avatar,
-  Box,
-  Button,
-  Flex,
-  Indicator,
-  Modal,
-  rem,
-  Select,
-  Skeleton,
-  Stack,
-  Text,
-  TextInput,
-} from "@mantine/core";
-import toast from "react-hot-toast";
 import LayoutModal from "@/module/_global/layout/layout_modal";
-import { useRef, useState } from "react";
-import { IEditDataProfile, IProfileById } from "../lib/type_profile";
-import {
-  funEditProfileByCookies,
-  funGetProfileByCookies,
-} from "../lib/api_profile";
-import { useShallowEffect } from "@mantine/hooks";
-import { FaCamera, FaShare } from "react-icons/fa6";
+import { useHookstate } from "@hookstate/core";
+import { Avatar, Box, Button, Indicator, rem, Select, Skeleton, Stack, Text, TextInput } from "@mantine/core";
 import { Dropzone } from "@mantine/dropzone";
+import { useShallowEffect } from "@mantine/hooks";
 import _ from "lodash";
 import { useRouter } from "next/navigation";
-import { useHookstate } from "@hookstate/core";
+import { useRef, useState } from "react";
+import toast from "react-hot-toast";
+import { FaCamera } from "react-icons/fa6";
+import { funEditProfileByCookies, funGetProfileByCookies, } from "../lib/api_profile";
+import { IEditDataProfile, IProfileById } from "../lib/type_profile";
 
 export default function EditProfile() {
   const [isValModal, setValModal] = useState(false);
@@ -38,6 +22,7 @@ export default function EditProfile() {
   const router = useRouter();
   const [loading, setLoading] = useState(true);
   const tema = useHookstate(TEMA);
+  const [loadingKonfirmasi, setLoadingKonfirmasi] = useState(false);
 
   const [touched, setTouched] = useState({
     nik: false,
@@ -78,7 +63,7 @@ export default function EditProfile() {
   async function onEditProfile(val: boolean) {
     try {
       if (val) {
-
+        setLoadingKonfirmasi(true)
         const fd = new FormData();
         fd.append("file", imgForm);
         fd.append("data", JSON.stringify(data));
@@ -96,6 +81,55 @@ export default function EditProfile() {
     } catch (error) {
       console.error(error);
       toast.error("Gagal edit profil, coba lagi nanti");
+    } finally {
+      setLoadingKonfirmasi(false)
+    }
+  }
+
+
+  function onCheck() {
+    if (Object.values(touched).some((v) => v == true))
+      return false
+    setValModal(true)
+  }
+
+
+  function onValidation(kategori: string, val: string) {
+    if (kategori == 'nik') {
+      setData({ ...data, nik: val })
+      if (val === "" || val.length !== 16) {
+        setTouched({ ...touched, nik: true })
+      } else {
+        setTouched({ ...touched, nik: false })
+      }
+    } else if (kategori == 'name') {
+      setData({ ...data, name: val })
+      if (val === "") {
+        setTouched({ ...touched, name: true })
+      } else {
+        setTouched({ ...touched, name: false })
+      }
+    } else if (kategori == 'phone') {
+      setData({ ...data, phone: val })
+      if (val == "" || !(val.length >= 10 && val.length <= 15)) {
+        setTouched({ ...touched, phone: true })
+      } else {
+        setTouched({ ...touched, phone: false })
+      }
+    } else if (kategori == 'email') {
+      setData({ ...data, email: val })
+      if (val == "" || !/^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/.test(val)) {
+        setTouched({ ...touched, email: true })
+      } else {
+        setTouched({ ...touched, email: false })
+      }
+    } else if (kategori == 'gender') {
+      setData({ ...data, gender: val })
+      if (val == "" || val == "null") {
+        setTouched({ ...touched, gender: true })
+      } else {
+        setTouched({ ...touched, gender: false })
+      }
     }
   }
 
@@ -149,18 +183,18 @@ export default function EditProfile() {
         )}
         {loading ? (
           <>
-            <Skeleton height={40} mt={20} radius={30} />
-            <Skeleton height={40} mt={20} radius={30} />
-            <Skeleton height={40} mt={20} radius={30} />
-            <Skeleton height={40} mt={20} radius={30} />
-            <Skeleton height={40} mt={20} radius={30} />
+            <Skeleton height={40} mt={20} radius={10} />
+            <Skeleton height={40} mt={20} radius={10} />
+            <Skeleton height={40} mt={20} radius={10} />
+            <Skeleton height={40} mt={20} radius={10} />
+            <Skeleton height={40} mt={20} radius={10} />
           </>
         ) : (
           <>
             <TextInput
               size="md"
               type="number"
-              radius={30}
+              radius={10}
               placeholder="NIK"
               withAsterisk
               label="NIK"
@@ -172,12 +206,8 @@ export default function EditProfile() {
                   borderColor: tema.get().utama,
                 },
               }}
-              onChange={(e) => {
-                setData({ ...data, nik: e.target.value });
-                setTouched({ ...touched, nik: false });
-              }}
+              onChange={(e) => { onValidation('nik', e.target.value) }}
               value={data.nik}
-              onBlur={() => setTouched({ ...touched, nik: true })}
               error={
                 touched.nik &&
                 (data.nik === ""
@@ -190,7 +220,7 @@ export default function EditProfile() {
             <TextInput
               size="md"
               type="text"
-              radius={30}
+              radius={10}
               placeholder="Nama"
               withAsterisk
               label="Nama"
@@ -202,12 +232,8 @@ export default function EditProfile() {
                   borderColor: tema.get().utama,
                 },
               }}
-              onChange={(e) => {
-                setData({ ...data, name: e.target.value });
-                setTouched({ ...touched, name: false });
-              }}
+              onChange={(e) => { onValidation('name', e.target.value) }}
               value={data.name}
-              onBlur={() => setTouched({ ...touched, name: true })}
               error={
                 touched.name &&
                 (data.name == "" ? "Nama Tidak Boleh Kosong" : null)
@@ -216,7 +242,7 @@ export default function EditProfile() {
             <TextInput
               size="md"
               type="email"
-              radius={30}
+              radius={10}
               placeholder="Email"
               withAsterisk
               label="Email"
@@ -228,19 +254,15 @@ export default function EditProfile() {
                   borderColor: tema.get().utama,
                 },
               }}
-              onChange={(e) => {
-                setData({ ...data, email: e.target.value });
-                setTouched({ ...touched, email: false });
-              }}
+              onChange={(e) => { onValidation('email', e.target.value) }}
               value={data.email}
-              onBlur={() => setTouched({ ...touched, email: true })}
               error={
                 touched.email &&
                 (data.email == ""
                   ? "Email Tidak Boleh Kosong"
                   : !/^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/.test(
-                        data.email
-                      )
+                    data.email
+                  )
                     ? "Email tidak valid"
                     : null)
               }
@@ -248,7 +270,7 @@ export default function EditProfile() {
             <TextInput
               size="md"
               type="number"
-              radius={30}
+              radius={10}
               placeholder="8xx xxxx xxxx"
               withAsterisk
               label="Nomor Telepon"
@@ -261,15 +283,12 @@ export default function EditProfile() {
                 },
               }}
               leftSection={<Text>+62</Text>}
-              onChange={(e) => {
-                setData({ ...data, phone: e.target.value });
-                setTouched({ ...touched, phone: false });
-              }}
+              onChange={(e) => { onValidation('phone', e.target.value); }}
               value={data.phone}
-              onBlur={() => setTouched({ ...touched, phone: true })}
               error={
                 touched.phone &&
-                (data.phone == "" ? "Nomor Telepon Tidak Boleh Kosong" : null)
+                (data.phone == "" ? "Nomor Telepon Tidak Boleh Kosong"
+                  : !(data.phone.length >= 10 && data.phone.length <= 15) ? "Nomor Telepon Tidak Valid" : null)
               }
             />
             <Select
@@ -279,7 +298,7 @@ export default function EditProfile() {
               size="md"
               required
               withAsterisk
-              radius={30}
+              radius={10}
               styles={{
                 input: {
                   color: tema.get().utama,
@@ -297,15 +316,11 @@ export default function EditProfile() {
                   label: "Perempuan",
                 },
               ]}
-              onChange={(val: any) => {
-                setData({ ...data, gender: val });
-                setTouched({ ...touched, gender: false });
-              }}
+              onChange={(val: any) => { onValidation('gender', val) }}
               value={data.gender}
-              onBlur={() => setTouched({ ...touched, gender: true })}
               error={
                 touched.gender &&
-                (data.gender == "" ? "Jenis Kelamin Tidak Boleh Kosong" : null)
+                (data.gender == "" || data.gender == null ? "Jenis Kelamin Tidak Boleh Kosong" : null)
               }
             />
           </>
@@ -328,28 +343,17 @@ export default function EditProfile() {
           <Button
             c={"white"}
             bg={tema.get().utama}
-            size="md"
+            size="lg"
             radius={30}
             fullWidth
-            onClick={() => {
-              if (
-                data.nik !== "" &&
-                data.name !== "" &&
-                data.email !== "" &&
-                data.phone !== "" &&
-                data.gender !== ""
-              ) {
-                setValModal(true);
-              } else {
-                toast.error("Mohon lengkapi semua form");
-              }
-            }}
+            onClick={() => { onCheck() }}
           >
             Simpan
           </Button>
         )}
       </Box>
       <LayoutModal
+        loading={loadingKonfirmasi}
         opened={isValModal}
         onClose={() => setValModal(false)}
         description="Apakah Anda yakin ingin