summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/core/components/elements/Navbar/NavbarUserDropdown.jsx4
-rw-r--r--src/lib/auth/components/Login.jsx124
-rw-r--r--src/lib/auth/components/LoginDesktop.jsx77
-rw-r--r--src/lib/auth/components/LoginMobile.jsx68
-rw-r--r--src/lib/auth/components/Register.jsx150
-rw-r--r--src/lib/auth/components/RegisterDesktop.jsx114
-rw-r--r--src/lib/auth/components/RegisterMobile.jsx109
-rw-r--r--src/lib/auth/hooks/useLogin.js74
-rw-r--r--src/lib/auth/hooks/useRegister.js80
-rw-r--r--src/lib/content/components/PageContent.jsx14
-rw-r--r--src/lib/product/components/Product.jsx2
-rw-r--r--src/lib/product/components/ProductDesktop.jsx16
-rw-r--r--src/pages/login.jsx15
-rw-r--r--src/pages/register.jsx15
-rw-r--r--src/pages/shop/product/[slug].jsx11
-rw-r--r--src/styles/globals.css4
16 files changed, 585 insertions, 292 deletions
diff --git a/src/core/components/elements/Navbar/NavbarUserDropdown.jsx b/src/core/components/elements/Navbar/NavbarUserDropdown.jsx
index fb95c593..b735c13f 100644
--- a/src/core/components/elements/Navbar/NavbarUserDropdown.jsx
+++ b/src/core/components/elements/Navbar/NavbarUserDropdown.jsx
@@ -1,3 +1,4 @@
+import { deleteAuth } from '@/core/utils/auth'
import Link from '../Link/Link'
const NavbarUserDropdown = () => {
@@ -8,6 +9,9 @@ const NavbarUserDropdown = () => {
<Link href='/'>Invoice & Faktur Pajak</Link>
<Link href='/'>Wishlist</Link>
<Link href='/'>Pengaturan Akun</Link>
+ <Link href='/login' onClick={deleteAuth}>
+ Keluar Akun
+ </Link>
</div>
</div>
)
diff --git a/src/lib/auth/components/Login.jsx b/src/lib/auth/components/Login.jsx
index 6fbc1475..171ff4c8 100644
--- a/src/lib/auth/components/Login.jsx
+++ b/src/lib/auth/components/Login.jsx
@@ -1,124 +1,12 @@
-import Image from 'next/image'
-import IndoteknikLogo from '@/images/logo.png'
-import Link from '@/core/components/elements/Link/Link'
-import { useState } from 'react'
-import loginApi from '../api/loginApi'
-import { useRouter } from 'next/router'
-import Alert from '@/core/components/elements/Alert/Alert'
-import { setAuth } from '@/core/utils/auth'
+import LoginDesktop from "./LoginDesktop"
+import LoginMobile from "./LoginMobile"
const Login = () => {
- const router = useRouter()
- const [email, setEmail] = useState('')
- const [password, setPassword] = useState('')
- const [isLoading, setIsLoading] = useState(false)
- const [alert, setAlert] = useState(null)
-
- const handleSubmit = async (e) => {
- e.preventDefault()
- setAlert(null)
- setIsLoading(true)
- const login = await loginApi({ email, password })
- setIsLoading(false)
-
- if (login.isAuth) {
- setAuth(login.user)
- router.push('/')
- return
- }
- switch (login.reason) {
- case 'NOT_FOUND':
- setAlert({
- children: 'Email atau password tidak cocok',
- type: 'info'
- })
- break
- case 'NOT_ACTIVE':
- setAlert({
- children: (
- <>
- Email belum diaktivasi,
- <Link
- className='text-gray-900'
- href={`/activate?email=${email}`}
- >
- aktivasi sekarang
- </Link>
- </>
- ),
- type: 'info'
- })
- break
- }
- }
-
return (
- <div className='p-6 pt-10 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'>Mulai Belanja Sekarang</h1>
- <h2 className='text-gray_r-11 font-normal mt-1 mb-4'>Masuk ke akun kamu untuk belanja</h2>
-
- {alert && (
- <Alert
- className='text-center'
- type={alert.type}
- >
- {alert.children}
- </Alert>
- )}
-
- <form
- className='w-full mt-6 flex flex-col gap-y-4'
- onSubmit={handleSubmit}
- >
- <div>
- <label htmlFor='email'>Alamat Email</label>
- <input
- type='email'
- id='email'
- className='form-input w-full mt-3'
- value={email}
- onChange={(e) => setEmail(e.target.value)}
- placeholder='contoh@email.com'
- />
- </div>
- <div>
- <label htmlFor='password'>Kata Sandi</label>
- <input
- type='password'
- id='password'
- className='form-input w-full mt-3'
- value={password}
- onChange={(e) => setPassword(e.target.value)}
- placeholder='••••••••••••'
- />
- </div>
- <button
- type='submit'
- className='btn-yellow w-full mt-2'
- disabled={!email || !password || isLoading}
- >
- {!isLoading ? 'Masuk' : 'Loading...'}
- </button>
- </form>
-
- <div className='text-gray_r-11 mt-4'>
- Belum punya akun Indoteknik?{' '}
- <Link
- href='/register'
- className='inline'
- >
- Daftar
- </Link>
- </div>
- </div>
+ <>
+ <LoginMobile />
+ <LoginDesktop />
+ </>
)
}
diff --git a/src/lib/auth/components/LoginDesktop.jsx b/src/lib/auth/components/LoginDesktop.jsx
new file mode 100644
index 00000000..7b71b9a6
--- /dev/null
+++ b/src/lib/auth/components/LoginDesktop.jsx
@@ -0,0 +1,77 @@
+import DesktopView from '@/core/components/views/DesktopView'
+import useLogin from '../hooks/useLogin'
+import Link from '@/core/components/elements/Link/Link'
+import PageContent from '@/lib/content/components/PageContent'
+import Alert from '@/core/components/elements/Alert/Alert'
+
+const LoginDesktop = () => {
+ const { handleSubmit, handleChangeInput, isLoading, isValid, alert, emailRef, passwordRef } =
+ useLogin()
+
+ return (
+ <DesktopView>
+ <div className='container mx-auto'>
+ <div className='grid grid-cols-2 gap-x-10 pt-16'>
+ <div>
+ <h1 className='text-2xl font-semibold'>Selamat Datang di Indoteknik</h1>
+ <h2 className='text-gray_r-11 font-normal mt-1 mb-4'>
+ Masuk ke akun kamu untuk mulai transaksi!
+ </h2>
+
+ {alert && (
+ <Alert className='text-center' type={alert.type}>
+ {alert.children}
+ </Alert>
+ )}
+
+ <form className='w-full mt-6 flex flex-col gap-y-4' onSubmit={handleSubmit}>
+ <div>
+ <label htmlFor='email'>Alamat Email</label>
+ <input
+ type='email'
+ name='email'
+ id='email'
+ className='form-input w-full mt-3'
+ ref={emailRef}
+ onChange={handleChangeInput}
+ placeholder='contoh@email.com'
+ />
+ </div>
+ <div>
+ <label htmlFor='password'>Kata Sandi</label>
+ <input
+ type='password'
+ name='password'
+ id='password'
+ className='form-input w-full mt-3'
+ ref={passwordRef}
+ onChange={handleChangeInput}
+ placeholder='••••••••••••'
+ />
+ </div>
+ <button
+ type='submit'
+ className='btn-yellow w-full mt-2'
+ disabled={!isValid || isLoading}
+ >
+ {!isLoading ? 'Masuk' : 'Loading...'}
+ </button>
+ </form>
+
+ <div className='text-gray_r-11 mt-10'>
+ Belum punya akun Indoteknik?{' '}
+ <Link href='/register' className='inline'>
+ Daftar akun baru
+ </Link>
+ </div>
+ </div>
+ <div>
+ <PageContent path='/login' />
+ </div>
+ </div>
+ </div>
+ </DesktopView>
+ )
+}
+
+export default LoginDesktop
diff --git a/src/lib/auth/components/LoginMobile.jsx b/src/lib/auth/components/LoginMobile.jsx
new file mode 100644
index 00000000..78584a1c
--- /dev/null
+++ b/src/lib/auth/components/LoginMobile.jsx
@@ -0,0 +1,68 @@
+import Image from 'next/image'
+import IndoteknikLogo from '@/images/logo.png'
+import Link from '@/core/components/elements/Link/Link'
+import Alert from '@/core/components/elements/Alert/Alert'
+import MobileView from '@/core/components/views/MobileView'
+import useLogin from '../hooks/useLogin'
+
+const LoginMobile = () => {
+ const { handleSubmit, handleChangeInput, isLoading, isValid, alert, emailRef, passwordRef } =
+ useLogin()
+
+ return (
+ <MobileView>
+ <div className='p-6 pt-10 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'>Mulai Belanja Sekarang</h1>
+ <h2 className='text-gray_r-11 font-normal mt-1 mb-4'>Masuk ke akun kamu untuk belanja</h2>
+
+ {alert && (
+ <Alert className='text-center' type={alert.type}>
+ {alert.children}
+ </Alert>
+ )}
+
+ <form className='w-full mt-6 flex flex-col gap-y-4' onSubmit={handleSubmit}>
+ <div>
+ <label htmlFor='email'>Alamat Email</label>
+ <input
+ type='email'
+ name='email'
+ id='email'
+ className='form-input w-full mt-3'
+ ref={emailRef}
+ onChange={handleChangeInput}
+ placeholder='contoh@email.com'
+ />
+ </div>
+ <div>
+ <label htmlFor='password'>Kata Sandi</label>
+ <input
+ type='password'
+ name='password'
+ id='password'
+ className='form-input w-full mt-3'
+ ref={passwordRef}
+ onChange={handleChangeInput}
+ placeholder='••••••••••••'
+ />
+ </div>
+ <button type='submit' className='btn-yellow w-full mt-2' disabled={!isValid || isLoading}>
+ {!isLoading ? 'Masuk' : 'Loading...'}
+ </button>
+ </form>
+
+ <div className='text-gray_r-11 mt-4'>
+ Belum punya akun Indoteknik?{' '}
+ <Link href='/register' className='inline'>
+ Daftar
+ </Link>
+ </div>
+ </div>
+ </MobileView>
+ )
+}
+
+export default LoginMobile
diff --git a/src/lib/auth/components/Register.jsx b/src/lib/auth/components/Register.jsx
index 4ea62899..6c0152dc 100644
--- a/src/lib/auth/components/Register.jsx
+++ b/src/lib/auth/components/Register.jsx
@@ -1,150 +1,12 @@
-import Image from 'next/image'
-import Link from '@/core/components/elements/Link/Link'
-import IndoteknikLogo from '@/images/logo.png'
-import { useState } from 'react'
-import registerApi from '../api/registerApi'
-import Alert from '@/core/components/elements/Alert/Alert'
-import axios from 'axios'
+import RegisterDesktop from './RegisterDesktop'
+import RegisterMobile from './RegisterMobile'
const Register = () => {
- const [fullname, setFullname] = useState('')
- const [email, setEmail] = useState('')
- const [password, setPassword] = useState('')
- const [companyName, setCompanyName] = useState('')
- const [isLoading, setIsLoading] = useState('')
- const [alert, setAlert] = useState(null)
-
- const handleSubmit = async (e) => {
- e.preventDefault()
- setAlert(null)
- setIsLoading(true)
- const data = {
- name: fullname,
- company: companyName,
- email,
- password
- }
- const isRegistered = await registerApi({ data })
- setIsLoading(false)
- if (isRegistered.register) {
- await axios.post(`${process.env.NEXT_PUBLIC_SELF_HOST}/api/activation-request`, { email })
- setAlert({
- children: 'Berhasil mendaftarkan akun anda, cek email untuk melakukan aktivasi akun',
- type: 'success'
- })
- setCompanyName('')
- setFullname('')
- setEmail('')
- setPassword('')
- } else {
- switch (isRegistered.reason) {
- case 'EMAIL_USED':
- setAlert({
- children: 'Email telah digunakan',
- type: 'info'
- })
- break
- }
- }
- }
-
return (
- <div className='p-6 pt-10 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'>Daftar Akun Indoteknik</h1>
- <h2 className='text-gray_r-11 font-normal mt-1 mb-4 text-center'>
- Buat akun sekarang lebih mudah dan terverifikasi
- </h2>
-
- {alert && (
- <Alert
- className='text-center'
- type={alert.type}
- >
- {alert.children}
- </Alert>
- )}
-
- <form
- className='w-full mt-6 flex flex-col gap-y-4'
- onSubmit={handleSubmit}
- >
- <div>
- <label htmlFor='companyName'>
- Nama Perusahaan <span className='text-gray_r-11'>(opsional)</span>
- </label>
- <input
- type='text'
- id='companyName'
- className='form-input w-full mt-3'
- value={companyName}
- onChange={(e) => setCompanyName(e.target.value.toUpperCase())}
- placeholder='cth: INDOTEKNIK DOTCOM GEMILANG'
- autoCapitalize='true'
- />
- </div>
-
- <div>
- <label htmlFor='fullname'>Nama Lengkap</label>
- <input
- type='text'
- id='fullname'
- className='form-input w-full mt-3'
- value={fullname}
- onChange={(e) => setFullname(e.target.value)}
- placeholder='John Doe'
- />
- </div>
- <div>
- <label htmlFor='email'>Alamat Email</label>
- <input
- type='email'
- id='email'
- className='form-input w-full mt-3'
- value={email}
- onChange={(e) => setEmail(e.target.value)}
- placeholder='contoh@email.com'
- />
- </div>
- <div>
- <label htmlFor='password'>Kata Sandi</label>
- <input
- type='password'
- id='password'
- className='form-input w-full mt-3'
- value={password}
- onChange={(e) => setPassword(e.target.value)}
- placeholder='••••••••••••'
- />
- </div>
-
- <button
- type='submit'
- className='btn-yellow w-full mt-2'
- disabled={!email || !password || !fullname || isLoading}
- >
- {!isLoading ? 'Daftar' : 'Loading...'}
- </button>
- </form>
-
- <div className='text-gray_r-11 mt-4'>
- Sudah punya akun Indoteknik?{' '}
- <Link
- href='/login'
- className='inline'
- >
- Masuk
- </Link>
- </div>
- </div>
+ <>
+ <RegisterMobile />
+ <RegisterDesktop />
+ </>
)
}
diff --git a/src/lib/auth/components/RegisterDesktop.jsx b/src/lib/auth/components/RegisterDesktop.jsx
new file mode 100644
index 00000000..71cc29d8
--- /dev/null
+++ b/src/lib/auth/components/RegisterDesktop.jsx
@@ -0,0 +1,114 @@
+import DesktopView from '@/core/components/views/DesktopView'
+import useRegister from '../hooks/useRegister'
+import Link from '@/core/components/elements/Link/Link'
+import Alert from '@/core/components/elements/Alert/Alert'
+import PageContent from '@/lib/content/components/PageContent'
+
+const RegisterDesktop = () => {
+ const {
+ handleChangeInput,
+ handleSubmit,
+ isLoading,
+ isValid,
+ alert,
+ companyNameRef,
+ fullnameRef,
+ emailRef,
+ passwordRef
+ } = useRegister()
+
+ return (
+ <DesktopView>
+ <div className='container mx-auto'>
+ <div className='grid grid-cols-2 gap-x-10 pt-16'>
+ <div>
+ <h1 className='text-2xl font-semibold'>Daftar Akun Indoteknik</h1>
+ <h2 className='text-gray_r-11 font-normal mt-1 mb-4'>
+ Buat akun sekarang lebih mudah dan terverifikasi
+ </h2>
+
+ {alert && (
+ <Alert className='text-center' type={alert.type}>
+ {alert.children}
+ </Alert>
+ )}
+
+ <form className='w-full mt-6 flex flex-col gap-y-4' onSubmit={handleSubmit}>
+ <div>
+ <label htmlFor='companyName'>
+ Nama Perusahaan <span className='text-gray_r-11'>(opsional)</span>
+ </label>
+ <input
+ type='text'
+ id='companyName'
+ name='companyName'
+ className='form-input w-full mt-3'
+ ref={companyNameRef}
+ onChange={handleChangeInput}
+ placeholder='cth: INDOTEKNIK DOTCOM GEMILANG'
+ autoCapitalize='true'
+ />
+ </div>
+
+ <div>
+ <label htmlFor='fullname'>Nama Lengkap</label>
+ <input
+ type='text'
+ id='fullname'
+ name='fullname'
+ className='form-input w-full mt-3'
+ ref={fullnameRef}
+ onChange={handleChangeInput}
+ placeholder='John Doe'
+ />
+ </div>
+ <div>
+ <label htmlFor='email'>Alamat Email</label>
+ <input
+ type='email'
+ name='email'
+ id='email'
+ className='form-input w-full mt-3'
+ ref={emailRef}
+ onChange={handleChangeInput}
+ placeholder='contoh@email.com'
+ />
+ </div>
+ <div>
+ <label htmlFor='password'>Kata Sandi</label>
+ <input
+ type='password'
+ name='password'
+ id='password'
+ className='form-input w-full mt-3'
+ ref={passwordRef}
+ onChange={handleChangeInput}
+ placeholder='••••••••••••'
+ />
+ </div>
+ <button
+ type='submit'
+ className='btn-yellow w-full mt-2'
+ disabled={!isValid || isLoading}
+ >
+ {!isLoading ? 'Masuk' : 'Loading...'}
+ </button>
+ </form>
+
+ <div className='text-gray_r-11 mt-10'>
+ Sudah punya akun Indoteknik?{' '}
+ <Link href='/login' className='inline'>
+ Masuk
+ </Link>
+ </div>
+ </div>
+ <div>
+ <PageContent path='/register' />
+ </div>
+ </div>
+ </div>
+ </DesktopView>
+ )
+}
+
+export default RegisterDesktop
diff --git a/src/lib/auth/components/RegisterMobile.jsx b/src/lib/auth/components/RegisterMobile.jsx
new file mode 100644
index 00000000..007b127c
--- /dev/null
+++ b/src/lib/auth/components/RegisterMobile.jsx
@@ -0,0 +1,109 @@
+import IndoteknikLogo from '@/images/logo.png'
+import Alert from '@/core/components/elements/Alert/Alert'
+import Image from 'next/image'
+import Link from '@/core/components/elements/Link/Link'
+import useRegister from '../hooks/useRegister'
+import MobileView from '@/core/components/views/MobileView'
+
+const RegisterMobile = () => {
+ const {
+ handleChangeInput,
+ handleSubmit,
+ isLoading,
+ isValid,
+ alert,
+ companyNameRef,
+ fullnameRef,
+ emailRef,
+ passwordRef
+ } = useRegister()
+
+ return (
+ <MobileView>
+ <div className='p-6 pt-10 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'>Daftar Akun Indoteknik</h1>
+ <h2 className='text-gray_r-11 font-normal mt-1 mb-4 text-center'>
+ Buat akun sekarang lebih mudah dan terverifikasi
+ </h2>
+
+ {alert && (
+ <Alert className='text-center' type={alert.type}>
+ {alert.children}
+ </Alert>
+ )}
+
+ <form className='w-full mt-6 flex flex-col gap-y-4' onSubmit={handleSubmit}>
+ <div>
+ <label htmlFor='companyName'>
+ Nama Perusahaan <span className='text-gray_r-11'>(opsional)</span>
+ </label>
+ <input
+ type='text'
+ id='companyName'
+ name='companyName'
+ className='form-input w-full mt-3'
+ ref={companyNameRef}
+ onChange={handleChangeInput}
+ placeholder='cth: INDOTEKNIK DOTCOM GEMILANG'
+ autoCapitalize='true'
+ />
+ </div>
+
+ <div>
+ <label htmlFor='fullname'>Nama Lengkap</label>
+ <input
+ type='text'
+ id='fullname'
+ name='fullname'
+ className='form-input w-full mt-3'
+ ref={fullnameRef}
+ onChange={handleChangeInput}
+ placeholder='John Doe'
+ />
+ </div>
+ <div>
+ <label htmlFor='email'>Alamat Email</label>
+ <input
+ type='email'
+ id='email'
+ name='email'
+ className='form-input w-full mt-3'
+ ref={emailRef}
+ onChange={handleChangeInput}
+ placeholder='contoh@email.com'
+ />
+ </div>
+ <div>
+ <label htmlFor='password'>Kata Sandi</label>
+ <input
+ type='password'
+ id='password'
+ name='password'
+ className='form-input w-full mt-3'
+ ref={passwordRef}
+ onChange={handleChangeInput}
+ placeholder='••••••••••••'
+ />
+ </div>
+
+ <button type='submit' className='btn-yellow w-full mt-2' disabled={!isValid || isLoading}>
+ {!isLoading ? 'Daftar' : 'Loading...'}
+ </button>
+ </form>
+
+ <div className='text-gray_r-11 mt-4'>
+ Sudah punya akun Indoteknik?{' '}
+ <Link href='/login' className='inline'>
+ Masuk
+ </Link>
+ </div>
+ </div>
+ </MobileView>
+ )
+}
+
+export default RegisterMobile
diff --git a/src/lib/auth/hooks/useLogin.js b/src/lib/auth/hooks/useLogin.js
new file mode 100644
index 00000000..bef36053
--- /dev/null
+++ b/src/lib/auth/hooks/useLogin.js
@@ -0,0 +1,74 @@
+import Link from '@/core/components/elements/Link/Link'
+import { setAuth } from '@/core/utils/auth'
+import { useRouter } from 'next/router'
+import { useRef, useState } from 'react'
+import loginApi from '../api/loginApi'
+
+const useLogin = () => {
+ const router = useRouter()
+ const [isLoading, setIsLoading] = useState(false)
+ const [alert, setAlert] = useState(null)
+ const [isValid, setIsValid] = useState(false)
+
+ const emailRef = useRef(null)
+ const passwordRef = useRef(null)
+
+ const inputVal = () => ({
+ email: emailRef.current.value,
+ password: passwordRef.current.value
+ })
+
+ const handleChangeInput = () => {
+ const { email, password } = inputVal()
+ const isValidInput = email && password
+ setIsValid(isValidInput)
+ }
+
+ const handleSubmit = async (e) => {
+ e.preventDefault()
+ setAlert(null)
+ setIsLoading(true)
+ const { email, password } = inputVal()
+ const login = await loginApi({ email, password })
+ setIsLoading(false)
+
+ if (login.isAuth) {
+ setAuth(login.user)
+ router.push('/')
+ return
+ }
+ switch (login.reason) {
+ case 'NOT_FOUND':
+ setAlert({
+ children: 'Email atau password tidak cocok',
+ type: 'info'
+ })
+ break
+ case 'NOT_ACTIVE':
+ setAlert({
+ children: (
+ <>
+ Email belum diaktivasi,
+ <Link className='text-gray-900' href={`/activate?email=${email}`}>
+ aktivasi sekarang
+ </Link>
+ </>
+ ),
+ type: 'info'
+ })
+ break
+ }
+ }
+
+ return {
+ handleChangeInput,
+ handleSubmit,
+ isLoading,
+ isValid,
+ alert,
+ emailRef,
+ passwordRef
+ }
+}
+
+export default useLogin
diff --git a/src/lib/auth/hooks/useRegister.js b/src/lib/auth/hooks/useRegister.js
new file mode 100644
index 00000000..7642a666
--- /dev/null
+++ b/src/lib/auth/hooks/useRegister.js
@@ -0,0 +1,80 @@
+import axios from 'axios'
+import { useRef, useState } from 'react'
+import registerApi from '../api/registerApi'
+
+const useRegister = () => {
+ const [isLoading, setIsLoading] = useState(false)
+ const [alert, setAlert] = useState(null)
+ const [isValid, setIsValid] = useState(false)
+
+ const fullnameRef = useRef(null)
+ const emailRef = useRef(null)
+ const passwordRef = useRef(null)
+ const companyNameRef = useRef(null)
+
+ const inputVal = () => ({
+ fullname: fullnameRef.current.value,
+ email: emailRef.current.value,
+ password: passwordRef.current.value,
+ companyName: companyNameRef.current.value
+ })
+
+ const handleChangeInput = () => {
+ const { fullname, email, password } = inputVal()
+ const isValidInput = email && password && fullname
+ setIsValid(isValidInput)
+ }
+
+ const resetInput = () => {
+ fullnameRef.current.value = ''
+ emailRef.current.value = ''
+ passwordRef.current.value = ''
+ companyNameRef.current.value = ''
+ }
+
+ const handleSubmit = async (e) => {
+ e.preventDefault()
+ setAlert(null)
+ setIsLoading(true)
+ const { fullname, email, password, companyName } = inputVal()
+
+ const isRegistered = await registerApi({
+ name: fullname,
+ company: companyName,
+ email,
+ password
+ })
+ setIsLoading(false)
+ if (isRegistered.register) {
+ await axios.post(`${process.env.NEXT_PUBLIC_SELF_HOST}/api/activation-request`, { email })
+ setAlert({
+ children: 'Berhasil mendaftarkan akun anda, cek email untuk melakukan aktivasi akun',
+ type: 'success'
+ })
+ resetInput()
+ } else {
+ switch (isRegistered.reason) {
+ case 'EMAIL_USED':
+ setAlert({
+ children: 'Email telah digunakan',
+ type: 'info'
+ })
+ break
+ }
+ }
+ }
+
+ return {
+ handleChangeInput,
+ handleSubmit,
+ isLoading,
+ isValid,
+ alert,
+ companyNameRef,
+ fullnameRef,
+ emailRef,
+ passwordRef
+ }
+}
+
+export default useRegister
diff --git a/src/lib/content/components/PageContent.jsx b/src/lib/content/components/PageContent.jsx
index 4c17ab54..f7c2f467 100644
--- a/src/lib/content/components/PageContent.jsx
+++ b/src/lib/content/components/PageContent.jsx
@@ -5,15 +5,14 @@ import Spinner from '@/core/components/elements/Spinner/Spinner'
const PageContent = ({ path }) => {
const fetchContent = async () => await pageContentApi({ path })
const content = useQuery(`content-${path}`, fetchContent)
-
- if (content.data) {
+
+ if (content.data?.id) {
let parsedContent = content.data.content
parsedContent = parsedContent.replaceAll(
'src="/web/image',
`src="${process.env.NEXT_PUBLIC_ODOO_HOST}/web/image`
)
- const contentClassNames = `
- p-4
+ const contentClassNames = `
prose
prose-gray
prose-a:text-red_r-10
@@ -26,12 +25,7 @@ const PageContent = ({ path }) => {
prose-hr:my-3
`
- return (
- <div
- className={contentClassNames}
- dangerouslySetInnerHTML={{ __html: parsedContent }}
- />
- )
+ return <div className={contentClassNames} dangerouslySetInnerHTML={{ __html: parsedContent }} />
}
if (content.isLoading) {
diff --git a/src/lib/product/components/Product.jsx b/src/lib/product/components/Product.jsx
index 9b41f5c3..9521cbe4 100644
--- a/src/lib/product/components/Product.jsx
+++ b/src/lib/product/components/Product.jsx
@@ -21,7 +21,7 @@ const Product = ({ product }) => {
if (wishlist?.data?.productTotal > 0) {
toast.success('Berhasil menghapus dari wishlist')
} else {
- toast.error('Terjadi kesalahan internal, gagal menambahkan ke wishlist')
+ toast.success('Berhasil menambahkan ke wishlist')
}
wishlist.refetch()
}
diff --git a/src/lib/product/components/ProductDesktop.jsx b/src/lib/product/components/ProductDesktop.jsx
index f37d900c..55d44212 100644
--- a/src/lib/product/components/ProductDesktop.jsx
+++ b/src/lib/product/components/ProductDesktop.jsx
@@ -225,9 +225,9 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => {
</TabButton>
))}
</div>
- <div className='flex rounded'>
- <TabContent active={informationTab == 'description'}>
- <div className='w-3/4 leading-7 product__description'>
+ <div className='flex'>
+ <div className='w-3/4 leading-7 product__description'>
+ <TabContent active={informationTab == 'description'}>
<span
dangerouslySetInnerHTML={{
__html:
@@ -236,10 +236,10 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => {
: 'Belum ada deskripsi produk.'
}}
/>
- </div>
- </TabContent>
-
- <TabContent active={informationTab == 'information'}>Belum ada informasi.</TabContent>
+ </TabContent>
+
+ <TabContent active={informationTab == 'information'}>Belum ada informasi.</TabContent>
+ </div>
</div>
</div>
@@ -270,7 +270,7 @@ const TabButton = ({ children, active, ...props }) => {
)
}
-const TabContent = ({ children, active, className, ...props }) => (
+const TabContent = ({ children, active, className = '', ...props }) => (
<div {...props} className={`${active ? 'block' : 'hidden'} ${className}`}>
{children}
</div>
diff --git a/src/pages/login.jsx b/src/pages/login.jsx
index 03509e93..bd7ec5c1 100644
--- a/src/pages/login.jsx
+++ b/src/pages/login.jsx
@@ -1,11 +1,22 @@
import SimpleFooter from '@/core/components/elements/Footer/SimpleFooter'
+import BasicLayout from '@/core/components/layouts/BasicLayout'
+import DesktopView from '@/core/components/views/DesktopView'
+import MobileView from '@/core/components/views/MobileView'
import LoginComponent from '@/lib/auth/components/Login'
export default function Login() {
return (
<>
- <LoginComponent />
- <SimpleFooter />
+ <DesktopView>
+ <BasicLayout>
+ <LoginComponent />
+ </BasicLayout>
+ </DesktopView>
+
+ <MobileView>
+ <LoginComponent />
+ <SimpleFooter />
+ </MobileView>
</>
)
}
diff --git a/src/pages/register.jsx b/src/pages/register.jsx
index 0ca1e81e..7f5e9f2b 100644
--- a/src/pages/register.jsx
+++ b/src/pages/register.jsx
@@ -1,11 +1,22 @@
import SimpleFooter from '@/core/components/elements/Footer/SimpleFooter'
+import BasicLayout from '@/core/components/layouts/BasicLayout'
+import DesktopView from '@/core/components/views/DesktopView'
+import MobileView from '@/core/components/views/MobileView'
import RegisterComponent from '@/lib/auth/components/Register'
export default function Register() {
return (
<>
- <RegisterComponent />
- <SimpleFooter />
+ <DesktopView>
+ <BasicLayout>
+ <RegisterComponent />
+ </BasicLayout>
+ </DesktopView>
+
+ <MobileView>
+ <RegisterComponent />
+ <SimpleFooter />
+ </MobileView>
</>
)
}
diff --git a/src/pages/shop/product/[slug].jsx b/src/pages/shop/product/[slug].jsx
index cc6924a3..83939291 100644
--- a/src/pages/shop/product/[slug].jsx
+++ b/src/pages/shop/product/[slug].jsx
@@ -11,11 +11,12 @@ export async function getServerSideProps(context) {
let product = await productApi({ id: getIdFromSlug(slug) })
if (product?.length == 1) {
product = product[0]
- product.description = product.description.replaceAll('<p>', '||p||')
- product.description = product.description.replaceAll('</p>', '||/p||')
- product.description = product.description.replace(/(<([^>]+)>)/gi, ' ')
- product.description = product.description.replaceAll('||p||', '<p>')
- product.description = product.description.replaceAll('||/p||', '</p>')
+ const regexHtmlTags = /(<([^>]+)>)/gi
+ const regexHtmlTagsExceptP = /<\/?(?!p\b)[^>]*>/g
+ if (product.description.replace(regexHtmlTags, ' ').trim() == '') {
+ product.description = ''
+ }
+ product.description = product.description.replace(regexHtmlTagsExceptP, ' ')
product.description = product.description.trim()
}
return { props: { product } }
diff --git a/src/styles/globals.css b/src/styles/globals.css
index 06a9420c..de40a21d 100644
--- a/src/styles/globals.css
+++ b/src/styles/globals.css
@@ -442,7 +442,7 @@ button {
}
.navbar-user-dropdown-wrapper a {
- @apply text-gray_r-12/80 hover:text-red_r-11 font-medium;
+ @apply text-gray_r-12/80 hover:text-red_r-11 font-medium py-1;
}
.navbar-user-dropdown {
@@ -453,7 +453,7 @@ button {
w-full
flex
flex-col
- gap-y-3
+ gap-y-2
shadow;
}
generated by cgit v1.2.3 (git 2.25.1) at 2026-04-18 00:25:53 +0000