Moved the admin details cog (for movies) into the new social banner

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

@@ -7,8 +7,26 @@
     <top-banner [background]="movie.background" [available]="movie.available" [title]="movie.title" [releaseDate]="movie.releaseDate" [tagline]="movie.tagline"></top-banner>
     <div class="social-icons-container">
 
-        <social-icons [homepage]="movie.homepage" [theMoviedbId]="movie.id" [hasTrailer]="movie.videos?.results?.length > 0" (openTrailer)="openDialog()" [imdbId]="movie.imdbId" [twitter]="movie.externalIds.twitterId" [facebook]="movie.externalIds.facebookId"
+        <social-icons
-            [instagram]="movie.externalIds.instagramId" [available]="movie.available" [plexUrl]="movie.plexUrl" [embyUrl]="movie.embyUrl" [jellyfinUrl]="movie.jellyfinUrl"></social-icons>
+            [homepage]="movie.homepage"
+            [theMoviedbId]="movie.id"
+            [hasTrailer]="movie.videos?.results?.length > 0"
+            [imdbId]="movie.imdbId"
+            [twitter]="movie.externalIds.twitterId"
+            [facebook]="movie.externalIds.facebookId"
+            [instagram]="movie.externalIds.instagramId"
+            [available]="movie.available"
+            [plexUrl]="movie.plexUrl"
+            [embyUrl]="movie.embyUrl"
+            [jellyfinUrl]="movie.jellyfinUrl"
+            [isAdmin]="isAdmin"
+            [canRequestOnBehalf]="!hasRequest && !movie.available"
+            [canShowAdvanced]="showAdvanced && movieRequest"
+            (openTrailer)="openDialog()"
+            (onRequestBehalf)="openRequestOnBehalf()"
+            (onAdvancedOptions)="openAdvancedOptions()"
+            >
+        </social-icons>
 
     </div>
     <section id="info-wrapper">
@@ -19,7 +37,7 @@
                 <media-poster [posterPath]="'https://image.tmdb.org/t/p/w300/' + movie.posterPath"></media-poster>
 
                 <!--Next to poster-->
-                <div class="col-12 col-lg-8 col-xl-8 media-row">
+                <div class="col-12 col-lg-9 col-xl-9 media-row">
                     <span *ngIf="movie.available">
                         <a *ngIf="movie.plexUrl" href="{{movie.plexUrl}}" mat-raised-button  target="_blank" class="btn-spacing viewon-btn plex">
                             {{'Search.ViewOnPlex' | translate}} 
@@ -77,23 +95,6 @@
                             <i class="fa fa-list"></i> {{'MediaDetails.ViewCollection' | translate}}
                         </button>
                 </div>
-
-                <!-- Setting/Configuration admin area -->
-                <div class="col-12 col-lg-1 col-xl-1 media-row content-end">
-                    <button *ngIf="isAdmin" mat-icon-button [matMenuTriggerFor]="menu">
-                        <mat-icon>settings</mat-icon>
-                      </button>
-                      <mat-menu #menu="matMenu">
-                        <button mat-menu-item (click)="openRequestOnBehalf()" [disabled]="hasRequest || movie.available">
-                          <mat-icon>supervised_user_circle</mat-icon>
-                          <span>{{'MediaDetails.RequestOnBehalf' | translate}}</span>
-                        </button>
-                        <button mat-menu-item [disabled]="!showAdvanced || !movieRequest" (click)="openAdvancedOptions()">
-                          <mat-icon>movie_filter</mat-icon>
-                          <span>{{'MediaDetails.RadarrConfiguration' | translate}}</span>
-                        </button>
-                      </mat-menu>
-                </div>
             </div>
 
             <div class="row">

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

@@ -24,4 +24,18 @@
     </a> <a *ngIf="instagram" class="media-icons" [href]="doNotAppend ? instagram : 'https://instagram.com/' + instagram" target="_blank">
         <i matTooltip="Instagram" class="fa fa-instagram fa-2x grow-social"></i>
     </a>
+    <!-- Setting/Configuration admin area -->
+    <button *ngIf="isAdmin" mat-icon-button [matMenuTriggerFor]="menu">
+        <mat-icon>settings</mat-icon>
+    </button>
+    <mat-menu #menu="matMenu">
+        <button mat-menu-item (click)="openRequestOnBehalf()" [disabled]="!canRequestOnBehalf">
+            <mat-icon>supervised_user_circle</mat-icon>
+            <span>{{'MediaDetails.RequestOnBehalf' | translate}}</span>
+        </button>
+        <button mat-menu-item [disabled]="!canShowAdvanced" (click)="openAdvancedOptions()">
+            <mat-icon>movie_filter</mat-icon>
+            <span>{{'MediaDetails.RadarrConfiguration' | translate}}</span>
+        </button>
+    </mat-menu>
 </div>

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

@@ -1,12 +1,10 @@
-import { Component, Inject, Input, Output, EventEmitter } from "@angular/core";
+import { Component, Input, Output, EventEmitter } from "@angular/core";
-
 @Component({
     selector: "social-icons",
     templateUrl: "./social-icons.component.html",
     styleUrls: ["./social-icons.component.scss"]
 })
 export class SocialIconsComponent {
-    
     @Input() homepage: string;
     @Input() theMoviedbId: number;
     @Input() hasTrailer: boolean;
@@ -21,10 +19,24 @@ export class SocialIconsComponent {
     @Input() jellyfinUrl: string;
     @Input() doNotAppend: boolean;
 
+    @Input() isAdmin: boolean;
+    @Input() canRequestOnBehalf: boolean;
+    @Input() canShowAdvanced: boolean;
+
     @Output() openTrailer: EventEmitter<any> = new EventEmitter();
+    @Output() onRequestBehalf: EventEmitter<any> = new EventEmitter();
+    @Output() onAdvancedOptions: EventEmitter<any> = new EventEmitter();
 
 
     public openDialog() {
         this.openTrailer.emit();
     }
+
+    public openRequestOnBehalf() {
+        this.onRequestBehalf.emit();
+    }
+
+    public openAdvancedOptions() {
+        this.onAdvancedOptions.emit();
+    }
 }

src/Ombi/ClientApp/src/app/media-details/components/shared/top-banner/top-banner.component.ts

@@ -7,7 +7,6 @@ import { DomSanitizer, SafeStyle } from "@angular/platform-browser";
     styleUrls: ["top-banner.component.scss"]
 })
 export class TopBannerComponent {
-    
     @Input() title: string;
     @Input() releaseDate: Date;
     @Input() tagline: string;
@@ -15,7 +14,7 @@ export class TopBannerComponent {
     @Input() background: any;
 
 
-    constructor(private sanitizer:DomSanitizer){}    
+    constructor(private sanitizer:DomSanitizer){ }
 
     public getBackgroundImage(): SafeStyle {
         return this.sanitizer.bypassSecurityTrustStyle(this.background);