Welcome to Edutecs Mail-Service!

Quick Start (Angular Setup)

Step 1: Add ng-recaptcha to your project

yarn add ng-recaptcha

Add this import to your app.modules.ts

import { RECAPTCHA_V3_SITE_KEY, RecaptchaV3Module } from 'ng-recaptcha';

Add 'RecaptchaV3Module' to your app.modules.ts imports

imports: [RecaptchaV3Module]

Copy this provider to your app.modules.ts providers

{ provide: RECAPTCHA_V3_SITE_KEY, useValue: '6Lfb1uwZAAAAADU-2w2q9-2s9NyxWL5cxsRxuS6z' }

Step 2: Activate recaptcha for the project domain (contact an administrator for help)

Use this link: https://www.google.com/recaptcha/admin/ and login with the edutec account. Choose the 'Contact-Form' project, go to settings and add the project domain.

Step 3: Learn how to use the mailService

You will need this mailDto

export interface MailDto {
  to: string;
  reply_to?: string;
  from?: string;
  template_id: string;
  variables: any;
}

Create a contact-form-service and copy this code

private url: string = 'https://mail-service.edutec.lu/mail';

constructor(
  private httpClient: HttpClient,
) {
}

public sendMail(mailDto: MailDto, recaptcha: any): Observable {
  const httpOptions = {
    headers: new HttpHeaders({
      Accept: 'application/json',
      'Content-Type': 'application/json',
      recaptcha
    }),
  };

  return this.httpClient.post(this.url, mailDto, httpOptions);
}

Copy this function to your contact-form-component

public mail(): void {
  const mailDto: MailDto = {
    to: 'daniel.vieira@edutec.lu',
    template_id: 'd-e4b5fa6a98724497a47630081a84c7fb',
    variables: {
      ...this.contactFormGroup.value
    }
  };

  if (this.contactFormGroup.valid) {
    this.recaptchaV3Service.execute('sendEmail')
      .pipe(switchMap((response: string) => this.contactFormService
          .sendMail(mailDto, response)
      ))
      .pipe(take(1))
      .subscribe(
        () => {
          this.contactFormGroup.reset();
          alert('A mail has been sent!');
        }, () => alert('An error has occurred! Please try again.')
      );
  } else {
    alert('Please check your inputs. Your mail might be invalid.');
  }
}

Optional: Add attachments to your Emails

Replace your MailDto from Step3 with this MailDto below and add the MailAttachmentsDto to your project

export interface MailDto {
  to: string;
  reply_to?: string;
  from?: string;
  template_id: string;
  variables: any;
  attachments?: MailAttachmentsDto[];
}
export interface MailAttachmentsDto {
  content: string;
  filename: string;
  type: string;
  disposition: string;
}