[PRMP-919] Update nginx.conf (#914)

lillie-dae · adamwhitingnhs · web-flow · commit 8f5b61dc6805 · 2025-12-01T13:05:23.000Z
Co-authored-by: adamwhitingnhs &lt;adam.whiting3@nhs.net&gt;
diff --git a/.github/workflows/base-cypress-test.yml b/.github/workflows/base-cypress-test.yml
@@ -57,6 +57,9 @@ jobs:
           npm install --legacy-peer-deps
         working-directory: ./app
 
+      - name: Copy main.html to index.html for serve compatibility
+        run: cp ./app/build/main.html ./app/build/index.html
+
       - name: Cypress run
         uses: cypress-io/github-action@v6
         with:
diff --git a/app/docker/nginx.conf b/app/docker/nginx.conf
@@ -28,18 +28,15 @@ http {
         add_header X-Permitted-Cross-Domain-Policies "none" always;
 
         location / {
-            index  index.html index.htm;
-            try_files $uri $uri/ /index.html$is_args$args;
-
-            add_header Cache-Control "private, max-age=63072000" always;
-            add_header Pragma "private, max-age=63072000" always;
+            index main.html;
+            try_files $uri $uri/ /main.html$is_args$args;
         }
 
 	    location /pdfjs/ {
             add_header Content-Security-Policy "default-src 'none'; frame-ancestors 'self'; img-src 'self' blob: data:; script-src 'self'; style-src 'self' 'unsafe-inline'; font-src 'self'; connect-src 'self' blob: https:;" always;
             add_header Permissions-Policy "fullscreen=()" always;
             add_header X-Frame-Options "SAMEORIGIN" always;
-            try_files $uri $uri/ /index.html$is_args$args;
+            try_files $uri $uri/;
 	    }
     }
 }
diff --git a/app/main.html b/app/main.html
@@ -53,6 +53,6 @@
     <body>
         <noscript>You need to enable JavaScript to run this app.</noscript>
         <div id="root"></div>
-        <script type="module" src="/src/index.tsx"></script>
+        <script type="module" src="/src/main.tsx"></script>
     </body>
 </html>
diff --git a/app/src/main.tsx b/app/src/main.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import ReactDOM from 'react-dom/client';
-import './styles/index.css';
+import './styles/main.css';
 import App from './App';
 import 'pdfjs-viewer-element';
 import PdfjsViewerElement from 'pdfjs-viewer-element';
diff --git a/app/src/styles/main.css b/app/src/styles/main.css
diff --git a/app/vite.config.ts b/app/vite.config.ts
@@ -4,6 +4,36 @@ import svgr from 'vite-plugin-svgr';
 import commonjs from 'vite-plugin-commonjs';
 import eslint from 'vite-plugin-eslint';
 
+// Custom plugin to handle SPA fallback to main.html
+const spaFallbackPlugin = () => {
+    const fallbackMiddleware = (req: any, res: any, next: any) => {
+        // Only handle GET requests that look like routes (not files)
+        if (
+            req.method === 'GET' && 
+            req.url && 
+            !req.url.startsWith('/assets/') && 
+            !req.url.startsWith('/src/') && 
+            !req.url.startsWith('/@') && 
+            !req.url.includes('.') && 
+            req.url !== '/main.html' &&
+            req.headers.accept?.includes('text/html')
+        ) {
+            req.url = '/main.html';
+        }
+        next();
+    };
+
+    return {
+        name: 'spa-fallback-main-html',
+        configureServer(server: any) {
+            server.middlewares.use(fallbackMiddleware);
+        },
+        configurePreviewServer(server: any) {
+            server.middlewares.use(fallbackMiddleware);
+        }
+    };
+};
+
 // https://vitejs.dev/config/
 export default defineConfig({
     base: '/',
@@ -19,9 +49,17 @@ export default defineConfig({
             },
         }),
         eslint(),
+        spaFallbackPlugin()
     ],
+    preview: {
+        port: 3000,
+        host: true,
+    },
     build: {
         commonjsOptions: { transformMixedEsModules: true },
         chunkSizeWarningLimit: 1024,
-    },
+        rollupOptions: {
+            input: './main.html',
+        },
+    }
 });
diff --git a/sonar-project.properties b/sonar-project.properties
@@ -14,7 +14,7 @@ sonar.python.coverage.reportPaths=lambdas/coverage.xml
 sonar.sources=lambdas/,app/src/
 sonar.tests=lambdas/tests/,app/src/
 
-sonar.exclusions=**/*.test.tsx,app/src/helpers/test/**,**/TestPanel.tsx,**/lambdas/scripts/**,**/*.test.ts,lambdas/tests/**,**/conftest.py,app/react-build-env-checker.js,app/public/*,app/src/index.tsx
+sonar.exclusions=**/*.test.tsx,app/src/helpers/test/**,**/TestPanel.tsx,**/lambdas/scripts/**,**/*.test.ts,lambdas/tests/**,**/conftest.py,app/react-build-env-checker.js,app/public/*,app/src/main.tsx
 sonar.test.inclusions=**/*.test.tsx,**/*.test.ts
 
 # Encoding of the source code. Default is default system encoding

Original file line number	Diff line number	Diff line change
`@@ -28,18 +28,15 @@ http {`
`28`	`28`	`add_header X-Permitted-Cross-Domain-Policies "none" always;`
`29`	`29`
`30`	`30`	`location / {`
`31`		`- index index.html index.htm;`
`32`		`- try_files $uri $uri/ /index.html$is_args$args;`
`33`		`-`
`34`		`- add_header Cache-Control "private, max-age=63072000" always;`
`35`		`- add_header Pragma "private, max-age=63072000" always;`
	`31`	`+ index main.html;`
	`32`	`+ try_files $uri $uri/ /main.html$is_args$args;`
`36`	`33`	`}`
`37`	`34`
`38`	`35`	`location /pdfjs/ {`
`39`	`36`	`add_header Content-Security-Policy "default-src 'none'; frame-ancestors 'self'; img-src 'self' blob: data:; script-src 'self'; style-src 'self' 'unsafe-inline'; font-src 'self'; connect-src 'self' blob: https:;" always;`
`40`	`37`	`add_header Permissions-Policy "fullscreen=()" always;`
`41`	`38`	`add_header X-Frame-Options "SAMEORIGIN" always;`
`42`		`- try_files $uri $uri/ /index.html$is_args$args;`
	`39`	`+ try_files $uri $uri/;`
`43`	`40`	`}`
`44`	`41`	`}`
`45`	`42`	`}`