From 09b46379c90c239246882b7f4212cf1be9e904e4 Mon Sep 17 00:00:00 2001
From: Ryan Mathis <rmathis@unicon.net>
Date: Tue, 6 Mar 2018 15:25:39 -0700
Subject: [PATCH 1/6] SHIBUI-334 Stubbed out Filter page

---
 .../metadata-filter/action/filter.action.ts   | 12 +++++++
 .../container/new-filter.component.html       | 15 ++++++++
 .../container/new-filter.component.ts         | 18 ++++++++++
 ui/src/app/metadata-filter/filter.module.ts   | 34 +++++++++++++++++++
 .../metadata-filter/reducer/filter.reducer.ts | 20 +++++++++++
 ui/src/app/metadata-filter/reducer/index.ts   | 16 +++++++++
 ui/src/app/routing.module.ts                  |  5 +++
 7 files changed, 120 insertions(+)
 create mode 100644 ui/src/app/metadata-filter/action/filter.action.ts
 create mode 100644 ui/src/app/metadata-filter/container/new-filter.component.html
 create mode 100644 ui/src/app/metadata-filter/container/new-filter.component.ts
 create mode 100644 ui/src/app/metadata-filter/filter.module.ts
 create mode 100644 ui/src/app/metadata-filter/reducer/filter.reducer.ts
 create mode 100644 ui/src/app/metadata-filter/reducer/index.ts

diff --git a/ui/src/app/metadata-filter/action/filter.action.ts b/ui/src/app/metadata-filter/action/filter.action.ts
new file mode 100644
index 000000000..65046c903
--- /dev/null
+++ b/ui/src/app/metadata-filter/action/filter.action.ts
@@ -0,0 +1,12 @@
+import { Action } from '@ngrx/store';
+
+export const QUERY_ENTITY_IDS = '[Filter] Query Entity Ids';
+
+export class QueryEntityIds implements Action {
+    readonly type = QUERY_ENTITY_IDS;
+
+    constructor(public payload: string[]) { }
+}
+
+export type Actions =
+    | QueryEntityIds;
diff --git a/ui/src/app/metadata-filter/container/new-filter.component.html b/ui/src/app/metadata-filter/container/new-filter.component.html
new file mode 100644
index 000000000..5fb554c25
--- /dev/null
+++ b/ui/src/app/metadata-filter/container/new-filter.component.html
@@ -0,0 +1,15 @@
+<div class="container-fluid p-3" role="main">
+    <section class="section">
+        <div class="section-header bg-info p-2 text-light">
+            <div class="row justify-content-between">
+                <div class="col-md-12">
+                    <span class="display-6">
+                    <i class="fa fa-gears"></i> New Filter Page</span>
+                </div>
+            </div>
+        </div>
+        <div class="section-body p-4 border border-top-0 border-info">
+            Body
+        </div>
+    </section>
+</div>
diff --git a/ui/src/app/metadata-filter/container/new-filter.component.ts b/ui/src/app/metadata-filter/container/new-filter.component.ts
new file mode 100644
index 000000000..65be0f260
--- /dev/null
+++ b/ui/src/app/metadata-filter/container/new-filter.component.ts
@@ -0,0 +1,18 @@
+import { Component } from '@angular/core';
+import { Store } from '@ngrx/store';
+
+import * as fromFilter from '../reducer';
+
+@Component({
+    selector: 'new-filter-page',
+    templateUrl: './new-filter.component.html'
+})
+export class NewFilterComponent {
+    constructor(
+        private store: Store<fromFilter.State>
+    ) {}
+
+    save(): void {}
+
+    cancel(): void {}
+}
diff --git a/ui/src/app/metadata-filter/filter.module.ts b/ui/src/app/metadata-filter/filter.module.ts
new file mode 100644
index 000000000..3e5da5f96
--- /dev/null
+++ b/ui/src/app/metadata-filter/filter.module.ts
@@ -0,0 +1,34 @@
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { CommonModule } from '@angular/common';
+import { ReactiveFormsModule } from '@angular/forms';
+import { StoreModule } from '@ngrx/store';
+import { EffectsModule } from '@ngrx/effects';
+
+import { NewFilterComponent } from './container/new-filter.component';
+import { reducers } from './reducer';
+
+export const routes: Routes = [
+    {
+        path: 'new',
+        component: NewFilterComponent,
+        canActivate: []
+    }
+];
+
+@NgModule({
+    declarations: [
+        NewFilterComponent
+    ],
+    entryComponents: [],
+    imports: [
+        CommonModule,
+        RouterModule,
+        ReactiveFormsModule,
+        StoreModule.forFeature('metadata-filter', reducers),
+        EffectsModule.forFeature([]),
+        RouterModule.forChild(routes)
+    ],
+    providers: []
+})
+export class FilterModule { }
diff --git a/ui/src/app/metadata-filter/reducer/filter.reducer.ts b/ui/src/app/metadata-filter/reducer/filter.reducer.ts
new file mode 100644
index 000000000..5160096b0
--- /dev/null
+++ b/ui/src/app/metadata-filter/reducer/filter.reducer.ts
@@ -0,0 +1,20 @@
+import { createSelector, createFeatureSelector } from '@ngrx/store';
+import { MetadataProvider } from '../../metadata-provider/model/metadata-provider';
+import * as filter from '../action/filter.action';
+import * as fromRoot from '../../core/reducer';
+
+export interface FilterState {
+    entityIds: string[];
+}
+
+export const initialState: FilterState = {
+    entityIds: []
+};
+
+export function reducer(state = initialState, action: filter.Actions): FilterState {
+    switch (action.type) {
+        default: {
+            return state;
+        }
+    }
+}
diff --git a/ui/src/app/metadata-filter/reducer/index.ts b/ui/src/app/metadata-filter/reducer/index.ts
new file mode 100644
index 000000000..084b99714
--- /dev/null
+++ b/ui/src/app/metadata-filter/reducer/index.ts
@@ -0,0 +1,16 @@
+import { createSelector, createFeatureSelector } from '@ngrx/store';
+import * as fromRoot from '../../core/reducer';
+import * as fromFilter from './filter.reducer';
+
+export interface FilterState {
+    filter: fromFilter.FilterState;
+}
+
+export const reducers = {
+    filter: fromFilter.reducer
+};
+
+export interface State extends fromRoot.State {
+    'metadata-filter': FilterState;
+}
+
diff --git a/ui/src/app/routing.module.ts b/ui/src/app/routing.module.ts
index bca2b335a..79ba36f8b 100644
--- a/ui/src/app/routing.module.ts
+++ b/ui/src/app/routing.module.ts
@@ -12,6 +12,11 @@ const routes: Routes = [
         path: 'provider',
         loadChildren: './edit-provider/editor.module#EditorModule',
         canActivate: []
+    },
+    {
+        path: 'metadata-filter',
+        loadChildren: './metadata-filter/filter.module#FilterModule',
+        canActivate: []
     }
 ];
 

From 2876e2d6acb281d1ffa718a1e6c8b808683803fe Mon Sep 17 00:00:00 2001
From: Ryan Mathis <rmathis@unicon.net>
Date: Wed, 7 Mar 2018 12:11:19 -0700
Subject: [PATCH 2/6] Added New Filter Dropdown

---
 ui/src/app/app.component.html                 | 22 ++++++++----
 ui/src/app/app.component.scss                 |  4 +++
 .../container/new-filter.component.spec.ts    | 36 +++++++++++++++++++
 3 files changed, 56 insertions(+), 6 deletions(-)
 create mode 100644 ui/src/app/metadata-filter/container/new-filter.component.spec.ts

diff --git a/ui/src/app/app.component.html b/ui/src/app/app.component.html
index 2a0ada9c8..c4d8ef6d0 100644
--- a/ui/src/app/app.component.html
+++ b/ui/src/app/app.component.html
@@ -11,18 +11,28 @@
     </button>
     <div class="collapse navbar-collapse" id="navbar">
         <ul class="navbar-nav ml-auto">
+            <li class="nav-item dropdown" ngbDropdown placement="bottom-right">
+                <button class="nav-link btn btn-primary" id="addNewDropdown" ngbDropdownToggle>
+                    <i class="fa fa-plus-circle" aria-hidden="true"></i>
+                    Add New
+                </button>
+                <div ngbDropdownMenu aria-labelledby="addNewDropdown">
+                    <a class="nav-link" routerLink="/metadata-filter/new" routerLinkActive="active" aria-label="Add a new metadata filter">
+                        <i class="fa fa-cubes" aria-hidden="true"></i>
+                        <ng-container i18n="@@action--add-provider">Filter</ng-container>
+                    </a>
+                    <a class="nav-link" routerLink="/new" routerLinkActive="active" aria-label="Launch wizard to add a new provider">
+                        <i class="fa fa-cube" aria-hidden="true"></i>
+                        <ng-container i18n="@@action--add-provider">Metadata Provider</ng-container>
+                    </a>
+                </div>
+            </li>
             <li class="nav-item">
                 <a class="nav-link" routerLink="/dashboard" routerLinkActive="active" aria-label="Service provider dashboard">
                     <i class="fa fa-th" aria-hidden="true"></i>
                     <ng-container i18n="@@action--manage-providers">Manage Providers</ng-container>
                 </a>
             </li>
-            <li class="nav-item">
-                <a class="nav-link" routerLink="/new" routerLinkActive="active" aria-label="Launch wizard to add a new provider">
-                    <i class="fa fa-plus-circle" aria-hidden="true"></i>
-                    <ng-container i18n="@@action--add-provider">Add new provider</ng-container>
-                </a>
-            </li>
             <li>
                 <a class="nav-link" href="/logout" target="_self" aria-label="Log out of Shibboleth UI">
                     <i class="fa fa-sign-out" aria-hidden="true"></i>
diff --git a/ui/src/app/app.component.scss b/ui/src/app/app.component.scss
index e72a7d96c..769799707 100644
--- a/ui/src/app/app.component.scss
+++ b/ui/src/app/app.component.scss
@@ -1,4 +1,8 @@
 @import '../theme/palette';
 nav.navbar {
     background-color: $white;
+
+    .dropdown-menu {
+        min-width: 12rem;
+    }
 }
\ No newline at end of file
diff --git a/ui/src/app/metadata-filter/container/new-filter.component.spec.ts b/ui/src/app/metadata-filter/container/new-filter.component.spec.ts
new file mode 100644
index 000000000..642d26b8b
--- /dev/null
+++ b/ui/src/app/metadata-filter/container/new-filter.component.spec.ts
@@ -0,0 +1,36 @@
+import { TestBed, ComponentFixture } from '@angular/core/testing';
+import { ReactiveFormsModule } from '@angular/forms';
+import { StoreModule, Store, combineReducers } from '@ngrx/store';
+import { NewFilterComponent } from './new-filter.component';
+import * as fromFilter from '../reducer';
+
+describe('New Metadata Filter Page', () => {
+    let fixture: ComponentFixture<NewFilterComponent>;
+    let store: Store<fromFilter.State>;
+    let instance: NewFilterComponent;
+
+    beforeEach(() => {
+        TestBed.configureTestingModule({
+            providers: [],
+            imports: [
+                StoreModule.forRoot({
+                    providers: combineReducers(fromFilter.reducers),
+                }),
+                ReactiveFormsModule
+            ],
+            declarations: [NewFilterComponent],
+        });
+
+        fixture = TestBed.createComponent(NewFilterComponent);
+        instance = fixture.componentInstance;
+        store = TestBed.get(Store);
+
+        spyOn(store, 'dispatch').and.callThrough();
+    });
+
+    it('should compile', () => {
+        fixture.detectChanges();
+
+        expect(fixture).toBeDefined();
+    });
+});

From 84b7aaf038dd453ddbadc753d933e6f5e18b81c6 Mon Sep 17 00:00:00 2001
From: Ryan Mathis <rmathis@unicon.net>
Date: Wed, 7 Mar 2018 12:23:38 -0700
Subject: [PATCH 3/6] added a11y attributes

---
 ui/src/app/app.component.html | 22 ++++++++++++++++++----
 1 file changed, 18 insertions(+), 4 deletions(-)

diff --git a/ui/src/app/app.component.html b/ui/src/app/app.component.html
index c4d8ef6d0..80c1a9025 100644
--- a/ui/src/app/app.component.html
+++ b/ui/src/app/app.component.html
@@ -11,17 +11,31 @@
     </button>
     <div class="collapse navbar-collapse" id="navbar">
         <ul class="navbar-nav ml-auto">
-            <li class="nav-item dropdown" ngbDropdown placement="bottom-right">
-                <button class="nav-link btn btn-primary" id="addNewDropdown" ngbDropdownToggle>
+            <li class="nav-item dropdown" ngbDropdown placement="bottom-right" #dropdown="ngbDropdown">
+                <button
+                    class="nav-link btn btn-primary"
+                    id="addNewDropdown"
+                    role="button"
+                    aria-haspopup="true"
+                    aria-expanded="false"
+                    ngbDropdownToggle>
                     <i class="fa fa-plus-circle" aria-hidden="true"></i>
                     Add New
                 </button>
                 <div ngbDropdownMenu aria-labelledby="addNewDropdown">
-                    <a class="nav-link" routerLink="/metadata-filter/new" routerLinkActive="active" aria-label="Add a new metadata filter">
+                    <a class="nav-link"
+                        routerLink="/metadata-filter/new"
+                        routerLinkActive="active"
+                        aria-label="Add a new metadata filter"
+                        role="button">
                         <i class="fa fa-cubes" aria-hidden="true"></i>
                         <ng-container i18n="@@action--add-provider">Filter</ng-container>
                     </a>
-                    <a class="nav-link" routerLink="/new" routerLinkActive="active" aria-label="Launch wizard to add a new provider">
+                    <a class="nav-link"
+                        routerLink="/new"
+                        routerLinkActive="active"
+                        aria-label="Launch wizard to add a new provider"
+                        role="button">
                         <i class="fa fa-cube" aria-hidden="true"></i>
                         <ng-container i18n="@@action--add-provider">Metadata Provider</ng-container>
                     </a>

From 8dff23044ced1cce17de5bdcb14ad1723f8fa2e4 Mon Sep 17 00:00:00 2001
From: Ryan Mathis <rmathis@unicon.net>
Date: Wed, 7 Mar 2018 12:48:27 -0700
Subject: [PATCH 4/6] Added translations

---
 ui/package.json                               |  2 +-
 ui/src/app/app.component.html                 |  4 +--
 .../container/new-filter.component.html       |  4 ++-
 ui/src/locale/en.xlf                          | 30 +++++++++++++++++--
 ui/src/locale/es.xlf                          | 30 +++++++++++++++++--
 5 files changed, 60 insertions(+), 10 deletions(-)

diff --git a/ui/package.json b/ui/package.json
index 42dbf41a4..98bfc9ee7 100644
--- a/ui/package.json
+++ b/ui/package.json
@@ -4,7 +4,7 @@
   "license": "MIT",
   "scripts": {
     "ng": "ng",
-    "start": "ng serve --proxy-config proxy.conf.json",
+    "start": "ng serve --proxy-config proxy.conf.json --i18nFile=./src/locale/en.xlf --i18nFormat=xlf --locale=es --aot",
     "build": "ng build",
     "test": "ng test --code-coverage",
     "lint": "ng lint",
diff --git a/ui/src/app/app.component.html b/ui/src/app/app.component.html
index 80c1a9025..72be9c9bf 100644
--- a/ui/src/app/app.component.html
+++ b/ui/src/app/app.component.html
@@ -20,7 +20,7 @@
                     aria-expanded="false"
                     ngbDropdownToggle>
                     <i class="fa fa-plus-circle" aria-hidden="true"></i>
-                    Add New
+                    <ng-container i18n="@@action--add-new">Add New</ng-container>
                 </button>
                 <div ngbDropdownMenu aria-labelledby="addNewDropdown">
                     <a class="nav-link"
@@ -29,7 +29,7 @@
                         aria-label="Add a new metadata filter"
                         role="button">
                         <i class="fa fa-cubes" aria-hidden="true"></i>
-                        <ng-container i18n="@@action--add-provider">Filter</ng-container>
+                        <ng-container i18n="@@action--add-filter">Filter</ng-container>
                     </a>
                     <a class="nav-link"
                         routerLink="/new"
diff --git a/ui/src/app/metadata-filter/container/new-filter.component.html b/ui/src/app/metadata-filter/container/new-filter.component.html
index 5fb554c25..a96424fdb 100644
--- a/ui/src/app/metadata-filter/container/new-filter.component.html
+++ b/ui/src/app/metadata-filter/container/new-filter.component.html
@@ -4,7 +4,9 @@
             <div class="row justify-content-between">
                 <div class="col-md-12">
                     <span class="display-6">
-                    <i class="fa fa-gears"></i> New Filter Page</span>
+                        <i class="fa fa-gears"></i>
+                        <ng-container i18n="@@label--new-filter">New Filter</ng-container>
+                    </span>
                 </div>
             </div>
         </div>
diff --git a/ui/src/locale/en.xlf b/ui/src/locale/en.xlf
index 34522397b..bdb4d759d 100644
--- a/ui/src/locale/en.xlf
+++ b/ui/src/locale/en.xlf
@@ -18,14 +18,38 @@
           <context context-type="linenumber">17</context>
         </context-group>
       </trans-unit>
-      <trans-unit id="action--add-provider" datatype="html">
-        <source>Add new provider</source>
-        <target>Add new provider</target>
+      <trans-unit id="action--add-new" datatype="html">
+        <source>Add New</source>
+        <target>Add New</target>
         <context-group purpose="location">
           <context context-type="sourcefile">app/app.component.ts</context>
           <context context-type="linenumber">23</context>
         </context-group>
       </trans-unit>
+      <trans-unit id="action--add-provider" datatype="html">
+        <source>Metadata Provider</source>
+        <target>Metadata Provider</target>
+        <context-group purpose="location">
+          <context context-type="sourcefile">app/app.component.ts</context>
+          <context context-type="linenumber">40</context>
+        </context-group>
+      </trans-unit>
+      <trans-unit id="action--add-filter" datatype="html">
+        <source>Filter</source>
+        <target>Filter</target>
+        <context-group purpose="location">
+          <context context-type="sourcefile">app/app.component.ts</context>
+          <context context-type="linenumber">32</context>
+        </context-group>
+      </trans-unit>
+      <trans-unit id="label--new-filter" datatype="html">
+        <source>New Filter</source>
+        <target>New Filter</target>
+        <context-group purpose="location">
+          <context context-type="sourcefile">app/metadata-filter/container/new-filter.component.ts</context>
+          <context context-type="linenumber">8</context>
+        </context-group>
+      </trans-unit>
       <trans-unit id="action--logout" datatype="html">
         <source>Logout</source>
         <target>Logout</target>
diff --git a/ui/src/locale/es.xlf b/ui/src/locale/es.xlf
index a40224066..2a9c768de 100644
--- a/ui/src/locale/es.xlf
+++ b/ui/src/locale/es.xlf
@@ -18,14 +18,38 @@
           <context context-type="linenumber">17</context>
         </context-group>
       </trans-unit>
-      <trans-unit id="action--add-provider" datatype="html">
-        <source>Add new provider</source>
-        <target>Add new provider (es)</target>
+      <trans-unit id="action--add-new" datatype="html">
+        <source>Add New</source>
+        <target>Add New (es)</target>
         <context-group purpose="location">
           <context context-type="sourcefile">app/app.component.ts</context>
           <context context-type="linenumber">23</context>
         </context-group>
       </trans-unit>
+      <trans-unit id="action--add-provider" datatype="html">
+        <source>Metadata Provider</source>
+        <target>Metadata Provider (es)</target>
+        <context-group purpose="location">
+          <context context-type="sourcefile">app/app.component.ts</context>
+          <context context-type="linenumber">40</context>
+        </context-group>
+      </trans-unit>
+      <trans-unit id="action--add-filter" datatype="html">
+        <source>Filter</source>
+        <target>Filter (es)</target>
+        <context-group purpose="location">
+          <context context-type="sourcefile">app/app.component.ts</context>
+          <context context-type="linenumber">32</context>
+        </context-group>
+      </trans-unit>
+      <trans-unit id="label--new-filter" datatype="html">
+        <source>New Filter</source>
+        <target>New Filter (es)</target>
+        <context-group purpose="location">
+          <context context-type="sourcefile">app/metadata-filter/container/new-filter.component.ts</context>
+          <context context-type="linenumber">8</context>
+        </context-group>
+      </trans-unit>
       <trans-unit id="action--logout" datatype="html">
         <source>Logout</source>
         <target>Logout (es)</target>

From da83744fd0e876bbcf246739b3043ce3c9d9dc93 Mon Sep 17 00:00:00 2001
From: Ryan Mathis <rmathis@unicon.net>
Date: Wed, 7 Mar 2018 14:48:32 -0700
Subject: [PATCH 5/6] Fixed button sizing

---
 ui/src/app/app.component.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/ui/src/app/app.component.html b/ui/src/app/app.component.html
index 72be9c9bf..f555dd510 100644
--- a/ui/src/app/app.component.html
+++ b/ui/src/app/app.component.html
@@ -11,9 +11,9 @@
     </button>
     <div class="collapse navbar-collapse" id="navbar">
         <ul class="navbar-nav ml-auto">
-            <li class="nav-item dropdown" ngbDropdown placement="bottom-right" #dropdown="ngbDropdown">
+            <li class="dropdown d-flex align-items-center" ngbDropdown placement="bottom-right" #dropdown="ngbDropdown">
                 <button
-                    class="nav-link btn btn-primary"
+                    class="btn btn-primary btn-sm"
                     id="addNewDropdown"
                     role="button"
                     aria-haspopup="true"

From c5ae9fc157f4767119356d102e9c551734e3fae3 Mon Sep 17 00:00:00 2001
From: Ryan Mathis <rmathis@unicon.net>
Date: Wed, 7 Mar 2018 14:56:19 -0700
Subject: [PATCH 6/6] Switched button to outline

---
 ui/src/app/app.component.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ui/src/app/app.component.html b/ui/src/app/app.component.html
index f555dd510..0cbc98e1d 100644
--- a/ui/src/app/app.component.html
+++ b/ui/src/app/app.component.html
@@ -13,7 +13,7 @@
         <ul class="navbar-nav ml-auto">
             <li class="dropdown d-flex align-items-center" ngbDropdown placement="bottom-right" #dropdown="ngbDropdown">
                 <button
-                    class="btn btn-primary btn-sm"
+                    class="btn btn-outline-primary btn-sm"
                     id="addNewDropdown"
                     role="button"
                     aria-haspopup="true"