Skip to content

Commit fe6edef

Browse files
harunurhanharunurhan
authored
Merge pull request inspirehep#32 from zzacharo/tag-filter-service
tag-filter: Add json filtering by schema path
2 parents 4bab76c + d95dd40 commit fe6edef

18 files changed

+357
-20
lines changed

‎src/app/add-action/add-action.component.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<label class="form-group">Field:</label>
33
<div class="form-group">
44
<me-autocomplete-input *ngIf="isEditorVisible === false" type="text" name="key"
5-
(valueChange)="onValueChange($event)" [className]="'form-control input-sm'" placeholder="field key"></me-autocomplete-input>
5+
(valueChange)="onValueChange($event)" className="form-control input-sm" placeholder="field key"></me-autocomplete-input>
66
<div *ngIf="isEditorVisible === true">
77
<div class="editor">
88
<json-editor [config]="{compact:true}" [schema]="subSchema" [record]="record" (recordChange)="saveRecord($event)"></json-editor>

‎src/app/app.module.ts

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { FormsModule } from '@angular/forms';
44
import { HttpModule } from '@angular/http';
55
import { AppComponent } from './app.component';
66
import { MultiEditorComponent } from './multi-editor';
7-
import { SHARED_SERVICES } from './shared';
7+
import { SHARED_SERVICES, SHARED_PIPES } from './shared';
88
import { AlertModule } from 'ngx-bootstrap/alert';
99
import { PaginationModule } from 'ngx-bootstrap/pagination';
1010
import { BsDropdownModule } from 'ngx-bootstrap/dropdown';
@@ -24,6 +24,7 @@ import { AutocompleteInputComponent } from './autocomplete-input';
2424

2525
@NgModule({
2626
declarations: [
27+
...SHARED_PIPES,
2728
AppComponent,
2829
MultiEditorComponent,
2930
ActionTemplateComponent,
@@ -48,9 +49,7 @@ import { AutocompleteInputComponent } from './autocomplete-input';
4849
JsonEditorModule,
4950
TypeaheadModule.forRoot()
5051
],
51-
providers: [
52-
SHARED_SERVICES
53-
],
52+
providers: SHARED_SERVICES,
5453
bootstrap: [AppComponent]
5554
})
5655
export class AppModule { }

‎src/app/autocomplete-input/autocomplete-input.component.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<input [(ngModel)]="value" [typeahead]="dataSource" (typeaheadNoResults)="typeaheadNoResults = $event"
2-
(typeaheadOnSelect)="selectUserInput($event)" [attr.class]="className" [typeaheadMinLength]="0">
2+
(typeaheadOnSelect)="selectUserInput($event)" [attr.class]="className" [typeaheadMinLength]="0" [placeholder]="placeholder">
33
<div *ngIf="typeaheadNoResults===true">
44
<i class="fa fa-remove"></i> No Results Found
55
</div>

‎src/app/autocomplete-input/autocomplete-input.component.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
.inline-input {
2+
width: 30%;
3+
display: inline-block;
4+
}

‎src/app/autocomplete-input/autocomplete-input.component.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import 'rxjs/add/operator/map';
1414
export class AutocompleteInputComponent {
1515

1616
@Input() className;
17+
@Input() placeholder;
1718
@Output() valueChange = new EventEmitter<string>();
1819
value = '';
1920

@@ -56,7 +57,7 @@ export class AutocompleteInputComponent {
5657
query = '';
5758
} else {
5859
path = value.slice(0, separatorIndex);
59-
query = value.slice(separatorIndex);
60+
query = value.slice(separatorIndex + 1);
6061
}
6162
return {path, query};
6263
}

‎src/app/conditions/conditions.component.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<label class="form-group">Field:</label>
33
<div class="form-group">
44
<me-autocomplete-input type="text" name="key"
5-
(valueChange)="condition.key = event" [className]="'form-control input-sm'" placeholder="field key">
5+
(valueChange)="condition.key = $event" className="form-control input-sm" placeholder="field key">
66
</me-autocomplete-input>
77
</div>
88
<div class="form-group">

‎src/app/delete-action/delete-action.component.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<label class="form-group">Field:</label>
33
<div class="form-group">
44
<me-autocomplete-input type="text" name="key"
5-
(valueChange)="action.mainKey = event" [className]="'form-control input-sm'" placeholder="field key">
5+
(valueChange)="action.mainKey = $event" className="form-control input-sm" placeholder="field key">
66
</me-autocomplete-input>
77
</div>
88
<span class="form-group">when value</span>

‎src/app/multi-editor/multi-editor.component.html

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -11,13 +11,20 @@ <h3>Sorry no results found</h3>
1111
</div>
1212

1313
<div *ngIf="totalRecords > 0">
14+
<div class="tag-filter">
15+
<label>Show only:</label>
16+
<me-autocomplete-input type="text" name="key"
17+
(valueChange)="filterExpression = $event" className="form-control input-sm inline-input" placeholder="field key">
18+
</me-autocomplete-input>
19+
</div>
1420
<div class="preview-border">
1521
<button class="btn-success button" (click)="onPreviewClick()">Preview</button>
1622
</div>
1723
<div class="row ">
1824
<div class="col-md-2">
1925
<span>
20-
<input class="results-checkbox" type="checkbox" [checked]="checkedRecords.length === 0" (change)="selectAll()"> Select all results</span>
26+
<input class="results-checkbox" type="checkbox" [checked]="checkedRecords.length === 0" (change)="selectAll()"> Select all results
27+
</span>
2128
</div>
2229
<div class="col-md-2 col-md-offset-5">
2330
<span class="results-record-num">{{totalRecords}} records found</span>
@@ -27,15 +34,14 @@ <h3>Sorry no results found</h3>
2734
[rotate]="false" (pageChanged)="onPageChange($event.page)" [itemsPerPage]="pageSize" [align]="false"></pagination>
2835
</div>
2936
</div>
30-
31-
<li *ngFor="let record of records ; let count = index; trackBy: trackByFunction" class="list-group list-group-item">
37+
<li *ngFor="let record of records | tagFilter:filterExpression; let count = index; trackBy: trackByFunction" class="list-group list-group-item">
3238
<input type="checkbox" [checked]="checkedRecords.indexOf(uuids[count]) === -1" (change)="addChecked(uuids[count])">
3339
<div *ngIf="previewMode === false;then recordView else diffView"></div>
3440
<ng-template #diffView>
3541
<div *ngIf="recordErrors[count]">
3642
<span class="error">{{recordErrors[count]}} tagme</span>
3743
</div>
38-
<me-diff-view [oldObject]="record" [newObject]="newRecords[count]"></me-diff-view>
44+
<me-diff-view [oldObject]="record" [newObject]="filterNewRecord(newRecords[count])"></me-diff-view>
3945
</ng-template>
4046
<ng-template #recordView>
4147
<pre>{{record | json}} </pre>

‎src/app/multi-editor/multi-editor.component.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,4 +42,8 @@ $green-sea: #16a085;
4242
border-bottom: 2px solid;
4343
border-color: #dae8ef;
4444
margin-bottom: 10px;
45+
}
46+
47+
.tag-filter {
48+
padding: 10px 0;
4549
}

‎src/app/multi-editor/multi-editor.component.ts

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,8 @@ import {
55

66
import 'rxjs/add/operator/toPromise';
77

8-
import { SchemaKeysStoreService, QueryService } from '../shared/services';
8+
import { SchemaKeysStoreService, QueryService, JsonUtilsService, UserActionsService } from '../shared/services';
99
import { UserActions } from '../shared/interfaces';
10-
import { UserActionsService } from '../shared/services';
1110

1211
@Component({
1312
selector: 'me-multi-editor',
@@ -32,6 +31,7 @@ export class MultiEditorComponent implements OnInit {
3231
selectedCollection: string;
3332
newRecords: object[];
3433
uuids: string[] = [];
34+
filterExpression: string;
3535

3636
readonly collections: object[] = [
3737
['hep', 'HEP'],
@@ -52,7 +52,8 @@ export class MultiEditorComponent implements OnInit {
5252
private schemaKeysStoreService: SchemaKeysStoreService,
5353
private changeDetectorRef: ChangeDetectorRef,
5454
private queryService: QueryService,
55-
private userActionsService: UserActionsService) { }
55+
private userActionsService: UserActionsService,
56+
private jsonUtilsService: JsonUtilsService) { }
5657

5758
ngOnInit() {
5859
this.newRecords = [];
@@ -145,6 +146,14 @@ export class MultiEditorComponent implements OnInit {
145146
error => { this.errorText = error; this.changeDetectorRef.markForCheck(); });
146147
}
147148

149+
filterNewRecord(record: object): object {
150+
let _record = Object.assign({}, record);
151+
if (this.filterExpression) {
152+
return this.jsonUtilsService.filterObject(_record, [this.filterExpression]);
153+
}
154+
return record;
155+
}
156+
148157
private queryCollection(query, collection) {
149158
this.queryService.searchRecords(query, this.currentPage, collection, this.pageSize)
150159
.then((json) => {

‎src/app/shared/index.ts

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
import { SHARED_SERVICES } from './services';
2+
import { SHARED_PIPES } from './pipes';
23

34
export {
4-
SHARED_SERVICES
5+
SHARED_SERVICES,
6+
SHARED_PIPES
57
};

‎src/app/shared/pipes/index.ts

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import { TagFilterPipe } from './tag-filter.pipe';
2+
3+
export const SHARED_PIPES = [
4+
TagFilterPipe
5+
];
6+
7+
export { TagFilterPipe };

‎src/app/shared/pipes/tag-filter.pipe.spec.ts

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
import { TagFilterPipe } from './tag-filter.pipe';
2+
import { JsonUtilsService } from '../services/json-utils.service';
3+
import { SchemaKeysStoreService } from '../services/schema-keys-store.service';
4+
5+
describe('TagFilterPipe', () => {
6+
it(`filters records by the fields specified. It returns the union
7+
of all filters applied to each record.`, () => {
8+
const pipe = new TagFilterPipe(new JsonUtilsService(new SchemaKeysStoreService()));
9+
let records = [{
10+
lla: 3,
11+
authors: [
12+
{
13+
affiliations: [
14+
{
15+
value: 'inst3',
16+
name: 'inst3'
17+
},
18+
{
19+
value: 'inst4',
20+
name: 'inst4'
21+
}
22+
]
23+
}
24+
],
25+
test: 4,
26+
dup: 3
27+
}, {
28+
authors: [
29+
{
30+
affiliations: [
31+
{
32+
value: 'inst3',
33+
name: 'inst3'
34+
},
35+
{
36+
value: 'inst4',
37+
name: 'inst4'
38+
}
39+
]
40+
}, {
41+
affiliations: [
42+
{
43+
name: 'inst4'
44+
},
45+
{
46+
name: 'inst5'
47+
}
48+
],
49+
full_name: 'dummy'
50+
}
51+
]}];
52+
53+
let expected = [{
54+
authors: [{
55+
affiliations: [
56+
{
57+
value: 'inst3'
58+
},
59+
{
60+
value: 'inst4'
61+
}
62+
]
63+
}
64+
]}, {
65+
authors: [{
66+
affiliations: [
67+
{
68+
value: 'inst3'
69+
},
70+
{
71+
value: 'inst4'
72+
}
73+
]
74+
}]
75+
}];
76+
let result = pipe.transform(records, 'authors/affiliations/value');
77+
expect(result).toEqual(expected);
78+
});
79+
});

‎src/app/shared/pipes/tag-filter.pipe.ts

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import { Pipe, PipeTransform } from '@angular/core';
2+
import * as _ from 'lodash';
3+
import { JsonUtilsService } from '../services/json-utils.service';
4+
5+
6+
@Pipe({
7+
name: 'tagFilter'
8+
})
9+
export class TagFilterPipe implements PipeTransform {
10+
11+
constructor(public jsonUtilsService: JsonUtilsService) { }
12+
13+
transform(records: Array<{}>, filterExpression: string): any {
14+
if (filterExpression) {
15+
return this.jsonUtilsService.filterObjectArray(records, filterExpression);
16+
}
17+
return records;
18+
}
19+
20+
}

‎src/app/shared/services/index.ts

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,18 +2,21 @@ import { SchemaKeysStoreService } from './schema-keys-store.service';
22
import { QueryService } from './query.service';
33
import { AppGlobalsService } from './app-globals.service';
44
import { UserActionsService } from './user-actions.service';
5+
import { JsonUtilsService } from './json-utils.service';
56

67
export const SHARED_SERVICES = [
78
SchemaKeysStoreService,
89
QueryService,
910
AppGlobalsService,
10-
UserActionsService
11+
UserActionsService,
12+
JsonUtilsService
1113
];
1214

1315
export {
1416
SchemaKeysStoreService,
1517
QueryService,
1618
AppGlobalsService,
17-
UserActionsService
19+
UserActionsService,
20+
JsonUtilsService
1821
}
1922

0 commit comments

Comments
 (0)