Skip to content

User Data

Get the Authorized user's state from any Component simply by using HOC or Hooks

  • For Functional Components, you can use useAuthUser() hook inside any components
  • For class-based components, you can wrap the component inside withAuthUser() HOC function.

Hook

Import

Import useAuthUser in your app
1
import useAuthUser from 'react-auth-kit/hooks/useAuthUser';

Usage

SecureComponent.js
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
import React from 'react';
import useAuthUser from 'react-auth-kit/hooks/useAuthUser';

const SomeComponent = () => {
    const auth = useAuthUser()

    return(
        <div>
            Hello {auth.user}
        </div>
    )
}

Higher Order Component

Import

Import withAuthUser in your app
1
import withAuthUser from 'react-auth-kit/hoc/withAuthUser';

Usage

SecureComponent.js
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
import React from 'react';
import withAuthUser from 'react-auth-kit/hoc/withAuthUser';

class SomeComponent extends React.Component {
    render(){
        return (
            <div>
                Hello {this.props.authState.user}
            </div>
        )
    }
}

export default withAuthUser(SomeComponent)

API

— 🔑 —

React Auth Kit is MIT License code