Updated the UI JWT framework

src/Ombi/ClientApp/app/app.module.ts

@@ -8,6 +8,8 @@ import {BrowserModule} from "@angular/platform-browser";
 import {BrowserAnimationsModule} from "@angular/platform-browser/animations";
 import {RouterModule, Routes} from "@angular/router";
 
+import { JwtModule } from "@auth0/angular-jwt";
+
 // Third Party
 //import { DragulaModule, DragulaService } from 'ng2-dragula/ng2-dragula';
 import { NgbModule } from "@ng-bootstrap/ng-bootstrap";
@@ -27,7 +29,6 @@ import { TokenResetPasswordComponent } from "./login/tokenresetpassword.componen
 
 // Services
 import { AuthGuard } from "./auth/auth.guard";
-import { AuthModule } from "./auth/auth.module";
 import { AuthService } from "./auth/auth.service";
 import { IdentityService } from "./services";
 import { ImageService } from "./services";
@@ -78,7 +79,6 @@ export function HttpLoaderFactory(http: HttpClient, platformLocation: PlatformLo
         SettingsModule,
         DataTableModule,
         SharedModule,
-        AuthModule,
         WizardModule,
         SearchModule,
         DialogModule,
@@ -94,6 +94,17 @@ export function HttpLoaderFactory(http: HttpClient, platformLocation: PlatformLo
         TooltipModule,
         ConfirmDialogModule,
         CommonModule, 
+        JwtModule.forRoot({
+            config: {
+              tokenGetter: () => {
+                  const token = localStorage.getItem("id_token");
+                  if (!token) {
+                      return "";
+                  }
+                  return token;
+                },
+            },
+          }),
         TranslateModule.forRoot({
             loader: {
                 provide: TranslateLoader,

src/Ombi/ClientApp/app/auth/auth.guard.ts

@@ -13,6 +13,7 @@ export class AuthGuard implements CanActivate {
         if (this.auth.loggedIn()) {
             return true;
         } else {
+            localStorage.removeItem("token");
             this.router.navigate(["login"]);
             return false;
         }

src/Ombi/ClientApp/app/auth/auth.module.ts

@@ -1,35 +0,0 @@
-import { NgModule } from "@angular/core";
-import { Http, RequestOptions } from "@angular/http";
-import { RouterModule, Routes } from "@angular/router";
-import { AuthConfig, AuthHttp } from "angular2-jwt";
-import { CookieService } from "ng2-cookies";
-import { CookieComponent } from "./cookie.component";
-
-export function authHttpServiceFactory(http: Http, options: RequestOptions) {
-  return new AuthHttp(new AuthConfig({
-    tokenName: "id_token",
-    tokenGetter: (() => localStorage.getItem("id_token")!),
-    globalHeaders: [{ "Content-Type": "application/json" }],
-  }), http, options);
-}
-const routes: Routes = [
-  { path: "auth/cookie", component: CookieComponent  },
-];
-
-@NgModule({
-  imports : [
-    RouterModule.forChild(routes),
-  ],
-  declarations:[
-    CookieComponent,
-  ],
-  providers: [
-    {
-      provide: AuthHttp,
-      useFactory: authHttpServiceFactory,
-      deps: [Http, RequestOptions],
-    },
-    CookieService,
-  ],
-})
-export class AuthModule { }

src/Ombi/ClientApp/app/auth/auth.service.ts

@@ -1,7 +1,7 @@
 import { PlatformLocation } from "@angular/common";
+import { HttpClient } from "@angular/common/http";
 import { Injectable } from "@angular/core";
-import { Headers, Http } from "@angular/http";
+import { JwtHelperService } from "@auth0/angular-jwt";
-import { JwtHelper, tokenNotExpired } from "angular2-jwt";
 import { Observable } from "rxjs/Rx";
 
 import { ServiceHelpers } from "../services";
@@ -9,22 +9,24 @@ import { ILocalUser, IUserLogin } from "./IUserLogin";
 
 @Injectable()
 export class AuthService extends ServiceHelpers {
-    public jwtHelper: JwtHelper = new JwtHelper();
 
-    constructor(http: Http, public platformLocation: PlatformLocation) {
+    constructor(http: HttpClient, public platformLocation: PlatformLocation, private jwtHelperService: JwtHelperService) {
         super(http, "/api/v1/token", platformLocation);
     }
 
     public login(login: IUserLogin): Observable<any> {
-        this.headers = new Headers();
+        return this.http.post(`${this.url}/`, JSON.stringify(login), {headers: this.headers});
-        this.headers.append("Content-Type", "application/json");
-
-        return this.http.post(`${this.url}/`, JSON.stringify(login), { headers: this.headers })
-            .map(this.extractData);
     }
 
     public loggedIn() {    
-        return tokenNotExpired("id_token");
+        const token: string = this.jwtHelperService.tokenGetter();
+        
+        if (!token) {
+            return false;
+        }
+        
+        const tokenExpired: boolean = this.jwtHelperService.isTokenExpired(token);
+        return !tokenExpired;
     }
 
     public claims(): ILocalUser {
@@ -33,7 +35,7 @@ export class AuthService extends ServiceHelpers {
             if (!token) {
                 throw new Error("Invalid token");
             }
-            const json = this.jwtHelper.decodeToken(token);
+            const json = this.jwtHelperService.decodeToken(token);
             const roles = json.role;
             const name = json.sub;
 

src/Ombi/ClientApp/app/services/applications/couchpotato.service.ts

@@ -1,23 +1,23 @@
 import { PlatformLocation } from "@angular/common";
+import { HttpClient } from "@angular/common/http";
 import { Injectable } from "@angular/core";
-import { AuthHttp } from "angular2-jwt";
 import { Observable } from "rxjs/Rx";
 
-import { ServiceAuthHelpers } from "../service.helpers";
+import { ServiceHelpers } from "../service.helpers";
 
 import { ICouchPotatoApiKey, ICouchPotatoProfiles, ICouchPotatoSettings } from "../../interfaces";
 
 @Injectable()
-export class CouchPotatoService extends ServiceAuthHelpers {
+export class CouchPotatoService extends ServiceHelpers {
-    constructor(http: AuthHttp, public platformLocation: PlatformLocation) {
+    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
         super(http, "/api/v1/CouchPotato/", platformLocation);
     }
 
     public getProfiles(settings: ICouchPotatoSettings): Observable<ICouchPotatoProfiles> {
-        return this.http.post(`${this.url}profile`, JSON.stringify(settings), { headers: this.headers }).map(this.extractData);
+        return this.http.post<ICouchPotatoProfiles>(`${this.url}profile`, JSON.stringify(settings),  {headers: this.headers});
     }
 
     public getApiKey(settings: ICouchPotatoSettings): Observable<ICouchPotatoApiKey> {
-        return this.http.post(`${this.url}apikey`, JSON.stringify(settings), { headers: this.headers }).map(this.extractData);
+        return this.http.post<ICouchPotatoApiKey>(`${this.url}apikey`, JSON.stringify(settings),  {headers: this.headers});
     }
 }

src/Ombi/ClientApp/app/services/applications/emby.service.ts

@@ -1,24 +1,23 @@
 import { PlatformLocation } from "@angular/common";
+import { HttpClient } from "@angular/common/http";
 import { Injectable } from "@angular/core";
-import { Http } from "@angular/http";
-import { AuthHttp } from "angular2-jwt";
 import { Observable } from "rxjs/Rx";
 
-import { ServiceAuthHelpers } from "../service.helpers";
+import { ServiceHelpers } from "../service.helpers";
 
 import { IEmbySettings, IUsersModel } from "../../interfaces";
 
 @Injectable()
-export class EmbyService extends ServiceAuthHelpers {
+export class EmbyService extends ServiceHelpers {
-    constructor(http: AuthHttp, private regularHttp: Http, public platformLocation: PlatformLocation) {
+    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
         super(http, "/api/v1/Emby/", platformLocation);
     }
 
     public logIn(settings: IEmbySettings): Observable<IEmbySettings> {
-        return this.regularHttp.post(`${this.url}`, JSON.stringify(settings), { headers: this.headers }).map(this.extractData);
+        return this.http.post<IEmbySettings>(`${this.url}`, JSON.stringify(settings),  {headers: this.headers});
     }
     public getUsers(): Observable<IUsersModel[]> {
-        return this.http.get(`${this.url}users`, { headers: this.headers }).map(this.extractData);
+        return this.http.get<IUsersModel[]>(`${this.url}users`, {headers: this.headers});
     }
 
 }

src/Ombi/ClientApp/app/services/applications/plex.service.ts

@@ -1,33 +1,32 @@
 import { PlatformLocation } from "@angular/common";
+import { HttpClient } from "@angular/common/http";
 import { Injectable } from "@angular/core";
-import { Http } from "@angular/http";
 
-import { AuthHttp } from "angular2-jwt";
 import { Observable } from "rxjs/Rx";
 
-import { ServiceAuthHelpers } from "../service.helpers";
+import { ServiceHelpers } from "../service.helpers";
 
 import { IPlexAuthentication, IPlexLibResponse, IPlexServer, IPlexServerViewModel, IUsersModel } from "../../interfaces";
 
 @Injectable()
-export class PlexService extends ServiceAuthHelpers {
+export class PlexService extends ServiceHelpers {
-    constructor(http: AuthHttp, private regularHttp: Http, public platformLocation: PlatformLocation) {
+    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
         super(http, "/api/v1/Plex/", platformLocation);
     }
 
     public logIn(login: string, password: string): Observable<IPlexAuthentication> {
-        return this.regularHttp.post(`${this.url}`, JSON.stringify({ login, password }), { headers: this.headers }).map(this.extractData);
+        return this.http.post<IPlexAuthentication>(`${this.url}`, JSON.stringify({ login, password }),  {headers: this.headers});
     }
 
     public getServers(login: string, password: string): Observable<IPlexServerViewModel> {
-        return this.http.post(`${this.url}servers`, JSON.stringify({ login, password }), { headers: this.headers }).map(this.extractData);
+        return this.http.post<IPlexServerViewModel>(`${this.url}servers`, JSON.stringify({ login, password }),  {headers: this.headers});
     }
 
     public getLibraries(plexSettings: IPlexServer): Observable<IPlexLibResponse> {
-        return this.http.post(`${this.url}Libraries`, JSON.stringify(plexSettings), { headers: this.headers }).map(this.extractData).catch(this.handleError);
+        return this.http.post<IPlexLibResponse>(`${this.url}Libraries`, JSON.stringify(plexSettings),  {headers: this.headers});
     }
 
     public getFriends(): Observable<IUsersModel[]> {
-        return this.http.get(`${this.url}Friends`, { headers: this.headers }).map(this.extractData).catch(this.handleError);
+        return this.http.get<IUsersModel[]>(`${this.url}Friends`,  {headers: this.headers});
     }
 }

src/Ombi/ClientApp/app/services/applications/radarr.service.ts

@@ -1,29 +1,29 @@
 import { PlatformLocation } from "@angular/common";
+import { HttpClient } from "@angular/common/http";
 import { Injectable } from "@angular/core";
-import { AuthHttp } from "angular2-jwt";
 import { Observable } from "rxjs/Rx";
 
 import { IRadarrProfile, IRadarrRootFolder } from "../../interfaces";
 import { IRadarrSettings } from "../../interfaces";
-import { ServiceAuthHelpers } from "../service.helpers";
+import { ServiceHelpers } from "../service.helpers";
 
 @Injectable()
-export class RadarrService extends ServiceAuthHelpers {
+export class RadarrService extends ServiceHelpers {
-    constructor(http: AuthHttp, public platformLocation: PlatformLocation) {
+    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
         super(http, "/api/v1/Radarr", platformLocation);
     }
 
     public getRootFolders(settings: IRadarrSettings): Observable<IRadarrRootFolder[]> {
-        return this.http.post(`${this.url}/RootFolders/`, JSON.stringify(settings), { headers: this.headers }).map(this.extractData);
+        return this.http.post<IRadarrRootFolder[]>(`${this.url}/RootFolders/`, JSON.stringify(settings),  {headers: this.headers});
     }
     public getQualityProfiles(settings: IRadarrSettings): Observable<IRadarrProfile[]> {
-        return this.http.post(`${this.url}/Profiles/`, JSON.stringify(settings), { headers: this.headers }).map(this.extractData);
+        return this.http.post<IRadarrProfile[]>(`${this.url}/Profiles/`, JSON.stringify(settings),  {headers: this.headers});
     }
 
     public getRootFoldersFromSettings(): Observable<IRadarrRootFolder[]> {
-        return this.http.get(`${this.url}/RootFolders/`, { headers: this.headers }).map(this.extractData);
+        return this.http.get<IRadarrRootFolder[]>(`${this.url}/RootFolders/`,  {headers: this.headers});
     }
     public getQualityProfilesFromSettings(): Observable<IRadarrProfile[]> {
-        return this.http.get(`${this.url}/Profiles/`, { headers: this.headers }).map(this.extractData);
+        return this.http.get<IRadarrProfile[]>(`${this.url}/Profiles/`,  {headers: this.headers});
     }
 }

src/Ombi/ClientApp/app/services/applications/sonarr.service.ts

@@ -1,22 +1,23 @@
 import { PlatformLocation } from "@angular/common";
 import { Injectable } from "@angular/core";
-import { AuthHttp } from "angular2-jwt";
+
+import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs/Rx";
 
 import { ISonarrSettings } from "../../interfaces";
 import { ISonarrProfile, ISonarrRootFolder } from "../../interfaces";
-import { ServiceAuthHelpers } from "../service.helpers";
+import { ServiceHelpers } from "../service.helpers";
 
 @Injectable()
-export class SonarrService extends ServiceAuthHelpers {
+export class SonarrService extends ServiceHelpers {
-    constructor(http: AuthHttp, public platformLocation: PlatformLocation) {
+    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
         super(http, "/api/v1/Sonarr", platformLocation);
     }
 
     public getRootFolders(settings: ISonarrSettings): Observable<ISonarrRootFolder[]> {
-        return this.http.post(`${this.url}/RootFolders/`, JSON.stringify(settings), { headers: this.headers }).map(this.extractData);
+        return this.http.post<ISonarrRootFolder[]>(`${this.url}/RootFolders/`, JSON.stringify(settings),  {headers: this.headers});
     }
     public getQualityProfiles(settings: ISonarrSettings): Observable<ISonarrProfile[]> {
-        return this.http.post(`${this.url}/Profiles/`, JSON.stringify(settings), { headers: this.headers }).map(this.extractData);
+        return this.http.post<ISonarrProfile[]>(`${this.url}/Profiles/`, JSON.stringify(settings),  {headers: this.headers});
     }
 }

src/Ombi/ClientApp/app/services/applications/tester.service.ts

@@ -1,9 +1,10 @@
 import { PlatformLocation } from "@angular/common";
 import { Injectable } from "@angular/core";
-import { AuthHttp } from "angular2-jwt";
+
+import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs/Rx";
 
-import { ServiceAuthHelpers } from "../service.helpers";
+import { ServiceHelpers } from "../service.helpers";
 
 import {
     ICouchPotatoSettings,
@@ -22,59 +23,59 @@ import {
 } from "../../interfaces";
 
 @Injectable()
-export class TesterService extends ServiceAuthHelpers {
+export class TesterService extends ServiceHelpers {
-    constructor(http: AuthHttp, public platformLocation: PlatformLocation) {
+    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
         super(http, "/api/v1/tester/", platformLocation);
     }
 
     public discordTest(settings: IDiscordNotifcationSettings): Observable<boolean> {
-        return this.http.post(`${this.url}discord`, JSON.stringify(settings), { headers: this.headers }).map(this.extractData);
+        return this.http.post<boolean>(`${this.url}discord`, JSON.stringify(settings),  {headers: this.headers});
     }
 
     public pushbulletTest(settings: IPushbulletNotificationSettings): Observable<boolean> {
-        return this.http.post(`${this.url}pushbullet`, JSON.stringify(settings), { headers: this.headers }).map(this.extractData);
+        return this.http.post<boolean>(`${this.url}pushbullet`, JSON.stringify(settings),  {headers: this.headers});
     }
     public pushoverTest(settings: IPushoverNotificationSettings): Observable<boolean> {
-        return this.http.post(`${this.url}pushover`, JSON.stringify(settings), { headers: this.headers }).map(this.extractData);
+        return this.http.post<boolean>(`${this.url}pushover`, JSON.stringify(settings),  {headers: this.headers});
     }
 
     public mattermostTest(settings: IMattermostNotifcationSettings): Observable<boolean> {
-        return this.http.post(`${this.url}mattermost`, JSON.stringify(settings), { headers: this.headers }).map(this.extractData);
+        return this.http.post<boolean>(`${this.url}mattermost`, JSON.stringify(settings),  {headers: this.headers});
     }
 
     public slackTest(settings: ISlackNotificationSettings): Observable<boolean> {
-        return this.http.post(`${this.url}slack`, JSON.stringify(settings), { headers: this.headers }).map(this.extractData);
+        return this.http.post<boolean>(`${this.url}slack`, JSON.stringify(settings),  {headers: this.headers});
     }
 
     public emailTest(settings: IEmailNotificationSettings): Observable<boolean> {
-        return this.http.post(`${this.url}email`, JSON.stringify(settings), { headers: this.headers }).map(this.extractData);
+        return this.http.post<boolean>(`${this.url}email`, JSON.stringify(settings),  {headers: this.headers});
     }
     
     public plexTest(settings: IPlexServer): Observable<boolean> {
-        return this.http.post(`${this.url}plex`, JSON.stringify(settings), { headers: this.headers }).map(this.extractData);
+        return this.http.post<boolean>(`${this.url}plex`, JSON.stringify(settings),  {headers: this.headers});
     }
 
     public embyTest(settings: IEmbyServer): Observable<boolean> {
-        return this.http.post(`${this.url}emby`, JSON.stringify(settings), { headers: this.headers }).map(this.extractData);
+        return this.http.post<boolean>(`${this.url}emby`, JSON.stringify(settings),  {headers: this.headers});
     }
 
     public radarrTest(settings: IRadarrSettings): Observable<boolean> {
-        return this.http.post(`${this.url}radarr`, JSON.stringify(settings), { headers: this.headers }).map(this.extractData);
+        return this.http.post<boolean>(`${this.url}radarr`, JSON.stringify(settings),  {headers: this.headers});
     }
 
     public sonarrTest(settings: ISonarrSettings): Observable<boolean> {
-        return this.http.post(`${this.url}sonarr`, JSON.stringify(settings), { headers: this.headers }).map(this.extractData);
+        return this.http.post<boolean>(`${this.url}sonarr`, JSON.stringify(settings),  {headers: this.headers});
     }   
 
     public couchPotatoTest(settings: ICouchPotatoSettings): Observable<boolean> {
-        return this.http.post(`${this.url}couchpotato`, JSON.stringify(settings), { headers: this.headers }).map(this.extractData);
+        return this.http.post<boolean>(`${this.url}couchpotato`, JSON.stringify(settings),  {headers: this.headers});
     } 
 
     public telegramTest(settings: ITelegramNotifcationSettings): Observable<boolean> {
-        return this.http.post(`${this.url}telegram`, JSON.stringify(settings), { headers: this.headers }).map(this.extractData);
+        return this.http.post<boolean>(`${this.url}telegram`, JSON.stringify(settings),  {headers: this.headers});
     }
 
     public sickrageTest(settings: ISickRageSettings): Observable<boolean> {
-        return this.http.post(`${this.url}sickrage`, JSON.stringify(settings), { headers: this.headers }).map(this.extractData);
+        return this.http.post<boolean>(`${this.url}sickrage`, JSON.stringify(settings),  {headers: this.headers});
     }
 }

src/Ombi/ClientApp/app/services/identity.service.ts

@@ -1,66 +1,66 @@
 import { PlatformLocation } from "@angular/common";
 import { Injectable } from "@angular/core";
-import { Http } from "@angular/http";
+
-import { AuthHttp } from "angular2-jwt";
+import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs/Rx";
 
 import { ICheckbox, ICreateWizardUser, IIdentityResult, IResetPasswordToken, IUpdateLocalUser, IUser } from "../interfaces";
-import { ServiceAuthHelpers } from "./service.helpers";
+import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
-export class IdentityService extends ServiceAuthHelpers {
+export class IdentityService extends ServiceHelpers {
-    constructor(http: AuthHttp, private regularHttp: Http, public platformLocation: PlatformLocation) {
+    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
         super(http, "/api/v1/Identity/", platformLocation);
     }
     public createWizardUser(user: ICreateWizardUser): Observable<boolean> {
-        return this.regularHttp.post(`${this.url}Wizard/`, JSON.stringify(user), { headers: this.headers }).map(this.extractData).catch(this.handleError);
+        return this.http.post<boolean>(`${this.url}Wizard/`, JSON.stringify(user),  {headers: this.headers});
     }
 
     public getUser(): Observable<IUser> {
-        return this.http.get(this.url).map(this.extractData).catch(this.handleError);
+        return this.http.get<IUser>(this.url,  {headers: this.headers});
     }
 
     public getUserById(id: string): Observable<IUser> {
-        return this.http.get(`${this.url}User/${id}`).map(this.extractData).catch(this.handleError);
+        return this.http.get<IUser>(`${this.url}User/${id}`,  {headers: this.headers});
     }
 
     public getUsers(): Observable<IUser[]> {
-        return this.http.get(`${this.url}Users`).map(this.extractData).catch(this.handleError);
+        return this.http.get<IUser[]>(`${this.url}Users`,  {headers: this.headers});
     }
 
     public getAllAvailableClaims(): Observable<ICheckbox[]> {
-        return this.http.get(`${this.url}Claims`).map(this.extractData).catch(this.handleError);
+        return this.http.get<ICheckbox[]>(`${this.url}Claims`,  {headers: this.headers});
     }
 
     public createUser(user: IUser): Observable<IIdentityResult> {
-        return this.http.post(this.url, JSON.stringify(user), { headers: this.headers }).map(this.extractData).catch(this.handleError);
+        return this.http.post<IIdentityResult>(this.url, JSON.stringify(user), {headers: this.headers});
     }
 
     public updateUser(user: IUser): Observable<IIdentityResult> {
-        return this.http.put(this.url, JSON.stringify(user), { headers: this.headers }).map(this.extractData).catch(this.handleError);
+        return this.http.put<IIdentityResult>(this.url, JSON.stringify(user), {headers: this.headers});
     }
     public updateLocalUser(user: IUpdateLocalUser): Observable<IIdentityResult> {
-        return this.http.put(this.url + "local", JSON.stringify(user), { headers: this.headers }).map(this.extractData).catch(this.handleError);
+        return this.http.put<IIdentityResult>(this.url + "local", JSON.stringify(user), {headers: this.headers});
     }
 
     public deleteUser(user: IUser): Observable<IIdentityResult> {
-        return this.http.delete(`${this.url}${user.id}`, { headers: this.headers }).map(this.extractData).catch(this.handleError);
+        return this.http.delete<IIdentityResult>(`${this.url}${user.id}`, {headers: this.headers});
     }
 
     public hasUserRequested(userId: string): Observable<boolean> {
-         return this.http.get(`${this.url}userhasrequest/${userId}`).map(this.extractData).catch(this.handleError);
+         return this.http.get<boolean>(`${this.url}userhasrequest/${userId}`, {headers: this.headers});
     }
 
     public submitResetPassword(email: string): Observable<IIdentityResult> {
-        return this.regularHttp.post(this.url + "reset", JSON.stringify({email}), { headers: this.headers }).map(this.extractData).catch(this.handleError);
+        return this.http.post<IIdentityResult>(this.url + "reset", JSON.stringify({email}), {headers: this.headers});
     }
 
     public resetPassword(token: IResetPasswordToken): Observable<IIdentityResult> {
-        return this.regularHttp.post(this.url + "resetpassword", JSON.stringify(token), { headers: this.headers }).map(this.extractData).catch(this.handleError);
+        return this.http.post<IIdentityResult>(this.url + "resetpassword", JSON.stringify(token), {headers: this.headers});
     }
 
     public sendWelcomeEmail(user: IUser): Observable<null> {
-        return this.http.post(`${this.url}welcomeEmail`, JSON.stringify(user), { headers: this.headers }).map(this.extractData).catch(this.handleError);
+        return this.http.post<any>(`${this.url}welcomeEmail`, JSON.stringify(user), {headers: this.headers});
     }
 
     public hasRole(role: string): boolean {

src/Ombi/ClientApp/app/services/image.service.ts

@@ -1,22 +1,23 @@
 import { PlatformLocation } from "@angular/common";
 import { Injectable } from "@angular/core";
-import { Http } from "@angular/http";
 import { Observable } from "rxjs/Rx";
 
+import { HttpClient } from "@angular/common/http";
+
 import { IImages } from "../interfaces";
 import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
 export class ImageService extends ServiceHelpers {
-    constructor(public http: Http, public platformLocation: PlatformLocation) {
+    constructor(public http: HttpClient, public platformLocation: PlatformLocation) {
         super(http, "/api/v1/Images/", platformLocation);
     }
 
     public getRandomBackground(): Observable<IImages> {
-        return this.http.get(`${this.url}background/`, { headers: this.headers }).map(this.extractData);
+        return this.http.get<IImages>(`${this.url}background/`, {headers: this.headers});
     }
 
     public getTvBanner(tvdbid: number): Observable<string> {
-        return this.http.get(`${this.url}tv/${tvdbid}`, { headers: this.headers }).map(this.extractData);
+        return this.http.get<string>(`${this.url}tv/${tvdbid}`, {headers: this.headers});
     }
 }

src/Ombi/ClientApp/app/services/job.service.ts

@@ -1,40 +1,41 @@
 import { PlatformLocation } from "@angular/common";
 import { Injectable } from "@angular/core";
-import { AuthHttp } from "angular2-jwt";
+
+import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs/Rx";
 
-import { ServiceAuthHelpers } from "./service.helpers";
+import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
-export class JobService extends ServiceAuthHelpers {
+export class JobService extends ServiceHelpers {
-    constructor(http: AuthHttp, public platformLocation: PlatformLocation) {
+    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
         super(http, "/api/v1/Job/", platformLocation);
     }
     public forceUpdate(): Observable<boolean> {
-        return this.http.post(`${this.url}update/`, { headers: this.headers }).map(this.extractData);
+        return this.http.post<boolean>(`${this.url}update/`, {headers: this.headers});
     }
 
     public checkForNewUpdate(): Observable<boolean> {
-        return this.http.get(`${this.url}update/`).map(this.extractData);
+        return this.http.get<boolean>(`${this.url}update/`, {headers: this.headers});
     }
 
     public getCachedUpdate(): Observable<boolean> {
-        return this.http.get(`${this.url}updateCached/`).map(this.extractData);
+        return this.http.get<boolean>(`${this.url}updateCached/`, {headers: this.headers});
     }
 
     public runPlexImporter(): Observable<boolean> {
-        return this.http.post(`${this.url}plexUserImporter/`, { headers: this.headers }).map(this.extractData);
+        return this.http.post<boolean>(`${this.url}plexUserImporter/`, {headers: this.headers});
     }
 
     public runEmbyImporter(): Observable<boolean> {
-        return this.http.post(`${this.url}embyUserImporter/`, { headers: this.headers }).map(this.extractData);
+        return this.http.post<boolean>(`${this.url}embyUserImporter/`, {headers: this.headers});
     }
 
     public runPlexCacher(): Observable<boolean> {
-        return this.http.post(`${this.url}plexcontentcacher/`, { headers: this.headers }).map(this.extractData);
+        return this.http.post<boolean>(`${this.url}plexcontentcacher/`, {headers: this.headers});
     }
 
     public runEmbyCacher(): Observable<boolean> {
-        return this.http.post(`${this.url}embycontentcacher/`, { headers: this.headers }).map(this.extractData);
+        return this.http.post<boolean>(`${this.url}embycontentcacher/`, {headers: this.headers});
     }
 }

src/Ombi/ClientApp/app/services/landingpage.service.ts

@@ -1,18 +1,19 @@
 import { PlatformLocation } from "@angular/common";
 import { Injectable } from "@angular/core";
-import { Http } from "@angular/http";
 import { Observable } from "rxjs/Rx";
 
+import { HttpClient } from "@angular/common/http";
+
 import { IMediaServerStatus } from "../interfaces";
 import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
 export class LandingPageService extends ServiceHelpers {
-    constructor(public http: Http, public platformLocation: PlatformLocation) {
+    constructor(public http: HttpClient, public platformLocation: PlatformLocation) {
         super(http, "/api/v1/LandingPage/", platformLocation);
     }
 
     public getServerStatus(): Observable<IMediaServerStatus> {
-        return this.http.get(`${this.url}`, { headers: this.headers }).map(this.extractData);
+        return this.http.get<IMediaServerStatus>(`${this.url}`, {headers: this.headers});
     }
 }

src/Ombi/ClientApp/app/services/request.service.ts

@@ -1,125 +1,110 @@
 import { PlatformLocation } from "@angular/common";
 import { Injectable } from "@angular/core";
-import { Http } from "@angular/http";
+
-import { AuthHttp } from "angular2-jwt";
+import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs/Rx";
 
 import { TreeNode } from "primeng/primeng";
 import { IRequestEngineResult } from "../interfaces";
-import { IChildRequests, IMovieRequests, IMovieUpdateModel, IRequestCountModel, IRequestGrid, ITvRequests, ITvUpdateModel } from "../interfaces";
+import { IChildRequests, IMovieRequests, IMovieUpdateModel, ITvRequests, ITvUpdateModel } from "../interfaces";
 import { ISearchMovieResult } from "../interfaces";
 import { ISearchTvResult } from "../interfaces";
-import { ServiceAuthHelpers } from "./service.helpers";
+import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
-export class RequestService extends ServiceAuthHelpers {
+export class RequestService extends ServiceHelpers {
-    constructor(http: AuthHttp, private basicHttp: Http, public platformLocation: PlatformLocation) {
+    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
         super(http, "/api/v1/Request/", platformLocation);
     }
 
     public requestMovie(movie: ISearchMovieResult): Observable<IRequestEngineResult> {
-        return this.http.post(`${this.url}Movie/`, JSON.stringify(movie), { headers: this.headers }).map(this.extractData);
+        return this.http.post<IRequestEngineResult>(`${this.url}Movie/`, JSON.stringify(movie),  {headers: this.headers});
     }
 
     public requestTv(tv: ISearchTvResult): Observable<IRequestEngineResult> {
-        return this.http.post(`${this.url}TV/`, JSON.stringify(tv), { headers: this.headers }).map(this.extractData);
+        return this.http.post<IRequestEngineResult>(`${this.url}TV/`, JSON.stringify(tv), {headers: this.headers});
     }
 
     public approveMovie(movie: IMovieUpdateModel): Observable<IRequestEngineResult> {
-        return this.http.post(`${this.url}Movie/Approve`, JSON.stringify(movie), { headers: this.headers }).map(this.extractData);
+        return this.http.post<IRequestEngineResult>(`${this.url}Movie/Approve`, JSON.stringify(movie),  {headers: this.headers});
     }
 
     public denyMovie(movie: IMovieUpdateModel): Observable<IRequestEngineResult> {
-        return this.http.put(`${this.url}Movie/Deny`, JSON.stringify(movie), { headers: this.headers }).map(this.extractData);
+        return this.http.put<IRequestEngineResult>(`${this.url}Movie/Deny`, JSON.stringify(movie),  {headers: this.headers});
     }
 
     public markMovieAvailable(movie: IMovieUpdateModel): Observable<IRequestEngineResult> {
-        return this.http.post(`${this.url}Movie/available`, JSON.stringify(movie), { headers: this.headers }).map(this.extractData);
+        return this.http.post<IRequestEngineResult>(`${this.url}Movie/available`, JSON.stringify(movie),  {headers: this.headers});
     }
 
     public markMovieUnavailable(movie: IMovieUpdateModel): Observable<IRequestEngineResult> {
-        return this.http.post(`${this.url}Movie/unavailable`, JSON.stringify(movie), { headers: this.headers }).map(this.extractData);
+        return this.http.post<IRequestEngineResult>(`${this.url}Movie/unavailable`, JSON.stringify(movie),  {headers: this.headers});
     }
 
     public getMovieRequests(count: number, position: number): Observable<IMovieRequests[]> {
-        return this.http.get(`${this.url}movie/${count}/${position}`).map(this.extractData);
+        return this.http.get<IMovieRequests[]>(`${this.url}movie/${count}/${position}`, {headers: this.headers});
     }
 
     public searchMovieRequests(search: string): Observable<IMovieRequests[]> {
-        return this.http.get(`${this.url}movie/search/${search}`).map(this.extractData);
+        return this.http.get<IMovieRequests[]>(`${this.url}movie/search/${search}`, {headers: this.headers});
     }
 
     public removeMovieRequest(request: IMovieRequests) {
-        this.http.delete(`${this.url}movie/${request.id}`).map(this.extractData).subscribe();
+        this.http.delete(`${this.url}movie/${request.id}`, {headers: this.headers}).subscribe();
     }
 
     public updateMovieRequest(request: IMovieRequests): Observable<IMovieRequests> {
-        return this.http.put(`${this.url}movie/`, JSON.stringify(request), { headers: this.headers }).map(this.extractData);
+        return this.http.put<IMovieRequests>(`${this.url}movie/`, JSON.stringify(request), {headers: this.headers});
     }
 
     public getTvRequests(count: number, position: number): Observable<ITvRequests[]> {
-        return this.http.get(`${this.url}tv/${count}/${position}`).map(this.extractData)
+        return this.http.get<ITvRequests[]>(`${this.url}tv/${count}/${position}`, {headers: this.headers});
-            .catch(this.handleError);
     }
 
     public getTvRequestsTree(count: number, position: number): Observable<TreeNode[]> {
-        return this.http.get(`${this.url}tv/${count}/${position}/tree`).map(this.extractData)
+        return this.http.get<TreeNode[]>(`${this.url}tv/${count}/${position}/tree`, {headers: this.headers});
-            .catch(this.handleError);
     }
 
      public getChildRequests(requestId: number): Observable<IChildRequests[]> {
-        return this.http.get(`${this.url}tv/${requestId}/child`).map(this.extractData)
+        return this.http.get<IChildRequests[]>(`${this.url}tv/${requestId}/child`, {headers: this.headers});
-            .catch(this.handleError);
     }
 
     public searchTvRequests(search: string): Observable<ITvRequests[]> {
-        return this.http.get(`${this.url}tv/search/${search}`).map(this.extractData);
+        return this.http.get<ITvRequests[]>(`${this.url}tv/search/${search}`, {headers: this.headers});
      }
 
     public searchTvRequestsTree(search: string): Observable<TreeNode[]> {
-        return this.http.get(`${this.url}tv/search/${search}/tree`).map(this.extractData);
+        return this.http.get<TreeNode[]>(`${this.url}tv/search/${search}/tree`, {headers: this.headers});
     }
 
     public removeTvRequest(request: ITvRequests) {
-        this.http.delete(`${this.url}tv/${request.id}`).map(this.extractData).subscribe();
+        this.http.delete(`${this.url}tv/${request.id}`, {headers: this.headers}).subscribe();
     }
     
     public markTvAvailable(movie: ITvUpdateModel): Observable<IRequestEngineResult> {
-        return this.http.post(`${this.url}tv/available`, JSON.stringify(movie), { headers: this.headers }).map(this.extractData);
+        return this.http.post<IRequestEngineResult>(`${this.url}tv/available`, JSON.stringify(movie),  {headers: this.headers});
     }
 
     public markTvUnavailable(movie: ITvUpdateModel): Observable<IRequestEngineResult> {
-        return this.http.post(`${this.url}tv/unavailable`, JSON.stringify(movie), { headers: this.headers }).map(this.extractData);
+        return this.http.post<IRequestEngineResult>(`${this.url}tv/unavailable`, JSON.stringify(movie),  {headers: this.headers});
     }
 
     public updateTvRequest(request: ITvRequests): Observable<ITvRequests> {
-        return this.http.put(`${this.url}tv/`, JSON.stringify(request), { headers: this.headers }).map(this.extractData);
+        return this.http.put<ITvRequests>(`${this.url}tv/`, JSON.stringify(request), {headers: this.headers});
     }
 
     public updateChild(child: IChildRequests): Observable<IChildRequests> {
-        return this.http.put(`${this.url}tv/child`, JSON.stringify(child), { headers: this.headers }).map(this.extractData);
+        return this.http.put<IChildRequests>(`${this.url}tv/child`, JSON.stringify(child), {headers: this.headers});
     }   
 
     public denyChild(child: ITvUpdateModel): Observable<IRequestEngineResult> {
-        return this.http.put(`${this.url}tv/deny`, JSON.stringify(child), { headers: this.headers }).map(this.extractData);
+        return this.http.put<IRequestEngineResult>(`${this.url}tv/deny`, JSON.stringify(child), {headers: this.headers});
     } 
 
     public approveChild(child: ITvUpdateModel): Observable<IRequestEngineResult> {
-        return this.http.post(`${this.url}tv/approve`, JSON.stringify(child), { headers: this.headers }).map(this.extractData);
+        return this.http.post<IRequestEngineResult>(`${this.url}tv/approve`, JSON.stringify(child), {headers: this.headers});
     }
     public deleteChild(child: IChildRequests): Observable<any> {
-        return this.http.delete(`${this.url}tv/child/${child.id}`, { headers: this.headers }).map(this.extractData);
+        return this.http.delete(`${this.url}tv/child/${child.id}`, {headers: this.headers});
-    }
-
-    public getRequestsCount(): Observable<IRequestCountModel> {
-        return this.basicHttp.get(`${this.url}count`).map(this.extractData);
-    }
-
-    public getMovieGrid(): Observable<IRequestGrid<IMovieRequests>> {
-        return this.http.get(`${this.url}movie/grid`).map(this.extractData);
-    }
-
-    public getTvGrid(): Observable<IRequestGrid<ITvRequests>> {
-        return this.http.get(`${this.url}tv/grid`).map(this.extractData);
     }
 }

src/Ombi/ClientApp/app/services/search.service.ts

@@ -1,67 +1,68 @@
 import { PlatformLocation } from "@angular/common";
 import { Injectable } from "@angular/core";
-import { AuthHttp } from "angular2-jwt";
+
+import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs/Rx";
 
 import { TreeNode } from "primeng/primeng";
 import { ISearchMovieResult } from "../interfaces";
 import { ISearchTvResult } from "../interfaces";
-import { ServiceAuthHelpers } from "./service.helpers";
+import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
-export class SearchService extends ServiceAuthHelpers {
+export class SearchService extends ServiceHelpers {
-    constructor(http: AuthHttp, public platformLocation: PlatformLocation) {
+    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
         super(http, "/api/v1/search", platformLocation);
     }
 
     // Movies
     public searchMovie(searchTerm: string): Observable<ISearchMovieResult[]> {
-        return this.http.get(`${this.url}/Movie/` + searchTerm).map(this.extractData);
+        return this.http.get<ISearchMovieResult[]>(`${this.url}/Movie/` + searchTerm);
     }
 
     public popularMovies(): Observable<ISearchMovieResult[]> {
-        return this.http.get(`${this.url}/Movie/Popular`).map(this.extractData);
+        return this.http.get<ISearchMovieResult[]>(`${this.url}/Movie/Popular`);
     }
     public upcomingMovies(): Observable<ISearchMovieResult[]> {
-        return this.http.get(`${this.url}/Movie/upcoming`).map(this.extractData);
+        return this.http.get<ISearchMovieResult[]>(`${this.url}/Movie/upcoming`);
     }
     public nowPlayingMovies(): Observable<ISearchMovieResult[]> {
-        return this.http.get(`${this.url}/Movie/nowplaying`).map(this.extractData);
+        return this.http.get<ISearchMovieResult[]>(`${this.url}/Movie/nowplaying`);
     }
     public topRatedMovies(): Observable<ISearchMovieResult[]> {
-        return this.http.get(`${this.url}/Movie/toprated`).map(this.extractData);
+        return this.http.get<ISearchMovieResult[]>(`${this.url}/Movie/toprated`);
     }
     public getMovieInformation(theMovieDbId: number): Observable<ISearchMovieResult> {
-        return this.http.get(`${this.url}/Movie/info/${theMovieDbId}`).map(this.extractData);
+        return this.http.get<ISearchMovieResult>(`${this.url}/Movie/info/${theMovieDbId}`);
     }
 
     // TV
     public searchTv(searchTerm: string): Observable<ISearchTvResult[]> {
-        return this.http.get(`${this.url}/Tv/` + searchTerm).map(this.extractData);
+        return this.http.get<ISearchTvResult[]>(`${this.url}/Tv/${searchTerm}`, {headers: this.headers});
     }
 
     public searchTvTreeNode(searchTerm: string): Observable<TreeNode[]> {
-        return this.http.get(`${this.url}/Tv/${searchTerm}/tree`).map(this.extractData);
+        return this.http.get<TreeNode[]>(`${this.url}/Tv/${searchTerm}/tree`, {headers: this.headers});
     }
 
     public getShowInformationTreeNode(theTvDbId: number): Observable<TreeNode> {
-        return this.http.get(`${this.url}/Tv/info/${theTvDbId}/Tree`).map(this.extractData);
+        return this.http.get<TreeNode>(`${this.url}/Tv/info/${theTvDbId}/Tree`, {headers: this.headers});
     }
 
     public getShowInformation(theTvDbId: number): Observable<ISearchTvResult> {
-        return this.http.get(`${this.url}/Tv/info/${theTvDbId}`).map(this.extractData);
+        return this.http.get<ISearchTvResult>(`${this.url}/Tv/info/${theTvDbId}`, {headers: this.headers});
     }
 
     public popularTv(): Observable<TreeNode[]> {
-        return this.http.get(`${this.url}/Tv/popular`).map(this.extractData);
+        return this.http.get<TreeNode[]>(`${this.url}/Tv/popular`, {headers: this.headers});
     }
     public mostWatchedTv(): Observable<TreeNode[]> {
-        return this.http.get(`${this.url}/Tv/mostwatched`).map(this.extractData);
+        return this.http.get<TreeNode[]>(`${this.url}/Tv/mostwatched`, {headers: this.headers});
     }
     public anticipatedTv(): Observable<TreeNode[]> {
-        return this.http.get(`${this.url}/Tv/anticipated`).map(this.extractData);
+        return this.http.get<TreeNode[]>(`${this.url}/Tv/anticipated`, {headers: this.headers});
     }
     public trendingTv(): Observable<TreeNode[]> {
-        return this.http.get(`${this.url}/Tv/trending`).map(this.extractData);
+        return this.http.get<TreeNode[]>(`${this.url}/Tv/trending`, {headers: this.headers});
     }
 }

src/Ombi/ClientApp/app/services/service.helpers.ts

@@ -1,82 +1,15 @@
 import { PlatformLocation } from "@angular/common";
-import { Headers, Http, Response } from "@angular/http";
+import { HttpClient, HttpHeaders } from "@angular/common/http";
 import "rxjs/add/observable/throw";
 
-import { AuthHttp } from "angular2-jwt";
-
 export class ServiceHelpers {
 
-    protected headers: Headers;
+    protected headers = new HttpHeaders();
-
+    constructor(protected http: HttpClient, protected url: string, protected platformLocation: PlatformLocation) {
-    constructor(protected http: Http, protected url: string, protected platformLocation: PlatformLocation) {
         const base = platformLocation.getBaseHrefFromDOM();
+        this.headers = new HttpHeaders().set("Content-Type","application/json");
         if (base.length > 1) {
             this.url = base + this.url;
         }
-        this.headers = new Headers();
-        this.headers.append("Content-Type", "application/json; charset=utf-8");
-    }
-
-    protected extractData(res: Response) {
-        const body = res.json();
-        //console.log('extractData', body || {});
-        return body;
-    }
-
-    protected handleError(error: Response | any) {
-        let errMsg: string;
-        if (error instanceof Response) {
-            const body = error.json() || "";
-            const err = body.error || JSON.stringify(body);
-            errMsg = `${error.status} - ${error.statusText || ""} ${err}`;
-        } else {
-            errMsg = error.message ? error.message : error.toString();
-        }
-        console.error(errMsg);
-        return errMsg;
-    }
-}
-
-export class ServiceAuthHelpers {
-
-    protected headers: Headers;
-
-    constructor(protected http: AuthHttp, protected url: string, protected platformLocation: PlatformLocation) {
-        const base = platformLocation.getBaseHrefFromDOM();
-        if (base.length > 1) {
-            this.url = base + this.url;
-        }
-        this.headers = new Headers();
-        this.headers.append("Content-Type", "application/json; charset=utf-8");
-    }
-
-    protected extractData(res: Response) {
-        if(res.text()) {
-            const body = res.json();
-            return body;
-        } else {
-            return "";
-        }
-    }
-
-    protected extractContentData(res: Response) {
-        if(res.text()) {
-            return res.text();
-        } else {
-            return "";
-        }
-    }
-
-    protected handleError(error: Response | any) {
-        let errMsg: string;
-        if (error instanceof Response) {
-            const body = error.json() || "";
-            const err = body.error || JSON.stringify(body);
-            errMsg = `${error.status} - ${error.statusText || ""} ${err}`;
-        } else {
-            errMsg = error.Message ? error.message : error.toString();
-        }
-        console.error(errMsg);
-        return errMsg;
     }
 }

src/Ombi/ClientApp/app/services/settings.service.ts

@@ -1,7 +1,6 @@
 import { PlatformLocation } from "@angular/common";
+import { HttpClient } from "@angular/common/http";
 import { Injectable } from "@angular/core";
-import { Http } from "@angular/http";
-import { AuthHttp } from "angular2-jwt";
 import { Observable } from "rxjs/Rx";
 
 import {
@@ -30,236 +29,208 @@ import {
     IUserManagementSettings,
 } from "../interfaces";
 
-import { ServiceAuthHelpers } from "./service.helpers";
+import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
-export class SettingsService extends ServiceAuthHelpers {
+export class SettingsService extends ServiceHelpers {
-    constructor(public httpAuth: AuthHttp, private nonAuthHttp: Http,
+    constructor(public http: HttpClient, public platformLocation: PlatformLocation) {
-                public platformLocation: PlatformLocation) {
+        super(http, "/api/v1/Settings", platformLocation);
-        super(httpAuth, "/api/v1/Settings", platformLocation);
     }
 
     public about(): Observable<IAbout> {
-        return this.httpAuth.get(`${this.url}/About/`).map(this.extractData).catch(this.handleError);
+        return this.http.get<IAbout>(`${this.url}/About/`, {headers: this.headers});
     }
 
     public getOmbi(): Observable<IOmbiSettings> {
-        return this.httpAuth.get(`${this.url}/Ombi/`).map(this.extractData).catch(this.handleError);
+        return this.http.get<IOmbiSettings>(`${this.url}/Ombi/`, {headers: this.headers});
     }
 
     public saveOmbi(settings: IOmbiSettings): Observable<boolean> {
-        return this.httpAuth.post(`${this.url}/Ombi/`, JSON.stringify(settings), { headers: this.headers })
+        return this.http.post<boolean>(`${this.url}/Ombi/`, JSON.stringify(settings), {headers: this.headers});
-            .map(this.extractData).catch(this.handleError);
     }
 
     public resetOmbiApi(): Observable<string> {
-        return this.httpAuth.post(`${this.url}/Ombi/resetApi`, { headers: this.headers }).map(this.extractData)
+        return this.http.post<string>(`${this.url}/Ombi/resetApi`, {headers: this.headers});
-            .catch(this.handleError);
     }
 
     public getEmby(): Observable<IEmbySettings> {
-        return this.httpAuth.get(`${this.url}/Emby/`).map(this.extractData).catch(this.handleError);
+        return this.http.get<IEmbySettings>(`${this.url}/Emby/`);
     }
 
     public saveEmby(settings: IEmbySettings): Observable<boolean> {
-        return this.httpAuth.post(`${this.url}/Emby/`, JSON.stringify(settings), { headers: this.headers })
+        return this.http.post<boolean>(`${this.url}/Emby/`, JSON.stringify(settings), {headers: this.headers});
-            .map(this.extractData).catch(this.handleError);
     }
 
     public getPlex(): Observable<IPlexSettings> {
-        return this.httpAuth.get(`${this.url}/Plex/`).map(this.extractData).catch(this.handleError);
+        return this.http.get<IPlexSettings>(`${this.url}/Plex/`, {headers: this.headers});
     }
 
     public savePlex(settings: IPlexSettings): Observable<boolean> {
-        return this.httpAuth.post(`${this.url}/Plex/`, JSON.stringify(settings), { headers: this.headers })
+        return this.http.post<boolean>(`${this.url}/Plex/`, JSON.stringify(settings), {headers: this.headers});
-            .map(this.extractData).catch(this.handleError);
     }
 
     public getSonarr(): Observable<ISonarrSettings> {
-        return this.httpAuth.get(`${this.url}/Sonarr`).map(this.extractData)
+        return this.http.get<ISonarrSettings>(`${this.url}/Sonarr`, {headers: this.headers});
-            .catch(this.handleError);
     }
 
     public saveSonarr(settings: ISonarrSettings): Observable<boolean> {
-        return this.httpAuth.post(`${this.url}/Sonarr`, JSON.stringify(settings), { headers: this.headers })
+        return this.http.post<boolean>(`${this.url}/Sonarr`, JSON.stringify(settings), {headers: this.headers});
-            .map(this.extractData).catch(this.handleError);
     }
 
     public getRadarr(): Observable<IRadarrSettings> {
-        return this.httpAuth.get(`${this.url}/Radarr`).map(this.extractData)
+        return this.http.get<IRadarrSettings>(`${this.url}/Radarr`, {headers: this.headers});
-            .catch(this.handleError);
     }
 
     public saveRadarr(settings: IRadarrSettings): Observable<boolean> {
-        return this.httpAuth.post(`${this.url}/Radarr`, JSON.stringify(settings), { headers: this.headers })
+        return this.http.post<boolean>(`${this.url}/Radarr`, JSON.stringify(settings), {headers: this.headers});
-            .map(this.extractData).catch(this.handleError);
     }
 
     public getAuthentication(): Observable<IAuthenticationSettings> {
-        return this.httpAuth.get(`${this.url}/Authentication`).map(this.extractData)
+        return this.http.get<IAuthenticationSettings>(`${this.url}/Authentication`, {headers: this.headers});
-            .catch(this.handleError);
     }
 
     public saveAuthentication(settings: IAuthenticationSettings): Observable<boolean> {
-        return this.httpAuth.post(`${this.url}/Authentication`, JSON.stringify(settings), { headers: this.headers })
+        return this.http.post<boolean>(`${this.url}/Authentication`, JSON.stringify(settings), {headers: this.headers});
-            .map(this.extractData).catch(this.handleError);
     }
 
     // Using http since we need it not to be authenticated to get the landing page settings
     public getLandingPage(): Observable<ILandingPageSettings> {
-        return this.nonAuthHttp.get(`${this.url}/LandingPage`).map(this.extractData).catch(this.handleError);
+        return this.http.get<ILandingPageSettings>(`${this.url}/LandingPage`, {headers: this.headers});
     }
 
     public saveLandingPage(settings: ILandingPageSettings): Observable<boolean> {
-        return this.httpAuth.post(`${this.url}/LandingPage`, JSON.stringify(settings), { headers: this.headers })
+        return this.http.post<boolean>(`${this.url}/LandingPage`, JSON.stringify(settings), {headers: this.headers});
-            .map(this.extractData).catch(this.handleError);
     }
 
     // Using http since we need it not to be authenticated to get the customization settings
     public getCustomization(): Observable<ICustomizationSettings> {
-        return this.nonAuthHttp.get(`${this.url}/customization`).map(this.extractData).catch(this.handleError);
+        return this.http.get<ICustomizationSettings>(`${this.url}/customization`, {headers: this.headers});
     }
 
     public saveCustomization(settings: ICustomizationSettings): Observable<boolean> {
-        return this.httpAuth.post(`${this.url}/customization`, JSON.stringify(settings), { headers: this.headers })
+        return this.http.post<boolean>(`${this.url}/customization`, JSON.stringify(settings), {headers: this.headers});
-            .map(this.extractData).catch(this.handleError);
     }
 
     public getThemes(): Observable<IThemes[]> {
-        return this.httpAuth.get(`${this.url}/themes`).map(this.extractData).catch(this.handleError);
+        return this.http.get<IThemes[]>(`${this.url}/themes`, {headers: this.headers});
     }
 
     public getThemeContent(themeUrl: string): Observable<string> {
-        return this.httpAuth.get(`${this.url}/themecontent?url=${themeUrl}`).map(this.extractContentData).catch(this.handleError);
+        return this.http.get<string>(`${this.url}/themecontent?url=${themeUrl}`, {headers: this.headers});
     }
 
     public getEmailNotificationSettings(): Observable<IEmailNotificationSettings> {
-        return this.httpAuth.get(`${this.url}/notifications/email`).map(this.extractData).catch(this.handleError);
+        return this.http.get<IEmailNotificationSettings>(`${this.url}/notifications/email`, {headers: this.headers});
     }
     public getEmailSettingsEnabled(): Observable<boolean> {
-        return this.nonAuthHttp.get(`${this.url}/notifications/email/enabled`).map(this.extractData).catch(this.handleError);
+        return this.http.get<boolean>(`${this.url}/notifications/email/enabled`, {headers: this.headers});
     }
 
     public saveEmailNotificationSettings(settings: IEmailNotificationSettings): Observable<boolean> {
-        return this.httpAuth
+        return this.http.post<boolean>(`${this.url}/notifications/email`, JSON.stringify(settings), {headers: this.headers});
-            .post(`${this.url}/notifications/email`, JSON.stringify(settings), { headers: this.headers })
-            .map(this.extractData).catch(this.handleError);
     }
 
     public getDiscordNotificationSettings(): Observable<IDiscordNotifcationSettings> {
-        return this.httpAuth.get(`${this.url}/notifications/discord`).map(this.extractData).catch(this.handleError);
+        return this.http.get<IDiscordNotifcationSettings>(`${this.url}/notifications/discord`, {headers: this.headers});
     }
 
     public getMattermostNotificationSettings(): Observable<IMattermostNotifcationSettings> {
-        return this.httpAuth.get(`${this.url}/notifications/mattermost`).map(this.extractData).catch(this.handleError);
+        return this.http.get<IMattermostNotifcationSettings>(`${this.url}/notifications/mattermost`, {headers: this.headers});
     }
 
     public saveDiscordNotificationSettings(settings: IDiscordNotifcationSettings): Observable<boolean> {
-        return this.httpAuth
+        return this.http
-            .post(`${this.url}/notifications/discord`, JSON.stringify(settings), { headers: this.headers })
+            .post<boolean>(`${this.url}/notifications/discord`, JSON.stringify(settings), {headers: this.headers});
-            .map(this.extractData).catch(this.handleError);
     }
 
     public saveMattermostNotificationSettings(settings: IMattermostNotifcationSettings): Observable<boolean> {
-        return this.httpAuth
+        return this.http.post<boolean>(`${this.url}/notifications/mattermost`, JSON.stringify(settings), {headers: this.headers});
-            .post(`${this.url}/notifications/mattermost`, JSON.stringify(settings), { headers: this.headers })
-            .map(this.extractData).catch(this.handleError);
     }
     public getPushbulletNotificationSettings(): Observable<IPushbulletNotificationSettings> {
-        return this.httpAuth.get(`${this.url}/notifications/pushbullet`).map(this.extractData).catch(this.handleError);
+        return this.http.get<IPushbulletNotificationSettings>(`${this.url}/notifications/pushbullet`, {headers: this.headers});
     }
     public getPushoverNotificationSettings(): Observable<IPushoverNotificationSettings> {
-        return this.httpAuth.get(`${this.url}/notifications/pushover`).map(this.extractData).catch(this.handleError);
+        return this.http.get<IPushoverNotificationSettings>(`${this.url}/notifications/pushover`, {headers: this.headers});
     }
 
     public savePushbulletNotificationSettings(settings: IPushbulletNotificationSettings): Observable<boolean> {
-        return this.httpAuth
+        return this.http
-            .post(`${this.url}/notifications/pushbullet`, JSON.stringify(settings), { headers: this.headers })
+            .post<boolean>(`${this.url}/notifications/pushbullet`, JSON.stringify(settings), {headers: this.headers});
-            .map(this.extractData).catch(this.handleError);
     }
     public savePushoverNotificationSettings(settings: IPushoverNotificationSettings): Observable<boolean> {
-        return this.httpAuth
+        return this.http
-            .post(`${this.url}/notifications/pushover`, JSON.stringify(settings), { headers: this.headers })
+            .post<boolean>(`${this.url}/notifications/pushover`, JSON.stringify(settings), {headers: this.headers});
-            .map(this.extractData).catch(this.handleError);
     }
 
     public getSlackNotificationSettings(): Observable<ISlackNotificationSettings> {
-        return this.httpAuth.get(`${this.url}/notifications/slack`).map(this.extractData).catch(this.handleError);
+        return this.http.get<ISlackNotificationSettings>(`${this.url}/notifications/slack`, {headers: this.headers});
     }
 
     public saveSlackNotificationSettings(settings: ISlackNotificationSettings): Observable<boolean> {
-        return this.httpAuth
+        return this.http
-            .post(`${this.url}/notifications/slack`, JSON.stringify(settings), { headers: this.headers })
+            .post<boolean>(`${this.url}/notifications/slack`, JSON.stringify(settings), {headers: this.headers});
-            .map(this.extractData).catch(this.handleError);
     }
 
     public getUpdateSettings(): Observable<IUpdateSettings> {
-        return this.httpAuth.get(`${this.url}/update`).map(this.extractData).catch(this.handleError);
+        return this.http.get<IUpdateSettings>(`${this.url}/update`, {headers: this.headers});
     }
 
     public saveUpdateSettings(settings: IUpdateSettings): Observable<boolean> {
-        return this.httpAuth
+        return this.http
-            .post(`${this.url}/update`, JSON.stringify(settings), { headers: this.headers })
+            .post<boolean>(`${this.url}/update`, JSON.stringify(settings), {headers: this.headers});
-            .map(this.extractData).catch(this.handleError);
     }
 
     public getUserManagementSettings(): Observable<IUserManagementSettings> {
-        return this.httpAuth.get(`${this.url}/UserManagement`).map(this.extractData).catch(this.handleError);
+        return this.http.get<IUserManagementSettings>(`${this.url}/UserManagement`, {headers: this.headers});
     }
 
     public saveUserManagementSettings(settings: IUserManagementSettings): Observable<boolean> {
-        return this.httpAuth
+        return this.http
-            .post(`${this.url}/UserManagement`, JSON.stringify(settings), { headers: this.headers })
+            .post<boolean>(`${this.url}/UserManagement`, JSON.stringify(settings), {headers: this.headers});
-            .map(this.extractData).catch(this.handleError);
     }
 
     public getCouchPotatoSettings(): Observable<ICouchPotatoSettings> {
-        return this.httpAuth.get(`${this.url}/CouchPotato`).map(this.extractData).catch(this.handleError);
+        return this.http.get<ICouchPotatoSettings>(`${this.url}/CouchPotato`, {headers: this.headers});
     }
 
     public saveCouchPotatoSettings(settings: ICouchPotatoSettings): Observable<boolean> {
-        return this.httpAuth
+        return this.http
-            .post(`${this.url}/CouchPotato`, JSON.stringify(settings), { headers: this.headers })
+            .post<boolean>(`${this.url}/CouchPotato`, JSON.stringify(settings), {headers: this.headers});
-            .map(this.extractData).catch(this.handleError);
     }
 
     public getDogNzbSettings(): Observable<IDogNzbSettings> {
-        return this.httpAuth.get(`${this.url}/DogNzb`).map(this.extractData).catch(this.handleError);
+        return this.http.get<IDogNzbSettings>(`${this.url}/DogNzb`, {headers: this.headers});
     }
 
     public saveDogNzbSettings(settings: IDogNzbSettings): Observable<boolean> {
-        return this.httpAuth
+        return this.http
-            .post(`${this.url}/DogNzb`, JSON.stringify(settings), { headers: this.headers })
+            .post<boolean>(`${this.url}/DogNzb`, JSON.stringify(settings), {headers: this.headers});
-            .map(this.extractData).catch(this.handleError);
     }
 
     public getTelegramNotificationSettings(): Observable<ITelegramNotifcationSettings> {
-        return this.httpAuth.get(`${this.url}/notifications/telegram`).map(this.extractData).catch(this.handleError);
+        return this.http.get<ITelegramNotifcationSettings>(`${this.url}/notifications/telegram`, {headers: this.headers});
     }    
 
     public saveTelegramNotificationSettings(settings: ITelegramNotifcationSettings): Observable<boolean> {
-        return this.httpAuth
+        return this.http
-            .post(`${this.url}/notifications/telegram`, JSON.stringify(settings), { headers: this.headers })
+            .post<boolean>(`${this.url}/notifications/telegram`, JSON.stringify(settings), {headers: this.headers});
-            .map(this.extractData).catch(this.handleError);
     }
 
     public getJobSettings(): Observable<IJobSettings> {
-        return this.httpAuth.get(`${this.url}/jobs`).map(this.extractData).catch(this.handleError);
+        return this.http.get<IJobSettings>(`${this.url}/jobs`, {headers: this.headers});
     }
 
     public saveJobSettings(settings: IJobSettings): Observable<boolean> {
-        return this.httpAuth
+        return this.http
-            .post(`${this.url}/jobs`, JSON.stringify(settings), { headers: this.headers })
+            .post<boolean>(`${this.url}/jobs`, JSON.stringify(settings), {headers: this.headers});
-            .map(this.extractData).catch(this.handleError);
     }   
     
     public getSickRageSettings(): Observable<ISickRageSettings> {
-        return this.httpAuth.get(`${this.url}/sickrage`).map(this.extractData).catch(this.handleError);
+        return this.http.get<ISickRageSettings>(`${this.url}/sickrage`, {headers: this.headers});
     }
 
     public saveSickRageSettings(settings: ISickRageSettings): Observable<boolean> {
-        return this.httpAuth
+        return this.http
-            .post(`${this.url}/sickrage`, JSON.stringify(settings), { headers: this.headers })
+            .post<boolean>(`${this.url}/sickrage`, JSON.stringify(settings), {headers: this.headers});
-            .map(this.extractData).catch(this.handleError);
     }
 }

src/Ombi/ClientApp/app/services/status.service.ts

@@ -1,16 +1,17 @@
 import { PlatformLocation } from "@angular/common";
 import { Injectable } from "@angular/core";
-import { Http } from "@angular/http";
+
+import { HttpClient } from "@angular/common/http";
 import { Observable } from "rxjs/Rx";
 
 import { ServiceHelpers } from "./service.helpers";
 
 @Injectable()
 export class StatusService extends ServiceHelpers {
-    constructor(http: Http, public platformLocation: PlatformLocation) {
+    constructor(http: HttpClient, public platformLocation: PlatformLocation) {
         super(http, "/api/v1/status/", platformLocation);
     }
     public getWizardStatus(): Observable<any> {
-        return this.http.get(`${this.url}Wizard/`, { headers: this.headers }).map(this.extractData);
+        return this.http.get(`${this.url}Wizard/`, {headers: this.headers});
     }
 }

src/Ombi/ClientApp/app/settings/settings.module.ts

@@ -6,7 +6,6 @@ import { NgbAccordionModule, NgbModule } from "@ng-bootstrap/ng-bootstrap";
 import { ClipboardModule } from "ngx-clipboard/dist";
 
 import { AuthGuard } from "../auth/auth.guard";
-import { AuthModule } from "../auth/auth.module";
 import { AuthService } from "../auth/auth.service";
 import { CouchPotatoService, JobService, RadarrService, SonarrService, TesterService, ValidationService } from "../services";
 
@@ -72,7 +71,6 @@ const routes: Routes = [
         MenuModule,
         InputSwitchModule,
         InputTextModule,
-        AuthModule,
         NgbModule,
         TooltipModule,
         NgbAccordionModule,

src/Ombi/package-lock.json

@@ -102,6 +102,11 @@
         "tslib": "1.8.0"
       }
     },
+    "@auth0/angular-jwt": {
+      "version": "1.0.0-beta.9",
+      "resolved": "https://registry.npmjs.org/@auth0/angular-jwt/-/angular-jwt-1.0.0-beta.9.tgz",
+      "integrity": "sha1-ZQIsNJ7ck97DMS+TO5VccZ6GKmI="
+    },
     "@ng-bootstrap/ng-bootstrap": {
       "version": "1.0.0-beta.5",
       "resolved": "https://registry.npmjs.org/@ng-bootstrap/ng-bootstrap/-/ng-bootstrap-1.0.0-beta.5.tgz",
@@ -266,11 +271,6 @@
       "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz",
       "integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU="
     },
-    "angular2-jwt": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/angular2-jwt/-/angular2-jwt-0.2.3.tgz",
-      "integrity": "sha1-VO/do87tuoX2o3sWXyKsIrit8CE="
-    },
     "angular2-moment": {
       "version": "1.7.0",
       "resolved": "https://registry.npmjs.org/angular2-moment/-/angular2-moment-1.7.0.tgz",

src/Ombi/package.json

@@ -21,6 +21,7 @@
     "@angular/platform-browser-dynamic": "^5.0.3",
     "@angular/platform-server": "5.0.0",
     "@angular/router": "^5.0.3",
+    "@auth0/angular-jwt": "^1.0.0-beta.9",
     "@ng-bootstrap/ng-bootstrap": "^1.0.0-beta.5",
     "@ngx-translate/core": "^8.0.0",
     "@ngx-translate/http-loader": "^2.0.0",
@@ -29,7 +30,6 @@
     "@types/intro.js": "^2.4.3",
     "@types/node": "^8.0.53",
     "@types/webpack": "^3.8.1",
-    "angular2-jwt": "^0.2.3",
     "angular2-moment": "^1.7.0",
     "angular2-template-loader": "^0.6.2",
     "aspnet-webpack": "^2.0.1",

src/Ombi/webpack.config.vendor.ts

@@ -62,7 +62,7 @@ module.exports = (env: any) => {
                 "event-source-polyfill",
                 "bootstrap/dist/js/bootstrap",
                 "ngx-clipboard",
-                "angular2-jwt",
+                "@auth0/angular-jwt",
                 "ng2-cookies",
                 "@ngx-translate/core",
                 "@ngx-translate/http-loader",