Add a client side cache system, need more data before writing rules

src/app/app.module.ts

@@ -11,13 +11,15 @@ import { AppComponent } from './app.component';
 import { EndpointService } from './services/endpoint.service';
 import { RoutineService } from './services/routine.service';
 import { RosterService } from './services/roster.service';
+import { UserService } from './services/user.service';
+import { AuthService } from './services/auth.service';
 import { RoutineViewGuard, RoutineFormGuard } from './services/routine-guard.service';
 import { RoutineResolverService } from './services/routine-resolver.service';
 import { UserLibraryResolverService } from './services/user-library-resolver.service';
-import { UserService } from './services/user.service';
 import { AuthGuardService } from './services/auth-guard.service';
-import { AuthService } from './services/auth.service';
 import { AuthInterceptorService } from './services/auth-interceptor.service';
+import { CacheInterceptor } from './core/cache.interceptor';
+import { HttpCacheService } from './core/http-cache.service';
 
 import { RoutineModule } from './routine/routine.module';
 import { UserModule } from './user/user.module';
@@ -68,12 +70,10 @@ import { FiveHundredComponent } from './errors/five-hundred.component';
     RosterService,
     UserService,
     AuthService,
+    HttpCacheService,
     AuthGuardService,
-    {
-      provide: HTTP_INTERCEPTORS,
-      useClass: AuthInterceptorService,
-      multi: true
-    }
+    { provide: HTTP_INTERCEPTORS, useClass: AuthInterceptorService, multi: true },
+    // { provide: HTTP_INTERCEPTORS, useClass: CacheInterceptor, multi: true },
   ],
   bootstrap: [AppComponent]
 })

src/app/core/cache.interceptor.ts

@@ -0,0 +1,52 @@
+import { Injectable } from '@angular/core';
+import { HttpEvent, HttpInterceptor, HttpHandler, HttpRequest, HttpResponse } from '@angular/common/http';
+import { Observable, of } from 'rxjs';
+import { tap } from 'rxjs/operators';
+
+import { HttpCacheService } from './http-cache.service';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class CacheInterceptor implements HttpInterceptor {
+
+  constructor(
+    private cache: HttpCacheService,
+  ) {}
+
+  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
+
+    console.log('url: ', req.url);
+    console.log('method: ', req.method);
+    console.log('body: ', req.body);
+
+    // SET UP AND TESTING ONLY
+    // invalidate the cache and return if anything but a GET
+    if (req.method !== 'GET') {
+      console.log('invalidate chache');
+      this.cache.invalidateCache();
+      return next.handle(req);
+    }
+
+    // attempt to receive cached response
+    const cachedResponse: HttpResponse<any> = this.cache.get(req.url);
+
+    // return cached response
+    // NO next.handle!!!!!
+    if (cachedResponse) {
+      console.log('returning cached response: ', cachedResponse.url);
+      console.log(cachedResponse);
+      return of(cachedResponse);
+    }
+
+    // send request to server and add response to cache
+    return next.handle(req).pipe(
+      tap(event => {
+        if (event instanceof HttpResponse) {
+          console.log('Adding item to chache: ', req.url);
+          this.cache.put(req.url, event);
+        }
+      })
+    );
+  }
+}

src/app/core/http-cache.service.ts

@@ -0,0 +1,28 @@
+import { Injectable } from '@angular/core';
+import { HttpResponse } from '@angular/common/http';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class HttpCacheService {
+
+  private requests: any = {};
+
+  constructor() { }
+
+  put(url: string, response: HttpResponse<any>): void {
+    this.requests[url] = response;
+  }
+
+  get(url: string): HttpResponse<any> | undefined {
+    return this.requests[url];
+  }
+
+  invalidateUrl(url: string): void {
+    this.requests[url] = undefined;
+  }
+
+  invalidateCache(): void {
+    this.requests = {};
+  }
+}