Fix Bug 2121: NG-UI uses unmaintained Chokidar version
[osm/NG-UI.git] / src / app / users / user-details / UserDetailsComponent.ts
1 /*
2  Copyright 2020 TATA ELXSI
3
4  Licensed under the Apache License, Version 2.0 (the 'License');
5  you may not use this file except in compliance with the License.
6  You may obtain a copy of the License at
7
8   http://www.apache.org/licenses/LICENSE-2.0
9
10  Unless required by applicable law or agreed to in writing, software
11  distributed under the License is distributed on an "AS IS" BASIS,
12  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13  See the License for the specific language governing permissions and
14  limitations under the License.
15
16  Author: KUMARAN M (kumaran.m@tataelxsi.co.in), RAJESH S (rajesh.s@tataelxsi.co.in), BARATH KUMAR R (barath.r@tataelxsi.co.in)
17 */
18 /**
19  * @file users details Component.
20  */
21 import { isNullOrUndefined } from 'util';
22 import { Component, Injector, OnDestroy, OnInit } from '@angular/core';
23 import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
24 import { TranslateService } from '@ngx-translate/core';
25 import { AddEditUserComponent } from 'AddEditUserComponent';
26 import { ERRORDATA, MODALCLOSERESPONSEDATA } from 'CommonModel';
27 import { DataService } from 'DataService';
28 import { environment } from 'environment';
29 import { LocalDataSource } from 'ng2-smart-table';
30 import { ProjectService } from 'ProjectService';
31 import { RestService } from 'RestService';
32 import { Subscription } from 'rxjs';
33 import { SharedService } from 'SharedService';
34 import { UserData, UserDetail } from 'UserModel';
35 import { UsersActionComponent } from 'UsersActionComponent';
36
37 /**
38  * Creating component
39  * @Component takes UserDetailsComponent.html as template url
40  */
41 @Component({
42   templateUrl: './UserDetailsComponent.html',
43   styleUrls: ['./UserDetailsComponent.scss']
44 })
45 /** Exporting a class @exports UserDetailsComponent */
46 export class UserDetailsComponent implements OnInit, OnDestroy {
47   /** Data of smarttable populate through LocalDataSource @public */
48   public dataSource: LocalDataSource = new LocalDataSource();
49
50   /** handle translate @public */
51   public translateService: TranslateService;
52
53   /** To inject services @public */
54   public injector: Injector;
55
56   /** Settings for smarttable to populate the table with columns @public */
57   public settings: object = {};
58
59   /** Check the loading results @public */
60   public isLoadingResults: boolean = true;
61
62   /** Give the message for the loading @public */
63   public message: string = 'PLEASEWAIT';
64
65   /** Class for empty and present data @public */
66   public checkDataClass: string;
67
68   /** Instance of the rest service @private */
69   private restService: RestService;
70
71   /** dataService to pass the data from one component to another @private */
72   private dataService: DataService;
73
74   /** Instance of the modal service @private */
75   private modalService: NgbModal;
76
77   /** Formation of appropriate Data for LocalDatasource @private */
78   private userData: {}[] = [];
79
80   /** Contains all methods related to shared @private */
81   private sharedService: SharedService;
82
83   /** Holds all project details */
84   private projectService: ProjectService;
85
86   /** holds the project information @private */
87   private projectList: {}[] = [];
88
89   /** Columns list of the smart table @public */
90   private columnLists: object = {};
91
92   /** Instance of subscriptions @private */
93   private generateDataSub: Subscription;
94
95   constructor(injector: Injector) {
96     this.injector = injector;
97     this.restService = this.injector.get(RestService);
98     this.dataService = this.injector.get(DataService);
99     this.sharedService = this.injector.get(SharedService);
100     this.modalService = this.injector.get(NgbModal);
101     this.projectService = this.injector.get(ProjectService);
102     this.translateService = this.injector.get(TranslateService);
103   }
104
105   /**
106    * Lifecyle Hooks the trigger before component is instantiate
107    */
108   public ngOnInit(): void {
109     this.projectService.getAllProjects().subscribe((projects: {}[]) => {
110       this.projectList = projects;
111     });
112     this.generateColumns();
113     this.generateSettings();
114     this.generateData();
115     this.generateDataSub = this.sharedService.dataEvent.subscribe(() => { this.generateData(); });
116   }
117
118   /** smart table Header Colums @public */
119   public generateColumns(): void {
120     this.columnLists = {
121       username: { title: this.translateService.instant('NAME'), width: '20%', sortDirection: 'asc' },
122       projects: { title: this.translateService.instant('PAGE.DASHBOARD.PROJECTS'), width: '25%' },
123       identifier: { title: this.translateService.instant('IDENTIFIER'), width: '20%' },
124       modified: { title: this.translateService.instant('MODIFIED'), width: '15%' },
125       created: { title: this.translateService.instant('CREATED'), width: '15%' },
126       Actions: {
127         name: 'Action', width: '5%', filter: false, sort: false, title: this.translateService.instant('ACTIONS'), type: 'custom',
128         valuePrepareFunction: (cell: UserData, row: UserData): UserData => row,
129         renderComponent: UsersActionComponent
130       }
131     };
132   }
133
134   /** smart table Data Settings @public */
135   public generateSettings(): void {
136     this.settings = {
137       edit: { editButtonContent: '<i class="fa fa-edit" title="Edit"></i>', confirmSave: true },
138       delete: { deleteButtonContent: '<i class="far fa-trash-alt" title="delete"></i>', confirmDelete: true },
139       columns: this.columnLists,
140       actions: { add: false, edit: false, delete: false, position: 'right' },
141       attr: this.sharedService.tableClassConfig(),
142       pager: this.sharedService.paginationPagerConfig(),
143       noDataMessage: this.translateService.instant('NODATAMSG')
144     };
145   }
146
147   /** on Navigate to Composer Page @public */
148   public composeUser(): void {
149     // eslint-disable-next-line security/detect-non-literal-fs-filename
150     const modalRef: NgbModalRef = this.modalService.open(AddEditUserComponent, { backdrop: 'static' });
151     modalRef.componentInstance.userTitle = this.translateService.instant('PAGE.USERS.NEWUSER');
152     modalRef.componentInstance.userType = 'add';
153     modalRef.result.then((result: MODALCLOSERESPONSEDATA) => {
154       if (result) {
155         this.sharedService.callData();
156       }
157     }).catch((): void => {
158       // Catch Navigation Error
159     });
160   }
161
162   /** smart table listing manipulation @private */
163   public onChange(perPageValue: number): void {
164     this.dataSource.setPaging(1, perPageValue, true);
165   }
166
167   /** OnUserRowSelect function @private */
168   public onUserRowSelect(event: MessageEvent): void {
169     Object.assign(event.data, { page: 'users' });
170     this.dataService.changeMessage(event.data);
171   }
172
173   /** Set up user details @public */
174   public setUserDetails(userData: UserDetail): void {
175     const userDataObj: UserData = {
176       username: userData.username,
177       modified: this.sharedService.convertEpochTime(!isNullOrUndefined(userData._admin) ? userData._admin.modified : null),
178       created: this.sharedService.convertEpochTime(!isNullOrUndefined(userData._admin) ? userData._admin.created : null),
179       projects: userData.projectListName,
180       identifier: userData._id
181     };
182     this.userData.push(userDataObj);
183   }
184
185   /**
186    * Lifecyle hook which get trigger on component destruction
187    */
188   public ngOnDestroy(): void {
189     this.generateDataSub.unsubscribe();
190   }
191
192   /** Fetching the data from server to Load in the smarttable @protected */
193   protected generateData(): void {
194     this.isLoadingResults = true;
195     this.restService.getResource(environment.USERS_URL).subscribe((usersData: UserDetail[]) => {
196       this.userData = [];
197       usersData.forEach((userData: UserDetail) => {
198         if (userData.projects.length > 0) {
199           userData.projectListName = userData.projects.join(', ');
200         } else {
201           userData.projectListName = '';
202         }
203         this.setUserDetails(userData);
204       });
205       if (this.userData.length > 0) {
206         this.checkDataClass = 'dataTables_present';
207       } else {
208         this.checkDataClass = 'dataTables_empty';
209       }
210       this.dataSource.load(this.userData).then((data: {}) => {
211         this.isLoadingResults = false;
212       }).catch((): void => {
213         // Catch Navigation Error
214       });
215     }, (error: ERRORDATA) => {
216       this.restService.handleError(error, 'get');
217       this.isLoadingResults = false;
218     });
219   }
220 }