diff --git a/gatsby-browser.js b/gatsby-browser.js
index e6126d3..04e85ae 100644
--- a/gatsby-browser.js
+++ b/gatsby-browser.js
@@ -4,9 +4,11 @@ import React from 'react';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { ToastContainer } from 'react-toastify';
import AuthContextProvider from './src/utils/Auth';
+import { Layout } from './src/components';
const queryClient = new QueryClient();
+// Get fonts on initial load of the app
export const onRenderBody = ({ setHeadComponents }) => {
// @import url('fonts/Roslindale/font.css');
setHeadComponents([
@@ -61,6 +63,11 @@ export const onRenderBody = ({ setHeadComponents }) => {
]);
};
+export const wrapPageElement = ({ element, props }) => (
+ // eslint-disable-next-line react/jsx-props-no-spreading
+ {element}
+);
+
export const wrapRootElement = ({ element }) => (
{element}
diff --git a/gatsby-ssr.js b/gatsby-ssr.js
index e6126d3..608c0f5 100644
--- a/gatsby-ssr.js
+++ b/gatsby-ssr.js
@@ -4,6 +4,7 @@ import React from 'react';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { ToastContainer } from 'react-toastify';
import AuthContextProvider from './src/utils/Auth';
+import { Layout } from './src/components';
const queryClient = new QueryClient();
@@ -61,6 +62,11 @@ export const onRenderBody = ({ setHeadComponents }) => {
]);
};
+export const wrapPageElement = ({ element, props }) => (
+ // eslint-disable-next-line react/jsx-props-no-spreading
+ {element}
+);
+
export const wrapRootElement = ({ element }) => (
{element}
diff --git a/src/components/marginals/Navbar/DesktopNav.jsx b/src/components/marginals/Navbar/DesktopNav.jsx
index a5047da..55acb23 100644
--- a/src/components/marginals/Navbar/DesktopNav.jsx
+++ b/src/components/marginals/Navbar/DesktopNav.jsx
@@ -32,7 +32,7 @@ function DesktopNav() {
const menuContext = useContext(MenuContext);
const { toggleMenuOpen, menuOpen } = menuContext;
const authContext = useContext(AuthContext);
- const { authenticated } = authContext;
+ const { authenticated, login, logout } = authContext;
return (
@@ -64,7 +64,11 @@ function DesktopNav() {
-
+
diff --git a/src/components/marginals/Navbar/MobileNav.jsx b/src/components/marginals/Navbar/MobileNav.jsx
index 0de595e..784b2c5 100644
--- a/src/components/marginals/Navbar/MobileNav.jsx
+++ b/src/components/marginals/Navbar/MobileNav.jsx
@@ -1,7 +1,7 @@
import React, { useContext } from 'react';
// Libraries
-import { Link } from 'gatsby';
+import { Link, navigate } from 'gatsby';
// Components
import { MenuContext } from './MenuContext';
@@ -29,6 +29,13 @@ const handleScroll = (id) => {
const scroll = newScrollObject();
const anchor = document.getElementById(id);
scroll.animateScroll(anchor);
+ } else {
+ navigate('/');
+ setTimeout(() => {
+ const scroll = newScrollObject();
+ const anchor = document.getElementById(id);
+ scroll.animateScroll(anchor);
+ }, 1000);
}
}
};
@@ -37,7 +44,7 @@ function MobileNav() {
const menuContext = useContext(MenuContext);
const { toggleMenuOpen } = menuContext;
const authContext = useContext(AuthContext);
- const { authenticated } = authContext;
+ const { authenticated, login, logout } = authContext;
const onMenuClick = (id) => {
handleScroll(id);
@@ -64,7 +71,11 @@ function MobileNav() {
))}
-
+
);
diff --git a/src/components/shared/index.js b/src/components/shared/index.js
index a1142c1..840d248 100644
--- a/src/components/shared/index.js
+++ b/src/components/shared/index.js
@@ -13,3 +13,4 @@ export { default as ModalBox } from './ModalBox';
export { default as About } from './About';
export { default as Layout } from './Layout';
export { default as Input } from './partials/Input';
+export { default as PrivateRoute } from './partials/PrivateRoute';
diff --git a/src/components/shared/partials/PrivateRoute/index.jsx b/src/components/shared/partials/PrivateRoute/index.jsx
new file mode 100644
index 0000000..fcb8422
--- /dev/null
+++ b/src/components/shared/partials/PrivateRoute/index.jsx
@@ -0,0 +1,23 @@
+import { navigate } from 'gatsby';
+import React, { useContext } from 'react';
+import { toast } from 'react-toastify';
+import { AuthContext } from '../../../../utils/Auth';
+
+const PrivateRoute = ({ children }) => {
+ const { authenticated, loading } = useContext(AuthContext);
+
+ if (loading) {
+ // TODO: Add loading spinner
+ return Loading...
;
+ }
+
+ if (!authenticated) {
+ toast.error('You are not authenticated. Please login to access this page.');
+ navigate('/');
+ return null;
+ }
+
+ return children;
+};
+
+export default PrivateRoute;
diff --git a/src/pages/404.js b/src/pages/404.js
index b8d5c2e..a4a5d99 100644
--- a/src/pages/404.js
+++ b/src/pages/404.js
@@ -1,6 +1,6 @@
import React from 'react';
import { Helmet } from 'react-helmet';
-import { Layout, PageNotFoundCard } from '../components';
+import { PageNotFoundCard } from '../components';
export default function Error404() {
return (
@@ -10,9 +10,7 @@ export default function Error404() {
Page not found
-
-
-
+
>
);
}
diff --git a/src/pages/index.js b/src/pages/index.js
index ad3e6d2..de415f6 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -1,7 +1,6 @@
/* eslint-disable react/jsx-props-no-spreading */
import React from 'react';
import { Helmet } from 'react-helmet';
-import { Layout } from '../components';
export default function Home() {
return (
@@ -11,7 +10,7 @@ export default function Home() {
Innovision | Home
- Hello Innovision 2023
+ Hello Innovision 2023
>
);
}
diff --git a/src/pages/payment.js b/src/pages/payment.js
index 95b283a..75f3da9 100644
--- a/src/pages/payment.js
+++ b/src/pages/payment.js
@@ -1,16 +1,16 @@
import React from 'react';
-import { Heading1, Layout } from '../components';
+import { Heading1, PrivateRoute } from '../components';
const PaymentPage = () => {
// eslint-disable-next-line no-console
- console.log('Payment page');
+ console.log('PaymentPage');
return (
-
+
Payment
{/* Payment form here */}
TODO - Payment form
-
+
);
};
diff --git a/src/pages/playground.js b/src/pages/playground.js
index 8e847f4..f7e6230 100644
--- a/src/pages/playground.js
+++ b/src/pages/playground.js
@@ -2,7 +2,6 @@
import React from 'react';
import { Helmet } from 'react-helmet';
-import { Layout } from '../components';
import FAQSection from '../components/FAQSection/FAQSection';
const Playground = () => (
@@ -12,10 +11,7 @@ const Playground = () => (
Playground
-
-
-
-
+
>
);
diff --git a/src/pages/pricing.js b/src/pages/pricing.js
index c274e87..645ed95 100644
--- a/src/pages/pricing.js
+++ b/src/pages/pricing.js
@@ -2,7 +2,7 @@
import React from 'react';
import styled from 'styled-components';
import tw from 'twin.macro';
-import { Container, Heading3, Body2, Layout } from '../components';
+import { Container, Heading3, Body2 } from '../components';
const Title = styled(Heading3)`
${tw`my-4`}
@@ -17,14 +17,12 @@ const RefundContainer = styled.div`
`;
const privacy = () => (
-
-
-
- Pricing
- The Registration fee for Innovision 2k23 is ₹700. Free for NITR Students
-
-
-
+
+
+ Pricing
+ The Registration fee for Innovision 2k23 is ₹700. Free for NITR Students
+
+
);
export default privacy;
diff --git a/src/pages/register.js b/src/pages/register.js
index 9a74ba1..d1150db 100644
--- a/src/pages/register.js
+++ b/src/pages/register.js
@@ -1,16 +1,16 @@
import React from 'react';
-import { Heading1, Layout } from '../components';
+import { Heading1 } from '../components';
const RegistrationPage = () => {
// eslint-disable-next-line no-console
console.log('Registration page');
return (
-
+ <>
Registration
{/* Registration form here */}
TODO - Registration form
-
+ >
);
};
diff --git a/src/pages/txn-successful.js b/src/pages/txn-successful.js
index e59a817..509bda5 100644
--- a/src/pages/txn-successful.js
+++ b/src/pages/txn-successful.js
@@ -1,6 +1,6 @@
import React from 'react';
import { Helmet } from 'react-helmet';
-import { Layout, SuccessCard } from '../components';
+import { SuccessCard } from '../components';
export default function Successful() {
return (
@@ -10,9 +10,7 @@ export default function Successful() {
Innovision | Success
-
-
-
+
>
);
}
diff --git a/src/utils/Auth.jsx b/src/utils/Auth.jsx
index 9ee0fbe..2db48f4 100644
--- a/src/utils/Auth.jsx
+++ b/src/utils/Auth.jsx
@@ -3,7 +3,6 @@
import React, { createContext, useEffect, useMemo, useState } from 'react';
import { GoogleAuthProvider, onAuthStateChanged, signInWithPopup } from 'firebase/auth';
-import { navigate } from 'gatsby';
import { toast } from 'react-toastify';
import { auth } from '../config/firebase';
import Api from './Api';
@@ -48,7 +47,6 @@ const AuthContextProvider = ({ children }) => {
setAuthenticated(false);
setUserData({});
setToken('');
- navigate('/');
}
setLoading(false);
});
@@ -91,7 +89,6 @@ const AuthContextProvider = ({ children }) => {
try {
auth.signOut();
setAuthenticated(false);
- navigate('/');
toast.success('Logged out successfully');
} catch (error) {
toast.error(error.message ?? 'Unable to logout');