Skip to main content
import type { PermissionsMap } from '@stytch/react-native';
import { useStytch } from '@stytch/react-native';
import React, { useEffect, useState } from 'react';
import { Text, TouchableOpacity, View } from 'react-native';

export const MyComponent = () => {
  const [allPermissions, setAllPermissions] = useState<PermissionsMap<Record<string, string>>>();

  const stytch = useStytch();

  useEffect(() => {
    stytch.rbac.allPermissions().then((response) => setAllPermissions(response));
  }, [stytch]);

  if (!allPermissions) {
    return <Text>Loading...</Text>;
  }

  const canEditDocuments = allPermissions['document']['edit'];

  const editDocument = () => {
    /* ... */
  };

  return (
    <View>
      <TouchableOpacity disabled={!canEditDocuments} onPress={editDocument}>
        <Text>Edit Document</Text>
      </TouchableOpacity>
    </View>
  );
};
{
    "stytch_permissions": {
      "documents": {
        "edit": false,
        "read": true,
      },
      "images": {
        "create": false,
        "view": true,
      },
    },
}
rbac.allPermissions is an asynchronous method that returns the complete list of permissions assigned to the currently logged-in User. If the User is not logged in, all values will be false.
As a best practice, authorization checks for sensitive actions should also occur on the backend.

Response

permissions
Promise<Record<RoleId, Record<Action, boolean>>>
required
A promise that resolves to a map of all permissions assigned to the currently logged-in User.The key is the human-readable ID of the role, and the value is a map of all actions for the given role. The boolean value signifies whether the User has permission (true) or not (false) to perform the specified action.