refactored fake backend

Author: cornflourblue

src/app/_helpers/fake-backend.ts

@@ -13,56 +13,59 @@ const users: User[] = [
 @Injectable()
 export class FakeBackendInterceptor implements HttpInterceptor {
     intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
-        const authHeader = request.headers.get('Authorization');
-        const isLoggedIn = authHeader && authHeader.startsWith('Bearer fake-jwt-token');
-        const roleString = isLoggedIn && authHeader.split('.')[1];
-        const role = roleString ? Role[roleString] : null;
+        const { url, method, headers, body } = request;
 
         // wrap in delayed observable to simulate server api call
-        return of(null).pipe(mergeMap(handleRoute))
-        .pipe(materialize()) // call materialize and dematerialize to ensure delay even if an error is thrown (https://github.com/Reactive-Extensions/RxJS/issues/648)
-        .pipe(delay(500))
-        .pipe(dematerialize());
+        return of(null)
+            .pipe(mergeMap(handleRoute))
+            .pipe(materialize()) // call materialize and dematerialize to ensure delay even if an error is thrown (https://github.com/Reactive-Extensions/RxJS/issues/648)
+            .pipe(delay(500))
+            .pipe(dematerialize());
 
         function handleRoute() {
-            // authenticate - public
-            if (request.url.endsWith('/users/authenticate') && request.method === 'POST') {
-                const user = users.find(x => x.username === request.body.username && x.password === request.body.password);
-                if (!user) return error('Username or password is incorrect');
-                return ok({
-                    id: user.id,
-                    username: user.username,
-                    firstName: user.firstName,
-                    lastName: user.lastName,
-                    role: user.role,
-                    token: `fake-jwt-token.${user.role}`
-                });
+            switch (true) {
+                case url.endsWith('/users/authenticate') && method === 'POST':
+                    return authenticate();
+                case url.endsWith('/users') && method === 'GET':
+                    return getUsers();
+                case url.match(/\/users\/\d+$/) && method === 'GET':
+                    return getUserById();
+                default:
+                    // pass through any requests not handled above
+                    return next.handle(request);
             }
 
-            // get user by id - admin or user (user can only access their own record)
-            if (request.url.match(/\/users\/\d+$/) && request.method === 'GET') {
-                if (!isLoggedIn) return unauthorised();
+        }
 
-                // get id from request url
-                let urlParts = request.url.split('/');
-                let id = parseInt(urlParts[urlParts.length - 1]);
+        // route functions
+
+        function authenticate() {
+            const { username, password } = body;
+            const user = users.find(x => x.username === username && x.password === password);
+            if (!user) return error('Username or password is incorrect');
+            return ok({
+                id: user.id,
+                username: user.username,
+                firstName: user.firstName,
+                lastName: user.lastName,
+                role: user.role,
+                token: `fake-jwt-token.${user.id}`
+            });
+        }
 
-                // only allow normal users access to their own record
-                const currentUser = users.find(x => x.role === role);
-                if (id !== currentUser.id && role !== Role.Admin) return unauthorised();
+        function getUsers() {
+            if (!isAdmin()) return unauthorized();
+            return ok(users);
+        }
 
-                const user = users.find(x => x.id === id);
-                return ok(user);
-            }
+        function getUserById() {
+            if (!isLoggedIn()) return unauthorized();
 
-            // get all users (admin only)
-            if (request.url.endsWith('/users') && request.method === 'GET') {
-                if (role !== Role.Admin) return unauthorised();
-                return ok(users);
-            }
+            // only admins can access other user records
+            if (!isAdmin() && currentUser().id !== idFromUrl()) return unauthorized();
 
-            // pass through any requests not handled above
-            return next.handle(request);
+            const user = users.find(x => x.id === idFromUrl());
+            return ok(user);
         }
 
         // helper functions
@@ -71,17 +74,37 @@ export class FakeBackendInterceptor implements HttpInterceptor {
             return of(new HttpResponse({ status: 200, body }));
         }
 
-        function unauthorised() {
-            return throwError({ status: 401, error: { message: 'Unauthorised' } });
+        function unauthorized() {
+            return throwError({ status: 401, error: { message: 'unauthorized' } });
         }
 
         function error(message) {
             return throwError({ status: 400, error: { message } });
         }
+
+        function isLoggedIn() {
+            const authHeader = headers.get('Authorization') || '';
+            return authHeader.startsWith('Bearer fake-jwt-token');
+        }
+
+        function isAdmin() {
+            return isLoggedIn() && currentUser().role === Role.Admin;
+        }
+
+        function currentUser() {
+            if (!isLoggedIn()) return;
+            const id = parseInt(headers.get('Authorization').split('.')[1]);
+            return users.find(x => x.id === id);
+        }
+
+        function idFromUrl() {
+            const urlParts = url.split('/');
+            return parseInt(urlParts[urlParts.length - 1]);
+        }
     }
 }
 
-export let fakeBackendProvider = {
+export const fakeBackendProvider = {
     // use fake backend in place of Http service for backend-less development
     provide: HTTP_INTERCEPTORS,
     useClass: FakeBackendInterceptor,

src/app/admin/admin.component.html

@@ -1,7 +1,7 @@
 <div class="card mt-4">
     <h4 class="card-header">Admin</h4>
     <div class="card-body">
-        <p>This page can only be accessed <u>only by administrators</u>.</p>
+        <p>This page can be accessed <u>only by administrators</u>.</p>
         <p class="mb-1">All users from secure (admin only) api end point:</p>
         <div *ngIf="loading" class="spinner-border spinner-border-sm"></div>
         <ul *ngIf="users">