From 0be935b5ef806ebae75f9dae80fb68226b80088c Mon Sep 17 00:00:00 2001 From: dr3amer <91037083+dr3am37@users.noreply.github.com> Date: Mon, 2 May 2022 01:12:54 -0700 Subject: [PATCH] updated recommendation refresh implementation Changed the implementation to use the router instead in order to reload the component instead of just reloading the data. This implementation makes sure the component gets destroyed on navigation eliminating any memory leaks, reloading CSS in case of having animations on page load and generally a continuation of the experience you get when you browse into a movie from the discover page. --- .../movie/movie-details.component.ts | 44 +++++++++++-------- 1 file changed, 26 insertions(+), 18 deletions(-) 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 8ca1e5528..9eb2e9f62 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,6 +1,6 @@ import { AfterViewInit, Component, OnInit, ViewChild, ViewEncapsulation } from "@angular/core"; import { ImageService, SearchV2Service, RequestService, MessageService, RadarrService, SettingsStateService } from "../../../services"; -import { ActivatedRoute } from "@angular/router"; +import { ActivatedRoute, Router } from "@angular/router"; import { DomSanitizer } from "@angular/platform-browser"; import { ISearchMovieResultV2 } from "../../../interfaces/ISearchMovieResultV2"; import { MatDialog } from "@angular/material/dialog"; @@ -32,37 +32,45 @@ export class MovieDetailsComponent implements OnInit{ public issuesEnabled: boolean; public roleName4k = "Request4KMovie"; public is4KEnabled = false; - public requestType = RequestType.movie; - - private theMovidDbId: number; private imdbId: string; + private snapMovieId: string; - constructor(private searchService: SearchV2Service, private route: ActivatedRoute, + + constructor(private searchService: SearchV2Service, private route: ActivatedRoute, private router: Router, private sanitizer: DomSanitizer, private imageService: ImageService, public dialog: MatDialog, private requestService: RequestService, private requestService2: RequestServiceV2, private radarrService: RadarrService, public messageService: MessageService, private auth: AuthService, private settingsState: SettingsStateService, private translate: TranslateService, private featureFacade: FeaturesFacade) { + this.snapMovieId = this.route.snapshot.params.movieDbId; this.route.params.subscribe(async (params: any) => { - if (typeof params.movieDbId === 'string' || params.movieDbId instanceof String) { - if (params.movieDbId.startsWith("tt")) { - this.imdbId = params.movieDbId; - // movieDbId changed, re-init component - this.ngOnInit(); - } - } - this.theMovidDbId = params.movieDbId; - // movieDbId changed, re-init component - this.ngOnInit(); + if (typeof params.movieDbId === 'string' || params.movieDbId instanceof String) { + if (params.movieDbId.startsWith("tt")) { + this.imdbId = params.movieDbId; + // Check if we user navigated to another movie and if so reload the component + if (this.imdbId !== this.snapMovieId) { + this.reloadComponent() + } + } + } + this.theMovidDbId = params.movieDbId; + // Check if we user navigated to another movie and if so reload the component + if (params.movieDbId !== this.snapMovieId) { + this.reloadComponent() + } }); - } + reloadComponent() { + let currentUrl = this.router.url; + this.router.routeReuseStrategy.shouldReuseRoute = () => false; + this.router.onSameUrlNavigation = 'reload'; + this.router.navigate([currentUrl]); + } + async ngOnInit() { - // reset scroll location to top - window.scrollTo(0, 0); this.is4KEnabled = this.featureFacade.is4kEnabled(); this.issuesEnabled = this.settingsState.getIssue(); this.isAdmin = this.auth.hasRole("admin") || this.auth.hasRole("poweruser");