github/Ombi
1
0
Fork 0
mirror of https://github.com/Ombi-app/Ombi.git synced 2025-07-31 12:00:06 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: Hide the 4K buttons when the user does not have the 4k permission

Browse source
This commit is contained in:
tidusjar 2022-02-11 20:03:10 +00:00
parent 5e8f06cd24
commit 26bcf1e4e1
5 changed files with 78 additions and 28 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -78,44 +78,46 @@
</span> </span>
<!-- 4k Status --> <!-- 4k Status -->
<button mat-raised-button class="btn-green btn-spacing" id="availableBtn" *ngIf="movie.available4K && !movie.plexUrl && !movie.embyUrl && !movie.jellyfinUrl"> {{ <span *role="roleName4k">
'Common.Available4K' | translate }}</button> <button mat-raised-button class="btn-green btn-spacing" id="availableBtn" *ngIf="movie.available4K && !movie.plexUrl && !movie.embyUrl && !movie.jellyfinUrl"> {{
<span *ngIf="!movie.available4K"> 'Common.Available4K' | translate }}</button>
<span *ngIf="movie.has4KRequest || movie.approved4K; then requestedBtn4K else notRequestedBtn4K"></span> <span *ngIf="!movie.available4K">
<ng-template #requestedBtn4K> <span *ngIf="movie.has4KRequest || movie.approved4K; then requestedBtn4K else notRequestedBtn4K"></span>
<button id="requestedBtn4K" mat-raised-button *ngIf="!hasRequest || hasRequest && movieRequest && !movieRequest.denied4K" class="btn-spacing" color="warn" [disabled]> <ng-template #requestedBtn4K>
<i class="fas fa-check"></i> <button id="requestedBtn4K" mat-raised-button *ngIf="!hasRequest || hasRequest && movieRequest && !movieRequest.denied4K" class="btn-spacing" color="warn" [disabled]>
{{ 'Common.Requested4K' | translate }} <i class="fas fa-check"></i>
</button> {{ 'Common.Requested4K' | translate }}
</ng-template> </button>
<ng-template #notRequestedBtn4K> </ng-template>
<button *ngIf="!movie.has4KRequest" id="requestBtn4k" mat-raised-button class="btn-spacing" color="primary" (click)="request(true)"> <ng-template #notRequestedBtn4K>
<i *ngIf="movie.requestProcessing" class="fas fa-circle-notch fa-spin fa-fw"></i> <button *ngIf="!movie.has4KRequest" id="requestBtn4k" mat-raised-button class="btn-spacing" color="primary" (click)="request(true)">
<i *ngIf="!movie.requestProcessing && !movie.processed" class="fas fa-plus"></i> <i *ngIf="movie.requestProcessing" class="fas fa-circle-notch fa-spin fa-fw"></i>
<i *ngIf="movie.processed && !movie.requestProcessing" class="fas fa-check"></i> <i *ngIf="!movie.requestProcessing && !movie.processed" class="fas fa-plus"></i>
{{'Common.Request4K' | translate }} <i *ngIf="movie.processed && !movie.requestProcessing" class="fas fa-check"></i>
</button> {{'Common.Request4K' | translate }}
</ng-template> </button>
<span *ngIf="!isAdmin && movie.showSubscribe" > </ng-template>
<button *ngIf="!movie.subscribed" (click)="notify()" id="notifyBtn" mat-raised-button class="btn-spacing" > <i class="fas fa-bell"></i> <span *ngIf="!isAdmin && movie.showSubscribe" >
{{ 'Requests.Notify' | translate }}</button> <button *ngIf="!movie.subscribed" (click)="notify()" id="notifyBtn" mat-raised-button class="btn-spacing" > <i class="fas fa-bell"></i>
<button *ngIf="movie.subscribed" (click)="unNotify()" id="unnotifyBtn" mat-raised-button class="btn-spacing" > <i class="fas fa-bell-slash"></i> {{ 'Requests.Notify' | translate }}</button>
{{ 'Requests.RemoveNotification' | translate }}</button> <button *ngIf="movie.subscribed" (click)="unNotify()" id="unnotifyBtn" mat-raised-button class="btn-spacing" > <i class="fas fa-bell-slash"></i>
</span> {{ 'Requests.RemoveNotification' | translate }}</button>
</span>
</span>
</span> </span>
<span *ngIf="isAdmin && hasRequest"> <span *ngIf="isAdmin && hasRequest">
<button id="approveBtn" *ngIf="!movie.approved && movie.requested" (click)="approve(false)" mat-raised-button class="btn-spacing" color="accent"> <button id="approveBtn" *ngIf="!movie.approved && movie.requested" (click)="approve(false)" mat-raised-button class="btn-spacing" color="accent">
<i class="fas fa-plus"></i> {{ 'Common.Approve' | translate }} <i class="fas fa-plus"></i> {{ 'Common.Approve' | translate }}
</button> </button>
<button id="approve4kBtn" *ngIf="!movie.approved4K && movie.has4KRequest" (click)="approve(true)" mat-raised-button class="btn-spacing" color="accent"> <button *role="roleName4k" id="approve4kBtn" *ngIf="!movie.approved4K && movie.has4KRequest" (click)="approve(true)" mat-raised-button class="btn-spacing" color="accent">
<i class="fas fa-plus"></i> {{ 'Common.Approve4K' | translate }} <i class="fas fa-plus"></i> {{ 'Common.Approve4K' | translate }}
</button> </button>
<button id="markAvailableBtn" *ngIf="!movie.available && movie.requested" (click)="markAvailable(false)" mat-raised-button class="btn-spacing" <button id="markAvailableBtn" *ngIf="!movie.available && movie.requested" (click)="markAvailable(false)" mat-raised-button class="btn-spacing"
color="accent"> color="accent">
<i class="fas fa-plus"></i> {{ 'Requests.MarkAvailable' | translate }} <i class="fas fa-plus"></i> {{ 'Requests.MarkAvailable' | translate }}
</button> </button>
<button id="markAvailable4kBtn" *ngIf="!movie.available4K && movie.has4KRequest" (click)="markAvailable(true)" mat-raised-button class="btn-spacing" <button *role="roleName4k" id="markAvailable4kBtn" *ngIf="!movie.available4K && movie.has4KRequest" (click)="markAvailable(true)" mat-raised-button class="btn-spacing"
color="accent"> color="accent">
<i class="fas fa-plus"></i> {{ 'Requests.MarkAvailable4K' | translate }} <i class="fas fa-plus"></i> {{ 'Requests.MarkAvailable4K' | translate }}
</button> </button>
@ -124,7 +126,7 @@
color="accent"> color="accent">
<i class="fas fa-minus"></i> {{ 'Requests.MarkUnavailable' | translate }} <i class="fas fa-minus"></i> {{ 'Requests.MarkUnavailable' | translate }}
</button> </button>
<button id="markUnavailable4kBtn" *ngIf="movie.available4K" (click)="markUnavailable(true)" mat-raised-button class="btn-spacing" <button *role="roleName4k" id="markUnavailable4kBtn" *ngIf="movie.available4K" (click)="markUnavailable(true)" mat-raised-button class="btn-spacing"
color="accent"> color="accent">
<i class="fas fa-minus"></i> {{ 'Requests.MarkUnavailable4K' | translate }} <i class="fas fa-minus"></i> {{ 'Requests.MarkUnavailable4K' | translate }}
</button> </button>

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

@ -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 { ImageService, SearchV2Service, RequestService, MessageService, RadarrService, SettingsStateService } from "../../../services";
import { ActivatedRoute } from "@angular/router"; import { ActivatedRoute } from "@angular/router";
import { DomSanitizer } from "@angular/platform-browser"; import { DomSanitizer } from "@angular/platform-browser";
@ -29,6 +29,7 @@ export class MovieDetailsComponent {
public advancedOptions: IAdvancedData; public advancedOptions: IAdvancedData;
public showAdvanced: boolean; // Set on the UI public showAdvanced: boolean; // Set on the UI
public issuesEnabled: boolean; public issuesEnabled: boolean;
public roleName4k = "Request4KMovie";
public requestType = RequestType.movie; public requestType = RequestType.movie;

36
src/Ombi/ClientApp/src/app/shared/role-directive/role-directive.ts Normal file
View file

@ -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<unknown>, 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;
}
}
}

8
src/Ombi/ClientApp/src/app/shared/role-directive/role.module.ts Normal file
View file

@ -0,0 +1,8 @@
import { NgModule } from '@angular/core';
import { RoleDirective } from './role-directive';
@NgModule({
declarations: [RoleDirective],
exports: [RoleDirective],
})
export class RoleModule {}

3
src/Ombi/ClientApp/src/app/shared/shared.module.ts
View file

@ -43,6 +43,7 @@ import { TheMovieDbService } from "../services";
import { TranslateModule } from "@ngx-translate/core"; import { TranslateModule } from "@ngx-translate/core";
import { TruncateModule } from "@yellowspot/ng-truncate"; import { TruncateModule } from "@yellowspot/ng-truncate";
import { WatchProvidersSelectComponent } from "./components/watch-providers-select/watch-providers-select.component"; import { WatchProvidersSelectComponent } from "./components/watch-providers-select/watch-providers-select.component";
import { RoleModule } from "./role-directive/role.module";
@NgModule({ @NgModule({
declarations: [ declarations: [
@ -56,6 +57,7 @@ import { WatchProvidersSelectComponent } from "./components/watch-providers-sele
WatchProvidersSelectComponent, WatchProvidersSelectComponent,
], ],
imports: [ imports: [
RoleModule,
SidebarModule, SidebarModule,
ReactiveFormsModule, ReactiveFormsModule,
FormsModule, FormsModule,
@ -91,6 +93,7 @@ import { WatchProvidersSelectComponent } from "./components/watch-providers-sele
PipeModule, PipeModule,
], ],
exports: [ exports: [
RoleModule,
TranslateModule, TranslateModule,
CommonModule, CommonModule,
FormsModule, FormsModule,