diff --git a/.env.template b/.env.template index b8ca54f8b3..761f5a365e 100644 --- a/.env.template +++ b/.env.template @@ -6,6 +6,10 @@ NEXT_PUBLIC_APP_HOST=__PLACEHOLDER_FOR_NEXT_PUBLIC_APP_HOST__ NEXT_PUBLIC_APP_PORT=__PLACEHOLDER_FOR_NEXT_PUBLIC_APP_PORT__ NEXT_PUBLIC_AUTH_URL=__PLACEHOLDER_FOR_NEXT_PUBLIC_AUTH_URL__ +# version config +NEXT_PUBLIC_GIT_COMMIT_SHA=__PLACEHOLDER_FOR_NEXT_PUBLIC_GIT_COMMIT_SHA__ +NEXT_PUBLIC_GIT_TAG = __PLACEHOLDER_FOR_NEXT_PUBLIC_GIT_TAG__ + # network config NEXT_PUBLIC_NETWORK_NAME=__PLACEHOLDER_FOR_NEXT_PUBLIC_NETWORK_NAME__ NEXT_PUBLIC_NETWORK_SHORT_NAME=__PLACEHOLDER_FOR_NEXT_PUBLIC_NETWORK_SHORT_NAME__ @@ -26,11 +30,8 @@ NEXT_PUBLIC_IS_TESTNET=__PLACEHOLDER_FOR_NEXT_PUBLIC_IS_TESTNET__ # ui config NEXT_PUBLIC_BLOCKSCOUT_VERSION=__PLACEHOLDER_FOR_NEXT_PUBLIC_BLOCKSCOUT_VERSION__ -NEXT_PUBLIC_FOOTER_GITHUB_LINK=__PLACEHOLDER_FOR_NEXT_PUBLIC_FOOTER_GITHUB_LINK__ -NEXT_PUBLIC_FOOTER_TWITTER_LINK=__PLACEHOLDER_FOR_NEXT_PUBLIC_FOOTER_TWITTER_LINK__ -NEXT_PUBLIC_FOOTER_TELEGRAM_LINK=__PLACEHOLDER_FOR_NEXT_PUBLIC_FOOTER_TELEGRAM_LINK__ -NEXT_PUBLIC_FOOTER_STAKING_LINK=__PLACEHOLDER_FOR_NEXT_PUBLIC_FOOTER_STAKING_LINK__ NEXT_PUBLIC_FEATURED_NETWORKS=__PLACEHOLDER_FOR_NEXT_PUBLIC_FEATURED_NETWORKS__ +NEXT_PUBLIC_FOOTER_LINKS=__PLACEHOLDER_FOR_NEXT_PUBLIC_FOOTER_LINKS__ NEXT_PUBLIC_NETWORK_EXPLORERS=__PLACEHOLDER_FOR_NEXT_PUBLIC_NETWORK_EXPLORERS__ NEXT_PUBLIC_OTHER_LINKS=__PLACEHOLDER_FOR_NEXT_PUBLIC_OTHER_LINKS__ NEXT_PUBLIC_MARKETPLACE_CONFIG_URL=__PLACEHOLDER_FOR_NEXT_PUBLIC_MARKETPLACE_CONFIG_URL__ diff --git a/Dockerfile b/Dockerfile index 2de67e1760..05cdeb8b3e 100644 --- a/Dockerfile +++ b/Dockerfile @@ -35,6 +35,8 @@ WORKDIR /app # pass commit sha to the app (uses by sentry.io as release version) ARG GIT_COMMIT_SHA ENV NEXT_PUBLIC_GIT_COMMIT_SHA=$GIT_COMMIT_SHA + +# pass git tag to the app (for the footer link) ARG GIT_TAG ENV NEXT_PUBLIC_GIT_TAG=$GIT_TAG diff --git a/configs/app/config.ts b/configs/app/config.ts index 8dd4892df3..fc1ceadf0d 100644 --- a/configs/app/config.ts +++ b/configs/app/config.ts @@ -96,15 +96,12 @@ const config = Object.freeze({ rpcUrl: getEnvValue(process.env.NEXT_PUBLIC_NETWORK_RPC_URL), isTestnet: getEnvValue(process.env.NEXT_PUBLIC_IS_TESTNET) === 'true', }, - footerLinks: { - github: getEnvValue(process.env.NEXT_PUBLIC_FOOTER_GITHUB_LINK), - twitter: getEnvValue(process.env.NEXT_PUBLIC_FOOTER_TWITTER_LINK), - telegram: getEnvValue(process.env.NEXT_PUBLIC_FOOTER_TELEGRAM_LINK), - staking: getEnvValue(process.env.NEXT_PUBLIC_FOOTER_STAKING_LINK), - }, otherLinks: parseEnvJson>(getEnvValue(process.env.NEXT_PUBLIC_OTHER_LINKS)) || [], featuredNetworks: getEnvValue(process.env.NEXT_PUBLIC_FEATURED_NETWORKS), + footerLinks: getEnvValue(process.env.NEXT_PUBLIC_FOOTER_LINKS), blockScoutVersion: getEnvValue(process.env.NEXT_PUBLIC_BLOCKSCOUT_VERSION), + frontendVersion: getEnvValue(process.env.NEXT_PUBLIC_GIT_TAG), + frontendCommit: getEnvValue(process.env.NEXT_PUBLIC_GIT_COMMIT_SHA), isAccountSupported: getEnvValue(process.env.NEXT_PUBLIC_IS_ACCOUNT_SUPPORTED) === 'true', marketplaceConfigUrl: getEnvValue(process.env.NEXT_PUBLIC_MARKETPLACE_CONFIG_URL), marketplaceSubmitForm: getEnvValue(process.env.NEXT_PUBLIC_MARKETPLACE_SUBMIT_FORM), diff --git a/configs/envs/.env.common b/configs/envs/.env.common index 17c284575b..16bd74658e 100644 --- a/configs/envs/.env.common +++ b/configs/envs/.env.common @@ -7,8 +7,6 @@ NEXT_PUBLIC_APP_ENV=development # ui config NEXT_PUBLIC_BLOCKSCOUT_VERSION=v4.1.7-beta -NEXT_PUBLIC_FOOTER_GITHUB_LINK=https://github.com/blockscout/blockscout -NEXT_PUBLIC_FOOTER_TWITTER_LINK=https://www.twitter.com/blockscoutcom NEXT_PUBLIC_API_SPEC_URL=https://raw.githubusercontent.com/blockscout/blockscout-api-v2-swagger/main/swagger.yaml # api config diff --git a/configs/envs/.env.jest b/configs/envs/.env.jest index 0c0f91ac44..e98de83ee9 100644 --- a/configs/envs/.env.jest +++ b/configs/envs/.env.jest @@ -5,8 +5,6 @@ NEXT_PUBLIC_APP_ENV=testing # ui config NEXT_PUBLIC_BLOCKSCOUT_VERSION=v4.1.7-beta -NEXT_PUBLIC_FOOTER_GITHUB_LINK=https://github.com/blockscout/blockscout -NEXT_PUBLIC_FOOTER_TWITTER_LINK=https://www.twitter.com/blockscoutcom NEXT_PUBLIC_IS_TESTNET=true # api config diff --git a/configs/envs/.env.localhost b/configs/envs/.env.localhost index ce478ae5fb..ab1c6bbc01 100644 --- a/configs/envs/.env.localhost +++ b/configs/envs/.env.localhost @@ -7,10 +7,6 @@ NEXT_PUBLIC_APP_ENV=development # ui config NEXT_PUBLIC_BLOCKSCOUT_VERSION=v4.1.7-beta -NEXT_PUBLIC_FOOTER_TELEGRAM_LINK=https://t.me/poa_network -NEXT_PUBLIC_FOOTER_STAKING_LINK=https://duneanalytics.com/maxaleks/xdai-staking -NEXT_PUBLIC_FOOTER_GITHUB_LINK=https://github.com/blockscout/blockscout -NEXT_PUBLIC_FOOTER_TWITTER_LINK=https://www.twitter.com/blockscoutcom NEXT_PUBLIC_FEATURED_NETWORKS=https://raw.githubusercontent.com/blockscout/frontend-configs/dev/configs/featured-networks/eth-goerli.json NEXT_PUBLIC_NETWORK_EXPLORERS=[{'title':'Anyblock','baseUrl':'https://explorer.anyblock.tools','paths':{'tx':'/ethereum/poa/core/transaction','address':'/ethereum/poa/core/address'}}] NEXT_PUBLIC_HOMEPAGE_CHARTS=['daily_txs','coin_price','market_cap'] diff --git a/configs/envs/.env.poa_core b/configs/envs/.env.poa_core index bf9c156309..87dead90e8 100644 --- a/configs/envs/.env.poa_core +++ b/configs/envs/.env.poa_core @@ -1,6 +1,4 @@ # ui config -NEXT_PUBLIC_FOOTER_TELEGRAM_LINK=https://t.me/poa_network -NEXT_PUBLIC_FOOTER_STAKING_LINK=https://duneanalytics.com/maxaleks/xdai-staking NEXT_PUBLIC_FEATURED_NETWORKS=https://raw.githubusercontent.com/blockscout/frontend-configs/dev/configs/featured-networks/eth-goerli.json NEXT_PUBLIC_NETWORK_EXPLORERS=[{'title':'Anyblock','baseUrl':'https://explorer.anyblock.tools','paths':{'tx':'/ethereum/poa/core/transaction','address':'/ethereum/poa/core/address','block':'/ethereum/poa/core/block'}}] NEXT_PUBLIC_HOMEPAGE_CHARTS=['daily_txs','coin_price','market_cap'] diff --git a/configs/envs/.env.pw b/configs/envs/.env.pw index 79bd5f053b..7de94066d1 100644 --- a/configs/envs/.env.pw +++ b/configs/envs/.env.pw @@ -7,16 +7,14 @@ NEXT_PUBLIC_APP_ENV=testing # ui config NEXT_PUBLIC_BLOCKSCOUT_VERSION=v4.1.7-beta -NEXT_PUBLIC_FOOTER_GITHUB_LINK=https://github.com/blockscout/blockscout -NEXT_PUBLIC_FOOTER_TWITTER_LINK=https://www.twitter.com/blockscoutcom -NEXT_PUBLIC_FOOTER_TELEGRAM_LINK=https://t.me/poa_network -NEXT_PUBLIC_FOOTER_STAKING_LINK=https://duneanalytics.com/maxaleks/xdai-staking NEXT_PUBLIC_NETWORK_EXPLORERS=[{'title':'Bitquery','baseUrl':'https://explorer.bitquery.io/','paths':{'tx':'/goerli/tx','address':'/goerli/address','token':'/goerli/token','block':'/goerli/block'}},{'title':'Etherscan','baseUrl':'https://goerli.etherscan.io/','paths':{'tx':'/tx','address':'/address','token':'/token','block':'/block'}}] +NEXT_PUBLIC_GIT_TAG=v1.0.11 NEXT_PUBLIC_HOMEPAGE_CHARTS=['daily_txs','coin_price','market_cap'] NEXT_PUBLIC_HOMEPAGE_SHOW_AVG_BLOCK_TIME=true NEXT_PUBLIC_HOMEPAGE_SHOW_GAS_TRACKER=true NEXT_PUBLIC_HOMEPAGE_PLATE_BACKGROUND= NEXT_PUBLIC_FEATURED_NETWORKS= +NEXT_PUBLIC_FOOTER_LINKS= NEXT_PUBLIC_NETWORK_LOGO= NEXT_PUBLIC_NETWORK_LOGO_DARK= NEXT_PUBLIC_NETWORK_ICON= diff --git a/deploy/values/l2-optimism-goerli/values.yaml b/deploy/values/l2-optimism-goerli/values.yaml index c3799044fb..3a36c1c49e 100644 --- a/deploy/values/l2-optimism-goerli/values.yaml +++ b/deploy/values/l2-optimism-goerli/values.yaml @@ -352,10 +352,6 @@ frontend: environment: NEXT_PUBLIC_BLOCKSCOUT_VERSION: _default: v5.1.5-beta - NEXT_PUBLIC_FOOTER_GITHUB_LINK: - _default: https://github.com/blockscout/blockscout - NEXT_PUBLIC_FOOTER_TWITTER_LINK: - _default: https://www.twitter.com/blockscoutcom NEXT_PUBLIC_APP_ENV: _default: stable NEXT_PUBLIC_APP_INSTANCE: diff --git a/deploy/values/main/values.yaml b/deploy/values/main/values.yaml index 28609ea612..010041217c 100644 --- a/deploy/values/main/values.yaml +++ b/deploy/values/main/values.yaml @@ -275,10 +275,6 @@ frontend: _default: / NEXT_PUBLIC_BLOCKSCOUT_VERSION: _default: v5.1.2-beta - NEXT_PUBLIC_FOOTER_GITHUB_LINK: - _default: https://github.com/blockscout/blockscout - NEXT_PUBLIC_FOOTER_TWITTER_LINK: - _default: https://www.twitter.com/blockscoutcom NEXT_PUBLIC_APP_ENV: _default: stable NEXT_PUBLIC_APP_INSTANCE: diff --git a/deploy/values/review-l2/values.yaml.gotmpl b/deploy/values/review-l2/values.yaml.gotmpl index 9e55e9a7e6..37e13a14e8 100644 --- a/deploy/values/review-l2/values.yaml.gotmpl +++ b/deploy/values/review-l2/values.yaml.gotmpl @@ -61,10 +61,6 @@ frontend: environment: NEXT_PUBLIC_BLOCKSCOUT_VERSION: _default: v5.1.0-beta - NEXT_PUBLIC_FOOTER_GITHUB_LINK: - _default: https://github.com/blockscout/blockscout - NEXT_PUBLIC_FOOTER_TWITTER_LINK: - _default: https://www.twitter.com/blockscoutcom NEXT_PUBLIC_APP_ENV: _default: preview NEXT_PUBLIC_APP_INSTANCE: diff --git a/deploy/values/review/values.yaml.gotmpl b/deploy/values/review/values.yaml.gotmpl index 9d21389b01..3014a20934 100644 --- a/deploy/values/review/values.yaml.gotmpl +++ b/deploy/values/review/values.yaml.gotmpl @@ -57,18 +57,10 @@ frontend: environment: NEXT_PUBLIC_BLOCKSCOUT_VERSION: _default: v5.1.2-beta - NEXT_PUBLIC_FOOTER_GITHUB_LINK: - _default: https://github.com/blockscout/blockscout - NEXT_PUBLIC_FOOTER_TWITTER_LINK: - _default: https://www.twitter.com/blockscoutcom NEXT_PUBLIC_APP_ENV: _default: preview NEXT_PUBLIC_APP_INSTANCE: _default: eth_goerli - NEXT_PUBLIC_FOOTER_TELEGRAM_LINK: - _default: https://t.me/poa_network - NEXT_PUBLIC_FOOTER_STAKING_LINK: - _default: https://duneanalytics.com/maxaleks/xdai-staking NEXT_PUBLIC_NETWORK_NAME: _default: Göerli NEXT_PUBLIC_NETWORK_SHORT_NAME: diff --git a/docs/ENVS.md b/docs/ENVS.md index 4d4060300d..5974a64eeb 100644 --- a/docs/ENVS.md +++ b/docs/ENVS.md @@ -30,11 +30,8 @@ The app instance could be customized by passing following variables to NodeJS en | --- | --- | --- | --- | --- | --- | | NEXT_PUBLIC_FEATURED_NETWORKS | `string` | URL of configuration file (`.json` format only) which contains list of featured networks that will be shown in the network menu. See [below](#featured-network-configuration-properties) list of available properties for particular network | - | - | `https://example.com/featured_networks_config.json` | | NEXT_PUBLIC_OTHER_LINKS | `Array<{url: string; text: string}>` | List of links for the "Other" navigation menu | - | - | `[{'url':'https://blockscout.com','text':'Blockscout'}]` | +| NEXT_PUBLIC_FOOTER_LINKS | `string` | URL of configuration file (`.json` format only) which contains list of link groups to be displayed in the footer. See [below](#footer-links-configuration-properties) list of available properties for particular group | - | - | `https://example.com/footer_links_config.json` | | NEXT_PUBLIC_BLOCKSCOUT_VERSION | `string` | Current running version of Blockscout (used to display link to release in the footer) | - | - | `v.5.1.0-beta` -| NEXT_PUBLIC_FOOTER_GITHUB_LINK | `string` | Link to Github in the footer | - | - | `https://github.com/blockscout/blockscout` | -| NEXT_PUBLIC_FOOTER_TWITTER_LINK | `string` | Link to Twitter in the footer | - | - | `https://www.twitter.com/blockscoutcom` | -| NEXT_PUBLIC_FOOTER_TELEGRAM_LINK | `string` | Link to Telegram in the footer | - | - | `https://t.me/poa_network` | -| NEXT_PUBLIC_FOOTER_STAKING_LINK | `string` | Link to staking dashboard in the footer | - | - | `https://duneanalytics.com/maxaleks/xdai-staking` | | NEXT_PUBLIC_MARKETPLACE_CONFIG_URL | `string` | URL of configuration file (`.json` format only) which contains list of apps that will be shown on the marketplace page. See [below](#marketplace-app-configuration-properties) list of available properties for an app | - | - | `https://example.com/marketplace_config.json` | | NEXT_PUBLIC_MARKETPLACE_SUBMIT_FORM | `string` | Link to form where authors can submit their dapps to the marketplace | - | - | `https://airtable.com/shrqUAcjgGJ4jU88C` | | NEXT_PUBLIC_NETWORK_EXPLORERS | `Array` where `NetworkExplorer` can have following [properties](#network-explorer-configuration-properties) | Used to build up links to transactions, blocks, addresses in other chain explorers. | - | - | `[{'title':'Anyblock','baseUrl':'https://explorer.anyblock.tools','paths':{'tx':'/ethereum/poa/core/tx'}}]` | @@ -108,6 +105,13 @@ For each application, you need to specify the `MarketplaceCategoryId` to which i *Note* The url of an entity will be constructed as `]>`, e.g `https://explorer.anyblock.tools/ethereum/poa/core/tx/` +## Footer links configuration properties + +| Variable | Type| Description | Is required | Default value | Example value | +| --- | --- | --- | --- | --- | --- | +| title | `string` | Title of link group | yes | - | `Company` | +| links | `Array<{'text':string;'url':string;}>` | list of links | yes | - | `[{'text':'Homepage','url':'https://www.blockscout.com'}]` | + ## App configuration diff --git a/icons/discussions.svg b/icons/discussions.svg new file mode 100644 index 0000000000..e012d309be --- /dev/null +++ b/icons/discussions.svg @@ -0,0 +1,4 @@ + + + + diff --git a/icons/profile.svg b/icons/profile.svg deleted file mode 100644 index 0c7885b70d..0000000000 --- a/icons/profile.svg +++ /dev/null @@ -1,5 +0,0 @@ - - - - - diff --git a/icons/social/discord.svg b/icons/social/discord.svg new file mode 100644 index 0000000000..b3110f3276 --- /dev/null +++ b/icons/social/discord.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/lib/hooks/useIssueUrl.tsx b/lib/hooks/useIssueUrl.tsx new file mode 100644 index 0000000000..72ceb636d4 --- /dev/null +++ b/lib/hooks/useIssueUrl.tsx @@ -0,0 +1,45 @@ +import React from 'react'; + +import appConfig from 'configs/app/config'; +import isBrowser from 'lib/isBrowser'; + +const base = 'https://github.com/blockscout/blockscout/issues/new/'; + +const bodyTemplate = `*Describe your issue here.* + +### Environment + +* Backend Version/branch/commit: ${ appConfig.blockScoutVersion } +* Frontend Version+commit: ${ [ appConfig.frontendVersion, appConfig.frontendCommit ].filter(Boolean).join('+') } +* User Agent: __userAgent__ + +### Steps to reproduce + +*Tell us how to reproduce this issue. ❤️ if you can push up a branch to your fork with a regression test we can run to reproduce locally.* + +### Expected behaviour + +*Tell us what should happen.* + +### Actual behaviour + +*Tell us what happens instead.*`; + +const labels = 'new UI'; + +const title = `${ appConfig.network.name }: `; + +export default function useIssueUrl() { + const [ userAgent, setUserAgent ] = React.useState(''); + const isInBrowser = isBrowser(); + + React.useEffect(() => { + if (isInBrowser) { + setUserAgent(window.navigator.userAgent); + } + }, [ isInBrowser ]); + + const params = new URLSearchParams({ labels, title, body: bodyTemplate.replace('__userAgent__', userAgent) }); + return base + '?' + params.toString(); + +} diff --git a/lib/hooks/useNavItems.tsx b/lib/hooks/useNavItems.tsx index 0a05e1dece..8f758b303b 100644 --- a/lib/hooks/useNavItems.tsx +++ b/lib/hooks/useNavItems.tsx @@ -15,7 +15,6 @@ import globeIcon from 'icons/globe-b.svg'; import graphQLIcon from 'icons/graphQL.svg'; import outputRootsIcon from 'icons/output_roots.svg'; import privateTagIcon from 'icons/privattags.svg'; -import profileIcon from 'icons/profile.svg'; import publicTagIcon from 'icons/publictags.svg'; import apiDocsIcon from 'icons/restAPI.svg'; import rpcIcon from 'icons/RPC.svg'; @@ -27,6 +26,7 @@ import txnBatchIcon from 'icons/txn_batches.svg'; import verifiedIcon from 'icons/verified.svg'; import watchlistIcon from 'icons/watchlist.svg'; import { rightLineArrow } from 'lib/html-entities'; +import UserAvatar from 'ui/shared/UserAvatar'; interface ReturnType { mainNavItems: Array; @@ -213,7 +213,7 @@ export default function useNavItems(): ReturnType { const profileItem = { text: 'My profile', nextRoute: { pathname: '/auth/profile' as const }, - icon: profileIcon, + iconComponent: UserAvatar, isActive: pathname === '/auth/profile', }; diff --git a/lib/web3/wallets.ts b/lib/web3/wallets.ts index 55479c1772..db79f4331a 100644 --- a/lib/web3/wallets.ts +++ b/lib/web3/wallets.ts @@ -5,13 +5,11 @@ import metamaskIcon from 'icons/wallets/metamask.svg'; export const WALLETS_INFO: Record = { metamask: { - add_token_text: 'Add token to MetaMask', - add_network_text: 'Add network to MetaMask', + name: 'MetaMask', icon: metamaskIcon, }, coinbase: { - add_token_text: 'Add token to Coinbase Wallet', - add_network_text: 'Add network to Coinbase Wallet', + name: 'Coinbase Wallet', icon: coinbaseIcon, }, }; diff --git a/mocks/config/footerLinks.ts b/mocks/config/footerLinks.ts new file mode 100644 index 0000000000..b1c5329d9f --- /dev/null +++ b/mocks/config/footerLinks.ts @@ -0,0 +1,76 @@ +import type { CustomLinksGroup } from 'types/footerLinks'; + +export const FOOTER_LINKS: Array = [ + { + title: 'Company', + links: [ + { + text: 'Advertise', + url: 'https://coinzilla.com/', + }, + { + text: 'Staking', + url: '', + }, + { + text: 'Contact us', + url: '', + }, + { + text: 'Brand assets', + url: '', + }, + { + text: 'Term of service', + url: '', + }, + ], + }, + { + title: 'Community', + links: [ + { + text: 'API docs', + url: '', + }, + { + text: 'Knowledge base', + url: '', + }, + { + text: 'Network status', + url: '', + }, + { + text: 'Learn Alphabet', + url: '', + }, + ], + }, + { + title: 'Product', + links: [ + { + text: 'Stake Alphabet', + url: '', + }, + { + text: 'Build token', + url: '', + }, + { + text: 'Build DAPPS', + url: '', + }, + { + text: 'NFT marketplace', + url: '', + }, + { + text: 'Become validator', + url: '', + }, + + ], + }, +]; diff --git a/theme/components/Link.ts b/theme/components/Link.ts index 187bcfc99d..6cbee7bf00 100644 --- a/theme/components/Link.ts +++ b/theme/components/Link.ts @@ -18,7 +18,7 @@ const variantPrimary = defineStyle((props) => { const variantSecondary = defineStyle((props) => { return { - color: mode('gray.500', 'gray.500')(props), + color: mode('gray.600', 'gray.500')(props), _hover: { color: mode('gray.600', 'gray.400')(props), }, diff --git a/types/client/navigation-items.ts b/types/client/navigation-items.ts index 8aed9af9ce..0191040948 100644 --- a/types/client/navigation-items.ts +++ b/types/client/navigation-items.ts @@ -1,9 +1,15 @@ import type { Route } from 'nextjs-routes'; +import type React from 'react'; + +type NavIconOrComponent = { + icon?: React.FunctionComponent>; +} | { + iconComponent?: React.FC<{size?: number}>; +}; type NavItemCommon = { text: string; - icon?: React.FunctionComponent>; -} +} & NavIconOrComponent; export type NavItemInternal = NavItemCommon & { nextRoute: Route; diff --git a/types/client/wallets.ts b/types/client/wallets.ts index 9b0bcf7826..f173869867 100644 --- a/types/client/wallets.ts +++ b/types/client/wallets.ts @@ -3,8 +3,7 @@ import type { providers } from 'ethers'; export type WalletType = 'metamask' | 'coinbase'; export interface WalletInfo { - add_token_text: string; - add_network_text: string; + name: string; icon: React.ElementType; } diff --git a/types/footerLinks.ts b/types/footerLinks.ts new file mode 100644 index 0000000000..7edf7ced89 --- /dev/null +++ b/types/footerLinks.ts @@ -0,0 +1,9 @@ +type CustomLink = { + text: string; + url: string; +} + +export type CustomLinksGroup = { + title: string; + links: Array; +} diff --git a/ui/pages/Address.tsx b/ui/pages/Address.tsx index 81322e23a3..34b9f4f43a 100644 --- a/ui/pages/Address.tsx +++ b/ui/pages/Address.tsx @@ -135,7 +135,6 @@ const AddressPageContent = () => { { /* should stay before tabs to scroll up with pagination */ } { addressQuery.isPlaceholderData ? : content } - { !addressQuery.isPlaceholderData && !addressQuery.isError && } ); }; diff --git a/ui/pages/Home.tsx b/ui/pages/Home.tsx index 55eb025290..44f0e5cc98 100644 --- a/ui/pages/Home.tsx +++ b/ui/pages/Home.tsx @@ -8,7 +8,6 @@ import Stats from 'ui/home/Stats'; import Transactions from 'ui/home/Transactions'; import AdBanner from 'ui/shared/ad/AdBanner'; import Page from 'ui/shared/Page/Page'; -import ColorModeToggler from 'ui/snippets/header/ColorModeToggler'; import ProfileMenuDesktop from 'ui/snippets/profileMenu/ProfileMenuDesktop'; import SearchBar from 'ui/snippets/searchBar/SearchBar'; @@ -33,15 +32,9 @@ const Home = () => { > Welcome to { appConfig.network.name } explorer - - + { appConfig.isAccountSupported && } - + diff --git a/ui/pages/MyProfile.tsx b/ui/pages/MyProfile.tsx index 905ec63391..896286fab2 100644 --- a/ui/pages/MyProfile.tsx +++ b/ui/pages/MyProfile.tsx @@ -9,7 +9,7 @@ import PageTitle from 'ui/shared/Page/PageTitle'; import UserAvatar from 'ui/shared/UserAvatar'; const MyProfile = () => { - const { data, isLoading, isError, error, isFetched } = useFetchProfileInfo(); + const { data, isLoading, isError, error } = useFetchProfileInfo(); useRedirectForInvalidAuthToken(); const content = (() => { @@ -26,7 +26,7 @@ const MyProfile = () => { return ( - + { stickyEnabled={ !isMobile } /> ) } - - { !tokenQuery.isLoading && !tokenQuery.isError && } ); }; diff --git a/ui/pages/TokenInstance.tsx b/ui/pages/TokenInstance.tsx index f7bbf169a3..52f93a8dc4 100644 --- a/ui/pages/TokenInstance.tsx +++ b/ui/pages/TokenInstance.tsx @@ -183,8 +183,6 @@ const TokenInstanceContent = () => { stickyEnabled={ !isMobile } /> ) } - - { !tokenInstanceQuery.isLoading && !tokenInstanceQuery.isError && } ); }; diff --git a/ui/pages/__screenshots__/Home.pw.tsx_dark-color-mode_default-view---default-desktop-xl-dark-mode-1.png b/ui/pages/__screenshots__/Home.pw.tsx_dark-color-mode_default-view---default-desktop-xl-dark-mode-1.png index 4e506626c1..7e848b764c 100644 Binary files a/ui/pages/__screenshots__/Home.pw.tsx_dark-color-mode_default-view---default-desktop-xl-dark-mode-1.png and b/ui/pages/__screenshots__/Home.pw.tsx_dark-color-mode_default-view---default-desktop-xl-dark-mode-1.png differ diff --git a/ui/pages/__screenshots__/Home.pw.tsx_default_custom-hero-plate-background-default-view-1.png b/ui/pages/__screenshots__/Home.pw.tsx_default_custom-hero-plate-background-default-view-1.png index f23582788c..9a5f011968 100644 Binary files a/ui/pages/__screenshots__/Home.pw.tsx_default_custom-hero-plate-background-default-view-1.png and b/ui/pages/__screenshots__/Home.pw.tsx_default_custom-hero-plate-background-default-view-1.png differ diff --git a/ui/pages/__screenshots__/Home.pw.tsx_desktop-xl_default-view---default-desktop-xl-dark-mode-1.png b/ui/pages/__screenshots__/Home.pw.tsx_desktop-xl_default-view---default-desktop-xl-dark-mode-1.png index b80ea656c6..f795aed4b4 100644 Binary files a/ui/pages/__screenshots__/Home.pw.tsx_desktop-xl_default-view---default-desktop-xl-dark-mode-1.png and b/ui/pages/__screenshots__/Home.pw.tsx_desktop-xl_default-view---default-desktop-xl-dark-mode-1.png differ diff --git a/ui/pages/__screenshots__/SearchResults.pw.tsx_dark-color-mode_search-by-name-mobile-dark-mode-1.png b/ui/pages/__screenshots__/SearchResults.pw.tsx_dark-color-mode_search-by-name-mobile-dark-mode-1.png index 7088e20134..51c4fe9eae 100644 Binary files a/ui/pages/__screenshots__/SearchResults.pw.tsx_dark-color-mode_search-by-name-mobile-dark-mode-1.png and b/ui/pages/__screenshots__/SearchResults.pw.tsx_dark-color-mode_search-by-name-mobile-dark-mode-1.png differ diff --git a/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-address-hash-mobile-1.png b/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-address-hash-mobile-1.png index 264f940e3e..4a47d14340 100644 Binary files a/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-address-hash-mobile-1.png and b/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-address-hash-mobile-1.png differ diff --git a/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-block-hash-mobile-1.png b/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-block-hash-mobile-1.png index 8fb808bfba..0a8d881f4f 100644 Binary files a/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-block-hash-mobile-1.png and b/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-block-hash-mobile-1.png differ diff --git a/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-block-number-mobile-1.png b/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-block-number-mobile-1.png index 2bca424baf..2ea32ce8fb 100644 Binary files a/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-block-number-mobile-1.png and b/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-block-number-mobile-1.png differ diff --git a/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-name-mobile-dark-mode-1.png b/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-name-mobile-dark-mode-1.png index 06f50e5653..334f35b4c8 100644 Binary files a/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-name-mobile-dark-mode-1.png and b/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-name-mobile-dark-mode-1.png differ diff --git a/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-tx-hash-mobile-1.png b/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-tx-hash-mobile-1.png index da929a96b7..897b283b88 100644 Binary files a/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-tx-hash-mobile-1.png and b/ui/pages/__screenshots__/SearchResults.pw.tsx_default_search-by-tx-hash-mobile-1.png differ diff --git a/ui/pages/__screenshots__/Token.pw.tsx_default_base-view-1.png b/ui/pages/__screenshots__/Token.pw.tsx_default_base-view-1.png index a98277a860..200bd59e18 100644 Binary files a/ui/pages/__screenshots__/Token.pw.tsx_default_base-view-1.png and b/ui/pages/__screenshots__/Token.pw.tsx_default_base-view-1.png differ diff --git a/ui/pages/__screenshots__/Token.pw.tsx_default_with-verified-info-1.png b/ui/pages/__screenshots__/Token.pw.tsx_default_with-verified-info-1.png index 0868dd80eb..470ff8f7cb 100644 Binary files a/ui/pages/__screenshots__/Token.pw.tsx_default_with-verified-info-1.png and b/ui/pages/__screenshots__/Token.pw.tsx_default_with-verified-info-1.png differ diff --git a/ui/shared/NetworkAddToWallet.tsx b/ui/shared/NetworkAddToWallet.tsx index 21651462c2..45fb58a094 100644 --- a/ui/shared/NetworkAddToWallet.tsx +++ b/ui/shared/NetworkAddToWallet.tsx @@ -1,4 +1,4 @@ -import { Box, Icon, Tooltip, chakra } from '@chakra-ui/react'; +import { Button, Icon, chakra } from '@chakra-ui/react'; import React from 'react'; import appConfig from 'configs/app/config'; @@ -59,11 +59,10 @@ const NetworkAddToWallet = ({ className }: Props) => { const defaultWallet = appConfig.web3.defaultWallet; return ( - - - - - + ); }; diff --git a/ui/shared/Page/Page.tsx b/ui/shared/Page/Page.tsx index ae4268c29b..f008740092 100644 --- a/ui/shared/Page/Page.tsx +++ b/ui/shared/Page/Page.tsx @@ -1,4 +1,4 @@ -import { Flex } from '@chakra-ui/react'; +import { Box, Flex } from '@chakra-ui/react'; import React from 'react'; import getErrorCauseStatusCode from 'lib/errors/getErrorCauseStatusCode'; @@ -12,6 +12,7 @@ import AppErrorInvalidTxHash from 'ui/shared/AppError/AppErrorInvalidTxHash'; import AppErrorUnverifiedEmail from 'ui/shared/AppError/AppErrorUnverifiedEmail'; import ErrorBoundary from 'ui/shared/ErrorBoundary'; import PageContent from 'ui/shared/Page/PageContent'; +import Footer from 'ui/snippets/footer/Footer'; import Header from 'ui/snippets/header/Header'; import NavigationDesktop from 'ui/snippets/navigation/NavigationDesktop'; @@ -73,18 +74,21 @@ const Page = ({ ) : children; return ( - - - - { renderHeader ? - renderHeader() : -
- } - - { renderedChildren } - + + + + + { renderHeader ? + renderHeader() : +
+ } + + { renderedChildren } + + - +