diff --git a/ui/src/app/metadata/configuration/action/restore.action.ts b/ui/src/app/metadata/configuration/action/restore.action.ts
index 48861c35e..b05594fab 100644
--- a/ui/src/app/metadata/configuration/action/restore.action.ts
+++ b/ui/src/app/metadata/configuration/action/restore.action.ts
@@ -5,13 +5,39 @@ export enum RestoreActionTypes {
     SELECT_VERSION_SUCCESS = '[Restore Version] Select Version Success',
     SELECT_VERSION_ERROR = '[Restore Version] Select Version Error',
     SELECT_VERSION_REQUEST = '[Restore Version] Select Version Request',
+
+    RESTORE_VERSION_REQUEST = '[Restore Version] Restore Version Request',
+    RESTORE_VERSION_SUCCESS = '[Restore Version] Restore Version Request',
+    RESTORE_VERSION_ERROR = '[Restore Version] Restore Version Request',
+
     CLEAR_VERSION = '[Restore Version] Clear Versions'
 }
 
+export interface VersionRequest {
+    type: string;
+    id: string;
+    version: string;
+}
+
+export class RestoreVersionRequest implements Action {
+    readonly type = RestoreActionTypes.RESTORE_VERSION_REQUEST;
+    constructor(public payload: VersionRequest) { }
+}
+
+export class RestoreVersionSuccess implements Action {
+    readonly type = RestoreActionTypes.RESTORE_VERSION_SUCCESS;
+    constructor(public payload: Metadata) { }
+}
+
+export class RestoreVersionError implements Action {
+    readonly type = RestoreActionTypes.RESTORE_VERSION_ERROR;
+    constructor(public payload: any) { }
+}
+
 export class SelectVersionRestoreRequest implements Action {
     readonly type = RestoreActionTypes.SELECT_VERSION_REQUEST;
 
-    constructor(public payload: { type: string, id: string, version: string }) { }
+    constructor(public payload: VersionRequest) { }
 }
 
 export class SelectVersionRestoreSuccess implements Action {
@@ -33,4 +59,7 @@ export type RestoreActionsUnion =
     | SelectVersionRestoreRequest
     | SelectVersionRestoreError
     | SelectVersionRestoreSuccess
+    | RestoreVersionRequest
+    | RestoreVersionSuccess
+    | RestoreVersionError
     | ClearVersionRestore;
diff --git a/ui/src/app/metadata/configuration/container/configuration.component.ts b/ui/src/app/metadata/configuration/container/configuration.component.ts
index d8c0234c6..7e8d6f443 100644
--- a/ui/src/app/metadata/configuration/container/configuration.component.ts
+++ b/ui/src/app/metadata/configuration/container/configuration.component.ts
@@ -37,7 +37,7 @@ export class ConfigurationComponent implements OnDestroy {
                 type,
                 version
             }))
-        ).subscribe(store);
+        ).subscribe(this.store);
 
         this.routerState.params.pipe(
             takeUntil(this.ngUnsubscribe),
diff --git a/ui/src/app/metadata/configuration/container/metadata-history.component.ts b/ui/src/app/metadata/configuration/container/metadata-history.component.ts
index 17f2c3caa..7d817b94f 100644
--- a/ui/src/app/metadata/configuration/container/metadata-history.component.ts
+++ b/ui/src/app/metadata/configuration/container/metadata-history.component.ts
@@ -49,6 +49,7 @@ export class MetadataHistoryComponent {
         this.router.navigate(
             [ '../', 'restore' ],
             {
+                queryParams: { version: version.id },
                 relativeTo: this.route
             }
         );
diff --git a/ui/src/app/metadata/configuration/container/restore.component.html b/ui/src/app/metadata/configuration/container/restore.component.html
index c842aa47d..0b5a2f1ac 100644
--- a/ui/src/app/metadata/configuration/container/restore.component.html
+++ b/ui/src/app/metadata/configuration/container/restore.component.html
@@ -1,12 +1,14 @@
 <h2 class="mb-4">
-    Restore Version
+    Restore Version ({{ date$ | async | date:DATE_FORMAT }})
 </h2>
 <div class="d-flex justify-content-center align-items-center">
     <div class="card m-4 w-50">
         <div class="card-body">
-            <h3 class="card-title">Create new version from {{ date | date:DATE_FORMAT }} settings</h3>
-            <p>Restoring this version will copy the configuration from the selected version and create a new version from these settings. You can then edit the configuration before saving the new version.</p>
-            <a href="#" class="btn btn-light">Cancel</a>&nbsp;<a href="#" class="btn btn-primary">Restore</a>
+            <h3 class="card-title">Create New Version from Version ({{ date$ | async | date:DATE_FORMAT }}) Settings</h3>
+            <p>Restoring this version will copy the Version ({{ date$ | async | date:DATE_FORMAT }}) configuration and create a new Version from the
+            selected version settings. You can then edit the configuration before saving the new version.</p>
+            <a [routerLink]="['../', 'history']" class="btn btn-light">Cancel</a>&nbsp;
+            <button class="btn btn-primary" (click)="restore()">Restore</button>
         </div>
     </div>
 </div>
diff --git a/ui/src/app/metadata/configuration/container/restore.component.ts b/ui/src/app/metadata/configuration/container/restore.component.ts
index 53f3573ec..83d3cb98f 100644
--- a/ui/src/app/metadata/configuration/container/restore.component.ts
+++ b/ui/src/app/metadata/configuration/container/restore.component.ts
@@ -5,6 +5,8 @@ import { Subject } from 'rxjs';
 
 import * as fromConfiguration from '../reducer';
 import { CONFIG_DATE_FORMAT } from '../configuration.values';
+import { RestoreVersionRequest } from '../action/restore.action';
+import { withLatestFrom, map, takeUntil } from 'rxjs/operators';
 
 @Component({
     selector: 'restore-component',
@@ -13,19 +15,32 @@ import { CONFIG_DATE_FORMAT } from '../configuration.values';
     styleUrls: []
 })
 export class RestoreComponent implements OnDestroy {
-    private ngUnsubscribe: Subject<void> = new Subject<void>();
 
-    DATE_FORMAT = CONFIG_DATE_FORMAT;
+    private subj = new Subject<any>();
+    restore$ = this.subj.asObservable();
+
+    date$ = this.store.select(fromConfiguration.getConfigurationVersionDate);
 
-    date = new Date();
+    DATE_FORMAT = CONFIG_DATE_FORMAT;
 
     constructor(
-        private store: Store<fromConfiguration.ConfigurationState>,
-        private routerState: ActivatedRoute
-    ) {}
+        private store: Store<fromConfiguration.ConfigurationState>
+    ) {
+        this.restore$.pipe(
+            withLatestFrom(
+                this.store.select(fromConfiguration.getSelectedVersionId),
+                this.store.select(fromConfiguration.getConfigurationModelType),
+                this.store.select(fromConfiguration.getConfigurationModelId)
+            ),
+            map(([restore, version, type, id]) => new RestoreVersionRequest({ id, type, version }))
+        ).subscribe(this.store);
+    }
+
+    restore() {
+        this.subj.next();
+    }
 
-    ngOnDestroy() {
-        this.ngUnsubscribe.next();
-        this.ngUnsubscribe.complete();
+    ngOnDestroy(): void {
+        this.subj.complete();
     }
 }
diff --git a/ui/src/app/metadata/configuration/effect/configuration.effect.ts b/ui/src/app/metadata/configuration/effect/configuration.effect.ts
index 924d61919..b9719469d 100644
--- a/ui/src/app/metadata/configuration/effect/configuration.effect.ts
+++ b/ui/src/app/metadata/configuration/effect/configuration.effect.ts
@@ -44,11 +44,11 @@ export class MetadataConfigurationEffects {
         map(action => action.payload),
         switchMap(payload =>
             this.historyService.getVersion(payload.id, payload.type, payload.version).pipe(
-                map((response: Metadata) =>
-                    (payload.type === 'resolver') ?
+                map((response: Metadata) => {
+                    return (payload.type === 'resolver') ?
                         new SelectResolverSuccess(response as MetadataResolver) :
-                        new SelectProviderSuccess(response as MetadataProvider)
-                )
+                        new SelectProviderSuccess(response as MetadataProvider);
+                })
             )
         )
     );
diff --git a/ui/src/app/metadata/configuration/effect/restore.effect.ts b/ui/src/app/metadata/configuration/effect/restore.effect.ts
index b7f928f88..3a7f10002 100644
--- a/ui/src/app/metadata/configuration/effect/restore.effect.ts
+++ b/ui/src/app/metadata/configuration/effect/restore.effect.ts
@@ -6,7 +6,8 @@ import {
     RestoreActionTypes,
     SelectVersionRestoreRequest,
     SelectVersionRestoreError,
-    SelectVersionRestoreSuccess
+    SelectVersionRestoreSuccess,
+    RestoreVersionRequest
 } from '../action/restore.action';
 import { MetadataHistoryService } from '../service/history.service';
 import { of } from 'rxjs';
@@ -16,7 +17,7 @@ import { of } from 'rxjs';
 export class RestoreVersionEffects {
 
     @Effect()
-    restoreVersionFromId$ = this.actions$.pipe(
+    selectVersionFromId$ = this.actions$.pipe(
         ofType<SelectVersionRestoreRequest>(RestoreActionTypes.SELECT_VERSION_REQUEST),
         map(action => action.payload),
         switchMap(({ type, id, version }) => {
@@ -27,6 +28,18 @@ export class RestoreVersionEffects {
         })
     );
 
+    @Effect()
+    restoreVersion$ = this.actions$.pipe(
+        ofType<RestoreVersionRequest>(RestoreActionTypes.RESTORE_VERSION_REQUEST),
+        map(action => action.payload),
+        switchMap(({ id, type, version }) => {
+            return this.historyService.getVersion(id, version, type).pipe(
+                map(v => new SelectVersionRestoreSuccess(v)),
+                catchError(err => of(new SelectVersionRestoreError(err)))
+            );
+        })
+    );
+
     constructor(
         private historyService: MetadataHistoryService,
         private actions$: Actions
diff --git a/ui/src/app/metadata/configuration/reducer/index.ts b/ui/src/app/metadata/configuration/reducer/index.ts
index 76140bfca..469fe740e 100644
--- a/ui/src/app/metadata/configuration/reducer/index.ts
+++ b/ui/src/app/metadata/configuration/reducer/index.ts
@@ -183,3 +183,4 @@ export const getConfigurationModelType = createSelector(getConfigurationModel, g
 
 export const getConfigurationHasXml = createSelector(getConfigurationXml, xml => !!xml);
 export const getConfigurationFilters = createSelector(getConfigurationModel, model => model.metadataFilters);
+export const getConfigurationVersionDate = createSelector(getConfigurationModel, version => version.modifiedDate);