From a774481c2db6886d0257c6a86320dd66661aa3aa Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ladislav=20Slez=C3=A1k?= <lslezak@suse.com>
Date: Tue, 31 Oct 2023 08:36:13 +0100
Subject: [PATCH] Development server - handle also the manifests.js file
 request

Proxy the request to the real Cockpit server, but patch the
response with the latest Agama manifest from the current sources
---
 web/src/DevServerWrapper.jsx             |  5 ++-
 web/src/lib/webpack-manifests-handler.js | 48 ++++++++++++++++++++++++
 web/webpack.config.js                    | 15 +++++++-
 3 files changed, 64 insertions(+), 4 deletions(-)
 create mode 100644 web/src/lib/webpack-manifests-handler.js

diff --git a/web/src/DevServerWrapper.jsx b/web/src/DevServerWrapper.jsx
index c2397bdde8..f4268f5fec 100644
--- a/web/src/DevServerWrapper.jsx
+++ b/web/src/DevServerWrapper.jsx
@@ -116,8 +116,9 @@ export default function DevServerWrapper({ children }) {
     // handle updating the iframe with the login form
     const onFrameLoad = () => {
       const passwordInput = iframeRef.current.contentWindow.document.getElementById(loginId);
-      // if there is no password field displayed then the user has authenticated successfully
-      if (!passwordInput) setIsAuthenticated(true);
+      // reload the window so the manifests.js file referenced from the
+      // index.html file is also loaded again
+      if (!passwordInput) window.location.reload();
     };
 
     return <iframe ref={iframeRef} onLoad={onFrameLoad} src={loginPath} className="full-size" />;
diff --git a/web/src/lib/webpack-manifests-handler.js b/web/src/lib/webpack-manifests-handler.js
new file mode 100644
index 0000000000..49be997c2a
--- /dev/null
+++ b/web/src/lib/webpack-manifests-handler.js
@@ -0,0 +1,48 @@
+const fs = require("fs");
+const path = require("path");
+
+const manifestFile = path.join(__dirname, "..", "manifest.json");
+
+// this function is injected as a string into the resulting JS file
+const updateAgamaManifest = (data) => {
+  if (typeof cockpit === "object" && cockpit.manifests) {
+    cockpit.manifests.agama = data;
+  }
+};
+
+// This function processes the webpack HTTP proxy request for manifests.js file.
+//
+// Patching the original JS code is difficult so rather inject code
+// which rewrites the Agama manifest data with new content.
+//
+// @see https://github.com/http-party/node-http-proxy#modify-response
+//
+// @param proxyRes HTTP proxy resource
+// @param req HTTP request
+// @param res HTTP response
+module.exports = function (proxyRes, req, res) {
+  // collect parts of the original response
+  const body = [];
+
+  proxyRes.on("data", function (chunk) {
+    body.push(chunk);
+  });
+
+  proxyRes.on("end", function () {
+    // forward the original status code
+    res.statusCode = proxyRes.statusCode;
+
+    // patch the response only on success otherwise there
+    // might be some unexpected content (HTML error page)
+    if (proxyRes.statusCode === 200 && fs.existsSync(manifestFile)) {
+      const manifest = fs.readFileSync(manifestFile);
+      // use an immediately-invoked function expression to inject the new
+      // manifest content
+      res.end(Buffer.concat(body).toString() + "((" +
+        updateAgamaManifest.toString() + ")(" + manifest + "));");
+    } else {
+      // otherwise just return the original content
+      res.end(Buffer.concat(body).toString());
+    }
+  });
+};
diff --git a/web/webpack.config.js b/web/webpack.config.js
index 08185676d9..27e9ae2730 100644
--- a/web/webpack.config.js
+++ b/web/webpack.config.js
@@ -15,6 +15,7 @@ const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
 const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin');
 const webpack = require('webpack');
 const po_handler = require("./src/lib/webpack-po-handler");
+const manifests_handler = require("./src/lib/webpack-manifests-handler");
 
 /* A standard nodejs and webpack pattern */
 const production = process.env.NODE_ENV === 'production';
@@ -100,8 +101,8 @@ module.exports = {
   externals: { cockpit: "cockpit" },
   devServer: {
     hot: true,
-    // forward all cockpit connections to a real Cockpit instance
     proxy: {
+      // forward all cockpit connections to a real Cockpit instance
       "/cockpit": {
         target: cockpitTarget,
         // redirect also the websocket connections
@@ -109,6 +110,16 @@ module.exports = {
         // ignore SSL problems (self-signed certificate)
         secure: false,
       },
+      // forward the manifests.js request and patch the response with the
+      // current Agama manifest from the ./src/manifest.json file
+      "/manifests.js": {
+        target: cockpitTarget + "/cockpit/@localhost/",
+        // ignore SSL problems (self-signed certificate)
+        secure: false,
+        // the response is modified by the onProxyRes handler
+        selfHandleResponse : true,
+        onProxyRes: manifests_handler,
+      },
     },
     // use https so Cockpit uses wss:// when connecting to the backend
     server: "https",
@@ -118,7 +129,7 @@ module.exports = {
 
     // Cockpit handles the "po.js" requests specially
     setupMiddlewares: (middlewares, devServer) => {
-      devServer.app.get("/po.js", (req, res) => po_handler(req, res));
+      devServer.app.get("/po.js", po_handler);
       return middlewares;
     }
   },