Merge pull request #36 from bcgov/dev

Dev to Prod release

.github/workflows/build-and-deploy.yml

@@ -14,7 +14,6 @@ env:
 jobs:
   build_image:
     runs-on: ubuntu-latest
-
     steps:
       - uses: actions/checkout@v4
 
@@ -47,13 +46,11 @@ jobs:
   deploy:
     needs: build_image
     runs-on: ubuntu-latest
-
     steps:
       - uses: actions/checkout@v4
 
       - name: Authenticate and set context for OpenShift
         uses: redhat-actions/oc-login@v1
-
         with:
           openshift_server_url: ${{ secrets.OPENSHIFT_SERVER }}
           namespace: ${{ github.ref == 'refs/heads/main' && secrets.OPENSHIFT_PROD_NAMESPACE  || secrets.OPENSHIFT_DEV_NAMESPACE  }}
@@ -62,4 +59,4 @@ jobs:
 
       - name: Run Helm
         run: |
-          helm upgrade --install brms-frontend ./helm --set image.tag=${{ needs.build_image.outputs.image_tag }}
+          helm upgrade --install brms-frontend ./helm --set image.tag=${{ needs.build_image.outputs.image_tag }}

.github/workflows/eslint.yml

@@ -25,7 +25,7 @@ jobs:
 
       - name: Install ESLint
         run: |
-          npm install eslint@8.10.0
+          npm install eslint@8.56.0 --no-strict-ssl --no-shrinkwrap
 
       - name: Run ESLint
         run: npm run lint:pipeline

.github/workflows/test.yml

@@ -16,7 +16,7 @@ jobs:
       - uses: actions/checkout@v4
 
       - name: Install dependencies
-        run: npm install
+        run: npm install --no-strict-ssl --no-shrinkwrap
 
       - name: Run Jest tests with coverage
         run: npm test -- --coverage

Dockerfile

@@ -5,18 +5,40 @@ FROM registry.access.redhat.com/ubi9/nodejs-20:latest
 ARG NEXT_PUBLIC_SERVER_URL
 ENV NEXT_PUBLIC_SERVER_URL=${NEXT_PUBLIC_SERVER_URL}
 
+# Create a non-root user and group named 'node'
+USER root
+RUN groupadd -r node && useradd -r -g node -s /bin/bash -m node
+
 # Set the working directory
 WORKDIR /opt/app-root/src
 
 # Copy package.json, and optionally package-lock.json if it exists
 COPY package.json package-lock.json* ./
 
+# Adjust permissions for the package files
+RUN chown -R node:node /opt/app-root/src
+
+# Switch to the node user
+USER node
+
+# Clear npm cache
+RUN npm cache clean --force
+
 # Install app dependencies
-RUN npm ci 
+RUN npm ci --no-strict-ssl --no-shrinkwrap --verbose || npm install --prefer-online --verbose
+
+# Switch back to root user to copy the application code
+USER root
 
 # Copy the application code
 COPY . ./
 
+# Adjust permissions for the application code
+RUN chown -R node:node /opt/app-root/src
+
+# Switch back to the node user
+USER node
+
 # Build the Next.js application
 RUN npm run build
 

app/admin/page.tsx

@@ -55,7 +55,7 @@ export default function Admin() {
         } else if (
           initialRule._id !== rule._id ||
           initialRule.title !== rule.title ||
-          initialRule.goRulesJSONFilename !== rule.goRulesJSONFilename
+          initialRule.filepath !== rule.filepath
         ) {
           return { rule, action: ACTION_STATUS.UPDATE };
         }
@@ -112,9 +112,9 @@ export default function Admin() {
       width: "220px",
     },
     {
-      title: "GoRules JSON Filename",
-      dataIndex: "goRulesJSONFilename",
-      render: renderInputField("goRulesJSONFilename"),
+      title: "Filepath",
+      dataIndex: "filepath",
+      render: renderInputField("filepath"),
     },
     {
       dataIndex: "delete",

app/components/GithubAuthProvider.tsx

@@ -2,17 +2,22 @@
 import React, { createContext, useContext } from "react";
 import { initializeGithubAxiosInstance } from "../utils/githubApi";
 
-interface GithubAuthContextType {
+export interface GithubAuthContextType {
   githubAuthToken?: string;
   githubAuthUsername?: string;
 }
 
 const GithubAuthContext = createContext<GithubAuthContextType | undefined>(undefined);
 
-export const GithubAuthProvider: React.FC<{ authInfo: GithubAuthContextType; children: React.ReactNode }> = ({
+export const GithubAuthProvider: React.FC<{ authInfo: GithubAuthContextType | null; children: React.ReactNode }> = ({
   authInfo,
   children,
 }) => {
+  // If no auth information, just return children
+  if (!authInfo) {
+    return <>{children}</>;
+  }
+
   const { githubAuthToken, githubAuthUsername } = authInfo;
   initializeGithubAxiosInstance(githubAuthToken, githubAuthUsername);
 

app/components/InputOutputTable/InputOutputTable.tsx

@@ -1,13 +1,15 @@
 import { useState, useEffect, FocusEvent } from "react";
-import { Table, Tag, Input, Button } from "antd";
+import { Table, Tag, Input, Button, Tooltip, Flex } from "antd";
+import { MinusCircleOutlined } from "@ant-design/icons";
 import { RuleMap } from "@/app/types/rulemap";
 import styles from "./InputOutputTable.module.css";
+import { dollarFormat } from "@/app/utils/utils";
 
 const COLUMNS = [
   {
-    title: "Property",
-    dataIndex: "property",
-    key: "property",
+    title: "Field",
+    dataIndex: "field",
+    key: "field",
   },
   {
     title: "Value",
@@ -47,16 +49,54 @@ export default function InputOutputTable({
     setShowTable(!showTable);
   };
 
-  const convertAndStyleValue = (value: any, property: string, editable: boolean) => {
+  const updateRawData = (field: string, value: any, setRawData: Function | undefined) => {
+    const updatedData = { ...rawData, [field]: value };
+    if (typeof setRawData === "function") {
+      setRawData(updatedData);
+    } else {
+      console.error("setRawData is not a function or is undefined");
+    }
+  };
+
+  const parseValue = (newValue: string | null): any => {
+    if (newValue?.toLowerCase() === "true") return true;
+    if (newValue?.toLowerCase() === "false") return false;
+    if (newValue && !isNaN(Number(newValue))) return Number(newValue);
+    return newValue;
+  };
+
+  const updateFieldValue = (field: string, value: string | null) => {
+    updateRawData(field, value, setRawData);
+  };
+
+  const handleClear = (field: string) => {
+    updateFieldValue(field, null);
+  };
+
+  const convertAndStyleValue = (value: any, field: string, editable: boolean) => {
     if (editable) {
       return (
         <label className="labelsmall">
-          <Input
-            defaultValue={value}
-            onBlur={(e) => handleValueChange(e, property)}
-            onKeyDown={(e) => handleKeyDown(e)}
-          />
-          <span className="label-text">{property}</span>
+          <Flex gap={"small"} align="center">
+            <Input
+              id={field}
+              value={value ?? null}
+              onChange={(e) => handleInputChange(e, field)}
+              defaultValue={value ?? ""}
+              onBlur={(e) => handleValueChange(e, field)}
+              onKeyDown={(e) => handleKeyDown(e)}
+            />
+            <Tooltip title="Clear value">
+              <Button
+                type="dashed"
+                icon={<MinusCircleOutlined />}
+                size="small"
+                shape="circle"
+                onClick={() => handleClear(field)}
+              />
+            </Tooltip>
+          </Flex>
+          <span className="label-text">{field}</span>
         </label>
       );
     }
@@ -65,33 +105,26 @@ export default function InputOutputTable({
       return value ? <Tag color="green">TRUE</Tag> : <Tag color="red">FALSE</Tag>;
     }
 
-    if (typeof value === "number" && property.toLowerCase().includes("amount")) {
-      return `$${value}`;
+    if (typeof value === "number" && field.toLowerCase().includes("amount")) {
+      const formattedValue = dollarFormat(value);
+      return <Tag color="green">${formattedValue}</Tag>;
     }
 
     return <b>{value}</b>;
   };
 
-  const handleValueChange = (e: FocusEvent<HTMLInputElement, Element>, property: string) => {
-    if (!e.target) return;
-    const newValue = (e.target as HTMLInputElement).value;
-    let queryValue: any = newValue;
-
-    if (newValue.toLowerCase() === "true") {
-      queryValue = true;
-    } else if (newValue.toLowerCase() === "false") {
-      queryValue = false;
-    } else if (!isNaN(Number(newValue))) {
-      queryValue = Number(newValue);
-    }
-
-    const updatedData = { ...rawData, [property]: queryValue } || {};
+  const handleValueChange = (
+    e: FocusEvent<HTMLInputElement, Element> | React.ChangeEvent<HTMLInputElement> | null,
+    field: string
+  ) => {
+    const newValue = e?.target?.value || null;
+    const queryValue = parseValue(newValue);
+    updateFieldValue(field, queryValue);
+  };
 
-    if (typeof setRawData === "function") {
-      setRawData(updatedData);
-    } else {
-      console.error("setRawData is not a function or is undefined");
-    }
+  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement> | null, field: string) => {
+    const newValue = e?.target?.value || "";
+    updateFieldValue(field, newValue);
   };
 
   const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
@@ -106,11 +139,11 @@ export default function InputOutputTable({
     if (rawData) {
       const propertyRuleMap = Object.values(rulemap || {}).flat();
       const newData = Object.entries(rawData)
-        .filter(([property]) => !PROPERTIES_TO_IGNORE.includes(property))
+        .filter(([field]) => !PROPERTIES_TO_IGNORE.includes(field))
         .sort(([propertyA], [propertyB]) => propertyA.localeCompare(propertyB))
-        .map(([property, value], index) => ({
-          property: propertyRuleMap?.find((item) => item.property === property)?.name || property,
-          value: convertAndStyleValue(value, property, editable),
+        .map(([field, value], index) => ({
+          field: propertyRuleMap?.find((item) => item.field === field)?.name || field,
+          value: convertAndStyleValue(value, field, editable),
           key: index,
         }));
       setDataSource(newData);