Add route for revoked view

2 files changed, 5 insertions, 13 deletions

diff --git a/gui/src/renderer/components/AppRouter.tsx b/gui/src/renderer/components/AppRouter.tsx
index 28988ea566..46b322785a 100644
--- a/gui/src/renderer/components/AppRouter.tsx
+++ b/gui/src/renderer/components/AppRouter.tsx
@@ -27,6 +27,7 @@ import {
 import { RoutePath } from '../lib/routes';
 import FilterByProvider from './FilterByProvider';
 import TooManyDevices from './TooManyDevices';
+import { DeviceRevokedView } from './DeviceRevokedView';
 
 interface IAppRoutesState {
   currentLocation: IHistoryProps['history']['location'];
@@ -78,6 +79,7 @@ class AppRouter extends React.Component<IHistoryProps, IAppRoutesState> {
                 <Route exact path={RoutePath.launch} component={Launch} />
                 <Route exact path={RoutePath.login} component={LoginPage} />
                 <Route exact path={RoutePath.tooManyDevices} component={TooManyDevices} />
+                <Route exact path={RoutePath.deviceRevoked} component={DeviceRevokedView} />
                 <Route exact path={RoutePath.main} component={MainView} />
                 <Route exact path={RoutePath.redeemVoucher} component={VoucherInput} />
                 <Route
diff --git a/gui/src/renderer/components/MainView.tsx b/gui/src/renderer/components/MainView.tsx
index 9ced798cf9..56878fb521 100644
--- a/gui/src/renderer/components/MainView.tsx
+++ b/gui/src/renderer/components/MainView.tsx
@@ -5,7 +5,6 @@ import ConnectPage from '../containers/ConnectPage';
 import ExpiredAccountErrorViewContainer from '../containers/ExpiredAccountErrorViewContainer';
 import { useHistory } from '../lib/history';
 import { RoutePath } from '../lib/routes';
-import { DeviceRevokedView } from './DeviceRevokedView';
 
 export default function MainView() {
   const history = useHistory();
@@ -14,29 +13,20 @@ export default function MainView() {
   const isNewAccount = useSelector(
     (state) => state.account.status.type === 'ok' && state.account.status.method === 'new_account',
   );
-  const showDeviceRevoked = useSelector(
-    (state) =>
-      (state.connection.status.state === 'error' &&
-        state.connection.status.details.cause.reason === 'tunnel_parameter_error' &&
-        state.connection.status.details.cause.details === 'no_wireguard_key') ||
-      (state.account.status.type === 'none' && state.account.status.deviceRevoked),
-  );
 
   const [showAccountExpired, setShowAccountExpired] = useState<boolean>(
-    (isNewAccount || accountHasExpired) && !showDeviceRevoked,
+    isNewAccount || accountHasExpired,
   );
 
   useEffect(() => {
-    if (accountHasExpired && !showDeviceRevoked) {
+    if (accountHasExpired) {
       setShowAccountExpired(true);
     } else if (showAccountExpired && !accountHasExpired) {
       history.push(RoutePath.timeAdded);
     }
   }, [showAccountExpired, accountHasExpired]);
 
-  if (showDeviceRevoked) {
-    return <DeviceRevokedView />;
-  } else if (showAccountExpired) {
+  if (showAccountExpired) {
     return <ExpiredAccountErrorViewContainer />;
   } else {
     return <ConnectPage />;