diff --git a/src/components/App/index.jsx b/src/components/App/index.jsx index f1a9806..e914bae 100644 --- a/src/components/App/index.jsx +++ b/src/components/App/index.jsx @@ -1,35 +1,12 @@ -import React, { Suspense } from 'react'; -import { - BrowserRouter, - Switch, - Route -} from 'react-router-dom'; +import React from 'react'; import { UserProvider } from '../Contexts/UserContext'; -import { ProtectedRoute } from '../Routes/ProtectedRoute'; -import { MessageBar } from '../MessageBar'; - -const SignInForm = React.lazy(() => import('../SignInForm')); -const SignUpForm = React.lazy(() => import('../SignUpForm')); -const FileUploadForm = React.lazy(() => import('../FileUploadForm')); +import SiteRoutes from '../Routes/SiteRoutes'; function App() { return ( - - - - - - - - - - - - } /> - - - - + + + ); } diff --git a/src/components/Routes/AuthRoute.jsx b/src/components/Routes/AuthRoute.jsx new file mode 100644 index 0000000..7775630 --- /dev/null +++ b/src/components/Routes/AuthRoute.jsx @@ -0,0 +1,18 @@ +import React from 'react'; +import { Redirect, Route } from 'react-router-dom'; + +export const TYPES = { + PUBLIC: 0, + GUEST: 1, + PROTECTED: 2, +}; + +export const AuthRoute = ({ token, type, ...others }) => { + if (!token && type === TYPES.PROTECTED) { + return ; + } + else if (token && type === TYPES.GUEST) { + return ; + } + return ; +} \ No newline at end of file diff --git a/src/components/Routes/ProtectedRoute.jsx b/src/components/Routes/ProtectedRoute.jsx index 5e62524..8ec3296 100644 --- a/src/components/Routes/ProtectedRoute.jsx +++ b/src/components/Routes/ProtectedRoute.jsx @@ -3,7 +3,9 @@ import { Redirect, Route } from 'react-router-dom'; import { useUserContext } from '../Contexts/UserContext'; export const ProtectedRoute = ({ render, ...others }) => { - const { token, setError } = useUserContext(); + const context = useUserContext(); + const { token, setError } = context; + debugger; if (!token) { setError('Please sign in to access'); return ; diff --git a/src/components/Routes/SiteRoutes.jsx b/src/components/Routes/SiteRoutes.jsx new file mode 100644 index 0000000..e77052c --- /dev/null +++ b/src/components/Routes/SiteRoutes.jsx @@ -0,0 +1,34 @@ +import React, { Suspense } from 'react'; +import { + BrowserRouter, + Switch, + Route +} from 'react-router-dom'; + +import { AuthRoute, TYPES } from '../Routes/AuthRoute' +import { MessageBar } from '../MessageBar'; +import { useUserContext } from '../Contexts/UserContext'; + +const SignInForm = React.lazy(() => import('../SignInForm')); +const SignUpForm = React.lazy(() => import('../SignUpForm')); +const FileUploadForm = React.lazy(() => import('../FileUploadForm')); + +const SiteRoutes = () => { + const { token } = useUserContext(); + console.log('SiteRoutes', token); + return ( + + + + + } type={TYPES.GUEST} token={token} /> + } type={TYPES.GUEST} token={token} /> + } type={TYPES.PROTECTED} token={token} /> + + + + ); +}; + + +export default SiteRoutes; \ No newline at end of file