Update button resend otp on OTP Form

1 files changed, 12 insertions, 10 deletions

diff --git a/src-migrate/modules/account-activation/components/FormOTP.tsx b/src-migrate/modules/account-activation/components/FormOTP.tsx
index 9bc0fb23..6815a088 100644
--- a/src-migrate/modules/account-activation/components/FormOTP.tsx
+++ b/src-migrate/modules/account-activation/components/FormOTP.tsx
@@ -1,4 +1,4 @@
-import { HStack, PinInput, PinInputField, Spinner } from "@chakra-ui/react"
+import { Button, HStack, PinInput, PinInputField, Spinner } from "@chakra-ui/react"
 import { useRouter } from "next/router"
 import { useEffect, useState } from "react"
 import { useMutation } from "react-query"
@@ -86,20 +86,22 @@ const FormOTP = () => {
           </div>
         )}
 
-        <div className="mt-4">
+        <div className="mt-4 flex flex-col items-center">
           {!mutationActivation.data?.activation && (
             <>
               {count > 0 && timeFormat(count)}
 
               {!mutationActivation.data?.activation && count == 0 && (
-                <button
-                  className="text-red-700 underline"
-                  type="button"
-                  onClick={() => mutationActivationReq.mutate({ email })}
-                  disabled={mutationActivationReq.isLoading}
-                >
-                  {mutationActivationReq.isLoading ? <Spinner size='sm' /> : 'Kirim Ulang'}
-                </button>
+                <>
+                  <div className="mb-3">Belum menerima kode apapun?</div>
+
+                  <Button
+                    onClick={() => mutationActivationReq.mutate({ email })}
+                    disabled={mutationActivationReq.isLoading}
+                  >
+                    {mutationActivationReq.isLoading ? <Spinner size='sm' /> : 'Kirim Ulang'}
+                  </Button>
+                </>
               )}
             </>
           )}