82 lines
2.5 KiB
TypeScript
82 lines
2.5 KiB
TypeScript
|
'use client';
|
||
|
|
// src/app/sms/sign_up/page.tsx
|
||
|
|
import { useState, FormEvent, useContext, useEffect } from 'react';
|
||
|
|
import { AuthContext } from '@/context/AuthContext';
|
||
|
|
import Loader from '@/components/Loader';
|
||
|
|
|
||
|
|
const Page = () => {
|
||
|
|
const [login, setLogin] = useState('');
|
||
|
|
const [password, setPassword] = useState('');
|
||
|
|
const authContext = useContext(AuthContext);
|
||
|
|
const [isLoading, setIsLoading] = useState(true);
|
||
|
|
|
||
|
|
if (!authContext) {
|
||
|
|
throw new Error('AuthContext must be used within an AuthProvider');
|
||
|
|
}
|
||
|
|
|
||
|
|
const { login: loginUser, userLogedIn } = authContext;
|
||
|
|
const { checkUserLoggedIn } = authContext;
|
||
|
|
|
||
|
|
const handleSubmit = (e: FormEvent) => {
|
||
|
|
e.preventDefault();
|
||
|
|
|
||
|
|
loginUser(login, password);
|
||
|
|
setLogin('');
|
||
|
|
setPassword('');
|
||
|
|
};
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
checkUserLoggedIn();
|
||
|
|
}, []);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<main className="container flex justify-center h-screen items-center ">
|
||
|
|
<form onSubmit={handleSubmit} id="create-course-form">
|
||
|
|
<div className="bg-[#F5F5FA] p-10 rounded-[25px] w-[522px] -mt-28 shadow-tableShadow">
|
||
|
|
<h2 className="mb-10 text-[40px] leading-none text-#242429 font-semibold">SMS ulgamy</h2>
|
||
|
|
<div className="flex flex-col gap-2 mb-5 leading-[150%]">
|
||
|
|
<label htmlFor="login" className="text-[16px] font-semibold text-[#242429]">
|
||
|
|
Login
|
||
|
|
</label>
|
||
|
|
<input
|
||
|
|
id="login"
|
||
|
|
type="text"
|
||
|
|
className="input-style"
|
||
|
|
value={login}
|
||
|
|
onChange={(e) => setLogin(e.target.value)}
|
||
|
|
placeholder="Login giriziň"
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
<div className="flex flex-col gap-2">
|
||
|
|
<label htmlFor="password" className="text-[16px] font-semibold text-[#242429]">
|
||
|
|
Açar sözi
|
||
|
|
</label>
|
||
|
|
<input
|
||
|
|
id="password"
|
||
|
|
type="password"
|
||
|
|
className="input-style"
|
||
|
|
value={password}
|
||
|
|
onChange={(e) => setPassword(e.target.value)}
|
||
|
|
placeholder="Açar sözi giriziň"
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<button
|
||
|
|
type="submit"
|
||
|
|
className="p-3 bg-[#7A7ACC] text-[18px] leading-[150%] font-medium text-white w-full rounded-xl mt-[30px]">
|
||
|
|
Ulgama gir
|
||
|
|
</button>
|
||
|
|
|
||
|
|
{userLogedIn === false ? (
|
||
|
|
<p className="text-center pt-[16px] text-[16px] font-[600] text-red-400">
|
||
|
|
Login ýa-da açar sözi ýalňyş
|
||
|
|
</p>
|
||
|
|
) : null}
|
||
|
|
</div>
|
||
|
|
</form>
|
||
|
|
</main>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
export default Page;
|