React Auth Hook

Install

npm install @eduenano27/react-auth-hook

AuthProvider<T> Attributes

| Attribute | Type | Description | Default | | --------------------- | --------------------------------------------------------------------- | --------------------------------------------- | ----------------- | | user | <T> | User data | undefined | | views | IAuthViews | Hook views (internal usage, definition only) | -/- | | hasUser | boolean | Hook has user | false | | hasToken | boolean | Hook has token | false | | handleLogin | (props: { token: string, user: T, permissions: string[] }) => void | Set hook data | -/- | | handleLogout | () => void | Reset hook data | -/- | | hasPermission | (...permissions: string[]) => boolean | User has permission | -/- | | hasAnyPermission | (...permissions: string[]) => boolean | User has any permission | -/- |

IAuthViews Attributes

| Attribute | Type | Description | Default | | ------------- | ------------- | --------------------------------------------------------------------- | --------- | | login | JSX.Element | Component to render when user is not allowed | undefined | | dashboard | JSX.Element | Component to render when has not permission / guest is not allowed | undefined | | loading | JSX.Element | Component to render when user data is loading | undefined |

Example

import React from "react";
import { AuthProvider } from "@eduenano27/react-auth-hook";

export default function AppComponent() {
    return (
        <AuthProvider
            api={ 'auth/user' }
        
            views={{
                loading:    <LoadingComponent/>,

                login:      <Navigate to={ 'login' }/>,
                dashboard:  <Navigate to={ 'dashboard' }/>
            }}
        >
            ...
        </AuthProvider>
    );
}