diff --git a/components/Layout.tsx b/components/Layout.tsx index fcb2c6df..43d2138c 100644 --- a/components/Layout.tsx +++ b/components/Layout.tsx @@ -8,7 +8,7 @@ import BottomBar from './mobile/BottomBar' import BounceLoader from './shared/BounceLoader' import TopBar from './TopBar' import useLocalStorageState from '../hooks/useLocalStorageState' -import { SIDEBAR_COLLAPSE_KEY } from '../utils/constants' +import { ACCEPT_TERMS_KEY, SIDEBAR_COLLAPSE_KEY } from '../utils/constants' import { useWallet } from '@solana/wallet-adapter-react' import SuccessParticles from './shared/SuccessParticles' import { tsParticles } from 'tsparticles-engine' @@ -16,8 +16,10 @@ import { loadFull } from 'tsparticles' import useInterval from './shared/useInterval' import { Transition } from '@headlessui/react' import { useTranslation } from 'next-i18next' +import TermsOfUseModal from './modals/TermsOfUseModal' const sideBarAnimationDuration = 500 +const termsLastUpdated = 1679441610978 const Layout = ({ children }: { children: ReactNode }) => { const { connected } = useWallet() @@ -26,6 +28,10 @@ const Layout = ({ children }: { children: ReactNode }) => { SIDEBAR_COLLAPSE_KEY, false ) + const [acceptTerms, setAcceptTerms] = useLocalStorageState( + ACCEPT_TERMS_KEY, + '' + ) const { width } = useViewport() useEffect(() => { @@ -56,6 +62,9 @@ const Layout = ({ children }: { children: ReactNode }) => { particlesInit() }, []) + const showTermsOfUse = + (!acceptTerms || acceptTerms < termsLastUpdated) && connected + return ( <>
@@ -103,6 +112,12 @@ const Layout = ({ children }: { children: ReactNode }) => {
+ {showTermsOfUse ? ( + setAcceptTerms(Date.now())} + /> + ) : null} ) } diff --git a/components/modals/TermsOfUseModal.tsx b/components/modals/TermsOfUseModal.tsx new file mode 100644 index 00000000..f49b1692 --- /dev/null +++ b/components/modals/TermsOfUseModal.tsx @@ -0,0 +1,34 @@ +import { ModalProps } from '../../types/modal' +import Modal from '../shared/Modal' +import { useTranslation } from 'next-i18next' +import Button from '@components/shared/Button' +import { ArrowTopRightOnSquareIcon } from '@heroicons/react/20/solid' + +const TermsOfUseModal = ({ isOpen, onClose }: ModalProps) => { + const { t } = useTranslation('common') + + return ( + + <> +

{t('accept-terms')}

+

+ {t('accept-terms-desc')} + + {t('terms-of-use')} + + +

+ + +
+ ) +} + +export default TermsOfUseModal diff --git a/components/modals/UserSetupModal.tsx b/components/modals/UserSetupModal.tsx index 5b5be9d9..bc92cb8e 100644 --- a/components/modals/UserSetupModal.tsx +++ b/components/modals/UserSetupModal.tsx @@ -1,9 +1,9 @@ import { Transition } from '@headlessui/react' import { ArrowDownTrayIcon, + ArrowTopRightOnSquareIcon, CheckCircleIcon, ExclamationCircleIcon, - FireIcon, PencilIcon, } from '@heroicons/react/20/solid' import { useWallet } from '@solana/wallet-adapter-react' @@ -43,6 +43,8 @@ import useBanksWithBalances from 'hooks/useBanksWithBalances' import BankAmountWithValue from '@components/shared/BankAmountWithValue' import { isMangoError } from 'types' import ColorBlur from '@components/ColorBlur' +import useLocalStorageState from 'hooks/useLocalStorageState' +import { ACCEPT_TERMS_KEY } from 'utils/constants' const UserSetupModal = ({ isOpen, @@ -66,6 +68,7 @@ const UserSetupModal = ({ const { handleConnect } = useEnhancedWallet() const { maxSolDeposit } = useSolBalance() const banks = useBanksWithBalances('walletBalance') + const [, setAcceptTerms] = useLocalStorageState(ACCEPT_TERMS_KEY, '') useEffect(() => { if (connected) { @@ -196,6 +199,9 @@ const UserSetupModal = ({ ) const handleNextStep = () => { + if (showSetupStep === 0) { + setAcceptTerms(Date.now()) + } setShowSetupStep(showSetupStep + 1) } @@ -203,8 +209,8 @@ const UserSetupModal = ({
{t('onboarding:intro-desc')}

-
+
- diff --git a/public/locales/en/common.json b/public/locales/en/common.json index a9600e59..968e42b1 100644 --- a/public/locales/en/common.json +++ b/public/locales/en/common.json @@ -1,6 +1,8 @@ { "404-heading": "This page was liquidated", "404-description": "or, never existed...", + "accept-terms": "Accept Terms", + "accept-terms-desc": "By continuing, you accept the Mango", "account": "Account", "account-closed": "Account Closed 👋", "account-balance": "Account Balance", @@ -13,6 +15,7 @@ "accounts": "Accounts", "actions": "Actions", "add-new-account": "Add New Account", + "agree-and-continue": "Agree and Continue", "amount": "Amount", "amount-owed": "Amount Owed", "asset-liability-weight": "Asset/Liability Weights", diff --git a/public/locales/es/common.json b/public/locales/es/common.json index b66276ab..968e42b1 100644 --- a/public/locales/es/common.json +++ b/public/locales/es/common.json @@ -1,6 +1,8 @@ { "404-heading": "This page was liquidated", "404-description": "or, never existed...", + "accept-terms": "Accept Terms", + "accept-terms-desc": "By continuing, you accept the Mango", "account": "Account", "account-closed": "Account Closed 👋", "account-balance": "Account Balance", @@ -13,6 +15,7 @@ "accounts": "Accounts", "actions": "Actions", "add-new-account": "Add New Account", + "agree-and-continue": "Agree and Continue", "amount": "Amount", "amount-owed": "Amount Owed", "asset-liability-weight": "Asset/Liability Weights", @@ -21,8 +24,8 @@ "asset-weight-desc": "Asset weight applies a haircut to the value of the collateral in your account health calculation. The lower the asset weight, the less the asset counts towards collateral.", "available": "Available", "available-balance": "Available Balance", - "bal": "Bal", "balance": "Balance", + "bal": "Bal", "balances": "Balances", "borrow": "Borrow", "borrow-amount": "Borrow Amount", @@ -62,6 +65,7 @@ "deposit-more-sol": "Your SOL wallet balance is too low. Add more to pay for transactions", "deposit-rate": "Deposit APR", "disconnect": "Disconnect", + "documentation": "Documentation", "edit": "Edit", "edit-account": "Edit Account Name", "edit-profile-image": "Edit Profile Image", @@ -86,6 +90,7 @@ "loan-origination-fee": "Borrow Fee", "loan-origination-fee-tooltip": "{{fee}} fee for opening a borrow.", "mango": "Mango", + "mango-stats": "Mango Stats", "market": "Market", "max": "Max", "max-borrow": "Max Borrow", @@ -98,6 +103,7 @@ "optional": "Optional", "outstanding-balance": "Outstanding Balance", "perp": "Perp", + "perp-markets": "Perp Markets", "pnl": "PnL", "price": "Price", "quantity": "Quantity", @@ -122,6 +128,7 @@ "show-zero-balances": "Show Zero Balances", "solana-tps": "Solana TPS", "spot": "Spot", + "spot-markets": "Spot Markets", "stats": "Stats", "swap": "Swap", "terms-of-use": "Terms of Use", diff --git a/public/locales/ru/common.json b/public/locales/ru/common.json index b66276ab..968e42b1 100644 --- a/public/locales/ru/common.json +++ b/public/locales/ru/common.json @@ -1,6 +1,8 @@ { "404-heading": "This page was liquidated", "404-description": "or, never existed...", + "accept-terms": "Accept Terms", + "accept-terms-desc": "By continuing, you accept the Mango", "account": "Account", "account-closed": "Account Closed 👋", "account-balance": "Account Balance", @@ -13,6 +15,7 @@ "accounts": "Accounts", "actions": "Actions", "add-new-account": "Add New Account", + "agree-and-continue": "Agree and Continue", "amount": "Amount", "amount-owed": "Amount Owed", "asset-liability-weight": "Asset/Liability Weights", @@ -21,8 +24,8 @@ "asset-weight-desc": "Asset weight applies a haircut to the value of the collateral in your account health calculation. The lower the asset weight, the less the asset counts towards collateral.", "available": "Available", "available-balance": "Available Balance", - "bal": "Bal", "balance": "Balance", + "bal": "Bal", "balances": "Balances", "borrow": "Borrow", "borrow-amount": "Borrow Amount", @@ -62,6 +65,7 @@ "deposit-more-sol": "Your SOL wallet balance is too low. Add more to pay for transactions", "deposit-rate": "Deposit APR", "disconnect": "Disconnect", + "documentation": "Documentation", "edit": "Edit", "edit-account": "Edit Account Name", "edit-profile-image": "Edit Profile Image", @@ -86,6 +90,7 @@ "loan-origination-fee": "Borrow Fee", "loan-origination-fee-tooltip": "{{fee}} fee for opening a borrow.", "mango": "Mango", + "mango-stats": "Mango Stats", "market": "Market", "max": "Max", "max-borrow": "Max Borrow", @@ -98,6 +103,7 @@ "optional": "Optional", "outstanding-balance": "Outstanding Balance", "perp": "Perp", + "perp-markets": "Perp Markets", "pnl": "PnL", "price": "Price", "quantity": "Quantity", @@ -122,6 +128,7 @@ "show-zero-balances": "Show Zero Balances", "solana-tps": "Solana TPS", "spot": "Spot", + "spot-markets": "Spot Markets", "stats": "Stats", "swap": "Swap", "terms-of-use": "Terms of Use", diff --git a/public/locales/zh/common.json b/public/locales/zh/common.json index b66276ab..968e42b1 100644 --- a/public/locales/zh/common.json +++ b/public/locales/zh/common.json @@ -1,6 +1,8 @@ { "404-heading": "This page was liquidated", "404-description": "or, never existed...", + "accept-terms": "Accept Terms", + "accept-terms-desc": "By continuing, you accept the Mango", "account": "Account", "account-closed": "Account Closed 👋", "account-balance": "Account Balance", @@ -13,6 +15,7 @@ "accounts": "Accounts", "actions": "Actions", "add-new-account": "Add New Account", + "agree-and-continue": "Agree and Continue", "amount": "Amount", "amount-owed": "Amount Owed", "asset-liability-weight": "Asset/Liability Weights", @@ -21,8 +24,8 @@ "asset-weight-desc": "Asset weight applies a haircut to the value of the collateral in your account health calculation. The lower the asset weight, the less the asset counts towards collateral.", "available": "Available", "available-balance": "Available Balance", - "bal": "Bal", "balance": "Balance", + "bal": "Bal", "balances": "Balances", "borrow": "Borrow", "borrow-amount": "Borrow Amount", @@ -62,6 +65,7 @@ "deposit-more-sol": "Your SOL wallet balance is too low. Add more to pay for transactions", "deposit-rate": "Deposit APR", "disconnect": "Disconnect", + "documentation": "Documentation", "edit": "Edit", "edit-account": "Edit Account Name", "edit-profile-image": "Edit Profile Image", @@ -86,6 +90,7 @@ "loan-origination-fee": "Borrow Fee", "loan-origination-fee-tooltip": "{{fee}} fee for opening a borrow.", "mango": "Mango", + "mango-stats": "Mango Stats", "market": "Market", "max": "Max", "max-borrow": "Max Borrow", @@ -98,6 +103,7 @@ "optional": "Optional", "outstanding-balance": "Outstanding Balance", "perp": "Perp", + "perp-markets": "Perp Markets", "pnl": "PnL", "price": "Price", "quantity": "Quantity", @@ -122,6 +128,7 @@ "show-zero-balances": "Show Zero Balances", "solana-tps": "Solana TPS", "spot": "Spot", + "spot-markets": "Spot Markets", "stats": "Stats", "swap": "Swap", "terms-of-use": "Terms of Use", diff --git a/public/locales/zh_tw/common.json b/public/locales/zh_tw/common.json index b66276ab..968e42b1 100644 --- a/public/locales/zh_tw/common.json +++ b/public/locales/zh_tw/common.json @@ -1,6 +1,8 @@ { "404-heading": "This page was liquidated", "404-description": "or, never existed...", + "accept-terms": "Accept Terms", + "accept-terms-desc": "By continuing, you accept the Mango", "account": "Account", "account-closed": "Account Closed 👋", "account-balance": "Account Balance", @@ -13,6 +15,7 @@ "accounts": "Accounts", "actions": "Actions", "add-new-account": "Add New Account", + "agree-and-continue": "Agree and Continue", "amount": "Amount", "amount-owed": "Amount Owed", "asset-liability-weight": "Asset/Liability Weights", @@ -21,8 +24,8 @@ "asset-weight-desc": "Asset weight applies a haircut to the value of the collateral in your account health calculation. The lower the asset weight, the less the asset counts towards collateral.", "available": "Available", "available-balance": "Available Balance", - "bal": "Bal", "balance": "Balance", + "bal": "Bal", "balances": "Balances", "borrow": "Borrow", "borrow-amount": "Borrow Amount", @@ -62,6 +65,7 @@ "deposit-more-sol": "Your SOL wallet balance is too low. Add more to pay for transactions", "deposit-rate": "Deposit APR", "disconnect": "Disconnect", + "documentation": "Documentation", "edit": "Edit", "edit-account": "Edit Account Name", "edit-profile-image": "Edit Profile Image", @@ -86,6 +90,7 @@ "loan-origination-fee": "Borrow Fee", "loan-origination-fee-tooltip": "{{fee}} fee for opening a borrow.", "mango": "Mango", + "mango-stats": "Mango Stats", "market": "Market", "max": "Max", "max-borrow": "Max Borrow", @@ -98,6 +103,7 @@ "optional": "Optional", "outstanding-balance": "Outstanding Balance", "perp": "Perp", + "perp-markets": "Perp Markets", "pnl": "PnL", "price": "Price", "quantity": "Quantity", @@ -122,6 +128,7 @@ "show-zero-balances": "Show Zero Balances", "solana-tps": "Solana TPS", "spot": "Spot", + "spot-markets": "Spot Markets", "stats": "Stats", "swap": "Swap", "terms-of-use": "Terms of Use", diff --git a/styles/globals.css b/styles/globals.css index a05b0b7e..49733c8a 100644 --- a/styles/globals.css +++ b/styles/globals.css @@ -440,6 +440,10 @@ li { @apply text-sm text-th-fgd-3; } +a { + @apply default-transition text-th-fgd-1 md:hover:text-th-fgd-3; +} + /* Forms */ input::placeholder { diff --git a/utils/constants.ts b/utils/constants.ts index 60968904..a578df89 100644 --- a/utils/constants.ts +++ b/utils/constants.ts @@ -49,6 +49,8 @@ export const SHOW_ORDER_LINES_KEY = 'showOrderLines-0.1' export const SHOW_SWAP_INTRO_MODAL = 'showSwapModal-0.1' +export const ACCEPT_TERMS_KEY = 'termsOfUseAccepted-0.1' + // Unused export const PROFILE_CATEGORIES = [ 'borrower',