Enum-based Example

A React example that uses enums instead of string literals for permission actions

Purpose

examples/enum-based shows how to use enums as the action vocabulary for Permix. This is useful when your codebase already models permissions as centralized constants and you want autocomplete plus refactor safety from those enums.

What it demonstrates

enum values as permission actions
setup through a single static ruleset
React hook usage plus direct permix.check(...)
declarative checks with the Check component

Core idea

The example moves action names into enums such as PostPermission.Create, then uses those enum members everywhere instead of plain strings.

lib/permissions.ts

export enum PostPermission {
  Create = 'create',
  Read = 'read',
  Update = 'update',
  Delete = 'delete',
}

That same enum member is then used in the UI and in imperative checks:

App.tsx

if (!permix.check('post', PostPermission.Create)) {
  return
}

Run it

cd examples/enum-based
pnpm dev

Key files

src/lib/permissions.ts: enum declarations for each entity
src/lib/permix.ts: typed Permix instance using enum-backed actions
src/App.tsx: component usage and imperative checks

When to use it

Use this shape if your team wants permissions to live in shared enums instead of freeform strings. It keeps large codebases more uniform and makes renaming actions less error-prone.

Source code

Browse the example on GitHub