diff --git a/lattice/src/App.tsx b/lattice/src/App.tsx
index 533976608..6d21e662b 100644
--- a/lattice/src/App.tsx
+++ b/lattice/src/App.tsx
@@ -1,11 +1,11 @@
-import { BrowserRouter, Route, Switch } from 'react-router-dom';
-import { MuiThemeProvider } from '@material-ui/core/styles';
+import { BrowserRouter, Route, Switch } from "react-router-dom";
+import { MuiThemeProvider } from "@material-ui/core/styles";
-import Main from 'Main';
-import Login from 'App/AuthFlow/Login';
-import { useAuth } from 'services/useAuth';
-import PrivateRoute from 'shared/PrivateRoute/PrivateRoute';
-import { lightTheme } from 'theme/';
+import Main from "Main";
+import Signin from "App/AuthFlow/Signin";
+import { useAuth } from "services/useAuth";
+import PrivateRoute from "shared/PrivateRoute/PrivateRoute";
+import { lightTheme } from "theme/";
const App = () => {
const auth = useAuth();
@@ -17,15 +17,17 @@ const App = () => {
) : (
{auth.isAuthOn ? (
+ // Auth is on, hide the routes with PrivateRoute
}
+ render={(props) => }
/>
) : (
+ // Auth is off, all routes are accessible
)}
diff --git a/lattice/src/App/AuthFlow/SignOutButton.tsx b/lattice/src/App/AuthFlow/SignOutButton.tsx
index e28170589..5dd75b804 100644
--- a/lattice/src/App/AuthFlow/SignOutButton.tsx
+++ b/lattice/src/App/AuthFlow/SignOutButton.tsx
@@ -1,17 +1,19 @@
-import React from 'react';
-import { Button } from '@material-ui/core';
+import React from "react";
+import { Button } from "@material-ui/core";
interface Props {
children?: React.ReactNode;
}
const SignOutButton: React.FC = ({ children }) => {
+ const signoutOnClick = (e) => {
+ window.location.href = "/logout";
+ };
+
return (
-
-
);
};
diff --git a/lattice/src/App/AuthFlow/Login.tsx b/lattice/src/App/AuthFlow/Signin.tsx
similarity index 93%
rename from lattice/src/App/AuthFlow/Login.tsx
rename to lattice/src/App/AuthFlow/Signin.tsx
index f19399ee5..d6ef3c457 100644
--- a/lattice/src/App/AuthFlow/Login.tsx
+++ b/lattice/src/App/AuthFlow/Signin.tsx
@@ -6,7 +6,7 @@ import { ReactComponent as MLogo } from 'assets/m-bug-alt.svg';
import css from './AuthFlow.module.scss';
import SignInButton from './SignInButton';
-function Login(props) {
+function Signin(props) {
const renderLoginForm = () => (
);
}
-export default Login;
+export default Signin;
diff --git a/lattice/src/App/AuthFlow/index.ts b/lattice/src/App/AuthFlow/index.ts
index f1d32a23a..364a48925 100644
--- a/lattice/src/App/AuthFlow/index.ts
+++ b/lattice/src/App/AuthFlow/index.ts
@@ -1 +1 @@
-export * from './Login';
\ No newline at end of file
+export * from './Signin';
\ No newline at end of file
diff --git a/lattice/src/Main.tsx b/lattice/src/Main.tsx
index bfa1946ee..b305bbaed 100644
--- a/lattice/src/Main.tsx
+++ b/lattice/src/Main.tsx
@@ -44,16 +44,9 @@ const Main = () => {
-
+
-
+
diff --git a/lattice/src/services/useAuth.tsx b/lattice/src/services/useAuth.tsx
index 790835fbc..fd0f4ece1 100644
--- a/lattice/src/services/useAuth.tsx
+++ b/lattice/src/services/useAuth.tsx
@@ -1,5 +1,4 @@
import React, { createContext, useContext, useEffect, useState } from 'react';
-import { useHistory } from 'react-router-dom';
import { pilosa } from './eventServices';
@@ -25,7 +24,6 @@ export interface IUser {
// Provider hook that creates auth object and handles state
function useProvideAuth() {
- const history = useHistory();
const [user, setUser] = useState(undefined);
const [isAuthenticated, setIsAuthenticated] = useState(false);
const [isLoading, setIsLoading] = useState(true);
@@ -41,13 +39,6 @@ function useProvideAuth() {
});
};
- const signin = () => {
- history.push(`/login`);
- };
-
- const signout = () => {
- history.push("/logout");
- };
// Subscribe to user on mount
// Because this sets state in the callback it will cause any ...
// ... component that utilizes this hook to re-render with the ...
@@ -86,7 +77,5 @@ function useProvideAuth() {
isAuthOn,
user,
userinfo,
- signin,
- signout,
};
}
diff --git a/lattice/src/shared/PrivateRoute/PrivateRoute.tsx b/lattice/src/shared/PrivateRoute/PrivateRoute.tsx
index 16fe98247..e33bc9866 100644
--- a/lattice/src/shared/PrivateRoute/PrivateRoute.tsx
+++ b/lattice/src/shared/PrivateRoute/PrivateRoute.tsx
@@ -8,12 +8,11 @@ function PrivateRoute({ component: Component, ...rest }) {
{
- // If the user is authed render the component
if (auth.isAuthenticated) {
- // if (true) {
+ // If the user is authenticated, render the component
return ;
} else {
- // If they are not then we need to redirect to a public page
+ // If the user is not authenticated, redirect to sign in page
return (