add redirect to resources route

BattleZips · Oct 9, 2022 · ef3892a · ef3892a
1 parent 890ba21
commit ef3892a
Show file tree

Hide file tree

Showing 4 changed files with 48 additions and 13 deletions.
diff --git a/src/Locations.ts b/src/Locations.ts
@@ -3,4 +3,5 @@ export const ActiveGameLocation = (id: string) => `/game/${id}`;
 export const JoinGameLocationTemplate = '/join-game/:id';
 export const JoinGameLocation = (id: string) => `/join-game/${id}`;
 export const NewGameLocation = '/new-game';
+export const ResourcesLocation = '/resources';
 export const RootLocation = '/';
diff --git a/src/Routes.tsx b/src/Routes.tsx
@@ -3,12 +3,14 @@ import {
   ActiveGameLocationTemplate,
   JoinGameLocationTemplate,
   NewGameLocation,
+  ResourcesLocation,
   RootLocation
 } from 'Locations';
 import { Navigate, useRoutes } from 'react-router-dom';
 import BuildBoard from 'views/BuildBoardView';
 import Game from 'views/Game';
 import Home from 'views/Home';
+import Resources from 'views/Resources';
 
 const routeList = (isConnected: boolean) => [
   {
@@ -26,6 +28,10 @@ const routeList = (isConnected: boolean) => [
   {
     path: NewGameLocation,
     element: isConnected ? <BuildBoard /> : <Navigate to={RootLocation} />
+  },
+  {
+    path: ResourcesLocation,
+    element: <Resources />
   }
 ];
 

diff --git a/src/components/Header/index.tsx b/src/components/Header/index.tsx
@@ -18,6 +18,11 @@ const useStyles = createUseStyles({
     width: 'calc(100% - 108px)',
     zIndex: 10
   },
+  docs: {
+    cursor: 'pointer',
+    fontSize: '16px',
+    fontWeight: 600
+  },
   left: {
     alignItems: 'center',
     display: 'flex',
@@ -45,6 +50,11 @@ const useStyles = createUseStyles({
     letterSpacing: '5.4px',
     lineHieght: '52px'
   },
+  right: {
+    alignItems: 'center',
+    display: 'flex',
+    gap: '16px'
+  },
   separator: {
     background: '#D1D2DE',
     height: '44px',
@@ -69,19 +79,29 @@ export default function Header(): JSX.Element {
         <div className={styles.separator} />
         <div className={styles.logoText}>BATTLEZIPS</div>
       </div>
-      <div
-        className={styles.loginButton}
-        onClick={() =>
-          !isConnecting && (!isConnected ? connectWallet() : disconnect())
-        }
-      >
-        {address && <Avatar address={address} />}
-        <div>
-          {isConnected
-            ? formatAddress(address, ensName)
-            : isConnecting
-            ? 'Connecting...'
-            : 'Connect'}
+      <div className={styles.right}>
+        <div
+          className={styles.docs}
+          onClick={() =>
+            window.open('https://battlezips.gitbook.io/battlezips')
+          }
+        >
+          Docs
+        </div>
+        <div
+          className={styles.loginButton}
+          onClick={() =>
+            !isConnecting && (!isConnected ? connectWallet() : disconnect())
+          }
+        >
+          {address && <Avatar address={address} />}
+          <div>
+            {isConnected
+              ? formatAddress(address, ensName)
+              : isConnecting
+              ? 'Connecting...'
+              : 'Connect'}
+          </div>
         </div>
       </div>
     </div>

diff --git a/src/views/Resources/index.tsx b/src/views/Resources/index.tsx
@@ -0,0 +1,8 @@
+import { useEffect } from 'react';
+
+export default function Resources() {
+  useEffect(() => {
+    window.location.href = 'https://battlezips.gitbook.io/battlezips';
+  }, []);
+  return <></>;
+}