From 958e97f769ae13c94f997f0db2233bc34206f1bd Mon Sep 17 00:00:00 2001
From: "andy.lee" <andy.lee@suse.com>
Date: Wed, 18 Sep 2024 13:03:58 +0800
Subject: [PATCH] show one secret dropdown in storageClass create page

---
 .../provisioners/driver.longhorn.io.vue       | 83 +++++++------------
 pkg/harvester/l10n/en-us.yaml                 |  3 +-
 pkg/harvester/models/harvester/secret.js      | 10 +++
 3 files changed, 39 insertions(+), 57 deletions(-)

diff --git a/pkg/harvester/edit/harvesterhci.io.storage/provisioners/driver.longhorn.io.vue b/pkg/harvester/edit/harvesterhci.io.storage/provisioners/driver.longhorn.io.vue
index a62c2785..8d5f7dad 100644
--- a/pkg/harvester/edit/harvesterhci.io.storage/provisioners/driver.longhorn.io.vue
+++ b/pkg/harvester/edit/harvesterhci.io.storage/provisioners/driver.longhorn.io.vue
@@ -55,10 +55,13 @@ export default {
 
   async fetch() {
     const inStore = this.$store.getters['currentProduct'].inStore;
-    const allNamespaces = await this.$store.dispatch(`${ inStore }/findAll`, { type: NAMESPACE });
 
-    this.secrets = await this.$store.dispatch(`${ inStore }/findAll`, { type: SECRET });
-    this.namespaces = allNamespaces.filter(ns => ns.isSystem === false).map(ns => ns.id); // only show non-system namespaces to user to select
+    await this.$store.dispatch(`${ inStore }/findAll`, { type: NAMESPACE });
+
+    const allSecrets = await this.$store.dispatch(`${ inStore }/findAll`, { type: SECRET });
+
+    // only show non-system secret to user to select
+    this.secrets = allSecrets.filter(secret => secret.isSystem === false);
   },
   data() {
     if (this.realMode === _CREATE) {
@@ -72,20 +75,7 @@ export default {
       };
     }
 
-    return {
-      secrets:    [],
-      namespaces: [],
-    };
-  },
-  watch: {
-    secretNamespace() {
-      this.$set(this.value, 'parameters', {
-        ...this.value.parameters,
-        [CSI_PROVISIONER_SECRET_NAME]:  '',
-        [CSI_NODE_PUBLISH_SECRET_NAME]: '',
-        [CSI_NODE_STAGE_SECRET_NAME]:   ''
-      });
-    }
+    return { secrets: [] };
   },
   computed: {
     longhornNodes() {
@@ -131,13 +121,7 @@ export default {
     },
 
     secretOptions() {
-      const selectedNS = this.secretNamespace;
-
-      return this.secrets.filter(secret => secret.namespace === selectedNS).map(secret => secret.name);
-    },
-
-    secretNameOptions() {
-      return this.namespaces;
+      return this.secrets.map(secret => secret.id);
     },
 
     volumeEncryptionOptions() {
@@ -183,32 +167,29 @@ export default {
       }
     },
 
-    secretName: {
+    secret: {
       get() {
-        return this.value.parameters[CSI_PROVISIONER_SECRET_NAME];
+        const selectedNs = this.value.parameters[CSI_PROVISIONER_SECRET_NAMESPACE];
+        const selectedName = this.value.parameters[CSI_PROVISIONER_SECRET_NAME];
+
+        if (selectedNs && selectedName) {
+          return `${ selectedNs }/${ selectedName }`;
+        }
+
+        return '';
       },
 
-      set(neu) {
+      set(selectedSecret) {
+        const [namespace, name] = selectedSecret.split('/');
+
         this.$set(this.value, 'parameters', {
           ...this.value.parameters,
-          [CSI_PROVISIONER_SECRET_NAME]:  neu,
-          [CSI_NODE_PUBLISH_SECRET_NAME]: neu,
-          [CSI_NODE_STAGE_SECRET_NAME]:   neu
-        });
-      }
-    },
-
-    secretNamespace: {
-      get() {
-        return this.value.parameters[CSI_PROVISIONER_SECRET_NAMESPACE];
-      },
-
-      set(neu) {
-        this.$set(this.value, 'parameters', {
-          ...this.value.parameters,
-          [CSI_PROVISIONER_SECRET_NAMESPACE]:  neu,
-          [CSI_NODE_PUBLISH_SECRET_NAMESPACE]: neu,
-          [CSI_NODE_STAGE_SECRET_NAMESPACE]:   neu
+          [CSI_PROVISIONER_SECRET_NAME]:       name,
+          [CSI_NODE_PUBLISH_SECRET_NAME]:      name,
+          [CSI_NODE_STAGE_SECRET_NAME]:        name,
+          [CSI_PROVISIONER_SECRET_NAMESPACE]:  namespace,
+          [CSI_NODE_PUBLISH_SECRET_NAMESPACE]: namespace,
+          [CSI_NODE_STAGE_SECRET_NAMESPACE]:   namespace
         });
       }
     },
@@ -342,16 +323,8 @@ export default {
     <div v-if="value.parameters.encrypted === 'true'" class="row mt-20">
       <div class="col span-6">
         <LabeledSelect
-          v-model:value="secretNamespace"
-          :label="t('harvester.storage.secretNamespace')"
-          :options="secretNameOptions"
-          :mode="mode"
-        />
-      </div>
-      <div class="col span-6">
-        <LabeledSelect
-          v-model:value="secretName"
-          :label="t('harvester.storage.secretName')"
+          v-model:value="secret"
+          :label="t('harvester.storage.secret')"
           :options="secretOptions"
           :mode="mode"
         />
diff --git a/pkg/harvester/l10n/en-us.yaml b/pkg/harvester/l10n/en-us.yaml
index 25e41054..90886ba9 100644
--- a/pkg/harvester/l10n/en-us.yaml
+++ b/pkg/harvester/l10n/en-us.yaml
@@ -1113,8 +1113,7 @@ harvester:
     label: Storage
     useDefault: Use the default storage
     volumeEncryption: Volume Encryption
-    secretName: Secret Name
-    secretNamespace: Secret Namespace
+    secret: Secret
     migratable:
       label: Migratable
     numberOfReplicas:
diff --git a/pkg/harvester/models/harvester/secret.js b/pkg/harvester/models/harvester/secret.js
index ba562236..872d1605 100644
--- a/pkg/harvester/models/harvester/secret.js
+++ b/pkg/harvester/models/harvester/secret.js
@@ -2,6 +2,8 @@ import { clone } from '@shell/utils/object';
 import Secret from '@shell/models/secret';
 import { HCI } from '../../types';
 import { PRODUCT_NAME as HARVESTER_PRODUCT } from '../../config/harvester';
+import Secret from '@shell/models/secret';
+import { NAMESPACE } from '@shell/config/types';
 
 export default class HciSecret extends Secret {
   get _detailLocation() {
@@ -52,6 +54,14 @@ export default class HciSecret extends Secret {
     return this.doneOverride;
   }
 
+  get isSystem() {
+    const inStore = this.$rootGetters['currentProduct'].inStore;
+
+    const systemNs = this.$rootGetters[`${ inStore }/all`](NAMESPACE).filter(ns => ns.isSystem === true).map(ns => ns.metadata.name);
+
+    return systemNs.includes(this.metadata.namespace);
+  }
+
   get details() {
     const out = [
       {