Check User Permissions for Lightning Web Components

Customize a component’s behavior based on whether the current user has a specific permission. To check a user’s permission assignment, import Salesforce permissions from the @salesforce/userPermission and @salesforce/customPermission scoped modules.

Where: This change applies to Lightning web components in Lightning Experience and all versions of the Salesforce app.

Why: Permissions are a standard way to control access and behavior in a Salesforce org. Develop Lightning web components to behave a certain way based on the current user’s permissions.

How: To check whether a user has a permission, import a static reference to the permission and evaluate whether it’s true or undefined.

import hasPermission from '@salesforce/userPermission/PermissionName';

Custom permissions can include a namespace. Orgs use namespaces as unique identifiers for their own customization and packages. If the custom permission was installed from a managed package, prepend the namespace followed by __ to the permission name.

import hasPermission from '@salesforce/customPermission/PermissionName';
import hasPermission from '@salesforce/customPermission/namespace__PermissionName';

The name of the static reference is your choice. We chose the format hasPermission to indicate that the reference contains a Boolean.

This sample checks whether the current user has the ViewSetup standard permission.

// app.js
import { LightningElement } from 'lwc';
import hasViewSetup from '@salesforce/userPermission/ViewSetup';

export default class App extends LightingElement {
    get isSetupEnabled() {
        return hasViewSetup;
    }

    openSetup(e) {...}
}

If the user has the permission, the component enables a button.

<!-- app.html -->

<template>
    <setup-panel-group>
        <setup-button disabled={isSetupEnabled} onclick={openSetup}></setup-button>
    </setup-panel-group>
</template>

This sample checks whether the current user has the ViewReport custom permission installed from a managed package with the acme namespace.

// app.js
import { LightningElement } from 'lwc';
import hasViewReport from '@salesforce/customPermission/acme__ViewReport';

export default class App extends LightingElement {
    get isReportVisible() {
        return hasViewReport;
    }
}

If the user has the permission, the component displays the expense-report component .

<!-- app.html -->

<template>
    <common-view></common-view>

    <template if:true={isReportVisible}>
        <c-expense-report></c-expense-report>
    </template>
</template>