Fix minor UI bugs (#134)

Co-authored-by: Krithika Sundararajan <krithika.sundararajan@go-jek.com>

Author: krithika369

ui/src/router/components/configuration/components/EnsemblerConfigSection.js

@@ -2,11 +2,12 @@ import React, { Fragment } from "react";
 import { EuiPanel } from "@elastic/eui";
 import { DockerConfigViewGroup } from "./docker_config_section/DockerConfigViewGroup";
 import { TreatmentMappingConfigSection } from "./TreatmentMappingConfigSection";
+import { ExperimentEngineContextProvider } from "../../../../providers/experiments/ExperimentEngineContextProvider";
 
 export const EnsemblerConfigSection = ({
   config: {
     ensembler,
-    experiment_engine: { config: experimentConfig },
+    experiment_engine: { type, config: experimentConfig },
   },
 }) => {
   return !ensembler ? (
@@ -20,11 +21,13 @@ export const EnsemblerConfigSection = ({
         />
       )}
       {ensembler.type === "standard" && (
-        <TreatmentMappingConfigSection
-          engineProps={(experimentConfig || {}).engine || {}}
-          experiments={(experimentConfig || {}).experiments || []}
-          mappings={ensembler.standard_config.experiment_mappings}
-        />
+        <ExperimentEngineContextProvider>
+          <TreatmentMappingConfigSection
+            engine={type}
+            experiments={(experimentConfig || {}).experiments || []}
+            mappings={ensembler.standard_config.experiment_mappings}
+          />
+        </ExperimentEngineContextProvider>
       )}
     </Fragment>
   );

ui/src/router/components/configuration/components/TreatmentMappingConfigSection.js

@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useContext } from "react";
 import {
   EuiFlexGroup,
   EuiFlexItem,
@@ -9,6 +9,7 @@ import {
 } from "@elastic/eui";
 import { ConfigSectionPanel } from "../../../../components/config_section";
 import { getExperimentUrl } from "./config";
+import ExperimentEngineContext from "../../../../providers/experiments/context";
 
 const TreatmentMappingConfigTable = ({ items }) => {
   const columns = [
@@ -30,14 +31,16 @@ const TreatmentMappingConfigTable = ({ items }) => {
 };
 
 export const TreatmentMappingConfigSection = ({
-  engineProps,
+  engine,
   experiments = [],
   mappings = [],
 }) => {
+  const { getEngineProperties } = useContext(ExperimentEngineContext);
+  const engineProps = getEngineProperties(engine);
+
   const experimentNames = [
     ...new Set(mappings.map((mapObj) => mapObj.experiment)),
   ];
-
   const experimentInfo = experiments.reduce((acc, exp) => {
     acc[exp.name] = exp;
     return acc;
@@ -52,7 +55,8 @@ export const TreatmentMappingConfigSection = ({
               <EuiTextColor color="secondary">
                 <EuiLink
                   href={getExperimentUrl(
-                    engineProps,
+                    engineProps?.standard_experiment_manager_config
+                      ?.home_page_url,
                     experimentInfo[exp] || {}
                   )}
                   target="_blank"

ui/src/router/details/components/RouterActions.js

@@ -29,7 +29,7 @@ export const RouterActions = ({
           name: "Undeploy Router",
           icon: "exportAction",
           disabled: status === Status.PENDING,
-          hidden: status === Status.UNDEPLOYED,
+          hidden: [Status.UNDEPLOYED, Status.FAILED].includes(status),
           onClick: () => undeployRouterRef.current(router),
         },
         {

ui/src/router/versions/details/config/RouterVersionConfigView.js

@@ -2,6 +2,7 @@ import React, { useEffect } from "react";
 import { replaceBreadcrumbs } from "@gojek/mlp-ui";
 import { RouterConfigDetails } from "../../../components/configuration/RouterConfigDetails";
 import { get } from "../../../../components/form/utils";
+import { ExperimentEngineContextProvider } from "../../../../providers/experiments/ExperimentEngineContextProvider";
 
 export const RouterVersionConfigView = ({ projectId, config }) => {
   useEffect(() => {
@@ -25,5 +26,9 @@ export const RouterVersionConfigView = ({ projectId, config }) => {
     ]);
   }, [config]);
 
-  return <RouterConfigDetails projectId={projectId} config={config} />;
+  return (
+    <ExperimentEngineContextProvider>
+      <RouterConfigDetails projectId={projectId} config={config} />
+    </ExperimentEngineContextProvider>
+  );
 };