sarlink/sarlink-portal
7
0
Fork 0
mirror of https://github.com/i701/sarlink-portal.git synced 2025-02-22 08:42:00 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Enhance user verification and UI components
Some checks failed
Build and Push Docker Images / Build and Push Docker Images (push) Failing after 1m24s
Details

Browse Source 
- Updated `auth-actions.ts` to improve user verification notification formatting and date handling.
- Modified `layout.tsx` to support dark mode styling for better user experience.
- Refactored `signup/page.tsx` to enhance layout and responsiveness.
- Introduced a new API route in `route.ts` for sending user verification notifications.
- Improved user feedback in `user-payments-table.tsx` by updating the no payment message.
- Made minor adjustments in `application-layout.tsx` for consistent padding.
- Enhanced `signup-form.tsx` to display error messages for invalid user validation.

These changes improve the user verification process, enhance UI consistency, and provide better feedback to users.
This commit is contained in:
i701 2025-01-10 23:34:53 +05:00
parent a3f0759731
commit 2c67848618
8 changed files with 55 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
actions/auth-actions.ts
View File

@ -136,14 +136,17 @@ export async function signup(_actionState: ActionState, formData: FormData) {
if (!isValidPerson) {
await SendUserRejectionDetailSMS({
details: `
A new user has requested for verification.
USER DETAILS:
A new user has requested for verification. \n
USER DETAILS:
Name: ${parsedData.data.name}
Address: ${parsedData.data.address}
ID Card: ${parsedData.data.id_card}
DOB: ${parsedData.data.dob}
ACC No: ${parsedData.data.accNo}
Verify the user with the folloiwing link: ${process.env.BETTER_AUTH_URL}/users/${newUser.id}/verify
DOB: ${parsedData.data.dob.toLocaleDateString("en-US", {
month: "short",
day: "2-digit",
year: "numeric",
})}
ACC No: ${parsedData.data.accNo}\n\nVerify the user with the folloiwing link: ${process.env.BETTER_AUTH_URL}/users/${newUser.id}/verify
`,
phoneNumber: process.env.ADMIN_PHONENUMBER ?? "",
});

12
app/(auth)/signup/page.tsx
View File

@ -29,15 +29,9 @@ export default async function SignupPage({
});
return (
<div className="dark:bg-black w-full flex items-center justify-center font-sans">
<div className="flex flex-col items-center justify-center w-full h-full py-4">
<Image
priority
alt="Sar Link Logo"
src="/logo.png"
width={100}
height={100}
/>
<div className="dark:bg-black w-full h-screen flex items-center justify-center font-sans">
<div className="flex flex-col items-center justify-center w-full h-full ">
<Image alt="Sar Link Logo" src="/logo.png" width={100} height={100} />
<div className="mt-4 flex flex-col items-center justify-center">
<h4 className="font-bold text-xl text-gray-600">SAR Link Portal</h4>
<p className="text-gray-500">

16
app/api/test/route.ts Normal file
View File

@ -0,0 +1,16 @@
import { SendUserRejectionDetailSMS } from "@/actions/user-actions";
export async function POST(request: Request) {
await SendUserRejectionDetailSMS({
details: `
A new user has requested for verification. \n
USER DETAILS:
Name: Jacob
Address: Jacob House
ID Card: A222111
DOB: 24-08-1997
ACC No: 7770000010629 \n\nVerify the user with the folloiwing link: ${process.env.BETTER_AUTH_URL}/users/verify
`,
phoneNumber: process.env.ADMIN_PHONENUMBER ?? "",
});
}

2
app/layout.tsx
View File

@ -25,7 +25,7 @@ export default function RootLayout({
}>) {
return (
<html lang="en" suppressHydrationWarning>
<body className={`${barlow.variable} antialiased font-sans bg-gray-100`}>
<body className={`${barlow.variable} antialiased font-sans bg-gray-100 dark:bg-black`}>
<Provider>
<NextTopLoader color="#f49d1b" showSpinner={false} zIndex={9999} />
<Toaster richColors />

2
components/admin/user-payments-table.tsx
View File

@ -131,7 +131,7 @@ export async function UsersPaymentsTable({
<div>
{payments.length === 0 ? (
<div className="h-[calc(100svh-400px)] flex flex-col items-center justify-center my-4">
<h3>No Users yet.</h3>
<h3>No user payments yet.</h3>
</div>
) : (
<>

2
components/auth/application-layout.tsx
View File

@ -49,7 +49,7 @@ export async function ApplicationLayout({
<AccountPopover />
</div>
</header>
<div className="p-4">{children}</div>
<div className="p-4 ">{children}</div>
</SidebarInset>
</SidebarProvider>
);

13
components/auth/signup-form.tsx
View File

@ -45,6 +45,19 @@ export default function SignUpForm({ atolls }: { atolls: AtollWithIslands[] }) {
const NUMBER_WITHOUT_DASH = phoneNumberFromUrl?.split("-").join("");
if (actionState.db_error === "invalidPersonValidation") {
return (
<>
<div className="h-24 w-72 text-center text-green-500 p-4 flex my-4 flex-col items-center justify-center border dark:title-bg bg-white rounded-lg">{actionState.message}</div>
<div className="mb-4 text-center text-sm">
Go to {" "}
<Link href="login" className="underline">
login
</Link>
</div>
</>
)
}
return (
<form
action={action}

10
lib/person.ts
View File

@ -18,11 +18,19 @@ export async function getNationalPerson({
}
export async function VerifyUserDetails({ user }: { user: User }) {
const phoneNumber = user.phoneNumber.slice(4);
const phoneNumber = String(user.phoneNumber).slice(4);
console.log({ phoneNumber });
const nationalData = await getNationalPerson({ idCard: user.id_card ?? "" });
const dob = new Date(nationalData.dob);
const age = new Date().getFullYear() - dob.getFullYear();
console.log("ID card", user.id_card === nationalData.nic);
console.log("name", user.name === nationalData.name_en);
console.log("house", user.address === nationalData.house_name_en);
console.log("phone", phoneNumber === nationalData.primary_contact);
console.log("db phone", phoneNumber);
console.log("national phone", nationalData.primary_contact);
if (
user.id_card === nationalData.nic &&
user.name === nationalData.name_en &&