diff --git a/src/components/assetsView/filters/AssetsViewFilterModal.tsx b/src/components/assetsView/filters/AssetsViewFilterModal.tsx index de4246f..22474be 100644 --- a/src/components/assetsView/filters/AssetsViewFilterModal.tsx +++ b/src/components/assetsView/filters/AssetsViewFilterModal.tsx @@ -16,6 +16,7 @@ import { AssetsViewRentStatusFilter } from './AssetsViewRentStatusFilter' import { AssetsViewRmmStatusFilter } from './AssetsViewRmmStatusFilter' import { AssetsViewSort } from './AssetsViewSort' import { AssetsViewSubsidyFilter } from './AssetsViewSubsidyFilter' +import { AssetsViewUserProtocolFilter } from './AssetsViewUserProtocolFilter' import { AssetsViewUserStatusFilter } from './AssetsViewUserStatusFilter' export const AssetsViewFilterModal: FC = ({ @@ -56,6 +57,12 @@ export const AssetsViewFilterModal: FC = ({ setFilterModel({ ...filterModel, ...value }) }} /> + { + setFilterModel({ ...filterModel, ...value }) + }} + /> { diff --git a/src/components/assetsView/filters/AssetsViewUserProtocolFilter.tsx b/src/components/assetsView/filters/AssetsViewUserProtocolFilter.tsx new file mode 100644 index 0000000..c7b883d --- /dev/null +++ b/src/components/assetsView/filters/AssetsViewUserProtocolFilter.tsx @@ -0,0 +1,81 @@ +import { FC } from 'react' +import { useTranslation } from 'react-i18next' + +import { Select } from '@mantine/core' + +import { UserRealtoken } from 'src/store/features/wallets/walletsSelector' + +import { useInputStyles } from '../../inputs/useInputStyles' +import { AssetUserProtocolType } from '../types' + +interface AssetsViewUserProtocolFilterModel { + userProtocol: AssetUserProtocolType +} + +interface AssetsViewUserProtocolFilterProps { + filter: AssetsViewUserProtocolFilterModel + onChange: (value: AssetsViewUserProtocolFilterModel) => void +} +export const AssetsViewUserProtocolFilter: FC< + AssetsViewUserProtocolFilterProps +> = ({ filter, onChange }) => { + const { t } = useTranslation('common', { keyPrefix: 'assetUserProtocol' }) + const { classes: inputClasses } = useInputStyles() + + const viewOptions = [ + { + value: AssetUserProtocolType.ALL, + label: t('options.all'), + }, + { + value: AssetUserProtocolType.ETHEREUM, + label: t('options.ethereum'), + }, + { + value: AssetUserProtocolType.GNOSIS, + label: t('options.gnosis'), + }, + { + value: AssetUserProtocolType.RMM, + label: t('options.rmm'), + }, + { + value: AssetUserProtocolType.LEVINSWAP, + label: t('options.levinSwap'), + }, + ] + + return ( +