fix modal display
This commit is contained in:
parent
e331c4c805
commit
1a8a11084e
|
@ -18,7 +18,6 @@ import useIpAddress from 'hooks/useIpAddress'
|
|||
import RestrictedCountryModal from './shared/RestrictedCountryModal'
|
||||
import { useRouter } from 'next/router'
|
||||
import Modal from './shared/Modal'
|
||||
import { ModalProps } from 'types/modal'
|
||||
import Button from './shared/Button'
|
||||
import Image from 'next/image'
|
||||
|
||||
|
@ -69,20 +68,18 @@ const TermsOfUse = () => {
|
|||
ACCEPT_TERMS_KEY,
|
||||
'',
|
||||
)
|
||||
const [, setYieldFansIntro] = useLocalStorageState(
|
||||
YIELD_FANS_INTRO_KEY,
|
||||
false,
|
||||
)
|
||||
const [yieldFansIntro] = useLocalStorageState(YIELD_FANS_INTRO_KEY, false)
|
||||
|
||||
const showTermsOfUse = useMemo(() => {
|
||||
return (
|
||||
(!acceptTerms || acceptTerms < termsLastUpdated) && asPath !== '/risks'
|
||||
(!acceptTerms || acceptTerms < termsLastUpdated) &&
|
||||
asPath !== '/risks' &&
|
||||
yieldFansIntro
|
||||
)
|
||||
}, [acceptTerms, asPath])
|
||||
}, [acceptTerms, asPath, yieldFansIntro])
|
||||
|
||||
const handleClose = () => {
|
||||
setAcceptTerms(Date.now())
|
||||
setYieldFansIntro(true)
|
||||
}
|
||||
|
||||
return (
|
||||
|
@ -95,18 +92,13 @@ const TermsOfUse = () => {
|
|||
}
|
||||
|
||||
const YieldFansIntro = () => {
|
||||
const [acceptTerms] = useLocalStorageState(ACCEPT_TERMS_KEY, '')
|
||||
const [yieldFansIntro, setYieldFansIntro] = useLocalStorageState(
|
||||
YIELD_FANS_INTRO_KEY,
|
||||
false,
|
||||
)
|
||||
|
||||
const showModal = useMemo(() => {
|
||||
return acceptTerms && !yieldFansIntro
|
||||
}, [acceptTerms, yieldFansIntro])
|
||||
|
||||
return showModal ? (
|
||||
<Modal isOpen={showModal} onClose={() => setYieldFansIntro(true)}>
|
||||
return !yieldFansIntro ? (
|
||||
<Modal isOpen={!yieldFansIntro} onClose={() => setYieldFansIntro(true)}>
|
||||
<div className="flex flex-col items-center">
|
||||
<Image
|
||||
className="mb-3"
|
||||
|
|
|
@ -5,7 +5,6 @@ import Button from '@components/shared/Button'
|
|||
import { CheckCircleIcon } from '@heroicons/react/20/solid'
|
||||
import { useState } from 'react'
|
||||
import Checkbox from '@components/forms/Checkbox'
|
||||
import Image from 'next/image'
|
||||
import { useTheme } from 'next-themes'
|
||||
|
||||
const TermsOfUseModal = ({ isOpen, onClose }: ModalProps) => {
|
||||
|
@ -23,16 +22,7 @@ const TermsOfUseModal = ({ isOpen, onClose }: ModalProps) => {
|
|||
>
|
||||
<div className="mb-6">
|
||||
<div className="flex flex-col items-center pb-4">
|
||||
<Image
|
||||
src="/logos/yield-fans.png"
|
||||
alt="Logo"
|
||||
height={48}
|
||||
width={48}
|
||||
/>
|
||||
<h2 className="mt-2 text-xl">Welcome yield fan</h2>
|
||||
<p className="text-center">
|
||||
Earn leveraged yield on your JLP and liquid staking tokens.
|
||||
</p>
|
||||
<h2 className="mt-2 text-xl">Accept terms</h2>
|
||||
</div>
|
||||
<div
|
||||
className={`bg-x-repeat h-2 w-full ${
|
||||
|
|
Loading…
Reference in New Issue