From 9257bd775dd16f220db5c54139e9c5a8819ee59e Mon Sep 17 00:00:00 2001
From: Jason Chong <35889982+JasonChong96@users.noreply.github.com>
Date: Wed, 1 Jul 2020 17:03:44 +0800
Subject: [PATCH] fix: render 404 page even on non-existent pages in /api 
 (#240)

* fix: non existant pages on /api sends 404

* refactor: move shared constant to constants.ts
---
 src/server/api/index.ts                      | 5 +++++
 src/server/constants.ts                      | 2 +-
 src/server/controllers/RedirectController.ts | 3 +--
 src/server/views/404.error.ejs               | 7 ++++---
 4 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/src/server/api/index.ts b/src/server/api/index.ts
index 0452e11a1..18133ad59 100644
--- a/src/server/api/index.ts
+++ b/src/server/api/index.ts
@@ -1,5 +1,6 @@
 import Express from 'express'
 import jsonMessage from '../util/json'
+import { ERROR_404_PATH } from '../constants'
 
 const router = Express.Router()
 
@@ -47,4 +48,8 @@ router.use('/user', userGuard, preprocess, require('./user'))
 router.use('/qrcode', userGuard, require('./qrcode'))
 router.use('/link-stats', userGuard, require('./link-statistics'))
 
+router.use((_, res) => {
+  res.status(404).render(ERROR_404_PATH)
+})
+
 export default router
diff --git a/src/server/constants.ts b/src/server/constants.ts
index 8dddb6092..9d691f79d 100644
--- a/src/server/constants.ts
+++ b/src/server/constants.ts
@@ -35,4 +35,4 @@ export const DependencyIds = {
   deviceCheckService: Symbol.for('deviceCheckService'),
 }
 
-export default DependencyIds
+export const ERROR_404_PATH = '404.error.ejs'
diff --git a/src/server/controllers/RedirectController.ts b/src/server/controllers/RedirectController.ts
index 1a422b59c..33a72ea6a 100644
--- a/src/server/controllers/RedirectController.ts
+++ b/src/server/controllers/RedirectController.ts
@@ -3,7 +3,7 @@ import { inject, injectable } from 'inversify'
 import { gaTrackingId, logger } from '../config'
 import { NotFoundError } from '../util/error'
 import parseDomain from '../util/domain'
-import { DependencyIds } from '../constants'
+import { DependencyIds, ERROR_404_PATH } from '../constants'
 import { AnalyticsLogger } from '../services/analyticsLogger'
 import { RedirectControllerInterface } from './interfaces/RedirectControllerInterface'
 import { RedirectService } from '../services/RedirectService'
@@ -13,7 +13,6 @@ import {
   EventCategory,
 } from '../services/googleAnalytics/types/enum'
 
-const ERROR_404_PATH = '404.error.ejs'
 const TRANSITION_PATH = 'transition-page.ejs'
 
 @injectable()
diff --git a/src/server/views/404.error.ejs b/src/server/views/404.error.ejs
index fb0995b78..ea79bc90d 100644
--- a/src/server/views/404.error.ejs
+++ b/src/server/views/404.error.ejs
@@ -7,8 +7,9 @@
     <meta http-equiv="Content-Language" content="en">
     <meta charset="UTF-8">
     <title>Go.gov.sg: Page not found</title>
+    <base href="~/" />
     <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;700&display=swap" rel="stylesheet">
-    <link href="./assets/not-found-page/styles/not-found-page.css" rel="stylesheet">
+    <link href="/assets/not-found-page/styles/not-found-page.css" rel="stylesheet">
     <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">
 </head>
 
@@ -23,11 +24,11 @@
         <div id="divider" class="divider"></div>
         <div id="graphics-container">
             <div id="graphic-div">
-                <img src="./assets/not-found-page/images/not-found-graphic.svg" draggable="false" />
+                <img src="/assets/not-found-page/images/not-found-graphic.svg" draggable="false" />
             </div>
             <div id="go-logo-div">
                 <!-- go logo -->
-                <img src="./assets/not-found-page/icons/go-logo.svg" draggable="false" />
+                <img src="/assets/not-found-page/icons/go-logo.svg" draggable="false" />
             </div>
         </div>
     </main>