diff --git a/backend/src/main/java/edu/internet2/tier/shibboleth/admin/ui/domain/filters/EntityAttributesFilterTarget.java b/backend/src/main/java/edu/internet2/tier/shibboleth/admin/ui/domain/filters/EntityAttributesFilterTarget.java
index 68cab1d4c..5effdae3d 100644
--- a/backend/src/main/java/edu/internet2/tier/shibboleth/admin/ui/domain/filters/EntityAttributesFilterTarget.java
+++ b/backend/src/main/java/edu/internet2/tier/shibboleth/admin/ui/domain/filters/EntityAttributesFilterTarget.java
@@ -16,7 +16,7 @@
 @EqualsAndHashCode(callSuper = true)
 public class EntityAttributesFilterTarget extends AbstractAuditable {
     public enum EntityAttributesFilterTargetType {
-        ENTITY, CONDITION_SCRIPT, CONDITION_REF
+        ENTITY, CONDITION_SCRIPT, CONDITION_REF, REGEX
     }
 
     private static Logger LOGGER = LoggerFactory.getLogger(EntityAttributesFilterTarget.class);
diff --git a/ui/src/app/metadata/domain/domain.type.ts b/ui/src/app/metadata/domain/domain.type.ts
index 3cda36b83..e62766ed8 100644
--- a/ui/src/app/metadata/domain/domain.type.ts
+++ b/ui/src/app/metadata/domain/domain.type.ts
@@ -5,7 +5,7 @@ import {
 } from './model';
 
 import {
-    EntityAttributesFilter,
+    EntityAttributesFilterEntity,
     FileBackedHttpMetadataResolver
 } from './entity';
 import {
@@ -13,7 +13,7 @@ import {
 } from './model/providers';
 
 export type Filter =
-    | EntityAttributesFilter;
+    | EntityAttributesFilterEntity;
 
 export type Resolver =
     | FileBackedHttpMetadataResolver;
diff --git a/ui/src/app/metadata/domain/effect/entity.effect.spec.ts b/ui/src/app/metadata/domain/effect/entity.effect.spec.ts
index d42817b6e..9039a4cd9 100644
--- a/ui/src/app/metadata/domain/effect/entity.effect.spec.ts
+++ b/ui/src/app/metadata/domain/effect/entity.effect.spec.ts
@@ -8,7 +8,7 @@ import { EntityIdService } from '../service/entity-id.service';
 import { ResolverService } from '../service/resolver.service';
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
 import { NgbModalStub } from '../../../../testing/modal.stub';
-import { EntityAttributesFilter } from '../entity';
+import { EntityAttributesFilterEntity, FileBackedHttpMetadataResolver } from '../entity';
 
 describe('Entity Effects', () => {
     let effects: EntityEffects;
@@ -45,13 +45,22 @@ describe('Entity Effects', () => {
     });
 
     describe('openModal', () => {
-        it('should open a modal window', fakeAsync(() => {
+        it('should open a modal window for a filter', fakeAsync(() => {
             spyOn(modal, 'open').and.returnValue({componentInstance: <any>{}});
             spyOn(idService, 'preview').and.returnValue(of('<foo></foo>'));
-            effects.openModal(new EntityAttributesFilter());
+            effects.openModal(new EntityAttributesFilterEntity());
             expect(idService.preview).toHaveBeenCalled();
             tick(10);
             expect(modal.open).toHaveBeenCalled();
         }));
+
+        it('should open a modal window for a provider', fakeAsync(() => {
+            spyOn(modal, 'open').and.returnValue({ componentInstance: <any>{} });
+            spyOn(providerService, 'preview').and.returnValue(of('<foo></foo>'));
+            effects.openModal(new FileBackedHttpMetadataResolver());
+            expect(providerService.preview).toHaveBeenCalled();
+            tick(10);
+            expect(modal.open).toHaveBeenCalled();
+        }));
     });
 });
diff --git a/ui/src/app/metadata/domain/entity/filter/entity-attributes-filter.spec.ts b/ui/src/app/metadata/domain/entity/filter/entity-attributes-filter.spec.ts
new file mode 100644
index 000000000..04d1234be
--- /dev/null
+++ b/ui/src/app/metadata/domain/entity/filter/entity-attributes-filter.spec.ts
@@ -0,0 +1,17 @@
+import { EntityAttributesFilterEntity } from './entity-attributes-filter';
+
+describe('EntityAttributesFilter Entity', () => {
+    let entity: EntityAttributesFilterEntity;
+    beforeEach(() => {
+        entity = new EntityAttributesFilterEntity({
+            resourceId: 'foo',
+            filterEnabled: false
+        });
+    });
+
+    it('should be an instance', () => {
+        expect(entity).toBeDefined();
+        expect(entity.resourceId).toBe('foo');
+        expect(entity.enabled).toBe(entity.filterEnabled);
+    });
+});
diff --git a/ui/src/app/metadata/domain/entity/filter/entity-attributes-filter.ts b/ui/src/app/metadata/domain/entity/filter/entity-attributes-filter.ts
index c3b9edc98..304e6055e 100644
--- a/ui/src/app/metadata/domain/entity/filter/entity-attributes-filter.ts
+++ b/ui/src/app/metadata/domain/entity/filter/entity-attributes-filter.ts
@@ -2,7 +2,7 @@ import { MetadataFilter, MetadataEntity, RelyingPartyOverrides } from '../../mod
 import { MetadataTypes } from '../../domain.type';
 import { FilterTarget } from '../../model';
 
-export class EntityAttributesFilter implements MetadataFilter, MetadataEntity {
+export class EntityAttributesFilterEntity implements MetadataFilter, MetadataEntity {
     createdDate?: string;
     modifiedDate?: string;
     version: string;
@@ -25,7 +25,7 @@ export class EntityAttributesFilter implements MetadataFilter, MetadataEntity {
         value: ['']
     };
 
-    constructor(obj?: Partial<EntityAttributesFilter>) {
+    constructor(obj?: Partial<EntityAttributesFilterEntity>) {
         Object.assign(this, { ...obj });
     }
 
diff --git a/ui/src/app/metadata/domain/model/metadata-filter.ts b/ui/src/app/metadata/domain/model/metadata-filter.ts
index 093fc4cf6..5cb50e2ea 100644
--- a/ui/src/app/metadata/domain/model/metadata-filter.ts
+++ b/ui/src/app/metadata/domain/model/metadata-filter.ts
@@ -1,11 +1,10 @@
 import { MetadataBase } from './metadata-base';
 
 export interface MetadataFilter extends MetadataBase {
-    entityId: string;
     name: string;
     filterEnabled?: boolean;
     type: string;
     resourceId: string;
 
-    serialize(): any;
+    [key: string]: any;
 }
diff --git a/ui/src/app/metadata/domain/service/filter.service.spec.ts b/ui/src/app/metadata/domain/service/filter.service.spec.ts
index 571940935..218054885 100644
--- a/ui/src/app/metadata/domain/service/filter.service.spec.ts
+++ b/ui/src/app/metadata/domain/service/filter.service.spec.ts
@@ -2,7 +2,7 @@ import { TestBed, async, inject } from '@angular/core/testing';
 import { HttpTestingController, HttpClientTestingModule } from '@angular/common/http/testing';
 import { HttpClientModule, HttpRequest } from '@angular/common/http';
 import { MetadataFilterService } from './filter.service';
-import { EntityAttributesFilter } from '../entity';
+import { EntityAttributesFilterEntity } from '../entity';
 
 describe(`Metadata Filter Service`, () => {
 
@@ -49,7 +49,7 @@ describe(`Metadata Filter Service`, () => {
         it(`should send an expected PUT request`, async(inject([MetadataFilterService, HttpTestingController],
             (service: MetadataFilterService, backend: HttpTestingController) => {
                 const id = 'bar';
-                const filter = new EntityAttributesFilter({ resourceId: id });
+                const filter = new EntityAttributesFilterEntity({ resourceId: id });
                 service.update(provider, filter).subscribe();
 
                 backend.expectOne((req: HttpRequest<any>) => {
@@ -63,7 +63,7 @@ describe(`Metadata Filter Service`, () => {
         it(`should send an expected POST request`, async(inject([MetadataFilterService, HttpTestingController],
             (service: MetadataFilterService, backend: HttpTestingController) => {
                 const id = 'bar';
-                const filter = new EntityAttributesFilter({ id });
+                const filter = new EntityAttributesFilterEntity({ resourceId: id });
                 service.save(provider, filter).subscribe();
 
                 backend.expectOne((req: HttpRequest<any>) => {
diff --git a/ui/src/app/metadata/filter/container/edit-filter.component.html b/ui/src/app/metadata/filter/container/edit-filter.component.html
index 2a2267d26..3dedb28f6 100644
--- a/ui/src/app/metadata/filter/container/edit-filter.component.html
+++ b/ui/src/app/metadata/filter/container/edit-filter.component.html
@@ -1,184 +1,41 @@
 <div class="container-fluid p-3" role="main">
-    <section class="section" *ngIf="filter$ | async">
+    <section class="section">
         <div class="section-header bg-info p-2 text-white">
             <div class="row justify-content-between">
                 <div class="col-md-12">
                     <span class="display-6">
                         <i class="fa fa-fw fa-gears"></i>
-                        <ng-container i18n="@@label--edit-filter">Edit Filter - {{ (filter$ | async).name }}</ng-container>
+                        <ng-container i18n="@@label--new-filter">new EntityAttributesFilter</ng-container>
                     </span>
                 </div>
             </div>
         </div>
-        <div class="section-body p-4 border border-top-0 border-info">
-            <form [formGroup]="form">
-                <div class="row">
-                    <div class="col-lg-6 col-xs-9 ">
-                        <fieldset class="">
-                            <div class="form-group">
-                                <div class="row">
-                                    <label for="name" class="col-sm-10">
-                                        <span>
-                                            <ng-container i18n="@@label--filter-name">
-                                                Filter Name
-                                            </ng-container>
-                                            <ng-container i18n="@@label--dashboard-display-only">
-                                                (Dashboard Display Only)
-                                            </ng-container>
-                                            <i class="fa fa-fw fa-asterisk text-danger" aria-hidden="true"></i>
-                                        </span>
-                                    </label>
-                                    <span class="text-right col-sm-2">
-                                        <ng-template #tooltipFilterName i18n="@@tooltip--filter-name">Filter Name</ng-template>
-                                        <i class="info-icon fa fa-fw fa-info-circle text-primary fa-lg" [ngbPopover]="tooltipFilterName" i18n-aria-label="@@tooltip--instruction"
-                                            aria-label="Information icon - press spacebar to read additional information for this form field"></i>
-                                    </span>
-                                </div>
-                                <input id="name" type="text" class="form-control" placeholder="" formControlName="name" />
-                                <ng-container *ngIf="form.get('name').touched && form.get('name').invalid">
-                                    <small class="form-text text-danger" *ngIf="form.get('name').hasError('required')">
-                                        <ng-container i18n="@@message--filter-name-required">Filter Name is required</ng-container>
-                                    </small>
-                                </ng-container>
-                            </div>
-                            <div class="form-group">
-                                <div class="row">
-                                    <label for="entityId" class="col-sm-10">
-                                        <span>
-                                            <ng-container i18n="@@label--search-entity-id">Search Entity ID</ng-container>
-                                            <i class="fa fa-fw fa-asterisk text-danger" aria-hidden="true"></i>
-                                            <i class="fa fa-fw fa-spinner fa-pulse fa-fw" *ngIf="processing$ | async"></i>
-                                        </span>
-                                    </label>
-                                    <span class="text-right col-sm-2">
-                                        <ng-template #tooltipFilterEntityId i18n="@@tooltip--search-entity-id">Search Entity ID</ng-template>
-                                        <i class="info-icon fa fa-fw fa-info-circle text-primary fa-lg" [ngbPopover]="tooltipFilterEntityId" i18n-aria-label="@@tooltip--instruction"
-                                            aria-label="Information icon - press spacebar to read additional information for this form field"></i>
-                                    </span>
-                                </div>
-                                <label for="entityId" class="sr-only" i18n="@@label--search-entity-id">Search Entity ID</label>
-                                <div class="row">
-                                    <div class="col-9">
-                                        <auto-complete id="entityId"
-                                            #entityInput
-                                            class="component-control"
-                                            formControlName="entityId"
-                                            limit="10"
-                                            [matches]="entityIds$ | async"
-                                            [required]="true"
-                                            [processing]="(processing$ | async)"
-                                            (more)="onViewMore($event)">
-                                        </auto-complete>
-                                        <small class="form-text text-muted" i18n="@@label--min-chars">
-                                            Minimum 4 characters.
-                                        </small>
-                                        <ng-container *ngIf="form.get('entityId').touched && form.get('entityId').invalid">
-                                            <small class="form-text text-danger">
-                                                <ng-container *ngIf="form.get('entityId').hasError('required')" i18n="@@message--entity-id-required">Entity ID is required</ng-container>
-                                                <ng-container *ngIf="form.get('entityId').hasError('exists')" i18n="@@message--entity-id-not-found">Entity ID not found</ng-container>
-                                            </small>
-                                        </ng-container>
-                                    </div>
-                                    <div class="col-3">
-                                        <button
-                                            *ngIf="form.get('entityId').disabled"
-                                            class="btn btn-block btn-secondary"
-                                            type="button"
-                                            (click)="onChangeId()">
-                                            Change ID
-                                        </button>
-                                        <button
-                                            *ngIf="form.get('entityId').enabled"
-                                            class="btn btn-block btn-outline-secondary"
-                                            type="button"
-                                            (click)="onCancelChangeId()">
-                                            Cancel
-                                        </button>
-                                    </div>
-                                </div>
-                            </div>
-                        </fieldset>
-                    </div>
-                    <div class="col-lg-6 col-xs-3 text-right">
-                        <button (click)="this.preview(filter)" type="submit" class="btn btn-success">
-                            <i class="fa fa-fw fa-eye fa-lg"></i>
-                            <ng-container i18n="@@action--save">Preview XML</ng-container>
-                        </button>
-                        &nbsp;
-                        <button
-                            (click)="this.save($event)"
-                            type="submit"
-                            class="btn btn-primary"
-                            [disabled]="form.invalid || (isSaving$ | async)">
-                            <i class="fa fa-fw fa-lg"
-                                [ngClass]="{
-                                    'fa-save': !(isSaving$ | async),
-                                    'fa-spinner': (isSaving$ | async),
-                                    'fa-pulse': (isSaving$ | async)
-                                }"></i>
-                            <ng-container i18n="@@action--save">Save</ng-container>
-                        </button>
-                        &nbsp;
-                        <button
-                            (click)="this.cancel()"
-                            type="reset"
-                            class="btn btn-secondary"
-                            [disabled]="isSaving$ | async   ">
-                            <ng-container i18n="@@action--cancel">Cancel</ng-container>
-                        </button>
-                    </div>
-                </div>
-                <section>
-                    <hr />
-                    <div class="row" *ngIf="preview$ | async">
-                        <fieldset class="col-lg-6">
-                            <div class="form-group">
-                                <div class="row">
-                                    <label for="name" class="col-sm-10"  i18n="@@label--entity-preview">
-                                         Entity ID Preview (read-only)
-                                    </label>
-                                    <span class="text-right col-sm-2">
-                                        <ng-template #tooltipName i18n="@@tooltip--entity-preview">Entity Preview</ng-template>
-                                        <i class="info-icon fa fa-fw fa-info-circle text-primary fa-lg" [ngbPopover]="tooltipName" i18n-aria-label="@@tooltip--instruction"
-                                            aria-label="Information icon - press spacebar to read additional information for this form field"></i>
-                                    </span>
-                                </div>
-                                <dl>
-                                    <dt class="text-primary" i18n="@@label--display-name">Display Name</dt>
-                                    <dd class="value">{{ (preview$ | async).displayName }}</dd>
-                                    <dt class="text-primary" i18n="@@label--description">Description</dt>
-                                    <dd class="value">{{ (preview$ | async).description || '&mdash;' }}</dd>
-                                </dl>
-                            </div>
-                            <hr />
-                        </fieldset>
-                    </div>
-                    <div class="row">
-                        <div class="col-12">
-                            <div class="form-group">
-                                <div class="custom-control custom-checkbox custom-control-inline custom-control-reverse" for="filterEnabled">
-                                    <input disableValidation="true" class="custom-control-input" type="checkbox" formControlName="filterEnabled" id="filterEnabled"
-                                        name="filterEnabled" role="checkbox">
-                                    <label class="custom-control-label" i18n="@@label--enable-this-filter" for="filterEnabled" aria-label="Enable this filter?">
-                                        Enable this filter?
-                                    </label>
-                                </div>
-                                <ng-template #tooltipEnableThisFilterUponSaving i18n="@@tooltip--enable-this-filter-upon-saving">Enable this filter upon saving popover</ng-template>
-                                <i class="info-icon fa fa-fw fa-info-circle text-primary fa-lg" [ngbPopover]="tooltipEnableThisFilterUponSaving" i18n-aria-label="@@tooltip--instruction"
-                                    role="tooltip"></i>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="row" *ngIf="filter$ | async">
-                        <div class="col-lg-6">
-                            <relying-party-form [resolver]="filter$ | async"></relying-party-form>
-                        </div>
-                        <div class="col-lg-6">
-                            <attribute-release-form [resolver]="filter$ | async"></attribute-release-form>
-                        </div>
-                    </div>
-                </section>
-            </form>
+        <div class="section-body p-4 border border-top-0 border-info" *ngIf="schema$ | async">
+            <div class="mx-3 my-2 d-flex justify-content-end">
+                <button (click)="this.preview(filter)" type="submit" class="btn btn-success">
+                    <i class="fa fa-fw fa-eye fa-lg"></i>
+                    <ng-container i18n="@@action--save">Preview XML</ng-container>
+                </button>
+                &nbsp;
+                <button (click)="this.save()" type="submit" class="btn btn-primary" [disabled]="!isValid || (isSaving$ | async)">
+                    <i class="fa fa-fw fa-lg" [ngClass]="{
+                        'fa-save': !(isSaving$ | async),
+                        'fa-spinner': (isSaving$ | async),
+                        'fa-pulse': (isSaving$ | async)
+                    }"></i>
+                    <ng-container i18n="@@action--save">Save</ng-container>
+                </button>
+                &nbsp;
+                <button (click)="this.cancel()" type="reset" class="btn btn-secondary" [disabled]="isSaving$ | async">
+                    <ng-container i18n="@@action--cancel">Cancel</ng-container>
+                </button>
+            </div>
+            <sf-form
+                [schema]="schema$ | async"
+                [model]="model$ | async"
+                [validators]="definition.getValidators()"
+                (onChange)="valueChangeSubject.next($event)"
+                (onErrorChange)="statusChangeSubject.next($event)"></sf-form>
         </div>
     </section>
-</div>
\ No newline at end of file
+</div>
diff --git a/ui/src/app/metadata/filter/container/edit-filter.component.spec.ts b/ui/src/app/metadata/filter/container/edit-filter.component.spec.ts
index e69de29bb..8f632b0d8 100644
--- a/ui/src/app/metadata/filter/container/edit-filter.component.spec.ts
+++ b/ui/src/app/metadata/filter/container/edit-filter.component.spec.ts
@@ -0,0 +1,99 @@
+import { TestBed, ComponentFixture } from '@angular/core/testing';
+import { ReactiveFormsModule, FormBuilder } from '@angular/forms';
+import { StoreModule, Store, combineReducers } from '@ngrx/store';
+import { NewFilterComponent } from './new-filter.component';
+import * as fromFilter from '../reducer';
+import { ProviderEditorFormModule } from '../../domain/component';
+import { ProviderStatusEmitter, ProviderValueEmitter } from '../../domain/service/provider-change-emitter.service';
+import { NgbPopoverModule, NgbPopoverConfig } from '@ng-bootstrap/ng-bootstrap';
+import { NavigatorService } from '../../../core/service/navigator.service';
+import { SharedModule } from '../../../shared/shared.module';
+import { EditFilterComponent } from './edit-filter.component';
+import { SchemaFormModule, WidgetRegistry, DefaultWidgetRegistry } from 'ngx-schema-form';
+import { SchemaService } from '../../../schema-form/service/schema.service';
+import { HttpClientModule } from '@angular/common/http';
+
+describe('New Metadata Filter Page', () => {
+    let fixture: ComponentFixture<EditFilterComponent>;
+    let store: Store<fromFilter.State>;
+    let instance: EditFilterComponent;
+
+    beforeEach(() => {
+        TestBed.configureTestingModule({
+            providers: [
+                ProviderStatusEmitter,
+                ProviderValueEmitter,
+                FormBuilder,
+                NgbPopoverConfig,
+                NavigatorService,
+                SchemaService,
+                { provide: WidgetRegistry, useClass: DefaultWidgetRegistry }
+            ],
+            imports: [
+                StoreModule.forRoot({
+                    'filter': combineReducers(fromFilter.reducers),
+                }),
+                ReactiveFormsModule,
+                ProviderEditorFormModule,
+                NgbPopoverModule,
+                SharedModule,
+                HttpClientModule,
+                SchemaFormModule.forRoot()
+            ],
+            declarations: [
+                EditFilterComponent
+            ],
+        });
+
+        fixture = TestBed.createComponent(EditFilterComponent);
+        instance = fixture.componentInstance;
+        store = TestBed.get(Store);
+
+        spyOn(store, 'dispatch').and.callThrough();
+    });
+
+    it('should compile', () => {
+        fixture.detectChanges();
+
+        expect(fixture).toBeDefined();
+    });
+
+    describe('cancel method', () => {
+        it('should dispatch a cancel changes action', () => {
+            fixture.detectChanges();
+            instance.cancel();
+            expect(store.dispatch).toHaveBeenCalled();
+        });
+    });
+
+    describe('preview method', () => {
+        it('should dispatch a cancel changes action', () => {
+            fixture.detectChanges();
+            instance.cancel();
+            expect(store.dispatch).toHaveBeenCalled();
+        });
+    });
+
+    describe('status emitter', () => {
+        it('should set the isValid property to true', () => {
+            fixture.detectChanges();
+            instance.statusChangeSubject.next({value: []});
+            fixture.detectChanges();
+            expect(instance.isValid).toBe(true);
+        });
+
+        it('should set the isValid property to true if value is undefined', () => {
+            fixture.detectChanges();
+            instance.statusChangeSubject.next({value: null});
+            fixture.detectChanges();
+            expect(instance.isValid).toBe(true);
+        });
+
+        it('should set the isValid property to false', () => {
+            fixture.detectChanges();
+            instance.statusChangeSubject.next({ value: [{control: 'foo'}] });
+            fixture.detectChanges();
+            expect(instance.isValid).toBe(false);
+        });
+    });
+});
diff --git a/ui/src/app/metadata/filter/container/edit-filter.component.ts b/ui/src/app/metadata/filter/container/edit-filter.component.ts
index d2921013f..f12429000 100644
--- a/ui/src/app/metadata/filter/container/edit-filter.component.ts
+++ b/ui/src/app/metadata/filter/container/edit-filter.component.ts
@@ -1,178 +1,67 @@
-import { Component, OnInit, OnDestroy, SimpleChanges, ViewChild, ElementRef } from '@angular/core';
-import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { Component } from '@angular/core';
 import { Store } from '@ngrx/store';
-import { Observable, Subject } from 'rxjs';
-import { withLatestFrom, distinctUntilChanged, takeUntil, startWith, filter } from 'rxjs/operators';
+import { Subject, Observable, of } from 'rxjs';
 
-import * as fromRoot from '../../../app.reducer';
 import * as fromFilter from '../reducer';
-
-import { ProviderValueEmitter } from '../../domain/service/provider-change-emitter.service';
-import { CancelCreateFilter, SelectId, UpdateFilterChanges } from '../action/filter.action';
-import { UpdateFilterRequest } from '../../filter/action/collection.action';
-import { MetadataFilter } from '../../domain/model/metadata-filter';
-import { EntityValidators } from '../../domain/service/entity-validators.service';
-import { QueryEntityIds, ViewMoreIds, ClearSearch } from '../action/search.action';
-import { AutoCompleteComponent } from '../../../shared/autocomplete/autocomplete.component';
-import { MDUI } from '../../domain/model';
+import { MetadataFilterTypes, EntityAttributesFilter } from '../model';
+import { FormDefinition } from '../../../wizard/model';
+import { MetadataFilter, MetadataEntity } from '../../domain/model';
+import { SchemaService } from '../../../schema-form/service/schema.service';
+import { UpdateFilterRequest } from '../action/collection.action';
+import { CancelCreateFilter, UpdateFilterChanges } from '../action/filter.action';
 import { PreviewEntity } from '../../domain/action/entity.action';
-import { MetadataEntity } from '../../domain/model';
-import { EntityAttributesFilter } from '../../domain/entity/filter/entity-attributes-filter';
+import { EntityAttributesFilterEntity } from '../../domain/entity';
 
 @Component({
     selector: 'edit-filter-page',
     templateUrl: './edit-filter.component.html'
 })
-export class EditFilterComponent implements OnInit, OnDestroy {
-
-    @ViewChild(AutoCompleteComponent) entityInput: AutoCompleteComponent;
+export class EditFilterComponent {
 
-    private ngUnsubscribe: Subject<void> = new Subject<void>();
+    valueChangeSubject = new Subject<Partial<any>>();
+    private valueChangeEmitted$ = this.valueChangeSubject.asObservable();
 
-    changeId = false;
+    statusChangeSubject = new Subject<{ value: any[] }>();
+    private statusChangeEmitted$ = this.statusChangeSubject.asObservable();
 
-    changes$: Observable<MetadataFilter>;
-    changes: MetadataFilter;
+    definition: FormDefinition<MetadataFilter>;
+    schema$: Observable<any>;
 
-    ids: string[];
-    entityIds$: Observable<string[]>;
-    showMore$: Observable<boolean>;
-    selected$: Observable<string>;
-    filter$: Observable<MetadataFilter>;
-    loading$: Observable<boolean>;
-    processing$: Observable<boolean>;
-    preview$: Observable<MDUI>;
+    model$: Observable<MetadataFilter>;
     isSaving$: Observable<boolean>;
-
-    form: FormGroup = this.fb.group({
-        entityId: [
-            '',
-            [Validators.required]
-        ],
-        name: ['', [Validators.required]],
-        filterEnabled: [false]
-    });
-
     filter: MetadataFilter;
-    filterEntity: EntityAttributesFilter;
-
-    isValid = false;
+    isValid: boolean;
 
     constructor(
-        private store: Store<fromRoot.State>,
-        private valueEmitter: ProviderValueEmitter,
-        private fb: FormBuilder
+        private store: Store<fromFilter.State>,
+        private schemaService: SchemaService
     ) {
-        this.changes$ = this.store.select(fromFilter.getFilterWithChanges);
-        this.changes$
-            .pipe(
-                distinctUntilChanged()
-            )
-            .subscribe(c => {
-                this.changes = new EntityAttributesFilter(c);
-            });
+        this.definition = MetadataFilterTypes.EntityAttributesFilter;
 
-        this.showMore$ = this.store.select(fromFilter.getViewingMore);
-        this.selected$ = this.store.select(fromFilter.getSelected);
-        this.filter$ = this.store.select(fromFilter.getSelectedFilter);
-        this.entityIds$ = this.store.select(fromFilter.getEntityCollection);
-        this.loading$ = this.store.select(fromFilter.getIsLoading);
-        this.processing$ = this.loading$.pipe(withLatestFrom(this.showMore$, (l, s) => !s && l));
-        this.preview$ = this.store.select(fromFilter.getPreview);
+        this.schema$ = this.schemaService.get(this.definition.schema);
         this.isSaving$ = this.store.select(fromFilter.getSaving);
+        this.model$ = this.store.select(fromFilter.getSelectedFilter);
 
-        this.entityIds$.subscribe(ids => this.ids = ids);
-
-        this.filter$
-            .pipe(
-                filter(f => !!f)
-            )
-            .subscribe(filter => {
-                this.filterEntity = new EntityAttributesFilter(filter);
-                let { entityId, name, filterEnabled } = this.filterEntity;
-                this.form.patchValue({
-                    entityId,
-                    name,
-                    filterEnabled
-                });
-                this.filter = filter;
-                this.store.dispatch(new SelectId(entityId));
+        this.valueChangeEmitted$.subscribe(changes => this.store.dispatch(new UpdateFilterChanges(changes.value)));
+        this.statusChangeEmitted$.subscribe(valid => {
+            this.isValid = valid.value ? valid.value.length === 0 : true;
+        });
 
-                this.form.get('entityId').disable();
-            });
+        this.store
+            .select(fromFilter.getFilter)
+            .subscribe(filter => this.filter = filter);
     }
 
-    ngOnInit(): void {
-        let id = this.form.get('entityId');
-        id.valueChanges.pipe(distinctUntilChanged())
-            .subscribe(query => this.searchEntityIds(query));
-
-        this.form.valueChanges.pipe(
-            takeUntil(this.ngUnsubscribe),
-            startWith(this.form.value)
-        ).subscribe(changes => this.store.dispatch(new UpdateFilterChanges(changes)));
-
-        this.valueEmitter.changeEmitted$.pipe(
-            takeUntil(this.ngUnsubscribe),
-            startWith(this.form.value)
-        ).subscribe(changes => this.store.dispatch(new UpdateFilterChanges(changes)));
-
-        id.valueChanges
-            .pipe(distinctUntilChanged())
-            .subscribe(entityId => id.valid ? this.store.dispatch(new SelectId(entityId)) : null);
-
-        this.selected$
-            .pipe(distinctUntilChanged())
-            .subscribe(entityId => id.setValue(entityId));
-    }
-
-    ngOnDestroy(): void {
-        this.ngUnsubscribe.next();
-        this.ngUnsubscribe.complete();
-    }
-
-    onChangeId(): void {
-        const input = this.form.get('entityId');
-        input.enable();
-        input.setAsyncValidators(EntityValidators.existsInCollection(this.store.select(fromFilter.getEntityCollection)));
-        input.reset('');
-        this.entityInput.inputField.nativeElement.focus();
-    }
-
-    onCancelChangeId(): void {
-        const input = this.form.get('entityId');
-        input.disable();
-        input.clearAsyncValidators();
-        input.setValue(this.filterEntity.entityId);
-    }
-
-    searchEntityIds(term: string): void {
-        if (term && term.length >= 4 && this.ids.indexOf(term) < 0) {
-            this.store.dispatch(new QueryEntityIds({
-                term,
-                limit: 10
-            }));
-        }
-    }
-
-    onViewMore(query: string): void {
-        this.store.dispatch(new ViewMoreIds(query));
-    }
-
-    onStatusChange(status): void {
-        this.isValid = status === 'VALID';
-    }
-
-    save($event): void {
-        $event.preventDefault();
-        this.store.dispatch(new UpdateFilterRequest({...this.filter, ...this.changes.serialize()}));
+    save(): void {
+        this.store.dispatch(new UpdateFilterRequest(this.filter));
     }
 
     cancel(): void {
         this.store.dispatch(new CancelCreateFilter());
     }
 
-    preview(entity: MetadataEntity): void {
-        this.store.dispatch(new PreviewEntity(new EntityAttributesFilter(entity)));
+    preview(entity: MetadataFilter): void {
+        this.store.dispatch(new PreviewEntity(new EntityAttributesFilterEntity(entity)));
     }
 }
+
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 0985f9764..2ab55b2ae 100644
--- a/ui/src/app/metadata/filter/container/new-filter.component.html
+++ b/ui/src/app/metadata/filter/container/new-filter.component.html
@@ -10,141 +10,27 @@
                 </div>
             </div>
         </div>
-        <div class="section-body p-4 border border-top-0 border-info">
-            <form [formGroup]="form">
-                <div class="row">
-                    <div class="col-lg-6 col-xs-9 ">
-                        <fieldset class="">
-                            <div class="form-group">
-                                <div class="row">
-                                    <label for="name" class="col-sm-10">
-                                        <span>
-                                            <ng-container i18n="@@label--filter-name">
-                                                Filter Name
-                                            </ng-container>
-                                            <ng-container i18n="@@label--dashboard-display-only">
-                                                (Dashboard Display Only)
-                                            </ng-container>
-                                            <i class="fa fa-fw fa-asterisk text-danger" aria-hidden="true"></i>
-                                        </span>
-                                    </label>
-                                    <span class="text-right col-sm-2">
-                                        <ng-template #tooltipName i18n="@@tooltip--filter-name">Filter Name</ng-template>
-                                        <i class="info-icon fa fa-fw fa-info-circle text-primary fa-lg" [ngbPopover]="tooltipName" i18n-aria-label="@@tooltip--instruction"
-                                            aria-label="Information icon - press spacebar to read additional information for this form field"></i>
-                                    </span>
-                                </div>
-                                <input id="name" type="text" class="form-control" placeholder="" formControlName="name" />
-                                <ng-container *ngIf="form.get('name').touched && form.get('name').invalid">
-                                    <small class="form-text text-danger" *ngIf="form.get('name').hasError('required')">
-                                        <ng-container i18n="@@message--service-provider-name-required">Filter Name is required</ng-container>
-                                    </small>
-                                </ng-container>
-                            </div>
-                            <div class="form-group">
-                                <div class="row">
-                                    <label for="entityId" class="col-sm-10">
-                                        <span>
-                                            <ng-container i18n="@@label--search-entity-id">Search Entity ID</ng-container>
-                                            <i class="fa fa-fw fa-asterisk text-danger" aria-hidden="true"></i>
-                                            <i class="fa fa-fw fa-spinner fa-pulse fa-fw" *ngIf="processing$ | async"></i>
-                                        </span>
-                                    </label>
-                                    <span class="text-right col-sm-2">
-                                        <ng-template #tooltipFilterEntityId i18n="@@tooltip--search-entity-id">Search Entity ID</ng-template>
-                                        <i class="info-icon fa fa-fw fa-info-circle text-primary fa-lg" [ngbPopover]="tooltipFilterEntityId" i18n-aria-label="@@tooltip--instruction"
-                                            aria-label="Information icon - press spacebar to read additional information for this form field"></i>
-                                    </span>
-                                </div>
-                                <label for="entityId" class="sr-only">Search Entity ID</label>
-                                <auto-complete id="entityId" class="component-control" formControlName="entityId" limit="10" [matches]="entityIds$ | async"
-                                    [required]="true" [processing]="(processing$ | async)" (more)="onViewMore($event)">
-                                </auto-complete>
-                                <small class="form-text text-muted" i18n="@@label--min-4-chars">
-                                    Minimum 4 characters.
-                                </small>
-                                <ng-container *ngIf="form.get('entityId').touched && form.get('entityId').invalid">
-                                    <small class="form-text text-danger">
-                                        <ng-container *ngIf="form.get('entityId').hasError('required')" i18n="@@message--entity-id-required">Entity ID is required</ng-container>
-                                        <ng-container *ngIf="form.get('entityId').hasError('exists')" i18n="@@message--entity-id-not-found">Entity ID not found</ng-container>
-                                    </small>
-                                </ng-container>
-                            </div>
-                        </fieldset>
-                    </div>
-                    <div class="col-lg-6 col-xs-3 text-right">
-                        <button (click)="this.save()"
-                            type="submit"
-                            class="btn btn-primary"
-                            [disabled]="form.invalid || (isSaving$ | async)">
-                            <i class="fa fa-fw fa-lg"
-                                [ngClass]="{
-                                    'fa-save': !(isSaving$ | async),
-                                    'fa-spinner': (isSaving$ | async),
-                                    'fa-pulse': (isSaving$ | async)
-                                }"></i>
-                            <ng-container i18n="@@action--save">Save</ng-container>
-                        </button>
-                         &nbsp;
-                        <button (click)="this.cancel()"
-                            type="reset"
-                            class="btn btn-secondary"
-                            [disabled]="isSaving$ | async">
-                            <ng-container i18n="@@action--cancel">Cancel</ng-container>
-                        </button>
-                    </div>
-                </div>
-                <section *ngIf="form.get('entityId').valid">
-                    <hr />
-                    <div class="row" *ngIf="preview$ | async">
-                        <fieldset class="col-lg-6">
-                            <div class="form-group">
-                                <div class="row">
-                                    <label for="name" class="col-sm-10" i18n="@@label--entity-preview">
-                                        Entity ID Preview (read-only)
-                                    </label>
-                                    <span class="text-right col-sm-2">
-                                        <ng-template #tooltipName i18n="@@tooltip--entity-preview">Entity Preview</ng-template>
-                                        <i class="info-icon fa fa-fw fa-info-circle text-primary fa-lg" [ngbPopover]="tooltipName" i18n-aria-label="@@tooltip--instruction"
-                                            aria-label="Information icon - press spacebar to read additional information for this form field"></i>
-                                    </span>
-                                </div>
-                                <dl>
-                                    <dt class="text-primary" i18n="@@label--display-name">Display Name</dt>
-                                    <dd class="value">{{ (preview$ | async).displayName }}</dd>
-                                    <dt class="text-primary" i18n="@@label--description">Description</dt>
-                                    <dd class="value">{{ (preview$ | async).description || '&mdash;' }}</dd>
-                                </dl>
-                            </div>
-                            <hr />
-                        </fieldset>
-                    </div>
-                    <div class="row">
-                        <div class="col-12">
-                            <div class="form-group">
-                                <div class="custom-control custom-checkbox custom-control-inline custom-control-reverse" for="filterEnabled">
-                                    <input disableValidation="true" class="custom-control-input" type="checkbox" formControlName="filterEnabled" id="filterEnabled"
-                                        name="filterEnabled" role="checkbox">
-                                    <label class="custom-control-label" i18n="@@label--enable-this-filter" for="filterEnabled" aria-label="Enable this filter?">
-                                        Enable this filter?
-                                    </label>
-                                </div>
-                                <ng-template #tooltipEnableThisFilterUponSaving i18n="@@tooltip--enable-this-filter-upon-saving">Enable this filter upon saving popover</ng-template>
-                                <i class="info-icon fa fa-fw fa-info-circle text-primary fa-lg" [ngbPopover]="tooltipEnableThisFilterUponSaving" i18n-aria-label="@@tooltip--instruction"
-                                    role="tooltip"></i>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="row">
-                        <div class="col-lg-6">
-                            <relying-party-form [resolver]="filter"></relying-party-form>
-                        </div>
-                        <div class="col-lg-6">
-                            <attribute-release-form [resolver]="filter"></attribute-release-form>
-                        </div>
-                    </div>
-                </section>
-            </form>
+        <div class="section-body p-4 border border-top-0 border-info" *ngIf="schema$ | async">
+            <div class="mx-3 my-2 d-flex justify-content-end">
+                <button (click)="this.save()" type="submit" class="btn btn-primary" [disabled]="!isValid || (isSaving$ | async)">
+                    <i class="fa fa-fw fa-lg" [ngClass]="{
+                                        'fa-save': !(isSaving$ | async),
+                                        'fa-spinner': (isSaving$ | async),
+                                        'fa-pulse': (isSaving$ | async)
+                                    }"></i>
+                    <ng-container i18n="@@action--save">Save</ng-container>
+                </button>
+                &nbsp;
+                <button (click)="this.cancel()" type="reset" class="btn btn-secondary" [disabled]="isSaving$ | async">
+                    <ng-container i18n="@@action--cancel">Cancel</ng-container>
+                </button>
+            </div>
+            <sf-form
+                [schema]="schema$ | async"
+                [model]="model$ | async"
+                [validators]="definition.getValidators()"
+                (onChange)="valueChangeSubject.next($event)"
+                (onErrorChange)="statusChangeSubject.next($event)"></sf-form>
         </div>
     </section>
 </div>
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
index e954c1cbf..cf96683ac 100644
--- a/ui/src/app/metadata/filter/container/new-filter.component.spec.ts
+++ b/ui/src/app/metadata/filter/container/new-filter.component.spec.ts
@@ -8,6 +8,9 @@ import { ProviderStatusEmitter, ProviderValueEmitter } from '../../domain/servic
 import { NgbPopoverModule, NgbPopoverConfig } from '@ng-bootstrap/ng-bootstrap';
 import { NavigatorService } from '../../../core/service/navigator.service';
 import { SharedModule } from '../../../shared/shared.module';
+import { SchemaFormModule, WidgetRegistry, DefaultWidgetRegistry } from 'ngx-schema-form';
+import { SchemaService } from '../../../schema-form/service/schema.service';
+import { HttpClientModule } from '@angular/common/http';
 
 describe('New Metadata Filter Page', () => {
     let fixture: ComponentFixture<NewFilterComponent>;
@@ -21,7 +24,9 @@ describe('New Metadata Filter Page', () => {
                 ProviderValueEmitter,
                 FormBuilder,
                 NgbPopoverConfig,
-                NavigatorService
+                NavigatorService,
+                SchemaService,
+                { provide: WidgetRegistry, useClass: DefaultWidgetRegistry }
             ],
             imports: [
                 StoreModule.forRoot({
@@ -30,7 +35,9 @@ describe('New Metadata Filter Page', () => {
                 ReactiveFormsModule,
                 ProviderEditorFormModule,
                 NgbPopoverModule,
-                SharedModule
+                SharedModule,
+                HttpClientModule,
+                SchemaFormModule.forRoot()
             ],
             declarations: [
                 NewFilterComponent
@@ -57,4 +64,27 @@ describe('New Metadata Filter Page', () => {
             expect(store.dispatch).toHaveBeenCalled();
         });
     });
+
+    describe('status emitter', () => {
+        it('should set the isValid property to true', () => {
+            fixture.detectChanges();
+            instance.statusChangeSubject.next({ value: [] });
+            fixture.detectChanges();
+            expect(instance.isValid).toBe(true);
+        });
+
+        it('should set the isValid property to true if value is undefined', () => {
+            fixture.detectChanges();
+            instance.statusChangeSubject.next({ value: null });
+            fixture.detectChanges();
+            expect(instance.isValid).toBe(true);
+        });
+
+        it('should set the isValid property to false', () => {
+            fixture.detectChanges();
+            instance.statusChangeSubject.next({ value: [{ control: 'foo' }] });
+            fixture.detectChanges();
+            expect(instance.isValid).toBe(false);
+        });
+    });
 });
diff --git a/ui/src/app/metadata/filter/container/new-filter.component.ts b/ui/src/app/metadata/filter/container/new-filter.component.ts
index 840d2d9a4..244cb3a85 100644
--- a/ui/src/app/metadata/filter/container/new-filter.component.ts
+++ b/ui/src/app/metadata/filter/container/new-filter.component.ts
@@ -1,132 +1,57 @@
-import { Component, OnInit, OnDestroy } from '@angular/core';
-import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { Component } from '@angular/core';
 import { Store } from '@ngrx/store';
-import { Observable, Subject } from 'rxjs';
-import { withLatestFrom, distinctUntilChanged, startWith, takeUntil } from 'rxjs/operators';
+import { Subject, Observable, of } from 'rxjs';
 
 import * as fromFilter from '../reducer';
-import { ProviderValueEmitter } from '../../domain/service/provider-change-emitter.service';
-import { CancelCreateFilter, SelectId, UpdateFilterChanges } from '../action/filter.action';
+import { MetadataFilterTypes } from '../model';
+import { FormDefinition } from '../../../wizard/model';
+import { MetadataFilter } from '../../domain/model';
+import { SchemaService } from '../../../schema-form/service/schema.service';
 import { AddFilterRequest } from '../action/collection.action';
-import { MetadataFilter } from '../../domain/model/metadata-filter';
-import { EntityValidators } from '../../domain/service/entity-validators.service';
-import { QueryEntityIds, ViewMoreIds, ClearSearch } from '../action/search.action';
-import { MDUI } from '../../domain/model';
-import { EntityAttributesFilter } from '../../domain/entity/filter/entity-attributes-filter';
+import { CancelCreateFilter, UpdateFilterChanges } from '../action/filter.action';
 
 @Component({
     selector: 'new-filter-page',
     templateUrl: './new-filter.component.html'
 })
-export class NewFilterComponent implements OnInit, OnDestroy {
+export class NewFilterComponent {
 
-    private ngUnsubscribe: Subject<void> = new Subject<void>();
+    valueChangeSubject = new Subject<Partial<any>>();
+    private valueChangeEmitted$ = this.valueChangeSubject.asObservable();
 
-    changes$: Observable<MetadataFilter>;
-    changes: MetadataFilter;
-    filter: EntityAttributesFilter = new EntityAttributesFilter({
-        entityId: '',
-        name: '',
-        relyingPartyOverrides: {
-            signAssertion: false,
-            dontSignResponse: false,
-            turnOffEncryption: false,
-            useSha: false,
-            ignoreAuthenticationMethod: false,
-            omitNotBefore: false,
-            responderId: '',
-            nameIdFormats: [],
-            authenticationMethods: []
-        },
-        attributeRelease: []
-    });
+    statusChangeSubject = new Subject<{ value: any[] }>();
+    private statusChangeEmitted$ = this.statusChangeSubject.asObservable();
 
-    ids: string[];
-    entityIds$: Observable<string[]>;
-    showMore$: Observable<boolean>;
-    selected$: Observable<string>;
-    loading$: Observable<boolean>;
-    processing$: Observable<boolean>;
-    preview$: Observable<MDUI>;
-    isSaving$: Observable<boolean>;
-
-    form: FormGroup = this.fb.group({
-        entityId: ['', [Validators.required], [
-            EntityValidators.existsInCollection(this.store.select(fromFilter.getEntityCollection))
-        ]],
-        name: ['', [Validators.required]],
-        filterEnabled: [false]
-    });
+    definition: FormDefinition<MetadataFilter>;
+    schema$: Observable<any>;
 
-    isValid = false;
+    model$: Observable<MetadataFilter>;
+    isSaving$: Observable<boolean>;
+    filter: MetadataFilter;
+    isValid: boolean;
 
     constructor(
         private store: Store<fromFilter.State>,
-        private valueEmitter: ProviderValueEmitter,
-        private fb: FormBuilder
+        private schemaService: SchemaService
     ) {
-        this.store.dispatch(new ClearSearch());
-        this.changes$ = this.store.select(fromFilter.getFilter);
-        this.changes$.subscribe(c => this.changes = new EntityAttributesFilter(c));
+        this.definition = MetadataFilterTypes.EntityAttributesFilter;
 
-        this.showMore$ = this.store.select(fromFilter.getViewingMore);
-        this.selected$ = this.store.select(fromFilter.getSelected);
-        this.entityIds$ = this.store.select(fromFilter.getEntityCollection);
-        this.loading$ = this.store.select(fromFilter.getIsLoading);
-        this.processing$ = this.loading$.pipe(withLatestFrom(this.showMore$, (l, s) => !s && l));
-        this.preview$ = this.store.select(fromFilter.getPreview);
+        this.schema$ = this.schemaService.get(this.definition.schema);
         this.isSaving$ = this.store.select(fromFilter.getSaving);
+        this.model$ = of(<MetadataFilter>{});
 
-        this.entityIds$.subscribe(ids => this.ids = ids);
-    }
-
-    ngOnInit(): void {
-        let id = this.form.get('entityId');
-        id.valueChanges.pipe(distinctUntilChanged())
-            .subscribe(query => this.searchEntityIds(query));
-
-        this.form.valueChanges.pipe(
-            takeUntil(this.ngUnsubscribe),
-            startWith(this.form.value)
-        ).subscribe(changes => this.store.dispatch(new UpdateFilterChanges(changes)));
-        this.valueEmitter
-            .changeEmitted$
-            .pipe(
-                takeUntil(this.ngUnsubscribe),
-                startWith(this.form.value)
-            )
-            .subscribe(changes => this.store.dispatch(new UpdateFilterChanges(changes)));
-
-        id.valueChanges.pipe(distinctUntilChanged())
-            .subscribe(entityId => id.valid ? this.store.dispatch(new SelectId(entityId)) : null);
-        this.selected$.pipe(distinctUntilChanged())
-            .subscribe(entityId => id.setValue(entityId));
-    }
-
-    ngOnDestroy(): void {
-        this.ngUnsubscribe.next();
-        this.ngUnsubscribe.complete();
-    }
-
-    searchEntityIds(term: string): void {
-        if (term && term.length >= 4 && this.ids.indexOf(term) < 0) {
-            this.store.dispatch(new QueryEntityIds({
-                term,
-                limit: 10
-            }));
-        }
-    }
-
-    onViewMore(query: string): void {
-        this.store.dispatch(new ViewMoreIds(query));
-    }
+        this.valueChangeEmitted$.subscribe(changes => this.store.dispatch(new UpdateFilterChanges(changes.value)));
+        this.statusChangeEmitted$.subscribe(valid => {
+            this.isValid = valid.value ? valid.value.length === 0 : true;
+        });
 
-    onStatusChange(status): void {
-        this.isValid = status === 'VALID';
+        this.store
+            .select(fromFilter.getFilter)
+            .subscribe(filter => this.filter = filter);
     }
 
     save(): void {
-        this.store.dispatch(new AddFilterRequest(this.changes.serialize()));
+        this.store.dispatch(new AddFilterRequest(this.filter));
     }
 
     cancel(): void {
diff --git a/ui/src/app/metadata/filter/effect/collection.effect.ts b/ui/src/app/metadata/filter/effect/collection.effect.ts
index 788e51329..44651d0c2 100644
--- a/ui/src/app/metadata/filter/effect/collection.effect.ts
+++ b/ui/src/app/metadata/filter/effect/collection.effect.ts
@@ -12,7 +12,7 @@ import * as fromFilter from '../reducer';
 import * as fromProvider from '../../provider/reducer';
 import { MetadataFilter } from '../../domain/model';
 import { removeNulls } from '../../../shared/util';
-import { EntityAttributesFilter } from '../../domain/entity/filter/entity-attributes-filter';
+import { EntityAttributesFilterEntity } from '../../domain/entity/filter/entity-attributes-filter';
 import { MetadataFilterService } from '../../domain/service/filter.service';
 
 /* istanbul ignore next */
@@ -56,7 +56,7 @@ export class FilterCollectionEffects {
         map(filter => {
             return {
                 ...filter,
-                relyingPartyOverrides: removeNulls(new EntityAttributesFilter(filter).relyingPartyOverrides)
+                relyingPartyOverrides: removeNulls(new EntityAttributesFilterEntity(filter).relyingPartyOverrides)
             };
         }),
         combineLatest(this.store.select(fromProvider.getSelectedProviderId).pipe(skipWhile(id => !id))),
diff --git a/ui/src/app/metadata/filter/effect/filter.effect.ts b/ui/src/app/metadata/filter/effect/filter.effect.ts
index 1698333dd..9cf67e5ea 100644
--- a/ui/src/app/metadata/filter/effect/filter.effect.ts
+++ b/ui/src/app/metadata/filter/effect/filter.effect.ts
@@ -2,18 +2,17 @@ import { Injectable } from '@angular/core';
 import { Effect, Actions, ofType } from '@ngrx/effects';
 import { Store } from '@ngrx/store';
 import { of } from 'rxjs';
-import { map, switchMap, catchError, withLatestFrom, tap } from 'rxjs/operators';
+import { map, switchMap, catchError, withLatestFrom, tap, combineLatest, skipWhile } from 'rxjs/operators';
 
 import { Router } from '@angular/router';
 
 import * as fromFilter from '../reducer';
+import * as fromProvider from '../../provider/reducer';
 import * as fromRoot from '../../../app.reducer';
 import {
     FilterCollectionActionTypes,
     UpdateFilterFail,
-    UpdateFilterRequest,
-    AddFilterSuccess,
-    LoadFilterRequest
+    UpdateFilterRequest
 } from '../action/collection.action';
 import {
     SelectId,
@@ -58,19 +57,12 @@ export class FilterEffects {
         )
     );
 
-    /*
-    @Effect({ dispatch: false })
-    saveFilterSuccess$ = this.actions$.pipe(
-        ofType<AddFilterSuccess>(FilterCollectionActionTypes.ADD_FILTER_SUCCESS),
-        switchMap(() => this.router.navigate(['/dashboard']))
-    );
     @Effect()
     cancelChanges$ = this.actions$.pipe(
         ofType<CancelCreateFilter>(FilterActionTypes.CANCEL_CREATE_FILTER),
-        map(() => new LoadFilterRequest()),
-        tap(() => this.router.navigate(['/dashboard']))
+        combineLatest(this.store.select(fromProvider.getSelectedProviderId).pipe(skipWhile(id => !id))),
+        tap(([filter, provider]) => this.router.navigate(['/', 'metadata', 'provider', provider, 'filters']))
     );
-    */
 
     constructor(
         private store: Store<fromRoot.State>,
diff --git a/ui/src/app/metadata/filter/filter.module.ts b/ui/src/app/metadata/filter/filter.module.ts
index 24111a113..f4f86b486 100644
--- a/ui/src/app/metadata/filter/filter.module.ts
+++ b/ui/src/app/metadata/filter/filter.module.ts
@@ -20,6 +20,7 @@ import { FilterExistsGuard } from './guard/filter-exists.guard';
 import { DomainModule } from '../domain/domain.module';
 import { ModuleWithProviders } from '@angular/compiler/src/core';
 import { FilterCollectionEffects } from './effect/collection.effect';
+import { FormModule } from '../../schema-form/schema-form.module';
 
 @NgModule({
     declarations: [
@@ -40,7 +41,8 @@ import { FilterCollectionEffects } from './effect/collection.effect';
         SharedModule,
         DomainModule,
         HttpClientModule,
-        RouterModule
+        RouterModule,
+        FormModule
     ]
 })
 export class FilterModule {
diff --git a/ui/src/app/metadata/filter/model/entity-attributes.filter.spec.ts b/ui/src/app/metadata/filter/model/entity-attributes.filter.spec.ts
new file mode 100644
index 000000000..35ebaff95
--- /dev/null
+++ b/ui/src/app/metadata/filter/model/entity-attributes.filter.spec.ts
@@ -0,0 +1,14 @@
+import { EntityAttributesFilter } from './entity-attributes.filter';
+
+describe('Entity Attributes filter form', () => {
+    it('should return an empty object for validators', () => {
+        expect(EntityAttributesFilter.getValidators()).toEqual({});
+    });
+
+    describe('transformer', () => {
+        it('should not modify the object', () => {
+            expect(EntityAttributesFilter.translate.formatter({})).toEqual({});
+            expect(EntityAttributesFilter.translate.parser({})).toEqual({});
+        });
+    });
+});
diff --git a/ui/src/app/metadata/filter/model/entity-attributes.filter.ts b/ui/src/app/metadata/filter/model/entity-attributes.filter.ts
new file mode 100644
index 000000000..bf2cec9b4
--- /dev/null
+++ b/ui/src/app/metadata/filter/model/entity-attributes.filter.ts
@@ -0,0 +1,16 @@
+import { FormDefinition } from '../../../wizard/model';
+import { MetadataFilter } from '../../domain/model';
+
+export const EntityAttributesFilter: FormDefinition<MetadataFilter> = {
+    label: 'EntityAttributes',
+    type: 'EntityAttributes',
+    schema: 'assets/schema/filter/entity-attributes.schema.json',
+    getValidators(): any {
+        const validators = {};
+        return validators;
+    },
+    translate: {
+        parser: (changes: any): MetadataFilter => changes,
+        formatter: (changes: MetadataFilter): any => changes
+    }
+};
diff --git a/ui/src/app/metadata/filter/model/index.ts b/ui/src/app/metadata/filter/model/index.ts
new file mode 100644
index 000000000..c77b3a90f
--- /dev/null
+++ b/ui/src/app/metadata/filter/model/index.ts
@@ -0,0 +1,7 @@
+import { EntityAttributesFilter } from './entity-attributes.filter';
+
+export const MetadataFilterTypes = {
+    EntityAttributesFilter
+};
+
+export * from './entity-attributes.filter';
diff --git a/ui/src/app/metadata/filter/reducer/collection.reducer.spec.ts b/ui/src/app/metadata/filter/reducer/collection.reducer.spec.ts
index abd35ab48..32c46601c 100644
--- a/ui/src/app/metadata/filter/reducer/collection.reducer.spec.ts
+++ b/ui/src/app/metadata/filter/reducer/collection.reducer.spec.ts
@@ -12,7 +12,7 @@ import {
     AddFilterFail,
     UpdateFilterFail
 } from '../action/collection.action';
-import { EntityAttributesFilter } from '../../domain/entity/filter/entity-attributes-filter';
+import { EntityAttributesFilterEntity } from '../../domain/entity/filter/entity-attributes-filter';
 
 describe('Filter Reducer', () => {
     describe('undefined action', () => {
@@ -36,8 +36,8 @@ describe('Filter Reducer', () => {
         it('should add the loaded filters to the collection', () => {
             spyOn(fromFilter.adapter, 'addAll').and.callThrough();
             const filters = [
-                new EntityAttributesFilter({ resourceId: 'foo', createdDate: new Date().toLocaleDateString() }),
-                new EntityAttributesFilter({ resourceId: 'bar', createdDate: new Date().toLocaleDateString() })
+                new EntityAttributesFilterEntity({ resourceId: 'foo', createdDate: new Date().toLocaleDateString() }),
+                new EntityAttributesFilterEntity({ resourceId: 'bar', createdDate: new Date().toLocaleDateString() })
             ];
             const action = new LoadFilterSuccess(filters);
             const result = reducer(snapshot, action);
@@ -48,7 +48,7 @@ describe('Filter Reducer', () => {
     describe(`${FilterCollectionActionTypes.SELECT_FILTER_SUCCESS}`, () => {
         it('should add the loaded filter to the collection', () => {
             spyOn(fromFilter.adapter, 'addOne').and.callThrough();
-            const filter = new EntityAttributesFilter({ resourceId: 'foo', createdDate: new Date().toLocaleDateString() });
+            const filter = new EntityAttributesFilterEntity({ resourceId: 'foo', createdDate: new Date().toLocaleDateString() });
             const action = new SelectFilterSuccess(filter);
             const result = reducer(snapshot, action);
             expect(fromFilter.adapter.addOne).toHaveBeenCalled();
@@ -57,14 +57,14 @@ describe('Filter Reducer', () => {
 
     describe(`${FilterCollectionActionTypes.ADD_FILTER}`, () => {
         it('should set saving to true', () => {
-            const filter = new EntityAttributesFilter({ resourceId: 'foo', createdDate: new Date().toLocaleDateString() });
+            const filter = new EntityAttributesFilterEntity({ resourceId: 'foo', createdDate: new Date().toLocaleDateString() });
             const action = new AddFilterRequest(filter);
             expect(reducer(snapshot, action).saving).toBe(true);
         });
     });
     describe(`${FilterCollectionActionTypes.UPDATE_FILTER_REQUEST}`, () => {
         it('should set saving to true', () => {
-            const filter = new EntityAttributesFilter({ resourceId: 'foo', createdDate: new Date().toLocaleDateString() });
+            const filter = new EntityAttributesFilterEntity({ resourceId: 'foo', createdDate: new Date().toLocaleDateString() });
             const action = new UpdateFilterRequest(filter);
             expect(reducer(snapshot, action).saving).toBe(true);
         });
@@ -72,7 +72,7 @@ describe('Filter Reducer', () => {
 
     describe(`${FilterCollectionActionTypes.ADD_FILTER_SUCCESS}`, () => {
         it('should set saving to false', () => {
-            const filter = new EntityAttributesFilter({ resourceId: 'foo', createdDate: new Date().toLocaleDateString() });
+            const filter = new EntityAttributesFilterEntity({ resourceId: 'foo', createdDate: new Date().toLocaleDateString() });
             const action = new AddFilterSuccess(filter);
             expect(reducer(snapshot, action).saving).toBe(false);
         });
@@ -87,7 +87,7 @@ describe('Filter Reducer', () => {
 
     describe(`${FilterCollectionActionTypes.UPDATE_FILTER_FAIL}`, () => {
         it('should set saving to false', () => {
-            const filter = new EntityAttributesFilter({ resourceId: 'foo', createdDate: new Date().toLocaleDateString() });
+            const filter = new EntityAttributesFilterEntity({ resourceId: 'foo', createdDate: new Date().toLocaleDateString() });
             const action = new UpdateFilterFail(filter);
             expect(reducer(snapshot, action).saving).toBe(false);
         });
@@ -98,7 +98,7 @@ describe('Filter Reducer', () => {
             spyOn(fromFilter.adapter, 'updateOne').and.callThrough();
             const update = {
                 id: 'foo',
-                changes: new EntityAttributesFilter({ resourceId: 'foo', name: 'bar', createdDate: new Date().toLocaleDateString() }),
+                changes: new EntityAttributesFilterEntity({ resourceId: 'foo', name: 'bar', createdDate: new Date().toLocaleDateString() }),
             };
             const action = new UpdateFilterSuccess(update);
             const result = reducer(snapshot, action);
diff --git a/ui/src/app/metadata/filter/reducer/filter.reducer.spec.ts b/ui/src/app/metadata/filter/reducer/filter.reducer.spec.ts
index f4f4cbe82..f9ed5b7a5 100644
--- a/ui/src/app/metadata/filter/reducer/filter.reducer.spec.ts
+++ b/ui/src/app/metadata/filter/reducer/filter.reducer.spec.ts
@@ -16,7 +16,7 @@ import {
 } from '../action/collection.action';
 import { MDUI } from '../../domain/model';
 import { MetadataFilter } from '../../domain/model';
-import { EntityAttributesFilter } from '../../domain/entity/filter/entity-attributes-filter';
+import { EntityAttributesFilterEntity } from '../../domain/entity/filter/entity-attributes-filter';
 
 
 const snapshot: fromFilter.FilterState = {
@@ -72,26 +72,26 @@ describe('Filter Reducer', () => {
 
     describe(`${FilterCollectionActionTypes.ADD_FILTER} action`, () => {
         it('should set saving to true', () => {
-            const result = reducer(snapshot, new AddFilterRequest(new EntityAttributesFilter()));
+            const result = reducer(snapshot, new AddFilterRequest(new EntityAttributesFilterEntity()));
             expect(result.saving).toBe(true);
         });
     });
     describe(`${FilterCollectionActionTypes.UPDATE_FILTER_REQUEST} action`, () => {
         it('should set saving to true', () => {
-            const result = reducer(snapshot, new UpdateFilterRequest(new EntityAttributesFilter()));
+            const result = reducer(snapshot, new UpdateFilterRequest(new EntityAttributesFilterEntity()));
             expect(result.saving).toBe(true);
         });
     });
 
     describe(`${FilterCollectionActionTypes.ADD_FILTER_SUCCESS} action`, () => {
         it('should set saving to true', () => {
-            const result = reducer(snapshot, new AddFilterSuccess(new EntityAttributesFilter()));
+            const result = reducer(snapshot, new AddFilterSuccess(new EntityAttributesFilterEntity()));
             expect(result).toEqual(fromFilter.initialState);
         });
     });
     describe(`${FilterCollectionActionTypes.UPDATE_FILTER_SUCCESS} action`, () => {
         it('should set saving to true', () => {
-            const update = {id: 'foo', changes: new EntityAttributesFilter({id: 'foo'})};
+            const update = {id: 'foo', changes: new EntityAttributesFilterEntity({id: 'foo'})};
             const result = reducer(snapshot, new UpdateFilterSuccess(update));
             expect(result).toEqual(fromFilter.initialState);
         });
diff --git a/ui/src/app/metadata/filter/reducer/index.spec.ts b/ui/src/app/metadata/filter/reducer/index.spec.ts
new file mode 100644
index 000000000..3d30cf891
--- /dev/null
+++ b/ui/src/app/metadata/filter/reducer/index.spec.ts
@@ -0,0 +1,21 @@
+import * as selectors from './index';
+
+describe('filter selectors', () => {
+    describe('mergeFn', () => {
+        it('should return merged objects', () => {
+            expect(selectors.mergeFn({foo: 'bar' }, { resourceId: 'baz' })).toEqual({foo: 'bar', resourceId: 'baz'});
+        });
+    });
+
+    describe('filterTypeFn', () => {
+        it('should return filtered objects', () => {
+            const filters = [{ '@type': 'EntityAttributes' }];
+            expect(selectors.filterTypeFn(filters)).toEqual(filters);
+        });
+
+        it('should return filtered objects', () => {
+            const filters = [{ '@type': 'EntityAttributes' }, { '@type': 'EntityRoleWhiteList' }];
+            expect(selectors.filterTypeFn(filters).length).toBe(1);
+        });
+    });
+});
diff --git a/ui/src/app/metadata/filter/reducer/index.ts b/ui/src/app/metadata/filter/reducer/index.ts
index 6724af3a7..951c05e51 100644
--- a/ui/src/app/metadata/filter/reducer/index.ts
+++ b/ui/src/app/metadata/filter/reducer/index.ts
@@ -53,12 +53,9 @@ export const getAllFilters = createSelector(getCollectionState, fromCollection.s
 export const getFiltersSaving = createSelector(getCollectionState, fromCollection.getIsSaving);
 
 export const notAddtlFilters = ['RequiredValidUntil', 'SignatureValidation', 'EntityRoleWhiteList'];
+export const filterTypeFn = filters => filters.filter(f => notAddtlFilters.indexOf(f['@type']) === -1);
 
-export const getAdditionalFilters = createSelector(
-    getAllFilters,
-    filters => filters.filter(f => notAddtlFilters.indexOf(f['@type']) === -1)
-);
-
+export const getAdditionalFilters = createSelector(getAllFilters, filterTypeFn);
 
 export const getFilterEntities = createSelector(getCollectionState, fromCollection.selectFilterEntities);
 export const getSelectedFilterId = createSelector(getCollectionState, fromCollection.getSelectedFilterId);
diff --git a/ui/src/app/metadata/manager/effect/search.effects.ts b/ui/src/app/metadata/manager/effect/search.effects.ts
index fa3386def..e1da7c539 100644
--- a/ui/src/app/metadata/manager/effect/search.effects.ts
+++ b/ui/src/app/metadata/manager/effect/search.effects.ts
@@ -13,12 +13,6 @@ import { FileBackedHttpMetadataResolver } from '../../domain/entity';
 
 @Injectable()
 export class SearchEffects {
-    @Effect()
-    filter$ = this.actions$.pipe(
-        ofType<entitySearch.FilterAction>(entitySearch.ENTITY_FILTER),
-        switchMap(() => this.performSearch())
-    );
-
     @Effect()
     search$ = this.actions$.pipe(
         ofType<entitySearch.SearchAction>(entitySearch.ENTITY_SEARCH),
@@ -45,9 +39,12 @@ export class SearchEffects {
             ),
             combineLatest(
                 this.store.select(fromManager.getSearchQuery),
-                (entities, term) => entities.filter(
-                    e => this.matcher(e.name, term) || this.matcher(e.entityId, term)
-                )
+                (entities, term) => {
+                    const filtered = entities.filter(
+                        e => this.matcher(e.name, term) || this.matcher(e.entityId, term)
+                    );
+                    return filtered;
+                }
             ),
             map(entities => new entitySearch.SearchCompleteAction(entities))
         );
diff --git a/ui/src/app/metadata/manager/reducer/index.ts b/ui/src/app/metadata/manager/reducer/index.ts
index fae0c5418..2585fb182 100644
--- a/ui/src/app/metadata/manager/reducer/index.ts
+++ b/ui/src/app/metadata/manager/reducer/index.ts
@@ -31,15 +31,10 @@ export const getSearchResults = createSelector(
     getSearchState,
     fromSearch.getEntities
 );
-
 export const getSearchQuery = createSelector(
     getSearchState,
     fromSearch.getQuery
 );
-export const getFilterType = createSelector(
-    getSearchState,
-    fromSearch.getFilter
-);
 export const getSearchLoading = createSelector(
     getSearchState,
     fromSearch.getLoading
diff --git a/ui/src/app/metadata/manager/reducer/search.reducer.ts b/ui/src/app/metadata/manager/reducer/search.reducer.ts
index 8614cbf94..17e700abd 100644
--- a/ui/src/app/metadata/manager/reducer/search.reducer.ts
+++ b/ui/src/app/metadata/manager/reducer/search.reducer.ts
@@ -5,14 +5,12 @@ export interface SearchState {
     entities: MetadataEntity[];
     loading: boolean;
     query: string;
-    kind: string;
 }
 
 const initialState: SearchState = {
     entities: [],
     loading: false,
-    query: '',
-    kind: 'all'
+    query: ''
 };
 
 export function reducer(state = initialState, action: searchActions.Actions): SearchState {
@@ -25,6 +23,14 @@ export function reducer(state = initialState, action: searchActions.Actions): Se
             };
         }
 
+        case searchActions.ENTITY_SEARCH_COMPLETE: {
+            return {
+                entities: action.payload,
+                loading: false,
+                query: state.query
+            };
+        }
+
         default: {
             return state;
         }
@@ -36,5 +42,3 @@ export const getEntities = (state: SearchState) => state.entities;
 export const getQuery = (state: SearchState) => state.query;
 
 export const getLoading = (state: SearchState) => state.loading;
-
-export const getFilter = (state: SearchState) => state.kind;
diff --git a/ui/src/app/metadata/provider/container/provider-wizard-step.component.ts b/ui/src/app/metadata/provider/container/provider-wizard-step.component.ts
index dce4187d7..0b9a7469e 100644
--- a/ui/src/app/metadata/provider/container/provider-wizard-step.component.ts
+++ b/ui/src/app/metadata/provider/container/provider-wizard-step.component.ts
@@ -46,9 +46,15 @@ export class ProviderWizardStepComponent implements OnDestroy {
         this.definition$ = this.store.select(fromWizard.getWizardDefinition);
         this.changes$ = this.store.select(fromProvider.getEntityChanges);
 
-        this.validators$ = this.store.select(fromProvider.getProviderNames).pipe(
-            withLatestFrom(this.definition$),
-            map(([names, def]) => def.getValidators(names))
+        this.validators$ = this.definition$.pipe(
+            withLatestFrom(
+                this.store.select(fromProvider.getProviderNames),
+                this.store.select(fromProvider.getProviderXmlIds),
+            ),
+            map(([def, names, ids]) => def.getValidators(
+                names,
+                ids
+            ))
         );
 
         this.model$ = this.schema$.pipe(
diff --git a/ui/src/app/metadata/provider/provider.routing.ts b/ui/src/app/metadata/provider/provider.routing.ts
index bd32d63e6..8e6ecc3f5 100644
--- a/ui/src/app/metadata/provider/provider.routing.ts
+++ b/ui/src/app/metadata/provider/provider.routing.ts
@@ -9,9 +9,7 @@ import { ProviderSelectComponent } from './container/provider-select.component';
 import { ProviderFilterListComponent } from './container/provider-filter-list.component';
 import { NewFilterComponent } from '../filter/container/new-filter.component';
 import { FilterComponent } from '../filter/container/filter.component';
-import { FilterExistsGuard } from '../filter/guard/filter-exists.guard';
 import { EditFilterComponent } from '../filter/container/edit-filter.component';
-import { ProviderResolver } from './resolver/provider.resolver';
 
 export const ProviderRoutes: Routes = [
     {
diff --git a/ui/src/app/schema-form/registry.ts b/ui/src/app/schema-form/registry.ts
index 44a20841a..050edbf42 100644
--- a/ui/src/app/schema-form/registry.ts
+++ b/ui/src/app/schema-form/registry.ts
@@ -2,11 +2,10 @@ import { BooleanRadioComponent } from './widget/boolean-radio/boolean-radio.comp
 import { FieldsetComponent } from './widget/fieldset/fieldset.component';
 import { CustomStringComponent } from './widget/string/string.component';
 
-import { WidgetRegistry } from 'ngx-schema-form';
+import { WidgetRegistry, ObjectWidget } from 'ngx-schema-form';
 
 import { ButtonWidget } from 'ngx-schema-form';
 import { FileWidget } from 'ngx-schema-form';
-import { ObjectWidget } from 'ngx-schema-form';
 import { RadioWidget } from 'ngx-schema-form';
 import { RangeWidget } from 'ngx-schema-form';
 import { CustomSelectComponent } from './widget/select/select.component';
@@ -15,6 +14,8 @@ import { CustomCheckboxComponent } from './widget/check/checkbox.component';
 import { CustomTextAreaComponent } from './widget/textarea/textarea.component';
 import { CustomArrayComponent } from './widget/array/array.component';
 import { CustomIntegerComponent } from './widget/number/number.component';
+import { FilterTargetComponent } from './widget/filter-target/filter-target.component';
+import { ChecklistComponent } from './widget/check/checklist.component';
 
 
 export class CustomWidgetRegistry extends WidgetRegistry {
@@ -36,9 +37,10 @@ export class CustomWidgetRegistry extends WidgetRegistry {
         this.register('boolean-radio', BooleanRadioComponent);
 
         this.register('fieldset', FieldsetComponent);
-        this.register('object', FieldsetComponent);
+        this.register('object', ObjectWidget);
 
         this.register('array', CustomArrayComponent);
+        this.register('checklist', ChecklistComponent);
 
         this.register('select', CustomSelectComponent);
         this.register('boolean', CustomCheckboxComponent);
@@ -51,6 +53,8 @@ export class CustomWidgetRegistry extends WidgetRegistry {
 
         this.register('datalist', DatalistComponent);
 
+        this.register('filter-target', FilterTargetComponent);
+
         /* NGX-Form */
         this.register('range', RangeWidget);
 
diff --git a/ui/src/app/schema-form/schema-form.module.ts b/ui/src/app/schema-form/schema-form.module.ts
index 8e01833f5..a637d629c 100644
--- a/ui/src/app/schema-form/schema-form.module.ts
+++ b/ui/src/app/schema-form/schema-form.module.ts
@@ -7,7 +7,7 @@ import { BooleanRadioComponent } from './widget/boolean-radio/boolean-radio.comp
 import { SchemaService } from './service/schema.service';
 import { FieldsetComponent } from './widget/fieldset/fieldset.component';
 import { CustomStringComponent } from './widget/string/string.component';
-import { NgbPopoverModule } from '@ng-bootstrap/ng-bootstrap';
+import { NgbPopoverModule, NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap';
 import { SharedModule } from '../shared/shared.module';
 import { CustomSelectComponent } from './widget/select/select.component';
 import { DatalistComponent } from './widget/datalist/datalist.component';
@@ -15,6 +15,8 @@ import { CustomCheckboxComponent } from './widget/check/checkbox.component';
 import { CustomTextAreaComponent } from './widget/textarea/textarea.component';
 import { CustomArrayComponent } from './widget/array/array.component';
 import { CustomIntegerComponent } from './widget/number/number.component';
+import { FilterTargetComponent } from './widget/filter-target/filter-target.component';
+import { ChecklistComponent } from './widget/check/checklist.component';
 
 export const COMPONENTS = [
     BooleanRadioComponent,
@@ -25,7 +27,9 @@ export const COMPONENTS = [
     CustomCheckboxComponent,
     CustomTextAreaComponent,
     CustomArrayComponent,
-    CustomIntegerComponent
+    CustomIntegerComponent,
+    FilterTargetComponent,
+    ChecklistComponent
 ];
 
 @NgModule({
@@ -33,6 +37,7 @@ export const COMPONENTS = [
         CommonModule,
         ReactiveFormsModule,
         NgbPopoverModule,
+        NgbDropdownModule,
         SharedModule,
         SchemaFormModule.forRoot()
     ],
@@ -40,7 +45,8 @@ export const COMPONENTS = [
     entryComponents: COMPONENTS,
     exports: [
         ...COMPONENTS,
-        SchemaFormModule
+        SchemaFormModule,
+        SharedModule
     ],
 })
 export class FormModule {
diff --git a/ui/src/app/schema-form/service/schema.service.spec.ts b/ui/src/app/schema-form/service/schema.service.spec.ts
new file mode 100644
index 000000000..6d259d6a9
--- /dev/null
+++ b/ui/src/app/schema-form/service/schema.service.spec.ts
@@ -0,0 +1,45 @@
+import { TestBed, async, inject } from '@angular/core/testing';
+import { HttpTestingController, HttpClientTestingModule } from '@angular/common/http/testing';
+import { HttpClientModule, HttpRequest } from '@angular/common/http';
+import { SchemaService } from './schema.service';
+
+describe(`Schema Service`, () => {
+
+    beforeEach(() => {
+        TestBed.configureTestingModule({
+            imports: [
+                HttpClientModule,
+                HttpClientTestingModule
+            ],
+            providers: [
+                SchemaService
+            ]
+        });
+    });
+
+    describe('isRequired method', () => {
+        it(`should return false if no property is provided`, inject([SchemaService], (service: SchemaService) => {
+            expect(service.isRequired(null)).toBe(false);
+        }));
+        it(`should return false if no properties are defined`, inject([SchemaService], (service: SchemaService) => {
+            expect(service.isRequired({
+                parent: { schema: {} },
+                path: ''
+            })).toBe(false);
+        }));
+
+        it(`should return true if the property is required`, inject([SchemaService], (service: SchemaService) => {
+            expect(service.isRequired({
+                parent: { schema: {
+                    properties: {
+                        foo: {
+                            type: 'string'
+                        }
+                    },
+                    required: 'foo'
+                } },
+                path: ''
+            })).toBe(true);
+        }));
+    });
+});
diff --git a/ui/src/app/schema-form/widget/array/array.component.html b/ui/src/app/schema-form/widget/array/array.component.html
index 577c084f9..c85b8f8de 100644
--- a/ui/src/app/schema-form/widget/array/array.component.html
+++ b/ui/src/app/schema-form/widget/array/array.component.html
@@ -8,6 +8,12 @@
             Add &nbsp;
             <i class="fa fa-plus" aria-hidden="true"></i>
         </button>
+        &nbsp;
+        <span class="text-right" *ngIf="schema.description">
+            <ng-template #tooltip>{{ schema.description }}</ng-template>
+            <i class="info-icon fa fa-fw fa-info-circle text-primary fa-lg" [ngbPopover]="tooltip" i18n-aria-label="@@tooltip--instruction"
+                aria-label="Information icon - press spacebar to read additional information for this form field"></i>
+        </span>
     </div>
     <div *ngFor="let itemProperty of formProperty.properties; let i=index; trackBy:trackByIndex" class="mt-2">
         <div class="row">
diff --git a/ui/src/app/schema-form/widget/check/checklist.component.html b/ui/src/app/schema-form/widget/check/checklist.component.html
new file mode 100644
index 000000000..7285f1bb9
--- /dev/null
+++ b/ui/src/app/schema-form/widget/check/checklist.component.html
@@ -0,0 +1,51 @@
+<fieldset [attr.aria-label]="schema.description" tabindex="0">
+    <legend *ngIf="schema.title">{{ schema.title }}</legend>
+    <table class="table table-striped table-sm">
+        <thead>
+            <tr class="table-secondary">
+                <th i18n="@@label--attribute-name">Attribute Name</th>
+                <th i18n="@@label--yes">Yes</th>
+            </tr>
+        </thead>
+        <tbody>
+            <tr *ngFor="let attr of schema.widget.data; let i=index;">
+                <td scope="col">{{ attr.label }}</td>
+                <td scope="col">
+                    <fieldset>
+                        <div class="custom-control custom-checkbox">
+                            <input type="checkbox"
+                                class="custom-control-input"
+                                (change)="onCheck(attr.key)"
+                                [checked]="checked[attr.key]"
+                                id="input-{{ i }}"
+                                [attr.name]="attr.label"
+                                [attr.aria-label]="attr.label"
+                                role="checkbox"
+                                aria-checked="false"
+                            />
+                            <label class="custom-control-label" for="input-{{ i }}"></label>
+                        </div>
+                    </fieldset>
+                </td>
+            </tr>
+            <tr>
+                <td scope="col" i18n="@@label--check-all-attributes">Check All Attributes</td>
+                <td scope="col">
+                    <button class="btn btn-text text-success btn-sm" (click)="onCheckAll()">
+                        <i class="fa fa-fw fa-check"></i>
+                        <span class="sr-only" i18n="@@label--check-all-attributes">Check All Attributes</span>
+                    </button>
+                </td>
+            </tr>
+            <tr>
+                <td scope="col" i18n="@@label--clear-all-attributes">Clear All Attributes</td>
+                <td scope="col">
+                    <button class="btn btn-text text-danger btn-sm" (click)="onCheckNone()">
+                        <i class="fa fa-fw fa-times"></i>
+                        <span class="sr-only" i18n="@@label--clear-all-attributes">Clear All Attributes</span>
+                    </button>
+                </td>
+            </tr>
+        </tbody>
+    </table>
+</fieldset>
\ No newline at end of file
diff --git a/ui/src/app/schema-form/widget/check/checklist.component.ts b/ui/src/app/schema-form/widget/check/checklist.component.ts
new file mode 100644
index 000000000..aca5b12b5
--- /dev/null
+++ b/ui/src/app/schema-form/widget/check/checklist.component.ts
@@ -0,0 +1,41 @@
+import { Component, AfterViewInit } from '@angular/core';
+
+import { ArrayWidget } from 'ngx-schema-form';
+
+/* istanbul ignore next */
+@Component({
+    selector: 'checklist-component',
+    templateUrl: `./checklist.component.html`
+})
+export class ChecklistComponent extends ArrayWidget implements AfterViewInit {
+    checked: any = {};
+
+    ngAfterViewInit(): void {
+        super.ngAfterViewInit();
+        this.formProperty.value.forEach(val => this.checked[val] = true);
+    }
+
+    private commitValue(): void {
+        this.formProperty.setValue(Object.keys(this.checked), false);
+    }
+
+    onCheck(value) {
+        if (!this.checked[value]) {
+            this.checked[value] = true;
+        } else {
+            delete this.checked[value];
+        }
+        this.commitValue();
+    }
+
+    onCheckAll(): void {
+        this.schema.widget.data.forEach(attr => this.checked[attr.key] = true);
+        this.commitValue();
+    }
+    onCheckNone(event: Event | null = null): void {
+        this.schema.widget.data.forEach(attr => {
+            delete this.checked[attr.key];
+        });
+        this.commitValue();
+    }
+}
diff --git a/ui/src/app/schema-form/widget/datalist/datalist.component.html b/ui/src/app/schema-form/widget/datalist/datalist.component.html
index c1265ac47..6b3c9286d 100644
--- a/ui/src/app/schema-form/widget/datalist/datalist.component.html
+++ b/ui/src/app/schema-form/widget/datalist/datalist.component.html
@@ -14,12 +14,12 @@
     </label>
     <span *ngIf="schema.description" class="sr-only">{{ schema.description }}</span>
     <auto-complete
-        [attr.id]="id"
+        [id]="id"
         [formControl]="control"
         [matches]="schema.widget.data"
         [required]="true"
         [dropdown]="true"
-        [placeholder]="schema.placeholder"
+        [placeholder]="schema.placeholder || ''"
         [attr.disabled]="schema.readOnly?true:null"
         role="textbox"
         aria-label="Name ID Format (type for auto-complete)">
diff --git a/ui/src/app/schema-form/widget/fieldset/fieldset.component.html b/ui/src/app/schema-form/widget/fieldset/fieldset.component.html
index 5e145e33e..fc880ad04 100644
--- a/ui/src/app/schema-form/widget/fieldset/fieldset.component.html
+++ b/ui/src/app/schema-form/widget/fieldset/fieldset.component.html
@@ -1,9 +1,21 @@
-<fieldset *ngFor="let fieldset of formProperty.schema.fieldsets" [class.d-none]="fieldset.type === 'hidden'">
-    <legend class="text-primary" *ngIf="fieldset.title">{{ fieldset.title }}</legend>
-    <p *ngIf="fieldset.description">{{ fieldset.description }}</p>
-    <div [ngClass]="{'bg-light border rounded px-4 pt-4 pb-1': fieldset.type === 'section' || formProperty.schema.widget.id === 'fieldset'}">
-        <div *ngFor="let fieldId of fieldset.fields">
-            <sf-form-element [formProperty]="formProperty.getProperty(fieldId)"></sf-form-element>
-        </div>
+<div class="container-fluid">
+    <div class="row">
+        <ng-container *ngFor="let fieldset of formProperty.schema.fieldsets; let i = index;">
+            <fieldset
+                class="col"
+                [class.d-none]="fieldset.type === 'hidden'"
+                [class.col-lg-6]="fieldset.type === 'group'"
+                [class.col-lg-12]="fieldset.type === 'group-lg'">
+                <legend class="text-primary" *ngIf="fieldset.title">{{ fieldset.title }}</legend>
+                <p *ngIf="fieldset.description">{{ fieldset.description }}</p>
+                <div [ngClass]="{
+                    'bg-light border rounded px-4 pt-4 pb-1': fieldset.type === 'section' || (!fieldset.type && formProperty.schema.widget.id === 'fieldset')
+                }">
+                    <div *ngFor="let fieldId of fieldset.fields">
+                        <sf-form-element [formProperty]="formProperty.getProperty(fieldId)"></sf-form-element>
+                    </div>
+                </div>
+            </fieldset>
+        </ng-container>
     </div>
-</fieldset>
\ No newline at end of file
+</div>
\ No newline at end of file
diff --git a/ui/src/app/schema-form/widget/filter-target/filter-target.component.html b/ui/src/app/schema-form/widget/filter-target/filter-target.component.html
new file mode 100644
index 000000000..1dc7c42c4
--- /dev/null
+++ b/ui/src/app/schema-form/widget/filter-target/filter-target.component.html
@@ -0,0 +1,61 @@
+<fieldset>
+    <div class="row">
+        <div class="col-lg-6">
+            <div ngbDropdown>
+                <button ngbDropdownToggle
+                    class="btn btn-outline-secondary dropdown-toggle"
+                    type="button"
+                    data-toggle="dropdown"
+                    aria-haspopup="true"
+                    aria-expanded="false">
+                    {{ this.displayType }}
+                </button>
+                <div class="dropdown-menu" ngbDropdownMenu>
+                    <a *ngFor="let option of typeOptions" class="dropdown-item" href="#" (click)="$event.preventDefault(); select(option.value);">
+                        {{ option.description }}
+                    </a>
+                </div>
+            </div>
+            <br />
+            <div class="d-flex justify-content-between">
+                <div class="w-100" [ngSwitch]="this.entityAttributesFilterTargetType">
+                    <ng-container *ngSwitchDefault>
+                        <auto-complete
+                            id="entityId"
+                            class="component-control"
+                            limit="10"
+                            [formControl]="search"
+                            [matches]="ids$ | async"
+                            (keydown.enter)="onSelectValue(search.value)">
+                        </auto-complete>
+                    </ng-container>
+                    <ng-container *ngSwitchCase="'CONDITION_SCRIPT'">
+                        <p class="codearea form-control" rows="8" contenteditable [formControl]="script" name="script"></p>
+                    </ng-container>
+                    <ng-container *ngSwitchCase="'REGEX'">
+                        <input class="form-control" type="text" [formControl]="script" name="script" />
+                    </ng-container>
+                </div>
+                <div class="ml-2" *ngIf="entityAttributesFilterTargetType === 'ENTITY'">
+                    <button
+                        class="btn btn-success"
+                        [disabled]="search.invalid"
+                        (click)="onSelectValue(search.value)">
+                        Add Entity ID
+                    </button>
+                </div>
+            </div>
+        </div>
+        <div class="col-lg-6">
+            <ul class="list-group list-group-sm list-group-scroll" *ngIf="entityAttributesFilterTargetType === 'ENTITY'">
+                <li class="list-group-item d-flex justify-content-between align-items-center" *ngFor="let id of targets">
+                    {{ id }}
+                    <button class="btn btn-link text-right">
+                        <i class="fa fa-trash fa-lg text-danger"></i>
+                    </button>
+                </li>
+            </ul>
+        </div>
+    </div>
+</fieldset>
+<hr class="w-100" />
\ No newline at end of file
diff --git a/ui/src/app/schema-form/widget/filter-target/filter-target.component.scss b/ui/src/app/schema-form/widget/filter-target/filter-target.component.scss
new file mode 100644
index 000000000..13926cdb3
--- /dev/null
+++ b/ui/src/app/schema-form/widget/filter-target/filter-target.component.scss
@@ -0,0 +1,3 @@
+:host {
+    
+}
\ No newline at end of file
diff --git a/ui/src/app/schema-form/widget/filter-target/filter-target.component.ts b/ui/src/app/schema-form/widget/filter-target/filter-target.component.ts
new file mode 100644
index 000000000..badc78eec
--- /dev/null
+++ b/ui/src/app/schema-form/widget/filter-target/filter-target.component.ts
@@ -0,0 +1,112 @@
+import { Component, OnDestroy, AfterViewInit } from '@angular/core';
+import { FormControl, Validators } from '@angular/forms';
+import { ObjectWidget } from 'ngx-schema-form';
+import { Store } from '@ngrx/store';
+import { Observable } from 'rxjs';
+import { distinctUntilChanged, skipWhile } from 'rxjs/operators';
+
+import * as fromRoot from '../../../app.reducer';
+import * as fromFilters from '../../../metadata/filter/reducer';
+
+import { QueryEntityIds, ClearSearch } from '../../../metadata/filter/action/search.action';
+import { EntityValidators } from '../../../metadata/domain/service/entity-validators.service';
+
+/* istanbul ignore next */
+@Component({
+    selector: 'filter-target',
+    templateUrl: `./filter-target.component.html`,
+    styleUrls: ['./filter-target.component.scss']
+})
+export class FilterTargetComponent extends ObjectWidget implements OnDestroy, AfterViewInit {
+
+    ids$: Observable<string[]>;
+    ids: string[];
+
+    search: FormControl = new FormControl(
+        '',
+        [],
+        [EntityValidators.existsInCollection(this.store.select(fromFilters.getEntityCollection))]
+    );
+
+    script: FormControl = new FormControl(
+        '',
+        [Validators.required]
+    );
+
+    constructor(
+        private store: Store<fromRoot.State>
+    ) {
+        super();
+        this.ids$ = this.store.select(fromFilters.getEntityCollection);
+        this.ids$.subscribe(ids => this.ids = ids);
+
+        this.search
+            .valueChanges
+            .pipe(distinctUntilChanged())
+            .subscribe(query => this.searchEntityIds(query));
+
+        this.script
+            .valueChanges
+            .pipe(
+                distinctUntilChanged(),
+                skipWhile(() => this.entityAttributesFilterTargetType === 'ENTITY')
+            )
+            .subscribe(script => {
+                this.setTargetValue([script]);
+            });
+    }
+
+    ngAfterViewInit(): void {
+        super.ngAfterViewInit();
+        this.script.setValue(this.targets[0]);
+    }
+
+    searchEntityIds(term: string): void {
+        if (term && term.length >= 4 && this.ids.indexOf(term) < 0) {
+            this.store.dispatch(new QueryEntityIds({
+                term,
+                limit: 10
+            }));
+        }
+    }
+
+    get targets(): string[] {
+        return this.formProperty.getProperty('value').value;
+    }
+
+    get entityAttributesFilterTargetType(): string {
+        return this.formProperty.getProperty('entityAttributesFilterTargetType').value;
+    }
+
+    get displayType(): string {
+        return this.typeOptions.find(opt => opt.value === this.entityAttributesFilterTargetType).description;
+    }
+
+    get typeOptions(): any[] {
+        return this.formProperty
+                    .getProperty('entityAttributesFilterTargetType')
+                    .schema
+                    .oneOf
+                    .map(option => ({ ...option, value: option.enum[0] }));
+    }
+
+    select(value: string): void {
+        this.formProperty.getProperty('entityAttributesFilterTargetType').setValue(value);
+        this.setTargetValue([]);
+        this.script.setValue(null);
+        this.search.setValue(null);
+    }
+
+    setTargetValue(value: string[]): void {
+        this.formProperty.getProperty('value').setValue(value);
+    }
+
+    onSelectValue(value: string): void {
+        this.setTargetValue([...this.formProperty.getProperty('value').value, value]);
+        this.search.reset(null);
+    }
+
+    ngOnDestroy(): void {
+        this.store.dispatch(new ClearSearch());
+    }
+}
diff --git a/ui/src/app/schema-form/widget/string/string.component.html b/ui/src/app/schema-form/widget/string/string.component.html
index 10f19f0ab..d2704acbd 100644
--- a/ui/src/app/schema-form/widget/string/string.component.html
+++ b/ui/src/app/schema-form/widget/string/string.component.html
@@ -1,4 +1,4 @@
-<div class="widget form-group">
+<div class="widget form-group" [class.d-none]="this.getInputType() === 'hidden'">
     <label [attr.for]="id" class="d-flex justify-content-between control-label">
         <span>{{ schema.title }} <i class="fa fa-asterisk text-danger" aria-hidden="true" *ngIf="required"></i></span>
         <span *ngIf="schema.description">
diff --git a/ui/src/app/shared/autocomplete/autocomplete.component.html b/ui/src/app/shared/autocomplete/autocomplete.component.html
index 6820973fd..103ed7467 100644
--- a/ui/src/app/shared/autocomplete/autocomplete.component.html
+++ b/ui/src/app/shared/autocomplete/autocomplete.component.html
@@ -21,7 +21,7 @@
                 type="button"
                 aria-haspopup="true"
                 aria-expanded="false"
-                (click)="state.setState({menuOpen: true})">
+                (click)="state.setState({menuOpen: !state.currentState.menuOpen})">
                 <i class="fa fa-caret-down"></i>
             </button>
         </div>
diff --git a/ui/src/app/shared/autocomplete/autocomplete.component.ts b/ui/src/app/shared/autocomplete/autocomplete.component.ts
index 9f2ebb52a..d6237742a 100644
--- a/ui/src/app/shared/autocomplete/autocomplete.component.ts
+++ b/ui/src/app/shared/autocomplete/autocomplete.component.ts
@@ -13,7 +13,8 @@ import {
     SimpleChanges,
     forwardRef,
     ChangeDetectionStrategy,
-    OnChanges
+    OnChanges,
+    HostListener
 } from '@angular/core';
 import { FormControl, ControlValueAccessor, NG_VALUE_ACCESSOR, Validators } from '@angular/forms';
 import { Observable, Subject, Subscription, interval } from 'rxjs';
diff --git a/ui/src/app/shared/contenteditable/contenteditable.directive.spec.ts b/ui/src/app/shared/contenteditable/contenteditable.directive.spec.ts
new file mode 100644
index 000000000..80ee92c16
--- /dev/null
+++ b/ui/src/app/shared/contenteditable/contenteditable.directive.spec.ts
@@ -0,0 +1,67 @@
+import { Component, DebugElement, Renderer2 } from '@angular/core';
+import { By } from '@angular/platform-browser';
+import { TestBed, ComponentFixture } from '@angular/core/testing';
+import { ContenteditableDirective } from './contenteditable.directive';
+import { FormControl, ReactiveFormsModule } from '@angular/forms';
+
+
+
+@Component({
+    template: `<div contenteditable="true" [formControl]="control"></div>`
+})
+class TestComponent {
+    control: FormControl = new FormControl('');
+}
+
+describe('Content Editable Directive', () => {
+    let component: TestComponent;
+    let fixture: ComponentFixture<TestComponent>;
+    let element: DebugElement;
+    let renderer: Renderer2;
+
+    beforeEach(() => {
+        TestBed.configureTestingModule({
+            providers: [
+                { provide: Renderer2, useClass: Renderer2 }
+            ],
+            imports: [
+                ReactiveFormsModule
+            ],
+            declarations: [
+                ContenteditableDirective,
+                TestComponent
+            ],
+        });
+
+        fixture = TestBed.createComponent(TestComponent);
+        element = fixture.debugElement.query(By.css('div'));
+        fixture.detectChanges();
+
+        renderer = TestBed.get(Renderer2);
+    });
+
+    describe('functions', () => {
+        it('should compile', () => {
+            expect(element).toBeDefined();
+        });
+    });
+
+    describe('setDisabledState', () => {
+        it('should set the field to disabled', () => {
+            fixture.componentInstance.control.disable();
+            expect(element.attributes.disabled).toBeDefined();
+        });
+
+        it('should set the field to enabled', () => {
+            fixture.componentInstance.control.disable();
+            fixture.detectChanges();
+            fixture.componentInstance.control.enable();
+            expect(element.attributes.disabled).toBeNull();
+        });
+
+        it('should set the field to enabled', () => {
+            fixture.componentInstance.control.enable();
+            expect(element.attributes.disabled).toBeUndefined();
+        });
+    });
+});
diff --git a/ui/src/app/shared/contenteditable/contenteditable.directive.ts b/ui/src/app/shared/contenteditable/contenteditable.directive.ts
new file mode 100644
index 000000000..13b90bd0f
--- /dev/null
+++ b/ui/src/app/shared/contenteditable/contenteditable.directive.ts
@@ -0,0 +1,64 @@
+import {
+    Directive,
+    ElementRef,
+    Renderer2,
+    HostListener,
+    forwardRef,
+    Input,
+    OnInit
+} from '@angular/core';
+
+import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
+
+@Directive({
+    selector: '[contenteditable]',
+    providers:
+        [
+            { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ContenteditableDirective), multi: true }
+        ]
+})
+export class ContenteditableDirective implements ControlValueAccessor {
+    @Input() propValueAccessor = 'textContent';
+
+    private removeDisabledState: () => void;
+
+    private propagateChange = (_: any | null) => { };
+    private propagateTouched = (_: any | null) => { };
+
+    constructor(private elementRef: ElementRef, private renderer: Renderer2) {}
+
+    @HostListener('input')
+    callOnChange() {
+        this.propagateChange(this.elementRef.nativeElement[this.propValueAccessor]);
+    }
+
+    @HostListener('blur')
+    callOnTouched() {
+        this.propagateTouched(null);
+    }
+    writeValue(value: any): void {
+        const normalizedValue = value || '';
+        this.renderer.setProperty(this.elementRef.nativeElement, this.propValueAccessor, normalizedValue);
+    }
+    registerOnChange(fn: any): void {
+        this.propagateChange = fn;
+    }
+    registerOnTouched(fn: any): void {
+        this.propagateTouched = fn;
+    }
+    setDisabledState(isDisabled: boolean): void {
+        if (isDisabled) {
+            this.renderer.setAttribute(this.elementRef.nativeElement, 'disabled', 'true');
+            this.removeDisabledState = this.renderer.listen(this.elementRef.nativeElement, 'keydown', this.listenerDisabledState);
+        } else {
+            if (this.removeDisabledState) {
+                this.renderer.removeAttribute(this.elementRef.nativeElement, 'disabled');
+                this.removeDisabledState();
+            }
+        }
+    }
+
+    private listenerDisabledState(e: KeyboardEvent) {
+        e.preventDefault();
+    }
+}
diff --git a/ui/src/app/shared/shared.module.ts b/ui/src/app/shared/shared.module.ts
index 92fbce0de..1c148a5ea 100644
--- a/ui/src/app/shared/shared.module.ts
+++ b/ui/src/app/shared/shared.module.ts
@@ -10,6 +10,7 @@ import { ValidFormIconComponent } from './component/valid-form-icon.component';
 import { InfoLabelDirective } from './directive/info-label.directive';
 import { PrettyXml } from './pipe/pretty-xml.pipe';
 import { ToggleSwitchComponent } from './switch/switch.component';
+import { ContenteditableDirective } from './contenteditable/contenteditable.directive';
 
 @NgModule({
     imports: [
@@ -26,7 +27,8 @@ import { ToggleSwitchComponent } from './switch/switch.component';
         I18nTextComponent,
         ValidFormIconComponent,
         InfoLabelDirective,
-        PrettyXml
+        PrettyXml,
+        ContenteditableDirective
     ],
     exports: [
         HighlightPipe,
@@ -39,7 +41,8 @@ import { ToggleSwitchComponent } from './switch/switch.component';
         I18nTextComponent,
         ValidFormIconComponent,
         ValidationClassDirective,
-        InfoLabelDirective
+        InfoLabelDirective,
+        ContenteditableDirective
     ]
 })
 export class SharedModule { }
diff --git a/ui/src/app/wizard/model/form-definition.ts b/ui/src/app/wizard/model/form-definition.ts
new file mode 100644
index 000000000..9cd42184b
--- /dev/null
+++ b/ui/src/app/wizard/model/form-definition.ts
@@ -0,0 +1,10 @@
+export interface FormDefinition<T> {
+    label: string;
+    type: string;
+    schema?: string;
+    translate: {
+        parser(changes: Partial<T>, schema?: any),
+        formatter(changes: Partial<T>, schema?: any)
+    };
+    getValidators?(...args: any[]): { [key: string]: any };
+}
diff --git a/ui/src/app/wizard/model/index.ts b/ui/src/app/wizard/model/index.ts
index ec5f15d6a..b42933239 100644
--- a/ui/src/app/wizard/model/index.ts
+++ b/ui/src/app/wizard/model/index.ts
@@ -1 +1,2 @@
 export * from './wizard';
+export * from './form-definition';
diff --git a/ui/src/app/wizard/model/wizard.ts b/ui/src/app/wizard/model/wizard.ts
index b3f598ad6..71389c7c0 100644
--- a/ui/src/app/wizard/model/wizard.ts
+++ b/ui/src/app/wizard/model/wizard.ts
@@ -1,13 +1,7 @@
-export interface Wizard<T> {
-    label: string;
-    type: string;
-    steps: WizardStep[];
-    translate: {
-        parser(changes: Partial<T>, schema?: any),
-        formatter(changes: Partial<T>, schema?: any)
-    };
+import { FormDefinition } from './form-definition';
 
-    getValidators?(...args: any[]): { [key: string]: any };
+export interface Wizard<T> extends FormDefinition<T> {
+    steps: WizardStep[];
 }
 
 export interface WizardStep {
diff --git a/ui/src/assets/schema/filter/entity-attributes.schema.json b/ui/src/assets/schema/filter/entity-attributes.schema.json
new file mode 100644
index 000000000..e1b747a6d
--- /dev/null
+++ b/ui/src/assets/schema/filter/entity-attributes.schema.json
@@ -0,0 +1,225 @@
+{
+    "title": "EntityAttributes Filter",
+    "type": "object",
+    "widget": {
+        "id": "fieldset"
+    },
+    "properties": {
+        "name": {
+            "title": "Filter Name (Dashboard Display Only)",
+            "description": "Filter Name",
+            "type": "string",
+            "widget": {
+                "id": "string",
+                "help": "Must be unique."
+            }
+        },
+        "@type": {
+            "type": "string",
+            "widget": {
+                "id": "hidden"
+            },
+            "default": "EntityAttributes"
+        },
+        "resourceId": {
+            "type": "string",
+            "widget": {
+                "id": "hidden"
+            }
+        },
+        "version": {
+            "type": "integer",
+            "widget": {
+                "id": "hidden"
+            }
+        },
+        "filterEnabled": {
+            "title": "Enable this Filter?",
+            "description": "Enable this Filter?",
+            "type": "boolean",
+            "default": false
+        },
+        "entityAttributesFilterTarget": {
+            "title": "Search Criteria",
+            "description": "Filter Name",
+            "type": "object",
+            "widget": {
+                "id": "filter-target"
+            },
+            "properties": {
+                "entityAttributesFilterTargetType": {
+                    "title": "",
+                    "type": "string",
+                    "default": "ENTITY",
+                    "oneOf": [
+                        {
+                            "enum": [
+                                "ENTITY"
+                            ],
+                            "description": "Entity Id"
+                        },
+                        {
+                            "enum": [
+                                "REGEX"
+                            ],
+                            "description": "Regex"
+                        },
+                        {
+                            "enum": [
+                                "CONDITION_SCRIPT"
+                            ],
+                            "description": "Script"
+                        }
+                    ]
+                },
+                "value": {
+                    "type": "array",
+                    "minItems": 1,
+                    "uniqueItems": true,
+                    "items": {
+                        "type": "string"
+                    }
+                }
+            },
+            "required": ["value"]
+        },
+        "relyingPartyOverrides": {
+            "type": "object",
+            "properties": {
+                "signAssertion": {
+                    "title": "Sign the Assertion",
+                    "description": "Sign Assertion popover",
+                    "type": "boolean",
+                    "default": false
+                },
+                "dontSignResponse": {
+                    "title": "Don't sign the Response",
+                    "description": "Don't Sign Response popover",
+                    "type": "boolean",
+                    "default": false
+                },
+                "turnOffEncryption": {
+                    "title": "Turn off Encryption of Response",
+                    "description": "Turn Off Encryption of Response popover",
+                    "type": "boolean",
+                    "default": false
+                },
+                "useSha": {
+                    "title": "Use SHA1 Algorithm",
+                    "description": "Use SHA1 Signing Algorithm popover",
+                    "type": "boolean",
+                    "default": false
+                },
+                "ignoreAuthenticationMethod": {
+                    "title": "Ignore any SP-Requested Authentication Method",
+                    "description": "Ignore any SP-Requested Authentication Method popover",
+                    "type": "boolean",
+                    "default": false
+                },
+                "omitNotBefore": {
+                    "title": "Omit Not Before Condition",
+                    "type": "boolean",
+                    "description": "Omit Not Before Condition popover",
+                    "default": false
+                },
+                "responderId": {
+                    "title": "ResponderID",
+                    "description": "ResponderId popover",
+                    "type": "string"
+                },
+                "nameIdFormats": {
+                    "title": "NameID Format to Send",
+                    "placeholder": "NameID Format",
+                    "description": "NameID Format to Send popover",
+                    "type": "array",
+                    "uniqueItems": true,
+                    "items": {
+                        "type": "string",
+                        "widget": {
+                            "id": "datalist",
+                            "data": [
+                                "urn:oasis:names:tc:SAML: 1.1:nameid-format:unspecified",
+                                "urn:oasis:names:tc:SAML: 1.1:nameid-format:emailAddress",
+                                "urn:oasis:names:tc:SAML: 2.0:nameid-format:persistent",
+                                "urn:oasis:names:tc:SAML: 2.0:nameid-format:transient"
+                            ]
+                        }
+                    },
+                    "default": null
+                },
+                "authenticationMethods": {
+                    "title": "Authentication Method to Use",
+                    "description": "Authentication Methods to Use popover",
+                    "type": "array",
+                    "placeholder": "Authentication Method",
+                    "uniqueItems": true,
+                    "items": {
+                        "type": "string",
+                        "widget": {
+                            "id": "datalist",
+                            "data": [
+                                "https://refeds.org/profile/mfa",
+                                "urn:oasis:names:tc:SAML: 2.0:ac:classes:TimeSyncToken",
+                                "urn:oasis:names:tc:SAML: 2.0:ac:classes:PasswordProtectedTransport"
+                            ]
+                        }
+                    },
+                    "default": null
+                }
+            }
+        },
+        "attributeRelease": {
+            "type": "array",
+            "description": "Attribute release table - select the attributes you want to release (default unchecked)",
+            "widget": {
+                "id": "checklist",
+                "data": [
+                    { "key": "eduPersonPrincipalName", "label": "eduPersonPrincipalName (EPPN)" },
+                    { "key": "uid", "label": "uid" },
+                    { "key": "mail", "label": "mail" },
+                    { "key": "surname", "label": "surname" },
+                    { "key": "givenName", "label": "givenName" },
+                    { "key": "displayName", "label": "displayName" },
+                    { "key": "eduPersonAffiliation", "label": "eduPersonAffiliation" },
+                    { "key": "eduPersonScopedAffiliation", "label": "eduPersonScopedAffiliation" },
+                    { "key": "eduPersonPrimaryAffiliation", "label": "eduPersonPrimaryAffiliation" },
+                    { "key": "eduPersonEntitlement", "label": "eduPersonEntitlement" },
+                    { "key": "eduPersonAssurance", "label": "eduPersonAssurance" },
+                    { "key": "eduPersonUniqueId", "label": "eduPersonUniqueId" },
+                    { "key": "employeeNumber", "label": "employeeNumber" }
+                ]
+            },
+            "items": {
+                "type": "string"
+            }
+        }
+    },
+    "required": [
+        "name"
+    ],
+    "fieldsets": [
+        {
+            "type": "group-lg",
+            "fields": [
+                "name",
+                "@type",
+                "resourceId",
+                "version",
+                "entityAttributesFilterTarget"
+            ]
+        },
+        {
+            "type": "group",
+            "fields": [
+                "filterEnabled",
+                "relyingPartyOverrides"
+            ]
+        },
+        {
+            "type": "group",
+            "fields": [
+                "attributeRelease"
+            ]
+        }
+    ]
+}
\ No newline at end of file
diff --git a/ui/src/assets/schema/filter/metadata-filter.schema.json b/ui/src/assets/schema/filter/metadata-filter.schema.json
new file mode 100644
index 000000000..704b7b9df
--- /dev/null
+++ b/ui/src/assets/schema/filter/metadata-filter.schema.json
@@ -0,0 +1,48 @@
+{
+    "title": "MetadataFilter",
+    "type": "object",
+    "widget": {
+        "id": "fieldset"
+    },
+    "properties": {
+        "name": {
+            "title": "Metadata Filter Name (Dashboard Display Only)",
+            "description": "Metadata Filter Name",
+            "type": "string",
+            "widget": {
+                "id": "string",
+                "help": "Must be unique."
+            }
+        },
+        "@type": {
+            "title": "Metadata Filter Type",
+            "description": "Metadata Filter Type",
+            "placeholder": "Select a metadata filter type",
+            "type": "string",
+            "widget": {
+                "id": "select"
+            },
+            "oneOf": [
+                {
+                    "enum": [
+                        "EntityAttributes"
+                    ],
+                    "description": "EntityAttributes Filter"
+                }
+            ]
+        }
+    },
+    "required": [
+        "name",
+        "@type"
+    ],
+    "fieldsets": [
+        {
+            "type": "section",
+            "fields": [
+                "name",
+                "@type"
+            ]
+        }
+    ]
+}
\ No newline at end of file
diff --git a/ui/src/styles.scss b/ui/src/styles.scss
index 6aaec38da..454ccba2e 100644
--- a/ui/src/styles.scss
+++ b/ui/src/styles.scss
@@ -5,6 +5,7 @@
 @import './theme/tags';
 @import './theme/alert';
 @import './theme/typography';
+@import './theme/list';
 
 body {
     background-color: theme-color("light");
diff --git a/ui/src/theme/forms.scss b/ui/src/theme/forms.scss
index 96323bcaa..5d4664008 100644
--- a/ui/src/theme/forms.scss
+++ b/ui/src/theme/forms.scss
@@ -71,6 +71,13 @@ Json schema form
     @include component-validation-state("invalid", $form-feedback-invalid-color);
 }
 
+.codearea {
+    white-space: pre-wrap;
+    resize: vertical;
+    font-family: monospace;
+    min-height: 166px;
+}
+
 @media only screen and (max-width: 1200px) {
     .form-section:not(:first-child) {
         border-left: 0px;
diff --git a/ui/src/theme/list.scss b/ui/src/theme/list.scss
new file mode 100644
index 000000000..2fa09b033
--- /dev/null
+++ b/ui/src/theme/list.scss
@@ -0,0 +1,16 @@
+.list-group {
+    &.list-group-sm {
+        & > .list-group-item {
+            padding: 0rem 0.75rem;
+        }
+    }
+
+    &.list-group-scroll {
+        overflow: scroll;
+        max-height: 48px * 5;
+
+        & > .list-group-item {
+            min-height: 30px;
+        }
+    }
+}
\ No newline at end of file