LaconicNetwork/vega-frontend-monorepo
4
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

feat: add network switcher to block explorer (#1242)

Browse Source 
* feat: add network switcher to block explorer

* fix: add mock for @vegaprotocol/environment

* fix: #723 add test to see if network switcher gets rendered

* fix: formatting on header.spec.tsx
This commit is contained in:
m.ray 2022-09-05 20:28:21 +01:00 committed by GitHub
parent adec04918e
commit 744c084ca2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 24 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
apps/explorer/src/app/components/header/header.spec.tsx
View File

@ -2,6 +2,12 @@ import { render, screen } from '@testing-library/react';
import { Header } from './header'; import { Header } from './header';
import { MemoryRouter } from 'react-router-dom'; import { MemoryRouter } from 'react-router-dom';
jest.mock('@vegaprotocol/environment', () => ({
NetworkSwitcher: () => (
<div data-testid="network-switcher">NetworkSwitcher</div>
),
}));
jest.mock('../search', () => ({ jest.mock('../search', () => ({
Search: () => <div data-testid="search">OrderList</div>, Search: () => <div data-testid="search">OrderList</div>,
})); }));
@ -25,4 +31,10 @@ describe('Header', () => {
expect(screen.getByTestId('search')).toBeInTheDocument(); expect(screen.getByTestId('search')).toBeInTheDocument();
}); });
it('should render network switcher', () => {
render(renderComponent());
expect(screen.getByTestId('network-switcher')).toBeInTheDocument();
});
}); });

20
apps/explorer/src/app/components/header/header.tsx
View File

@ -5,6 +5,7 @@ import { t } from '@vegaprotocol/react-helpers';
import { Search } from '../search'; import { Search } from '../search';
import { Routes } from '../../routes/route-names'; import { Routes } from '../../routes/route-names';
import type { Dispatch, SetStateAction } from 'react'; import type { Dispatch, SetStateAction } from 'react';
import { NetworkSwitcher } from '@vegaprotocol/environment';
interface ThemeToggleProps { interface ThemeToggleProps {
theme: 'light' | 'dark'; theme: 'light' | 'dark';
@ -27,14 +28,17 @@ export const Header = ({
); );
return ( return (
<header className={headerClasses}> <header className={headerClasses}>
<Link to={Routes.HOME}> <div className="flex h-full items-center sm:items-stretch gap-4">
<h1 <Link to={Routes.HOME}>
className="text-3xl font-alpha uppercase calt mb-0" <h1
data-testid="explorer-header" className="text-3xl font-alpha uppercase calt mb-0"
> data-testid="explorer-header"
{t('Vega Explorer')} >
</h1> {t('Vega Explorer')}
</Link> </h1>
</Link>
<NetworkSwitcher />
</div>
<button <button
data-testid="open-menu" data-testid="open-menu"
className="md:hidden" className="md:hidden"