From f26cda47e1176a1f713f23cf386b68c40918b2c3 Mon Sep 17 00:00:00 2001 From: Ryan Mathis Date: Thu, 1 Aug 2019 10:08:27 -0700 Subject: [PATCH 1/3] SHIBUI-1365 stubbing filter comparison --- .../filter-version-list.component.html | 10 +++++ .../filter-version-list.component.ts | 8 ++++ .../configuration/configuration.module.ts | 4 +- .../metadata-comparison.component.html | 16 ++++++++ .../metadata-comparison.component.ts | 39 ++++++++++++++++--- .../container/metadata-options.component.html | 1 - .../metadata/configuration/reducer/index.ts | 6 +++ .../boolean-radio.component.html | 2 +- 8 files changed, 78 insertions(+), 8 deletions(-) create mode 100644 ui/src/app/metadata/configuration/component/filter-version-list.component.html create mode 100644 ui/src/app/metadata/configuration/component/filter-version-list.component.ts diff --git a/ui/src/app/metadata/configuration/component/filter-version-list.component.html b/ui/src/app/metadata/configuration/component/filter-version-list.component.html new file mode 100644 index 000000000..57fa90864 --- /dev/null +++ b/ui/src/app/metadata/configuration/component/filter-version-list.component.html @@ -0,0 +1,10 @@ + +
+

No Filters

+

No filters have been added to this Metadata Provider

+
\ No newline at end of file diff --git a/ui/src/app/metadata/configuration/component/filter-version-list.component.ts b/ui/src/app/metadata/configuration/component/filter-version-list.component.ts new file mode 100644 index 000000000..1706cbcf5 --- /dev/null +++ b/ui/src/app/metadata/configuration/component/filter-version-list.component.ts @@ -0,0 +1,8 @@ +import { Component } from '@angular/core'; +import { FilterListComponent } from '../../filter/component/filter-list.component'; + +@Component({ + selector: 'filter-version-list', + templateUrl: './filter-version-list.component.html' +}) +export class FilterVersionListComponent extends FilterListComponent { } diff --git a/ui/src/app/metadata/configuration/configuration.module.ts b/ui/src/app/metadata/configuration/configuration.module.ts index fa395529b..e2ec72d76 100644 --- a/ui/src/app/metadata/configuration/configuration.module.ts +++ b/ui/src/app/metadata/configuration/configuration.module.ts @@ -30,6 +30,7 @@ import { FilterConfigurationListComponent } from './component/filter-configurati import { FilterConfigurationListItemComponent } from './component/filter-configuration-list-item.component'; import { SharedModule } from '../../shared/shared.module'; import { FilterTargetPropertyComponent } from './component/filter-target-property.component'; +import { FilterVersionListComponent } from './component/filter-version-list.component'; @NgModule({ declarations: [ @@ -47,7 +48,8 @@ import { FilterTargetPropertyComponent } from './component/filter-target-propert MetadataComparisonComponent, FilterConfigurationListComponent, FilterConfigurationListItemComponent, - FilterTargetPropertyComponent + FilterTargetPropertyComponent, + FilterVersionListComponent ], entryComponents: [], imports: [ diff --git a/ui/src/app/metadata/configuration/container/metadata-comparison.component.html b/ui/src/app/metadata/configuration/container/metadata-comparison.component.html index d5b533716..eb122c2f2 100644 --- a/ui/src/app/metadata/configuration/container/metadata-comparison.component.html +++ b/ui/src/app/metadata/configuration/container/metadata-comparison.component.html @@ -9,4 +9,20 @@ +
+
+

+ Filters +

+
+ +   + Add Filter + +
+
+ +
\ No newline at end of file diff --git a/ui/src/app/metadata/configuration/container/metadata-comparison.component.ts b/ui/src/app/metadata/configuration/container/metadata-comparison.component.ts index 92019297d..8e02fe025 100644 --- a/ui/src/app/metadata/configuration/container/metadata-comparison.component.ts +++ b/ui/src/app/metadata/configuration/container/metadata-comparison.component.ts @@ -1,12 +1,14 @@ -import { Component, ChangeDetectionStrategy } from '@angular/core'; -import { Observable } from 'rxjs'; +import { Component, ChangeDetectionStrategy, OnDestroy } from '@angular/core'; +import { Observable, Subject } from 'rxjs'; import { Store } from '@ngrx/store'; import { ActivatedRoute } from '@angular/router'; -import { map } from 'rxjs/operators'; -import { ConfigurationState, getVersionConfigurations, getVersionConfigurationCount } from '../reducer'; +import { map, takeUntil, filter } from 'rxjs/operators'; +import { ConfigurationState, getVersionConfigurations, getVersionConfigurationCount, getConfigurationModel, getVersionsFilters } from '../reducer'; import { Metadata } from '../../domain/domain.type'; import { CompareVersionRequest } from '../action/compare.action'; import { MetadataConfiguration } from '../model/metadata-configuration'; +import { getAdditionalFilters } from '../../filter/reducer'; +import { LoadFilterRequest } from '../../filter/action/collection.action'; @Component({ selector: 'metadata-comparison', @@ -14,10 +16,17 @@ import { MetadataConfiguration } from '../model/metadata-configuration'; templateUrl: './metadata-comparison.component.html', styleUrls: [] }) -export class MetadataComparisonComponent { +export class MetadataComparisonComponent implements OnDestroy { + + private ngUnsubscribe: Subject = new Subject(); versions$: Observable; numVersions$: Observable; + filters$: Observable; + model$: Observable; + + id: string; + kind: string; constructor( private store: Store, @@ -30,5 +39,25 @@ export class MetadataComparisonComponent { this.versions$ = this.store.select(getVersionConfigurations); this.numVersions$ = this.store.select(getVersionConfigurationCount); + this.model$ = this.store.select(getConfigurationModel); + + this.model$ + .pipe( + takeUntil(this.ngUnsubscribe), + filter(model => !!model) + ) + .subscribe(p => this.setModel(p)); + + this.filters$ = this.store.select(getVersionsFilters); + } + + setModel(data: Metadata): void { + this.id = 'resourceId' in data ? data.resourceId : data.id; + this.kind = '@type' in data ? 'provider' : 'resolver'; + } + + ngOnDestroy(): void { + this.ngUnsubscribe.next(); + this.ngUnsubscribe.complete(); } } diff --git a/ui/src/app/metadata/configuration/container/metadata-options.component.html b/ui/src/app/metadata/configuration/container/metadata-options.component.html index d99166c11..972e0e4da 100644 --- a/ui/src/app/metadata/configuration/container/metadata-options.component.html +++ b/ui/src/app/metadata/configuration/container/metadata-options.component.html @@ -48,7 +48,6 @@

(onUpdateOrderDown)="updateOrderDown($event)" (onUpdateOrderUp)="updateOrderUp($event)" (onRemove)="removeFilter($event)" - (preview)="onPreview($event)" [filters]="filters$ | async"> + + + + +
+ +
+ +

No Filters

No filters have been added to this Metadata Provider

\ No newline at end of file diff --git a/ui/src/app/metadata/configuration/component/filter-version-list.component.ts b/ui/src/app/metadata/configuration/component/filter-version-list.component.ts index 1706cbcf5..0781b8293 100644 --- a/ui/src/app/metadata/configuration/component/filter-version-list.component.ts +++ b/ui/src/app/metadata/configuration/component/filter-version-list.component.ts @@ -1,8 +1,68 @@ import { Component } from '@angular/core'; -import { FilterListComponent } from '../../filter/component/filter-list.component'; + +const data = { + dates: ['2019-08-02T12:50:54.282', '2019-08-02T12:12:54.282'], + filters: [ + [ + { + id: '1', + name: 'Example Filter 1', + type: 'EntityAttributesFilter', + comparable: true + }, + { + id: '2', + name: 'Example Filter 2', + type: 'NameIdFilter', + comparable: true + } + ], + [ + { + id: '2', + name: 'Example Filter 2', + type: 'NameIdFilter', + comparable: true + }, + { + id: '1', + name: 'Example Filter 1', + type: 'EntityAttributesFilter', + comparable: true + } + ], + [ + { + id: '4', + name: 'Example Filter 4', + type: 'EntityAttributesFilter', + comparable: false + }, + { + id: '3', + name: 'Example Filter 3', + type: 'EntityAttributesFilter', + comparable: false + } + ] + ] +}; @Component({ selector: 'filter-version-list', templateUrl: './filter-version-list.component.html' }) -export class FilterVersionListComponent extends FilterListComponent { } +export class FilterVersionListComponent { + + filters = data; + selected: string; + + constructor() { + + } + + get width(): string { + const columns = this.filters.dates.length; + return `${Math.floor(100 / (columns + 1))}`; + } +} diff --git a/ui/src/app/metadata/configuration/container/metadata-comparison.component.html b/ui/src/app/metadata/configuration/container/metadata-comparison.component.html index eb122c2f2..d3fdab712 100644 --- a/ui/src/app/metadata/configuration/container/metadata-comparison.component.html +++ b/ui/src/app/metadata/configuration/container/metadata-comparison.component.html @@ -14,15 +14,8 @@

Filters

-
- -   - Add Filter - -
+ - + \ No newline at end of file diff --git a/ui/src/theme/utility.scss b/ui/src/theme/utility.scss index 358b75b2c..0864a5447 100644 --- a/ui/src/theme/utility.scss +++ b/ui/src/theme/utility.scss @@ -6,6 +6,10 @@ background: #FAFAFA !important; } +.bg-primary-light { + background: lighten($brand-primary, 75%); +} + .w-15 { width: 15%; } From 0896528f00455c039359216bc5ef6d1ab3aebf14 Mon Sep 17 00:00:00 2001 From: Ryan Mathis Date: Thu, 8 Aug 2019 09:33:48 -0700 Subject: [PATCH 3/3] updated mockup --- .../filter-version-list.component.html | 128 +++++++++++++----- .../filter-version-list.component.ts | 7 +- 2 files changed, 103 insertions(+), 32 deletions(-) diff --git a/ui/src/app/metadata/configuration/component/filter-version-list.component.html b/ui/src/app/metadata/configuration/component/filter-version-list.component.html index 95cb28700..4047f7483 100644 --- a/ui/src/app/metadata/configuration/component/filter-version-list.component.html +++ b/ui/src/app/metadata/configuration/component/filter-version-list.component.html @@ -1,42 +1,108 @@
- Order + Order + Option {{ date | date:'medium' }}
-
- -
-
- {{ i + 1 }} -
-
-
-

{{ filter.name }}

-

{{ filter.type }}

+ +
+ +
+
+ {{ i + 1 }} +
+
+
+

{{ filter.name }}

+

{{ filter.type }}

+
+
-
-
- -
-
- -
+ +
+
+ +
+ + +
+ Type + EntityAttributesFilter + EntityAttributesFilter +
+
+ Name + Test Filter 1 + Renamed Filter +
+
+ Target Type + Entity ID + Entity ID +
+
+ Target Value + http://idp.unicon.net/idp/shibboleth + http://idp.unicon.net/idp/shibboleth +
+
+ Enabled? + false + true +
+
+ +
+

No Filters

diff --git a/ui/src/app/metadata/configuration/component/filter-version-list.component.ts b/ui/src/app/metadata/configuration/component/filter-version-list.component.ts index 0781b8293..2411aa872 100644 --- a/ui/src/app/metadata/configuration/component/filter-version-list.component.ts +++ b/ui/src/app/metadata/configuration/component/filter-version-list.component.ts @@ -1,7 +1,7 @@ import { Component } from '@angular/core'; const data = { - dates: ['2019-08-02T12:50:54.282', '2019-08-02T12:12:54.282'], + dates: ['2019-08-08T08:40:32.015', '2019-08-08T08:40:19.266'], filters: [ [ { @@ -56,11 +56,16 @@ export class FilterVersionListComponent { filters = data; selected: string; + comparing: string; constructor() { } + compare(id: string): void { + this.comparing = id; + } + get width(): string { const columns = this.filters.dates.length; return `${Math.floor(100 / (columns + 1))}`;