@react-library/permissions

Ready made Permissions helpers fore React

Install

yarn add @react-library/permissions
or
npm install --save @react-library/permissions

Usage

Setup app context

import { useSelect } 'react-redux';
import Provider from '@react-library/permissions';

// example resolver using redux (feel free to put your own)
const resolver = (query: string): boolean => {
  // read array of permissions from user profile
  const permissions = useSelect(store => store.user.permissions);
  // check if list of permissions contains requested permission
  return permissions.includes(query);
}

const App = () => (
  <Provider resolver={resolver}>
  {/* now you have available permissions resolver in app */}
  {...appContent}
  </Provider>
);

Value Hook

• every time resolver is changed, specific permission will be re-calculated

import { useSelect } from '@react-library/permissions';
const canWrite = usePermission('write');

Getter Hook

• every time resolver is changed, specific permission will be re-calculated with new resolver

import { useGetPermission } from '@react-library/permissions';
const getPermission = useGetPermission();
const allowedActions = ['read', 'write'].filter(action => getPermission(action));

Global reference

• if you need to access to permissions outside of JSX (fetch, saga, reducer, ...)

import { getPermission } from '@react-library/permissions';

const callApi = () => {
  if (!getPermission('read')) {
  }
};

License

MIT © serusko