Add bot-settings for keywords and shares

frontend/src/app/Views/bot-settings/bot-settings.component.ts

@@ -1,15 +1,102 @@
 import { Component, OnInit } from '@angular/core';
+import { C, COMMA, ENTER, F } from '@angular/cdk/keycodes';
+import { MatChipInputEvent } from '@angular/material/chips';
+import { BotService } from 'src/app/Services/bot.service';
+import { HelperService } from 'src/app/Helpers/helper.service';
+
+export interface Fruit {
+  name: string;
+}
+
+export interface Share {
+  symbol: string;
+}
+
+export interface Keyword {
+  name: string;
+}
 
 @Component({
   selector: 'app-bot-settings',
   templateUrl: './bot-settings.component.html',
-  styleUrls: ['./bot-settings.component.scss']
+  styleUrls: ['./bot-settings.component.scss'],
 })
 export class BotSettingsComponent implements OnInit {
+  keywords: Keyword[] = [];
+  shares: Share[] = [];
 
-  constructor() { }
+  constructor(private botService: BotService, private helper: HelperService) {}
 
   ngOnInit(): void {
+    this.shares = this.helper.formatShareData();
+    this.helper.formatKeywordsData(this.keywords);
   }
 
+  addOnBlur = true;
+  readonly separatorKeysCodes = [ENTER, COMMA] as const;
+
+  async addKeyword(event: MatChipInputEvent): Promise<void> {
+    const value = (event.value || '').trim();
+
+    // Add keyword to database
+    if (value && !this.keywords.includes({ name: value })) {
+      console.log('Added: ' + value);
+      this.botService.createKeyword(value).subscribe((result) => {
+        console.log(result);
+      });
+    }
+
+    // Clear the input value
+    event.chipInput!.clear();
+
+    if (value) {
+      await this.helper.delay(1000);
+      this.keywords = [];
+      this.keywords = this.helper.formatKeywordsData(this.keywords);
+    }
+  }
+
+  async removeKeyword(keyword: Keyword): Promise<void> {
+    this.botService.deleteKeyword(keyword.name).subscribe((result) => {
+      console.log(result);
+    });
+
+    await this.helper.delay(1000);
+
+    this.keywords = [];
+    this.keywords = this.helper.formatKeywordsData(this.keywords);
+  }
+
+  async addShare(event: MatChipInputEvent): Promise<void> {
+    const value = (event.value || '').trim();
+
+    // Add share to database
+    if (value && !this.shares.includes({ symbol: value })) {
+      console.log('Added: ' + value);
+      this.botService.createShare(value).subscribe((result) => {
+        console.log(result);
+      });
+    }
+
+    // Clear the input value
+    event.chipInput!.clear();
+
+    if (value) {
+      await this.helper.delay(1000);
+
+      this.shares = [];
+      this.shares = this.helper.formatShareData();
+    }
+  }
+
+  async removeShare(share: Share): Promise<void> {
+    this.botService.deleteShare(share.symbol).subscribe((result) => {
+      console.log(result);
+    });
+
+    await this.helper.delay(1000);
+
+    this.shares = [];
+    this.shares = this.helper.formatShareData();
+  }
 }