Change Cron editor location to bot settings page

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

@@ -1,5 +1,5 @@
-<mat-grid-list cols="2">
+<mat-grid-list cols="2" rowHeight="45%">
-  <mat-grid-tile>
+  <mat-grid-tile colspan="1" rowspan="1">
     <mat-card class="card">
       <mat-card-title class="card-title">Keywords</mat-card-title>
       <mat-card-content>
@@ -31,7 +31,32 @@
       </mat-card-content>
     </mat-card>
   </mat-grid-tile>
-  <mat-grid-tile>
+  <mat-grid-tile colspan="1" rowspan="2">
+    <mat-card class="card placeholderRHS">
+      <mat-card-title class="card-title">
+        <span>Add automatic updates</span>
+      </mat-card-title>
+      <mat-card-content class="cron-content">
+        <form
+          name="form"
+          (ngSubmit)="f.form.valid && setCronString()"
+          #f="ngForm"
+          novalidate
+          class="backgorund form"
+        >
+          <cron-editor
+            class="cron-editor"
+            [formControl]="cronForm"
+            [options]="cronOptions"
+          ></cron-editor>
+          <div class="form-group footer-buttons">
+            <button class="btn btn-primary btn-block">Add</button>
+          </div>
+        </form>
+      </mat-card-content>
+    </mat-card>
+  </mat-grid-tile>
+  <mat-grid-tile colspan="1" rowspan="1">
     <mat-card class="card">
       <mat-card-title class="card-title">Shares</mat-card-title>
       <mat-card-content>

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

@@ -24,3 +24,20 @@ mat-grid {
 .example-chip-list {
   width: 100%;
 }
+
+.placeholder {
+  height: 95%;
+}
+
+.placeholderRHS {
+  height: 90%;
+}
+
+.cron-content {
+  height: 70%;
+  overflow: auto;
+}
+
+mat-card {
+  overflow: scroll;
+}

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

@@ -1,8 +1,13 @@
 import { Component, OnInit } from '@angular/core';
 import { C, COMMA, ENTER, F } from '@angular/cdk/keycodes';
 import { MatChipInputEvent } from '@angular/material/chips';
+
+import { CronOptions } from 'ngx-cron-editor';
+
 import { BotService } from 'src/app/Services/bot.service';
 import { HelperService } from 'src/app/Helpers/helper.service';
+import { ProfileService } from 'src/app/Services/profile.service';
+import { FormControl } from '@angular/forms';
 
 export interface Fruit {
   name: string;
@@ -25,7 +30,11 @@ export class BotSettingsComponent implements OnInit {
   keywords: Keyword[] = [];
   shares: Share[] = [];
 
-  constructor(private botService: BotService, private helper: HelperService) {}
+  constructor(
+    private botService: BotService,
+    private helper: HelperService,
+    private profileService: ProfileService
+  ) {}
 
   ngOnInit(): void {
     this.shares = this.helper.formatShareData();
@@ -99,4 +108,32 @@ export class BotSettingsComponent implements OnInit {
     this.shares = [];
     this.shares = this.helper.formatShareData();
   }
+
+  setCronString() {
+    this.profileService
+      .addCronString(this.cronForm.value)
+      .subscribe((result) => {
+        console.log(result);
+      });
+  }
+
+  cronForm = new FormControl('0 0 1/1 * *');
+  public cronOptions: CronOptions = {
+    defaultTime: '00:00:00',
+
+    hideMinutesTab: true,
+    hideHourlyTab: true,
+    hideDailyTab: false,
+    hideWeeklyTab: true,
+    hideMonthlyTab: true,
+    hideYearlyTab: true,
+    hideAdvancedTab: true,
+    hideSpecificWeekDayTab: true,
+    hideSpecificMonthWeekTab: true,
+
+    use24HourTime: true,
+    hideSeconds: true,
+
+    cronFlavor: 'quartz', //standard or quartz
+  };
 }

frontend/src/app/Views/profile/profile.component.html

@@ -95,8 +95,8 @@
       </mat-card-content>
     </mat-card>
   </mat-grid-tile>
-  <mat-grid-tile colspan="1" rowspan="1">
+  <mat-grid-tile colspan="1" rowspan="2">
-    <mat-card class="card placeholderRHS">
+    <mat-card class="card placeholder">
       <mat-card-title class="card-title">
         <span>Connect Telegram Account</span>
       </mat-card-title>
@@ -137,29 +137,4 @@
       </mat-card-content>
     </mat-card>
   </mat-grid-tile>
-  <mat-grid-tile colspan="1" rowspan="1">
-    <mat-card class="card placeholderRHS">
-      <mat-card-title class="card-title">
-        <span>Add automatic updates</span>
-      </mat-card-title>
-      <mat-card-content class="cron-content">
-        <form
-          name="form"
-          (ngSubmit)="f.form.valid && setCronString()"
-          #f="ngForm"
-          novalidate
-          class="backgorund form"
-        >
-          <cron-editor
-            class="cron-editor"
-            [formControl]="cronForm"
-            [options]="cronOptions"
-          ></cron-editor>
-          <div class="form-group footer-buttons">
-            <button class="btn btn-primary btn-block">Add</button>
-          </div>
-        </form>
-      </mat-card-content>
-    </mat-card>
-  </mat-grid-tile>
 </mat-grid-list>

frontend/src/app/Views/profile/profile.component.ts

@@ -1,7 +1,6 @@
 import { Component, OnInit } from '@angular/core';
-import { FormControl, PatternValidator, Validators } from '@angular/forms';
+import { FormControl, Validators } from '@angular/forms';
 import { MatDialog } from '@angular/material/dialog';
-import { CronOptions } from 'ngx-cron-editor';
 import { ProfileService } from 'src/app/Services/profile.service';
 import { ConfirmationDialogComponent } from './confirmation-dialog/confirmation-dialog.component';
 import { HelpDialogComponent } from './help-dialog/help-dialog.component';
@@ -32,26 +31,6 @@ export class ProfileComponent implements OnInit {
     public dialog: MatDialog
   ) {}
 
-  cronForm = new FormControl('0 0 1/1 * *');
-  public cronOptions: CronOptions = {
-    defaultTime: '00:00:00',
-
-    hideMinutesTab: true,
-    hideHourlyTab: true,
-    hideDailyTab: false,
-    hideWeeklyTab: true,
-    hideMonthlyTab: true,
-    hideYearlyTab: true,
-    hideAdvancedTab: true,
-    hideSpecificWeekDayTab: true,
-    hideSpecificMonthWeekTab: true,
-
-    use24HourTime: true,
-    hideSeconds: true,
-
-    cronFlavor: 'quartz', //standard or quartz
-  };
-
   ngOnInit(): void {
     this.profileService.getUserData().subscribe((result) => {
       console.log(result);
@@ -98,14 +77,6 @@ export class ProfileComponent implements OnInit {
     });
   }
 
-  setCronString() {
-    this.profileService
-      .addCronString(this.cronForm.value)
-      .subscribe((result) => {
-        console.log(result);
-      });
-  }
-
   openHelp() {
     const dialogRef = this.dialog.open(HelpDialogComponent, {
       width: '50vw',