sarlink/sarlink-portal
7
0
Fork 0
mirror of https://github.com/i701/sarlink-portal.git synced 2025-04-20 03:50:20 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix: enhance verification feedback in VerifyRegistrationOTP function and update UI messages
All checks were successful
Build and Push Docker Images / Build and Push Docker Images (push) Successful in 5m46s
Details

Browse Source
This commit is contained in:
i701 2025-04-18 19:34:29 +05:00
parent e0e3de064a
commit 3703b3e8fc
Signed by: i701
GPG Key ID: 54A0DA1E26D8E587
2 changed files with 37 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
components/auth/verify-registration-otp-form.tsx
View File

@ -3,6 +3,7 @@
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input"; import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label"; import { Label } from "@/components/ui/label";
import { cn } from "@/lib/utils";
import { VerifyRegistrationOTP } from "@/queries/authentication"; import { VerifyRegistrationOTP } from "@/queries/authentication";
import { Loader2 } from "lucide-react"; import { Loader2 } from "lucide-react";
import Link from "next/link"; import Link from "next/link";
@ -29,10 +30,17 @@ export default function VerifyRegistrationOTPForm({
> >
<div className="grid pb-4 pt-4 gap-4 px-4"> <div className="grid pb-4 pt-4 gap-4 px-4">
<div className="flex flex-col gap-4"> <div className="flex flex-col gap-4">
<p className="bg-green-100 dark:bg-sarLinkOrange/50 border border-green-900/50 dark:border-sarLinkOrange/50 rounded p-2 text-center text-sm"> {state.status === "verify_success" ? (
Please enter the OTP sent to your mobile number [{phone_number}] to <p className="bg-green-100 dark:bg-dark-green-800 border border-green-900/50 text-green-700 rounded p-2 text-center text-sm">
verify and complete your registration {state.message}
</p> </p>
) : (
<p className="bg-sarLinkOrange/50 border border-yellow-900/50 dark:border-sarLinkOrange/50 rounded p-2 text-center text-sm text-gray-900 dark:text-gray-300">
Please enter the OTP sent to your mobile number [{phone_number}]
to verify and complete your registration.
</p>
)}
<Label htmlFor="otp-number" className="sr-only text-gray-500"> <Label htmlFor="otp-number" className="sr-only text-gray-500">
Enter the OTP Enter the OTP
</Label> </Label>
@ -49,7 +57,10 @@ export default function VerifyRegistrationOTPForm({
maxLength={6} maxLength={6}
type="number" type="number"
placeholder="Enter OTP" placeholder="Enter OTP"
className="bg-white text-black" className={cn(
"bg-white text-black",
state.status === "verify_success" && "hidden",
)}
/> />
{state?.status === "error" && ( {state?.status === "error" && (
<p className="text-yellow-500 text-sm">{state.message}</p> <p className="text-yellow-500 text-sm">{state.message}</p>
@ -59,7 +70,10 @@ export default function VerifyRegistrationOTPForm({
)} )}
</div> </div>
<Button <Button
className="w-full" className={cn(
"w-full",
state.status === "verify_success" && "hidden",
)}
disabled={isPending || state.status === "verify_error"} disabled={isPending || state.status === "verify_error"}
type="submit" type="submit"
> >

31
queries/authentication.ts
View File

@ -180,27 +180,26 @@ export async function VerifyRegistrationOTP(
}; };
} }
if (userVerified.verified) { if (userVerified.verified) {
const [mobileLoginError, mobileLoginResponse] = await tryCatch(
backendMobileLogin({ mobile: mobile as string }),
);
if (mobileLoginError) {
return { return {
message: "Login Failed. Please contact support.", message:
status: "login_error", "Your account has been successfully verified! You may login now.",
status: "verify_success",
}; };
// const [mobileLoginError, mobileLoginResponse] = await tryCatch(
// backendMobileLogin({ mobile: mobile as string }),
// );
// if (mobileLoginError) {
// return {
// message: "Login Failed. Please contact support.",
// status: "login_error",
// };
// }
// if (mobileLoginResponse) {
// redirect(`/auth/verify-otp?phone_number=${mobile}`);
// }
} }
if (mobileLoginResponse) {
redirect(`/auth/verify-otp?phone_number=${mobile}`);
}
} else {
return { return {
message: "Your account could not be verified. Please contact support.", message: "Your account could not be verified. Please contact support.",
status: "verify_error", status: "verify_error",
}; };
} }
return {
message: data.message,
status: response.status === 200 ? "success" : "error",
};
}