From 5b1dc5683784432d72d529b37caaf181c988d79b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C3=A3o=20Geonizeli?= <joao.geonizeli@gmail.com>
Date: Mon, 13 Sep 2021 20:54:58 -0300
Subject: [PATCH] show pages to unauthenticated user

---
 app/javascript/src/Routes.tsx                 | 37 ++++++++-----------
 .../src/components/Navbar/Navbar.tsx          |  3 +-
 .../src/components/SideNav/SideNav.tsx        |  4 --
 .../src/pages/Dashboard/Dashboard.tsx         |  4 +-
 .../src/pages/Orders/Deposit/Deposit.tsx      |  4 ++
 .../src/pages/Orders/Exchange/Exchange.tsx    |  5 +++
 .../src/pages/Orders/Stake/Stake.tsx          |  4 ++
 7 files changed, 32 insertions(+), 29 deletions(-)

diff --git a/app/javascript/src/Routes.tsx b/app/javascript/src/Routes.tsx
index db22c21..9ca3819 100644
--- a/app/javascript/src/Routes.tsx
+++ b/app/javascript/src/Routes.tsx
@@ -2,36 +2,29 @@ import type { FC } from "react";
 import React from "react";
 import { Switch, Route } from "react-router-dom";
 
-import { useCurrentUser } from "./contexts/UserProvider";
 import { Dashbaord, Home, Orders, Wallet } from "./pages";
 
 export const Routes: FC = () => {
-  const { isAuthenticated } = useCurrentUser();
-
   return (
     <Switch>
       <Route exact path="/">
         <Home />
       </Route>
-      {isAuthenticated && (
-        <>
-          <Route exact path="/dashboard">
-            <Dashbaord />
-          </Route>
-          <Route exact path="/wallet">
-            <Wallet />
-          </Route>
-          <Route exact path="/orders/exchange">
-            <Orders.Exchange />
-          </Route>
-          <Route exact path="/orders/stake">
-            <Orders.Stake />
-          </Route>
-          <Route exact path="/orders/deposit">
-            <Orders.Deposit />
-          </Route>
-        </>
-      )}
+      <Route exact path="/dashboard">
+        <Dashbaord />
+      </Route>
+      <Route exact path="/wallet">
+        <Wallet />
+      </Route>
+      <Route exact path="/orders/exchange">
+        <Orders.Exchange />
+      </Route>
+      <Route exact path="/orders/stake">
+        <Orders.Stake />
+      </Route>
+      <Route exact path="/orders/deposit">
+        <Orders.Deposit />
+      </Route>
     </Switch>
   );
 };
diff --git a/app/javascript/src/components/Navbar/Navbar.tsx b/app/javascript/src/components/Navbar/Navbar.tsx
index fde8013..f0b87eb 100644
--- a/app/javascript/src/components/Navbar/Navbar.tsx
+++ b/app/javascript/src/components/Navbar/Navbar.tsx
@@ -25,8 +25,7 @@ export const Navbar = () => {
     <nav className="w-full h-16 flex bg-white shadow items-center px-4 space-x-2 z-50">
       <button
         className={cs(
-          "w-12 mr-2 md:w-10 h-12 md:h-10 xl:hidden fixed md:relative bottom-8 md:bottom-auto right-8 md:right-auto bg-white rounded-full p-3 md:p-0 shadow md:shadow-none",
-          isAuthenticated ? "" : "hidden"
+          "w-12 mr-2 md:w-10 h-12 md:h-10 xl:hidden fixed md:relative bottom-8 md:bottom-auto right-8 md:right-auto bg-white rounded-full p-3 md:p-0 shadow md:shadow-none"
         )}
         onClick={() => handleExpandSideNav()}
       >
diff --git a/app/javascript/src/components/SideNav/SideNav.tsx b/app/javascript/src/components/SideNav/SideNav.tsx
index ed99304..762c48f 100644
--- a/app/javascript/src/components/SideNav/SideNav.tsx
+++ b/app/javascript/src/components/SideNav/SideNav.tsx
@@ -4,7 +4,6 @@ import { Transition } from "@headlessui/react";
 import cs from "classnames";
 
 import { useApp } from "../../contexts/AppProvider";
-import { useCurrentUser } from "../../contexts/UserProvider";
 
 type MenuItem = {
   label: string;
@@ -39,7 +38,6 @@ const MenuItems: MenuItem[] = [
 ];
 
 export const SideNav = () => {
-  const { isAuthenticated } = useCurrentUser();
   const { sideNavExpanded, setSideNavExpanded } = useApp();
   const location = useLocation();
 
@@ -53,8 +51,6 @@ export const SideNav = () => {
     }
   };
 
-  if (!isAuthenticated) return null;
-
   return (
     <>
       <Transition
diff --git a/app/javascript/src/pages/Dashboard/Dashboard.tsx b/app/javascript/src/pages/Dashboard/Dashboard.tsx
index b7950f5..5311a83 100644
--- a/app/javascript/src/pages/Dashboard/Dashboard.tsx
+++ b/app/javascript/src/pages/Dashboard/Dashboard.tsx
@@ -9,7 +9,7 @@ import type { YieldwatchResponse } from "../../types/yieldwatch";
 import { VaultCard } from "./VaultCard";
 
 export const Dashbaord: FC = () => {
-  const { user } = useCurrentUser();
+  const { user, isAuthenticated } = useCurrentUser();
   const { data } = useSWR<YieldwatchResponse>(
     `https://www.yieldwatch.net/api/all/${user?.walletAddress}?platforms=pancake`
   );
@@ -17,6 +17,8 @@ export const Dashbaord: FC = () => {
   const isLoading = !data;
   const vaults = data?.result?.PancakeSwap?.staking?.vaults;
 
+  if (!isAuthenticated) return <Messages.Unauthenticated />;
+
   if (isLoading)
     return (
       <div className="w-full grid place-items-center">
diff --git a/app/javascript/src/pages/Orders/Deposit/Deposit.tsx b/app/javascript/src/pages/Orders/Deposit/Deposit.tsx
index 99f18f9..28baeed 100644
--- a/app/javascript/src/pages/Orders/Deposit/Deposit.tsx
+++ b/app/javascript/src/pages/Orders/Deposit/Deposit.tsx
@@ -9,8 +9,10 @@ import { History } from "./History";
 import { Create } from "./Create";
 import { DepositProvider, useDepositContext } from "./DepositProvider";
 import { Show } from "./Show";
+import { useCurrentUser } from "../../../contexts/UserProvider";
 
 const Component: FC = () => {
+  const { isAuthenticated } = useCurrentUser();
   const { fetchKey } = useDepositContext();
 
   const { depositOrders } = useLazyLoadQuery<DepositQuery>(
@@ -29,6 +31,8 @@ const Component: FC = () => {
     }
   );
 
+  if (!isAuthenticated) return <Messages.Unauthenticated />;
+
   if (!depositOrders.totalCount)
     return (
       <Messages.NoHistory historyName="depósito">
diff --git a/app/javascript/src/pages/Orders/Exchange/Exchange.tsx b/app/javascript/src/pages/Orders/Exchange/Exchange.tsx
index bd4e91b..beedf3e 100644
--- a/app/javascript/src/pages/Orders/Exchange/Exchange.tsx
+++ b/app/javascript/src/pages/Orders/Exchange/Exchange.tsx
@@ -6,8 +6,11 @@ import { useLazyLoadQuery } from "react-relay";
 import { ExchangePanel } from "./ExchangePanel";
 import { ExchangeHistory } from "./ExchangeHistory";
 import type { ExchangeQuery } from "./__generated__/ExchangeQuery.graphql";
+import { Messages } from "../../../messages";
+import { useCurrentUser } from "../../../contexts/UserProvider";
 
 export const Exchange = () => {
+  const { isAuthenticated } = useCurrentUser();
   const data = useLazyLoadQuery<ExchangeQuery>(
     graphql`
       query ExchangeQuery {
@@ -25,6 +28,8 @@ export const Exchange = () => {
     {}
   );
 
+  if (!isAuthenticated) return <Messages.Unauthenticated />;
+
   return (
     <div className="w-full">
       <ExchangePanel userRef={data.currentUser} />
diff --git a/app/javascript/src/pages/Orders/Stake/Stake.tsx b/app/javascript/src/pages/Orders/Stake/Stake.tsx
index 9a24b1a..94189b2 100644
--- a/app/javascript/src/pages/Orders/Stake/Stake.tsx
+++ b/app/javascript/src/pages/Orders/Stake/Stake.tsx
@@ -8,8 +8,10 @@ import { getStatusTextAndColors } from "../utils/processStatus";
 import type { StakeQuery } from "./__generated__/StakeQuery.graphql";
 import { Messages } from "../../../messages";
 import { Table, TableRow } from "../../../components";
+import { useCurrentUser } from "../../../contexts/UserProvider";
 
 export const Stake: FC = () => {
+  const { isAuthenticated } = useCurrentUser();
   const { stakeOrders } = useLazyLoadQuery<StakeQuery>(
     graphql`
       query StakeQuery {
@@ -29,6 +31,8 @@ export const Stake: FC = () => {
     {}
   );
 
+  if (!isAuthenticated) return <Messages.Unauthenticated />;
+
   if (!stakeOrders.edges.length)
     return <Messages.NoHistory historyName="Stake" />;