conflicts resolve

web3 · Aug 3, 2023 · d9ae830 · d9ae830
2 parents b0d1fd7 + 1a2213f
commit d9ae830
Show file tree

Hide file tree

Showing 27 changed files with 459 additions and 877 deletions.
diff --git a/README.md b/README.md
@@ -9,4 +9,4 @@ This project is built on create-react-app so to run the development version:
 - install dependencies with `yarn`
 - run `yarn run start` and the website should open in your default browser
 
-For any questions, reach out on [Discord](http://discord.gg/n2U6x9c)
+For any questions, reach out on [Discord](https://discord.gg/yhHVtK5Wqt)
diff --git a/src/Components/Modules/Footer.tsx b/src/Components/Modules/Footer.tsx
@@ -2,6 +2,7 @@ import React from "react"
 import { createStyles, ITheme, makeStyles } from "@chainsafe/common-theme"
 import { Grid, Typography } from "@chainsafe/common-components"
 import {Trans} from "@lingui/macro";
+import { blogUrl, discordUrl, docsUrl } from "../../urls";
 
 const useStyles = makeStyles(({ palette, constants, breakpoints }: ITheme) => {
   return createStyles({
@@ -100,7 +101,7 @@ const Footer: React.FC = () => {
             </Grid>
             <Grid item className={classes.item}>
               <a
-                href="https://web3js.readthedocs.io/en/latest/"
+                href={docsUrl}
                 rel="noopener noreferrer"
                 target="_blank"
               >
@@ -129,7 +130,7 @@ const Footer: React.FC = () => {
             </Grid>
             <Grid item className={classes.item}>
               <a
-                href="http://discord.gg/n2U6x9c"
+                href={discordUrl}
                 rel="noopener noreferrer"
                 target="_blank"
               >
@@ -140,7 +141,7 @@ const Footer: React.FC = () => {
           </Grid>
           <Grid item className={classes.item}>
             <a
-              href="https://blog.chainsafe.io/tagged/ethereum"
+              href={blogUrl}
               target="_blank"
               rel="noopener noreferrer"
             >

diff --git a/src/Components/Modules/InternalNav.tsx b/src/Components/Modules/InternalNav.tsx
diff --git a/src/Components/Modules/MobileMenu.tsx b/src/Components/Modules/MobileMenu.tsx
@@ -2,6 +2,7 @@ import * as React from 'react';
 import { motion } from 'framer-motion';
 import { MobileMenuItem } from './MobileMenuItem';
 import { createStyles, ITheme, makeStyles } from '@chainsafe/common-theme';
+import { discordUrl, docsUrl } from '../../urls';
 
 const variants = {
   open: {
@@ -19,33 +20,29 @@ export interface NavLink {
 }
 
 const navlinks: NavLink[] = [
+
   {
     id: 1,
-    name: 'Plugins',
-    linkUrl: '/plugins',
+    name: 'Docs',
+    linkUrl: docsUrl,
   },
   {
     id: 2,
-    name: '1.x Docs',
-    linkUrl: 'https://web3js.readthedocs.io/en/v1.7.5/',
+    name: 'Plugins',
+    linkUrl: '/plugins',
   },
   {
     id: 3,
-    name: '4.x Docs',
-    linkUrl: 'https://docs.web3js.org/',
-  },
-  {
-    id: 4,
     name: 'Join Discord',
-    linkUrl: 'http://discord.gg/n2U6x9c',
+    linkUrl: discordUrl,
   },
   {
-    id: 5,
+    id: 4,
     name: 'Blog',
     linkUrl: 'https://medium.com/chainsafe-systems',
   },
   {
-    id: 6,
+    id: 5,
     name: 'GitHub',
     linkUrl: 'https://github.com/chainsafe/web3.js',
   },

diff --git a/src/Components/Modules/MobileNav2.tsx b/src/Components/Modules/MobileNav2.tsx
@@ -6,6 +6,7 @@ import "./styles.css";
 import {
   createStyles, ITheme, makeStyles
 } from "@chainsafe/common-theme";
+import { discordUrl, docsUrl } from "../../urls";
 
 const sidebar = {
   open: (height = 1000) => ({
@@ -73,22 +74,22 @@ const navlinks: NavLink[] = [
   {
     id: 1,
     name: "Docs",
-    linkUrl: "https://web3js.readthedocs.io/en/v1.5.2/"
+    linkUrl: docsUrl
   },
   {
-    id: 3,
+    id: 2,
     name: "Join Discord",
-    linkUrl: "http://discord.gg/n2U6x9c"
+    linkUrl: discordUrl
   },
   {
-    id: 4,
+    id: 3,
     name: "Blog",
     linkUrl: "https://medium.com/chainsafe-systems"
   },
   {
-    id: 5,
+    id: 4,
     name: "GitHub",
-    linkUrl: "https://github.com/chainsafe/web3.js"
+    linkUrl: "https://github.com/web3/web3.js"
   },
 ]
 

diff --git a/src/Components/Modules/NavBar.tsx b/src/Components/Modules/NavBar.tsx
@@ -6,6 +6,7 @@ import { Grid, Link, Typography, useScrollToTop } from "@chainsafe/common-compon
 import { Trans } from "@lingui/macro"
 import { MobileNav } from "./MobileNav";
 import web3js from "../../assets/images/web3js.png"
+import { discordUrl, docsUrl } from "../../urls";
 
 const useStyles = makeStyles(({ breakpoints, palette, zIndex, constants }: ITheme) => {
   return createStyles({
@@ -89,117 +90,99 @@ const NavBar: React.FC = () => {
 
   const isMobile = useMediaQuery("(max-width: 1170px)");
 
-  // const toggleNav = () => {
-  //   setIsNavVisible(!isNavVisible);
-  // }
 
   const scrollToTop = useScrollToTop();
 
+  if (isMobile && !isNavVisible)
+    return (
+      <nav>
+        {scrollToTop}
+        <Grid
+          container
+          justifyContent='flex-start'
+          alignItems='center'
+          className={classes.linksMenu}>
+          <Grid item>
+            <div style={{ display: 'flex', alignItems: 'center' }}>
+              <img className={classes.logo} src={web3js} alt='web3js logo' />
+              <Typography variant='h5'>
+                <a href='/' className={classes.navlink}>
+                  Web3.js
+                </a>
+              </Typography>
+            </div>
+          </Grid>
+          <Grid item alignItems='flex-end'>
+            <MobileNav />
+          </Grid>
+        </Grid>
+      </nav>
+    );
+
   return (
-    <nav className={classes.container}>
-      {scrollToTop}
-      {!isMobile &&
-        <Grid item alignItems="center" className={classes.linksMenu}>
-          <Grid container justifyContent="flex-start" alignItems="center">
-            <Grid item alignItems="flex-start">
+    <>
+      <nav className={classes.container}>
+        {scrollToTop}
+        <Grid item alignItems='center' className={classes.linksMenu}>
+          <Grid container justifyContent='flex-start' alignItems='center'>
+            <Grid item alignItems='flex-start'>
               <div className={classes.flex}>
-                <a href="/" className={classes.navlink}>
-                  <img
-                    className={classes.logo}
-                    src={web3js}
-                    alt="web3js logo"
-                  />
-                </a>
-                <Typography variant="h5">
-                  <a href="/" className={classes.navlink}>
+                <img className={classes.logo} src={web3js} alt='web3js logo' />
+                <Typography variant='h5'>
+                  <Link to='/' className={classes.navlink}>
                     Web3.js
-                  </a>
+                  </Link>
                 </Typography>
               </div>
             </Grid>
-            <Typography variant="h5">
-              <a
-                href="/plugins"
-                className={classes.navlink}
-              >
-                <Trans>Plugins</Trans>
-              </a>
-            </Typography>
-            <Typography variant="h5">
+            <Typography variant='h5'>
               <a
-                target="_blank"
-                rel="noopener noreferrer"
-                href="https://web3js.readthedocs.io/en/v1.7.5/"
-                className={classes.navlink}
-              >
-                <Trans>1.x Docs</Trans>
+                target='_blank'
+                rel='noopener noreferrer'
+                href={docsUrl}
+                className={classes.navlink}>
+                <Trans>Docs</Trans>
               </a>
             </Typography>
             <Typography variant="h5">
               <a
-                target="_blank"
-                rel="noopener noreferrer"
-                href="https://docs.web3js.org/"
+                href="/plugins"
                 className={classes.navlink}
               >
-                <Trans>4.x Docs</Trans>
+                <Trans>Plugins</Trans>
               </a>
             </Typography>
-            <Typography variant="h5">
+            <Typography variant='h5'>
               <a
-                target="_blank"
-                rel="noopener noreferrer"
-                href="http://discord.gg/n2U6x9c"
-                className={classes.navlink}
-              >
+                target='_blank'
+                rel='noopener noreferrer'
+                href={discordUrl}
+                className={classes.navlink}>
                 <Trans>Community</Trans>
               </a>
             </Typography>
-            <Typography variant="h5">
+            <Typography variant='h5'>
               <a
-                target="_blank"
-                rel="noopener noreferrer"
-                href="https://medium.com/chainsafe-systems/tagged/ethereum"
-                className={classes.navlink}
-              >
+                target='_blank'
+                rel='noopener noreferrer'
+                href='https://medium.com/chainsafe-systems/tagged/ethereum'
+                className={classes.navlink}>
                 <Trans>Blog</Trans>
               </a>
             </Typography>
-            <Typography variant="h5">
+            <Typography variant='h5'>
               <a
-                target="_blank"
-                rel="noopener noreferrer"
-                href="https://github.com/chainsafe/web3.js"
-                className={classes.navlink}
-              >
+                target='_blank'
+                rel='noopener noreferrer'
+                href='https://github.com/web3/web3.js'
+                className={classes.navlink}>
                 <Trans>GitHub</Trans>
               </a>
             </Typography>
           </Grid>
-        </Grid>}
-      {(isMobile && !isNavVisible) && (
-        <Grid container justifyContent="flex-start" alignItems="center" className={classes.linksMenu}>
-          <Grid item >
-            <div style={{ display: "flex", alignItems: "center" }}>
-              <img
-                className={classes.logo}
-                src={web3js}
-                alt="web3js logo"
-              />
-              <Typography variant="h5">
-                <a href="/" className={classes.navlink}>
-                  Web3.js
-                </a>
-              </Typography>
-            </div>
-          </Grid>
-          <Grid item alignItems="flex-end">
-            <MobileNav />
-          </Grid>
         </Grid>
-      )}
-
-    </nav >
+      </nav>
+    </>
   );
 };