Added issue creation to Movies

src/Ombi/ClientApp/src/app/media-details/components/index.ts

@@ -13,6 +13,7 @@ import { MovieAdminPanelComponent } from "./movie/panels/movie-admin-panel/movie
 import { MovieAdvancedOptionsComponent } from "./movie/panels/movie-advanced-options/movie-advanced-options.component";
 import { SearchService, RequestService, RadarrService } from "../../services";
 import { RequestServiceV2 } from "../../services/requestV2.service";
+import { NewIssueComponent } from "./shared/new-issue/new-issue.component";
 
 export const components: any[] = [
     MovieDetailsComponent,
@@ -27,13 +28,15 @@ export const components: any[] = [
     DenyDialogComponent,
     TvRequestsPanelComponent,
     MovieAdminPanelComponent,
-    MovieAdvancedOptionsComponent
+    MovieAdvancedOptionsComponent,
+    NewIssueComponent,
 ];
 
 export const entryComponents: any[] = [
     YoutubeTrailerComponent,
     DenyDialogComponent,
     MovieAdvancedOptionsComponent,
+    NewIssueComponent,
 ];
 
 export const providers: any[] = [

src/Ombi/ClientApp/src/app/media-details/components/movie/movie-details.component.html

@@ -33,8 +33,8 @@
             <span *ngIf="movie.requested || movie.approved; then requestedBtn else notRequestedBtn"></span>
 
             <ng-template #requestedBtn>
-              <button mat-raised-button *ngIf="!hasRequest || hasRequest && movieRequest && !movieRequest.denied" class="btn-spacing"
+              <button mat-raised-button *ngIf="!hasRequest || hasRequest && movieRequest && !movieRequest.denied"
-                color="warn" [disabled]><i class="fa fa-check"></i>
+                class="btn-spacing" color="warn" [disabled]><i class="fa fa-check"></i>
                 {{ 'Common.Requested' | translate }}</button>
             </ng-template>
             <ng-template #notRequestedBtn>
@@ -54,19 +54,21 @@
               <i class="fa fa-plus"></i> {{ 'Requests.MarkAvailable' | translate }}
             </button>
 
-            <button *ngIf="hasRequest &&  movieRequest && !movieRequest.denied" mat-raised-button class="btn-spacing" color="warn"
+            <button *ngIf="movieRequest && !movieRequest.denied" mat-raised-button class="btn-spacing" color="warn"
               (click)="deny()">
               <i class="fa fa-times"></i> {{
                     'Requests.Deny' | translate }}</button>
-
+            <button *ngIf="movieRequest && movieRequest.denied" [matTooltip]="movieRequest.deniedReason"
-
+              mat-raised-button class="btn-spacing" color="warn">
-
+              <i class="fa fa-times"></i> {{
+                            'MediaDetails.Denied' | translate }}</button>
           </span>
           
-          <button *ngIf="hasRequest &&  movieRequest && movieRequest.denied" [matTooltip]="movieRequest.deniedReason" mat-raised-button
+          <button *ngIf="(hasRequest && movieRequest) || movie.available" mat-raised-button class="btn-spacing"
-            class="btn-spacing" color="warn">
+            color="danger" (click)="issue()">
-            <i class="fa fa-times"></i> {{
+            <i class="fa fa-exclamation"></i> {{
-                    'MediaDetails.Denied' | translate }}</button>
+                'Requests.ReportIssue' | translate }}</button>
+
 
 
 
@@ -82,7 +84,8 @@
 
           <mat-card class="mat-elevation-z8 spacing-below" *ngIf="isAdmin && movieRequest">
             <mat-card-content class="medium-font">
-              <movie-admin-panel [movie]="movieRequest" (advancedOptionsChange)="setAdvancedOptions($event)"></movie-admin-panel>
+              <movie-admin-panel [movie]="movieRequest" (advancedOptionsChange)="setAdvancedOptions($event)">
+              </movie-admin-panel>
             </mat-card-content>
           </mat-card>
 

src/Ombi/ClientApp/src/app/media-details/components/movie/movie-details.component.ts

@@ -8,6 +8,7 @@ import { YoutubeTrailerComponent } from "../shared/youtube-trailer.component";
 import { AuthService } from "../../../auth/auth.service";
 import { IMovieRequests, RequestType, IAdvancedData } from "../../../interfaces";
 import { DenyDialogComponent } from "../shared/deny-dialog/deny-dialog.component";
+import { NewIssueComponent } from "../shared/new-issue/new-issue.component";
 
 @Component({
     templateUrl: "./movie-details.component.html",
@@ -82,6 +83,13 @@ export class MovieDetailsComponent {
           });
     }
 
+    public async issue() {
+        const dialogRef = this.dialog.open(NewIssueComponent, {
+            width: '500px',
+            data: {requestId: this.movieRequest ? this.movieRequest.id : null,  requestType: RequestType.movie, imdbid: this.movie.imdbId}
+          });
+    }
+
     public async approve() {
         const result = await this.requestService.approveMovie({ id: this.movieRequest.id }).toPromise();
         if (result.result) {

src/Ombi/ClientApp/src/app/media-details/components/shared/interfaces/interfaces.ts

@@ -5,3 +5,9 @@ export interface IDenyDialogData {
     requestId: number;
     denied: boolean;
 }
+
+export interface IIssueDialogData {
+    requestType: RequestType;
+    requestId: number;
+    imdbId: string;
+}

src/Ombi/ClientApp/src/app/media-details/components/shared/new-issue/new-issue.component.html

@@ -0,0 +1,29 @@
+<h1 mat-dialog-title>{{ 'Issues.IssueDialog.Title' | translate}}</h1>
+<div mat-dialog-content>
+
+  <div class="col-12">
+    <mat-form-field class="col-12">
+      <mat-label>{{'Issues.IssueDialog.SelectCategory' | translate}}</mat-label>
+      <mat-select [(ngModel)]="issue.issueCategoryId">
+        <mat-option *ngFor="let cat of issueCategories" [value]="cat.id">
+          {{cat.value}}
+        </mat-option>
+      </mat-select>
+    </mat-form-field>
+
+    <mat-form-field class="col-12">
+      <input matInput placeholder="{{ 'Issues.IssueDialog.TitlePlaceholder' | translate}}" [(ngModel)]="issue.subject">
+    </mat-form-field>
+
+    <mat-form-field class="col-12">
+      <textarea matInput placeholder="{{ 'Issues.IssueDialog.DescriptionPlaceholder' | translate}}"
+        [(ngModel)]="issue.description"></textarea>
+    </mat-form-field>
+  </div>
+
+</div>
+<div mat-dialog-actions>
+  <button mat-button (click)="onNoClick()">{{ 'Common.Cancel' | translate}}</button>
+  <button mat-button (click)="createIssue()" [mat-dialog-close]="data"
+    cdkFocusInitial>{{ 'Common.Submit' | translate}}</button>
+</div>

src/Ombi/ClientApp/src/app/media-details/components/shared/new-issue/new-issue.component.ts

@@ -0,0 +1,56 @@
+import { Component, Inject, OnInit } from "@angular/core";
+import { IDenyDialogData, IIssueDialogData } from "../interfaces/interfaces";
+import { MatDialogRef, MAT_DIALOG_DATA } from "@angular/material";
+import { MessageService, IssuesService } from "../../../../services";
+import { IIssues, IIssueCategory, IssueStatus, RequestType } from "../../../../interfaces";
+import { TranslateService } from "@ngx-translate/core";
+
+@Component({
+    selector: "new-issue",
+    templateUrl: "./new-issue.component.html",
+})
+export class NewIssueComponent implements OnInit {
+   
+    public issue: IIssues;
+    public issueCategories: IIssueCategory[];
+
+    constructor(
+        public dialogRef: MatDialogRef<NewIssueComponent>,
+        @Inject(MAT_DIALOG_DATA) public data: IIssueDialogData,
+        private issueService: IssuesService,
+        public messageService: MessageService,
+        private translate: TranslateService) {
+            this.issue = {
+                subject: "",
+                description: "",
+                issueCategory: { value: "", id: 0 },
+                status: IssueStatus.Pending,
+                resolvedDate: undefined,
+                id: undefined,
+                issueCategoryId: 0,
+                comments: [],
+                requestId: data.requestId,
+                requestType: data.requestType,
+                title: "",
+                providerId: data.imdbId,
+                userReported: undefined,
+            };
+        }
+
+        public async ngOnInit(): Promise<void> {
+            this.issueCategories = await this.issueService.getCategories().toPromise();
+        }   
+
+
+        public async createIssue() { 
+            const result = await this.issueService.createIssue(this.issue).toPromise();
+            if(result) {
+                this.messageService.send(this.translate.instant("Issues.IssueDialog.IssueCreated"));
+            }
+        }
+
+        public onNoClick(): void {
+            this.dialogRef.close();
+            delete this.issue;
+          }
+}

src/Ombi/ClientApp/src/app/media-details/components/shared/social-icons/social-icons.component.html

@@ -30,12 +30,12 @@
     </a>
 
     <span class="left-seperator" *ngIf="available">
-        <a *ngIf="plexUrl" class="media-icons" href="{{plexUrl}}" target="_blank">
+        <a *ngIf="plexUrl" class="media-icons plex" href="{{plexUrl}}" target="_blank">
             <i matTooltip=" {{'Search.ViewOnPlex' | translate}}"
                 class="fa fa-play-circle fa-2x grow-social"></i>
         </a>
 
-        <a *ngIf="embyUrl" class="media-icons" href="{{embyUrl}}" target="_blank">
+        <a *ngIf="embyUrl" class="media-icons emby" href="{{embyUrl}}" target="_blank">
             <i matTooltip=" {{'Search.ViewOnEmby' | translate}}"
                 class="fa fa-play-circle fa-2x grow-social"></i>
         </a>

src/Ombi/ClientApp/src/app/media-details/components/shared/social-icons/social-icons.component.scss

@@ -6,3 +6,11 @@
     transform: scale(1.1);
     color: black;
 }
+
+.media-icons.plex {
+    color: #feb801 !important;
+}
+
+.media-icons.emby {
+    color: #52b54a !important;
+}

src/Ombi/wwwroot/translations/en.json

@@ -27,7 +27,9 @@
     "ViewDetails": "View Details",
     "Errors": {
       "Validation": "Please check your entered values"
-    }
+    },
+    "Cancel":"Cancel",
+    "Submit":"Submit"
   },
   "PasswordReset": {
     "EmailAddressPlaceholder": "Email Address",
@@ -168,7 +170,14 @@
     "Subject": "Subject",
     "Comments": "Comments",
     "WriteMessagePlaceholder": "Write your message here...",
-    "ReportedBy": "Reported By"
+    "ReportedBy": "Reported By",
+    "IssueDialog": {
+      "Title":"Report an issue",
+      "DescriptionPlaceholder":"Please describe the issue",
+      "TitlePlaceholder":"Short title of your issue",
+      "SelectCategory": "Select Category",
+      "IssueCreated":"Issue has been created"
+    }
   },
   "Filter": {
     "ClearFilter": "Clear Filter",