Change contact base on new contact

src/app/contact/contact.component.html

@@ -7,21 +7,19 @@
 <div class="uk-section uk-padding-remove-top uk-container uk-container-large">
   <div class="uk-padding-small uk-width-1-2@l uk-width-2-3@m uk-width-1-1">
     <div class="uk-position-relative">
-      <contact-us *ngIf="!showLoading"
-                  [properties]="properties" [errorMessage]="errorMessage"
-                  [contactForm]="contactForm" (sendEmitter)="send($event)">
+      <contact-us [sending]="sending" [contactForm]="contactForm" (sendEmitter)="send($event)">
         <h1 page-title class="uk-margin-auto">
           Contact us to <br> learn more<span class="uk-text-primary">.</span>
         </h1>
       </contact-us>
-      <div *ngIf="showLoading" class="uk-position-center uk-margin-medium-top">
+      <div *ngIf="sending" class="uk-position-center uk-margin-medium-top">
         <loading></loading>
       </div>
     </div>
   </div>
 </div>
 <modal-alert #AlertModal (alertOutput)="goToHome()">
-  <div class="uk-text-center">
+  <div class="uk-padding-small uk-padding-remove-horizontal">
     Our team will respond to your submission soon.<br>
     Press OK to redirect to OpenAIRE Connect home page.
   </div>

src/app/contact/contact.component.ts

@@ -13,6 +13,7 @@ import {FormBuilder, FormGroup, Validators} from "@angular/forms";
 import {Breadcrumb} from "../openaireLibrary/utils/breadcrumbs/breadcrumbs.component";
 import {Subscriber} from "rxjs";
 import {properties} from "../../environments/environment";
+import {NotificationHandler} from "../openaireLibrary/utils/notification-handler";
 
 @Component({
     selector: 'contact',
@@ -23,17 +24,16 @@ export class ContactComponent implements OnInit {
     public url: string = null;
     public pageTitle: string = "OpenAIRE - Connect | Contact Us";
     public description: string = "Contact us to learn more about OpenAIRE Connect Research Gateways";
-    public showLoading = true;
-    public errorMessage = '';
+    public sending = true;
     public email: Email;
-    public properties: EnvProperties = null;
+    public properties: EnvProperties = properties;
     public pageContents = null;
     public divContents = null;
     public breadcrumbs: Breadcrumb[] = [{name: 'home', route: '/'}, {name: 'Contact us'}];
-
     public contactForm: FormGroup;
     @ViewChild('AlertModal') modal;
     private subscriptions = [];
+    
     ngOnDestroy() {
         this.subscriptions.forEach(subscription => {
             if (subscription instanceof Subscriber) {
@@ -70,7 +70,7 @@ export class ContactComponent implements OnInit {
         this.reset();
         //this.getDivContents();
         this.getPageContents();
-        this.showLoading = false;
+        this.sending = false;
 
     }
 
@@ -90,8 +90,6 @@ export class ContactComponent implements OnInit {
         HelperFunctions.scroll();
         if(event.valid === true) {
             this.sendMail(this.properties.admins);
-        } else {
-            this.errorMessage = 'Please fill in all the required fields!';
         }
     }
 
@@ -104,29 +102,25 @@ export class ContactComponent implements OnInit {
             community: this.fb.control('', Validators.required),
             message: this.fb.control('', Validators.required),
             recaptcha: this.fb.control('', Validators.required),
-        });
-        this.errorMessage = '';
+        })
     }
 
     private sendMail(admins: any) {
-        this.showLoading = true;
+        this.sending = true;
         this.subscriptions.push(this._emailService.contact(this.properties,
             Composer.composeEmailForNewCommunity(this.contactForm.value, admins),
           this.contactForm.value.recaptcha).subscribe(
             res => {
-                this.showLoading = false;
                 if (res) {
+                    this.sending = false;
                     this.reset();
                     this.modalOpen();
                 } else {
-                    this.errorMessage = 'Email sent failed! Please try again.';
-                    this.contactForm.get('recaptcha').setValue('');
+                    this.handleError('Email <b>sent failed!</b> Please try again.');
                 }
             },
             error => {
                 this.handleError('Email sent failed! Please try again.', error);
-                this.showLoading = false;
-                this.contactForm.get('recaptcha').setValue('');
             }
         ));
     }
@@ -141,10 +135,13 @@ export class ContactComponent implements OnInit {
         this.modal.open();
     }
 
-    handleError(message: string, error) {
-        this.errorMessage = message;
-        console.log('Server responded: ' + error);
-        this.showLoading = false;
+    handleError(message: string, error = null) {
+        if(error) {
+            console.error(error);
+        }
+        NotificationHandler.rise(message, 'danger');
+        this.sending = false;
+        this.contactForm.get('recaptcha').setValue('');
     }
 
     public goToHome() {

src/app/openaireLibrary

@@ -1 +1 @@
-Subproject commit 5a69cb210178c77ef078eb3d5e35e527570e722e
+Subproject commit ada419f8e82836c19633544aeddcc7ca31a5699b

src/assets/openaire-theme

@@ -1 +1 @@
-Subproject commit eb0b04cb96b9ab92387d61cdafae21256a6da762
+Subproject commit 0a34bf8f62ef7544060acc4e8333ce13ea929d91