mirror of
https://github.com/luxfi/explore.git
synced 2026-09-24 00:28:18 +00:00
tom goriunovandGitHub
ebbee2ba57
* Support redirect to a correct view from search * show domains on address page * migrate to new API version to display address domains * another api update * new design for chain widget on home page + tests * chain widget styles for mobile devices * ecosystems page * update types * add ecosystems to navigation * address portfolio: pt.1 * portfolio tokens list * filter portfolio by chain * skip redirect when navigating to search result by clicking on "show all results" link * net worth block design * add filter input to chain select and fix tokens table * calculate address portfolio * adjust card logic * support custom token types in multichain explorer * handle case when new worth is 0 * add text filter to tokens list * fixes * demo envs * portfolio tests * ecosystems test * change signature for getTokenTypes function * fix adding token to the wallet from the list * lazy load all address domains * show contract creator and implementations info * fix tests * add poor reputation tokens toggle * tweaks * dim celo native tokens * disable env validator * fix tests * remove tokens with 0 usd value from top tokens * fixes * preserve selected chain when switching tabs on address page * add hints to stats widgets on home page * update envs for demo * fix portfolio cards and home page * update styles for contract creator and implementations * fix select issues * add chains from cluster to network menu * hide csv export link on empty logs page * update screenshots * rollback select fix * update cut length calculation for portfolio cards * fix chain select * update screenshots * fix tests * more fixes * add sorting to ecosystems table * fix test * fixes * fix loading state in ecosystems page * review fixes * fix tests
94 lines
3.1 KiB
TypeScript
94 lines
3.1 KiB
TypeScript
import { useRouter } from 'next/router';
|
|
import React from 'react';
|
|
|
|
import type { AddressFromToFilter } from 'types/api/address';
|
|
import { AddressFromToFilterValues } from 'types/api/address';
|
|
import type { TokenType } from 'types/api/token';
|
|
|
|
import multichainConfig from 'configs/multichain';
|
|
import getFilterValueFromQuery from 'lib/getFilterValueFromQuery';
|
|
import getFilterValuesFromQuery from 'lib/getFilterValuesFromQuery';
|
|
import getQueryParamString from 'lib/router/getQueryParamString';
|
|
import { getTokenTypes } from 'lib/token/tokenTypes';
|
|
import { getTokenTransfersStub } from 'stubs/token';
|
|
import useQueryWithPages from 'ui/shared/pagination/useQueryWithPages';
|
|
|
|
export type Filters = {
|
|
type: Array<TokenType>;
|
|
filter: AddressFromToFilter | undefined;
|
|
};
|
|
|
|
const getAddressFilterValue = (getFilterValueFromQuery<AddressFromToFilter>).bind(null, AddressFromToFilterValues);
|
|
|
|
const getFilters = (query: Record<string, string | Array<string> | undefined>, chainIds?: Array<string>) => {
|
|
const chainIdParam = getQueryParamString(query.chain_id);
|
|
const filterParam = getQueryParamString(query.filter);
|
|
const typeParam = getQueryParamString(query.type);
|
|
|
|
const currentChainId = chainIdParam && chainIds?.includes(chainIdParam) ? chainIdParam : chainIds?.[0];
|
|
const chainConfig = multichainConfig()?.chains.find(chain => chain.id === currentChainId);
|
|
|
|
return {
|
|
filter: getAddressFilterValue(filterParam),
|
|
type: getFilterValuesFromQuery(
|
|
Object.keys(getTokenTypes(false, chainConfig?.app_config)),
|
|
typeParam,
|
|
) || [],
|
|
};
|
|
};
|
|
|
|
interface Props {
|
|
currentAddress: string;
|
|
enabled?: boolean;
|
|
isMultichain?: boolean;
|
|
chainIds?: Array<string>;
|
|
}
|
|
|
|
export default function useAddressTokenTransfersQuery({ currentAddress, enabled, isMultichain, chainIds }: Props) {
|
|
const router = useRouter();
|
|
|
|
const [ filters, setFilters ] = React.useState<Filters>(getFilters(router.query, chainIds));
|
|
|
|
React.useEffect(() => {
|
|
if (enabled) {
|
|
setFilters(getFilters(router.query, chainIds));
|
|
}
|
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
}, [ enabled ]);
|
|
|
|
const query = useQueryWithPages({
|
|
resourceName: 'general:address_token_transfers',
|
|
pathParams: { hash: currentAddress },
|
|
filters,
|
|
options: {
|
|
enabled,
|
|
placeholderData: getTokenTransfersStub(undefined, {
|
|
block_number: 7793535,
|
|
index: 46,
|
|
items_count: 50,
|
|
}),
|
|
},
|
|
isMultichain,
|
|
chainIds,
|
|
});
|
|
|
|
const onTypeFilterChange = React.useCallback((nextValue: Array<TokenType>) => {
|
|
query.onFilterChange({ ...filters, type: nextValue });
|
|
setFilters((prevState) => ({ ...prevState, type: nextValue }));
|
|
}, [ filters, query ]);
|
|
|
|
const onAddressFilterChange = React.useCallback((nextValue: string) => {
|
|
const filterVal = getAddressFilterValue(nextValue);
|
|
query.onFilterChange({ ...filters, filter: filterVal });
|
|
setFilters((prevState) => ({ ...prevState, filter: filterVal }));
|
|
}, [ filters, query ]);
|
|
|
|
return React.useMemo(() => ({
|
|
query,
|
|
filters,
|
|
setFilters,
|
|
onTypeFilterChange,
|
|
onAddressFilterChange,
|
|
}), [ query, filters, setFilters, onTypeFilterChange, onAddressFilterChange ]);
|
|
}
|