diff --git a/ui/src/app/metadata/provider/action/entity.action.ts b/ui/src/app/metadata/provider/action/entity.action.ts
index 09398ce97..bff45b5f4 100644
--- a/ui/src/app/metadata/provider/action/entity.action.ts
+++ b/ui/src/app/metadata/provider/action/entity.action.ts
@@ -7,7 +7,9 @@ export enum EntityActionTypes {
UPDATE_PROVIDER = '[Provider Entity] Update Provider',
SAVE_PROVIDER_REQUEST = '[Provider Entity] Save Provider Request',
SAVE_PROVIDER_SUCCESS = '[Provider Entity] Save Provider Success',
- SAVE_PROVIDER_FAIL = '[Provider Entity] Save Provider Fail'
+ SAVE_PROVIDER_FAIL = '[Provider Entity] Save Provider Fail',
+
+ RESET_CHANGES = '[Provider Entity] Reset Provider Changes'
}
export class SelectProvider implements Action {
@@ -46,10 +48,15 @@ export class SaveProviderFail implements Action {
constructor(public payload: Error) { }
}
+export class ResetChanges implements Action {
+ readonly type = EntityActionTypes.RESET_CHANGES;
+}
+
export type EntityActionUnion =
| SelectProvider
| UpdateProvider
| SaveProviderRequest
| SaveProviderSuccess
| SaveProviderFail
- | CreateProvider;
+ | CreateProvider
+ | ResetChanges;
diff --git a/ui/src/app/metadata/provider/container/provider-wizard.component.html b/ui/src/app/metadata/provider/container/provider-wizard.component.html
index 83caacfd0..58adb7221 100644
--- a/ui/src/app/metadata/provider/container/provider-wizard.component.html
+++ b/ui/src/app/metadata/provider/container/provider-wizard.component.html
@@ -6,13 +6,13 @@
+ -->
diff --git a/ui/src/app/metadata/provider/container/provider-wizard.component.ts b/ui/src/app/metadata/provider/container/provider-wizard.component.ts
index 0565a5336..36861d3cf 100644
--- a/ui/src/app/metadata/provider/container/provider-wizard.component.ts
+++ b/ui/src/app/metadata/provider/container/provider-wizard.component.ts
@@ -1,20 +1,21 @@
import { Component, OnDestroy } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
-import { Subscription, Observable } from 'rxjs';
-import { distinctUntilChanged, map } from 'rxjs/operators';
+import { Subscription, Observable, Subject } from 'rxjs';
+import { distinctUntilChanged, map, withLatestFrom } from 'rxjs/operators';
import { Store } from '@ngrx/store';
import * as fromProvider from '../reducer';
import * as fromWizard from '../../../wizard/reducer';
-import { SetIndex, SetDisabled, UpdateDefinition, WizardActionTypes, Next } from '../../../wizard/action/wizard.action';
+import { SetIndex, SetDisabled, UpdateDefinition, WizardActionTypes, Next, SetDefinition } from '../../../wizard/action/wizard.action';
import { LoadSchemaRequest, UpdateStatus } from '../action/editor.action';
import { startWith } from 'rxjs/operators';
import { Wizard, WizardStep } from '../../../wizard/model';
import { MetadataProvider } from '../../domain/model';
-import { MetadataProviderTypes } from '../model';
+import { MetadataProviderTypes, MetadataProviderWizard } from '../model';
import { UpdateProvider } from '../action/entity.action';
+import { pick } from '../../../shared/util';
@Component({
selector: 'provider-wizard-page',
@@ -25,7 +26,11 @@ import { UpdateProvider } from '../action/entity.action';
export class ProviderWizardComponent implements OnDestroy {
actionsSubscription: Subscription;
+ changeSubject = new Subject>();
+ private changeEmitted$ = this.changeSubject.asObservable();
+
schema$: Observable;
+ schema: any;
definition$: Observable>;
changes$: Observable;
currentPage: string;
@@ -37,9 +42,7 @@ export class ProviderWizardComponent implements OnDestroy {
previousStep: WizardStep;
constructor(
- private store: Store,
- private route: ActivatedRoute,
- private router: Router
+ private store: Store
) {
this.store
.select(fromWizard.getCurrentWizardSchema)
@@ -59,14 +62,44 @@ export class ProviderWizardComponent implements OnDestroy {
.subscribe((valid) => {
this.store.dispatch(new SetDisabled(!valid));
});
+
+ this.schema$.subscribe(s => this.schema = s);
+
+ this.changeEmitted$
+ .pipe(
+ withLatestFrom(this.schema$, this.definition$),
+ )
+ .subscribe(
+ ([changes, schema, definition]) => {
+ const type = changes.value['@type'];
+ if (type && type !== definition.type) {
+ const newDefinition = MetadataProviderTypes.find(def => def.type === type);
+ if (newDefinition) {
+ this.store.dispatch(new SetDefinition({
+ ...MetadataProviderWizard,
+ ...newDefinition,
+ steps: [
+ ...MetadataProviderWizard.steps,
+ ...newDefinition.steps
+ ]
+ }));
+ changes = { value: pick(Object.keys(schema.properties))(changes.value) };
+ }
+ }
+ this.store.dispatch(new UpdateProvider(changes.value));
+ }
+ );
}
ngOnDestroy() {
this.actionsSubscription.unsubscribe();
+ this.changeSubject.complete();
}
next(): void {
- this.store.dispatch(new SetIndex(this.nextStep.id));
+ if (this.nextStep) {
+ this.store.dispatch(new SetIndex(this.nextStep.id));
+ }
}
previous(): void {
@@ -77,14 +110,6 @@ export class ProviderWizardComponent implements OnDestroy {
console.log('Save!');
}
- onValueChange(changes: any): void {
- const type = changes.value['@type'];
- if (type) {
- this.store.dispatch(new UpdateDefinition(MetadataProviderTypes.find(def => def.type === type)));
- }
- this.store.dispatch(new UpdateProvider(changes.value));
- }
-
onStatusChange(value): void {
const status = { [this.currentPage]: value ? 'VALID' : 'INVALID' };
this.store.dispatch(new UpdateStatus(status));
diff --git a/ui/src/app/metadata/provider/effect/editor.effect.ts b/ui/src/app/metadata/provider/effect/editor.effect.ts
index f778a4ac6..7fc04f3bc 100644
--- a/ui/src/app/metadata/provider/effect/editor.effect.ts
+++ b/ui/src/app/metadata/provider/effect/editor.effect.ts
@@ -10,6 +10,8 @@ import {
} from '../action/editor.action';
import { map, switchMap, catchError } from 'rxjs/operators';
import { of } from 'rxjs';
+import { SetDefinition, WizardActionTypes } from '../../../wizard/action/wizard.action';
+import { ResetChanges } from '../action/entity.action';
@Injectable()
export class EditorEffects {
@@ -28,6 +30,12 @@ export class EditorEffects {
)
);
+ @Effect()
+ $resetChanges = this.actions$.pipe(
+ ofType(WizardActionTypes.SET_DEFINITION),
+ map(() => new ResetChanges())
+ );
+
constructor(
private schemaService: SchemaService,
private actions$: Actions
diff --git a/ui/src/app/metadata/provider/reducer/entity.reducer.ts b/ui/src/app/metadata/provider/reducer/entity.reducer.ts
index 936370316..101674749 100644
--- a/ui/src/app/metadata/provider/reducer/entity.reducer.ts
+++ b/ui/src/app/metadata/provider/reducer/entity.reducer.ts
@@ -15,6 +15,12 @@ export const initialState: EntityState = {
export function reducer(state = initialState, action: EntityActionUnion): EntityState {
switch (action.type) {
+ case EntityActionTypes.RESET_CHANGES: {
+ return {
+ ...state,
+ changes: initialState.changes
+ };
+ }
case EntityActionTypes.SELECT_PROVIDER:
case EntityActionTypes.CREATE_PROVIDER: {
return {
diff --git a/ui/src/app/schema-form/widget/fieldset/fieldset.component.scss b/ui/src/app/schema-form/widget/fieldset/fieldset.component.scss
index 46236c26d..ac2db04af 100644
--- a/ui/src/app/schema-form/widget/fieldset/fieldset.component.scss
+++ b/ui/src/app/schema-form/widget/fieldset/fieldset.component.scss
@@ -1,7 +1,8 @@
:host {
fieldset {
+ margin-bottom: 1rem;
legend {
- font-size: 1em;
+ font-size: 1rem;
}
}
}
diff --git a/ui/src/app/shared/util.ts b/ui/src/app/shared/util.ts
index 230824955..2e506bffa 100644
--- a/ui/src/app/shared/util.ts
+++ b/ui/src/app/shared/util.ts
@@ -39,3 +39,14 @@ export function checkByType(value): boolean {
}
}
}
+
+export function pick(approvedProperties: string[]): Function {
+ return (original) =>
+ Object.keys(original)
+ .filter((key) => approvedProperties.indexOf(key) > -1)
+ .reduce((newObj, key) => {
+ let value = original[key];
+ newObj[key] = value;
+ return newObj;
+ }, {});
+}
diff --git a/ui/src/app/wizard/component/wizard.component.html b/ui/src/app/wizard/component/wizard.component.html
index a4da5f315..e5921c6ac 100644
--- a/ui/src/app/wizard/component/wizard.component.html
+++ b/ui/src/app/wizard/component/wizard.component.html
@@ -30,6 +30,18 @@
+
+
+
+
diff --git a/ui/src/app/wizard/component/wizard.component.ts b/ui/src/app/wizard/component/wizard.component.ts
index a72c363b5..5ab006519 100644
--- a/ui/src/app/wizard/component/wizard.component.ts
+++ b/ui/src/app/wizard/component/wizard.component.ts
@@ -26,7 +26,7 @@ export class WizardComponent implements OnChanges {
previous$: Observable;
next$: Observable;
current$: Observable;
- save$: Observable;
+ last$: Observable;
constructor(
private store: Store
@@ -37,7 +37,7 @@ export class WizardComponent implements OnChanges {
this.previous$ = this.store.select(fromWizard.getPrevious);
this.next$ = this.store.select(fromWizard.getNext);
this.current$ = this.store.select(fromWizard.getCurrent);
- this.save$ = this.store.select(fromWizard.getSave);
+ this.last$ = this.store.select(fromWizard.getLast);
}
ngOnChanges(): void {
diff --git a/ui/src/app/wizard/reducer/index.ts b/ui/src/app/wizard/reducer/index.ts
index ff89a5b2a..1119d5d14 100644
--- a/ui/src/app/wizard/reducer/index.ts
+++ b/ui/src/app/wizard/reducer/index.ts
@@ -48,13 +48,13 @@ export const getCurrentFn = (index: string, wizard: Wizard) => {
return wizard.steps.find(s => s.id === index);
};
-export const getSaveFn = (index: string, wizard: Wizard) => {
+export const getLastFn = (index: string, wizard: Wizard) => {
if (!wizard) { return null; }
- const step = wizard.steps[wizard.steps.length - 1] && wizard.steps.length > 1;
- return step;
+ const step = wizard.steps.length > 1 && wizard.steps[wizard.steps.length - 1];
+ return index === step.id ? step : null;
};
export const getPrevious = createSelector(getWizardIndex, getWizardDefinition, getPreviousFn);
export const getCurrent = createSelector(getWizardIndex, getWizardDefinition, getCurrentFn);
export const getNext = createSelector(getWizardIndex, getWizardDefinition, getNextFn);
-export const getSave = createSelector(getWizardIndex, getWizardDefinition, getSaveFn);
+export const getLast = createSelector(getWizardIndex, getWizardDefinition, getLastFn);