mirror of
https://github.com/i701/sarlink-portal.git
synced 2025-04-20 03:50:20 +00:00
i701
0322bee567
- Updated login and signup pages to include session checks and redirection based on user authentication status. - Introduced QueryProvider for managing server state in the application. - Enhanced user experience by integrating session management in the devices and payments dashboard. - Added new user management features with role-based access control in the sidebar. - Created new components for user devices and payments, improving the overall structure and maintainability of the dashboard. - Implemented a table component for better data presentation in user-related views.
53 lines
1.3 KiB
TypeScript
53 lines
1.3 KiB
TypeScript
"use client";
|
|
|
|
import { Button } from "@/components/ui/button";
|
|
|
|
import { signin } from "@/actions/auth-actions";
|
|
import { Loader } from "lucide-react";
|
|
import { useActionState } from "react";
|
|
import { PhoneInput } from "../ui/phone-input";
|
|
|
|
export default function LoginForm() {
|
|
const [state, formAction, isPending] = useActionState(signin, {
|
|
message: "",
|
|
status: "",
|
|
});
|
|
|
|
return (
|
|
<form
|
|
className="bg-white overflow-clip dark:bg-transparent dark:border-2 w-full max-w-xs mx-auto rounded-lg shadow mt-4"
|
|
action={formAction}
|
|
>
|
|
<div className="py-4 px-4">
|
|
<div className="grid gap-4">
|
|
<PhoneInput
|
|
id="phone-number"
|
|
name="phoneNumber"
|
|
maxLength={8}
|
|
disabled={isPending}
|
|
placeholder="Enter phone number"
|
|
defaultCountry="MV"
|
|
/>
|
|
|
|
{state.status === "error" && (
|
|
<p className="text-red-500 text-sm">{state.message}</p>
|
|
)}
|
|
<Button
|
|
className="dark:bg-gray-800 w-full dark:text-white"
|
|
disabled={isPending}
|
|
type="submit"
|
|
>
|
|
{isPending ? <Loader className="animate-spin" /> : "Request OTP"}
|
|
</Button>
|
|
</div>
|
|
{/* <div className="mt-2 text-center text-sm">
|
|
Don't have an account?{" "}
|
|
<Link href="signup" className="underline">
|
|
Sign up
|
|
</Link>
|
|
</div> */}
|
|
</div>
|
|
</form>
|
|
);
|
|
}
|