Only load GA when valid key is provided; closes #2678

This commit is contained in:
Dane Everitt 2020-11-08 13:18:15 -08:00
parent de943eac4a
commit 7cf6b4bcfe
No known key found for this signature in database
GPG key ID: EEA66103B3D71F53
5 changed files with 57 additions and 64 deletions

View file

@ -13,7 +13,7 @@ export interface Allocation {
export interface Server { export interface Server {
id: string; id: string;
internalId: number; internalId: number | string;
uuid: string; uuid: string;
name: string; name: string;
node: string; node: string;

View file

@ -1,7 +1,7 @@
import React, { useEffect } from 'react'; import React, { useEffect } from 'react';
import ReactGA from 'react-ga'; import ReactGA from 'react-ga';
import { hot } from 'react-hot-loader/root'; import { hot } from 'react-hot-loader/root';
import { BrowserRouter, Route, Switch } from 'react-router-dom'; import { BrowserRouter, Route, Switch, useLocation } from 'react-router-dom';
import { StoreProvider } from 'easy-peasy'; import { StoreProvider } from 'easy-peasy';
import { store } from '@/state'; import { store } from '@/state';
import DashboardRouter from '@/routers/DashboardRouter'; import DashboardRouter from '@/routers/DashboardRouter';
@ -30,6 +30,16 @@ interface ExtendedWindow extends Window {
}; };
} }
const Pageview = () => {
const { pathname } = useLocation();
useEffect(() => {
ReactGA.pageview(pathname);
}, [ pathname ]);
return null;
};
const App = () => { const App = () => {
const { PterodactylUser, SiteConfiguration } = (window as ExtendedWindow); const { PterodactylUser, SiteConfiguration } = (window as ExtendedWindow);
if (PterodactylUser && !store.getState().user.data) { if (PterodactylUser && !store.getState().user.data) {
@ -50,8 +60,9 @@ const App = () => {
} }
useEffect(() => { useEffect(() => {
ReactGA.initialize(SiteConfiguration!.analytics); if (SiteConfiguration?.analytics) {
ReactGA.pageview(location.pathname); ReactGA.initialize(SiteConfiguration!.analytics);
}
}, []); }, []);
return ( return (
@ -62,6 +73,7 @@ const App = () => {
<ProgressBar/> <ProgressBar/>
<div css={tw`mx-auto w-auto`}> <div css={tw`mx-auto w-auto`}>
<BrowserRouter basename={'/'} key={'root-router'}> <BrowserRouter basename={'/'} key={'root-router'}>
{SiteConfiguration?.analytics && <Pageview/>}
<Switch> <Switch>
<Route path="/server/:id" component={ServerRouter}/> <Route path="/server/:id" component={ServerRouter}/>
<Route path="/auth" component={AuthenticationRouter}/> <Route path="/auth" component={AuthenticationRouter}/>

View file

@ -1,5 +1,4 @@
import React, { useEffect } from 'react'; import React from 'react';
import ReactGA from 'react-ga';
import { Route, RouteComponentProps, Switch } from 'react-router-dom'; import { Route, RouteComponentProps, Switch } from 'react-router-dom';
import LoginContainer from '@/components/auth/LoginContainer'; import LoginContainer from '@/components/auth/LoginContainer';
import ForgotPasswordContainer from '@/components/auth/ForgotPasswordContainer'; import ForgotPasswordContainer from '@/components/auth/ForgotPasswordContainer';
@ -7,23 +6,17 @@ import ResetPasswordContainer from '@/components/auth/ResetPasswordContainer';
import LoginCheckpointContainer from '@/components/auth/LoginCheckpointContainer'; import LoginCheckpointContainer from '@/components/auth/LoginCheckpointContainer';
import NotFound from '@/components/screens/NotFound'; import NotFound from '@/components/screens/NotFound';
export default ({ location, history, match }: RouteComponentProps) => { export default ({ location, history, match }: RouteComponentProps) => (
useEffect(() => { <div className={'pt-8 xl:pt-32'}>
ReactGA.pageview(location.pathname); <Switch location={location}>
}, [ location.pathname ]); <Route path={`${match.path}/login`} component={LoginContainer} exact/>
<Route path={`${match.path}/login/checkpoint`} component={LoginCheckpointContainer}/>
return ( <Route path={`${match.path}/password`} component={ForgotPasswordContainer} exact/>
<div className={'pt-8 xl:pt-32'}> <Route path={`${match.path}/password/reset/:token`} component={ResetPasswordContainer}/>
<Switch location={location}> <Route path={`${match.path}/checkpoint`}/>
<Route path={`${match.path}/login`} component={LoginContainer} exact/> <Route path={'*'}>
<Route path={`${match.path}/login/checkpoint`} component={LoginCheckpointContainer}/> <NotFound onBack={() => history.push('/auth/login')}/>
<Route path={`${match.path}/password`} component={ForgotPasswordContainer} exact/> </Route>
<Route path={`${match.path}/password/reset/:token`} component={ResetPasswordContainer}/> </Switch>
<Route path={`${match.path}/checkpoint`} /> </div>
<Route path={'*'}> );
<NotFound onBack={() => history.push('/auth/login')} />
</Route>
</Switch>
</div>
);
};

View file

@ -1,5 +1,4 @@
import React, { useEffect } from 'react'; import React from 'react';
import ReactGA from 'react-ga';
import { NavLink, Route, RouteComponentProps, Switch } from 'react-router-dom'; import { NavLink, Route, RouteComponentProps, Switch } from 'react-router-dom';
import AccountOverviewContainer from '@/components/dashboard/AccountOverviewContainer'; import AccountOverviewContainer from '@/components/dashboard/AccountOverviewContainer';
import NavigationBar from '@/components/NavigationBar'; import NavigationBar from '@/components/NavigationBar';
@ -9,30 +8,24 @@ import NotFound from '@/components/screens/NotFound';
import TransitionRouter from '@/TransitionRouter'; import TransitionRouter from '@/TransitionRouter';
import SubNavigation from '@/components/elements/SubNavigation'; import SubNavigation from '@/components/elements/SubNavigation';
export default ({ location }: RouteComponentProps) => { export default ({ location }: RouteComponentProps) => (
useEffect(() => { <>
ReactGA.pageview(location.pathname); <NavigationBar/>
}, [ location.pathname ]); {location.pathname.startsWith('/account') &&
<SubNavigation>
return ( <div>
<> <NavLink to={'/account'} exact>Settings</NavLink>
<NavigationBar /> <NavLink to={'/account/api'}>API Credentials</NavLink>
{location.pathname.startsWith('/account') && </div>
<SubNavigation> </SubNavigation>
<div> }
<NavLink to={'/account'} exact>Settings</NavLink> <TransitionRouter>
<NavLink to={'/account/api'}>API Credentials</NavLink> <Switch location={location}>
</div> <Route path={'/'} component={DashboardContainer} exact/>
</SubNavigation> <Route path={'/account'} component={AccountOverviewContainer} exact/>
} <Route path={'/account/api'} component={AccountApiContainer} exact/>
<TransitionRouter> <Route path={'*'} component={NotFound}/>
<Switch location={location}> </Switch>
<Route path={'/'} component={DashboardContainer} exact /> </TransitionRouter>
<Route path={'/account'} component={AccountOverviewContainer} exact/> </>
<Route path={'/account/api'} component={AccountApiContainer} exact/> );
<Route path={'*'} component={NotFound} />
</Switch>
</TransitionRouter>
</>
);
};

View file

@ -1,5 +1,4 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import ReactGA from 'react-ga';
import { NavLink, Route, RouteComponentProps, Switch } from 'react-router-dom'; import { NavLink, Route, RouteComponentProps, Switch } from 'react-router-dom';
import NavigationBar from '@/components/NavigationBar'; import NavigationBar from '@/components/NavigationBar';
import ServerConsole from '@/components/server/ServerConsole'; import ServerConsole from '@/components/server/ServerConsole';
@ -40,9 +39,9 @@ const ServerRouter = ({ match, location }: RouteComponentProps<{ id: string }>)
const id = ServerContext.useStoreState(state => state.server.data?.id); const id = ServerContext.useStoreState(state => state.server.data?.id);
const uuid = ServerContext.useStoreState(state => state.server.data?.uuid); const uuid = ServerContext.useStoreState(state => state.server.data?.uuid);
const isInstalling = ServerContext.useStoreState(state => state.server.data?.isInstalling); const isInstalling = ServerContext.useStoreState(state => state.server.data?.isInstalling);
const serverId = ServerContext.useStoreState(state => state.server.data?.internalId);
const getServer = ServerContext.useStoreActions(actions => actions.server.getServer); const getServer = ServerContext.useStoreActions(actions => actions.server.getServer);
const clearServerState = ServerContext.useStoreActions(actions => actions.clearServerState); const clearServerState = ServerContext.useStoreActions(actions => actions.clearServerState);
const serverId = ServerContext.useStoreState(state => state.server.data?.internalId);
useEffect(() => () => { useEffect(() => () => {
clearServerState(); clearServerState();
@ -70,10 +69,6 @@ const ServerRouter = ({ match, location }: RouteComponentProps<{ id: string }>)
}; };
}, [ match.params.id ]); }, [ match.params.id ]);
useEffect(() => {
ReactGA.pageview(location.pathname);
}, [ location.pathname ]);
return ( return (
<React.Fragment key={'server-router'}> <React.Fragment key={'server-router'}>
<NavigationBar/> <NavigationBar/>
@ -113,9 +108,9 @@ const ServerRouter = ({ match, location }: RouteComponentProps<{ id: string }>)
<NavLink to={`${match.url}/settings`}>Settings</NavLink> <NavLink to={`${match.url}/settings`}>Settings</NavLink>
</Can> </Can>
{rootAdmin && {rootAdmin &&
<a href={'/admin/servers/view/' + serverId} rel="noreferrer" target={'_blank'}> <a href={'/admin/servers/view/' + serverId} rel="noreferrer" target={'_blank'}>
<FontAwesomeIcon icon={faExternalLinkAlt}/> <FontAwesomeIcon icon={faExternalLinkAlt}/>
</a> </a>
} }
</div> </div>
</SubNavigation> </SubNavigation>