From 31f1b3bed1386b827914fa3ddc44b44722a62269 Mon Sep 17 00:00:00 2001
From: Jihyun Kang <jihyunkang@lablup.com>
Date: Mon, 9 Sep 2024 13:22:34 +0900
Subject: [PATCH] add: convert showing all environment images including
 uninstalled ones by config

---
 config.toml.sample                                  |  1 +
 .../components/ImageEnvironmentSelectFormItems.tsx  |  9 +++++----
 react/src/hooks/index.tsx                           |  1 +
 src/components/backend-ai-login.ts                  | 13 +++++++++++++
 4 files changed, 20 insertions(+), 4 deletions(-)

diff --git a/config.toml.sample b/config.toml.sample
index 1e00c200f8..50adf15647 100644
--- a/config.toml.sample
+++ b/config.toml.sample
@@ -67,6 +67,7 @@ allowNonAuthTCP = false             # Expose TCP apps to be executable in web br
 #allowlist = "" # Comma-separated image name. Image name should contain the repository (registry path and image name) part of the full image URL, excluding the protocol and tag
 # e.g. cr.backend.ai/stable/python
 # You should pick default_environment in general section too.
+showAllEnvironmentImages = false    # Show all environment images regardless of installation
 
 [server]
 webServerURL = "[Web server website URL. App will use the site instead of local app.]"
diff --git a/react/src/components/ImageEnvironmentSelectFormItems.tsx b/react/src/components/ImageEnvironmentSelectFormItems.tsx
index 64bc1ef891..59c1dfffc9 100644
--- a/react/src/components/ImageEnvironmentSelectFormItems.tsx
+++ b/react/src/components/ImageEnvironmentSelectFormItems.tsx
@@ -93,7 +93,10 @@ const ImageEnvironmentSelectFormItems: React.FC<
 
   const envSelectRef = useRef<RefSelectProps>(null);
   const versionSelectRef = useRef<RefSelectProps>(null);
-
+  const ImageEnvironmentSelectFormItemsVariables = baiClient?._config
+    ?.showAllEnvironmentImages
+    ? {}
+    : { installed: true };
   const { images } = useLazyLoadQuery<ImageEnvironmentSelectFormItemsQuery>(
     graphql`
       query ImageEnvironmentSelectFormItemsQuery($installed: Boolean) {
@@ -117,9 +120,7 @@ const ImageEnvironmentSelectFormItems: React.FC<
         }
       }
     `,
-    {
-      installed: true,
-    },
+    ImageEnvironmentSelectFormItemsVariables,
     {
       fetchPolicy: 'store-and-network',
     },
diff --git a/react/src/hooks/index.tsx b/react/src/hooks/index.tsx
index 8791244a73..a78c532a94 100644
--- a/react/src/hooks/index.tsx
+++ b/react/src/hooks/index.tsx
@@ -383,5 +383,6 @@ type BackendAIConfig = {
   allowSignout: boolean;
   allowNonAuthTCP: boolean;
   enableExtendLoginSession: boolean;
+  showAllEnvironmentImages: boolean;
   [key: string]: any;
 };
diff --git a/src/components/backend-ai-login.ts b/src/components/backend-ai-login.ts
index 4b4043aa9f..ed37752fc4 100644
--- a/src/components/backend-ai-login.ts
+++ b/src/components/backend-ai-login.ts
@@ -142,6 +142,7 @@ export default class BackendAILogin extends BackendAIPage {
   @property({ type: Boolean }) enableModelStore = false;
   @property({ type: Boolean }) enableLLMPlayground = false;
   @property({ type: Boolean }) enableExtendLoginSession = false;
+  @property({ type: Boolean }) showAllEnvironmentImages = false;
   @property({ type: String }) eduAppNamePrefix;
   @property({ type: String }) pluginPages;
   @property({ type: Array }) blockList = [] as string[];
@@ -1038,6 +1039,16 @@ export default class BackendAILogin extends BackendAIPage {
         ? environmentsConfig?.allowlist.split(',').map((el) => el.trim())
         : [],
     } as ConfigValueObject) as string[];
+
+    // Enable show all images when creating session/service
+    this.showAllEnvironmentImages = this._getConfigValueByExists(
+      environmentsConfig,
+      {
+        valueType: 'boolean',
+        defaultValue: false,
+        value: environmentsConfig?.showAllEnvironmentImages,
+      } as ConfigValueObject,
+    ) as boolean;
   }
 
   /**
@@ -1846,6 +1857,8 @@ export default class BackendAILogin extends BackendAIPage {
           this.maxFileUploadSize;
         globalThis.backendaiclient._config.allow_image_list =
           this.allow_image_list;
+        globalThis.backendaiclient._config.showAllEnvironmentImages =
+          this.showAllEnvironmentImages;
         globalThis.backendaiclient._config.maskUserInfo = this.maskUserInfo;
         globalThis.backendaiclient._config.singleSignOnVendors =
           this.singleSignOnVendors;