@styra/opa-react

License NPM Version

This package contains helpers for using @styra/opa from React.

The package provides an useAuthz hook and a high-level <Authz> component.

They are enabled by wrapping your App into <AuthzProvider>:

<AuthzProvider opaClient={opaClient} defaultPath="policy" defaultInput={{ user, tenant }}>
<Nav />
<Outlet />
</AuthzProvider>

This example provides a previously-configured opaClient instance (OPAClient from @styra/opa), a request path, and default input (which is merged with per-call inputs).

They can either be used by providing static children (<button>Press Here</button>) and optionally fallback and loading JSX elements:

<Authz
path={path}
input={input}
loading={<div>...</div>}
fallback={<button disabled={true}>Press Here</button>}>
<button>Press Here</button>
</Authz>

The useAuthz hook can be used if you need more low-level control about the authorization call. Furthermore, you can retrieve the prepared sdk instance of AuthzProvider for even more control, if need be:

import { AuthzContext } from "@styra/opa-react";

export default function Component() {
const { sdk } = useContext(AuthzContext);
// now you can use `sdk.evaluate()` etc directly
}

Community

For questions, discussions and announcements related to Styra products, services and open source projects, please join the Styra community on Slack!

Index

Interfaces

Type Aliases

Variables

Functions