GRIN/nym
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Revert "NE: Switch button to change the explorer network"

Browse Source
This commit is contained in:
Gala
2022-12-22 14:20:21 +01:00
committed by GitHub
parent 4813cf6c18
commit 9dd4c5d871
7 changed files with 13 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files
explorer/src/api/index.ts
-7
View File
@@ -1,5 +1,4 @@
import {
API_BASE_URL,
BLOCK_API,
COUNTRY_DATA_API,
GATEWAYS_API,
@@ -28,7 +27,6 @@ import {
StatusResponse,
SummaryOverviewResponse,
ValidatorsResponse,
Environment,
} from '../typeDefs/explorer-api';
function getFromCache(key: string) {
@@ -145,8 +143,3 @@ export class Api {
static fetchUptimeStoryById = async (id: string): Promise<UptimeStoryResponse> =>
(await fetch(`${UPTIME_STORY_API}/${id}/history`)).json();
}
export const getEnvironment = (): Environment => {
const matchEnv = (env: Environment) => API_BASE_URL?.toLocaleLowerCase().includes(env) && env;
return matchEnv('sandbox') || matchEnv('qa') || 'mainnet';
};
explorer/src/components/MobileNav.tsx
+7 -22
View File
@@ -31,18 +31,11 @@ type MobileNavProps = {
export const MobileNav: React.FC<{ children: React.ReactNode }> = ({ children }: MobileNavProps) => {
const theme = useTheme();
const { navState, updateNavState, environment } = useMainContext();
const { navState, updateNavState } = useMainContext();
const [drawerOpen, setDrawerOpen] = React.useState(false);
// Set maintenance banner to false by default to don't display it
const [openMaintenance, setOpenMaintenance] = React.useState(false);
const explorerName =
`${environment && environment.charAt(0).toUpperCase() + environment.slice(1)} Explorer` || 'Mainnet Explorer';
const switchNetworkText = environment === 'mainnet' ? 'Switch to Testnet' : 'Switch to Mainnet';
const switchNetworkLink =
environment === 'mainnet' ? 'https://sandbox-explorer.nymtech.net' : 'https://explorer.nymtech.net';
const toggleDrawer = () => {
setDrawerOpen(!drawerOpen);
};
@@ -83,7 +76,7 @@ export const MobileNav: React.FC<{ children: React.ReactNode }> = ({ children }:
}}
>
<IconButton component="a" href={NYM_WEBSITE} target="_blank">
<NymLogo height="24px" width="24px" />
<NymLogo height="40px" width="40px" />
</IconButton>
<Typography
variant="h6"
@@ -92,26 +85,18 @@ export const MobileNav: React.FC<{ children: React.ReactNode }> = ({ children }:
color: theme.palette.nym.networkExplorer.nav.text,
fontSize: '18px',
fontWeight: 600,
ml: 2,
}}
>
<MuiLink component={Link} to="/overview" underline="none" color="inherit" fontSize={14} fontWeight={700}>
{explorerName}
<MuiLink component={Link} to="/overview" underline="none" color="inherit">
Network Explorer
</MuiLink>
<Button
size="small"
variant="outlined"
color="inherit"
href={switchNetworkLink}
sx={{ textTransform: 'none', width: 114, fontSize: '12px', fontWeight: 600, ml: 1 }}
>
{switchNetworkText}
</Button>
</Typography>
</Box>
<Box sx={{ mr: 1 }}>
<Box>
<DarkLightSwitchMobile />
<Button onClick={toggleDrawer} sx={{ p: 0, minWidth: 0 }}>
<Button onClick={toggleDrawer}>
<Menu sx={{ color: theme.palette.primary.contrastText }} />
</Button>
</Box>
explorer/src/components/Nav.tsx
+2 -19
View File
@@ -2,7 +2,6 @@ import * as React from 'react';
import { Link } from 'react-router-dom';
import { ExpandLess, ExpandMore, Menu } from '@mui/icons-material';
import { CSSObject, styled, Theme, useTheme } from '@mui/material/styles';
import Button from '@mui/material/Button';
import MuiLink from '@mui/material/Link';
import Box from '@mui/material/Box';
import ListItem from '@mui/material/ListItem';
@@ -232,20 +231,13 @@ ExpandableButton.defaultProps = {
};
export const Nav: React.FC = ({ children }) => {
const { updateNavState, navState, environment } = useMainContext();
const { updateNavState, navState } = useMainContext();
const [drawerIsOpen, setDrawerToOpen] = React.useState(false);
const [fixedOpen, setFixedOpen] = React.useState(false);
// Set maintenance banner to false by default to don't display it
const [openMaintenance, setOpenMaintenance] = React.useState(false);
const theme = useTheme();
const explorerName =
`${environment && environment.charAt(0).toUpperCase() + environment.slice(1)} Explorer` || 'Mainnet Explorer';
const switchNetworkText = environment === 'mainnet' ? 'Switch to Testnet' : 'Switch to Mainnet';
const switchNetworkLink =
environment === 'mainnet' ? 'https://sandbox-explorer.nymtech.net' : 'https://explorer.nymtech.net';
const setToActive = (id: number) => {
updateNavState(id);
};
@@ -310,17 +302,8 @@ export const Nav: React.FC = ({ children }) => {
}}
>
<MuiLink component={Link} to="/" underline="none" color="inherit">
{explorerName}
Network Explorer
</MuiLink>
<Button
size="small"
variant="outlined"
color="inherit"
href={switchNetworkLink}
sx={{ borderRadius: 2, textTransform: 'none', width: 150, ml: 4, fontSize: 14, fontWeight: 600 }}
>
{switchNetworkText}
</Button>
</Typography>
</Box>
<Box
explorer/src/components/Switch.tsx
+1 -1
View File
@@ -54,7 +54,7 @@ export const DarkLightSwitch = styled(Switch)(({ theme }) => ({
export const DarkLightSwitchMobile: React.FC = () => {
const { toggleMode } = useMainContext();
return (
<Button onClick={() => toggleMode()} data-testid="switch-button" sx={{ p: 0, minWidth: 0 }}>
<Button onClick={() => toggleMode()} data-testid="switch-button">
<LightSwitchSVG />
</Button>
);
explorer/src/components/UptimeChart.tsx
+1 -1
View File
@@ -55,7 +55,7 @@ export const UptimeChart: React.FC<ChartProps> = ({ title, xLabel, yLabel, uptim
uptimeStory.data
? formattedChartData
: [
['Date', 'Uptime'],
['Date', 'Routing Score'],
[format(new Date(Date.now()), 'MMM dd'), 0],
]
}
explorer/src/context/main.tsx
+2 -9
View File
@@ -9,10 +9,9 @@ import {
MixnodeStatus,
SummaryOverviewResponse,
ValidatorsResponse,
Environment,
} from '../typeDefs/explorer-api';
import { EnumFilterKey } from '../typeDefs/filters';
import { Api, getEnvironment } from '../api';
import { Api } from '../api';
import { NavOptionType, originalNavOptions } from './nav';
interface StateData {
@@ -25,7 +24,6 @@ interface StateData {
mode: PaletteMode;
navState: NavOptionType[];
validators?: ApiState<ValidatorsResponse>;
environment?: Environment;
}
interface StateApi {
@@ -49,9 +47,6 @@ export const MainContext = React.createContext<State>({
export const useMainContext = (): React.ContextType<typeof MainContext> => React.useContext<State>(MainContext);
export const MainContextProvider: React.FC = ({ children }) => {
// network explorer environment
const [environment, setEnvironment] = React.useState<Environment>('mainnet');
// light/dark mode
const [mode, setMode] = React.useState<PaletteMode>('dark');
@@ -171,12 +166,10 @@ export const MainContextProvider: React.FC = ({ children }) => {
React.useEffect(() => {
Promise.all([fetchOverviewSummary(), fetchGateways(), fetchValidators(), fetchBlock(), fetchCountryData()]);
setEnvironment(getEnvironment());
}, []);
const state = React.useMemo<State>(
() => ({
environment,
block,
countryData,
fetchMixnodes,
@@ -191,7 +184,7 @@ export const MainContextProvider: React.FC = ({ children }) => {
updateNavState,
validators,
}),
[environment, block, countryData, gateways, globalError, mixnodes, mode, navState, summaryOverview, validators],
[block, countryData, gateways, globalError, mixnodes, mode, navState, summaryOverview, validators],
);
return <MainContext.Provider value={state}>{children}</MainContext.Provider>;
explorer/src/typeDefs/explorer-api.ts
-2
View File
@@ -224,5 +224,3 @@ export type MixNodeEconomicDynamicsStatsResponse = {
estimated_delegators_reward: number;
current_interval_uptime: number;
};
export type Environment = 'mainnet' | 'sandbox' | 'qa';