diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section/dataset-profile-editor-section.component.html b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section/dataset-profile-editor-section.component.html
index 2ce1a73b2..c45a936f0 100644
--- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section/dataset-profile-editor-section.component.html
+++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section/dataset-profile-editor-section.component.html
@@ -27,12 +27,12 @@
 		<input matInput type="number" placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.SECTION.FIELDS.ORDER' | translate}}"
 		 formControlName="ordinal">
 	</mat-form-field> -->
-	<div class="heading col-12">{{'DATASET-PROFILE-EDITOR.STEPS.SECTION-INFO.SECTION-DESCRIPTION' | translate}} *</div>
+	<div class="heading col-12">{{'DATASET-PROFILE-EDITOR.STEPS.SECTION-INFO.SECTION-DESCRIPTION' | translate}} </div>
 	<div class="hint col-12">{{'DATASET-PROFILE-EDITOR.STEPS.SECTION-INFO.SECTION-DESCRIPTION-HINT' | translate}}</div>
 	<mat-form-field class="col-12">
 		<input matInput type="text" placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.SECTION.FIELDS.DESCRIPTION' | translate}}"
-		formControlName="description" required>
-		<mat-error >{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
+		formControlName="description">
+		<!-- <mat-error >{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> -->
 	</mat-form-field>
 
 
diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.html b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.html
index 9762d8f86..d06a4130b 100644
--- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.html
+++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.html
@@ -30,7 +30,6 @@
 				</div>
 			</div>
 
-
 			<!-- Steps Navigation -->
 			<div class="col-12 d-flex" *ngIf="steps">
 				<div class="col-7 bg-white" style="overflow: hidden; padding: 0px" id="progress-container">
@@ -388,8 +387,8 @@
 			<mat-step [label]="'DATASET-PROFILE-EDITOR.ACTIONS.PREVIEW-AND-FINALIZE' | translate">
 				<!-- {{'DATASET-PROFILE-EDITOR.ACTIONS.PREVIEW-AND-FINALIZE' | translate}} -->
 				<!-- <button (click)="generatePreviewForm()">foo</button> -->
-				<ng-container *ngIf="form.get('sections')?.length">
-					<app-dataset-description [form]="previewForm" [visibilityRules]="visibilityRules" *ngIf="previewForm">
+				<ng-container *ngIf="formGroup">
+					<app-dataset-description [form]="formGroup" [visibilityRules]="visibilityRules" *ngIf="formGroup">
 	
 					</app-dataset-description>
 				</ng-container>
diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.scss b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.scss
index 0b17e1d81..64435dc46 100644
--- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.scss
+++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.scss
@@ -65,9 +65,9 @@
 #progress{
 	position: absolute;
 	height: 100%;
-	width: 110%;
-	transform: translateX(-110%);
-	transition-property: transform;
+	width: 100%;
+	clip-path: polygon(0 0, 0 0, 0 0, 0 0);
+	transition-property: clip-path;
 	transition-duration: 600ms;
 	transition-timing-function: ease-out;
 	transition-delay: 50ms;
diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.ts b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.ts
index 1aabe4937..4d453370f 100644
--- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.ts
+++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.ts
@@ -377,11 +377,6 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
 			});
 	}
 
-	updateValidity(){
-		// this.form.updateValueAndValidity();
-		console.log('updagted');
-	}
-
 	getFilenameFromContentDispositionHeader(header: string): string {
 		const regex: RegExp = new RegExp(/filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/g);
 
@@ -491,11 +486,12 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
 	datasetWizardModel: DatasetWizardEditorModel;
 	formGroup: FormGroup;
 	getPreview() {
-		let data = this.form.value;
+		let data = this.form.getRawValue();
 		this.datasetProfileService.preview(data).subscribe(x => {
 			this.datasetWizardModel = new DatasetWizardEditorModel().fromModel({
 				datasetProfileDefinition: x
 			});
+			this.updateVisibilityRules();
 			this.formGroup = <FormGroup>this.datasetWizardModel.buildForm().get('datasetProfileDefinition');
 		});
 		//this.formGroupRawValue = JSON.parse(JSON.stringify(this.formGroup.getRawValue()));
@@ -1166,15 +1162,20 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
 
 	get barPercentage(){
 		if(!this.stepper || !this.steps){
-			return -110;
+			return 0;
 		}
 		const selectedIndex = this.stepper.selectedIndex + 1;
-		return (selectedIndex / this.stepper.steps.length) * 110- 110;
+		return (selectedIndex / this.stepper.steps.length) * 100;
 	}
 
 
 	get progressStyle(){
-		return {'transform': 'translateX('+this.barPercentage+'%) skewX(-25deg)'}
+		// return {'transform': 'translateX('+this.barPercentage+'%) skewX(-25deg)'}
+		const diff = 3;
+
+		return {
+			'clip-path': `polygon(0 0, ${Math.round(this.barPercentage + diff)}% 0, ${Math.round(this.barPercentage)}% 100%, 0 100%)`
+		}
 	}
 
 	steps:QueryList<CdkStep>;
@@ -1187,53 +1188,82 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
 	// }
 
 
-	generatePreviewForm(){
+	// generatePreviewForm(){
 		
 
-		const model =  new DatasetDescriptionFormEditorModel();
+	// 	const model =  new DatasetDescriptionFormEditorModel();
 
-		const toCentries = this.getTocEntries();
+	// 	const toCentries = this.getTocEntries();
 
 
-		//first level is always pages
-		model.pages = toCentries.map((entry,idx)=>{
-			if( !(entry.type == ToCEntryType.Page)){
-				return null;
-			}
-			const pageModel = new DatasetDescriptionPageEditorModel();
+	// 	//first level is always pages
+	// 	model.pages = toCentries.map((entry,idx)=>{
+	// 		if( !(entry.type == ToCEntryType.Page)){
+	// 			return null;
+	// 		}
+	// 		const pageModel = new DatasetDescriptionPageEditorModel();
 
-			pageModel.ordinal = entry.form.get('ordinal').value;
-			pageModel.title = entry.label;
+	// 		pageModel.ordinal = entry.form.get('ordinal').value;
+	// 		pageModel.title = entry.label;
 			
-			if(entry.subEntries){
-				pageModel.sections = entry.subEntries.map(section=>{
-					const sectionModel = new DatasetDescriptionSectionEditorModel();
+	// 		if(entry.subEntries){
+	// 			pageModel.sections = entry.subEntries.map(section=>{
+	// 				const sectionModel = new DatasetDescriptionSectionEditorModel();
 
-					sectionModel.id = section.id;
-					sectionModel.ordinal = section.form.get('ordinal').value;
-					sectionModel.description = section.form.get('description').value; 
-					sectionModel.page = entry.form.get('ordinal').value;
-					sectionModel.title = section.label;
-					sectionModel.numbering = (idx+1).toString();
+	// 				sectionModel.id = section.id;
+	// 				sectionModel.ordinal = section.form.get('ordinal').value;
+	// 				sectionModel.description = section.form.get('description').value; 
+	// 				sectionModel.page = entry.form.get('ordinal').value;
+	// 				sectionModel.title = section.label;
+	// 				sectionModel.numbering = (idx+1).toString();
 
 
-					if(section.subEntriesType == ToCEntryType.Section){
-						sectionModel.sections = this._buildSectionsRecursively(section.subEntries, sectionModel.numbering);
-					}else{
-						sectionModel.compositeFields = this._buildFormFields(section.subEntries, sectionModel.numbering)
-					}
+	// 				if(section.subEntriesType == ToCEntryType.Section){
+	// 					sectionModel.sections = this._buildSectionsRecursively(section.subEntries, sectionModel.numbering);
+	// 				}else{
+	// 					sectionModel.compositeFields = this._buildFormFields(section.subEntries, sectionModel.numbering)
+	// 				}
 
-					return sectionModel;
-				});
-			};
-			return pageModel;
+	// 				return sectionModel;
+	// 			});
+	// 		};
+	// 		return pageModel;
 
-		});
+	// 	});
 
 
-		//populate rules
+	// 	//populate rules
+	// 	const rules:Rule[] =[];
+	// 	const fieldSets = this._getFieldSets(toCentries);
+
+	// 	fieldSets.forEach(fs=>{
+	// 		const fields = fs.form.get('fields') as FormArray;
+	// 		if(fields){
+	// 			fields.controls.forEach(field=>{
+	// 				const rulesArray = field.get('visible').get('rules').value;
+	// 				if(rulesArray){
+	// 					rulesArray.forEach(ruleElement => {
+	// 						const rule: Rule = new Rule();
+	// 						rule.targetField = ruleElement.target;
+	// 						rule.sourceField = field.get('id').value;
+	// 						rule.requiredValue = ruleElement.value;
+	// 						rules.push(rule);
+	// 					});
+	// 				}
+	// 			});
+	// 		}
+	// 	});
+		 
+	// 	model.rules = rules;
+	// 	this.visibilityRules = rules;
+		
+	// 	this.previewForm = model.buildForm();
+	// }
+
+
+	updateVisibilityRules(){
 		const rules:Rule[] =[];
-		const fieldSets = this._getFieldSets(toCentries);
+		const fieldSets = this._getFieldSets(this.getTocEntries());
 
 		fieldSets.forEach(fs=>{
 			const fields = fs.form.get('fields') as FormArray;
@@ -1253,10 +1283,8 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
 			}
 		});
 		 
-		model.rules = rules;
 		this.visibilityRules = rules;
-		
-		this.previewForm = model.buildForm();
+
 	}
 
 	visibilityRules:Rule[];
@@ -1379,15 +1407,17 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
 	onMatStepperSelectionChange(event: StepperSelectionEvent){	
 
 		if(event.selectedIndex === (this.steps.length -1)){//preview selected
-			this.generatePreviewForm();//TODO LAZY LOADING IN THE TEMPLATE
+			// this.generatePreviewForm();//TODO LAZY LOADING IN THE TEMPLATE
+			this.getPreview();
 		}else{
-			this.previewForm = null;
+			// this.previewForm = null;
+			this.formGroup = null;
 		}
 		this.form.markAsUntouched();
 
 	}
 
-	previewForm:FormGroup;
+	// previewForm:FormGroup;
 	onDataNeedsRefresh(){
 		this.refreshToCEntries();
 	}
@@ -1590,18 +1620,6 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
 				})
 			}
 
-			// console.log(result);
-
-
-			// if(this.stepper.selectedIndex != 0){
-			// 	if(!(this.form.get('pages') as FormArray).length){
-			// 		errmess.push(
-			// 			'There has to be at least one section in the template.'
-			// 		);
-			// 	}
-			// }
-
-
 			const dialogRef = this.dialog.open(FormValidationErrorsDialogComponent, {
 				disableClose: true,
 				autoFocus: false,