Commit beec5c82 authored by tom goriunov's avatar tom goriunov Committed by GitHub

Merge pull request #121 from blockscout/priv-tags-url

fix private tags urls
parents cf42a4da 3ab997cf
......@@ -27,7 +27,7 @@ export default function useNavItems() {
const accountNavItems = [
{ text: 'Watchlist', pathname: basePath + '/account/watchlist', icon: watchlistIcon },
{ text: 'Private tags', pathname: basePath + '/account/private_tags', icon: privateTagIcon },
{ text: 'Private tags', pathname: basePath + '/account/tag_address', icon: privateTagIcon },
{ text: 'Public tags', pathname: basePath + '/account/public_tags_request', icon: publicTagIcon },
{ text: 'API keys', pathname: basePath + '/account/api_key', icon: apiKeysIcon },
{ text: 'Custom ABI', pathname: basePath + '/account/custom_abi', icon: abiIcon },
......
import type { NextPage } from 'next';
import Head from 'next/head';
import React, { useCallback, useState } from 'react';
import PrivateTags from 'ui/pages/PrivateTags';
const TABS = [ 'address', 'transaction' ];
const PrivateTagsPage: NextPage = () => {
const [ , setActiveTab ] = useState(TABS[0]);
const onChangeTab = useCallback((index: number) => {
setActiveTab(TABS[index]);
}, [ setActiveTab ]);
return (
<>
<Head><title>Private tags</title></Head>
<PrivateTags onChangeTab={ onChangeTab }/>
</>
);
};
export default PrivateTagsPage;
import type { NextPage } from 'next';
import Head from 'next/head';
import React from 'react';
import PrivateTags from 'ui/pages/PrivateTags';
const AddressTagsPage: NextPage = () => {
return (
<>
<Head><title>Public tags</title></Head>
<PrivateTags tab="address"/>
</>
);
};
export default AddressTagsPage;
import type { NextPage } from 'next';
import Head from 'next/head';
import React from 'react';
import PrivateTags from 'ui/pages/PrivateTags';
const TransactionTagsPage: NextPage = () => {
return (
<>
<Head><title>Public tags</title></Head>
<PrivateTags tab="transaction"/>
</>
);
};
export default TransactionTagsPage;
......@@ -6,27 +6,38 @@ import {
TabPanel,
TabPanels,
} from '@chakra-ui/react';
import React, { useCallback } from 'react';
import React, { useCallback, useState } from 'react';
import useBasePath from 'lib/hooks/useBasePath';
import PrivateAddressTags from 'ui/privateTags/PrivateAddressTags';
import PrivateTransactionTags from 'ui/privateTags/PrivateTransactionTags';
import AccountPageHeader from 'ui/shared/AccountPageHeader';
import Page from 'ui/shared/Page/Page';
const TABS = [ 'address', 'transaction' ] as const;
type TabName = typeof TABS[number];
type Props = {
onChangeTab: (index: number) => void;
tab: TabName;
}
const PrivateTags = ({ onChangeTab: onChangeTabProps }: Props) => {
const onTabChange = useCallback((index: number) => {
onChangeTabProps(index);
}, [ onChangeTabProps ]);
const PrivateTags = ({ tab }: Props) => {
const [ , setActiveTab ] = useState<TabName>(tab);
const basePath = useBasePath();
const onChangeTab = useCallback((index: number) => {
setActiveTab(TABS[index]);
const newUrl = basePath + '/account/' + (TABS[index] === 'address' ? 'tag_address' : 'tag_transaction');
history.replaceState(history.state, '', newUrl);
}, [ setActiveTab, basePath ]);
return (
<Page>
<Box h="100%">
<AccountPageHeader text="Private tags"/>
<Tabs variant="soft-rounded" colorScheme="blue" isLazy onChange={ onTabChange }>
<Tabs variant="soft-rounded" colorScheme="blue" isLazy onChange={ onChangeTab } defaultIndex={ TABS.indexOf(tab) }>
<TabList marginBottom={ 8 }>
<Tab>Address</Tab>
<Tab>Transaction</Tab>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment