diff --git a/appveyor.yml b/appveyor.yml
index 3c60a0006..62d87f8ab 100644
--- a/appveyor.yml
+++ b/appveyor.yml
@@ -1,4 +1,4 @@
-version: 3.0.{build}
+version: 4.0.{build}
 configuration: Release
 os: Visual Studio 2017
 environment:
diff --git a/src/Ombi/ClientApp/src/app/app.module.ts b/src/Ombi/ClientApp/src/app/app.module.ts
index 85c840e6c..c837431d9 100644
--- a/src/Ombi/ClientApp/src/app/app.module.ts
+++ b/src/Ombi/ClientApp/src/app/app.module.ts
@@ -51,6 +51,7 @@ import { LayoutModule } from '@angular/cdk/layout';
 import { SearchV2Service } from "./services/searchV2.service";
 import { NavSearchComponent } from "./my-nav/nav-search.component";
 import { OverlayModule } from "@angular/cdk/overlay";
+import { getBaseLocation } from "./shared/functions/common-functions";
 
 const routes: Routes = [
     { path: "*", component: PageNotFoundComponent },
@@ -77,8 +78,8 @@ const routes: Routes = [
 ];
 
 // AoT requires an exported function for factories
-export function HttpLoaderFactory(http: HttpClient, platformLocation: PlatformLocation) {
-    const base = platformLocation.getBaseHrefFromDOM();
+export function HttpLoaderFactory(http: HttpClient) {
+    const base = getBaseLocation();
     const version = Math.floor(Math.random() * 999999999);
     if (base.length > 1) {
         return new TranslateHttpLoader(http, `${base}/translations/`, `.json?v=${version}`);
@@ -173,6 +174,10 @@ export function JwtTokenGetter() {
         SearchService,
         SearchV2Service,
         MessageService,
+        {
+            provide: APP_BASE_HREF,
+            useFactory: getBaseLocation
+        }
        ],
     bootstrap: [AppComponent],
 })
diff --git a/src/Ombi/ClientApp/src/app/auth/auth.service.ts b/src/Ombi/ClientApp/src/app/auth/auth.service.ts
index 2115b2516..5d181171c 100644
--- a/src/Ombi/ClientApp/src/app/auth/auth.service.ts
+++ b/src/Ombi/ClientApp/src/app/auth/auth.service.ts
@@ -1,6 +1,6 @@
-import { PlatformLocation } from "@angular/common";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
 import { HttpClient } from "@angular/common/http";
-import { Injectable } from "@angular/core";
+import { Injectable, Inject } from "@angular/core";
 import { JwtHelperService } from "@auth0/angular-jwt";
 import { Observable } from "rxjs";
 
@@ -10,8 +10,8 @@ import { ILocalUser, IUserLogin } from "./IUserLogin";
 @Injectable()
 export class AuthService extends ServiceHelpers {
 
-    constructor(http: HttpClient, public platformLocation: PlatformLocation, private jwtHelperService: JwtHelperService) {
-        super(http, "/api/v1/token", platformLocation);
+    constructor(http: HttpClient, @Inject(APP_BASE_HREF) href:string, private jwtHelperService: JwtHelperService) {
+        super(http, "/api/v1/token", href);
     }
 
     public login(login: IUserLogin): Observable<any> {
diff --git a/src/Ombi/ClientApp/src/app/discover/card/discover-card-details.component.html b/src/Ombi/ClientApp/src/app/discover/card/discover-card-details.component.html
index 943ba7e06..63dee260c 100644
--- a/src/Ombi/ClientApp/src/app/discover/card/discover-card-details.component.html
+++ b/src/Ombi/ClientApp/src/app/discover/card/discover-card-details.component.html
@@ -140,7 +140,7 @@
 
             <button mat-raised-button class="btn-green btn-spacing" *ngIf="tv.available"> {{
                 'Common.Available' | translate }}</button>
-            <button mat-raised-button class="btn-orange btn-spacing" *ngIf="tv.partlyAvailable"> {{
+            <button mat-raised-button class="btn-orange btn-spacing" *ngIf="tv.partlyAvailable && !tv.available"> {{
                     'Common.PartlyAvailable' | translate }}</button>
 
             <span *ngIf="tv.available">
diff --git a/src/Ombi/ClientApp/src/app/interfaces/IUser.ts b/src/Ombi/ClientApp/src/app/interfaces/IUser.ts
index a44750040..0816ad42e 100644
--- a/src/Ombi/ClientApp/src/app/interfaces/IUser.ts
+++ b/src/Ombi/ClientApp/src/app/interfaces/IUser.ts
@@ -21,7 +21,6 @@ export interface IUser {
     episodeRequestQuota: IRemainingRequests | null;
     movieRequestQuota: IRemainingRequests | null;
     musicRequestQuota: IRemainingRequests | null;
-    checked: boolean;
 }
 
 export interface IUserQualityProfiles {
diff --git a/src/Ombi/ClientApp/src/app/issues/issueDetails.component.ts b/src/Ombi/ClientApp/src/app/issues/issueDetails.component.ts
index 1fda9acc5..1e30f932c 100644
--- a/src/Ombi/ClientApp/src/app/issues/issueDetails.component.ts
+++ b/src/Ombi/ClientApp/src/app/issues/issueDetails.component.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Component, OnInit } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Component, OnInit, Inject } from "@angular/core";
 import { ActivatedRoute } from "@angular/router";
 
 import { AuthService } from "../auth/auth.service";
@@ -37,7 +37,7 @@ export class IssueDetailsComponent implements OnInit {
                 private notificationService: NotificationService,
                 private imageService: ImageService,
                 private sanitizer: DomSanitizer,
-                private readonly platformLocation: PlatformLocation) {
+                @Inject(APP_BASE_HREF) href:string) {
             this.route.params
             .subscribe((params: any) => {
                   this.issueId = parseInt(params.id);
@@ -46,7 +46,7 @@ export class IssueDetailsComponent implements OnInit {
             this.isAdmin = this.authService.hasRole("Admin") || this.authService.hasRole("PowerUser");
             this.settingsService.getIssueSettings().subscribe(x => this.settings = x);
 
-            const base = this.platformLocation.getBaseHrefFromDOM();
+            const base = href;
             if (base) {
                 this.defaultPoster = "../../.." + base + "/images/";
             } else {
diff --git a/src/Ombi/ClientApp/src/app/landingpage/landingpage.component.ts b/src/Ombi/ClientApp/src/app/landingpage/landingpage.component.ts
index dc329baf3..5ccd0011a 100644
--- a/src/Ombi/ClientApp/src/app/landingpage/landingpage.component.ts
+++ b/src/Ombi/ClientApp/src/app/landingpage/landingpage.component.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Component, OnDestroy, OnInit } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Component, OnDestroy, OnInit, Inject } from "@angular/core";
 
 import { IMediaServerStatus } from "../interfaces";
 import { ICustomizationSettings, ILandingPageSettings } from "../interfaces";
@@ -25,9 +25,11 @@ export class LandingPageComponent implements OnDestroy, OnInit {
     public baseUrl: string;
     private timer: any;
 
+    private href: string;
+
     constructor(private settingsService: SettingsService,
                 private images: ImageService, private sanitizer: DomSanitizer, private landingPageService: LandingPageService,
-                private location: PlatformLocation) { }
+                @Inject(APP_BASE_HREF) href :string) { this.href = href }
 
     public ngOnInit() {
         this.settingsService.getCustomization().subscribe(x => this.customizationSettings = x);
@@ -39,7 +41,7 @@ export class LandingPageComponent implements OnDestroy, OnInit {
             this.cycleBackground();
         }, 15000);
 
-        const base = this.location.getBaseHrefFromDOM();
+        const base = this.href;
         if (base.length > 1) {
             this.baseUrl = base;
         }
diff --git a/src/Ombi/ClientApp/src/app/login/login.component.ts b/src/Ombi/ClientApp/src/app/login/login.component.ts
index 03aafe20b..84530c3da 100644
--- a/src/Ombi/ClientApp/src/app/login/login.component.ts
+++ b/src/Ombi/ClientApp/src/app/login/login.component.ts
@@ -1,9 +1,9 @@
-import { Component, OnDestroy, OnInit } from "@angular/core";
+import { Component, OnDestroy, OnInit, Inject } from "@angular/core";
 import { FormBuilder, FormGroup, Validators } from "@angular/forms";
 import { ActivatedRoute, Router } from "@angular/router";
 import { TranslateService } from "@ngx-translate/core";
 
-import { PlatformLocation } from "@angular/common";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
 import { AuthService } from "../auth/auth.service";
 import { IAuthenticationSettings, ICustomizationSettings } from "../interfaces";
 import { NotificationService, PlexTvService } from "../services";
@@ -45,11 +45,13 @@ export class LoginComponent implements OnDestroy, OnInit {
 
     private errorBody: string;
     private errorValidation: string;
+    private href: string;
 
     constructor(private authService: AuthService, private router: Router, private notify: NotificationService, private status: StatusService,
                 private fb: FormBuilder, private settingsService: SettingsService, private images: ImageService, private sanitizer: DomSanitizer,
-                private route: ActivatedRoute, private location: PlatformLocation, private translate: TranslateService, private plexTv: PlexTvService) {
-        this.route.params
+                private route: ActivatedRoute, @Inject(APP_BASE_HREF) href:string, private translate: TranslateService, private plexTv: PlexTvService) {
+        this.href = href;
+                    this.route.params
             .subscribe((params: any) => {
                 this.landingFlag = params.landing;
                 if (!this.landingFlag) {
@@ -89,7 +91,7 @@ export class LoginComponent implements OnDestroy, OnInit {
             this.cycleBackground();
         }, 15000);
 
-        const base = this.location.getBaseHrefFromDOM();
+        const base = this.href;
         if (base.length > 1) {
             this.baseUrl = base;
         }
diff --git a/src/Ombi/ClientApp/src/app/login/resetpassword.component.ts b/src/Ombi/ClientApp/src/app/login/resetpassword.component.ts
index 2203b95b9..7c228e962 100644
--- a/src/Ombi/ClientApp/src/app/login/resetpassword.component.ts
+++ b/src/Ombi/ClientApp/src/app/login/resetpassword.component.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Component, OnInit } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Component, OnInit, Inject } from "@angular/core";
 import { FormBuilder, FormGroup, Validators } from "@angular/forms";
 import { DomSanitizer } from "@angular/platform-browser";
 
@@ -17,10 +17,12 @@ export class ResetPasswordComponent implements OnInit {
     public emailSettingsEnabled: boolean;
     public baseUrl: string;
     public background: any;
+    private href: string;
 
     constructor(private identityService: IdentityService, private notify: NotificationService,
-                private fb: FormBuilder, private settingsService: SettingsService, private location: PlatformLocation,
+                private fb: FormBuilder, private settingsService: SettingsService, @Inject(APP_BASE_HREF) href:string,
                 private images: ImageService, private sanitizer: DomSanitizer) {
+                    this.href = href;
         this.form = this.fb.group({
             email: ["", [Validators.required]],
         });
@@ -30,7 +32,7 @@ export class ResetPasswordComponent implements OnInit {
         this.images.getRandomBackground().subscribe(x => {
             this.background = this.sanitizer.bypassSecurityTrustStyle("linear-gradient(-10deg, transparent 20%, rgba(0,0,0,0.7) 20.0%, rgba(0,0,0,0.7) 80.0%, transparent 80%),url(" + x.url + ")");
         });
-        const base = this.location.getBaseHrefFromDOM();
+        const base = this.href;
         if (base.length > 1) {
             this.baseUrl = base;
         }
diff --git a/src/Ombi/ClientApp/src/app/my-nav/my-nav.component.ts b/src/Ombi/ClientApp/src/app/my-nav/my-nav.component.ts
index 21923b06d..61db70589 100644
--- a/src/Ombi/ClientApp/src/app/my-nav/my-nav.component.ts
+++ b/src/Ombi/ClientApp/src/app/my-nav/my-nav.component.ts
@@ -28,7 +28,7 @@ export class MyNavComponent {
 
   public navItems: INavBar[] = [
     { name: "NavigationBar.Discover", icon: "find_replace", link: "/discover" },
-    { name: "NavigationBar.Requests", icon: "list", link: "/requests" },
+    { name: "NavigationBar.Requests", icon: "list", link: "/requests" },   
     { name: "NavigationBar.UserManagement", icon: "account_circle", link: "/usermanagement" },
     { name: "NavigationBar.Settings", icon: "settings", link: "/Settings/About" },
   ]
diff --git a/src/Ombi/ClientApp/src/app/requests/movierequests.component.ts b/src/Ombi/ClientApp/src/app/requests/movierequests.component.ts
index 3459ac0c7..69a2359cf 100644
--- a/src/Ombi/ClientApp/src/app/requests/movierequests.component.ts
+++ b/src/Ombi/ClientApp/src/app/requests/movierequests.component.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Component, Input, OnInit } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Component, Input, OnInit, Inject } from "@angular/core";
 import { DomSanitizer } from "@angular/platform-browser";
 import { Subject } from "rxjs";
 import { debounceTime, distinctUntilChanged } from "rxjs/operators";
@@ -44,6 +44,7 @@ export class MovieRequestsComponent implements OnInit {
     public totalMovies: number = 100;
     public currentlyLoaded: number;
     private amountToLoad: number;
+    private href: string;
 
     constructor(
         private requestService: RequestService,
@@ -51,7 +52,8 @@ export class MovieRequestsComponent implements OnInit {
         private notificationService: NotificationService,
         private radarrService: RadarrService,
         private sanitizer: DomSanitizer,
-        private readonly platformLocation: PlatformLocation) {
+        @Inject(APP_BASE_HREF) href:string) {
+            this.href = href;
         this.searchChanged.pipe(
             debounceTime(600), // Wait Xms after the last event before emitting last event
             distinctUntilChanged(), // only emit if value is different from previous value
@@ -68,7 +70,7 @@ export class MovieRequestsComponent implements OnInit {
                 });
         });
         this.defaultPoster = "../../../images/default_movie_poster.png";
-        const base = this.platformLocation.getBaseHrefFromDOM();
+        const base = this.href;
         if (base) {
             this.defaultPoster = "../../.." + base + "/images/default_movie_poster.png";
         }
diff --git a/src/Ombi/ClientApp/src/app/requests/music/musicrequests.component.ts b/src/Ombi/ClientApp/src/app/requests/music/musicrequests.component.ts
index b10173042..8d8336dcb 100644
--- a/src/Ombi/ClientApp/src/app/requests/music/musicrequests.component.ts
+++ b/src/Ombi/ClientApp/src/app/requests/music/musicrequests.component.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Component, Input, OnInit } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Component, Input, OnInit, Inject } from "@angular/core";
 import { DomSanitizer } from "@angular/platform-browser";
 import { Subject } from "rxjs";
 import { debounceTime, distinctUntilChanged } from "rxjs/operators";
@@ -41,13 +41,15 @@ export class MusicRequestsComponent implements OnInit {
     public totalAlbums: number = 100;
     public currentlyLoaded: number;
     private amountToLoad: number;
+    private href: string;
 
     constructor(
         private requestService: RequestService,
         private auth: AuthService,
         private notificationService: NotificationService,
         private sanitizer: DomSanitizer,
-        private readonly platformLocation: PlatformLocation) {
+         @Inject(APP_BASE_HREF) href:string) {
+            this.href = href;
         this.searchChanged.pipe(
             debounceTime(600), // Wait Xms after the last event before emitting last event
             distinctUntilChanged(), // only emit if value is different from previous value
@@ -64,7 +66,7 @@ export class MusicRequestsComponent implements OnInit {
                 });
         });
         this.defaultPoster = "../../../images/default-music-placeholder.png";
-        const base = this.platformLocation.getBaseHrefFromDOM();
+        const base = this.href;
         if (base) {
             this.defaultPoster = "../../.." + base + "/images/default-music-placeholder.png";
         }
diff --git a/src/Ombi/ClientApp/src/app/requests/tvrequests.component.ts b/src/Ombi/ClientApp/src/app/requests/tvrequests.component.ts
index 924fccd1f..4ecf1e6ac 100644
--- a/src/Ombi/ClientApp/src/app/requests/tvrequests.component.ts
+++ b/src/Ombi/ClientApp/src/app/requests/tvrequests.component.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Component, Input, OnInit } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Component, Input, OnInit, Inject } from "@angular/core";
 import { DomSanitizer } from "@angular/platform-browser";
 import { Subject } from "rxjs";
 import { debounceTime, distinctUntilChanged } from "rxjs/operators";
@@ -38,6 +38,7 @@ export class TvRequestsComponent implements OnInit {
     public totalTv: number = 100;
     private currentlyLoaded: number;
     private amountToLoad: number;
+    private href: string;
 
     constructor(
         private requestService: RequestService,
@@ -46,8 +47,8 @@ export class TvRequestsComponent implements OnInit {
         private imageService: ImageService,
         private sonarrService: SonarrService,
         private notificationService: NotificationService,
-        private readonly platformLocation: PlatformLocation) {
-            
+         @Inject(APP_BASE_HREF) href:string) {
+            this.href= href;
             this.isAdmin = this.auth.hasRole("admin") || this.auth.hasRole("poweruser");
             this.currentUser = this.auth.claims().name;
             if (this.isAdmin) {
@@ -86,7 +87,7 @@ export class TvRequestsComponent implements OnInit {
                 });
         });
         this.defaultPoster = "../../../images/default_tv_poster.png";
-        const base = this.platformLocation.getBaseHrefFromDOM();
+        const base = this.href;
         if (base) {
             this.defaultPoster = "../../.." + base + "/images/default_tv_poster.png";
         }
diff --git a/src/Ombi/ClientApp/src/app/search/moviesearch.component.ts b/src/Ombi/ClientApp/src/app/search/moviesearch.component.ts
index 90502bb93..c8cddd499 100644
--- a/src/Ombi/ClientApp/src/app/search/moviesearch.component.ts
+++ b/src/Ombi/ClientApp/src/app/search/moviesearch.component.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Component, Input, OnInit } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Component, Input, OnInit, Inject } from "@angular/core";
 import { DomSanitizer } from "@angular/platform-browser";
 import { TranslateService } from "@ngx-translate/core";
 import { Subject } from "rxjs";
@@ -39,12 +39,14 @@ export class MovieSearchComponent implements OnInit {
     public issueProviderId: string;
     public issueCategorySelected: IIssueCategory;
     public defaultPoster: string;
+    private href: string;
 
     constructor(
         private searchService: SearchService, private requestService: RequestService,
         private notificationService: NotificationService, private authService: AuthService,
         private readonly translate: TranslateService, private sanitizer: DomSanitizer,
-        private readonly platformLocation: PlatformLocation, private settingsService: SettingsService) {
+         @Inject(APP_BASE_HREF) href:string, private settingsService: SettingsService) {
+            this.href= href;
         this.langauges = <ILanguageRefine[]><any>languageData;
         this.searchChanged.pipe(
             debounceTime(600), // Wait Xms after the last event before emitting last event
@@ -54,7 +56,7 @@ export class MovieSearchComponent implements OnInit {
             this.runSearch();
         });
         this.defaultPoster = "../../../images/default_movie_poster.png";
-        const base = this.platformLocation.getBaseHrefFromDOM();
+        const base = this.href;
         if (base) {
             this.defaultPoster = "../../.." + base + "/images/default_movie_poster.png";
         }
diff --git a/src/Ombi/ClientApp/src/app/search/music/musicsearch.component.ts b/src/Ombi/ClientApp/src/app/search/music/musicsearch.component.ts
index 2fd9839f2..a5157d6a6 100644
--- a/src/Ombi/ClientApp/src/app/search/music/musicsearch.component.ts
+++ b/src/Ombi/ClientApp/src/app/search/music/musicsearch.component.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Component, Input, OnInit } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Component, Input, OnInit, Inject } from "@angular/core";
 import { DomSanitizer } from "@angular/platform-browser";
 import { Subject } from "rxjs";
 import { debounceTime, distinctUntilChanged } from "rxjs/operators";
@@ -31,10 +31,11 @@ export class MusicSearchComponent implements OnInit {
     public issueCategorySelected: IIssueCategory;
     public defaultPoster: string;
 
+    private href: string;
     constructor(
         private searchService: SearchService, private sanitizer: DomSanitizer,
-        private platformLocation: PlatformLocation) {
-
+         @Inject(APP_BASE_HREF) href:string) {
+this.href = href;
         this.searchChanged.pipe(
             debounceTime(600), // Wait Xms after the last event before emitting last event
             distinctUntilChanged(), // only emit if value is different from previous value
@@ -69,7 +70,7 @@ export class MusicSearchComponent implements OnInit {
             }
         });
         this.defaultPoster = "../../../images/default-music-placeholder.png";
-        const base = this.platformLocation.getBaseHrefFromDOM();
+        const base = this.href;
         if (base) {
             this.defaultPoster = "../../.." + base + "/images/default-music-placeholder.png";
         }
diff --git a/src/Ombi/ClientApp/src/app/search/tvsearch.component.ts b/src/Ombi/ClientApp/src/app/search/tvsearch.component.ts
index 92d0d549a..5f65f3192 100644
--- a/src/Ombi/ClientApp/src/app/search/tvsearch.component.ts
+++ b/src/Ombi/ClientApp/src/app/search/tvsearch.component.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Component, Input, OnInit } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Component, Input, OnInit, Inject } from "@angular/core";
 import { DomSanitizer } from "@angular/platform-browser";
 import { Subject } from "rxjs";
 import { debounceTime, distinctUntilChanged } from "rxjs/operators";
@@ -30,13 +30,14 @@ export class TvSearchComponent implements OnInit {
     public issueRequestId: number;
     public issueProviderId: string;
     public issueCategorySelected: IIssueCategory;
+    private href: string;
 
     constructor(
         private searchService: SearchService, private requestService: RequestService,
         private notificationService: NotificationService, private authService: AuthService,
         private imageService: ImageService, private sanitizer: DomSanitizer,
-        private readonly platformLocation: PlatformLocation) {
-
+         @Inject(APP_BASE_HREF) href:string) {
+this.href = href;
         this.searchChanged.pipe(
             debounceTime(600), // Wait Xms after the last event before emitting last event
             distinctUntilChanged(), // only emit if value is different from previous value
@@ -54,7 +55,7 @@ export class TvSearchComponent implements OnInit {
                 });
         });
         this.defaultPoster = "../../../images/default_tv_poster.png";
-        const base = this.platformLocation.getBaseHrefFromDOM();
+        const base = this.href;
         if (base) {
             this.defaultPoster = "../../.." + base + "/images/default_tv_poster.png";
         }
diff --git a/src/Ombi/ClientApp/src/app/services/applications/couchpotato.service.ts b/src/Ombi/ClientApp/src/app/services/applications/couchpotato.service.ts
index 44fa409a4..881aaa8a9 100644
--- a/src/Ombi/ClientApp/src/app/services/applications/couchpotato.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/applications/couchpotato.service.ts
@@ -1,6 +1,6 @@
-import { PlatformLocation } from "@angular/common";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
 import { HttpClient } from "@angular/common/http";
-import { Injectable } from "@angular/core";
+import { Injectable, Inject } from "@angular/core";
 import { Observable } from "rxjs";
 
 import { ServiceHelpers } from "../service.helpers";
@@ -9,8 +9,8 @@ import { ICouchPotatoApiKey, ICouchPotatoProfiles, ICouchPotatoSettings } from "
 
 @Injectable()
 export class CouchPotatoService extends ServiceHelpers {
-    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/CouchPotato/", platformLocation);
+    constructor(http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/CouchPotato/", href);
     }
 
     public getProfiles(settings: ICouchPotatoSettings): Observable<ICouchPotatoProfiles> {
diff --git a/src/Ombi/ClientApp/src/app/services/applications/emby.service.ts b/src/Ombi/ClientApp/src/app/services/applications/emby.service.ts
index d4e52a630..6c519607c 100644
--- a/src/Ombi/ClientApp/src/app/services/applications/emby.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/applications/emby.service.ts
@@ -1,6 +1,6 @@
-import { PlatformLocation } from "@angular/common";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
 import { HttpClient } from "@angular/common/http";
-import { Injectable } from "@angular/core";
+import { Injectable, Inject } from "@angular/core";
 import { Observable } from "rxjs";
 
 import { ServiceHelpers } from "../service.helpers";
@@ -9,8 +9,8 @@ import { IEmbySettings, IUsersModel } from "../../interfaces";
 
 @Injectable()
 export class EmbyService extends ServiceHelpers {
-    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/Emby/", platformLocation);
+    constructor(http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/Emby/", href);
     }
 
     public logIn(settings: IEmbySettings): Observable<IEmbySettings> {
diff --git a/src/Ombi/ClientApp/src/app/services/applications/lidarr.service.ts b/src/Ombi/ClientApp/src/app/services/applications/lidarr.service.ts
index 9ef36357a..b4e4830d3 100644
--- a/src/Ombi/ClientApp/src/app/services/applications/lidarr.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/applications/lidarr.service.ts
@@ -1,6 +1,6 @@
-import { PlatformLocation } from "@angular/common";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
 import { HttpClient } from "@angular/common/http";
-import { Injectable } from "@angular/core";
+import { Injectable, Inject } from "@angular/core";
 import { Observable } from "rxjs";
 
 import { ILidarrProfile, ILidarrRootFolder, IProfiles } from "../../interfaces";
@@ -9,8 +9,8 @@ import { ServiceHelpers } from "../service.helpers";
 
 @Injectable()
 export class LidarrService extends ServiceHelpers {
-    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/Lidarr", platformLocation);
+    constructor(http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/Lidarr", href);
     }
 
     public getRootFolders(settings: ILidarrSettings): Observable<ILidarrRootFolder[]> {
diff --git a/src/Ombi/ClientApp/src/app/services/applications/plex.service.ts b/src/Ombi/ClientApp/src/app/services/applications/plex.service.ts
index 9f53d0e34..39bfea53e 100644
--- a/src/Ombi/ClientApp/src/app/services/applications/plex.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/applications/plex.service.ts
@@ -1,6 +1,6 @@
-import { PlatformLocation } from "@angular/common";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
 import { HttpClient } from "@angular/common/http";
-import { Injectable } from "@angular/core";
+import { Injectable, Inject } from "@angular/core";
 
 import { Observable } from "rxjs";
 
@@ -10,8 +10,8 @@ import { IPlexAuthentication, IPlexLibResponse, IPlexLibSimpleResponse, IPlexOAu
 
 @Injectable()
 export class PlexService extends ServiceHelpers {
-    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/Plex/", platformLocation);
+    constructor(http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/Plex/", href);
     }
 
     public logIn(login: string, password: string): Observable<IPlexAuthentication> {
diff --git a/src/Ombi/ClientApp/src/app/services/applications/plexoauth.service.ts b/src/Ombi/ClientApp/src/app/services/applications/plexoauth.service.ts
index 7a1b495b5..770aad6f9 100644
--- a/src/Ombi/ClientApp/src/app/services/applications/plexoauth.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/applications/plexoauth.service.ts
@@ -1,6 +1,6 @@
-import { PlatformLocation } from "@angular/common";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
 import { HttpClient } from "@angular/common/http";
-import { Injectable } from "@angular/core";
+import { Injectable, Inject } from "@angular/core";
 
 import { Observable } from "rxjs";
 
@@ -10,8 +10,8 @@ import { IPlexOAuthAccessToken } from "../../interfaces";
 
 @Injectable()
 export class PlexOAuthService extends ServiceHelpers {
-    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/PlexOAuth/", platformLocation);
+    constructor(http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/PlexOAuth/", href);
     }
 
     public oAuth(pin: number): Observable<IPlexOAuthAccessToken> {
diff --git a/src/Ombi/ClientApp/src/app/services/applications/plextv.service.ts b/src/Ombi/ClientApp/src/app/services/applications/plextv.service.ts
index 03a49e90c..f214ac291 100644
--- a/src/Ombi/ClientApp/src/app/services/applications/plextv.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/applications/plextv.service.ts
@@ -1,6 +1,6 @@
-import { PlatformLocation } from "@angular/common";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
 import { HttpClient, HttpHeaders } from "@angular/common/http";
-import { Injectable } from "@angular/core";
+import { Injectable, Inject } from "@angular/core";
 
 import { Observable } from "rxjs";
 
@@ -9,7 +9,7 @@ import { IPlexPin } from "../../interfaces";
 @Injectable()
 export class PlexTvService {
 
-    constructor(private http: HttpClient, public platformLocation: PlatformLocation) {
+    constructor(private http: HttpClient) {
     }
 
     public GetPin(clientId: string, applicationName: string): Observable<IPlexPin> {
diff --git a/src/Ombi/ClientApp/src/app/services/applications/radarr.service.ts b/src/Ombi/ClientApp/src/app/services/applications/radarr.service.ts
index 90f1dac48..eaa785233 100644
--- a/src/Ombi/ClientApp/src/app/services/applications/radarr.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/applications/radarr.service.ts
@@ -1,6 +1,6 @@
-import { PlatformLocation } from "@angular/common";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
 import { HttpClient } from "@angular/common/http";
-import { Injectable } from "@angular/core";
+import { Injectable, Inject } from "@angular/core";
 import { Observable } from "rxjs";
 
 import { IRadarrProfile, IRadarrRootFolder } from "../../interfaces";
@@ -9,8 +9,8 @@ import { ServiceHelpers } from "../service.helpers";
 
 @Injectable()
 export class RadarrService extends ServiceHelpers {
-    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/Radarr", platformLocation);
+    constructor(http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/Radarr", href);
     }
 
     public getRootFolders(settings: IRadarrSettings): Observable<IRadarrRootFolder[]> {
diff --git a/src/Ombi/ClientApp/src/app/services/applications/sonarr.service.ts b/src/Ombi/ClientApp/src/app/services/applications/sonarr.service.ts
index bce47acf9..4745dbebd 100644
--- a/src/Ombi/ClientApp/src/app/services/applications/sonarr.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/applications/sonarr.service.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Injectable } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Injectable, Inject } from "@angular/core";
 
 import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs";
@@ -10,8 +10,8 @@ import { ServiceHelpers } from "../service.helpers";
 
 @Injectable()
 export class SonarrService extends ServiceHelpers {
-    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/Sonarr", platformLocation);
+    constructor(http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/Sonarr", href);
     }
 
     public getRootFolders(settings: ISonarrSettings): Observable<ISonarrRootFolder[]> {
diff --git a/src/Ombi/ClientApp/src/app/services/applications/tester.service.ts b/src/Ombi/ClientApp/src/app/services/applications/tester.service.ts
index e692b9196..34bbc43e7 100644
--- a/src/Ombi/ClientApp/src/app/services/applications/tester.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/applications/tester.service.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Injectable } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Injectable, Inject } from "@angular/core";
 
 import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs";
@@ -27,8 +27,8 @@ import {
 
 @Injectable()
 export class TesterService extends ServiceHelpers {
-    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/tester/", platformLocation);
+    constructor(http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/tester/", href);
     }
 
     public discordTest(settings: IDiscordNotifcationSettings): Observable<boolean> {
diff --git a/src/Ombi/ClientApp/src/app/services/custompage.service.ts b/src/Ombi/ClientApp/src/app/services/custompage.service.ts
index 1fc1ea028..d89fd6122 100644
--- a/src/Ombi/ClientApp/src/app/services/custompage.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/custompage.service.ts
@@ -1,6 +1,6 @@
-import { PlatformLocation } from "@angular/common";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
 import { HttpClient } from "@angular/common/http";
-import { Injectable } from "@angular/core";
+import { Injectable, Inject } from "@angular/core";
 import { Observable } from "rxjs";
 
 import {
@@ -11,8 +11,8 @@ import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
 export class CustomPageService extends ServiceHelpers {
-    constructor(public http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/CustomPage", platformLocation);
+    constructor(public http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/CustomPage", href);
     } 
 
     public getCustomPage(): Observable<ICustomPage> {
diff --git a/src/Ombi/ClientApp/src/app/services/identity.service.ts b/src/Ombi/ClientApp/src/app/services/identity.service.ts
index 670c7f9bb..14db058ee 100644
--- a/src/Ombi/ClientApp/src/app/services/identity.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/identity.service.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Injectable } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Injectable, Inject } from "@angular/core";
 
 import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs";
@@ -9,8 +9,8 @@ import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
 export class IdentityService extends ServiceHelpers {
-    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/Identity/", platformLocation);
+    constructor(http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/Identity/", href);
     }
     public createWizardUser(user: ICreateWizardUser): Observable<IWizardUserResult> {
         return this.http.post<IWizardUserResult>(`${this.url}Wizard/`, JSON.stringify(user),  {headers: this.headers});
diff --git a/src/Ombi/ClientApp/src/app/services/image.service.ts b/src/Ombi/ClientApp/src/app/services/image.service.ts
index 92119f0a0..521a207e3 100644
--- a/src/Ombi/ClientApp/src/app/services/image.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/image.service.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Injectable } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Injectable, Inject } from "@angular/core";
 import { Observable } from "rxjs";
 
 import { HttpClient } from "@angular/common/http";
@@ -9,8 +9,8 @@ import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
 export class ImageService extends ServiceHelpers {
-    constructor(public http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/Images/", platformLocation);
+    constructor(public http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/Images/", href);
     }
 
     public getRandomBackground(): Observable<IImages> {
diff --git a/src/Ombi/ClientApp/src/app/services/issues.service.ts b/src/Ombi/ClientApp/src/app/services/issues.service.ts
index 41cbb4df1..4500fb90c 100644
--- a/src/Ombi/ClientApp/src/app/services/issues.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/issues.service.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Injectable } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Injectable, Inject } from "@angular/core";
 
 import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs";
@@ -9,8 +9,8 @@ import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
 export class IssuesService extends ServiceHelpers {
-    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/Issues/", platformLocation);
+    constructor(http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/Issues/", href);
     }
 
     public getCategories(): Observable<IIssueCategory[]> {
diff --git a/src/Ombi/ClientApp/src/app/services/job.service.ts b/src/Ombi/ClientApp/src/app/services/job.service.ts
index 05425683f..c855b354b 100644
--- a/src/Ombi/ClientApp/src/app/services/job.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/job.service.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Injectable } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Injectable, Inject } from "@angular/core";
 
 import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs";
@@ -8,8 +8,8 @@ import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
 export class JobService extends ServiceHelpers {
-    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/Job/", platformLocation);
+    constructor(http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/Job/", href);
     }
     public forceUpdate(): Observable<boolean> {
         return this.http.post<boolean>(`${this.url}update/`, {headers: this.headers});
diff --git a/src/Ombi/ClientApp/src/app/services/landingpage.service.ts b/src/Ombi/ClientApp/src/app/services/landingpage.service.ts
index 22964ff71..f2e7f7967 100644
--- a/src/Ombi/ClientApp/src/app/services/landingpage.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/landingpage.service.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Injectable } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Injectable, Inject } from "@angular/core";
 import { Observable } from "rxjs";
 
 import { HttpClient } from "@angular/common/http";
@@ -9,8 +9,8 @@ import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
 export class LandingPageService extends ServiceHelpers {
-    constructor(public http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/LandingPage/", platformLocation);
+    constructor(public http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/LandingPage/", href);
     }
 
     public getServerStatus(): Observable<IMediaServerStatus> {
diff --git a/src/Ombi/ClientApp/src/app/services/mobile.service.ts b/src/Ombi/ClientApp/src/app/services/mobile.service.ts
index 9ff9b947d..177f1f35f 100644
--- a/src/Ombi/ClientApp/src/app/services/mobile.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/mobile.service.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Injectable } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Injectable, Inject } from "@angular/core";
 
 import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs";
@@ -9,8 +9,8 @@ import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
 export class MobileService extends ServiceHelpers {
-    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/mobile/", platformLocation);
+    constructor(http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/mobile/", href);
     }
     public getUserDeviceList(): Observable<IMobileUsersViewModel[]> {
         return this.http.get<IMobileUsersViewModel[]>(`${this.url}notification/`, {headers: this.headers});
diff --git a/src/Ombi/ClientApp/src/app/services/notificationMessage.service.ts b/src/Ombi/ClientApp/src/app/services/notificationMessage.service.ts
index 93727c5d2..046f14bf0 100644
--- a/src/Ombi/ClientApp/src/app/services/notificationMessage.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/notificationMessage.service.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Injectable } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Injectable, Inject } from "@angular/core";
 
 import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs";
@@ -10,8 +10,8 @@ import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
 export class NotificationMessageService extends ServiceHelpers {
-    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/notifications/", platformLocation);
+    constructor(http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/notifications/", href);
     }
     public sendMassEmail(model: IMassEmailModel): Observable<boolean> {
         return this.http.post<boolean>(`${this.url}massemail/`, JSON.stringify(model) ,{headers: this.headers});
diff --git a/src/Ombi/ClientApp/src/app/services/recentlyAdded.service.ts b/src/Ombi/ClientApp/src/app/services/recentlyAdded.service.ts
index c062f973b..3183f9cee 100644
--- a/src/Ombi/ClientApp/src/app/services/recentlyAdded.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/recentlyAdded.service.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Injectable } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Injectable, Inject } from "@angular/core";
 
 import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs";
@@ -9,8 +9,8 @@ import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
 export class RecentlyAddedService extends ServiceHelpers {
-    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/recentlyadded/", platformLocation);
+    constructor(http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/recentlyadded/", href);
     }
     public getRecentlyAddedMovies(): Observable<IRecentlyAddedMovies[]> {
         return this.http.get<IRecentlyAddedMovies[]>(`${this.url}movies/`, {headers: this.headers});
diff --git a/src/Ombi/ClientApp/src/app/services/request.service.ts b/src/Ombi/ClientApp/src/app/services/request.service.ts
index e1d548f24..7f15dfdba 100644
--- a/src/Ombi/ClientApp/src/app/services/request.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/request.service.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Injectable } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Injectable, Inject } from "@angular/core";
 
 import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs";
@@ -14,8 +14,8 @@ import { IRemainingRequests } from "../interfaces/IRemainingRequests";
 
 @Injectable()
 export class RequestService extends ServiceHelpers {
-    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/Request/", platformLocation);
+    constructor(http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/Request/", href);
     }
 
     public getRemainingMovieRequests(): Observable<IRemainingRequests> {
diff --git a/src/Ombi/ClientApp/src/app/services/requestV2.service.ts b/src/Ombi/ClientApp/src/app/services/requestV2.service.ts
index 1eca2d6b4..e3ae468b2 100644
--- a/src/Ombi/ClientApp/src/app/services/requestV2.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/requestV2.service.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Injectable } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Injectable, Inject } from "@angular/core";
 
 import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs";
@@ -9,8 +9,8 @@ import { IRequestsViewModel, IMovieRequests, ITvRequests, IChildRequests } from
 
 @Injectable()
 export class RequestServiceV2 extends ServiceHelpers {
-    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v2/Requests/", platformLocation);
+    constructor(http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v2/Requests/", href);
     }
 
     public getMovieRequests(count: number, position: number, sortProperty: string , order: string): Observable<IRequestsViewModel<IMovieRequests>> {
diff --git a/src/Ombi/ClientApp/src/app/services/requestretry.service.ts b/src/Ombi/ClientApp/src/app/services/requestretry.service.ts
index e5c9cabe0..6c8d7040b 100644
--- a/src/Ombi/ClientApp/src/app/services/requestretry.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/requestretry.service.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Injectable } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Injectable, Inject } from "@angular/core";
 
 import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs";
@@ -9,8 +9,8 @@ import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
 export class RequestRetryService extends ServiceHelpers {
-    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/requestretry/", platformLocation);
+    constructor(http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/requestretry/", href);
     }
     public getFailedRequests(): Observable<IFailedRequestsViewModel[]> {
         return this.http.get<IFailedRequestsViewModel[]>(this.url, {headers: this.headers});
diff --git a/src/Ombi/ClientApp/src/app/services/search.service.ts b/src/Ombi/ClientApp/src/app/services/search.service.ts
index 5379e23e7..3b4da673a 100644
--- a/src/Ombi/ClientApp/src/app/services/search.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/search.service.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Injectable } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Injectable, Inject } from "@angular/core";
 
 import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs";
@@ -12,8 +12,8 @@ import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
 export class SearchService extends ServiceHelpers {
-    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/search", platformLocation);
+    constructor(http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/search", href);
     }
 
     // Movies
diff --git a/src/Ombi/ClientApp/src/app/services/searchV2.service.ts b/src/Ombi/ClientApp/src/app/services/searchV2.service.ts
index fa1fb61be..a5ae6fa17 100644
--- a/src/Ombi/ClientApp/src/app/services/searchV2.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/searchV2.service.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Injectable } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Injectable, Inject } from "@angular/core";
 
 import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs";
@@ -13,8 +13,8 @@ import { ISearchTvResultV2 } from "../interfaces/ISearchTvResultV2";
 
 @Injectable()
 export class SearchV2Service extends ServiceHelpers {
-    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v2/search", platformLocation);
+    constructor(http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v2/search", href);
     }
 
     public multiSearch(searchTerm: string): Observable<IMultiSearchResult[]> {
diff --git a/src/Ombi/ClientApp/src/app/services/service.helpers.ts b/src/Ombi/ClientApp/src/app/services/service.helpers.ts
index c57eae464..05fe321d2 100644
--- a/src/Ombi/ClientApp/src/app/services/service.helpers.ts
+++ b/src/Ombi/ClientApp/src/app/services/service.helpers.ts
@@ -4,8 +4,8 @@ import { HttpClient, HttpHeaders } from "@angular/common/http";
 export class ServiceHelpers {
 
     protected headers = new HttpHeaders();
-    constructor(protected http: HttpClient, protected url: string, protected platformLocation: PlatformLocation) {
-        const base = platformLocation.getBaseHrefFromDOM();
+    constructor(protected http: HttpClient, protected url: string, protected href: string) {
+        const base = href;
         this.headers = new HttpHeaders().set("Content-Type","application/json");
         if (base.length > 1) {
             this.url = base + this.url;
diff --git a/src/Ombi/ClientApp/src/app/services/settings.service.ts b/src/Ombi/ClientApp/src/app/services/settings.service.ts
index 64a6edd14..5698892ec 100644
--- a/src/Ombi/ClientApp/src/app/services/settings.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/settings.service.ts
@@ -1,6 +1,6 @@
-import { PlatformLocation } from "@angular/common";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
 import { HttpClient } from "@angular/common/http";
-import { Injectable } from "@angular/core";
+import { Injectable, Inject } from "@angular/core";
 import { Observable } from "rxjs";
 
 import {
@@ -40,8 +40,8 @@ import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
 export class SettingsService extends ServiceHelpers {
-    constructor(public http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/Settings", platformLocation);
+    constructor(public http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/Settings", href);
     }
 
     public about(): Observable<IAbout> {
diff --git a/src/Ombi/ClientApp/src/app/services/status.service.ts b/src/Ombi/ClientApp/src/app/services/status.service.ts
index 795fb1bf1..dd252e607 100644
--- a/src/Ombi/ClientApp/src/app/services/status.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/status.service.ts
@@ -1,5 +1,5 @@
-import { PlatformLocation } from "@angular/common";
-import { Injectable } from "@angular/core";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
+import { Injectable, Inject } from "@angular/core";
 
 import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs";
@@ -8,8 +8,8 @@ import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
 export class StatusService extends ServiceHelpers {
-    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/status/", platformLocation);
+    constructor(http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/status/", href);
     }
     public getWizardStatus(): Observable<any> {
         return this.http.get(`${this.url}Wizard/`, {headers: this.headers});
diff --git a/src/Ombi/ClientApp/src/app/services/vote.service.ts b/src/Ombi/ClientApp/src/app/services/vote.service.ts
index 375f0fc33..a670c65b8 100644
--- a/src/Ombi/ClientApp/src/app/services/vote.service.ts
+++ b/src/Ombi/ClientApp/src/app/services/vote.service.ts
@@ -1,14 +1,14 @@
-import { PlatformLocation } from "@angular/common";
+import { PlatformLocation, APP_BASE_HREF } from "@angular/common";
 import { HttpClient } from "@angular/common/http";
-import { Injectable } from "@angular/core";
+import { Injectable, Inject } from "@angular/core";
 
 import { IVoteEngineResult, IVoteViewModel } from "../interfaces";
 import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
 export class VoteService extends ServiceHelpers {
-    constructor(public http: HttpClient, public platformLocation: PlatformLocation) {
-        super(http, "/api/v1/Vote/", platformLocation);
+    constructor(public http: HttpClient, @Inject(APP_BASE_HREF) href:string) {
+        super(http, "/api/v1/Vote/", href);
     }
 
     public async getModel(): Promise<IVoteViewModel[]> {
diff --git a/src/Ombi/ClientApp/src/app/settings/settingsmenu.component.html b/src/Ombi/ClientApp/src/app/settings/settingsmenu.component.html
index a8e94b89a..37a8e65c1 100644
--- a/src/Ombi/ClientApp/src/app/settings/settingsmenu.component.html
+++ b/src/Ombi/ClientApp/src/app/settings/settingsmenu.component.html
@@ -5,7 +5,7 @@
   <button mat-menu-item [routerLink]="['/Settings/Customization']">Customization</button>
   <button mat-menu-item [routerLink]="['/Settings/LandingPage']">Landing Page</button>
   <button mat-menu-item [routerLink]="['/Settings/Issues']">Issues</button>
-  <button mat-menu-item [routerLink]="['/Settings/Usermanagement']">User Management</button>
+  <button mat-menu-item [routerLink]="['/Settings/UserManagement']">User Management</button>
   <button mat-menu-item [routerLink]="['/Settings/Authentication']">Authentication</button>
   <button mat-menu-item [routerLink]="['/Settings/Vote']">Vote</button>
 </mat-menu>
diff --git a/src/Ombi/ClientApp/src/app/shared/functions/common-functions.ts b/src/Ombi/ClientApp/src/app/shared/functions/common-functions.ts
new file mode 100644
index 000000000..aa72bd69d
--- /dev/null
+++ b/src/Ombi/ClientApp/src/app/shared/functions/common-functions.ts
@@ -0,0 +1,6 @@
+export function getBaseLocation() {
+    debugger;
+    let paths: string[] = location.pathname.split('/').splice(1, 1);
+    let basePath: string = (paths && paths[0]) || 'discover'; // Default: discover
+    return '/' + basePath;
+}
\ No newline at end of file
diff --git a/src/Ombi/ClientApp/src/app/usermanagement/usermanagement-user.component.ts b/src/Ombi/ClientApp/src/app/usermanagement/usermanagement-user.component.ts
index 9940336ba..d467f02b7 100644
--- a/src/Ombi/ClientApp/src/app/usermanagement/usermanagement-user.component.ts
+++ b/src/Ombi/ClientApp/src/app/usermanagement/usermanagement-user.component.ts
@@ -66,7 +66,6 @@ export class UserManagementUserComponent implements OnInit {
                 password: "",
                 userName: "",
                 userType: UserType.LocalUser,
-                checked: false,
                 hasLoggedIn: false,
                 lastLoggedIn: new Date(),
                 episodeRequestLimit: 0,
diff --git a/src/Ombi/ClientApp/src/app/usermanagement/usermanagement.component.html b/src/Ombi/ClientApp/src/app/usermanagement/usermanagement.component.html
index 5040e53a9..9a6adf97e 100644
--- a/src/Ombi/ClientApp/src/app/usermanagement/usermanagement.component.html
+++ b/src/Ombi/ClientApp/src/app/usermanagement/usermanagement.component.html
@@ -2,139 +2,121 @@
 
 
 
-<button type="button" class="btn btn-success-outline" data-test="adduserbtn" [routerLink]="['/usermanagement/user']">Add User To Ombi</button>
+<button type="button" mat-raised-button color="primary" data-test="adduserbtn" [routerLink]="['/usermanagement/user']">Add User To Ombi</button>
 
-<button type="button" style="float:right;" class="btn btn-primary-outline"(click)="showBulkEdit = !showBulkEdit" [disabled]="!hasChecked()">Bulk Edit</button>
+<button type="button" style="float:right;" mat-raised-button color="primary" (click)="showBulkEdit = !showBulkEdit" [disabled]="this.selection.selected.length <= 0">Bulk Edit</button>
 
-<!-- Table -->
-<table class="table table-striped table-hover table-responsive table-condensed table-usermanagement">
-    <thead>
-        <tr>
-            <th style="width:1%">
-                <a>
-                        <td class="checkbox" data-label="Select:">
-                                <input id="all" type="checkbox" ng-checked="checkAll" (change)="checkAllBoxes()">
-                                <label for="all"></label>
-                            </td>
-                </a>
-            </th>
-            <th class="active" (click)="setOrder('userName', $event)">
-                <a>
-                    Username
-                </a>
-                <span *ngIf="order === 'userName'">
-                    <span [hidden]="reverse"><i class="fa fa-arrow-down" aria-hidden="true"></i></span><span [hidden]="!reverse"><i class="fa fa-arrow-up" aria-hidden="true"></i></span>
-                </span>
-            </th>
-            <th (click)="setOrder('alias', $event)">
-                <a>
-                    Alias
-                </a>
-                <span *ngIf="order === 'alias'">
-                    <span [hidden]="reverse"><i class="fa fa-arrow-down" aria-hidden="true"></i></span><span [hidden]="!reverse"><i class="fa fa-arrow-up" aria-hidden="true"></i></span>
-                </span>
-            </th>
-            <th (click)="setOrder('emailAddress', $event)">
-                <a>
-                    Email
-                </a>
-                <span *ngIf="order === 'emailAddress'">
-                    <span [hidden]="reverse"><i class="fa fa-arrow-down" aria-hidden="true"></i></span>
-                    <span [hidden]="!reverse"><i class="fa fa-arrow-up" aria-hidden="true"></i></span>
-                </span>
-            </th>
-            <th>
-                Roles
-            </th>
-            <th>
-                Requests Remaining
-            </th>
-            <th>
-                Next Request Due
-            </th>
-            <th (click)="setOrder('lastLoggedIn', $event)">
-               <a> Last Logged In</a>
-               <span *ngIf="order === 'lastLoggedIn'">
-                <span [hidden]="reverse"><i class="fa fa-arrow-down" aria-hidden="true"></i></span><span [hidden]="!reverse"><i class="fa fa-arrow-up" aria-hidden="true"></i></span>
-            </span>
-            </th>
-            <th (click)="setOrder('userType', $event)">
-                <a>
-                    User Type
-                </a>
-                <span *ngIf="order === 'userType'">
-                    <span [hidden]="reverse"><i class="fa fa-arrow-down" aria-hidden="true"></i></span><span [hidden]="!reverse"><i class="fa fa-arrow-up" aria-hidden="true"></i></span>
-                </span>
-            </th>
-        </tr>
-    </thead>
-    <tbody>
-        <tr *ngFor="let u of users | orderBy: order : reverse : 'case-insensitive'">
-            <td class="checkbox" data-label="Select:">
-                <input id="{{u.id}}" type="checkbox" [(ngModel)]="u.checked">
-                <label for="{{u.id}}"></label>
-            </td>
-            <td class="td-labelled" data-label="Username:">
-                {{u.userName}}
-            </td>
-            <td class="td-labelled" data-label="Alias:">
-                {{u.alias}}
-            </td>
-            <td class="td-labelled" data-label="Email:">
-                {{u.emailAddress}}
-            </td>
-            <td class="td-labelled" data-label="Roles:">
-                <div *ngFor="let claim of u.claims">
+<table *ngIf="dataSource" mat-table [dataSource]="dataSource" matSort class="mat-elevation-z8">
+
+        <ng-container matColumnDef="select">
+                <th mat-header-cell *matHeaderCellDef>
+                  <mat-checkbox (change)="$event ? masterToggle() : null"
+                                [checked]="selection.hasValue() && isAllSelected()"
+                                [indeterminate]="selection.hasValue() && !isAllSelected()"
+                                [aria-label]="checkboxLabel()">
+                  </mat-checkbox>
+                </th>
+                <td mat-cell *matCellDef="let row">
+                  <mat-checkbox (click)="$event.stopPropagation()"
+                                (change)="$event ? selection.toggle(row) : null"
+                                [checked]="selection.isSelected(row)"
+                                [aria-label]="checkboxLabel(row)">
+                  </mat-checkbox>
+                </td>
+              </ng-container>
+
+    <ng-container matColumnDef="username">
+      <th mat-header-cell *matHeaderCellDef mat-sort-header> Username </th>
+      <td mat-cell *matCellDef="let element"> {{element.userName}} </td>
+    </ng-container>
+  
+    <ng-container matColumnDef="alias">
+      <th mat-header-cell *matHeaderCellDef mat-sort-header> Alias </th>
+      <td mat-cell *matCellDef="let element"> {{element.alias}} </td>
+    </ng-container>
+  
+    <ng-container matColumnDef="email">
+            <th mat-header-cell *matHeaderCellDef mat-sort-header> Email </th>
+            <td mat-cell *matCellDef="let element"> {{element.emailAddress}} </td>
+          </ng-container>
+
+          <ng-container matColumnDef="remainingRequests">
+                <th mat-header-cell *matHeaderCellDef> Requests Remaining </th>
+                <td mat-cell *matCellDef="let u"> 
+                        <div *ngIf="u.movieRequestQuota != null && u.movieRequestQuota.hasLimit">
+                                {{'UserManagment.MovieRemaining' | translate: {remaining: u.movieRequestQuota.remaining, total: u.movieRequestLimit} }}
+                            </div>
+                            <div *ngIf="u.episodeRequestQuota != null && u.episodeRequestQuota.hasLimit">
+                                {{'UserManagment.TvRemaining' | translate: {remaining: u.episodeRequestQuota.remaining, total: u.episodeRequestLimit} }}
+                            </div>
+                            <div *ngIf="u.musicRequestQuota != null && u.musicRequestQuota.hasLimit">
+                                {{'UserManagment.MusicRemaining' | translate: {remaining: u.musicRequestQuota.remaining, total: u.musicRequestLimit} }}
+                            </div>
+                </td>
+              </ng-container>
+
+              <ng-container matColumnDef="nextRequestDue">
+                    <th mat-header-cell *matHeaderCellDef>  Next Request Due </th>
+                    <td mat-cell *matCellDef="let u"> 
+                            <div *ngIf="u.movieRequestQuota != null && u.movieRequestQuota.remaining != u.movieRequestLimit">
+                                    {{'UserManagment.MovieDue' | translate: {date: (u.movieRequestQuota.nextRequest | amLocal | amDateFormat: 'l LT')} }}
+                                </div>
+                                <div *ngIf="u.episodeRequestQuota != null && u.episodeRequestQuota.remaining != u.episodeRequestLimit">
+                                    {{'UserManagment.TvDue' | translate: {date: (u.episodeRequestQuota.nextRequest  | amLocal | amDateFormat: 'l LT')} }}
+                                </div>
+                                <div *ngIf="u.musicRequestQuota != null && u.musicRequestQuota.remaining != u.musicRequestLimit">
+                                    {{'UserManagment.MusicDue' | translate: {date: (u.musicRequestQuota.nextRequest  | amLocal | amDateFormat: 'l LT')} }}
+                                </div>
+                    </td>
+                  </ng-container>
+                  <ng-container matColumnDef="lastLoggedIn">
+                        <th mat-header-cell *matHeaderCellDef mat-sort-header>  Last Logged In </th>
+                        <td mat-cell *matCellDef="let u"> 
+                                <span *ngIf="u.lastLoggedIn">
+                                        {{u.lastLoggedIn  | amLocal | amDateFormat: 'l LT'}}
+                                    </span>                
+                                    <span *ngIf="!u.lastLoggedIn">
+                                        Not logged in yet!
+                                    </span> </td>
+                      </ng-container>
+
+                      <ng-container matColumnDef="userType">
+                            <th mat-header-cell *matHeaderCellDef mat-sort-header>  User Type </th>
+                            <td mat-cell *matCellDef="let u">
+                                    <span *ngIf="u.userType === 1">Local User</span>
+                                    <span *ngIf="u.userType === 2">Plex User</span>
+                                    <span *ngIf="u.userType === 3">Emby User</span> </td>
+                          </ng-container>
+  
+    <ng-container matColumnDef="roles">
+      <th mat-header-cell *matHeaderCellDef> Roles </th>
+      <td mat-cell *matCellDef="let element"> 
+            <div *ngFor="let claim of element.claims">
                     <span *ngIf="claim.enabled">{{claim.value}}</span>
                 </div>
+             </td>
+    </ng-container>
 
+    <ng-container matColumnDef="actions">
+            <th mat-header-cell *matHeaderCellDef> </th>
+            <td mat-cell *matCellDef="let u">
+              <button mat-raised-button color="accent" [routerLink]="['/usermanagement/user/' + u.id]">Details/Edit</button>
             </td>
-            <td class="td-labelled" data-label="Requests Remaining">
-                <div *ngIf="u.movieRequestQuota != null && u.movieRequestQuota.hasLimit">
-                    {{'UserManagment.MovieRemaining' | translate: {remaining: u.movieRequestQuota.remaining, total: u.movieRequestLimit} }}
-                </div>
-                <div *ngIf="u.episodeRequestQuota != null && u.episodeRequestQuota.hasLimit">
-                    {{'UserManagment.TvRemaining' | translate: {remaining: u.episodeRequestQuota.remaining, total: u.episodeRequestLimit} }}
-                </div>
-                <div *ngIf="u.musicRequestQuota != null && u.musicRequestQuota.hasLimit">
-                    {{'UserManagment.MusicRemaining' | translate: {remaining: u.musicRequestQuota.remaining, total: u.musicRequestLimit} }}
-                </div>
-            </td>
-            <td class="td-labelled" data-label="Request Due">
-                <div *ngIf="u.movieRequestQuota != null && u.movieRequestQuota.remaining != u.movieRequestLimit">
-                    {{'UserManagment.MovieDue' | translate: {date: (u.movieRequestQuota.nextRequest | amLocal | amDateFormat: 'l LT')} }}
-                </div>
-                <div *ngIf="u.episodeRequestQuota != null && u.episodeRequestQuota.remaining != u.episodeRequestLimit">
-                    {{'UserManagment.TvDue' | translate: {date: (u.episodeRequestQuota.nextRequest  | amLocal | amDateFormat: 'l LT')} }}
-                </div>
-                <div *ngIf="u.musicRequestQuota != null && u.musicRequestQuota.remaining != u.musicRequestLimit">
-                    {{'UserManagment.MusicDue' | translate: {date: (u.musicRequestQuota.nextRequest  | amLocal | amDateFormat: 'l LT')} }}
-                </div>
-            </td>
-            <td class="td-labelled" data-label="Last Logged In:">
-                <!-- {{u.lastLoggedIn | date: 'short'}} -->
-                <span *ngIf="u.lastLoggedIn">
-                    {{u.lastLoggedIn  | amLocal | amDateFormat: 'l LT'}}
-                </span>                
-                <span *ngIf="!u.lastLoggedIn">
-                    Not logged in yet!
-                </span>
+          </ng-container>
+
+          <ng-container matColumnDef="welcome">
+                <th mat-header-cell *matHeaderCellDef> </th>
+                <td mat-cell *matCellDef="let u">
+                  <button *ngIf="!u.hasLoggedIn" mat-raised-button color="accent"  (click)="welcomeEmail(u)" [disabled]="!customizationSettings.applicationUrl">Send Welcome Email</button>
+                </td>
+              </ng-container>
+  
+    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+    <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
+  </table>
+
+<!-- Table -->
 
-            </td>
-            <td class="td-labelled" data-label="User Type:">
-                <span *ngIf="u.userType === 1">Local User</span>
-                <span *ngIf="u.userType === 2">Plex User</span>
-                <span *ngIf="u.userType === 3">Emby User</span>
-            </td>
-            <td>
-                <a id="edit{{u.userName}}" [routerLink]="['/usermanagement/user/' + u.id]" class="btn btn-sm btn-info-outline">Details/Edit</a>
-            </td>
-            <td *ngIf="customizationSettings">
-                <button *ngIf="!u.hasLoggedIn" (click)="welcomeEmail(u)" [disabled]="!customizationSettings.applicationUrl" class="btn btn-sm btn-info-outline">Send Welcome Email</button>
-            </td>
-        </tr>
-    </tbody>
-</table>
 
 
 <p-sidebar [(visible)]="showBulkEdit" position="right" styleClass="ui-sidebar-md side-back">
diff --git a/src/Ombi/ClientApp/src/app/usermanagement/usermanagement.component.ts b/src/Ombi/ClientApp/src/app/usermanagement/usermanagement.component.ts
index 98ec35081..8c76b2ac6 100644
--- a/src/Ombi/ClientApp/src/app/usermanagement/usermanagement.component.ts
+++ b/src/Ombi/ClientApp/src/app/usermanagement/usermanagement.component.ts
@@ -1,21 +1,25 @@
-import { Component, OnInit } from "@angular/core";
+import { Component, OnInit, ViewChild } from "@angular/core";
 
 import { ICheckbox, ICustomizationSettings, IEmailNotificationSettings, IUser } from "../interfaces";
 import { IdentityService, NotificationService, SettingsService } from "../services";
+import { MatSort, MatTableDataSource } from "@angular/material";
+import { SelectionModel } from "@angular/cdk/collections";
 
 @Component({
     templateUrl: "./usermanagement.component.html",
 })
 export class UserManagementComponent implements OnInit {
 
+    public displayedColumns: string[] = ['select', 'username', 'alias', 'email', 'roles', 'remainingRequests',
+        'nextRequestDue', 'lastLoggedIn', 'userType', 'actions', 'welcome'];
+    public dataSource: MatTableDataSource<IUser>;
+
+    public selection = new SelectionModel<IUser>(true, []);
+    @ViewChild(MatSort) public sort: MatSort;
     public users: IUser[];
     public checkAll = false;
     public emailSettings: IEmailNotificationSettings;
     public customizationSettings: ICustomizationSettings;
-
-    public order: string = "userName";
-    public reverse = false;
-
     public showBulkEdit = false;
     public availableClaims: ICheckbox[];
     public bulkMovieLimit?: number;
@@ -23,15 +27,15 @@ export class UserManagementComponent implements OnInit {
     public plexEnabled: boolean;
 
     constructor(private identityService: IdentityService,
-                private settingsService: SettingsService,
-                private notificationService: NotificationService,
-                private plexSettings: SettingsService) { }
-
-    public ngOnInit() {
-        this.users = [];
-        this.identityService.getUsers().subscribe(x => {
-            this.users = x;
-        });
+        private settingsService: SettingsService,
+        private notificationService: NotificationService,
+        private plexSettings: SettingsService) { }
+
+    public async ngOnInit() {
+        this.users = await this.identityService.getUsers().toPromise();
+        
+        this.dataSource = new MatTableDataSource(this.users);
+        this.dataSource.sort = this.sort;
 
         this.plexSettings.getPlex().subscribe(x => this.plexEnabled = x.enable);
 
@@ -59,28 +63,12 @@ export class UserManagementComponent implements OnInit {
         this.notificationService.success(`Sent a welcome email to ${user.emailAddress}`);
     }
 
-    public checkAllBoxes() {
-        this.checkAll = !this.checkAll;
-        this.users.forEach(user => {
-            user.checked = this.checkAll;
-        });
-    }
-
-    public hasChecked(): boolean {
-        return this.users.some(x => {
-            return x.checked;
-        });
-    }
-
     public bulkUpdate() {
         const anyRoles = this.availableClaims.some(x => {
             return x.enabled;
         });
 
-        this.users.forEach(x => {
-            if (!x.checked) {
-                return;
-            }
+        this.selection.selected.forEach(x => {
             if (anyRoles) {
                 x.claims = this.availableClaims;
             }
@@ -103,23 +91,24 @@ export class UserManagementComponent implements OnInit {
         this.bulkEpisodeLimit = undefined;
     }
 
-    public setOrder(value: string, el: any) {
-        el = el.toElement || el.relatedTarget || el.target || el.srcElement;
+    public isAllSelected() {
+        const numSelected = this.selection.selected.length;
+        const numRows = this.dataSource.data.length;
+        return numSelected === numRows;
+    }
 
-        if (el.nodeName === "A") {
-            el = el.parentElement;
-        }
 
-        const parent = el.parentElement;
-        const previousFilter = parent.querySelector(".active");
+    public masterToggle() {
+        this.isAllSelected() ?
+            this.selection.clear() :
+            this.dataSource.data.forEach(row => this.selection.select(row));
+    }
 
-        if (this.order === value) {
-            this.reverse = !this.reverse;
-        } else {
-            previousFilter.className = "";
-            el.className = "active";
+    /** The label for the checkbox on the passed row */
+    public checkboxLabel(row?: IUser): string {
+        if (!row) {
+            return `${this.isAllSelected() ? 'select' : 'deselect'} all`;
         }
-
-        this.order = value;
+        return `${this.selection.isSelected(row) ? 'deselect' : 'select'} row ${row.id + 1}`;
     }
 }
diff --git a/src/Ombi/ClientApp/src/index.html b/src/Ombi/ClientApp/src/index.html
index e2b1bfbc2..6445278d6 100644
--- a/src/Ombi/ClientApp/src/index.html
+++ b/src/Ombi/ClientApp/src/index.html
@@ -3,7 +3,7 @@
 
 <head>
 
-  <script>
+  <!-- <script>
 
     const existingBaseUrl = window.localStorage.getItem("baseUrl");
     if (existingBaseUrl && existingBaseUrl.length === 0) {
@@ -48,7 +48,7 @@
         return str.indexOf(suffix, str.length - suffix.length) !== -1;
       }
     }
-  </script>
+  </script> -->
   <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
   <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet">
   <meta charset="utf-8" />