From 30a762654e0c3c7b14093a39e57bb4ed805dd672 Mon Sep 17 00:00:00 2001
From: Yihong Wang <yh.wang@ibm.com>
Date: Mon, 29 Nov 2021 15:51:54 -0800
Subject: [PATCH] [ui] add an ENV var to identify kfp deployment

Add `REACT_APP_KFP_STANDALONE` config to
identify if the KFP is a standalone deployment
or not

Signed-off-by: Yihong Wang <yh.wang@ibm.com>
---
 dashboard/origin-mlx/README.md   |  2 ++
 dashboard/origin-mlx/src/App.tsx | 17 ++++++++++-------
 2 files changed, 12 insertions(+), 7 deletions(-)

diff --git a/dashboard/origin-mlx/README.md b/dashboard/origin-mlx/README.md
index b61fffc3..0fb85415 100644
--- a/dashboard/origin-mlx/README.md
+++ b/dashboard/origin-mlx/README.md
@@ -140,6 +140,7 @@ export REACT_APP_API="localhost:8080"
 export REACT_APP_RUN="false"
 export REACT_APP_UPLOAD="true"
 export REACT_APP_DISABLE_LOGIN="true"
+export REACT_APP_KFP_STANDALONE="true"  # KFP is standalone deployment or not
 export REACT_APP_TTL="0"                # Disable the cache
 export REACT_APP_CACHE_INTERVAL="0"     # Ignore checking cache
 ```
@@ -173,6 +174,7 @@ There are a few environment variables that can be defined that dictate how MLX i
   http://<ip_address>:<port>/<basepath>)
 * `REACT_APP_BRAND` - The brand name to use on the website
 * `REACT_APP_DISABLE_LOGIN` - A switch to turn off login mechanism
+* `REACT_APP_KFP_STANDALONE` - The KFP is standalone deployment or not
 * `REACT_APP_TTL` - The amount of seconds a cached entry remains valid for (24 hours by default)
 * `REACT_APP_CACHE_INTERVAL` - The minimum amount of time in seconds between two checks on the validity of the cache's contents (24 hours by default)
 
diff --git a/dashboard/origin-mlx/src/App.tsx b/dashboard/origin-mlx/src/App.tsx
index c03ebe95..690bdfed 100644
--- a/dashboard/origin-mlx/src/App.tsx
+++ b/dashboard/origin-mlx/src/App.tsx
@@ -53,6 +53,7 @@ const isAdmin = hasRole(getUserInfo(), 'admin');
 function App() {
 
   var prefix = process.env.REACT_APP_BASE_PATH || ""
+  var kfpStandalone = process.env.REACT_APP_KFP_STANDALONE === 'true'
 
   // Removes the stored path if the user navigated away from the /experiments page
   if (!window.location.pathname.substring(0, prefix.length+12).includes(prefix + "/experiments"))
@@ -63,13 +64,15 @@ function App() {
     const { data, origin } = event;
     switch (data.type) {
     case 'iframe-connected':
-      ['iframe', 'iframe-run'].forEach((id) => {
-        const element = document.getElementById(id) as HTMLIFrameElement;
-        if (element) {
-          // TODO: get namespace from user info, use fixed value: mlx for now
-          element.contentWindow.postMessage({type: 'namespace-selected', value: 'mlx'}, origin);
-        }
-      })
+      if (!kfpStandalone) {
+        ['iframe', 'iframe-run'].forEach((id) => {
+          const element = document.getElementById(id) as HTMLIFrameElement;
+          if (element) {
+            // TODO: get namespace from user info, use fixed value: mlx for now
+            element.contentWindow.postMessage({type: 'namespace-selected', value: 'mlx'}, origin);
+          }
+        })
+      }
       break;
     }
   });