Merge pull request #107 from MargoMarm/bagfix/retinaImg

update

src/App.jsx

@@ -6,7 +6,11 @@ import { fetchCurrentUser } from './redux/auth/operation';
 
 import SharedLayout from './components/SharedLayout/SharedLayout';
 
-import { PrivateRoute, PublicRoute } from './components/Routes';
+import {
+  PrivateRoute,
+  PublicRoute,
+  RestrictedRoute,
+} from './components/Routes';
 import { UseAuth } from './hooks/useAuth';
 
 const Home = lazy(() => import('../src/pages/Home/Home'));
@@ -27,9 +31,11 @@ const Profile = lazy(() => import('./pages/Profile/Profile'));
 function App() {
   const dispatch = useDispatch();
 
-  const { isRefreshing, isLoggedIn } = UseAuth();
+  const { isRefreshing, isLoggedIn, user } = UseAuth();
   const { pathname } = useLocation();
 
+  const emptyUserParams = Object.keys(user.bodyParameters).length === 0;
+
   if (isLoggedIn && pathname !== '/') {
     localStorage.setItem('location', pathname);
   }
@@ -53,7 +59,10 @@ function App() {
           <Route
             path="/signin"
             element={
-              <PublicRoute component={<SignIn />} redirectTo={'/diary'} />
+              <PublicRoute
+                component={<SignIn />}
+                redirectTo={emptyUserParams ? '/params' : '/diary'}
+              />
             }
           />
           <Route
@@ -68,7 +77,7 @@ function App() {
           />
           <Route
             path="/params"
-            element={<PrivateRoute component={<Params />} redirectTo="/" />}
+            element={<RestrictedRoute component={<Params />} redirectTo="/" />}
           />
           <Route
             path="/exercises"

src/components/Routes/PrivateRoute.jsx

@@ -3,10 +3,16 @@ import PropTypes from 'prop-types';
 import { UseAuth } from '../../hooks/useAuth';
 
 const PrivateRoute = ({ component, redirectTo = '/' }) => {
-  const { isLoggedIn, isRefreshing } = UseAuth();
+  const { isLoggedIn, isRefreshing, user } = UseAuth();
   const shouldRedirect = isLoggedIn && !isRefreshing;
 
-  return shouldRedirect ? component : <Navigate to={redirectTo} />;
+  const emptyUserParams = Object.keys(user.bodyParameters).length === 0;
+
+  return shouldRedirect ? (
+    component
+  ) : (
+    <Navigate to={emptyUserParams ? '/params' : redirectTo} />
+  );
 };
 
 PrivateRoute.propTypes = {

src/components/Routes/RestrictedRoute.jsx

@@ -0,0 +1,17 @@
+import { Navigate } from 'react-router-dom';
+import PropTypes from 'prop-types';
+import { UseAuth } from '../../hooks/useAuth';
+
+const RestrictedRoute = ({ component, redirectTo = '/' }) => {
+  const { isLoggedIn, isRefreshing } = UseAuth();
+  const shouldRedirect = isLoggedIn && !isRefreshing;
+
+  return shouldRedirect ? component : <Navigate to={redirectTo} />;
+};
+
+RestrictedRoute.propTypes = {
+  component: PropTypes.object.isRequired,
+  redirectTo: PropTypes.string,
+};
+
+export default RestrictedRoute;

src/components/Routes/index.js

@@ -1,2 +1,3 @@
 export { default as PrivateRoute } from './PrivateRoute';
 export { default as PublicRoute } from './PublicRoute';
+export { default as RestrictedRoute } from './RestrictedRoute';

src/pages/Error/Error.jsx

@@ -13,7 +13,19 @@ import sprite from '../../assets/sprite.svg';
 import { UseAuth } from '../../hooks/useAuth';
 
 const Error = () => {
-  const { isLoggedIn } = UseAuth();
+  const { isLoggedIn, user } = UseAuth();
+
+  const emptyUserParams = Object.keys(user.bodyParameters).length === 0;
+
+  const redirectRoute = () => {
+    if (isLoggedIn && emptyUserParams) {
+      return '/params';
+    } else if (isLoggedIn && !emptyUserParams) {
+      return 'diary';
+    } else if (isLoggedIn === false) {
+      return '/';
+    }
+  };
 
   return (
     <main>
@@ -39,7 +51,7 @@ const Error = () => {
             type="button"
             text={'Go Home'}
             isorange={'true'}
-            to={isLoggedIn ? '/diary' : '/'}
+            to={redirectRoute()}
           />
         </Content>