#Job done

## feat
- Fix bug login
### No issuue

src/app_modules/auth/validasi/view.tsx

@@ -15,7 +15,11 @@ import { gs_nomor, gs_otp } from "../state/state";
 import { Warna } from "@/app/lib/warna";
 import { useState } from "react";
 import { myConsole } from "@/app/fun/my_console";
-import { IconChevronLeft, IconCircleLetterH } from "@tabler/icons-react";
+import {
+  IconChevronLeft,
+  IconCircleLetterH,
+  IconCloudLockOpen,
+} from "@tabler/icons-react";
 import toast from "react-simple-toasts";
 import { ApiHipmi } from "@/app/lib/api";
 import { useRouter } from "next/navigation";
@@ -24,12 +28,18 @@ import { useFocusTrap } from "@mantine/hooks";
 import { NotifBerhasil } from "@/app_modules/donasi/component/notifikasi/notif_berhasil";
 import { NotifGagal } from "@/app_modules/donasi/component/notifikasi/notif_gagal";
 import { NotifPeringatan } from "@/app_modules/donasi/component/notifikasi/notif_peringatan";
+import Countdown from "react-countdown";
+import { ComponentGlobal_NotifikasiPeringatan } from "@/app_modules/component_global/notif_global/notifikasi_peringatan";
+import { auth_funValidasi } from "../fun/fun_validasi";
+import { ComponentGlobal_NotifikasiBerhasil } from "@/app_modules/component_global/notif_global/notifikasi_berhasil";
+import { RouterAuth } from "@/app/lib/router_hipmi/router_auth";
+import { RouterHome } from "@/app/lib/router_hipmi/router_home";
+import { auth_funEditAktivasiKodeOtpById } from "../fun/fun_edit_aktivasi_kode_otp_by_id";
 
-export default function Validasi() {
+export default function Validasi({ dataOtp }: { dataOtp: any }) {
   const router = useRouter();
-  const [nomor, setnomor] = useAtom(gs_nomor);
-  const [code, setCode] = useAtom(gs_otp);
-
+  const [nomor, setnomor] = useState(dataOtp.nomor);
+  const [code, setCode] = useState(dataOtp.otp);
   const [inputCode, setInputOtp] = useState("");
   const focusTrapRef = useFocusTrap();
 
@@ -43,34 +53,53 @@ export default function Validasi() {
     if (!inputCode) return toast("Lengkapi Kode");
     if (body.otp != inputCode) return toast("Kode Salah");
 
-    await fetch(ApiHipmi.validasi, {
-      method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-      },
-      body: JSON.stringify(body),
-    })
-      .then((res) => res.json())
-      .then((val) => {
-        myConsole(val);
-        if (val.status == 200) {
-          setTimeout(() => router.push("/dev/home"), 2000);
-          funGetUserProfile(val.data.id);
-          NotifBerhasil("Berhasil Login");
-        } else {
-          router.push("/dev/auth/register");
-          NotifPeringatan("Silahkan Registrasi");
-        }
-      });
+    // await fetch(ApiHipmi.validasi, {
+    //   method: "POST",
+    //   headers: {
+    //     "Content-Type": "application/json",
+    //   },
+    //   body: JSON.stringify(body),
+    // })
+    //   .then((res) => res.json())
+    //   .then((val) => {
+    //     myConsole(val);
+    //     if (val.status == 200) {
+    //       setTimeout(() => router.push("/dev/home"), 2000);
+    //       funGetUserProfile(val.data.id);
+    //       NotifBerhasil("Berhasil Login");
+    //     } else {
+    //       router.push("/dev/auth/register");
+    //       NotifPeringatan("Silahkan Registrasi");
+    //     }
+    //   });
   };
 
+  async function onVerifikasi() {
+    if (!inputCode)
+      return ComponentGlobal_NotifikasiPeringatan("Lengkapi Kode");
+    if (code != inputCode)
+      return ComponentGlobal_NotifikasiPeringatan("Kode Salah");
+
+    await auth_funValidasi(nomor).then(async (res) => {
+      if (res.status === 200) {
+        await auth_funEditAktivasiKodeOtpById(dataOtp.id).then((val) => {
+          if (val.status === 200) {
+            ComponentGlobal_NotifikasiBerhasil(res.message);
+            router.push(RouterHome.main_home);
+          } else {
+            ComponentGlobal_NotifikasiPeringatan(val.message);
+          }
+        });
+      } else {
+        ComponentGlobal_NotifikasiBerhasil(res.message);
+        router.push(RouterAuth.register + dataOtp.id);
+      }
+    });
+  }
+
   return (
     <>
-      {/* {JSON.stringify(nomor)}
-      {JSON.stringify(code)} */}
-     
-
-      <Flex
+      {/* <Flex
         align={"center"}
         justify={"center"}
         direction={"column"}
@@ -112,7 +141,53 @@ export default function Validasi() {
             Submit
           </Button>
         </Flex>
-      </Flex>
+      </Flex> */}
+
+      {/* <pre>{JSON.stringify(code)}</pre> */}
+
+      <Center h={"80%"}>
+        <Stack px={"lg"} spacing={"xl"} w={{ base: 400 }} justify="center">
+          <Center>
+            <IconCloudLockOpen size={130} />
+          </Center>
+
+          <Stack spacing={50}>
+            <Stack spacing={0}>
+              <Title order={4}>Verifikasi Kode OTP</Title>
+              <Text fs={"italic"} fz={"xs"}>
+                Silahkan masukan 4 digit kode otp yang dikirim ke{" "}
+                <Text span inherit fw={"bold"}>
+                  +{nomor}
+                </Text>
+              </Text>
+            </Stack>
+
+            <Center>
+              <PinInput
+                ref={focusTrapRef}
+                spacing={"md"}
+                mt={"md"}
+                onChange={(val) => {
+                  setInputOtp(val);
+                }}
+              />
+            </Center>
+            <Stack>
+              <Button
+                radius={"md"}
+                compact
+                h={40}
+                color={"teal"}
+                onClick={() => {
+                  onVerifikasi();
+                }}
+              >
+                <Text>VERIFIKASI</Text>
+              </Button>
+            </Stack>
+          </Stack>
+        </Stack>
+      </Center>
     </>
   );
 }