Skip to main content

Frontend Permissions

Casibase's React frontend uses centralized utility functions to check user permissions. These functions are defined in web/src/Setting.js and ensure consistent permission checking across all components.

Permission Utility Functions​

isAdminUser(account)​

Checks if a user is a system administrator.

if (Setting.isAdminUser(account)) {
  // Show admin-only features
}

Returns true for:

  • Built-in admin account (owner === "built-in")
  • Users with the isAdmin flag set to true

isChatAdminUser(account)​

Checks if a user has chat-admin privileges.

if (Setting.isChatAdminUser(account)) {
  // Show chat admin features
}

Returns true for users with type === "chat-admin".

canViewAllUsers(account)​

Checks if a user can view data for all users (not just their own).

if (Setting.canViewAllUsers(account)) {
  // Enable "All users" option in dropdown
}

Returns true for:

  • The admin account (name === "admin")
  • Chat admin users

This function is commonly used in usage pages and activity logs where admins need to see organization-wide data.

isLocalAdminUser(account)​

Checks if a user has local admin privileges, which includes both system admins and chat admins.

const canManagePanes = Setting.isLocalAdminUser(account);

Returns true for:

  • System admins
  • Chat admin users

isLocalAndStoreAdminUser(account)​

Similar to isLocalAdminUser() but also ensures the user can manage store content (not restricted to "non-store-admin" homepage).

if (Setting.isLocalAndStoreAdminUser(account)) {
  // Allow file operations
}

Practical Examples​

Restricting Menu Items​

// App.js - Building navigation menu
if (!Setting.isAdminUser(this.state.account)) {
  if (!Setting.isChatAdminUser(this.state.account)) {
    return res; // Return limited menu for regular users
  }
}

Conditional UI Elements​

// UsagePage.js - User selection dropdown
<option key="all" value="All" 
  disabled={!Setting.canViewAllUsers(this.props.account)}>
  All
</option>

Permission-Based Features​

// ProviderEditPage.js - Sensitive field access
<Input.Password
  value={this.state.provider.providerKey}
  disabled={!Setting.isAdminUser(this.props.account)}
  onChange={e => this.updateProviderField("providerKey", e.target.value)}
/>

Benefits of Centralized Functions​

Before these utilities existed, permission checks were scattered across components using inline conditions like account.name === "admin" || account.type === "chat-admin". This made the code:

  • Fragile: Changing role logic required updating multiple files
  • Inconsistent: Different components might check permissions differently
  • Error-prone: Easy to miss edge cases or make typos

Centralized utilities solve these issues by providing a single source of truth. Updates to permission logic happen in one place and automatically apply throughout the application.

Implementation Notes​

All utility functions perform null/undefined checks on the account parameter, making them safe to call without prior validation. They return false for invalid or missing accounts, following a secure-by-default approach.