[frontend] Add more email functionality (add, start, stop)

kibicara-frontend/src/app/core/model/status.ts

@@ -0,0 +1,5 @@
+export enum BotStatus {
+  INSTANTIATED = 'INSTANTIATED',
+  RUNNING = 'RUNNING',
+  STOPPED = 'STOPPED',
+}

kibicara-frontend/src/app/platforms/email/email-dialog/email-dialog.component.html

@@ -2,8 +2,9 @@
 
 <mat-dialog-content class="mat-typography">
   <form class="input" [formGroup]="form">
+    kibicara-
     <mat-form-field>
-      <mat-label>New inbox address</mat-label>
+      <mat-label>new inbox address</mat-label>
       <input matInput formControlName="name" />
       <mat-error
         *ngIf="form.controls.name.errors && form.controls.name.errors.required"

kibicara-frontend/src/app/platforms/email/email-dialog/email-dialog.component.ts

@@ -1,5 +1,5 @@
-import { Component, OnInit, Input } from '@angular/core';
+import { Component, OnInit, Input, Inject } from '@angular/core';
-import { MatDialogRef } from '@angular/material/dialog';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import { Validators, FormBuilder } from '@angular/forms';
 import { EmailService } from 'src/app/core/api';
 import { first } from 'rxjs/operators';
@@ -11,14 +11,14 @@ import { MatSnackBar } from '@angular/material/snack-bar';
   styleUrls: ['./email-dialog.component.scss'],
 })
 export class EmailDialogComponent implements OnInit {
-  @Input() hoodId;
   form;
 
   constructor(
     public dialogRef: MatDialogRef<EmailDialogComponent>,
     private formBuilder: FormBuilder,
     private emailService: EmailService,
-    private snackBar: MatSnackBar
+    private snackBar: MatSnackBar,
+    @Inject(MAT_DIALOG_DATA) public data
   ) {}
 
   ngOnInit(): void {
@@ -36,12 +36,12 @@ export class EmailDialogComponent implements OnInit {
       return;
     }
     this.emailService
-      .createEmail(this.hoodId, {
+      .createEmail(this.data.hoodId, {
-        name: this.form.controls.name.value,
+        name: 'kibicara-' + this.form.controls.name.value,
       })
       .pipe(first())
       .subscribe(
-        () => {
+        (data) => {
           this.dialogRef.close();
         },
         (error) => {

kibicara-frontend/src/app/platforms/email/email-info-dialog/email-info-dialog.component.html

@@ -1 +1,42 @@
-<p>email-info-dialog works!</p>
+<p>
+  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras maximus arcu at
+  magna euismod sollicitudin. Vestibulum ut auctor libero. Etiam volutpat, nisl
+  sed efficitur hendrerit, nunc risus hendrerit nulla, sollicitudin malesuada
+  neque sem sed tortor. Vestibulum laoreet elementum nibh ultrices ullamcorper.
+  Sed porta gravida lectus, suscipit dictum ligula pharetra posuere. Vivamus
+  pellentesque ex eget lacus consectetur, at pulvinar est pellentesque.
+  Phasellus a elit tempor, tristique tortor auctor, maximus eros. Duis magna
+  sapien, accumsan nec massa nec, porta auctor leo. Nam nibh nisl, hendrerit nec
+  convallis in, porttitor nec sapien. Morbi in lacus convallis, elementum turpis
+  in, venenatis mi. Vestibulum bibendum rhoncus pulvinar. Sed hendrerit ipsum
+  eget varius venenatis. Maecenas consectetur felis libero, fringilla fringilla
+  justo pellentesque non. Quisque congue dictum arcu ut fermentum. Aliquam
+  egestas, lectus at mollis pulvinar, diam libero sagittis eros, a lobortis
+  neque ligula eget odio. Praesent a tortor consequat, viverra odio id, feugiat
+  sem. Mauris orci velit, molestie sit amet urna laoreet, aliquet consectetur
+  risus. Cras tristique odio nec placerat viverra. Suspendisse id pretium risus,
+  sit amet consectetur turpis. Nunc mattis, felis a iaculis varius, est nulla
+  aliquam massa, aliquet dictum ipsum est nec erat. Integer tristique tellus
+  felis, ut porttitor nisi blandit nec. Pellentesque habitant morbi tristique
+  senectus et netus et malesuada fames ac turpis egestas. Integer sagittis justo
+  ut elit gravida, vitae dignissim urna vehicula. Ut in ante non neque dignissim
+  scelerisque non id nisi. Sed sit amet posuere felis. Integer eget eros auctor,
+  ultrices arcu vel, feugiat erat. Curabitur rhoncus porta erat ut ullamcorper.
+  Duis in dictum tortor. Nam rutrum volutpat libero id interdum. Vestibulum vel
+  ante eget risus elementum iaculis eget ut mauris. Vestibulum ultrices nunc
+  quis leo venenatis, id tristique purus tempus. Fusce nec tellus dui. Nulla
+  bibendum nisi ut posuere pellentesque. Vivamus malesuada mollis dui a posuere.
+  Curabitur et lacus at augue posuere facilisis. Ut posuere orci mauris, at
+  hendrerit elit dignissim vel. Quisque vitae ipsum sed sem mattis hendrerit.
+  Pellentesque consectetur convallis consectetur. Praesent sit amet augue in dui
+  congue efficitur ac gravida metus. Sed nibh urna, facilisis at urna vitae,
+  tristique vestibulum velit. Maecenas et aliquet purus, non rutrum eros. Donec
+  maximus orci vel tortor maximus, finibus porttitor mauris convallis. Maecenas
+  eget quam vel nulla dapibus hendrerit. Vivamus malesuada neque ut elit
+  commodo, non viverra magna facilisis. Maecenas finibus ante non dui posuere,
+  sed varius leo elementum. Nullam eget vestibulum mauris. Maecenas in ipsum
+  lectus. Sed tempus at dolor sed posuere. Proin eget nulla dignissim, finibus
+  arcu eu, fringilla tellus. Nullam bibendum felis sed nulla lobortis sodales.
+  Nunc in elementum felis, quis aliquam velit. Morbi sodales sollicitudin
+  mollis.
+</p>

kibicara-frontend/src/app/platforms/email/email-settings/email-settings.component.html

@@ -4,8 +4,12 @@
       <div class="platform-heading">
         E-Mails
       </div>
-      <button mat-icon-button aria-label="How to use">
+      <button mat-icon-button aria-label="How to use" (click)="onInfoClick()">
-        <mat-icon matTooltip="How to use" class="info-button">info</mat-icon>
+        <mat-icon
+          matTooltip="How to add an email inbox to your hood"
+          class="info-button"
+          >info</mat-icon
+        >
       </button>
     </mat-card-title>
   </mat-card-header>
@@ -21,7 +25,12 @@
       <ng-template #startButton>
         <mat-list-item>
           <div class="toggle-container">
-            <mat-slide-toggle class="toggle"></mat-slide-toggle>
+            <mat-slide-toggle
+              name="enableEmails"
+              class="toggle"
+              (change)="onToggle()"
+              [(ngModel)]="start"
+            ></mat-slide-toggle>
           </div>
           <mat-divider></mat-divider>
         </mat-list-item>

kibicara-frontend/src/app/platforms/email/email-settings/email-settings.component.ts

@@ -1,9 +1,13 @@
 import { Component, OnInit, Input } from '@angular/core';
 import { Observable } from 'rxjs/internal/Observable';
-import { EmailService } from 'src/app/core/api';
+import { EmailService, HoodsService } from 'src/app/core/api';
 import { MatDialog } from '@angular/material/dialog';
 import { Router } from '@angular/router';
 import { EmailDialogComponent } from '../email-dialog/email-dialog.component';
+import { EmailInfoDialogComponent } from '../email-info-dialog/email-info-dialog.component';
+import { FormGroup, FormBuilder, Validators } from '@angular/forms';
+import { BotStatus } from '../../../core/model/status';
+import { MatSnackBar } from '@angular/material/snack-bar';
 
 @Component({
   selector: 'app-email-settings',
@@ -13,11 +17,12 @@ import { EmailDialogComponent } from '../email-dialog/email-dialog.component';
 export class EmailSettingsComponent implements OnInit {
   @Input() hoodId;
   emails$: Observable<Array<any>>;
+  start = false;
 
   constructor(
     private emailService: EmailService,
     public dialog: MatDialog,
-    private router: Router
+    private snackBar: MatSnackBar
   ) {}
 
   ngOnInit(): void {
@@ -26,6 +31,11 @@ export class EmailSettingsComponent implements OnInit {
 
   private reload() {
     this.emails$ = this.emailService.getEmails(this.hoodId);
+    this.emailService.statusEmail(this.hoodId).subscribe((status) => {
+      if (status.status === BotStatus.RUNNING.toString()) {
+        this.start = true;
+      }
+    });
   }
 
   onDelete(emailId) {
@@ -35,12 +45,42 @@ export class EmailSettingsComponent implements OnInit {
   }
 
   onCreate() {
-    const dialogRef = this.dialog.open(EmailDialogComponent);
+    const dialogRef = this.dialog.open(EmailDialogComponent, {
+      data: { hoodId: this.hoodId },
+    });
 
-    dialogRef.afterClosed().subscribe((hood) => {
+    dialogRef.afterClosed().subscribe(() => {
-      // if (hood && hood.id) {
+      this.reload();
-      //   this.router.navigate(['/dashboard/hoods', hood.id]);
-      // }
     });
   }
+
+  onInfoClick() {
+    this.dialog.open(EmailInfoDialogComponent);
+  }
+
+  onToggle() {
+    if (this.start) {
+      this.emailService.startEmail(this.hoodId).subscribe(
+        () => {},
+        (error) => {
+          this.snackBar.open('Could not start. Check your settings.', 'Close', {
+            duration: 2000,
+          });
+        }
+      );
+    } else {
+      this.emailService.stopEmail(this.hoodId).subscribe(
+        () => {},
+        (error) => {
+          this.snackBar.open('Could not stop. Check your settings.', 'Close', {
+            duration: 2000,
+          });
+        }
+      );
+    }
+    // TODO yeah i know this is bad, implement disabling/enabling
+    setTimeout(() => {
+      this.reload();
+    }, 100);
+  }
 }