blockworks-foundation
/
mango-v4-ui
mirror of https://github.com/blockworks-foundation/mango-v4-ui.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #224 from blockworks-foundation/increase-token-accounts 

increase token accounts
This commit is contained in:
tlrsssss 2023-08-06 11:30:17 -04:00 committed by GitHub
parent 6e2e3b5560 1cbdb75502
commit 60112c282a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 207 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

168
components/settings/AccountSettings.tsx Normal file
View File

@ -0,0 +1,168 @@
import Button from '@components/shared/Button'
import InlineNotification from '@components/shared/InlineNotification'
import Loading from '@components/shared/Loading'
import Tooltip from '@components/shared/Tooltip'
import mangoStore from '@store/mangoStore'
import useMangoAccount from 'hooks/useMangoAccount'
import { useTranslation } from 'next-i18next'
import { useCallback, useEffect, useState } from 'react'
import NumberFormat, {
NumberFormatValues,
SourceInfo,
} from 'react-number-format'
import { isMangoError } from 'types'
import { notify } from 'utils/notifications'
type FormErrors = Partial<Record<keyof AccountSettingsForm, string>>
type AccountSettingsForm = {
tokenAccounts: string | undefined
}
const DEFAULT_FORM = {
tokenAccounts: '',
}
const AccountSettings = () => {
const { t } = useTranslation(['common', 'settings'])
const { mangoAccount, mangoAccountAddress } = useMangoAccount()
const [accountSettingsForm, setAccountSettingsForm] =
useState<AccountSettingsForm>(DEFAULT_FORM)
const [formErrors, setFormErrors] = useState<FormErrors>()
const [submitting, setSubmitting] = useState(false)
useEffect(() => {
if (mangoAccountAddress) {
setAccountSettingsForm({
tokenAccounts: mangoAccount?.tokens.length.toString(),
})
}
}, [mangoAccountAddress])
const isFormValid = (form: AccountSettingsForm) => {
const mangoAccount = mangoStore.getState().mangoAccount.current
const invalidFields: FormErrors = {}
setFormErrors({})
const tokenAccounts: (keyof AccountSettingsForm)[] = ['tokenAccounts']
for (const key of tokenAccounts) {
const value = form[key] as string
const minLength = mangoAccount?.tokens.length || 8
if (parseInt(value) <= minLength) {
invalidFields[key] = t('settings:error-amount', {
type: t('settings:token-accounts'),
greaterThan: mangoAccount?.tokens.length,
lessThan: '17',
})
}
}
if (Object.keys(invalidFields).length) {
setFormErrors(invalidFields)
}
return invalidFields
}
const handleSetForm = (
propertyName: string,
e: NumberFormatValues,
info: SourceInfo,
) => {
if (info.source !== 'event') return
setFormErrors({})
setAccountSettingsForm((prevState) => ({
...prevState,
[propertyName]: e.value,
}))
}
const handleUpdateAccountSize = useCallback(async () => {
const invalidFields = isFormValid(accountSettingsForm)
if (Object.keys(invalidFields).length) {
return
}
const client = mangoStore.getState().client
const group = mangoStore.getState().group
const mangoAccount = mangoStore.getState().mangoAccount.current
const actions = mangoStore.getState().actions
const { tokenAccounts } = accountSettingsForm
if (!mangoAccount || !group || !tokenAccounts) return
setSubmitting(true)
try {
const tx = await client.accountExpandV2(
group,
mangoAccount,
parseInt(tokenAccounts),
mangoAccount.serum3.length,
mangoAccount.perps.length,
mangoAccount.perpOpenOrders.length,
mangoAccount.tokenConditionalSwaps.length,
)
notify({
title: 'Transaction confirmed',
type: 'success',
txid: tx,
})
await actions.reloadMangoAccount()
setSubmitting(false)
} catch (e) {
console.error(e)
if (!isMangoError(e)) return
notify({
title: 'Transaction failed',
description: e.message,
txid: e.txid,
type: 'error',
})
} finally {
setSubmitting(false)
}
}, [accountSettingsForm])
return (
<>
<h2 className="mb-4 text-base">{t('account')}</h2>
<div className="flex flex-col border-t border-th-bkg-3 py-4 md:flex-row md:items-center md:justify-between md:px-4">
<Tooltip content={t('settings:tooltip-increase-token-accounts')}>
<p className="tooltip-underline mb-2 md:mb-0">
{t('settings:increase-token-accounts')}
</p>
</Tooltip>
<div className="flex flex-col items-start md:items-end">
<div className="flex items-center w-full md:w-auto">
<NumberFormat
name="tokenAccounts"
id="tokenAccounts"
inputMode="numeric"
thousandSeparator=","
allowNegative={false}
isNumericString={true}
className="h-10 rounded-l-md border w-full md:w-24 border-th-input-border bg-th-input-bkg px-3 font-mono text-base text-th-fgd-1 focus:border-th-fgd-4 focus:outline-none md:hover:border-th-input-border-hover"
value={accountSettingsForm.tokenAccounts}
onValueChange={(e, sourceInfo) =>
handleSetForm('tokenAccounts', e, sourceInfo)
}
/>
<Button
className="border-l-0 rounded-l-none w-24 flex items-center justify-center"
onClick={handleUpdateAccountSize}
secondary
>
{submitting ? <Loading /> : t('update')}
</Button>
</div>
{formErrors?.tokenAccounts ? (
<div className="mt-1">
<InlineNotification
type="error"
desc={formErrors.tokenAccounts}
hideBorder
hidePadding
/>
</div>
) : null}
</div>
</div>
</>
)
}
export default AccountSettings

4
components/settings/SettingsPage.tsx
View File

@ -7,6 +7,7 @@ import PreferredExplorerSettings from './PreferredExplorerSettings'
import RpcSettings from './RpcSettings'
import SoundSettings from './SoundSettings'
import { breakpoints } from 'utils/theme'
import AccountSettings from './AccountSettings'
const SettingsPage = () => {
const { width } = useViewport()
@ -16,6 +17,9 @@ const SettingsPage = () => {
<div className="col-span-12 border-b border-th-bkg-3 lg:col-span-10 lg:col-start-2 xl:col-span-8 xl:col-start-3">
<RpcSettings />
</div>
<div className="col-span-12 border-b border-th-bkg-3 pt-8 lg:col-span-10 lg:col-start-2 xl:col-span-8 xl:col-start-3">
<AccountSettings />
</div>
<div className="col-span-12 border-b border-th-bkg-3 pt-8 lg:col-span-10 lg:col-start-2 xl:col-span-8 xl:col-start-3">
<DisplaySettings />
</div>

14
public/locales/en/settings.json
View File

@ -22,6 +22,7 @@
"dark": "Dark",
"display": "Display",
"error-alphanumeric-only": "Alphanumeric characters only",
"error-amount": "{{type}} must be greater than {{greaterThan}} and less than {{lessThan}}",
"error-key-in-use": "Hot key already in use. Choose a unique key",
"error-key-limit-reached": "You've reached the maximum number of hot keys",
"error-must-be-above-zero": "Must be greater than zero",
@ -34,9 +35,11 @@
"high-contrast": "High Contrast",
"hot-keys": "Hot Keys",
"hot-keys-desc": "Use hot keys to place orders on the trade page. They execute on the market you're viewing and are not market specific.",
"increase-token-accounts": "Increase Token Accounts",
"key-sequence": "Key Sequence",
"language": "Language",
"light": "Light",
"limit-order-filled": "Limit Order Fills",
"lychee": "Lychee",
"mango": "Mango",
"mango-classic": "Mango Classic",
@ -44,11 +47,13 @@
"new-hot-key": "New Hot Key",
"no-hot-keys": "Create your first hot key",
"notification-position": "Notification Position",
"notifications": "Notifications",
"notional": "Notional",
"number-scroll": "Number Scroll",
"olive": "Olive",
"options": "Options",
"oracle": "Oracle",
"orderbook-bandwidth-saving": "Orderbook Bandwidth Saving",
"orderbook-flash": "Orderbook Flash",
"order-side": "Order Side",
"order-size-type": "Order Size Type",
@ -73,9 +78,12 @@
"swap-success": "Swap/Trade Success",
"swap-trade-size-selector": "Swap/Trade Size Selector",
"theme": "Theme",
"token-accounts": "Token Accounts",
"tooltip-hot-key-notional-size": "Set size as a USD value.",
"tooltip-hot-key-percentage-size": "Set size as a percentage of your max leverage.",
"tooltip-hot-key-price": "Set a price as a percentage change from the oracle price.",
"tooltip-increase-token-accounts": "Increase the amount of tokens you can hold in your account. The SOL required can be recovered if you close your account",
"tooltip-orderbook-bandwidth-saving": "Use an off-chain service for Orderbook updates to decrease data usage by ~1000x. Disable this if open orders are not highlighted in the book correctly.",
"top-left": "Top-Left",
"top-right": "Top-Right",
"trade-layout": "Trade Layout",
@ -83,9 +91,5 @@
"transaction-success": "Transaction Success",
"trade-chart": "Trade Chart",
"trading-view": "Trading View",
"trigger-key": "Trigger Key",
"notifications": "Notifications",
"limit-order-filled": "Limit Order Fills",
"orderbook-bandwidth-saving": "Orderbook Bandwidth Saving",
"tooltip-orderbook-bandwidth-saving": "Use an off-chain service for Orderbook updates to decrease data usage by ~1000x. Disable this if open orders are not highlighted in the book correctly."
"trigger-key": "Trigger Key"
}

14
public/locales/es/settings.json
View File

@ -22,6 +22,7 @@
"dark": "Dark",
"display": "Display",
"error-alphanumeric-only": "Alphanumeric characters only",
"error-amount": "{{type}} must be greater than {{greaterThan}} and less than {{lessThan}}",
"error-key-in-use": "Hot key already in use. Choose a unique key",
"error-key-limit-reached": "You've reached the maximum number of hot keys",
"error-must-be-above-zero": "Must be greater than zero",
@ -34,9 +35,11 @@
"high-contrast": "High Contrast",
"hot-keys": "Hot Keys",
"hot-keys-desc": "Use hot keys to place orders on the trade page. They execute on the market you're viewing and are not market specific.",
"increase-token-accounts": "Increase Token Accounts",
"key-sequence": "Key Sequence",
"language": "Language",
"light": "Light",
"limit-order-filled": "Limit Order Fills",
"lychee": "Lychee",
"mango": "Mango",
"mango-classic": "Mango Classic",
@ -44,11 +47,13 @@
"new-hot-key": "New Hot Key",
"no-hot-keys": "Create your first hot key",
"notification-position": "Notification Position",
"notifications": "Notifications",
"notional": "Notional",
"number-scroll": "Number Scroll",
"olive": "Olive",
"options": "Options",
"oracle": "Oracle",
"orderbook-bandwidth-saving": "Orderbook Bandwidth Saving",
"orderbook-flash": "Orderbook Flash",
"order-side": "Order Side",
"order-size-type": "Order Size Type",
@ -73,9 +78,12 @@
"swap-success": "Swap/Trade Success",
"swap-trade-size-selector": "Swap/Trade Size Selector",
"theme": "Theme",
"token-accounts": "Token Accounts",
"tooltip-hot-key-notional-size": "Set size as a USD value.",
"tooltip-hot-key-percentage-size": "Set size as a percentage of your max leverage.",
"tooltip-hot-key-price": "Set a price as a percentage change from the oracle price.",
"tooltip-increase-token-accounts": "Increase the amount of tokens you can hold in your account. The SOL required can be recovered if you close your account",
"tooltip-orderbook-bandwidth-saving": "Use an off-chain service for Orderbook updates to decrease data usage by ~1000x. Disable this if open orders are not highlighted in the book correctly.",
"top-left": "Top-Left",
"top-right": "Top-Right",
"trade-layout": "Trade Layout",
@ -83,9 +91,5 @@
"transaction-success": "Transaction Success",
"trade-chart": "Trade Chart",
"trading-view": "Trading View",
"trigger-key": "Trigger Key",
"notifications": "Notifications",
"limit-order-filled": "Limit Order Fills",
"orderbook-bandwidth-saving": "Orderbook Bandwidth Saving",
"tooltip-orderbook-bandwidth-saving": "Use an off-chain service for Orderbook updates to decrease data usage by ~1000x. Disable this if open orders are not highlighted in the book correctly."
"trigger-key": "Trigger Key"
}

14
public/locales/ru/settings.json
View File

@ -22,6 +22,7 @@
"dark": "Dark",
"display": "Display",
"error-alphanumeric-only": "Alphanumeric characters only",
"error-amount": "{{type}} must be greater than {{greaterThan}} and less than {{lessThan}}",
"error-key-in-use": "Hot key already in use. Choose a unique key",
"error-key-limit-reached": "You've reached the maximum number of hot keys",
"error-must-be-above-zero": "Must be greater than zero",
@ -34,9 +35,11 @@
"high-contrast": "High Contrast",
"hot-keys": "Hot Keys",
"hot-keys-desc": "Use hot keys to place orders on the trade page. They execute on the market you're viewing and are not market specific.",
"increase-token-accounts": "Increase Token Accounts",
"key-sequence": "Key Sequence",
"language": "Language",
"light": "Light",
"limit-order-filled": "Limit Order Fills",
"lychee": "Lychee",
"mango": "Mango",
"mango-classic": "Mango Classic",
@ -44,11 +47,13 @@
"new-hot-key": "New Hot Key",
"no-hot-keys": "Create your first hot key",
"notification-position": "Notification Position",
"notifications": "Notifications",
"notional": "Notional",
"number-scroll": "Number Scroll",
"olive": "Olive",
"options": "Options",
"oracle": "Oracle",
"orderbook-bandwidth-saving": "Orderbook Bandwidth Saving",
"orderbook-flash": "Orderbook Flash",
"order-side": "Order Side",
"order-size-type": "Order Size Type",
@ -73,9 +78,12 @@
"swap-success": "Swap/Trade Success",
"swap-trade-size-selector": "Swap/Trade Size Selector",
"theme": "Theme",
"token-accounts": "Token Accounts",
"tooltip-hot-key-notional-size": "Set size as a USD value.",
"tooltip-hot-key-percentage-size": "Set size as a percentage of your max leverage.",
"tooltip-hot-key-price": "Set a price as a percentage change from the oracle price.",
"tooltip-increase-token-accounts": "Increase the amount of tokens you can hold in your account. The SOL required can be recovered if you close your account",
"tooltip-orderbook-bandwidth-saving": "Use an off-chain service for Orderbook updates to decrease data usage by ~1000x. Disable this if open orders are not highlighted in the book correctly.",
"top-left": "Top-Left",
"top-right": "Top-Right",
"trade-layout": "Trade Layout",
@ -83,9 +91,5 @@
"transaction-success": "Transaction Success",
"trade-chart": "Trade Chart",
"trading-view": "Trading View",
"trigger-key": "Trigger Key",
"notifications": "Notifications",
"limit-order-filled": "Limit Order Fills",
"orderbook-bandwidth-saving": "Orderbook Bandwidth Saving",
"tooltip-orderbook-bandwidth-saving": "Use an off-chain service for Orderbook updates to decrease data usage by ~1000x. Disable this if open orders are not highlighted in the book correctly."
"trigger-key": "Trigger Key"
}

4
public/locales/zh/settings.json
View File

@ -22,6 +22,7 @@
"dark": "暗",
"display": "显示",
"error-alphanumeric-only": "Alphanumeric characters only",
"error-amount": "{{type}} must be greater than {{greaterThan}} and less than {{lessThan}}",
"error-key-in-use": "Hot key already in use. Choose a unique key",
"error-key-limit-reached": "You've reached the maximum number of hot keys",
"error-must-be-above-zero": "Must be greater than zero",
@ -34,6 +35,7 @@
"high-contrast": "高对比度",
"hot-keys": "Hot Keys",
"hot-keys-desc": "Use hot keys to place orders on the trade page. They execute on the market you're viewing and are not market specific.",
"increase-token-accounts": "Increase Token Accounts",
"key-sequence": "Key Sequence",
"language": "语言",
"light": "光",
@ -76,9 +78,11 @@
"swap-success": "换币/交易成功",
"swap-trade-size-selector": "换币/交易大小选择器",
"theme": "模式",
"token-accounts": "Token Accounts",
"tooltip-hot-key-notional-size": "Set size as a USD value.",
"tooltip-hot-key-percentage-size": "Set size as a percentage of your max leverage.",
"tooltip-hot-key-price": "Set a price as a percentage change from the oracle price.",
"tooltip-increase-token-accounts": "Increase the amount of tokens you can hold in your account. The SOL required can be recovered if you close your account",
"top-left": "左上",
"top-right": "右上",
"trade-chart": "交易图表",

4
public/locales/zh_tw/settings.json
View File

@ -22,6 +22,7 @@
"dark": "暗",
"display": "顯示",
"error-alphanumeric-only": "Alphanumeric characters only",
"error-amount": "{{type}} must be greater than {{greaterThan}} and less than {{lessThan}}",
"error-key-in-use": "Hot key already in use. Choose a unique key",
"error-key-limit-reached": "You've reached the maximum number of hot keys",
"error-must-be-above-zero": "Must be greater than zero",
@ -34,6 +35,7 @@
"high-contrast": "高對比度",
"hot-keys": "Hot Keys",
"hot-keys-desc": "Use hot keys to place orders on the trade page. They execute on the market you're viewing and are not market specific.",
"increase-token-accounts": "Increase Token Accounts",
"key-sequence": "Key Sequence",
"language": "語言",
"light": "光",
@ -76,9 +78,11 @@
"swap-success": "換幣/交易成功",
"swap-trade-size-selector": "換幣/交易大小選擇器",
"theme": "模式",
"token-accounts": "Token Accounts",
"tooltip-hot-key-notional-size": "Set size as a USD value.",
"tooltip-hot-key-percentage-size": "Set size as a percentage of your max leverage.",
"tooltip-hot-key-price": "Set a price as a percentage change from the oracle price.",
"tooltip-increase-token-accounts": "Increase the amount of tokens you can hold in your account. The SOL required can be recovered if you close your account",
"top-left": "左上",
"top-right": "右上",
"trade-chart": "交易圖表",