Started on the Discord API settings page

src/Ombi/ClientApp/app/settings/notifications/discord.component.html

@@ -0,0 +1,99 @@
+
+<settings-menu></settings-menu>
+<div *ngIf="emailForm">
+    <fieldset>
+        <legend>Email Notifications</legend>
+        <div class="col-md-6">
+            <form novalidate [formGroup]="emailForm" (ngSubmit)="onSubmit(emailForm)">
+
+                <div class="form-group">
+                    <div class="checkbox">
+                        <input type="checkbox" id="enable" formControlName="enabled">
+                        <label for="enable">Enabled</label>
+                    </div>
+                </div>
+
+                <div class="form-group">
+                    <div class="checkbox">
+                        <input type="checkbox" id="Authentication" formControlName="authentication"><label for="Authentication">Enable SMTP Authentication</label>
+                    </div>
+                </div>
+                <div *ngIf="emailForm.invalid && emailForm.dirty" class="alert alert-danger">
+                    <div *ngIf="emailForm.get('host').hasError('required')">Host is required</div>
+                    <div *ngIf="emailForm.get('port').hasError('required')">The Port is required</div>
+                    <div *ngIf="emailForm.get('sender').hasError('required')">The Email Sender is required</div>
+                    <div *ngIf="emailForm.get('sender').hasError('email')">The Email Sender needs to be a valid email address</div>
+                    <div *ngIf="emailForm.get('adminEmail').hasError('required')">The Email Sender is required</div>
+                    <div *ngIf="emailForm.get('adminEmail').hasError('email')">The Admin Email needs to be a valid email address</div>
+                    <div *ngIf="emailForm.get('username').hasError('required')">The Username is required</div>
+                    <div *ngIf="emailForm.get('password').hasError('required')">The Password is required</div>
+                </div>
+
+                <div class="form-group">
+                    <label for="host" class="control-label">SMTP Host</label>
+                    <div>
+                        <input type="text" class="form-control form-control-custom " id="host" name="host" placeholder="localhost" formControlName="host">
+                    </div>
+                </div>
+
+                <div class="form-group">
+                    <label for="portNumber" class="control-label">SMTP Port</label>
+                    <div>
+                        <input type="text" class="form-control form-control-custom " id="portNumber" name="Port" placeholder="Port Number" formControlName="port">
+                    </div>
+                </div>
+
+                <div class="form-group">
+                    <label for="sender" class="control-label">Email Sender</label>
+                    <div>
+                        <input type="text" class="form-control form-control-custom " id="sender" name="sender" formControlName="sender" tooltipPosition="top" pTooltip="The email address that the emails will be sent from">
+                    </div>
+                </div>
+
+                <div class="form-group">
+                    <label for="adminEmail" class="control-label">Admin Email</label>
+                    <div>
+                        <input type="text" class="form-control form-control-custom " id="adminEmail" name="adminEmail" formControlName="adminEmail" tooltipPosition="top" pTooltip="The administrator email will be used to send emails for admin only notifications (e.g. New Requests that require approvals)">
+                    </div>
+                </div>
+
+
+                <div class="form-group" *ngIf="emailForm.controls['username'].validator">
+                    <label for="username" class="control-label">Username</label>
+                    <div>
+                        <input type="text" class="form-control form-control-custom " id="username" name="username" formControlName="username" pTooltip="The username if authentication is enabled" tooltipPosition="top">
+                    </div>
+                </div>
+
+                <div class="form-group" *ngIf="emailForm.get('password').validator">
+                    <label for="password" class="control-label">Password</label>
+                    <div>
+                        <input type="password" class="form-control form-control-custom " id="password" name="password" formControlName="password" pTooltip="The password if authentication is enabled" tooltipPosition="top">
+                    </div>
+                </div>
+
+                <div class="form-group">
+                    <div>
+                        <button id="testPlex" type="submit" (click)="test()" class="btn btn-primary-outline">
+                            Test Connectivity
+                            <div id="spinner"></div>
+                        </button>
+                    </div>
+                </div>
+
+
+
+                <div class="form-group">
+                    <div>
+                        <button [disabled]="emailForm.invalid" type="submit" id="save" class="btn btn-primary-outline">Submit</button>
+                    </div>
+                </div>
+            </form>
+        </div>
+
+
+        <div class="col-md-6">
+            <notification-templates [templates]="templates"></notification-templates>
+        </div>
+    </fieldset>
+</div>

src/Ombi/ClientApp/app/settings/notifications/discord.component.ts

@@ -0,0 +1,87 @@
+import { Component, OnInit } from '@angular/core';
+import { FormGroup, Validators, FormBuilder } from '@angular/forms';
+
+import { INotificationTemplates, IEmailNotificationSettings, NotificationType } from '../../interfaces/INotifcationSettings';
+import { SettingsService } from '../../services/settings.service';
+import { NotificationService } from "../../services/notification.service";
+import { ValidationService } from "../../services/helpers/validation.service";
+
+@Component({
+    templateUrl: './discord.component.html',
+})
+export class DiscordComponent implements OnInit {
+    constructor(private settingsService: SettingsService,
+        private notificationService: NotificationService,
+        private fb: FormBuilder,
+        private validationService: ValidationService) { }
+
+    NotificationType = NotificationType;
+    templates: INotificationTemplates[];
+
+    emailForm: FormGroup;
+
+    ngOnInit(): void {
+        this.settingsService.getEmailNotificationSettings().subscribe(x => {
+            this.templates = x.notificationTemplates;
+
+            this.emailForm = this.fb.group({
+                enabled: [x.enabled],
+                authentication: [x.authentication],
+                host: [x.host, [Validators.required]],
+                password: [x.password],
+                port: [x.port, [Validators.required]],
+                sender: [x.sender, [Validators.required, Validators.email]],
+                username: [x.username],
+                adminEmail: [x.adminEmail, [Validators.required, Validators.email]],
+            });
+
+            if (x.authentication) {
+                this.validationService.enableValidation(this.emailForm, 'username');
+                this.validationService.enableValidation(this.emailForm, 'password');
+            }
+
+            this.subscribeToAuthChanges();
+        });
+    }
+
+    onSubmit(form: FormGroup) {
+        console.log(form.value, form.valid);
+
+        if (form.invalid) {
+            this.notificationService.error("Validation", "Please check your entered values");
+            return
+        }
+
+        var settings = <IEmailNotificationSettings>form.value;
+        settings.notificationTemplates = this.templates;
+
+        this.settingsService.saveEmailNotificationSettings(settings).subscribe(x => {
+            if (x) {
+                this.notificationService.success("Settings Saved", "Successfully saved Email settings");
+            } else {
+                this.notificationService.success("Settings Saved", "There was an error when saving the Email settings");
+            }
+        });
+
+    }
+
+    save() {
+
+    }
+
+    private subscribeToAuthChanges() {
+        const authCtrl = this.emailForm.controls.authentication;
+        const changes$ = authCtrl.valueChanges;
+
+        changes$.subscribe((auth: boolean) => {
+
+            if (auth) {
+                this.validationService.enableValidation(this.emailForm, 'username');
+                this.validationService.enableValidation(this.emailForm, 'password');
+            } else {
+                this.validationService.disableValidation(this.emailForm, 'username');
+                this.validationService.disableValidation(this.emailForm, 'password');
+            }
+        });
+    }
+}

src/Ombi/Ombi.csproj

@@ -31,7 +31,7 @@
   <Target Name="RunWebpack" AfterTargets="ComputeFilesToPublish">
     <ItemGroup>
       <DistFiles Include="wwwroot\dist\**" />
-      <ResolvedFileToPublish Include="@(DistFiles->'%(FullPath)')" Exclude="@(ResolvedFileToPublish)">
+      <ResolvedFileToPublish Include="@(DistFiles-&gt;'%(FullPath)')" Exclude="@(ResolvedFileToPublish)">
         <RelativePath>%(DistFiles.Identity)</RelativePath>
         <CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>
       </ResolvedFileToPublish>