@jetbrains/ring-ui 5.1.23 → 5.1.24

package/components/permissions/permissions__cache.d.ts

@@ -0,0 +1,93 @@
+export interface PermissionType {
+    key: string;
+}
+export interface Project {
+    id: string;
+}
+export interface Permission {
+    permission: PermissionType;
+    global?: boolean | null | undefined;
+    projects?: readonly Project[] | null | undefined;
+}
+interface PermissionCacheItem {
+    global: boolean | null | undefined;
+    projectIdSet: Record<string, boolean> | null;
+}
+/**
+ * Converts an array of cached permissions to a a map of a permission key
+ * to the respective cached permission.
+ *
+ * @param { {
+ *   permission: {key: string},
+ *   global: boolean?,
+ *   projects: {id: string}[]?
+ * }[] } permissions
+ * @param {function} namesConverter a function, which maps a server-side permission name to client-side permission name
+ * @return {object} permission cache
+ * @private
+ */
+export default class PermissionCache {
+    static GLOBAL_PROJECT_ID: string;
+    /**
+     * Convert an array of projects to a set of project ids.
+     *
+     * @param {object[]=} projects
+     * @return {object} a set of project ids
+     * @private
+     */
+    private static _toProjectIdSet;
+    namesConverter: (name: string) => string | null | undefined;
+    constructor(permissions?: readonly Permission[] | null | undefined, namesConverter?: ((name: string) => string | null | undefined) | null | undefined);
+    private _permissions?;
+    permissionCache?: Record<string, PermissionCacheItem>;
+    set(permissions?: readonly Permission[] | null | undefined): this;
+    get(): readonly Permission[] | null | undefined;
+    /**
+     * Checks if the current user has the given permissions in the project with the given id.
+     *
+     * @param {string} permissions  space separated list of permissions
+     * @param {string=} projectId     optional projectId. If absent the method checks
+     *  if the given permission is granted in any project.
+     *
+     * @return {boolean}
+     */
+    has(permissions?: string | null | undefined, projectId?: string | null | undefined): boolean;
+    /**
+     * Lexes permission query string to an array of lexems.
+     *
+     * @param {string} query
+     * @return {string[]}
+     */
+    lex(query?: string | null | undefined): string[];
+    /**
+     * @param {string[]} lexems
+     * @param {string=} projectId
+     * @return {boolean}
+     */
+    or(lexems: string[], projectId?: string | null | undefined): boolean;
+    /**
+     * @param {string[]} lexems
+     * @param {string=} projectId
+     * @return {boolean}
+     */
+    and(lexems: string[], projectId?: string | null | undefined): boolean;
+    /**
+     * @param {string[]} lexems
+     * @param {string=} projectId
+     * @return {boolean}
+     */
+    not(lexems: string[], projectId?: string | null | undefined): boolean;
+    /**
+     * @param {string[]} lexems
+     * @param {string=} projectId
+     * @return {boolean}
+     */
+    term(lexems: string[], projectId?: string | null | undefined): boolean;
+    /**
+     * @param {string} permissionName
+     * @param {string=} projectId
+     * @return {boolean}
+     */
+    testPermission(permissionName: string, projectId?: string | null | undefined): boolean;
+}
+export {};

package/components/permissions/permissions__cache.js

@@ -0,0 +1,228 @@
+/**
+ * Converts an array of cached permissions to a a map of a permission key
+ * to the respective cached permission.
+ *
+ * @param { {
+ *   permission: {key: string},
+ *   global: boolean?,
+ *   projects: {id: string}[]?
+ * }[] } permissions
+ * @param {function} namesConverter a function, which maps a server-side permission name to client-side permission name
+ * @return {object} permission cache
+ * @private
+ */
+export default class PermissionCache {
+    static GLOBAL_PROJECT_ID = 'global';
+    /**
+     * Convert an array of projects to a set of project ids.
+     *
+     * @param {object[]=} projects
+     * @return {object} a set of project ids
+     * @private
+     */
+    static _toProjectIdSet(projects) {
+        let projectIdSet = null;
+        if (projects) {
+            projectIdSet = {};
+            for (let i = 0; i < projects.length; i++) {
+                projectIdSet[projects[i].id] = true;
+            }
+        }
+        return projectIdSet;
+    }
+    namesConverter;
+    constructor(permissions, namesConverter) {
+        this.namesConverter = namesConverter || (key => key);
+        this.set(permissions);
+    }
+    _permissions;
+    permissionCache;
+    set(permissions) {
+        const permissionCache = (permissions || []).reduce((_permissionCache, permission) => {
+            const key = this.namesConverter(permission.permission.key);
+            if (key) {
+                _permissionCache[key] = {
+                    global: permission.global,
+                    projectIdSet: this.constructor._toProjectIdSet(permission.projects)
+                };
+            }
+            return _permissionCache;
+        }, {});
+        this._permissions = permissions;
+        this.permissionCache = permissionCache;
+        return this;
+    }
+    get() {
+        return this._permissions;
+    }
+    /**
+     * Checks if the current user has the given permissions in the project with the given id.
+     *
+     * @param {string} permissions  space separated list of permissions
+     * @param {string=} projectId     optional projectId. If absent the method checks
+     *  if the given permission is granted in any project.
+     *
+     * @return {boolean}
+     */
+    has(permissions, projectId) {
+        const lexems = this.lex(permissions);
+        if (lexems.length === 0) {
+            return true;
+        }
+        try {
+            return this.or(lexems, projectId);
+        }
+        catch (e) {
+            return false;
+        }
+    }
+    /**
+     * Lexes permission query string to an array of lexems.
+     *
+     * @param {string} query
+     * @return {string[]}
+     */
+    lex(query) {
+        const lexems = [];
+        if (query) {
+            let currentIdentifier = '';
+            for (let i = 0; i < query.length; i++) {
+                switch (query.charAt(i)) {
+                    case ' ':
+                    case '\t':
+                    case '\n':
+                    case '\r':
+                        // Finish current token
+                        if (currentIdentifier) {
+                            lexems.push(currentIdentifier);
+                            currentIdentifier = '';
+                        }
+                        // Skip space
+                        break;
+                    case '(':
+                    case ')':
+                    case '&':
+                    case '|':
+                    case '!':
+                        // Finish current token
+                        if (currentIdentifier) {
+                            lexems.push(currentIdentifier);
+                            currentIdentifier = '';
+                        }
+                        // Append operator
+                        lexems.push(query.charAt(i));
+                        break;
+                    default:
+                        currentIdentifier += query.charAt(i);
+                        break;
+                }
+            }
+            if (currentIdentifier) {
+                lexems.push(currentIdentifier);
+            }
+        }
+        return lexems;
+    }
+    /*
+     or -> and ( '|' and )*
+     and -> not ( '&'?  not )*
+     not -> '!'* term
+     term -> '(' or ')' | permission
+     permission -> [^()&|!\s]+
+     */
+    /**
+     * @param {string[]} lexems
+     * @param {string=} projectId
+     * @return {boolean}
+     */
+    or(lexems, projectId) {
+        let result = this.and(lexems, projectId);
+        while (lexems.length > 0 && lexems[0] !== ')') {
+            if (lexems.shift() !== '|') {
+                throw new Error('Operator \'|\' was expected');
+            }
+            result = this.and(lexems, projectId) || result;
+        }
+        return result;
+    }
+    /**
+     * @param {string[]} lexems
+     * @param {string=} projectId
+     * @return {boolean}
+     */
+    and(lexems, projectId) {
+        let result = this.not(lexems, projectId);
+        while (lexems.length > 0 && lexems[0] !== ')' && lexems[0] !== '|') {
+            // Expect optional '&'
+            if (lexems[0] === '&') {
+                lexems.shift();
+            }
+            result = this.not(lexems, projectId) && result;
+        }
+        return result;
+    }
+    /**
+     * @param {string[]} lexems
+     * @param {string=} projectId
+     * @return {boolean}
+     */
+    not(lexems, projectId) {
+        let notCounter = 0;
+        while (lexems.length > 0 && lexems[0] === '!') {
+            ++notCounter;
+            lexems.shift();
+        }
+        const result = this.term(lexems, projectId);
+        return (notCounter % 2 === 0) ? result : !result;
+    }
+    /**
+     * @param {string[]} lexems
+     * @param {string=} projectId
+     * @return {boolean}
+     */
+    term(lexems, projectId) {
+        if (lexems.length === 0) {
+            throw new Error('Operand was expected');
+        }
+        const t = lexems.shift();
+        let result;
+        // Nested parenthesized expression
+        if (t === '(') {
+            result = this.or(lexems, projectId);
+            // Expect ')'
+            if (lexems.shift() !== ')') {
+                throw new Error('Operator \')\' was expected');
+            }
+        }
+        else {
+            result = t != null && this.testPermission(t, projectId);
+        }
+        return result;
+    }
+    /**
+     * @param {string} permissionName
+     * @param {string=} projectId
+     * @return {boolean}
+     */
+    testPermission(permissionName, projectId) {
+        const permissionCache = this.permissionCache;
+        const convertedName = this.namesConverter(permissionName);
+        const cachedPermission = permissionCache?.[permissionName] ||
+            convertedName && permissionCache?.[convertedName];
+        // Hasn't the permission in any project
+        if (!cachedPermission) {
+            return false;
+        }
+        // The permission is global or is given in the global project
+        if (cachedPermission.global) {
+            return true;
+        }
+        if (projectId) {
+            // if projectId is specified check that the permission is given in the project
+            return cachedPermission.projectIdSet != null && (projectId in cachedPermission.projectIdSet);
+        }
+        else {
+            return true;
+        }
+    }
+}

package/components/permissions-ng/permissions-ng.css

@@ -0,0 +1,5 @@
+@import "../global/variables.css";
+
+:global(.ring-permission-hide) {
+  display: none !important;
+}

package/components/permissions-ng/permissions-ng.js

@@ -0,0 +1,246 @@
+/**
+ * @name Permissions Ng
+ */
+import angular from 'angular';
+
+import '../auth-ng/auth-ng';
+import Permissions from '../permissions/permissions';
+import PermissionCache from '../permissions/permissions__cache';
+
+import './permissions-ng.css';
+
+function registerPermission(element) {
+  const somePermissionsCtrl = element.controller('rgSomePermissions');
+  return somePermissionsCtrl && somePermissionsCtrl.registerPermission() || angular.noop;
+}
+
+
+const angularModule = angular.module('Ring.permissions', ['Ring.auth']);
+
+/**
+ * @ngdoc object
+ * @name userPermissions
+ *
+ * @description
+ * Configured instance of Permissions object.
+ */
+
+/**
+ * @typedef {Object} permissionsNgConfig
+ * @property {?string} serviceId
+ * @property {?string} prefix
+ */
+angularModule.provider('userPermissions', function provider() {
+  /**
+   * @type {permissionsNgConfig}
+   */
+  let _config = {};
+
+  /**
+   * @param {permissionsNgConfig} config
+   */
+  this.config = config => {
+    _config = config;
+  };
+
+  this.$get = (auth, $q, $http) => {
+    const apiUri = auth.auth.getAPIPath() + Permissions.API_PERMISSION_CACHE_PATH;
+
+    async function datasource(query) {
+      const {data} = await $http.get(apiUri, {
+        params: {
+          fields: 'permission/key,global,projects(id)',
+          query
+        }
+      });
+
+      return data;
+    }
+
+    _config.datasource = _config.datasource || datasource;
+
+    const permissions = new Permissions(auth.auth, _config);
+
+    // Override load to execute in $digest
+    permissions.load = function load() {
+      return $q.when(Permissions.prototype.load.call(this));
+    };
+
+    return permissions;
+  };
+});
+
+/**
+ * @ngdoc directive
+ * @name permission
+ *
+ * @description
+ * The `permission` directive show or hide a portion of the DOM tree (HTML) depending
+ * on the logged in user permissions. If the user has listed permissions then the DOM tree
+ * is shown, otherwise it is hidden.
+ *
+ * @restrict A
+ * @element ANY
+ * @requires userPermissions
+ */
+angularModule.directive(
+  'rgPermission',
+  function rgPermissionDirective(userPermissions, $interpolate) {
+    return {
+      controller: function controller($scope, $element, $attrs) {
+        const element = $element[0];
+
+        //noinspection JSPotentiallyInvalidUsageOfThis
+        this.permitted = false;
+
+        element.classList.add('ring-permission-hide');
+
+        const permission = $interpolate($attrs.rgPermission)($scope);
+
+        const projectId = $attrs.hasOwnProperty('inGlobal')
+          ? PermissionCache.GLOBAL_PROJECT_ID
+          : $scope.$eval($attrs.inProject);
+
+        userPermissions.check(permission, projectId).
+          then(permitted => {
+            this.permitted = permitted;
+            if (permitted) {
+              element.classList.remove('ring-permission-hide');
+            }
+            return permitted;
+          }).
+          then(registerPermission($element));
+      }
+    };
+  }
+);
+
+/**
+ * @ngdoc directive
+ * @name permissionIf
+ *
+ * @description
+ * The `permission` directive transcludes or not a portion of the DOM tree (HTML) depending
+ * on the logged in user permissions. If the user has listed permissions then the DOM tree
+ * is transcluded, otherwise it is not.
+ * @example
+ <example name="rgPermissionIf directive">
+ <file name="index.html">
+ <div rg-permission-if="project-read" in-project="0-0-0-0-0">
+ Is transcluded if user has permission 'read-project' in project 0-0-0-0-0.
+ </div>
+ <div rg-permission-if="project-read">
+ Is transcluded if user has permission 'read-project' at least in one project.
+ </div>
+ <div rg-permission-if="project-read" in-global>
+ Is transcluded if user has permission 'read-project' at project "global".
+ </div>
+ </file>
+ </example>
+ *
+ * @restrict A
+ * @element ANY
+ * @requires $animate
+ * @requires userPermissions
+ */
+angularModule.directive(
+  'rgPermissionIf',
+  function rgPermissionIfDirective($animate, userPermissions, $interpolate) {
+    return {
+      transclude: 'element',
+      priority: 600,
+      terminal: true,
+      restrict: 'A',
+      // disable error about multiple transclude like in ngIf
+      $$tlb: true, // eslint-disable-line angular/no-private-call
+      require: '^?rgSomePermissions',
+      link: function link(scope, iElement, iAttrs, somePermittedCtrl, $transclude) {
+        let block;
+        let childScope;
+
+        const projectId = iAttrs.hasOwnProperty('inGlobal')
+          ? PermissionCache.GLOBAL_PROJECT_ID
+          : scope.$eval(iAttrs.inProject);
+
+        const permission = $interpolate(iAttrs.rgPermissionIf)(scope);
+
+        userPermissions.check(permission, projectId).
+          then(permitted => {
+            if (permitted) {
+              if (!childScope) {
+                childScope = scope.$new();
+                $transclude(childScope, clone => {
+                  block = {
+                    startNode: clone[0],
+                    endNode: clone[clone.length++] = document.
+                      createComment(` end rgPermissionIf: ${iAttrs.rgPermissionIf} `)
+                  };
+                  $animate.enter(clone, iElement.parent(), iElement);
+                });
+              }
+            } else {
+              if (childScope) {
+                childScope.$destroy();
+                childScope = null;
+              }
+
+              if (block) {
+                /* global getBlockElements: false */
+                $animate.leave(getBlockElements(block));
+                block = null;
+              }
+            }
+          }).
+          then(registerPermission(iElement));
+      }
+    };
+  }
+);
+
+/**
+ * @ngdoc directive
+ * @name rgSomePermissions
+ *
+ * @description
+ * Binds left-value expression with a boolean value that is true when at least one permission of
+ * nested {@link permission} or {@link rgPermissionIf} directive is obtained by the logged in user.
+ *
+ * @scope
+ * @restrict A
+ * @element ANY
+ */
+angularModule.directive('rgSomePermissions', function rgSomePermissionsDirective() {
+  return ({
+    scope: {
+      rgSomePermissions: '='
+    },
+    controller: function controller($scope) {
+      const permissions = [];
+      $scope.rgSomePermissions = false;
+
+      function checkPermissions() {
+        for (let i = permissions.length - 1; i >= 0; i--) {
+          if (permissions[i].permitted) {
+            $scope.rgSomePermissions = true;
+            return;
+          }
+        }
+
+        $scope.rgSomePermissions = false;
+      }
+
+      //noinspection JSPotentiallyInvalidUsageOfThis
+      this.registerPermission = () => {
+        const permission = {permitted: false};
+        permissions.push(permission);
+
+        return permitted => {
+          permission.permitted = permitted;
+          checkPermissions();
+        };
+      };
+    }
+  });
+});
+
+export default angularModule.name;

package/components/permissions-ng/permissions-ng.stories.js

@@ -0,0 +1,49 @@
+import angular from 'angular';
+
+import angularDecorator, {APP_NAME} from '../../.storybook/angular-decorator';
+
+import hubConfig from '../../.storybook/hub-config';
+
+import AuthNG from '../auth-ng/auth-ng';
+
+import PermissionsNG from './permissions-ng';
+
+export default {
+  title: 'Legacy Angular/Permissions Ng',
+  decorators: [angularDecorator()],
+
+  parameters: {
+    hermione: {skip: true}
+  }
+};
+
+export const rgPermissionIf = () => {
+  angular.
+    module(APP_NAME, [PermissionsNG, AuthNG]).
+    config([
+      'authProvider',
+      function provider(authProvider) {
+        authProvider.config(hubConfig);
+      }
+    ]).
+    config(userPermissionsProvider => {
+      userPermissionsProvider.config({
+        serviceId: '0-0-0-0-0',
+        prefix: 'jetbrains.jetpass.'
+      });
+    });
+
+  return `
+      <div rg-permission-if="project-read" in-project="0-0-0-0-0">
+        Is transcluded if user has permission 'read-project' in project 0-0-0-0-0.
+      </div>
+      <div rg-permission-if="project-read">
+        Is transcluded if user has permission 'read-project' at least in one project.
+      </div>
+      <div rg-permission-if="project-read" in-global>
+        Is transcluded if user has permission 'read-project' at project "global".
+      </div>
+    `;
+};
+
+rgPermissionIf.storyName = 'Permissions Ng';

package/components/permissions-ng/permissions-ng.test.js

@@ -0,0 +1,82 @@
+/* global inject */
+import 'angular';
+import 'angular-mocks';
+
+import PermissionsNg from './permissions-ng';
+
+describe('Permissions Ng', () => {
+
+  const fakeUserPermissions = {
+    check: () => null
+  };
+
+  beforeEach(window.module(PermissionsNg, $provide => {
+    $provide.value('userPermissions', fakeUserPermissions);
+  }));
+
+  describe('rg-permission', () => {
+    let q;
+    let scope;
+    let $compile;
+    let renderDirective;
+    let element;
+    let ctrl;
+    beforeEach(inject(($q, $rootScope, _$compile_) => {
+      q = $q;
+      scope = $rootScope.$new();
+      $compile = _$compile_;
+      sandbox.stub(fakeUserPermissions, 'check').returns($q.resolve(true));
+
+      renderDirective = (permissionsString = 'hub-test-perm', inProject) => {
+        element = $compile(`<div rg-permission="${permissionsString}" in-project="${inProject}"></div>`)(scope);
+        ctrl = element.controller('rgPermission');
+        scope.$digest();
+      };
+
+      renderDirective();
+    }));
+
+    it('should init', () => {
+      ctrl.should.exist;
+    });
+
+    it('Should not hide element if permission is granted', () => {
+      element[0].should.not.has.class('ring-permission-hide');
+    });
+
+    it('Should hide element if has no permission', () => {
+      fakeUserPermissions.check.returns(q.resolve(false));
+      renderDirective();
+
+      element[0].should.has.class('ring-permission-hide');
+    });
+
+    it('Should pass permission as string to userPermission', () => {
+      renderDirective('some-permission');
+
+      fakeUserPermissions.check.should.have.been.calledWith('some-permission');
+    });
+
+    it('Should pass complex permission as string to userPermission', () => {
+      const complexPermission = 'foo | bar & test';
+      renderDirective(complexPermission);
+
+      fakeUserPermissions.check.should.have.been.calledWith(complexPermission);
+    });
+
+    it('Should pass permission variable to userPermission', () => {
+      scope.permissionValue = 'some-permission';
+
+      renderDirective('{{permissionValue}}');
+
+      fakeUserPermissions.check.should.have.been.calledWith('some-permission');
+    });
+
+    it('Should pass project id as scope value to userPermission', () => {
+      scope.projectId = 'some-project';
+      renderDirective('some-permission', 'projectId');
+
+      fakeUserPermissions.check.should.have.been.calledWith('some-permission', 'some-project');
+    });
+  });
+});