-
Notifications
You must be signed in to change notification settings - Fork 6
/
select-group.component.ts
137 lines (112 loc) · 3.92 KB
/
select-group.component.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
import {
AfterViewInit,
ChangeDetectionStrategy,
ChangeDetectorRef,
Component,
EventEmitter,
Input,
OnDestroy,
OnInit,
Output,
} from '@angular/core';
import { UntypedFormControl } from '@angular/forms';
import {
ReadGroup,
} from '@dasch-swiss/dsp-js';
import { AutocompleteItem } from '@dsp-app/src/app/workspace/search/operator';
import { IKeyValuePairs, ProjectsSelectors } from '@dasch-swiss/vre/shared/app-state';
import { Select } from '@ngxs/store';
import { Observable, Subject } from 'rxjs';
import { map, takeUntil } from 'rxjs/operators';
@Component({
changeDetection: ChangeDetectionStrategy.OnPush,
selector: 'app-select-group',
templateUrl: './select-group.component.html',
styleUrls: ['./select-group.component.scss'],
})
export class SelectGroupComponent implements OnDestroy, AfterViewInit {
private ngUnsubscribe: Subject<void> = new Subject<void>();
// project short code
@Input() projectCode: string;
// project iri
@Input() projectid: string;
// users permissions from user data
@Input() permissions: any;
// disable the selection; in case a user doesn't have the rights to change the permission
@Input() disabled?: boolean = false;
// send the changes to the parent
@Output() groupChange: EventEmitter<any> = new EventEmitter<any>();
// default system groups and project specific groups
get projectGroups$(): Observable<AutocompleteItem[]> {
return this.allProjectGroups$
.pipe(
takeUntil(this.ngUnsubscribe),
map((projectGroups) => {
if (!projectGroups[this.projectid]) {
return [];
}
return projectGroups[this.projectid].value.map(group => <AutocompleteItem>{
iri: group.id,
name: group.name,
});
})
);
}
groupCtrl = new UntypedFormControl();
// send data only, when the selection has changed
sendData = false;
@Select(ProjectsSelectors.projectGroups) allProjectGroups$: Observable<IKeyValuePairs<ReadGroup>[]>;
constructor(private _cd: ChangeDetectorRef) {}
ngAfterViewInit() {
setTimeout(() => {
this.groupCtrl.setValue(this.permissions);
});
}
ngOnDestroy() {
this.ngUnsubscribe.next();
this.ngUnsubscribe.complete();
}
trackByFn = (index: number, item: AutocompleteItem) => `${index}-${item.label}`;
onGroupChange() {
// get the selected values onOpen and onClose
// and compare them with the current values from user profile
// compare the selected data with the permissions data
this.sendData = this.compare(this.permissions, this.groupCtrl.value);
if (this.sendData) {
this.permissions = this.groupCtrl.value;
this.groupChange.emit(this.groupCtrl.value);
}
}
onGroupSelect() {
// if change is true, the onGroupChange is active
// with this method we prevent to submit data already by opening the selection
// it should emit the data when closing the selection and if the data has changed!
// this.sendData = (this.groupCtrl.value !== this.permissions);
}
/**
* compare two arrays and return true, if they are different
* @param arrOne string array
* @param arrTwo string array
*/
compare(arrOne: string[], arrTwo: string[]): boolean {
arrOne = arrOne.sort((n1, n2) => {
if (n1 > n2) {
return 1;
}
if (n1 < n2) {
return -1;
}
return 0;
});
arrTwo = arrTwo.sort((n1, n2) => {
if (n1 > n2) {
return 1;
}
if (n1 < n2) {
return -1;
}
return 0;
});
return JSON.stringify(arrOne) !== JSON.stringify(arrTwo);
}
}