Feature Flags Example

Purpose

examples/feature-flags shows that Permix is not limited to classic CRUD authorization. You can also model feature access, experiments, and progressive rollouts as typed permission checks.

What it demonstrates

feature flags represented as entities and actions
early-return UI gating for hidden features
imperative checks before calling protected client logic
a tiny ruleset that reads like product rollout configuration

Core idea

The example treats flags such as newUI or experimentalAPI as permissions:

lib/permix.ts

betaFeatures: {
  newUI: true,
  experimentalAPI: false,
}

That lets the component hide the whole new UI until the flag is enabled:

App.tsx

if (!check('betaFeatures', 'newUI')) {
  return null
}

Run it

cd examples/feature-flags
pnpm dev

Key files

src/lib/permix.ts: feature-flag rules and setup helper
src/hooks/use-permissions.ts: React wrapper around usePermix
src/App.tsx: gated UI and guarded client-side action

When to use it

Use this pattern when the question is "should this user see or use this feature?" rather than "can this user mutate this record?".

Source code

Browse the example on GitHub