Loading...
Loading...
Implement granular user permissions in Umbraco backoffice using official docs
npx skill4agent add umbraco/umbraco-cms-backoffice-skills umbraco-granular-user-permissions/Umbraco-CMS/src/Umbraco.Web.UI.Client/examples/user-permission/umbraco-conditionsumbraco-context-apiimport type { ManifestGranularUserPermission } from '@umbraco-cms/backoffice/user-permission';
export const manifests: Array<ManifestGranularUserPermission> = [
{
type: 'userGranularPermission',
alias: 'My.GranularPermission.Custom',
name: 'Custom Granular Permission',
weight: 100,
forEntityTypes: ['my-entity-type'],
element: () => import('./my-granular-permission.element.js'),
meta: {
schemaType: 'MyPermissionPresentationModel',
label: 'Custom Permissions',
description: 'Configure custom permissions for this entity',
},
},
];import { html, customElement, property, state } from '@umbraco-cms/backoffice/external/lit';
import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
@customElement('my-granular-permission')
export class MyGranularPermissionElement extends UmbLitElement {
@property({ attribute: false })
value: unknown;
@state()
private _permissions: string[] = [];
override render() {
return html`
<uui-box headline="Custom Permissions">
<uui-checkbox
label="Can Edit"
@change=${(e: Event) => this.#onPermissionChange('edit', (e.target as HTMLInputElement).checked)}
></uui-checkbox>
<uui-checkbox
label="Can Delete"
@change=${(e: Event) => this.#onPermissionChange('delete', (e.target as HTMLInputElement).checked)}
></uui-checkbox>
</uui-box>
`;
}
#onPermissionChange(permission: string, enabled: boolean) {
if (enabled) {
this._permissions = [...this._permissions, permission];
} else {
this._permissions = this._permissions.filter(p => p !== permission);
}
this.dispatchEvent(new CustomEvent('change', { detail: { permissions: this._permissions } }));
}
}
export default MyGranularPermissionElement;interface ManifestGranularUserPermission extends ManifestElement {
type: 'userGranularPermission';
forEntityTypes?: Array<string>;
meta: MetaGranularUserPermission;
}
interface MetaGranularUserPermission {
schemaType: string; // API schema type for serialization
label?: string; // Display label (can use localization key)
labelKey?: string; // Localization key for label
description?: string; // Description text
descriptionKey?: string; // Localization key for description
}documentmediamember