import { XMarkIcon } from '@heroicons/react/20/solid' import { useTranslation } from 'next-i18next' import { useEffect, useState } from 'react' import mangoStore from '@store/mangoStore' import ButtonGroup from '../forms/ButtonGroup' import Input from '../forms/Input' import Button, { IconButton, LinkButton } from '../shared/Button' const slippagePresets = ['0.1', '0.5', '1', '2'] const SlippageSettings = ({ onClose }: { onClose: () => void }) => { const { t } = useTranslation('common') const slippage = mangoStore((s) => s.swap.slippage) const set = mangoStore((s) => s.set) const [showCustomSlippageForm, setShowCustomSlippageForm] = useState(false) const [inputValue, setInputValue] = useState(slippage.toString()) const handleSetSlippage = (slippage: string) => { set((s) => { s.swap.slippage = parseFloat(slippage) }) } useEffect(() => { if (!slippagePresets.includes(slippage.toString())) { setShowCustomSlippageForm(true) } }, []) return ( <>
{`${t('max')} ${t('swap:slippage')}`}