How you can use withAuth

[MadalinNitu]

How to use properly withAuth for authorize Home feature?

[thaind97git]

Hi @MadalinNitu , welcome to my project. Sorry about withAuth feature. This is an old feature, and I have not complete this. But I have already public a new Auth to support build an admin side. You can check the new release.

at src/layouts/main/index.tsx line 50, using the code inside comment like this:

<Route
    key={path}
    path={path}
    render={props => {
       updateDisplayLayout(currentLayout, layout);
       return (
           <Auth>
               <Component {...props} />
          </Auth>
       );
    }}
    {...rest}
/>

[MadalinNitu]

Hi .. thank you very much for your work here.

I manage to use the hoc function for authorization for a new feature with the following procedures ...

import { verifyToken } from '@/store/actions/auth';
import { selectCurrentUser } from '@/store/slices/authSlice';
import React, { useEffect } from 'react';
import { useDispatch, useSelector } from 'react-redux';

const Empty = () => <div />;

const withAuth: CallableFunction = (AuthComponent: React.FC) => {
  const AuthenHOC: React.FC = () => {
    const dispatch = useDispatch();
    const currentUser = useSelector(selectCurrentUser);

    useEffect(() => {
      dispatch(verifyToken());
    }, [dispatch]);

    return currentUser ? <AuthComponent /> : <Empty />;
  };

  return AuthenHOC;
};

export default withAuth;

and in a test feature class I export the following

import React from 'react';

import withAuth from '@/components/hoc/withAuth'

const Test: React.FC = () => {
  return (
    <div className="test">
      <h1>Test</h1>
    </div>
  );
};

export default withAuth(Test);

and enforce the login only for a feature page not for all.

Maybe you have to move the Auth.ts in another directory for been more accessible?

thanks a lot :+1:

[thaind97git]

Yeah, You are correct about using this feature! withAuth is a feature that I used inside nextjs project to authorize by each page. But for this project, I want to use another approach by using Wrapper Component to support the admin side. Thanks a lot, I will improve the code later.

[MadalinNitu]

Thanks,

I want to add a console feature like aws or gcp platform. In that way we can split de asmin users from clients users and let permissions for different features.