Realtime RBAC implementation for EmpowerX applications
npm install empowerx-realtime-rbacbash
pnpm add @empowerx/realtime-rbac socket.io-client
`
Usage
$3
Wrap your application with the RealtimeProvider:
`tsx
import { RealtimeProvider } from '@empowerx/realtime-rbac';
function App() {
return (
config={{
guardApiUrl: 'http://localhost:3000',
getAccessToken: () => localStorage.getItem('access_token'),
debug: true,
}}
enabled={true}
>
);
}
`
$3
`tsx
import { useUserAccess } from '@empowerx/realtime-rbac';
function MyComponent() {
const {
hasModuleAccess,
hasPermission,
isLoading,
} = useUserAccess({
fetchUserAccess: async () => {
// Fetch user access from your API
const response = await fetch('/api/user-access');
return response.json();
},
});
if (isLoading) {
return Loading...;
}
return (
{hasModuleAccess('EXFSDS') && You have FSDS module access}
{hasPermission('EXFSDS', 'allotment:view') && (
)}
);
}
`
$3
The library automatically listens for permission changes and updates your UI in real-time:
`tsx
const { userAccess } = useRealtime();
useEffect(() => {
console.log('Permissions updated:', userAccess);
}, [userAccess]);
`
API Reference
$3
Provider component that manages the WebSocket connection and user access state.
Props:
- config: Configuration object
- guardApiUrl: Guard API base URL
- getAccessToken: Function to retrieve auth token
- onAccessUpdate?: Callback when access is updated
- onConnectionChange?: Callback when connection status changes
- debug?: Enable debug logging
- enabled: Enable/disable realtime connection (default: true)
$3
Hook for checking user permissions.
Returns:
- userAccess: Current user access data
- isLoading: Loading state
- hasModuleAccess(moduleKey): Check module access
- hasPermission(moduleKey, permissionKey): Check specific permission
- hasAnyPermission(moduleKey, permissionKeys): Check if user has any of the permissions
- hasAllPermissions(moduleKey, permissionKeys): Check if user has all permissions
$3
Hook to access realtime connection state.
Returns:
- client: RealtimeRBACClient instance
- isConnected: Connection status
- connectionStatus: Detailed connection status
- userAccess: Current user access from realtime updates
- connect(): Manually connect
- disconnect(): Manually disconnect
Types
`typescript
interface UserAccess {
modules: ModuleAccess[];
permissions: PermissionAccess[];
}
interface ModuleAccess {
key: string;
name: string;
description: string | null;
isActive: boolean;
}
interface PermissionAccess {
key: string;
name: string;
description: string | null;
isActive: boolean;
moduleKey: string;
moduleName: string;
}
`
Development
`bash
Install dependencies
pnpm install
Build package
pnpm build
Watch mode
pnpm dev
Type check
pnpm type-check
``