Skip to content

Check the Authentication status

Check if any user is authenticated or not

Introduction

There are many times, when you have to understand if any user is authenticated (especially in login pages, where you have to redirect your user to its dashboard or allow to login)

For this reason, React Auth Kit comes with isAuth functions


IsAuth functionality available in both hook and Higher Order Component

  • For Functional Components, you can use useIsAuthenticated function inside any components
  • For class based components, you can wrap the component inside withIsAuthenticated function

Usage

Functional Component

Check the authentication status in React Functional Components(FC) by adding the useIsAuthenticated hook inside it.

Import

import {useIsAuthenticated} from 'react-auth-kit';

Demo

import {useIsAuthenticated} from 'react-auth-kit';

const AnyComponent = () => {
    const isAuthenticated = useIsAuthenticated()

    if(isAuthenticated()){
        // Redirect to Dashboard
    }
    else {
        // Redirect to Login
    }
}

API

useIsAuthenticated()

Returns () => boolean


Class Based Component

Import

import {withIsAuthenticated} from 'react-auth-kit';

Demo

import React from "react";
import {withIsAuthenticated} from 'react-auth-kit';

class SomeComponent extends React.Component {

    render(){
        if(this.props.isAuthenticated()){
                // Redirect to Dashboard
        }
        else {
            // Redirect to Login
        }
    }
}

export default withIsAuthenticated(SomeComponent)

API

withIsAuthenticated<P>(Component: React.ComponentType<P>): React.FC<P>

Parameters

  • Component: React.ComponentType<P>

Returns React.FC<P> (Functional Component with isAuthenticated() prop)


— 🔑 —

React Auth Kit is Apache 2.0 License code