diff --git a/packages/apps/src/Menu/ChainInfo.tsx b/packages/apps/src/Menu/ChainInfo.tsx index 6f4777905a..997610fe87 100644 --- a/packages/apps/src/Menu/ChainInfo.tsx +++ b/packages/apps/src/Menu/ChainInfo.tsx @@ -11,14 +11,12 @@ import { useApi, useCall, useIpfs, useToggle } from '@polkadot/react-hooks'; import { BestNumber, Chain } from '@polkadot/react-query'; import Endpoints from '../Endpoints'; -import { useTranslation } from '../translate'; interface Props { className?: string; } function ChainInfo ({ className }: Props): React.ReactElement { - const { t } = useTranslation(); const { api, isApiReady } = useApi(); const runtimeVersion = useCall(isApiReady && api.rpc.state.subscribeRuntimeVersion); const { ipnsChain } = useIpfs(); @@ -35,7 +33,7 @@ function ChainInfo ({ className }: Props): React.ReactElement {
{runtimeVersion && ( -
{t('version {{version}}', { replace: { version: runtimeVersion.specVersion.toNumber() } })}
+
{runtimeVersion.specName.toString()}/{runtimeVersion.specVersion.toNumber()}
)} (); - function createExternals (t: TFunction): ItemRoute[] { return [ - { href: 'https://github.com/polkadot-js/apps', icon: 'code-branch', name: 'github', text: t('nav.github', 'GitHub', { ns: 'apps-routing' }) }, - { href: 'https://wiki.polkadot.network', icon: 'book', name: 'wiki', text: t('nav.wiki', 'Wiki', { ns: 'apps-routing' }) } + { + href: 'https://github.com/polkadot-js/apps', + icon: 'code-branch', + name: 'github', + text: t('nav.github', 'GitHub', { ns: 'apps-routing' }) + }, + { + href: 'https://wiki.polkadot.network', + icon: 'book', + name: 'wiki', + text: t('nav.wiki', 'Wiki', { ns: 'apps-routing' }) + } ]; } -function logDisabled (route: string, message: string): void { - if (!disabledLog.get(route)) { - disabledLog.set(route, message); - - console.warn(`Disabling ${route}: ${message}`); - } -} - -function checkVisible (name: string, { api, isApiConnected, isApiReady }: ApiProps, hasAccounts: boolean, hasSudo: boolean, { isHidden, needsAccounts, needsApi, needsSudo }: Route['display']): boolean { +function checkVisible ({ api, isApiConnected, isApiReady }: ApiProps, hasAccounts: boolean, hasSudo: boolean, { isHidden, needsAccounts, needsApi, needsSudo }: Route['display']): boolean { if (isHidden) { return false; } else if (needsAccounts && !hasAccounts) { @@ -52,18 +52,10 @@ function checkVisible (name: string, { api, isApiConnected, isApiReady }: ApiPro } else if (!isApiReady || !isApiConnected) { return false; } else if (needsSudo && !hasSudo) { - logDisabled(name, 'Sudo key not available'); - return false; } - const notFound = findMissingApis(api, needsApi); - - if (notFound.length !== 0) { - logDisabled(name, `API not available: ${notFound.toString()}`); - } - - return notFound.length === 0; + return findMissingApis(api, needsApi).length === 0; } function extractGroups (routing: Routes, groupNames: Record, apiProps: ApiProps, hasAccounts: boolean, hasSudo: boolean): Group[] { @@ -71,7 +63,10 @@ function extractGroups (routing: Routes, groupNames: Record, api .values( routing.reduce((all: Groups, route): Groups => { if (!all[route.group]) { - all[route.group] = { name: groupNames[route.group], routes: [route] }; + all[route.group] = { + name: groupNames[route.group], + routes: [route] + }; } else { all[route.group].routes.push(route); } @@ -81,7 +76,9 @@ function extractGroups (routing: Routes, groupNames: Record, api ) .map(({ name, routes }): Group => ({ name, - routes: routes.filter(({ display, name }) => checkVisible(name, apiProps, hasAccounts, hasSudo, display)) + routes: routes.filter(({ display }) => + checkVisible(apiProps, hasAccounts, hasSudo, display) + ) })) .filter(({ routes }) => routes.length); } @@ -94,6 +91,7 @@ function Menu ({ className = '' }: Props): React.ReactElement { const location = useLocation(); const externalRef = useRef(createExternals(t)); + const routeRef = useRef(createRoutes(t)); const groupRef = useRef({ accounts: t('Accounts'), @@ -103,10 +101,8 @@ function Menu ({ className = '' }: Props): React.ReactElement { settings: t('Settings') }); - const routeRef = useRef(createRoutes(t)); - const hasSudo = useMemo( - () => !!sudoKey && allAccounts.some((address) => sudoKey.eq(address)), + () => !!sudoKey && allAccounts.some((a) => sudoKey.eq(a)), [allAccounts, sudoKey] ); @@ -116,21 +112,21 @@ function Menu ({ className = '' }: Props): React.ReactElement { ); const activeRoute = useMemo( - () => routeRef.current.find((route) => location.pathname.startsWith(`/${route.name}`)) || null, + () => routeRef.current.find(({ name }) => + location.pathname.startsWith(`/${name}`) + ) || null, [location] ); - const isLoading = !apiProps.isApiReady || !apiProps.isApiConnected; - return ( -
+
    {visibleGroups.map(({ name, routes }): React.ReactNode => (