From 75f4077d207515be085243607439b6297935e434 Mon Sep 17 00:00:00 2001 From: Wolmin Date: Mon, 7 Oct 2024 00:36:57 +0200 Subject: [PATCH] Remove build errors --- ui/marketplace/ContractListButton.tsx | 66 -------- ui/marketplace/MarketplaceListWithScores.tsx | 86 ---------- .../MarketplaceListWithScores/AppLink.tsx | 73 -------- .../MarketplaceListWithScores/ListItem.tsx | 126 -------------- .../MoreInfoButton.tsx | 29 ---- .../MarketplaceListWithScores/Table.tsx | 52 ------ .../MarketplaceListWithScores/TableItem.tsx | 126 -------------- ui/pages/Validators.pw.tsx | 22 --- ui/pages/Validators.tsx | 158 ------------------ ui/shared/statusTag/ValidatorStatus.tsx | 23 --- ui/snippets/networkMenu/NetworkLogo.tsx | 9 +- ui/validators/ValidatorsCounters.tsx | 41 ----- ui/validators/ValidatorsFilter.tsx | 46 ----- ui/validators/ValidatorsList.tsx | 22 --- ui/validators/ValidatorsListItem.tsx | 44 ----- ui/validators/ValidatorsTable.tsx | 70 -------- ui/validators/ValidatorsTableItem.tsx | 36 ---- ui/validators/utils.ts | 16 -- 18 files changed, 3 insertions(+), 1042 deletions(-) delete mode 100644 ui/marketplace/ContractListButton.tsx delete mode 100644 ui/marketplace/MarketplaceListWithScores.tsx delete mode 100644 ui/marketplace/MarketplaceListWithScores/AppLink.tsx delete mode 100644 ui/marketplace/MarketplaceListWithScores/ListItem.tsx delete mode 100644 ui/marketplace/MarketplaceListWithScores/MoreInfoButton.tsx delete mode 100644 ui/marketplace/MarketplaceListWithScores/Table.tsx delete mode 100644 ui/marketplace/MarketplaceListWithScores/TableItem.tsx delete mode 100644 ui/pages/Validators.pw.tsx delete mode 100644 ui/pages/Validators.tsx delete mode 100644 ui/shared/statusTag/ValidatorStatus.tsx delete mode 100644 ui/validators/ValidatorsCounters.tsx delete mode 100644 ui/validators/ValidatorsFilter.tsx delete mode 100644 ui/validators/ValidatorsList.tsx delete mode 100644 ui/validators/ValidatorsListItem.tsx delete mode 100644 ui/validators/ValidatorsTable.tsx delete mode 100644 ui/validators/ValidatorsTableItem.tsx delete mode 100644 ui/validators/utils.ts diff --git a/ui/marketplace/ContractListButton.tsx b/ui/marketplace/ContractListButton.tsx deleted file mode 100644 index 6a8bfce05e..0000000000 --- a/ui/marketplace/ContractListButton.tsx +++ /dev/null @@ -1,66 +0,0 @@ -import { Link, Tooltip, Skeleton } from '@chakra-ui/react'; -import React from 'react'; -import type { MouseEvent } from 'react'; - -import config from 'configs/app'; -import IconSvg from 'ui/shared/IconSvg'; - -export enum ContractListButtonVariants { - ALL_CONTRACTS = 'all contracts', - VERIFIED_CONTRACTS = 'verified contracts', -} - -const values = { - [ContractListButtonVariants.ALL_CONTRACTS]: { - icon: 'contracts' as const, - iconColor: 'gray.500', - tooltip: `Total number of contracts deployed by the protocol on ${ config.chain.name }`, - }, - [ContractListButtonVariants.VERIFIED_CONTRACTS]: { - icon: 'contracts_verified' as const, - iconColor: 'green.500', - tooltip: `Number of verified contracts on ${ config.chain.name }`, - }, -}; - -interface Props { - children: string | number; - onClick: (event: MouseEvent) => void; - variant: ContractListButtonVariants; - isLoading?: boolean; -} - -const ContractListButton = ({ children, onClick, variant, isLoading }: Props) => { - const { icon, iconColor, tooltip } = values[variant]; - return ( - - - - { icon && } - { children } - - - - ); -}; - -export default ContractListButton; diff --git a/ui/marketplace/MarketplaceListWithScores.tsx b/ui/marketplace/MarketplaceListWithScores.tsx deleted file mode 100644 index 6d86eb63ba..0000000000 --- a/ui/marketplace/MarketplaceListWithScores.tsx +++ /dev/null @@ -1,86 +0,0 @@ -import { Hide, Show } from '@chakra-ui/react'; -import React from 'react'; -import type { MouseEvent } from 'react'; - -import type { MarketplaceAppWithSecurityReport, ContractListTypes } from 'types/client/marketplace'; - -import DataListDisplay from 'ui/shared/DataListDisplay'; - -import EmptySearchResult from './EmptySearchResult'; -import ListItem from './MarketplaceListWithScores/ListItem'; -import Table from './MarketplaceListWithScores/Table'; - -interface Props { - apps: Array; - showAppInfo: (id: string) => void; - favoriteApps: Array; - onFavoriteClick: (id: string, isFavorite: boolean, source: 'Security view') => void; - isLoading: boolean; - selectedCategoryId?: string; - onAppClick: (event: MouseEvent, id: string) => void; - showContractList: (id: string, type: ContractListTypes) => void; -} - -const MarketplaceListWithScores = ({ - apps, - showAppInfo, - favoriteApps, - onFavoriteClick, - isLoading, - selectedCategoryId, - onAppClick, - showContractList, -}: Props) => { - - const displayedApps = React.useMemo(() => apps.sort((a, b) => { - if (!a.securityReport) { - return 1; - } else if (!b.securityReport) { - return -1; - } - return b.securityReport.overallInfo.securityScore - a.securityReport.overallInfo.securityScore; - }), [ apps ]); - - const content = apps.length > 0 ? ( - <> - - { displayedApps.map((app, index) => ( - - )) } - - - - - - ) : null; - - return apps.length > 0 ? ( - - ) : ( - - ); -}; - -export default MarketplaceListWithScores; diff --git a/ui/marketplace/MarketplaceListWithScores/AppLink.tsx b/ui/marketplace/MarketplaceListWithScores/AppLink.tsx deleted file mode 100644 index bf1b1d6af7..0000000000 --- a/ui/marketplace/MarketplaceListWithScores/AppLink.tsx +++ /dev/null @@ -1,73 +0,0 @@ -import { Flex, Skeleton, LinkBox, Image, useColorModeValue } from '@chakra-ui/react'; -import React from 'react'; -import type { MouseEvent } from 'react'; - -import type { MarketplaceAppPreview } from 'types/client/marketplace'; - -import MarketplaceAppCardLink from '../MarketplaceAppCardLink'; -import MarketplaceAppIntegrationIcon from '../MarketplaceAppIntegrationIcon'; - -interface Props { - app: MarketplaceAppPreview; - isLoading: boolean | undefined; - onAppClick: (event: MouseEvent, id: string) => void; - isLarge?: boolean; -} - -const AppLink = ({ app, isLoading, onAppClick, isLarge = false }: Props) => { - const { id, url, external, title, logo, logoDarkMode, internalWallet, categories } = app; - - const logoUrl = useColorModeValue(logo, logoDarkMode || logo); - - const categoriesLabel = categories.join(', '); - - return ( - - - - - - - - - - - - { categoriesLabel } - - - - ); -}; - -export default AppLink; diff --git a/ui/marketplace/MarketplaceListWithScores/ListItem.tsx b/ui/marketplace/MarketplaceListWithScores/ListItem.tsx deleted file mode 100644 index 4b5a8988f4..0000000000 --- a/ui/marketplace/MarketplaceListWithScores/ListItem.tsx +++ /dev/null @@ -1,126 +0,0 @@ -import { Flex, IconButton, Text } from '@chakra-ui/react'; -import React from 'react'; -import type { MouseEvent } from 'react'; - -import type { MarketplaceAppWithSecurityReport } from 'types/client/marketplace'; -import { ContractListTypes } from 'types/client/marketplace'; - -import * as mixpanel from 'lib/mixpanel/index'; -import IconSvg from 'ui/shared/IconSvg'; -import ListItemMobile from 'ui/shared/ListItemMobile/ListItemMobile'; - -import AppSecurityReport from '../AppSecurityReport'; -import ContractListButton, { ContractListButtonVariants } from '../ContractListButton'; -import AppLink from './AppLink'; -import MoreInfoButton from './MoreInfoButton'; - -type Props = { - app: MarketplaceAppWithSecurityReport; - onInfoClick: (id: string) => void; - isFavorite: boolean; - onFavoriteClick: (id: string, isFavorite: boolean, source: 'Security view') => void; - isLoading: boolean; - onAppClick: (event: MouseEvent, id: string) => void; - showContractList: (id: string, type: ContractListTypes) => void; -} - -const ListItem = ({ app, onInfoClick, isFavorite, onFavoriteClick, isLoading, onAppClick, showContractList }: Props) => { - const { id, securityReport } = app; - - const handleInfoClick = React.useCallback((event: MouseEvent) => { - event.preventDefault(); - mixpanel.logEvent(mixpanel.EventTypes.PAGE_WIDGET, { Type: 'More button', Info: id, Source: 'Security view' }); - onInfoClick(id); - }, [ onInfoClick, id ]); - - const handleFavoriteClick = React.useCallback(() => { - onFavoriteClick(id, isFavorite, 'Security view'); - }, [ onFavoriteClick, id, isFavorite ]); - - const showAllContracts = React.useCallback(() => { - mixpanel.logEvent(mixpanel.EventTypes.PAGE_WIDGET, { Type: 'Total contracts', Info: id, Source: 'Security view' }); - showContractList(id, ContractListTypes.ALL); - }, [ showContractList, id ]); - - const showVerifiedContracts = React.useCallback(() => { - mixpanel.logEvent(mixpanel.EventTypes.PAGE_WIDGET, { Type: 'Verified contracts', Info: id, Source: 'Security view' }); - showContractList(id, ContractListTypes.VERIFIED); - }, [ showContractList, id ]); - - const showAnalyzedContracts = React.useCallback(() => { - showContractList(id, ContractListTypes.ANALYZED); - }, [ showContractList, id ]); - - return ( - - - - - { !isLoading && ( - : - - } - /> - ) } - - - - { (securityReport || isLoading) ? ( - <> - - - { securityReport?.overallInfo.totalContractsNumber ?? 0 } - - - { securityReport?.overallInfo.verifiedNumber ?? 0 } - - - ) : ( - Data will be available soon - ) } - - - - - - ); -}; - -export default ListItem; diff --git a/ui/marketplace/MarketplaceListWithScores/MoreInfoButton.tsx b/ui/marketplace/MarketplaceListWithScores/MoreInfoButton.tsx deleted file mode 100644 index d96bddb66c..0000000000 --- a/ui/marketplace/MarketplaceListWithScores/MoreInfoButton.tsx +++ /dev/null @@ -1,29 +0,0 @@ -import { Link, Skeleton } from '@chakra-ui/react'; -import React from 'react'; -import type { MouseEvent } from 'react'; - -interface Props { - onClick: (event: MouseEvent) => void; - isLoading?: boolean; -} - -const MoreInfoButton = ({ onClick, isLoading }: Props) => ( - - - More info - - -); - -export default MoreInfoButton; diff --git a/ui/marketplace/MarketplaceListWithScores/Table.tsx b/ui/marketplace/MarketplaceListWithScores/Table.tsx deleted file mode 100644 index 1e8cbddf56..0000000000 --- a/ui/marketplace/MarketplaceListWithScores/Table.tsx +++ /dev/null @@ -1,52 +0,0 @@ -import { Table as ChakraTable, Tbody, Th, Tr } from '@chakra-ui/react'; -import React from 'react'; -import type { MouseEvent } from 'react'; - -import type { MarketplaceAppWithSecurityReport, ContractListTypes } from 'types/client/marketplace'; - -import { default as Thead } from 'ui/shared/TheadSticky'; - -import TableItem from './TableItem'; - -type Props = { - apps: Array; - isLoading?: boolean; - favoriteApps: Array; - onFavoriteClick: (id: string, isFavorite: boolean, source: 'Security view') => void; - onAppClick: (event: MouseEvent, id: string) => void; - onInfoClick: (id: string) => void; - showContractList: (id: string, type: ContractListTypes) => void; -} - -const Table = ({ apps, isLoading, favoriteApps, onFavoriteClick, onAppClick, onInfoClick, showContractList }: Props) => { - return ( - - - - - - - - - - - - - { apps.map((app, index) => ( - - )) } - - - ); -}; - -export default Table; diff --git a/ui/marketplace/MarketplaceListWithScores/TableItem.tsx b/ui/marketplace/MarketplaceListWithScores/TableItem.tsx deleted file mode 100644 index c77b5c5c78..0000000000 --- a/ui/marketplace/MarketplaceListWithScores/TableItem.tsx +++ /dev/null @@ -1,126 +0,0 @@ -import { Td, Tr, IconButton, Skeleton, Text } from '@chakra-ui/react'; -import React from 'react'; -import type { MouseEvent } from 'react'; - -import type { MarketplaceAppWithSecurityReport } from 'types/client/marketplace'; -import { ContractListTypes } from 'types/client/marketplace'; - -import * as mixpanel from 'lib/mixpanel/index'; -import IconSvg from 'ui/shared/IconSvg'; - -import AppSecurityReport from '../AppSecurityReport'; -import ContractListButton, { ContractListButtonVariants } from '../ContractListButton'; -import AppLink from './AppLink'; -import MoreInfoButton from './MoreInfoButton'; - -type Props = { - app: MarketplaceAppWithSecurityReport; - isLoading?: boolean; - isFavorite: boolean; - onFavoriteClick: (id: string, isFavorite: boolean, source: 'Security view') => void; - onAppClick: (event: MouseEvent, id: string) => void; - onInfoClick: (id: string) => void; - showContractList: (id: string, type: ContractListTypes) => void; -} - -const TableItem = ({ - app, - isLoading, - isFavorite, - onFavoriteClick, - onAppClick, - onInfoClick, - showContractList, -}: Props) => { - - const { id, securityReport } = app; - - const handleInfoClick = React.useCallback((event: MouseEvent) => { - event.preventDefault(); - mixpanel.logEvent(mixpanel.EventTypes.PAGE_WIDGET, { Type: 'More button', Info: id, Source: 'Security view' }); - onInfoClick(id); - }, [ onInfoClick, id ]); - - const handleFavoriteClick = React.useCallback(() => { - onFavoriteClick(id, isFavorite, 'Security view'); - }, [ onFavoriteClick, id, isFavorite ]); - - const showAllContracts = React.useCallback(() => { - mixpanel.logEvent(mixpanel.EventTypes.PAGE_WIDGET, { Type: 'Total contracts', Info: id, Source: 'Security view' }); - showContractList(id, ContractListTypes.ALL); - }, [ showContractList, id ]); - - const showVerifiedContracts = React.useCallback(() => { - mixpanel.logEvent(mixpanel.EventTypes.PAGE_WIDGET, { Type: 'Verified contracts', Info: id, Source: 'Security view' }); - showContractList(id, ContractListTypes.VERIFIED); - }, [ showContractList, id ]); - - const showAnalyzedContracts = React.useCallback(() => { - showContractList(id, ContractListTypes.ANALYZED); - }, [ showContractList, id ]); - - return ( - - - - { (securityReport || isLoading) ? ( - <> - - - - - ) : ( - - ) } - - - ); -}; - -export default TableItem; diff --git a/ui/pages/Validators.pw.tsx b/ui/pages/Validators.pw.tsx deleted file mode 100644 index 4ea86e6fe4..0000000000 --- a/ui/pages/Validators.pw.tsx +++ /dev/null @@ -1,22 +0,0 @@ -import type { BrowserContext } from '@playwright/test'; -import React from 'react'; - -import * as validatorsMock from 'mocks/validators/index'; -import contextWithEnvs from 'playwright/fixtures/contextWithEnvs'; -import { test as base, expect } from 'playwright/lib'; -import * as configs from 'playwright/utils/configs'; - -import Validators from './Validators'; - -const test = base.extend<{ context: BrowserContext }>({ - context: contextWithEnvs(configs.featureEnvs.validators), -}); - -test('base view +@mobile', async({ render, mockApiResponse }) => { - await mockApiResponse('validators', validatorsMock.validatorsResponse, { pathParams: { chainType: 'stability' } }); - await mockApiResponse('validators_counters', validatorsMock.validatorsCountersResponse, { pathParams: { chainType: 'stability' } }); - - const component = await render(); - - await expect(component).toHaveScreenshot(); -}); diff --git a/ui/pages/Validators.tsx b/ui/pages/Validators.tsx deleted file mode 100644 index 2756b59083..0000000000 --- a/ui/pages/Validators.tsx +++ /dev/null @@ -1,158 +0,0 @@ -import { Box, Hide, HStack, Show } from '@chakra-ui/react'; -import { useRouter } from 'next/router'; -import React from 'react'; - -import { getFeaturePayload } from 'configs/app/features/types'; -import type { ValidatorsFilters, ValidatorsSorting, ValidatorsSortingField, ValidatorsSortingValue } from 'types/api/validators'; - -import config from 'configs/app'; -// import useDebounce from 'lib/hooks/useDebounce'; -import useIsMobile from 'lib/hooks/useIsMobile'; -import { apos } from 'lib/html-entities'; -import getQueryParamString from 'lib/router/getQueryParamString'; -import { generateListStub } from 'stubs/utils'; -import { VALIDATOR } from 'stubs/validators'; -import ActionBar from 'ui/shared/ActionBar'; -import DataListDisplay from 'ui/shared/DataListDisplay'; -// import FilterInput from 'ui/shared/filters/FilterInput'; -import PageTitle from 'ui/shared/Page/PageTitle'; -import Pagination from 'ui/shared/pagination/Pagination'; -import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages'; -import getSortParamsFromValue from 'ui/shared/sort/getSortParamsFromValue'; -import getSortValueFromQuery from 'ui/shared/sort/getSortValueFromQuery'; -import Sort from 'ui/shared/sort/Sort'; -import { SORT_OPTIONS } from 'ui/validators/utils'; -import ValidatorsCounters from 'ui/validators/ValidatorsCounters'; -import ValidatorsFilter from 'ui/validators/ValidatorsFilter'; -import ValidatorsList from 'ui/validators/ValidatorsList'; -import ValidatorsTable from 'ui/validators/ValidatorsTable'; - -const Validators = () => { - const router = useRouter(); - // const [ searchTerm, setSearchTerm ] = React.useState(getQueryParamString(router.query.address_hash) || undefined); - const [ statusFilter, setStatusFilter ] = React.useState(getQueryParamString(router.query.state_filter) as ValidatorsFilters['state_filter'] || undefined); - const [ sort, setSort ] = - React.useState(getSortValueFromQuery(router.query, SORT_OPTIONS)); - - // const debouncedSearchTerm = useDebounce(searchTerm || '', 300); - - const isMobile = useIsMobile(); - - const { isError, isPlaceholderData, data, pagination, onFilterChange, onSortingChange } = useQueryWithPages({ - resourceName: 'validators', - pathParams: { chainType: getFeaturePayload(config.features.validators)?.chainType }, - filters: { - // address_hash: debouncedSearchTerm, - state_filter: statusFilter, - }, - sorting: getSortParamsFromValue(sort), - options: { - enabled: config.features.validators.isEnabled, - placeholderData: generateListStub<'validators'>( - VALIDATOR, - 50, - { next_page_params: null }, - ), - }, - }); - - // const handleSearchTermChange = React.useCallback((value: string) => { - // onFilterChange({ - // address_hash: value, - // state_filter: statusFilter - // }); - // setSearchTerm(value); - // }, [ statusFilter, onFilterChange ]); - - const handleStateFilterChange = React.useCallback((value: string | Array) => { - if (Array.isArray(value)) { - return; - } - - const state = value === 'all' ? undefined : value as ValidatorsFilters['state_filter']; - - onFilterChange({ - // address_hash: debouncedSearchTerm, - state_filter: state, - }); - setStatusFilter(state); - }, [ onFilterChange ]); - - const handleSortChange = React.useCallback((value?: ValidatorsSortingValue) => { - setSort(value); - onSortingChange(getSortParamsFromValue(value)); - }, [ onSortingChange ]); - - const filterMenu = ; - - // const filterInput = ( - // - // ); - - const sortButton = ( - - ); - - const actionBar = ( - <> - - { filterMenu } - { sortButton } - { /* { filterInput } */ } - - { (!isMobile || pagination.isVisible) && ( - - - { filterMenu } - { /* { filterInput } */ } - - - - ) } - - ); - - const content = data?.items ? ( - <> - - - - - - - - ) : null; - - return ( - - - - - - ); -}; - -export default Validators; diff --git a/ui/shared/statusTag/ValidatorStatus.tsx b/ui/shared/statusTag/ValidatorStatus.tsx deleted file mode 100644 index 4386b55af5..0000000000 --- a/ui/shared/statusTag/ValidatorStatus.tsx +++ /dev/null @@ -1,23 +0,0 @@ -import React from 'react'; - -import type { Validator } from 'types/api/validators'; - -import StatusTag from './StatusTag'; - -interface Props { - state: Validator['state']; - isLoading?: boolean; -} - -const ValidatorStatus = ({ state, isLoading }: Props) => { - switch (state) { - case 'active': - return ; - case 'probation': - return ; - case 'inactive': - return ; - } -}; - -export default React.memo(ValidatorStatus); diff --git a/ui/snippets/networkMenu/NetworkLogo.tsx b/ui/snippets/networkMenu/NetworkLogo.tsx index 60bc40ce77..7c8a935efa 100644 --- a/ui/snippets/networkMenu/NetworkLogo.tsx +++ b/ui/snippets/networkMenu/NetworkLogo.tsx @@ -12,7 +12,7 @@ interface Props { className?: string; } -const LogoFallback = ({ isCollapsed, isSmall, imageProps }: { isCollapsed?: boolean; isSmall?: boolean; imageProps?: StyleProps }) => { +const LogoFallback = ({ isCollapsed, isSmall }: { isCollapsed?: boolean; isSmall?: boolean }) => { const field = isSmall ? 'icon' : 'logo'; const logoColor = useColorModeValue('blue.600', 'white'); @@ -37,7 +37,6 @@ const LogoFallback = ({ isCollapsed, isSmall, imageProps }: { isCollapsed?: bool height="100%" color={ logoColor } display={ display } - { ...imageProps } /> ); }; @@ -69,10 +68,9 @@ const NetworkLogo = ({ isCollapsed, onClick, className }: Props) => { h="100%" src={ logoSrc } alt={ `${ config.chain.name } network logo` } - fallback={ } + fallback={ } display={{ base: 'block', lg: isCollapsed === false ? 'block' : 'none', xl: isCollapsed ? 'none' : 'block' }} style={ logoStyle } - { ...imageProps } /> { /* small logo */ } { h="100%" src={ iconSrc } alt={ `${ config.chain.name } network logo` } - fallback={ } + fallback={ } display={{ base: 'none', lg: isCollapsed === false ? 'none' : 'block', xl: isCollapsed ? 'block' : 'none' }} style={ iconStyle } - { ...imageProps } /> ); diff --git a/ui/validators/ValidatorsCounters.tsx b/ui/validators/ValidatorsCounters.tsx deleted file mode 100644 index 2e056ff1aa..0000000000 --- a/ui/validators/ValidatorsCounters.tsx +++ /dev/null @@ -1,41 +0,0 @@ -import { Box } from '@chakra-ui/react'; -import React from 'react'; - -import { getFeaturePayload } from 'configs/app/features/types'; - -import config from 'configs/app'; -import useApiQuery from 'lib/api/useApiQuery'; -import { VALIDATORS_COUNTERS } from 'stubs/validators'; -import StatsWidget from 'ui/shared/stats/StatsWidget'; - -const ValidatorsCounters = () => { - const countersQuery = useApiQuery('validators_counters', { - pathParams: { chainType: getFeaturePayload(config.features.validators)?.chainType }, - queryOptions: { - enabled: config.features.validators.isEnabled, - placeholderData: VALIDATORS_COUNTERS, - }, - }); - - if (!countersQuery.data) { - return null; - } - - return ( - - - - - ); -}; - -export default React.memo(ValidatorsCounters); diff --git a/ui/validators/ValidatorsFilter.tsx b/ui/validators/ValidatorsFilter.tsx deleted file mode 100644 index 08ca7dce94..0000000000 --- a/ui/validators/ValidatorsFilter.tsx +++ /dev/null @@ -1,46 +0,0 @@ -import { - Menu, - MenuButton, - MenuList, - MenuOptionGroup, - MenuItemOption, - useDisclosure, -} from '@chakra-ui/react'; -import React from 'react'; - -import type { ValidatorsFilters } from 'types/api/validators'; - -import FilterButton from 'ui/shared/filters/FilterButton'; - -interface Props { - isActive: boolean; - defaultValue: ValidatorsFilters['state_filter'] | undefined; - onChange: (nextValue: string | Array) => void; -} - -const ValidatorsFilter = ({ onChange, defaultValue, isActive }: Props) => { - const { isOpen, onToggle } = useDisclosure(); - - return ( - - - - - - - All - Active - Probation - Inactive - - - - ); -}; - -export default React.memo(ValidatorsFilter); diff --git a/ui/validators/ValidatorsList.tsx b/ui/validators/ValidatorsList.tsx deleted file mode 100644 index abb7305ca0..0000000000 --- a/ui/validators/ValidatorsList.tsx +++ /dev/null @@ -1,22 +0,0 @@ -import { Box } from '@chakra-ui/react'; -import React from 'react'; - -import type { Validator } from 'types/api/validators'; - -import ValidatorsListItem from './ValidatorsListItem'; - -const ValidatorsList = ({ data, isLoading }: { data: Array; isLoading: boolean }) => { - return ( - - { data.map((item, index) => ( - - )) } - - ); -}; - -export default React.memo(ValidatorsList); diff --git a/ui/validators/ValidatorsListItem.tsx b/ui/validators/ValidatorsListItem.tsx deleted file mode 100644 index 35c97654d6..0000000000 --- a/ui/validators/ValidatorsListItem.tsx +++ /dev/null @@ -1,44 +0,0 @@ -import { Skeleton } from '@chakra-ui/react'; -import React from 'react'; - -import type { Validator } from 'types/api/validators'; - -import AddressEntity from 'ui/shared/entities/address/AddressEntity'; -import ListItemMobileGrid from 'ui/shared/ListItemMobile/ListItemMobileGrid'; -import ValidatorStatus from 'ui/shared/statusTag/ValidatorStatus'; - -interface Props { - data: Validator; - isLoading?: boolean; -} - -const ValidatorsListItem = ({ data, isLoading }: Props) => { - - return ( - - - Address - - - - - Status - - - - - Blocks - - - { data.blocks_validated_count.toLocaleString() } - - - - ); -}; - -export default React.memo(ValidatorsListItem); diff --git a/ui/validators/ValidatorsTable.tsx b/ui/validators/ValidatorsTable.tsx deleted file mode 100644 index 2c36cf1987..0000000000 --- a/ui/validators/ValidatorsTable.tsx +++ /dev/null @@ -1,70 +0,0 @@ -import { Table, Tbody, Tr, Th, Link } from '@chakra-ui/react'; -import React from 'react'; - -import type { Validator, ValidatorsSorting, ValidatorsSortingField, ValidatorsSortingValue } from 'types/api/validators'; - -import IconSvg from 'ui/shared/IconSvg'; -import getNextSortValue from 'ui/shared/sort/getNextSortValue'; -import { default as Thead } from 'ui/shared/TheadSticky'; - -import { SORT_SEQUENCE } from './utils'; -import ValidatorsTableItem from './ValidatorsTableItem'; - -interface Props { - data: Array; - sort: ValidatorsSortingValue | undefined; - setSorting: (val: ValidatorsSortingValue | undefined) => void; - isLoading?: boolean; -} - -const ValidatorsTable = ({ data, sort, setSorting, isLoading }: Props) => { - const sortIconTransform = sort?.includes('asc' as ValidatorsSorting['order']) ? 'rotate(-90deg)' : 'rotate(90deg)'; - - const onSortToggle = React.useCallback((field: ValidatorsSortingField) => () => { - const value = getNextSortValue(SORT_SEQUENCE, field)(sort); - setSorting(value); - }, [ sort, setSorting ]); - - return ( -
AppContracts scoreTotalVerified
- - : - - } - /> - - - - - - - - { securityReport?.overallInfo.totalContractsNumber ?? 0 } - - - - { securityReport?.overallInfo.verifiedNumber ?? 0 } - - - Data will be available soon - - -
- - - - - - - - - { data.map((item, index) => ( - - )) } - -
Validator’s address - - { sort?.includes('state') && } - Status - - - - { sort?.includes('blocks_validated') && } - Blocks - -
- ); -}; - -export default React.memo(ValidatorsTable); diff --git a/ui/validators/ValidatorsTableItem.tsx b/ui/validators/ValidatorsTableItem.tsx deleted file mode 100644 index e4c600357c..0000000000 --- a/ui/validators/ValidatorsTableItem.tsx +++ /dev/null @@ -1,36 +0,0 @@ -import { Tr, Td, Skeleton } from '@chakra-ui/react'; -import React from 'react'; - -import type { Validator } from 'types/api/validators'; - -import AddressEntity from 'ui/shared/entities/address/AddressEntity'; -import ValidatorStatus from 'ui/shared/statusTag/ValidatorStatus'; - -interface Props { - data: Validator; - isLoading?: boolean; -} - -const ValidatorsTableItem = ({ data, isLoading }: Props) => { - return ( - - - - - - - - - - { data.blocks_validated_count.toLocaleString() } - - - - ); -}; - -export default React.memo(ValidatorsTableItem); diff --git a/ui/validators/utils.ts b/ui/validators/utils.ts deleted file mode 100644 index d35b6dce11..0000000000 --- a/ui/validators/utils.ts +++ /dev/null @@ -1,16 +0,0 @@ -import type { ValidatorsSortingValue, ValidatorsSortingField } from 'types/api/validators'; - -import type { Option } from 'ui/shared/sort/Sort'; - -export const SORT_OPTIONS: Array> = [ - { title: 'Default', id: undefined }, - { title: 'Status descending', id: 'state-desc' }, - { title: 'Status ascending', id: 'state-asc' }, - { title: 'Blocks validated descending', id: 'blocks_validated-desc' }, - { title: 'Blocks validated ascending', id: 'blocks_validated-asc' }, -]; - -export const SORT_SEQUENCE: Record> = { - state: [ 'state-desc', 'state-asc', undefined ], - blocks_validated: [ 'blocks_validated-desc', 'blocks_validated-asc', undefined ], -};