@masterteam/permissions 0.0.1

package/fesm2022/masterteam-permissions.mjs

@@ -0,0 +1,971 @@
+import * as i0 from '@angular/core';
+import { inject, Injectable, input, output, signal, effect, Component, DestroyRef, linkedSignal, computed } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { CommonModule } from '@angular/common';
+import * as i1 from '@angular/forms';
+import { FormControl, ReactiveFormsModule, FormsModule } from '@angular/forms';
+import { ActivatedRoute, Router } from '@angular/router';
+import { Avatar } from '@masterteam/components/avatar';
+import { Button } from '@masterteam/components/button';
+import { Card } from '@masterteam/components/card';
+import { ModalService } from '@masterteam/components/modal';
+import { ToggleField } from '@masterteam/components/toggle-field';
+import * as i2 from '@jsverse/transloco';
+import { TranslocoModule, TranslocoService } from '@jsverse/transloco';
+import * as i2$1 from 'primeng/skeleton';
+import { SkeletonModule } from 'primeng/skeleton';
+import { Action, Selector, State, Store } from '@ngxs/store';
+import { HttpClient } from '@angular/common/http';
+import { map, tap, catchError, finalize } from 'rxjs';
+import { ModalRef } from '@masterteam/components/dialog';
+import { Tabs } from '@masterteam/components/tabs';
+import { AccessibilitiesFacade } from '@masterteam/accessibilities';
+
+var ModuleType;
+(function (ModuleType) {
+    ModuleType["LEVEL"] = "level";
+    ModuleType["LOG"] = "log";
+    ModuleType["LEVELLOG"] = "levelLog";
+})(ModuleType || (ModuleType = {}));
+
+class LoadRoles {
+    static type = '[Permissions] Load Roles';
+    constructor() { }
+}
+class LoadRolesSuccess {
+    roles;
+    static type = '[Permissions] Load Roles Success';
+    constructor(roles) {
+        this.roles = roles;
+    }
+}
+class LoadRolesFail {
+    error;
+    static type = '[Permissions] Load Roles Fail';
+    constructor(error) {
+        this.error = error;
+    }
+}
+class SelectRole {
+    roleValue;
+    static type = '[Permissions] Select Role';
+    constructor(roleValue) {
+        this.roleValue = roleValue;
+    }
+}
+class SelectGroup {
+    groupId;
+    static type = '[Permissions] Select Group';
+    constructor(groupId) {
+        this.groupId = groupId;
+    }
+}
+class LoadPermissions {
+    roleValue;
+    levelId;
+    static type = '[Permissions] Load Permissions';
+    constructor(roleValue, levelId) {
+        this.roleValue = roleValue;
+        this.levelId = levelId;
+    }
+}
+class LoadGroupPermissions {
+    groupId;
+    levelId;
+    static type = '[Permissions] Load Group Permissions';
+    constructor(groupId, levelId) {
+        this.groupId = groupId;
+        this.levelId = levelId;
+    }
+}
+class LoadPermissionsSuccess {
+    permissions;
+    static type = '[Permissions] Load Permissions Success';
+    constructor(permissions) {
+        this.permissions = permissions;
+    }
+}
+class LoadGroupPermissionsSuccess {
+    permissions;
+    static type = '[Permissions] Load Group Permissions Success';
+    constructor(permissions) {
+        this.permissions = permissions;
+    }
+}
+class LoadPermissionsFail {
+    error;
+    static type = '[Permissions] Load Permissions Fail';
+    constructor(error) {
+        this.error = error;
+    }
+}
+class UpdatePermissionLocally {
+    roleValue;
+    levelId;
+    actionId;
+    isSelected;
+    static type = '[Permissions] Update Permission Locally';
+    constructor(roleValue, levelId, actionId, isSelected) {
+        this.roleValue = roleValue;
+        this.levelId = levelId;
+        this.actionId = actionId;
+        this.isSelected = isSelected;
+    }
+}
+class UpdateGroupPermissionLocally {
+    roleValue;
+    levelId;
+    actionId;
+    isSelected;
+    static type = '[Permissions] Update Group Permission Locally';
+    constructor(roleValue, levelId, actionId, isSelected) {
+        this.roleValue = roleValue;
+        this.levelId = levelId;
+        this.actionId = actionId;
+        this.isSelected = isSelected;
+    }
+}
+class UpdatePermission {
+    roleValue;
+    levelId;
+    static type = '[Permissions] Update Permission';
+    constructor(roleValue, levelId) {
+        this.roleValue = roleValue;
+        this.levelId = levelId;
+    }
+}
+class UpdateGroupPermission {
+    groupId;
+    permissionLogs;
+    levelId;
+    static type = '[Permissions] Update Group Permission';
+    constructor(groupId, permissionLogs, levelId) {
+        this.groupId = groupId;
+        this.permissionLogs = permissionLogs;
+        this.levelId = levelId;
+    }
+}
+class UpdatePermissionSuccess {
+    static type = '[Permissions] Update Permission Success';
+}
+class UpdatePermissionFail {
+    error;
+    static type = '[Permissions] Update Permission Fail';
+    constructor(error) {
+        this.error = error;
+    }
+}
+class ToggleAllLevelPermissions {
+    roleValue;
+    levelId;
+    levelName;
+    enabled;
+    static type = '[Permissions] Toggle All Level Permissions';
+    constructor(roleValue, levelId, levelName, enabled) {
+        this.roleValue = roleValue;
+        this.levelId = levelId;
+        this.levelName = levelName;
+        this.enabled = enabled;
+    }
+}
+class ToggleAllGroupPermissions {
+    levelId;
+    groupId;
+    enabled;
+    static type = '[Permissions] Toggle All Group Permissions';
+    constructor(levelId, groupId, enabled) {
+        this.levelId = levelId;
+        this.groupId = groupId;
+        this.enabled = enabled;
+    }
+}
+class SetModuleInfo {
+    moduleType;
+    moduleId;
+    parentModuleType;
+    parentModuleId;
+    parentPath;
+    static type = '[Permissions] Set Module Info';
+    constructor(moduleType, moduleId, parentModuleType, parentModuleId, parentPath) {
+        this.moduleType = moduleType;
+        this.moduleId = moduleId;
+        this.parentModuleType = parentModuleType;
+        this.parentModuleId = parentModuleId;
+        this.parentPath = parentPath;
+    }
+}
+class Reset {
+    static type = '[Permissions] Reset Module Info';
+    constructor() { }
+}
+
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+let PermissionsState = class PermissionsState {
+    http = inject(HttpClient);
+    static roles(state) {
+        return state.roles;
+    }
+    static selectedRoleValue(state) {
+        return state.selectedRoleValue;
+    }
+    static selectedGroupValue(state) {
+        return state.selectedGroupValue;
+    }
+    static permissions(state) {
+        return state.permissions;
+    }
+    static groupPermissions(state) {
+        return state.groupPermissions;
+    }
+    static loading(state) {
+        return state.loading;
+    }
+    static permissionsLoading(state) {
+        return state.permissionsLoading;
+    }
+    static addPermissionsLoading(state) {
+        return state.addPermissionsLoading;
+    }
+    static moduleType(state) {
+        return state.moduleType;
+    }
+    static moduleId(state) {
+        return state.moduleId;
+    }
+    static levelId(state) {
+        return state.moduleType === 'module'
+            ? state.parentModuleId.toString()
+            : state.moduleId.toString();
+    }
+    static error(state) {
+        return state.error;
+    }
+    loadRoles(ctx) {
+        ctx.patchState({
+            loading: true,
+            error: null,
+            currentLevelId: ctx.getState().moduleId.toString() || '',
+        });
+        return this.http
+            .get(`identity/roles/scopes/${ctx.getState().moduleType}/${ctx.getState().moduleId}?inherited=true`)
+            .pipe(map((response) => response.data), tap((roles) => {
+            ctx.dispatch(new LoadRolesSuccess(roles));
+        }), catchError((error) => {
+            ctx.dispatch(new LoadRolesFail(error.message || 'Failed to load roles'));
+            throw error;
+        }));
+    }
+    loadRolesSuccess(ctx, action) {
+        ctx.patchState({
+            roles: action.roles,
+            loading: false,
+            error: null,
+        });
+    }
+    loadRolesFail(ctx, action) {
+        ctx.patchState({
+            loading: false,
+            error: action.error,
+        });
+    }
+    selectRole(ctx, action) {
+        const state = ctx.getState();
+        ctx.patchState({ selectedRoleValue: action.roleValue });
+        if (state.currentLevelId) {
+            ctx.dispatch(new LoadPermissions(action.roleValue, state.currentLevelId));
+        }
+    }
+    selectGroup(ctx, action) {
+        const state = ctx.getState();
+        ctx.patchState({ selectedGroupValue: action.groupId });
+        if (state.currentLevelId) {
+            ctx.dispatch(new LoadGroupPermissions(action.groupId, state.currentLevelId));
+        }
+    }
+    loadPermissions(ctx, action) {
+        ctx.patchState({ permissionsLoading: true, error: null });
+        // identity/roles/${action.roleValue}/permissions
+        return this.http
+            .get(`identity/roles/level/${ctx.getState().moduleType === 'module'
+            ? ctx.getState().parentModuleId
+            : ctx.getState().moduleId}/${ctx.getState().moduleType === 'module' ? 'module/' : ''}${ctx.getState().moduleType === 'module'
+            ? `${ctx.getState().moduleId}/`
+            : ''}${action.roleValue}/permissions`, {
+            params: {
+                scopeId: ctx.getState().moduleType === 'module'
+                    ? ctx.getState().parentModuleId
+                    : ctx.getState().moduleId,
+                scopeType: ModuleType.LEVEL,
+            },
+        })
+            .pipe(map((response) => response.data.permissions), tap((permissions) => {
+            ctx.dispatch(new LoadPermissionsSuccess(permissions));
+        }), catchError((error) => {
+            ctx.dispatch(new LoadPermissionsFail(error.message || 'Failed to load permissions'));
+            throw error;
+        }));
+    }
+    loadGroupPermissions(ctx, action) {
+        ctx.patchState({ permissionsLoading: true, error: null });
+        return this.http
+            .get(`identity/groups/level/${ctx.getState().moduleType === 'module'
+            ? ctx.getState().parentModuleId
+            : ctx.getState().moduleId}/${ctx.getState().moduleType === 'module' ? 'module/' : ''}${ctx.getState().moduleType === 'module'
+            ? `${ctx.getState().moduleId}/`
+            : ''}${action.groupId}/permissions`)
+            .pipe(map((response) => response.data), tap((permissions) => {
+            ctx.dispatch(new LoadGroupPermissionsSuccess(permissions));
+        }), catchError((error) => {
+            ctx.dispatch(new LoadPermissionsFail(error.message || 'Failed to load permissions'));
+            throw error;
+        }));
+    }
+    loadPermissionsSuccess(ctx, action) {
+        ctx.patchState({
+            permissions: action.permissions,
+            permissionsLoading: false,
+            error: null,
+        });
+    }
+    loadGroupPermissionsSuccess(ctx, action) {
+        ctx.patchState({
+            groupPermissions: action.permissions,
+            permissionsLoading: false,
+            error: null,
+        });
+    }
+    loadPermissionsFail(ctx, action) {
+        ctx.patchState({
+            permissionsLoading: false,
+            error: action.error,
+        });
+    }
+    updatePermissionLocally(ctx, action) {
+        const state = ctx.getState();
+        const updatedPermissions = state.permissions.map((log) => ({
+            ...log,
+            actions: log.actions.map((act) => act.id === action.actionId
+                ? { ...act, isSelected: action.isSelected }
+                : act),
+        }));
+        ctx.patchState({ permissions: updatedPermissions });
+    }
+    updateGroupPermissionLocally(ctx, action) {
+        const state = ctx.getState();
+        const updatedPermissions = state.groupPermissions.map((permission) => ({
+            ...permission,
+            logs: permission.logs.map((log) => ({
+                ...log,
+                actions: log.actions.map((act) => act.id === action.actionId
+                    ? { ...act, isSelected: action.isSelected }
+                    : act),
+            })),
+        }));
+        ctx.patchState({ groupPermissions: updatedPermissions });
+    }
+    updatePermission(ctx, action) {
+        const state = ctx.getState();
+        ctx.patchState({ addPermissionsLoading: true, error: null });
+        const updatedPermissions = state.permissions;
+        ctx.patchState({ permissions: updatedPermissions });
+        return this.http
+            .put(`identity/roles/${action.roleValue}/setAllPermissions`, { permissions: updatedPermissions }, {
+            params: {
+                scopeId: ctx.getState().moduleType === 'module'
+                    ? ctx.getState().parentModuleId
+                    : ctx.getState().moduleId,
+                scopeType: ModuleType.LEVEL,
+            },
+        })
+            .pipe(tap(() => {
+            ctx.dispatch(new UpdatePermissionSuccess());
+        }), finalize(() => {
+            ctx.patchState({ addPermissionsLoading: false });
+        }), catchError((error) => {
+            // Rollback on error
+            ctx.patchState({
+                permissions: state.permissions,
+                addPermissionsLoading: false,
+            });
+            ctx.dispatch(new UpdatePermissionFail(error.message || 'Failed to update permission'));
+            throw error;
+        }));
+    }
+    updateGroupPermission(ctx, action) {
+        const state = ctx.getState();
+        ctx.patchState({ addPermissionsLoading: true, error: null });
+        const updatedPermissions = state.groupPermissions;
+        ctx.patchState({ groupPermissions: updatedPermissions });
+        return this.http
+            .put(`identity/groups/${action.groupId}/setAllPermissions`, { permissions: updatedPermissions[0].logs || [] })
+            .pipe(tap(() => {
+            ctx.dispatch(new UpdatePermissionSuccess());
+        }), finalize(() => {
+            ctx.patchState({ addPermissionsLoading: false });
+        }), catchError((error) => {
+            // Rollback on error
+            ctx.patchState({
+                groupPermissions: state.groupPermissions,
+                addPermissionsLoading: false,
+            });
+            ctx.dispatch(new UpdatePermissionFail(error.message || 'Failed to update permission'));
+            throw error;
+        }));
+    }
+    toggleAllLevelPermissions(ctx, action) {
+        const state = ctx.getState();
+        const updatedPermissions = state.permissions.map((log) => ({
+            ...log,
+            actions: log.actions.map((act) => ({
+                ...act,
+                isSelected: action.enabled,
+            })),
+        }));
+        ctx.patchState({ permissions: updatedPermissions });
+        return this.http
+            .put(`identity/roles/${action.roleValue}/setAllPermissions`, { permissions: updatedPermissions }, {
+            params: {
+                scopeId: ctx.getState().moduleType === 'module'
+                    ? ctx.getState().parentModuleId
+                    : ctx.getState().moduleId,
+                scopeType: ModuleType.LEVEL,
+            },
+        })
+            .pipe(tap(() => {
+            ctx.dispatch(new UpdatePermissionSuccess());
+        }), catchError((error) => {
+            ctx.patchState({ permissions: state.permissions });
+            ctx.dispatch(new UpdatePermissionFail(error.message || 'Failed to toggle all permissions'));
+            throw error;
+        }));
+    }
+    toggleAllGroupPermissions(ctx, action) {
+        const state = ctx.getState();
+        const updatedPermissions = state.groupPermissions.map((permission) => ({
+            ...permission,
+            logs: permission.logs.map((log) => ({
+                ...log,
+                actions: log.actions.map((act) => ({
+                    ...act,
+                    isSelected: action.enabled,
+                })),
+            })),
+        }));
+        ctx.patchState({ groupPermissions: updatedPermissions });
+        return this.http
+            .put(`identity/groups/${action.groupId}/setAllPermissions`, { permissions: updatedPermissions[0].logs || [] })
+            .pipe(tap(() => {
+            ctx.dispatch(new UpdatePermissionSuccess());
+        }), catchError((error) => {
+            ctx.patchState({ groupPermissions: state.groupPermissions });
+            ctx.dispatch(new UpdatePermissionFail(error.message || 'Failed to toggle all permissions'));
+            throw error;
+        }));
+    }
+    setModuleInfo(ctx, action) {
+        let parentPath = '';
+        if (action.parentModuleType && action.parentModuleId) {
+            parentPath = `/${action.parentModuleType}/${action.parentModuleId}`;
+        }
+        else if (action.parentPath) {
+            parentPath = action.parentPath;
+        }
+        ctx.patchState({
+            moduleType: action.moduleType,
+            moduleId: action.moduleId,
+            parentModuleType: action.parentModuleType ?? null,
+            parentModuleId: action.parentModuleId ?? null,
+            parentPath: parentPath ?? '',
+        });
+    }
+    reset(ctx) {
+        ctx.patchState({
+            moduleType: '',
+            moduleId: '',
+            parentModuleType: null,
+            parentModuleId: null,
+            parentPath: '',
+            roles: [],
+            selectedRoleValue: null,
+            selectedGroupValue: null,
+            permissions: [],
+            groupPermissions: [],
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PermissionsState, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PermissionsState });
+};
+__decorate([
+    Action(LoadRoles)
+], PermissionsState.prototype, "loadRoles", null);
+__decorate([
+    Action(LoadRolesSuccess)
+], PermissionsState.prototype, "loadRolesSuccess", null);
+__decorate([
+    Action(LoadRolesFail)
+], PermissionsState.prototype, "loadRolesFail", null);
+__decorate([
+    Action(SelectRole)
+], PermissionsState.prototype, "selectRole", null);
+__decorate([
+    Action(SelectGroup)
+], PermissionsState.prototype, "selectGroup", null);
+__decorate([
+    Action(LoadPermissions)
+], PermissionsState.prototype, "loadPermissions", null);
+__decorate([
+    Action(LoadGroupPermissions)
+], PermissionsState.prototype, "loadGroupPermissions", null);
+__decorate([
+    Action(LoadPermissionsSuccess)
+], PermissionsState.prototype, "loadPermissionsSuccess", null);
+__decorate([
+    Action(LoadGroupPermissionsSuccess)
+], PermissionsState.prototype, "loadGroupPermissionsSuccess", null);
+__decorate([
+    Action(LoadPermissionsFail)
+], PermissionsState.prototype, "loadPermissionsFail", null);
+__decorate([
+    Action(UpdatePermissionLocally)
+], PermissionsState.prototype, "updatePermissionLocally", null);
+__decorate([
+    Action(UpdateGroupPermissionLocally)
+], PermissionsState.prototype, "updateGroupPermissionLocally", null);
+__decorate([
+    Action(UpdatePermission)
+], PermissionsState.prototype, "updatePermission", null);
+__decorate([
+    Action(UpdateGroupPermission)
+], PermissionsState.prototype, "updateGroupPermission", null);
+__decorate([
+    Action(ToggleAllLevelPermissions)
+], PermissionsState.prototype, "toggleAllLevelPermissions", null);
+__decorate([
+    Action(ToggleAllGroupPermissions)
+], PermissionsState.prototype, "toggleAllGroupPermissions", null);
+__decorate([
+    Action(SetModuleInfo)
+], PermissionsState.prototype, "setModuleInfo", null);
+__decorate([
+    Action(Reset)
+], PermissionsState.prototype, "reset", null);
+__decorate([
+    Selector()
+], PermissionsState, "roles", null);
+__decorate([
+    Selector()
+], PermissionsState, "selectedRoleValue", null);
+__decorate([
+    Selector()
+], PermissionsState, "selectedGroupValue", null);
+__decorate([
+    Selector()
+], PermissionsState, "permissions", null);
+__decorate([
+    Selector()
+], PermissionsState, "groupPermissions", null);
+__decorate([
+    Selector()
+], PermissionsState, "loading", null);
+__decorate([
+    Selector()
+], PermissionsState, "permissionsLoading", null);
+__decorate([
+    Selector()
+], PermissionsState, "addPermissionsLoading", null);
+__decorate([
+    Selector()
+], PermissionsState, "moduleType", null);
+__decorate([
+    Selector()
+], PermissionsState, "moduleId", null);
+__decorate([
+    Selector()
+], PermissionsState, "levelId", null);
+__decorate([
+    Selector()
+], PermissionsState, "error", null);
+PermissionsState = __decorate([
+    State({
+        name: 'permissions',
+        defaults: {
+            roles: [],
+            selectedRoleValue: null,
+            selectedGroupValue: null,
+            permissions: [],
+            groupPermissions: [],
+            currentLevelId: null,
+            loading: false,
+            permissionsLoading: false,
+            addPermissionsLoading: false,
+            error: null,
+            moduleType: '',
+            moduleId: '',
+            parentModuleType: '',
+            parentModuleId: '',
+            parentPath: '',
+        },
+    })
+], PermissionsState);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PermissionsState, decorators: [{
+            type: Injectable
+        }], propDecorators: { loadRoles: [], loadRolesSuccess: [], loadRolesFail: [], selectRole: [], selectGroup: [], loadPermissions: [], loadGroupPermissions: [], loadPermissionsSuccess: [], loadGroupPermissionsSuccess: [], loadPermissionsFail: [], updatePermissionLocally: [], updateGroupPermissionLocally: [], updatePermission: [], updateGroupPermission: [], toggleAllLevelPermissions: [], toggleAllGroupPermissions: [], setModuleInfo: [], reset: [] } });
+
+class PermissionsFacade {
+    store = inject(Store);
+    selectors = {
+        roles: this.store.selectSignal(PermissionsState.roles),
+        selectedRoleValue: this.store.selectSignal(PermissionsState.selectedRoleValue),
+        selectedGroupValue: this.store.selectSignal(PermissionsState.selectedGroupValue),
+        permissions: this.store.selectSignal(PermissionsState.permissions),
+        groupPermissions: this.store.selectSignal(PermissionsState.groupPermissions),
+        loading: this.store.selectSignal(PermissionsState.loading),
+        permissionsLoading: this.store.selectSignal(PermissionsState.permissionsLoading),
+        addPermissionsLoading: this.store.selectSignal(PermissionsState.addPermissionsLoading),
+        error: this.store.selectSignal(PermissionsState.error),
+        levelId: this.store.selectSignal(PermissionsState.levelId),
+    };
+    loadRoles() {
+        return this.store.dispatch(new LoadRoles());
+    }
+    selectRole(roleValue) {
+        if (roleValue) {
+            return this.store.dispatch(new SelectRole(roleValue));
+        }
+        return;
+    }
+    selectGroup(groupId) {
+        if (groupId) {
+            return this.store.dispatch(new SelectGroup(groupId));
+        }
+        return;
+    }
+    loadPermissions(roleValue, levelId) {
+        return this.store.dispatch(new LoadPermissions(roleValue, levelId));
+    }
+    loadGroupPermissions(groupId, levelId) {
+        return this.store.dispatch(new LoadGroupPermissions(groupId, levelId));
+    }
+    updatePermissionLocally(roleValue, levelId, actionId, isSelected) {
+        return this.store.dispatch(new UpdatePermissionLocally(roleValue, levelId, actionId, isSelected));
+    }
+    updateGroupPermissionLocally(roleValue, levelId, actionId, isSelected) {
+        return this.store.dispatch(new UpdateGroupPermissionLocally(roleValue, levelId, actionId, isSelected));
+    }
+    updatePermission(roleValue, levelId) {
+        return this.store.dispatch(new UpdatePermission(roleValue, levelId));
+    }
+    updateGroupPermission(groupId, permissionLogs, levelId) {
+        return this.store.dispatch(new UpdateGroupPermission(groupId, permissionLogs, levelId));
+    }
+    toggleAllLevelPermissions(roleValue, levelId, levelName, enabled) {
+        return this.store.dispatch(new ToggleAllLevelPermissions(roleValue, levelId, levelName, enabled));
+    }
+    toggleAllGroupPermissions(levelId, groupId, enabled) {
+        return this.store.dispatch(new ToggleAllGroupPermissions(levelId, groupId, enabled));
+    }
+    setModuleInfo(moduleType, moduleId, parentModuleType, parentModuleId, parentPath) {
+        return this.store.dispatch(new SetModuleInfo(moduleType, moduleId, parentModuleType, parentModuleId, parentPath));
+    }
+    reset() {
+        return this.store.dispatch(new Reset());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PermissionsFacade, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PermissionsFacade, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PermissionsFacade, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
+class PermissionsEditDialog {
+    permissionsFacade = inject(PermissionsFacade);
+    modal = inject(ModalService);
+    ref = inject(ModalRef);
+    // permissionGroup = input.required<PermissionLog | null>();
+    permissionGroup = input(null, ...(ngDevMode ? [{ debugName: "permissionGroup" }] : []));
+    addPermissionsLoading = this.permissionsFacade.selectors.addPermissionsLoading;
+    addPermissionsError = this.permissionsFacade.selectors.error;
+    levelId = input.required(...(ngDevMode ? [{ debugName: "levelId" }] : []));
+    roleValue = input.required(...(ngDevMode ? [{ debugName: "roleValue" }] : []));
+    isGroup = input.required(...(ngDevMode ? [{ debugName: "isGroup" }] : []));
+    closeDialog = output();
+    actionControls = signal(new Map(), ...(ngDevMode ? [{ debugName: "actionControls" }] : []));
+    toggleAll = signal(false, ...(ngDevMode ? [{ debugName: "toggleAll" }] : []));
+    constructor() {
+        effect(() => {
+            const group = this.permissionGroup();
+            if (group) {
+                const controls = new Map();
+                group.actions.forEach((action) => {
+                    const control = new FormControl(action.isSelected);
+                    control.valueChanges.subscribe((value) => {
+                        if (value !== null) {
+                            this.onPermissionToggle(action.id, value);
+                        }
+                    });
+                    controls.set(action.id, control);
+                });
+                this.actionControls.set(controls);
+                this.toggleAll.set(group.actions.every((action) => action.isSelected));
+            }
+        });
+    }
+    onPermissionToggle(actionId, isSelected) {
+        const levelId = this.levelId();
+        const roleValue = this.roleValue();
+        if (levelId && roleValue) {
+            if (this.isGroup()) {
+                this.permissionsFacade.updateGroupPermissionLocally(roleValue, levelId, actionId, isSelected);
+                return;
+            }
+            this.permissionsFacade.updatePermissionLocally(roleValue, levelId, actionId, isSelected);
+        }
+    }
+    onClose() {
+        // this.closeDialog.emit();
+        this.ref.close();
+    }
+    trackByActionId(_index, action) {
+        return action.id;
+    }
+    getControl(actionId) {
+        return this.actionControls().get(actionId) || new FormControl(false);
+    }
+    onSave() {
+        const levelId = this.levelId();
+        const roleValue = this.roleValue();
+        const isGroup = this.isGroup();
+        if (levelId && roleValue) {
+            let subscription;
+            if (isGroup) {
+                subscription = this.permissionsFacade.updateGroupPermission(roleValue, [this.permissionGroup()], levelId);
+            }
+            else {
+                subscription = this.permissionsFacade.updatePermission(roleValue, levelId);
+            }
+            subscription.subscribe({
+                next: () => {
+                    this.onClose();
+                },
+                error: (error) => {
+                    console.error('Failed to save accessibility permissions:', error);
+                },
+            });
+        }
+    }
+    selectAll() {
+        const group = this.permissionGroup();
+        const actions = group?.actions || [];
+        for (let i = 0; i < actions?.length; i++) {
+            const control = this.actionControls().get(actions[i].id);
+            control?.setValue(this.toggleAll());
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PermissionsEditDialog, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: PermissionsEditDialog, isStandalone: true, selector: "mt-permissions-edit-dialog", inputs: { permissionGroup: { classPropertyName: "permissionGroup", publicName: "permissionGroup", isSignal: true, isRequired: false, transformFunction: null }, levelId: { classPropertyName: "levelId", publicName: "levelId", isSignal: true, isRequired: true, transformFunction: null }, roleValue: { classPropertyName: "roleValue", publicName: "roleValue", isSignal: true, isRequired: true, transformFunction: null }, isGroup: { classPropertyName: "isGroup", publicName: "isGroup", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { closeDialog: "closeDialog" }, ngImport: i0, template: "<div [class]=\"'flex flex-col gap-3 p-4 ' + modal.contentClass\">\r\n  @if (permissionGroup(); as group) {\r\n    <div\r\n      class=\"flex items-center justify-between border rounded-lg p-3 border-surface mb-4\"\r\n    >\r\n      <span class=\"text-sm font-medium\">{{\r\n        \"permissions.selectAll\" | transloco\r\n      }}</span>\r\n      <mt-toggle-field\r\n        [(ngModel)]=\"toggleAll\"\r\n        (onChange)=\"selectAll()\"\r\n      ></mt-toggle-field>\r\n    </div>\r\n    @for (action of group.actions; track trackByActionId($index, action)) {\r\n      <div\r\n        class=\"flex items-center justify-between border rounded-lg p-3 border-surface\"\r\n      >\r\n        <span class=\"text-sm font-medium\">{{ action.name }}</span>\r\n        <mt-toggle-field\r\n          [formControl]=\"getControl(action.id)\"\r\n        ></mt-toggle-field>\r\n      </div>\r\n    }\r\n  }\r\n</div>\r\n<div [class]=\"modal.footerClass\">\r\n  <mt-button\r\n    [label]=\"'save'\"\r\n    (click)=\"onSave()\"\r\n    [loading]=\"addPermissionsLoading()\"\r\n  />\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: ToggleField, selector: "mt-toggle-field", inputs: ["label", "labelPosition", "placeholder", "readonly", "pInputs", "required", "toggleShape", "size", "icon", "descriptionCard"], outputs: ["onChange"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PermissionsEditDialog, decorators: [{
+            type: Component,
+            args: [{ selector: 'mt-permissions-edit-dialog', standalone: true, imports: [
+                        CommonModule,
+                        ReactiveFormsModule,
+                        ToggleField,
+                        TranslocoModule,
+                        FormsModule,
+                        Button,
+                    ], template: "<div [class]=\"'flex flex-col gap-3 p-4 ' + modal.contentClass\">\r\n  @if (permissionGroup(); as group) {\r\n    <div\r\n      class=\"flex items-center justify-between border rounded-lg p-3 border-surface mb-4\"\r\n    >\r\n      <span class=\"text-sm font-medium\">{{\r\n        \"permissions.selectAll\" | transloco\r\n      }}</span>\r\n      <mt-toggle-field\r\n        [(ngModel)]=\"toggleAll\"\r\n        (onChange)=\"selectAll()\"\r\n      ></mt-toggle-field>\r\n    </div>\r\n    @for (action of group.actions; track trackByActionId($index, action)) {\r\n      <div\r\n        class=\"flex items-center justify-between border rounded-lg p-3 border-surface\"\r\n      >\r\n        <span class=\"text-sm font-medium\">{{ action.name }}</span>\r\n        <mt-toggle-field\r\n          [formControl]=\"getControl(action.id)\"\r\n        ></mt-toggle-field>\r\n      </div>\r\n    }\r\n  }\r\n</div>\r\n<div [class]=\"modal.footerClass\">\r\n  <mt-button\r\n    [label]=\"'save'\"\r\n    (click)=\"onSave()\"\r\n    [loading]=\"addPermissionsLoading()\"\r\n  />\r\n</div>\r\n" }]
+        }], ctorParameters: () => [], propDecorators: { permissionGroup: [{ type: i0.Input, args: [{ isSignal: true, alias: "permissionGroup", required: false }] }], levelId: [{ type: i0.Input, args: [{ isSignal: true, alias: "levelId", required: true }] }], roleValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "roleValue", required: true }] }], isGroup: [{ type: i0.Input, args: [{ isSignal: true, alias: "isGroup", required: true }] }], closeDialog: [{ type: i0.Output, args: ["closeDialog"] }] } });
+
+class PermissionsPage {
+    permissionsFacade = inject(PermissionsFacade);
+    accessibilitiesFacade = inject(AccessibilitiesFacade);
+    route = inject(ActivatedRoute);
+    router = inject(Router);
+    translocoService = inject(TranslocoService);
+    modal = inject(ModalService);
+    destroyRef = inject(DestroyRef);
+    defaultLevelName = 'Project';
+    levelRoles = this.permissionsFacade.selectors.roles;
+    selectedRoleValue = this.permissionsFacade.selectors.selectedRoleValue;
+    selectedRole = linkedSignal(this.selectedRoleValue, ...(ngDevMode ? [{ debugName: "selectedRole" }] : []));
+    selectedGroupValue = this.permissionsFacade.selectors.selectedGroupValue;
+    selectedGroup = linkedSignal(this.selectedGroupValue, ...(ngDevMode ? [{ debugName: "selectedGroup" }] : []));
+    permissions = this.permissionsFacade.selectors.permissions;
+    groupPermissions = this.permissionsFacade.selectors.groupPermissions;
+    loading = this.permissionsFacade.selectors.loading;
+    permissionsLoading = this.permissionsFacade.selectors.permissionsLoading;
+    levelId = this.permissionsFacade.selectors.levelId;
+    groups = this.accessibilitiesFacade.groups;
+    allPermissionsToggle = new FormControl(false);
+    groupOrRoleId = computed(() => {
+        const idParam = this.route.snapshot.firstChild?.paramMap.get('id');
+        return idParam ? idParam : '';
+    }, ...(ngDevMode ? [{ debugName: "groupOrRoleId" }] : []));
+    selectedTabFromParams = computed(() => {
+        const idParam = this.route.snapshot.firstChild?.data['selectedTab'];
+        return idParam ? idParam : 'roles';
+    }, ...(ngDevMode ? [{ debugName: "selectedTabFromParams" }] : []));
+    selectedTab = linkedSignal(this.selectedTabFromParams, ...(ngDevMode ? [{ debugName: "selectedTab" }] : []));
+    tabsList = signal([
+        {
+            label: this.translocoService.translate('permissions.roles'),
+            value: 'roles',
+        },
+        {
+            label: this.translocoService.translate('permissions.groups'),
+            value: 'groups',
+        },
+    ], ...(ngDevMode ? [{ debugName: "tabsList" }] : []));
+    firstLoad = signal(true, ...(ngDevMode ? [{ debugName: "firstLoad" }] : []));
+    constructor() {
+        effect(() => {
+            const allEnabled = this.isAllPermissionsEnabled();
+            this.allPermissionsToggle.setValue(allEnabled, { emitEvent: false });
+        });
+        effect(() => {
+            if (this.selectedTab() == 'roles') {
+                if (this.levelRoles().length == 0) {
+                    if (this.firstLoad() && !this.loading()) {
+                        this.permissionsFacade.loadRoles();
+                        this.firstLoad.set(false);
+                    }
+                    return;
+                }
+            }
+            if (this.groupOrRoleId() && this.groupPermissions().length == 0) {
+                this.selectedGroup.set(+this.groupOrRoleId());
+                this.permissionsFacade.selectGroup(+this.groupOrRoleId());
+            }
+            if (this.permissions().length == 0 && this.selectedTab() == 'roles') {
+                if (this.groupOrRoleId() && this.levelRoles().length > 0) {
+                    const role = this.levelRoles()
+                        .map((levelRoles) => levelRoles.roles)
+                        .flat()
+                        .find((r) => r?.value === this.groupOrRoleId()?.toString());
+                    if (role) {
+                        this.selectedRole.set(this.groupOrRoleId().toString());
+                        this.permissionsFacade.selectRole(role.value);
+                    }
+                }
+            }
+        });
+    }
+    ngOnInit() {
+        this.permissionsFacade.selectRole('');
+        this.route.parent?.paramMap
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe((params) => {
+            const levelIdFromRoute = params.get('levelId');
+            if (levelIdFromRoute) {
+                this.permissionsFacade.reset();
+                this.permissionsFacade.setModuleInfo('level', levelIdFromRoute);
+                this.permissionsFacade.loadRoles();
+            }
+        });
+        this.permissionsFacade.loadRoles();
+        this.accessibilitiesFacade.getGroups();
+        this.allPermissionsToggle.valueChanges
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe((value) => {
+            if (value !== null) {
+                this.onToggleAllLevel(this.defaultLevelName, value);
+            }
+        });
+    }
+    selectRole(roleValue) {
+        this.router.navigate(['roles', roleValue], { relativeTo: this.route });
+        this.permissionsFacade.selectRole(roleValue);
+    }
+    selectGroup(groupId) {
+        this.router.navigate(['groups', groupId], { relativeTo: this.route });
+        this.permissionsFacade.selectGroup(groupId);
+    }
+    openPermissionDialog(group) {
+        if (this.levelId() && (this.selectedRoleValue() || this.selectedGroup())) {
+            this.modal.openModal(PermissionsEditDialog, 'drawer', {
+                header: this.translocoService.translate('permissions.setPermissions'),
+                position: 'end',
+                styleClass: '!w-[24%] !absolute !shadow-none',
+                appendTo: 'page-content',
+                inputValues: {
+                    permissionGroup: group,
+                    levelId: this.levelId(),
+                    roleValue: this.selectedTab() == 'roles'
+                        ? this.selectedRoleValue()
+                        : this.selectedGroup(),
+                    isGroup: this.selectedTab() != 'roles',
+                },
+                dismissible: true,
+            });
+        }
+    }
+    onToggleAllLevel(levelName, enabled) {
+        const levelId = this.levelId();
+        const roleValue = this.selectedRoleValue();
+        if (levelId) {
+            if (this.selectedTab() != 'roles') {
+                this.permissionsFacade.toggleAllGroupPermissions(levelId, this.selectedGroup().toString(), enabled);
+                return;
+            }
+            else {
+                if (!!roleValue) {
+                    this.permissionsFacade.toggleAllLevelPermissions(roleValue, levelId, levelName, enabled);
+                }
+            }
+        }
+    }
+    isAllPermissionsEnabled() {
+        const groupsLogs = this.groupPermissions()
+            .map((group) => group.logs)
+            .flat();
+        const perms = (this.selectedTab() == 'roles' ? this.permissions() : groupsLogs) || [];
+        if (perms.length === 0)
+            return false;
+        return perms.every((log) => log.actions.every((action) => action.isSelected));
+    }
+    trackByRoleValue(_index, role) {
+        return role.value;
+    }
+    onTabChange($event) {
+        if ($event == 'roles') {
+            this.router.navigate(['roles'], { relativeTo: this.route });
+        }
+        else if ($event == 'groups') {
+            this.router.navigate(['groups'], { relativeTo: this.route });
+        }
+    }
+    ngOnDestroy() {
+        this.permissionsFacade.reset();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PermissionsPage, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: PermissionsPage, isStandalone: true, selector: "mt-permissions-page", ngImport: i0, template: "<div id=\"permissions-page-card\" class=\"flex gap-4 p-1\">\r\n  <div class=\"w-1/5 flex-shrink-0\">\r\n    <mt-card class=\"h-full flex flex-col\">\r\n      <ng-template #headless>\r\n        <div class=\"flex flex-col h-full\">\r\n          <div\r\n            class=\"p-4 pb-0 bg-surface-50 rounded-t-2xl border-b border-surface\"\r\n          >\r\n            <h2 class=\"text-lg font-semibold mb-3\">\r\n              {{ \"permissions.rolesAndGroups\" | transloco }}\r\n            </h2>\r\n\r\n            <mt-tabs\r\n              [(active)]=\"selectedTab\"\r\n              [options]=\"tabsList()\"\r\n              size=\"large\"\r\n              (onChange)=\"onTabChange($event)\"\r\n            />\r\n          </div>\r\n\r\n          <div class=\"flex-1 overflow-y-auto p-4\">\r\n            @if (loading()) {\r\n              <p-skeleton class=\"my-4\" height=\"4rem\" />\r\n              <p-skeleton class=\"my-4\" height=\"4rem\" />\r\n              <p-skeleton class=\"my-4\" height=\"4rem\" />\r\n            } @else {\r\n              @if (selectedTab() === \"roles\") {\r\n                @for (level of levelRoles(); track level.levelKey) {\r\n                  <div class=\"flex flex-col gap-2 mb-4\">\r\n                    <h2 class=\"font-semibold\">{{ level.level }}</h2>\r\n                    @for (role of level.roles; track role.value) {\r\n                      <div\r\n                        class=\"p-3 border-2 border-dashed border-gray-300 rounded-lg cursor-pointer transition-colors flex items-center gap-3\"\r\n                        [class.bg-primary-50]=\"selectedRole() === role.value\"\r\n                        [class.hover:bg-surface]=\"selectedRole() !== role.value\"\r\n                        [class.border-primary-400]=\"\r\n                          selectedRole() === role.value\r\n                        \"\r\n                        [style.--p-avatar-background]=\"\r\n                          selectedRole() === role.value\r\n                            ? 'var(--p-primary-color)'\r\n                            : 'var(--p-surface-100)'\r\n                        \"\r\n                        [style.--p-avatar-color]=\"\r\n                          selectedRole() === role.value ? '#ffffff' : ''\r\n                        \"\r\n                        (click)=\"selectRole(role.value)\"\r\n                      >\r\n                        <mt-avatar [icon]=\"'user.user-check-01'\" shape=\"square\">\r\n                        </mt-avatar>\r\n                        <div class=\"flex-1 min-w-0\">\r\n                          <div class=\"font-medium truncate\">\r\n                            {{ role.name }}\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                    } @empty {\r\n                      <div\r\n                        class=\"flex items-center justify-center h-full text-muted-color\"\r\n                      >\r\n                        {{ \"permissions.noRolesFound\" | transloco }}\r\n                      </div>\r\n                    }\r\n                  </div>\r\n                } @empty {\r\n                  <div\r\n                    class=\"flex items-center justify-center h-full text-muted-color\"\r\n                  >\r\n                    {{ \"permissions.noLevelRolesFound\" | transloco }}\r\n                  </div>\r\n                }\r\n              } @else {\r\n                <div class=\"flex flex-col gap-2 mb-4\">\r\n                  @for (group of groups(); track group.name) {\r\n                    <div\r\n                      class=\"p-3 border-2 border-dashed border-gray-300 rounded-lg cursor-pointer transition-colors flex items-center gap-3\"\r\n                      [class.bg-primary-50]=\"selectedGroup() === group.id\"\r\n                      [class.hover:bg-surface]=\"selectedGroup() !== group.id\"\r\n                      [class.border-primary-400]=\"selectedGroup() === group.id\"\r\n                      [style.--p-avatar-background]=\"\r\n                        selectedGroup() === group.id\r\n                          ? 'var(--p-primary-color)'\r\n                          : 'var(--p-surface-100)'\r\n                      \"\r\n                      [style.--p-avatar-color]=\"\r\n                        selectedGroup() === group.id ? '#ffffff' : ''\r\n                      \"\r\n                      (click)=\"selectGroup(group.id)\"\r\n                    >\r\n                      <mt-avatar [icon]=\"'user.users-check'\" shape=\"square\">\r\n                      </mt-avatar>\r\n                      <div class=\"flex-1 min-w-0\">\r\n                        <div class=\"font-medium truncate\">{{ group.name }}</div>\r\n                      </div>\r\n                    </div>\r\n                  } @empty {\r\n                    <div\r\n                      class=\"flex items-center justify-center h-full text-muted-color\"\r\n                    >\r\n                      {{ \"permissions.noGroupsFound\" | transloco }}\r\n                    </div>\r\n                  }\r\n                </div>\r\n              }\r\n            }\r\n          </div>\r\n        </div>\r\n      </ng-template>\r\n    </mt-card>\r\n  </div>\r\n\r\n  <div class=\"min-w-0 w-1/2\">\r\n    @if (!selectedRole() && !selectedGroup()) {\r\n      <mt-card class=\"h-full\">\r\n        <ng-template #headless>\r\n          <div class=\"flex items-center justify-center h-full text-muted-color\">\r\n            {{ \"permissions.selectRoleToViewPermissions\" | transloco }}\r\n          </div>\r\n        </ng-template>\r\n      </mt-card>\r\n    } @else {\r\n      <mt-card class=\"h-full\">\r\n        <div class=\"flex flex-col h-full\">\r\n          <ng-template #headless>\r\n            <div class=\"p-4 pb-2 mb-5 border-b border-surface\">\r\n              <h2 class=\"text-lg font-semibold mb-3\">\r\n                {{\r\n                  (selectedTab() === \"roles\"\r\n                    ? \"permissions.levelPermissions\"\r\n                    : \"permissions.groupsPermissions\"\r\n                  ) | transloco\r\n                }}\r\n              </h2>\r\n            </div>\r\n            @if (permissionsLoading()) {\r\n              <div class=\"mx-4\">\r\n                <p-skeleton class=\"my-4\" height=\"4rem\" />\r\n                <p-skeleton class=\"my-4\" height=\"4rem\" />\r\n                <p-skeleton class=\"my-4\" height=\"4rem\" />\r\n              </div>\r\n            } @else {\r\n              <div\r\n                class=\"mb-5 p-3 mx-4 rounded-lg border-1 border-surface flex items-center justify-between\"\r\n              >\r\n                <div class=\"flex items-center gap-3\">\r\n                  <mt-avatar\r\n                    [icon]=\"'security.lock-unlocked-01'\"\r\n                    shape=\"square\"\r\n                    size=\"large\"\r\n                    [style.--p-avatar-background]=\"\r\n                      'var(--p-' + 'surface' + '-100)'\r\n                    \"\r\n                    [style.--p-avatar-color]=\"'var(--p-' + 'primary' + '-600)'\"\r\n                  >\r\n                  </mt-avatar>\r\n                  <div>\r\n                    <div class=\"text-sm font-semibold\">\r\n                      {{\r\n                        (selectedTab() === \"roles\"\r\n                          ? \"permissions.setAllProjectPermissions\"\r\n                          : \"permissions.setAllGroupPermissions\"\r\n                        ) | transloco\r\n                      }}\r\n                    </div>\r\n                    <div class=\"text-xs text-muted-color\">\r\n                      {{ \"permissions.recommendedForSimpleForms\" | transloco }}\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n                <mt-toggle-field\r\n                  [formControl]=\"allPermissionsToggle\"\r\n                ></mt-toggle-field>\r\n              </div>\r\n\r\n              <div class=\"flex-1 px-4 overflow-y-auto border-t border-surface\">\r\n                <div class=\"space-y-3 my-5\">\r\n                  @if (selectedTab() === \"roles\") {\r\n                    @for (group of permissions(); track group.name) {\r\n                      <div\r\n                        class=\"p-2 border-1 border-surface rounded-lg flex items-center justify-between hover:bg-surface-100 transition-colors\"\r\n                      >\r\n                        <div class=\"flex items-center gap-3\">\r\n                          <mt-avatar\r\n                            [icon]=\"'editor.dotpoints-02'\"\r\n                            shape=\"square\"\r\n                            size=\"normal\"\r\n                            [style.--p-avatar-background]=\"\r\n                              'var(--p-' + 'surface' + '-100)'\r\n                            \"\r\n                            [style.--p-avatar-color]=\"\r\n                              'var(--p-' + 'primary' + '-600)'\r\n                            \"\r\n                          >\r\n                          </mt-avatar>\r\n                          <span class=\"text-sm\">{{ group.name }}</span>\r\n                        </div>\r\n                        <mt-button\r\n                          [text]=\"true\"\r\n                          icon=\"custom.pencil\"\r\n                          severity=\"primary\"\r\n                          (click)=\"openPermissionDialog(group)\"\r\n                        >\r\n                        </mt-button>\r\n                      </div>\r\n                    } @empty {\r\n                      <div\r\n                        class=\"flex items-center justify-center h-full text-muted-color\"\r\n                      >\r\n                        {{ \"permissions.noPermissionsFound\" | transloco }}\r\n                      </div>\r\n                    }\r\n                  } @else {\r\n                    @for (group of groupPermissions(); track group.levelName) {\r\n                      <div class=\"flex flex-col justify-between gap-3\">\r\n                        @for (log of group.logs; track log.name) {\r\n                          <div\r\n                            class=\"p-2 border-1 border-surface rounded-lg flex items-center justify-between hover:bg-surface-100 transition-colors\"\r\n                          >\r\n                            <div class=\"flex items-center gap-3\">\r\n                              <mt-avatar\r\n                                [icon]=\"'editor.dotpoints-02'\"\r\n                                shape=\"square\"\r\n                                size=\"normal\"\r\n                                [style.--p-avatar-background]=\"\r\n                                  'var(--p-' + 'surface' + '-100)'\r\n                                \"\r\n                                [style.--p-avatar-color]=\"\r\n                                  'var(--p-' + 'primary' + '-600)'\r\n                                \"\r\n                              >\r\n                              </mt-avatar>\r\n                              <span class=\"text-sm\">{{ log.name }}</span>\r\n                            </div>\r\n                            <mt-button\r\n                              [text]=\"true\"\r\n                              icon=\"custom.pencil\"\r\n                              severity=\"primary\"\r\n                              (click)=\"openPermissionDialog(log)\"\r\n                            >\r\n                            </mt-button>\r\n                          </div>\r\n                        } @empty {\r\n                          <div\r\n                            class=\"flex items-center justify-center h-full text-muted-color\"\r\n                          >\r\n                            {{\r\n                              \"permissions.noPermissionsFoundForSelectedGroup\"\r\n                                | transloco\r\n                            }}\r\n                          </div>\r\n                        }\r\n                      </div>\r\n                    } @empty {\r\n                      <div\r\n                        class=\"flex items-center justify-center h-full text-muted-color\"\r\n                      >\r\n                        {{ \"permissions.noPermissionsFound\" | transloco }}\r\n                      </div>\r\n                    }\r\n                  }\r\n                </div>\r\n              </div>\r\n            }\r\n          </ng-template>\r\n        </div>\r\n      </mt-card>\r\n    }\r\n  </div>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: Card, selector: "mt-card", inputs: ["class", "title", "paddingless"] }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: ToggleField, selector: "mt-toggle-field", inputs: ["label", "labelPosition", "placeholder", "readonly", "pInputs", "required", "toggleShape", "size", "icon", "descriptionCard"], outputs: ["onChange"] }, { kind: "ngmodule", type: TranslocoModule }, { kind: "component", type: Avatar, selector: "mt-avatar", inputs: ["label", "icon", "image", "styleClass", "size", "shape", "badge", "badgeSize", "badgeSeverity"], outputs: ["onImageError"] }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i2$1.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "component", type: Tabs, selector: "mt-tabs", inputs: ["options", "optionLabel", "optionValue", "active", "size", "fluid", "disabled"], outputs: ["activeChange", "onChange"] }, { kind: "pipe", type: i2.TranslocoPipe, name: "transloco" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: PermissionsPage, decorators: [{
+            type: Component,
+            args: [{ selector: 'mt-permissions-page', imports: [
+                        CommonModule,
+                        ReactiveFormsModule,
+                        Card,
+                        Button,
+                        ToggleField,
+                        TranslocoModule,
+                        Avatar,
+                        SkeletonModule,
+                        Tabs,
+                    ], template: "<div id=\"permissions-page-card\" class=\"flex gap-4 p-1\">\r\n  <div class=\"w-1/5 flex-shrink-0\">\r\n    <mt-card class=\"h-full flex flex-col\">\r\n      <ng-template #headless>\r\n        <div class=\"flex flex-col h-full\">\r\n          <div\r\n            class=\"p-4 pb-0 bg-surface-50 rounded-t-2xl border-b border-surface\"\r\n          >\r\n            <h2 class=\"text-lg font-semibold mb-3\">\r\n              {{ \"permissions.rolesAndGroups\" | transloco }}\r\n            </h2>\r\n\r\n            <mt-tabs\r\n              [(active)]=\"selectedTab\"\r\n              [options]=\"tabsList()\"\r\n              size=\"large\"\r\n              (onChange)=\"onTabChange($event)\"\r\n            />\r\n          </div>\r\n\r\n          <div class=\"flex-1 overflow-y-auto p-4\">\r\n            @if (loading()) {\r\n              <p-skeleton class=\"my-4\" height=\"4rem\" />\r\n              <p-skeleton class=\"my-4\" height=\"4rem\" />\r\n              <p-skeleton class=\"my-4\" height=\"4rem\" />\r\n            } @else {\r\n              @if (selectedTab() === \"roles\") {\r\n                @for (level of levelRoles(); track level.levelKey) {\r\n                  <div class=\"flex flex-col gap-2 mb-4\">\r\n                    <h2 class=\"font-semibold\">{{ level.level }}</h2>\r\n                    @for (role of level.roles; track role.value) {\r\n                      <div\r\n                        class=\"p-3 border-2 border-dashed border-gray-300 rounded-lg cursor-pointer transition-colors flex items-center gap-3\"\r\n                        [class.bg-primary-50]=\"selectedRole() === role.value\"\r\n                        [class.hover:bg-surface]=\"selectedRole() !== role.value\"\r\n                        [class.border-primary-400]=\"\r\n                          selectedRole() === role.value\r\n                        \"\r\n                        [style.--p-avatar-background]=\"\r\n                          selectedRole() === role.value\r\n                            ? 'var(--p-primary-color)'\r\n                            : 'var(--p-surface-100)'\r\n                        \"\r\n                        [style.--p-avatar-color]=\"\r\n                          selectedRole() === role.value ? '#ffffff' : ''\r\n                        \"\r\n                        (click)=\"selectRole(role.value)\"\r\n                      >\r\n                        <mt-avatar [icon]=\"'user.user-check-01'\" shape=\"square\">\r\n                        </mt-avatar>\r\n                        <div class=\"flex-1 min-w-0\">\r\n                          <div class=\"font-medium truncate\">\r\n                            {{ role.name }}\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                    } @empty {\r\n                      <div\r\n                        class=\"flex items-center justify-center h-full text-muted-color\"\r\n                      >\r\n                        {{ \"permissions.noRolesFound\" | transloco }}\r\n                      </div>\r\n                    }\r\n                  </div>\r\n                } @empty {\r\n                  <div\r\n                    class=\"flex items-center justify-center h-full text-muted-color\"\r\n                  >\r\n                    {{ \"permissions.noLevelRolesFound\" | transloco }}\r\n                  </div>\r\n                }\r\n              } @else {\r\n                <div class=\"flex flex-col gap-2 mb-4\">\r\n                  @for (group of groups(); track group.name) {\r\n                    <div\r\n                      class=\"p-3 border-2 border-dashed border-gray-300 rounded-lg cursor-pointer transition-colors flex items-center gap-3\"\r\n                      [class.bg-primary-50]=\"selectedGroup() === group.id\"\r\n                      [class.hover:bg-surface]=\"selectedGroup() !== group.id\"\r\n                      [class.border-primary-400]=\"selectedGroup() === group.id\"\r\n                      [style.--p-avatar-background]=\"\r\n                        selectedGroup() === group.id\r\n                          ? 'var(--p-primary-color)'\r\n                          : 'var(--p-surface-100)'\r\n                      \"\r\n                      [style.--p-avatar-color]=\"\r\n                        selectedGroup() === group.id ? '#ffffff' : ''\r\n                      \"\r\n                      (click)=\"selectGroup(group.id)\"\r\n                    >\r\n                      <mt-avatar [icon]=\"'user.users-check'\" shape=\"square\">\r\n                      </mt-avatar>\r\n                      <div class=\"flex-1 min-w-0\">\r\n                        <div class=\"font-medium truncate\">{{ group.name }}</div>\r\n                      </div>\r\n                    </div>\r\n                  } @empty {\r\n                    <div\r\n                      class=\"flex items-center justify-center h-full text-muted-color\"\r\n                    >\r\n                      {{ \"permissions.noGroupsFound\" | transloco }}\r\n                    </div>\r\n                  }\r\n                </div>\r\n              }\r\n            }\r\n          </div>\r\n        </div>\r\n      </ng-template>\r\n    </mt-card>\r\n  </div>\r\n\r\n  <div class=\"min-w-0 w-1/2\">\r\n    @if (!selectedRole() && !selectedGroup()) {\r\n      <mt-card class=\"h-full\">\r\n        <ng-template #headless>\r\n          <div class=\"flex items-center justify-center h-full text-muted-color\">\r\n            {{ \"permissions.selectRoleToViewPermissions\" | transloco }}\r\n          </div>\r\n        </ng-template>\r\n      </mt-card>\r\n    } @else {\r\n      <mt-card class=\"h-full\">\r\n        <div class=\"flex flex-col h-full\">\r\n          <ng-template #headless>\r\n            <div class=\"p-4 pb-2 mb-5 border-b border-surface\">\r\n              <h2 class=\"text-lg font-semibold mb-3\">\r\n                {{\r\n                  (selectedTab() === \"roles\"\r\n                    ? \"permissions.levelPermissions\"\r\n                    : \"permissions.groupsPermissions\"\r\n                  ) | transloco\r\n                }}\r\n              </h2>\r\n            </div>\r\n            @if (permissionsLoading()) {\r\n              <div class=\"mx-4\">\r\n                <p-skeleton class=\"my-4\" height=\"4rem\" />\r\n                <p-skeleton class=\"my-4\" height=\"4rem\" />\r\n                <p-skeleton class=\"my-4\" height=\"4rem\" />\r\n              </div>\r\n            } @else {\r\n              <div\r\n                class=\"mb-5 p-3 mx-4 rounded-lg border-1 border-surface flex items-center justify-between\"\r\n              >\r\n                <div class=\"flex items-center gap-3\">\r\n                  <mt-avatar\r\n                    [icon]=\"'security.lock-unlocked-01'\"\r\n                    shape=\"square\"\r\n                    size=\"large\"\r\n                    [style.--p-avatar-background]=\"\r\n                      'var(--p-' + 'surface' + '-100)'\r\n                    \"\r\n                    [style.--p-avatar-color]=\"'var(--p-' + 'primary' + '-600)'\"\r\n                  >\r\n                  </mt-avatar>\r\n                  <div>\r\n                    <div class=\"text-sm font-semibold\">\r\n                      {{\r\n                        (selectedTab() === \"roles\"\r\n                          ? \"permissions.setAllProjectPermissions\"\r\n                          : \"permissions.setAllGroupPermissions\"\r\n                        ) | transloco\r\n                      }}\r\n                    </div>\r\n                    <div class=\"text-xs text-muted-color\">\r\n                      {{ \"permissions.recommendedForSimpleForms\" | transloco }}\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n                <mt-toggle-field\r\n                  [formControl]=\"allPermissionsToggle\"\r\n                ></mt-toggle-field>\r\n              </div>\r\n\r\n              <div class=\"flex-1 px-4 overflow-y-auto border-t border-surface\">\r\n                <div class=\"space-y-3 my-5\">\r\n                  @if (selectedTab() === \"roles\") {\r\n                    @for (group of permissions(); track group.name) {\r\n                      <div\r\n                        class=\"p-2 border-1 border-surface rounded-lg flex items-center justify-between hover:bg-surface-100 transition-colors\"\r\n                      >\r\n                        <div class=\"flex items-center gap-3\">\r\n                          <mt-avatar\r\n                            [icon]=\"'editor.dotpoints-02'\"\r\n                            shape=\"square\"\r\n                            size=\"normal\"\r\n                            [style.--p-avatar-background]=\"\r\n                              'var(--p-' + 'surface' + '-100)'\r\n                            \"\r\n                            [style.--p-avatar-color]=\"\r\n                              'var(--p-' + 'primary' + '-600)'\r\n                            \"\r\n                          >\r\n                          </mt-avatar>\r\n                          <span class=\"text-sm\">{{ group.name }}</span>\r\n                        </div>\r\n                        <mt-button\r\n                          [text]=\"true\"\r\n                          icon=\"custom.pencil\"\r\n                          severity=\"primary\"\r\n                          (click)=\"openPermissionDialog(group)\"\r\n                        >\r\n                        </mt-button>\r\n                      </div>\r\n                    } @empty {\r\n                      <div\r\n                        class=\"flex items-center justify-center h-full text-muted-color\"\r\n                      >\r\n                        {{ \"permissions.noPermissionsFound\" | transloco }}\r\n                      </div>\r\n                    }\r\n                  } @else {\r\n                    @for (group of groupPermissions(); track group.levelName) {\r\n                      <div class=\"flex flex-col justify-between gap-3\">\r\n                        @for (log of group.logs; track log.name) {\r\n                          <div\r\n                            class=\"p-2 border-1 border-surface rounded-lg flex items-center justify-between hover:bg-surface-100 transition-colors\"\r\n                          >\r\n                            <div class=\"flex items-center gap-3\">\r\n                              <mt-avatar\r\n                                [icon]=\"'editor.dotpoints-02'\"\r\n                                shape=\"square\"\r\n                                size=\"normal\"\r\n                                [style.--p-avatar-background]=\"\r\n                                  'var(--p-' + 'surface' + '-100)'\r\n                                \"\r\n                                [style.--p-avatar-color]=\"\r\n                                  'var(--p-' + 'primary' + '-600)'\r\n                                \"\r\n                              >\r\n                              </mt-avatar>\r\n                              <span class=\"text-sm\">{{ log.name }}</span>\r\n                            </div>\r\n                            <mt-button\r\n                              [text]=\"true\"\r\n                              icon=\"custom.pencil\"\r\n                              severity=\"primary\"\r\n                              (click)=\"openPermissionDialog(log)\"\r\n                            >\r\n                            </mt-button>\r\n                          </div>\r\n                        } @empty {\r\n                          <div\r\n                            class=\"flex items-center justify-center h-full text-muted-color\"\r\n                          >\r\n                            {{\r\n                              \"permissions.noPermissionsFoundForSelectedGroup\"\r\n                                | transloco\r\n                            }}\r\n                          </div>\r\n                        }\r\n                      </div>\r\n                    } @empty {\r\n                      <div\r\n                        class=\"flex items-center justify-center h-full text-muted-color\"\r\n                      >\r\n                        {{ \"permissions.noPermissionsFound\" | transloco }}\r\n                      </div>\r\n                    }\r\n                  }\r\n                </div>\r\n              </div>\r\n            }\r\n          </ng-template>\r\n        </div>\r\n      </mt-card>\r\n    }\r\n  </div>\r\n</div>\r\n" }]
+        }], ctorParameters: () => [] });
+
+// store/index.ts
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { LoadGroupPermissions, LoadGroupPermissionsSuccess, LoadPermissions, LoadPermissionsFail, LoadPermissionsSuccess, LoadRoles, LoadRolesFail, LoadRolesSuccess, ModuleType, PermissionsEditDialog, PermissionsFacade, PermissionsPage, PermissionsState, Reset, SelectGroup, SelectRole, SetModuleInfo, ToggleAllGroupPermissions, ToggleAllLevelPermissions, UpdateGroupPermission, UpdateGroupPermissionLocally, UpdatePermission, UpdatePermissionFail, UpdatePermissionLocally, UpdatePermissionSuccess };
+//# sourceMappingURL=masterteam-permissions.mjs.map