Feature/split manage collections permission (#1211)

* Update guard services and routing

* Add depenent checkbox to handle sub permissions

* Present new collections premissions

* Use new split permissions

* Rename to nested-checkbox.component

* Clarify css class name

* update jslib

src/app/components/nested-checkbox.component.html

@@ -0,0 +1,18 @@
+<div class="form-group mb-0">
+    <div class="form-check mt-1 form-check-block">
+        <input class="form-check-input" type="checkbox" [name]="pascalize(parentId)" [id]="parentId"
+            [(ngModel)]="parentChecked" [indeterminate]="parentIndeterminate">
+        <label class="form-check-label font-weight-normal" [for]="parentId">
+            {{parentId | i18n}}
+        </label>
+    </div>
+    <div class="form-group form-group-child-check mb-0">
+        <div class="form-check mt-1" *ngFor="let c of checkboxes">
+            <input class="form-check-input" type="checkbox" [name]="pascalize(c.id)" [id]="c.id" [ngModel]="c.get()"
+                (ngModelChange)="c.set($event)">
+            <label class="form-check-label font-weight-normal" [for]="c.id">
+                {{c.id | i18n}}
+            </label>
+        </div>
+    </div>
+</div>

src/app/components/nested-checkbox.component.ts

@@ -0,0 +1,37 @@
+import {
+    Component,
+    EventEmitter,
+    Input,
+    Output,
+} from '@angular/core';
+import { Utils } from 'jslib-common/misc/utils';
+
+@Component({
+    selector: 'app-nested-checkbox',
+    templateUrl: 'nested-checkbox.component.html',
+})
+export class NestedCheckboxComponent {
+    @Input() parentId: string;
+    @Input() checkboxes: { id: string, get: () => boolean, set: (v: boolean) => void; }[];
+    @Output() onSavedUser = new EventEmitter();
+    @Output() onDeletedUser = new EventEmitter();
+
+    get parentIndeterminate() {
+        return !this.parentChecked &&
+            this.checkboxes.some(c => c.get());
+    }
+
+    get parentChecked() {
+        return this.checkboxes.every(c => c.get());
+    }
+
+    set parentChecked(value: boolean) {
+        this.checkboxes.forEach(c => {
+            c.set(value);
+        });
+    }
+
+    pascalize(s: string) {
+        return Utils.camelToPascalCase(s);
+    }
+}