Ready State
Learn how to use the `isReady()` method to check if permissions are ready to use.
Overview
Sometimes you need to know when permissions are ready to use. For example, you might want to wait for permissions to be ready before rendering a component. That's where the isReady() and isReadyAsync() methods come in.
hydrate() alone does not make the instance ready. You must call setup() after hydration to restore function-based rules and mark the instance as ready.
Usage
Basic
Permix provides an isReady() method to check if permissions have been properly initialized:
import { } from 'permix'
const = <{
: ['create', 'read']
}>()
.(.()) // false
// After setup completes
.({
: {
: true,
: true
}
})
.(.()) // trueAsync
If you need to wait for permissions to be ready in an async context, you can use the isReadyAsync() method. This returns a promise that resolves when permissions are ready:
import { createPermix } from 'permix'
const permix = createPermix<{
post: ['create']
}>()
async function init() {
await permix.isReadyAsync()
// Permissions are now ready to use
const canCreate = permix.check('post.create')
}SSR
This is particularly useful in SSR applications when using function-based permissions, since the dehydration process converts all function permissions to false until they are properly rehydrated on the client.
Read more about hydration to learn how to transfer permissions from the server to the client.
// Server instance
import { createPermix } from 'permix'
const serverPermix = createPermix<{
post: [{ name: 'read', type: { isPublic: boolean } }]
}>()
serverPermix.setup({
post: {
read: post => !!post?.isPublic,
},
})
const state = serverPermix.dehydrate()
// { post: { read: false } } — functions evaluated without data
// Client instance (separate from the server)
const clientPermix = createPermix<{
post: [{ name: 'read', type: { isPublic: boolean } }]
}>()
clientPermix.hydrate(state)
console.log(clientPermix.isReady()) // false
// Boolean rules from hydration work immediately:
console.log(clientPermix.check('post.read')) // false
// Restore function-based rules and mark the instance ready
clientPermix.setup({
post: {
read: post => !!post?.isPublic,
},
})
console.log(clientPermix.isReady()) // true
console.log(clientPermix.check('post.read', { isPublic: true })) // trueThe ready event fires once on the first setup() (or when initial rules are passed to createPermix). Register permix.hook('ready', ...) before that first setup() if you need to react to readiness — not after a later setup() on an already-ready instance.