import React from 'react'
import { AuthProvider } from 'react-authx'
 
const authList = ['user-edit', 'user-list', 'user-enable,user-disable']
const App = () => {
  return (
    <AuthProvider value={{ authList }}>
      ...
    </AuthProvider>
  )
}

import React from 'react'
import { AuthConsumer } from 'react-authx'
 
const Component = () => {
  return (
    <AuthConsumer authKey="user-edit">
      <div> shown when has auth for key: user-edit</div>
    </AuthConsumer>
 
    <AuthConsumer authKey="user-list">
    {
      hasAuth => (
      hasAuth
        ? <div> shown when has auth for key: user-list </div>
        : <div> shown when does not have auth for key: user-list </div>
      }
      )
    }
    </AuthConsumer>
  )
}

import React from 'react'
import { AuthWrapper, hasAuth } from 'react-authx'
import { Input } from 'antd'
 
@AuthWrapper
const Component = (props) => {
  return <Input disable={hasAuth(props.authList, 'user-enable,user-disable')} />
}