diff --git a/src/Ombi/ClientApp/src/app/media-details/components/movie/movie-details.component.html b/src/Ombi/ClientApp/src/app/media-details/components/movie/movie-details.component.html
index 708709ff1..ea6ccbe18 100644
--- a/src/Ombi/ClientApp/src/app/media-details/components/movie/movie-details.component.html
+++ b/src/Ombi/ClientApp/src/app/media-details/components/movie/movie-details.component.html
@@ -78,44 +78,46 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
{{ 'Requests.MarkUnavailable4K' | translate }}
diff --git a/src/Ombi/ClientApp/src/app/media-details/components/movie/movie-details.component.ts b/src/Ombi/ClientApp/src/app/media-details/components/movie/movie-details.component.ts
index 139e7be76..6f67230f8 100644
--- a/src/Ombi/ClientApp/src/app/media-details/components/movie/movie-details.component.ts
+++ b/src/Ombi/ClientApp/src/app/media-details/components/movie/movie-details.component.ts
@@ -1,4 +1,4 @@
-import { AfterViewInit, Component, ViewChild, ViewEncapsulation } from "@angular/core";
+import { AfterViewInit, Component, OnInit, ViewChild, ViewEncapsulation } from "@angular/core";
import { ImageService, SearchV2Service, RequestService, MessageService, RadarrService, SettingsStateService } from "../../../services";
import { ActivatedRoute } from "@angular/router";
import { DomSanitizer } from "@angular/platform-browser";
@@ -29,6 +29,7 @@ export class MovieDetailsComponent {
public advancedOptions: IAdvancedData;
public showAdvanced: boolean; // Set on the UI
public issuesEnabled: boolean;
+ public roleName4k = "Request4KMovie";
public requestType = RequestType.movie;
diff --git a/src/Ombi/ClientApp/src/app/shared/role-directive/role-directive.ts b/src/Ombi/ClientApp/src/app/shared/role-directive/role-directive.ts
new file mode 100644
index 000000000..d897072f2
--- /dev/null
+++ b/src/Ombi/ClientApp/src/app/shared/role-directive/role-directive.ts
@@ -0,0 +1,36 @@
+import { Directive, Input, OnInit, TemplateRef, ViewContainerRef } from "@angular/core";
+import { AuthService } from "../../auth/auth.service";
+
+@Directive({
+ selector: '[role]',
+})
+export class RoleDirective implements OnInit {
+ private roleName: string;
+
+ private isHidden = true;
+
+ @Input() public set role(val: string) {
+ if (val) {
+ this.roleName = val;
+ this.updateView();
+ }
+ }
+
+ public constructor(private templateRef: TemplateRef, private viewContainer: ViewContainerRef, private auth: AuthService) {}
+
+ public ngOnInit(): void {
+ this.updateView();
+ }
+
+ private updateView(): void {
+ if (this.auth.hasRole(this.roleName)) {
+ if (this.isHidden) {
+ this.viewContainer.createEmbeddedView(this.templateRef);
+ this.isHidden = false;
+ }
+ } else {
+ this.viewContainer.clear();
+ this.isHidden = true;
+ }
+ }
+}
diff --git a/src/Ombi/ClientApp/src/app/shared/role-directive/role.module.ts b/src/Ombi/ClientApp/src/app/shared/role-directive/role.module.ts
new file mode 100644
index 000000000..15cea8923
--- /dev/null
+++ b/src/Ombi/ClientApp/src/app/shared/role-directive/role.module.ts
@@ -0,0 +1,8 @@
+import { NgModule } from '@angular/core';
+import { RoleDirective } from './role-directive';
+
+@NgModule({
+ declarations: [RoleDirective],
+ exports: [RoleDirective],
+})
+export class RoleModule {}
diff --git a/src/Ombi/ClientApp/src/app/shared/shared.module.ts b/src/Ombi/ClientApp/src/app/shared/shared.module.ts
index 01d70f1c6..f14eb43f2 100644
--- a/src/Ombi/ClientApp/src/app/shared/shared.module.ts
+++ b/src/Ombi/ClientApp/src/app/shared/shared.module.ts
@@ -43,6 +43,7 @@ import { TheMovieDbService } from "../services";
import { TranslateModule } from "@ngx-translate/core";
import { TruncateModule } from "@yellowspot/ng-truncate";
import { WatchProvidersSelectComponent } from "./components/watch-providers-select/watch-providers-select.component";
+import { RoleModule } from "./role-directive/role.module";
@NgModule({
declarations: [
@@ -56,6 +57,7 @@ import { WatchProvidersSelectComponent } from "./components/watch-providers-sele
WatchProvidersSelectComponent,
],
imports: [
+ RoleModule,
SidebarModule,
ReactiveFormsModule,
FormsModule,
@@ -91,6 +93,7 @@ import { WatchProvidersSelectComponent } from "./components/watch-providers-sele
PipeModule,
],
exports: [
+ RoleModule,
TranslateModule,
CommonModule,
FormsModule,