fix(config-utils): watch for frontend CRD changes in proxy

Author: Hyperkid123

package-lock.json

@@ -27,6 +27,7 @@
     "@openshift/dynamic-plugin-sdk-webpack": "^4.0.1",
     "ajv": "^8.17.1",
     "chalk": "^4.1.2",
+    "chokidar": "^4.0.3",
     "js-yaml": "^4.1.0",
     "node-fetch": "2.6.7"
   },

packages/config-utils/package.json

@@ -6,11 +6,13 @@ import express from 'express';
 import path from 'path';
 import type { Configuration } from 'webpack-dev-server';
 import { HttpsProxyAgent } from 'https-proxy-agent';
+import chokidar from 'chokidar';
 import cookieTransform from './cookieTransform';
 import { matchNavigationRequest } from './feo/check-outgoing-requests';
 import { hasFEOFeaturesEnabled, readFrontendCRD } from './feo/crd-check';
 import navigationInterceptor from './feo/navigation-interceptor';
 import { GeneratedBundles } from './feo/feo-types';
+import fecLogger, { LogType } from './fec-logger';
 
 const defaultReposDir = path.join(__dirname, 'repos');
 
@@ -134,12 +136,34 @@ const proxy = ({
   localApps = process.env.LOCAL_APPS,
   frontendCRDPath = path.resolve(process.cwd(), 'deploy/frontend.yaml'),
 }: ProxyOptions) => {
-  const frontendCrd = readFrontendCRD(frontendCRDPath);
-  const FEOFeaturesEnabled = hasFEOFeaturesEnabled(frontendCrd);
+  const frontendCrdRef = { current: readFrontendCRD(frontendCRDPath) };
+  const FEOFeaturesEnabled = hasFEOFeaturesEnabled(frontendCrdRef.current);
   const proxy: ProxyConfigItem[] = [];
   const majorEnv = env.split('-')[0];
   const defaultLocalAppHost = process.env.LOCAL_APP_HOST || majorEnv + '.foo.redhat.com';
 
+  if (FEOFeaturesEnabled) {
+    fecLogger(LogType.info, 'Watching frontend CRC file for changes');
+    const watcher = chokidar.watch(frontendCRDPath).on('change', () => {
+      fecLogger(LogType.info, 'Frontend CRD has changed, reloading the file');
+      try {
+        frontendCrdRef.current = readFrontendCRD(frontendCRDPath);
+      } catch (error) {
+        fecLogger(LogType.error, 'Error reloading frontend CRD file', error);
+      }
+    });
+
+    // close the watcher on webserver shutdown
+    process.on('SIGTERM', () => {
+      fecLogger(LogType.info, 'Closing frontend CRD watcher');
+      watcher.close();
+    });
+    process.on('SIGINT', () => {
+      fecLogger(LogType.info, 'Closing frontend CRD watcher');
+      watcher.close();
+    });
+  }
+
   if (target === '') {
     target += 'https://';
     if (!['prod', 'stage'].includes(majorEnv)) {
@@ -226,7 +250,7 @@ const proxy = ({
               if (FEOFeaturesEnabled) {
                 // these will be filled in chrome service once migration is ready to start
                 objectToModify.forEach((bundle) => {
-                  const navItems = navigationInterceptor(frontendCrd, bundle, bundle.id);
+                  const navItems = navigationInterceptor(frontendCrdRef.current, bundle, bundle.id);
                   resultBundles.push({ ...bundle, navItems });
                 });
               }

packages/config-utils/src/proxy.ts

@@ -27,7 +27,7 @@
   "scripts": {},
   "dependencies": {
     "@pmmmwh/react-refresh-webpack-plugin": "^0.5.15",
-    "@redhat-cloud-services/frontend-components-config-utilities": "^4.0.4",
+    "@redhat-cloud-services/frontend-components-config-utilities": "^4.1.0",
     "@redhat-cloud-services/tsc-transform-imports": "^1.0.21",
     "@swc/core": "^1.3.76",
     "assert": "^2.0.0",