mango-v4-ui/components/account/HideMangoAccount.tsx

61 lines
1.8 KiB
TypeScript

import {
toggleMangoAccountHidden,
useMangoAccountHidden,
} from 'hooks/useMangoAccountHidden'
import { useWallet } from '@solana/wallet-adapter-react'
import useMangoAccount from 'hooks/useMangoAccount'
import Switch from '@components/forms/Switch'
import { useState } from 'react'
import Loading from '@components/shared/Loading'
import Tooltip from '@components/shared/Tooltip'
import { useTranslation } from 'react-i18next'
import { SETTINGS_BUTTON_TITLE_CLASSES } from '@components/settings/AccountSettings'
const HideMangoAccount = () => {
const { t } = useTranslation('settings')
const { publicKey, signMessage } = useWallet()
const { mangoAccountPk } = useMangoAccount()
const { accountHidden, refetch } = useMangoAccountHidden()
const [signingForHide, setSigningForHide] = useState(false)
const handleHideMangoAccount = async () => {
if (!publicKey || !mangoAccountPk || !signMessage) return
setSigningForHide(true)
try {
await toggleMangoAccountHidden(
mangoAccountPk,
publicKey,
!(accountHidden ?? false),
signMessage,
)
refetch()
setSigningForHide(false)
} catch (e) {
console.error('Error toggling account visibility', e)
setSigningForHide(false)
}
}
return (
<>
<div className="flex items-center justify-between border-t border-th-bkg-3 py-4 md:px-4">
<Tooltip content={t('settings:tooltip-private-account')}>
<p className={`tooltip-underline ${SETTINGS_BUTTON_TITLE_CLASSES}`}>
{t('settings:private-account')}
</p>
</Tooltip>
{signingForHide ? (
<Loading />
) : (
<Switch
checked={accountHidden ?? false}
onChange={handleHideMangoAccount}
/>
)}
</div>
</>
)
}
export default HideMangoAccount