blob: 232393633c2bf1d9cd105dea52e2e9fe2a36d5d4 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
|
import Alert from '@/core/components/elements/Alert/Alert'
import SimpleFooter from '@/core/components/elements/Footer/SimpleFooter'
import Link from '@/core/components/elements/Link/Link'
import BasicLayout from '@/core/components/layouts/BasicLayout'
import DesktopView from '@/core/components/views/DesktopView'
import MobileView from '@/core/components/views/MobileView'
import IndoteknikLogo from '@/images/logo.png'
import axios from 'axios'
import Image from 'next/image'
import { useState } from 'react'
export default function ForgotPassword() {
return (
<>
<MobileView>
<FormComponent />
<SimpleFooter />
</MobileView>
<DesktopView>
<BasicLayout>
<div className='container mx-auto'>
<div className='w-1/2 mx-auto'>
<FormComponent />
</div>
</div>
</BasicLayout>
</DesktopView>
</>
)
}
const FormComponent = () => {
const [isLoading, setIsLoading] = useState(false)
const [alert, setAlert] = useState(null)
const [email, setEmail] = useState('')
const forgotPasswordRequest = async (e) => {
e.preventDefault()
setIsLoading(true)
let submitRequest = await axios.post(
`${process.env.NEXT_PUBLIC_SELF_HOST}/api/forgot-password`,
{
email
}
)
setIsLoading(false)
if (submitRequest.data.success) {
setAlert({
children: <>Mohon cek email anda untuk reset password akun Indoteknik</>,
type: 'success'
})
} else {
setAlert({
children: (
<>
Email tersebut belum terdaftar,{' '}
<Link className='text-gray_r-12 inline-block' href='/register'>
daftar sekarang
</Link>
.
</>
),
type: 'info'
})
}
}
return (
<div className='p-6 pt-10 md:px-0 flex flex-col items-center min-h-screen'>
<Link href='/'>
<Image src={IndoteknikLogo} alt='Logo Indoteknik' width={150} height={50} />
</Link>
<h1 className='text-2xl mt-4 font-semibold text-center'>Lupa Kata Sandi Akun Indoteknik</h1>
{alert && (
<Alert className='text-center mt-4' type={alert.type}>
{alert.children}
</Alert>
)}
<form onSubmit={forgotPasswordRequest} className='mt-6 w-full'>
<input
type='email'
id='email'
className='form-input w-full text-center'
value={email}
onChange={(e) => setEmail(e.target.value)}
placeholder='Masukan alamat email'
autoFocus
/>
<button
type='submit'
disabled={!email || isLoading}
className='btn-yellow font-semibold mt-4 w-full'
>
{isLoading ? 'Loading...' : 'Kirim Permintaan'}
</button>
</form>
</div>
)
}
|
