Skip to content

Commit

Permalink
fix
Browse files Browse the repository at this point in the history
  • Loading branch information
imhson committed Aug 25, 2023
1 parent 8c5acdf commit dea0372
Show file tree
Hide file tree
Showing 4 changed files with 49 additions and 129 deletions.
2 changes: 1 addition & 1 deletion src/components/Header/ForgotPasswordModal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -79,7 +79,7 @@ export default function ForgotPasswordModal({ onClose }) {
{t('Please click on the link to change your password.')}
</p>
</div>
<div className='flex flex-col text-center'>
<div className='flex flex-col text-center text-xs leading-[14px]'>
<p className='line-clamp-1'>
{t('Have not received any email')}?{' '}
<span className='text-second-color font-semibold cursor-pointer' onClick={() => setIsFirstStep(true)}>
Expand Down
2 changes: 1 addition & 1 deletion src/components/Header/SignUpSuccessModal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ export default function SignUpSuccessModal({ setSignUpOpen, onClose }) {
<span className='text-second-color font-bold'>{account?.email}</span>.
{t('Please click on the link to verify your email account.')}
</p>
<div className='flex flex-col text-center'>
<div className='flex flex-col text-center text-xs leading-[14px]'>
<p className=' font-medium text-center w-full max-w-[500px] mx-auto'>
{t('Have not received any email')}?{' '}
<span
Expand Down
170 changes: 44 additions & 126 deletions src/pages/_app.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -144,71 +144,23 @@ const App = ({ Component, pageProps }: AppProps) => {
return (
<>
{account?.verified ? (
validateEmail(account?.email) ? (
account?.name ? (
<></>
) : (
<>
<Modal open={open} setOpen={setOpen}>
<div className='p-6 flex flex-col w-[322px]'>
<div className='gap-2 flex flex-col'>
<div className='text-xl font-semibold leading-6 text-center'>{t('Set a username')}</div>

<OutlineTextField label={t('Username')} errorMsg={errorMsg} value={name} onChange={setName} />
<OutlineTextField label={t('Email')} value={account.email} disabled={true} />
</div>
<p className='text-xs mt-[6px] text-center'>
{t('This email will also be used to receive updates of new chapter when you subscribe a manga.')}
</p>
<div className='mt-3 mx-auto'>
<FilledButton size='lg' disabled={!name} loading={loading} onClick={setUName}>
{t('Continue')}
</FilledButton>
</div>
<p className='text-xs mt-2 font-medium text-center'>
{t('Or')}{' '}
<a
className='text-second-color font-bold'
onClick={() => {
setOpen(false)
document.getElementById('open-sign-in-btn')?.click()
}}>
{t('sign in')}
</a>{' '}
{t('with another account')}
</p>
</div>
</Modal>
</>
)
account?.name ? (
<></>
) : (
<>
<Modal open={open} setOpen={setOpen}>
<div className='p-6 flex flex-col w-[322px]'>
<div className='gap-3 flex flex-col'>
<div className='text-xl font-semibold leading-6 text-center'>{t('Verify your email')}</div>
<p className='text-[10px] leading-3 text-center'>
{t(
'An active email is required when sign in to Punkga, verify it only once and enjoy all of our great mangas.'
)}
</p>
<OutlineTextField
label={t('Email')}
value={email}
onChange={setEmail}
errorMsg={emailErrorMsg}
placeholder={t('Enter your email')}
/>
<OutlineTextField
label={t('Username')}
errorMsg={errorMsg}
value={name}
onChange={setName}
placeholder={t('Enter username')}
/>
<div className='gap-2 flex flex-col'>
<div className='text-xl font-semibold leading-6 text-center'>{t('Set a username')}</div>

<OutlineTextField label={t('Username')} errorMsg={errorMsg} value={name} onChange={setName} />
<OutlineTextField label={t('Email')} value={account.email} disabled={true} />
</div>
<p className='text-xs mt-[6px] text-center'>
{t('This email will also be used to receive updates of new chapter when you subscribe a manga.')}
</p>
<div className='mt-3 mx-auto'>
<FilledButton size='lg' disabled={!name} loading={loading} onClick={setUNameAndEmail}>
<FilledButton size='lg' disabled={!name} loading={loading} onClick={setUName}>
{t('Continue')}
</FilledButton>
</div>
Expand All @@ -226,40 +178,6 @@ const App = ({ Component, pageProps }: AppProps) => {
</p>
</div>
</Modal>
<Modal open={openSuccessModal} setOpen={setOpenSuccessModal}>
<div className={` py-6 px-[60px] flex flex-col gap-4 w-full max-w-[670px]`}>
<p className='text-center text-xl leading-6 font-semibold'>{t('Email verification')}</p>
<Image src={Mail} alt='' className='mx-auto' />
<p className=' font-medium text-center w-full max-w-[500px] mx-auto'>
{t('A verification link has been sent to')}{' '}
<span className='text-second-color font-bold'>{email}</span>.
{t('Please click on the link to verify your email account.')}
</p>
<div className='flex flex-col text-center'>
<p className=' font-medium text-center w-full max-w-[500px] mx-auto'>
{t('Have not received any email')}?{' '}
<span
className='text-second-color font-bold cursor-pointer'
onClick={() => resendVerifyEmail(email, 'update_email')}>
{t('Click here')}
</span>{' '}
{t('to resend verification link')}
</p>
<p className=' font-medium text-center w-full max-w-[500px] mx-auto'>
{t('Or')}{' '}
<span
className='text-second-color font-bold cursor-pointer'
onClick={() => {
setOpenSuccessModal(false)
document.getElementById('open-sign-in-btn')?.click()
}}>
{t('sign up')}
</span>{' '}
{t('with another email')}
</p>
</div>
</div>
</Modal>
</>
)
) : account && !validateEmail(account?.email) ? (
Expand Down Expand Up @@ -307,43 +225,43 @@ const App = ({ Component, pageProps }: AppProps) => {
</p>
</div>
</Modal>
<Modal open={openSuccessModal} setOpen={setOpenSuccessModal}>
<div className={` py-6 px-[60px] flex flex-col gap-4 w-full max-w-[670px]`}>
<p className='text-center text-xl leading-6 font-semibold'>{t('Email verification')}</p>
<Image src={Mail} alt='' className='mx-auto' />
<p className=' font-medium text-center w-full max-w-[500px] mx-auto'>
{t('A verification link has been sent to')} <span className='text-second-color font-bold'>{email}</span>
.{t('Please click on the link to verify your email account.')}
</p>
<div className='flex flex-col text-center'>
<p className=' font-medium text-center w-full max-w-[500px] mx-auto'>
{t('Have not received any email')}?{' '}
<span
className='text-second-color font-bold cursor-pointer'
onClick={() => resendVerifyEmail(email, 'update_email')}>
{t('Click here')}
</span>{' '}
{t('to resend verification link')}
</p>
<p className=' font-medium text-center w-full max-w-[500px] mx-auto'>
{t('Or')}{' '}
<span
className='text-second-color font-bold cursor-pointer'
onClick={() => {
setOpenSuccessModal(false)
document.getElementById('open-sign-in-btn')?.click()
}}>
{t('sign up')}
</span>{' '}
{t('with another email')}
</p>
</div>
</div>
</Modal>
</>
) : (
<></>
)}
<Modal open={openSuccessModal} setOpen={setOpenSuccessModal}>
<div className={` py-6 px-[60px] flex flex-col gap-4 w-full max-w-[670px]`}>
<p className='text-center text-xl leading-6 font-semibold'>{t('Email verification')}</p>
<Image src={Mail} alt='' className='mx-auto' />
<p className=' font-medium text-center w-full max-w-[500px] mx-auto'>
{t('A verification link has been sent to')} <span className='text-second-color font-bold'>{email}</span>.
{t('Please click on the link to verify your email account.')}
</p>
<div className='flex flex-col text-center text-xs leading-[14px]'>
<p className=' font-medium text-center w-full max-w-[500px] mx-auto'>
{t('Have not received any email')}?{' '}
<span
className='text-second-color font-bold cursor-pointer'
onClick={() => resendVerifyEmail(email, 'update_email')}>
{t('Click here')}
</span>{' '}
{t('to resend verification link')}
</p>
<p className=' font-medium text-center w-full max-w-[500px] mx-auto'>
{t('Or')}{' '}
<span
className='text-second-color font-bold cursor-pointer'
onClick={() => {
setOpenSuccessModal(false)
document.getElementById('open-sign-in-btn')?.click()
}}>
{t('sign up')}
</span>{' '}
{t('with another email')}
</p>
</div>
</div>
</Modal>
<Component {...pageProps} />
</>
)
Expand Down
4 changes: 3 additions & 1 deletion src/pages/profile/profile.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -345,7 +345,9 @@ export default function Profile({ subscribeList, unsubscribe, subscribe, curentl
) : (
<div className='text-xs text-[#19191B] font-medium leading-[15px] md:font-medium md:text-base md:leading-5'>
<p
className={`text-[#19191B] ${showMore ? '' : 'line-clamp-3 cursor-pointer'}`}
className={`text-[#19191B] ${
showMore ? '' : 'md:line-clamp-3 line-clamp-5 cursor-pointer'
}`}
onClick={() => setShowMore(!showMore)}>
{account.bio}
</p>
Expand Down

0 comments on commit dea0372

Please sign in to comment.