entity users component

src/app/organizations/manage/collections.component.ts

@@ -1,6 +1,9 @@
 import {
     Component,
+    ComponentFactoryResolver,
     OnInit,
+    ViewChild,
+    ViewContainerRef,
 } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 
@@ -12,18 +15,26 @@ import { Collection } from 'jslib/models/domain/collection';
 import { CollectionDetailsResponse } from 'jslib/models/response/collectionResponse';
 import { CollectionView } from 'jslib/models/view/collectionView';
 
+import { ModalComponent } from '../../modal.component';
+import { EntityUsersComponent } from './entity-users.component';
+
 @Component({
     selector: 'app-org-manage-collections',
     templateUrl: 'collections.component.html',
 })
 export class CollectionsComponent implements OnInit {
+    @ViewChild('addEdit', { read: ViewContainerRef }) addEditModalRef: ViewContainerRef;
+    @ViewChild('usersTemplate', { read: ViewContainerRef }) usersModalRef: ViewContainerRef;
+
     loading = true;
     organizationId: string;
     collections: CollectionView[];
     searchText: string;
 
+    private modal: ModalComponent = null;
+
     constructor(private apiService: ApiService, private route: ActivatedRoute,
-        private collectionService: CollectionService) { }
+        private collectionService: CollectionService, private componentFactoryResolver: ComponentFactoryResolver) { }
 
     async ngOnInit() {
         this.route.parent.parent.params.subscribe(async (params) => {
@@ -51,4 +62,24 @@ export class CollectionsComponent implements OnInit {
     async delete(collection: CollectionView) {
         //
     }
+
+    users(collection: CollectionView) {
+        if (this.modal != null) {
+            this.modal.close();
+        }
+
+        const factory = this.componentFactoryResolver.resolveComponentFactory(ModalComponent);
+        this.modal = this.usersModalRef.createComponent(factory).instance;
+        const childComponent = this.modal.show<EntityUsersComponent>(
+            EntityUsersComponent, this.usersModalRef);
+
+        childComponent.organizationId = this.organizationId;
+        childComponent.entity = 'collection';
+        childComponent.entityId = collection.id;
+        childComponent.entityName = collection.name;
+
+        this.modal.onClosed.subscribe(() => {
+            this.modal = null;
+        });
+    }
 }