import ButtonGroup from '@components/forms/ButtonGroup' import Checkbox from '@components/forms/Checkbox' import Input from '@components/forms/Input' import Label from '@components/forms/Label' import Button, { IconButton } from '@components/shared/Button' import InlineNotification from '@components/shared/InlineNotification' import Modal from '@components/shared/Modal' import { Table, Td, Th, TrBody, TrHead } from '@components/shared/TableElements' import Tooltip from '@components/shared/Tooltip' import { KeyIcon, TrashIcon } from '@heroicons/react/20/solid' import useLocalStorageState from 'hooks/useLocalStorageState' import { useTranslation } from 'next-i18next' import { useState } from 'react' import { ModalProps } from 'types/modal' import { HOT_KEYS_KEY } from 'utils/constants' export type HotKey = { ioc: boolean keySequence: string margin: boolean orderSide: 'buy' | 'sell' orderSizeType: 'percentage' | 'notional' orderSize: string orderType: 'limit' | 'market' orderPrice: string postOnly: boolean reduceOnly: boolean } const HotKeysSettings = () => { const { t } = useTranslation(['common', 'settings', 'trade']) const [hotKeys, setHotKeys] = useLocalStorageState(HOT_KEYS_KEY, []) const [showHotKeyModal, setShowHotKeyModal] = useState(false) const handleDeleteKey = (key: string) => { const newKeys = hotKeys.filter((hk: HotKey) => hk.keySequence !== key) setHotKeys([...newKeys]) } return ( <>
{t('settings:hot-keys-desc')}
{t('settings:key-sequence')} | {t('trade:order-type')} | {t('trade:side')} | {t('trade:size')} | {t('price')} | {t('settings:options')} | {keySequence} | {t(`trade:${orderType}`)} | {t(orderSide)} | {size} | {price} | {Object.entries(options).map((e) => { return e[1] ? `${e[0] !== 'margin' ? ', ' : ''}${t( `trade:${e[0]}`, )}` : '' })} |
|
---|
{t('settings:no-hot-keys')}