@rancher/shell 0.5.3 → 2.0.0

package/edit/cis.cattle.io.clusterscanbenchmark.vue

@@ -2,15 +2,18 @@
 import createEditView from '@shell/mixins/create-edit-view';
 import CruResource from '@shell/components/CruResource';
 import LabeledSelect from '@shell/components/form/LabeledSelect';
+import ResourceLabeledSelect from '@shell/components/form/ResourceLabeledSelect';
 import { LabeledInput } from '@components/Form/LabeledInput';
 import NameNsDescription from '@shell/components/form/NameNsDescription';
 import { mapGetters } from 'vuex';
 import { CONFIG_MAP } from '@shell/config/types';
+import { PaginationParamFilter } from '@shell/types/store/pagination.types';
+
 const providers = ['aks', 'docker', 'eks', 'gke', 'k3s', 'minikube', 'rke-windows', 'rke', 'rke2'];
 
 export default {
   components: {
-    CruResource, LabeledSelect, LabeledInput, NameNsDescription
+    CruResource, LabeledSelect, ResourceLabeledSelect, LabeledInput, NameNsDescription
   },
 
   mixins: [createEditView],
@@ -29,16 +32,19 @@ export default {
 
   },
 
-  async fetch() {
-    this.configMaps = await this.$store.dispatch('cluster/findAll', { type: CONFIG_MAP });
-  },
-
   data() {
     if (!this.value.spec) {
       this.$set(this.value, 'spec', {});
     }
 
-    return { configMaps: [], providers };
+    return {
+      CONFIG_MAP,
+      providers,
+      configMapPaginateSettings: {
+        labelSelectOptions: { 'get-option-label': (opt) => opt?.metadata?.name || opt.id || opt },
+        requestSettings:    this.pageRequestSettings,
+      }
+    };
   },
 
   computed: {
@@ -55,7 +61,31 @@ export default {
         this.$set(this.value.spec, 'customBenchmarkConfigMapNamespace', namespace);
       }
     },
-    ...mapGetters({ t: 'i18n/t' })
+
+    ...mapGetters({ t: 'i18n/t' }),
+  },
+
+  methods: {
+    /**
+     * @param [LabelSelectPaginationFunctionOptions] opts
+     * @returns LabelSelectPaginationFunctionOptions
+     */
+    pageRequestSettings(opts) {
+      const { opts: { filter } } = opts;
+
+      return {
+        ...opts,
+        classify: true,
+        filters:  !!filter ? [PaginationParamFilter.createMultipleFields([
+          {
+            field: 'metadata.name', value: filter, equals: true
+          },
+          {
+            field: 'metadata.namespace', value: filter, equals: true
+          },
+        ])] : []
+      };
+    },
   }
 };
 </script>
@@ -89,13 +119,15 @@ export default {
         />
       </div>
       <div class="col span-6">
-        <LabeledSelect
+        <ResourceLabeledSelect
           v-model="customConfigMap"
           :clearable="true"
+          option-key="id"
           option-label="id"
-          :options="configMaps"
           :mode="mode"
           :label="t('cis.customConfigMap')"
+          :resource-type="CONFIG_MAP"
+          :paginated-resource-settings="configMapPaginateSettings"
         />
       </div>
     </div>

package/edit/cloudcredential.vue

@@ -4,7 +4,7 @@ import { MANAGEMENT, NORMAN, SCHEMA, DEFAULT_WORKSPACE } from '@shell/config/typ
 import CreateEditView from '@shell/mixins/create-edit-view';
 import NameNsDescription from '@shell/components/form/NameNsDescription';
 import CruResource from '@shell/components/CruResource';
-import { _CREATE } from '@shell/config/query-params';
+import { _CREATE, _EDIT } from '@shell/config/query-params';
 import Loading from '@shell/components/Loading';
 import Labels from '@shell/components/form/Labels';
 import { HIDE_SENSITIVE } from '@shell/store/prefs';
@@ -70,6 +70,11 @@ export default {
       set(this.value, '_name', '');
     }
 
+    if (this.mode === _EDIT && this.value?.name?.length) {
+      this.value._name = this.value.name;
+      this.nameRequiredValidation = true;
+    }
+
     if ( this.value.provider ) {
       this.selectType(this.value.provider);
     }
@@ -77,14 +82,20 @@ export default {
 
   data() {
     return {
-      nodeDrivers:      null,
-      kontainerDrivers: null
+      credCustomComponentValidation: false,
+      nameRequiredValidation:        false,
+      nodeDrivers:                   null,
+      kontainerDrivers:              null
     };
   },
 
   computed: {
     rke2Enabled: mapFeature(RKE2_FEATURE),
 
+    validationPassed() {
+      return this.credCustomComponentValidation && this.nameRequiredValidation;
+    },
+
     storeOverride() {
       return 'rancher';
     },
@@ -171,6 +182,14 @@ export default {
   },
 
   methods: {
+    handleNameRequiredValidation() {
+      this.nameRequiredValidation = !!this.value?._name?.length;
+    },
+
+    createValidationChanged(passed) {
+      this.credCustomComponentValidation = passed;
+    },
+
     async saveCredential(btnCb) {
       if ( this.errors ) {
         clear(this.errors);
@@ -245,7 +264,7 @@ export default {
     <CruResource
       v-else
       :mode="mode"
-      :validation-passed="true"
+      :validation-passed="validationPassed"
       :selected-subtype="value._type"
       :resource="value"
       :errors="errors"
@@ -258,12 +277,14 @@ export default {
     >
       <NameNsDescription
         v-model="value"
+        :name-editable="true"
         name-key="_name"
         description-key="description"
         name-label="cluster.credential.name.label"
         name-placeholder="cluster.credential.name.placeholder"
         :mode="mode"
         :namespaced="false"
+        @change="handleNameRequiredValidation"
       />
       <keep-alive>
         <component
@@ -273,6 +294,7 @@ export default {
           :value="value"
           :mode="mode"
           :hide-sensitive-data="hideSensitiveData"
+          @validationChanged="createValidationChanged"
         />
       </keep-alive>
     </CruResource>

package/edit/configmap.vue

@@ -61,11 +61,17 @@ export default {
   },
 
   methods: {
-    async saveConfigMap() {
-      const yaml = this.$refs.cru.createResourceYaml(this.yamlModifiers);
+    async saveConfigMap(saveCb) {
+      this.errors = [];
+      const yaml = await this.$refs.cru.createResourceYaml(this.yamlModifiers);
 
-      await this.value.saveYaml(yaml);
-      this.done();
+      try {
+        await this.value.saveYaml(yaml);
+        this.done();
+      } catch (err) {
+        this.errors.push(err);
+        saveCb(false);
+      }
     },
 
     updateValue(val, type) {

package/edit/fleet.cattle.io.gitrepo.vue

@@ -22,7 +22,7 @@ import { base64Decode, base64Encode } from '@shell/utils/crypto';
 import SelectOrCreateAuthSecret from '@shell/components/form/SelectOrCreateAuthSecret';
 import { _CREATE } from '@shell/config/query-params';
 import { isHarvesterCluster } from '@shell/utils/cluster';
-import { CAPI, CATALOG } from '@shell/config/labels-annotations';
+import { CAPI, CATALOG, FLEET as FLEET_LABELS } from '@shell/config/labels-annotations';
 import { SECRET_TYPES } from '@shell/config/secret';
 import { checkSchemasForFindAllHash } from '@shell/utils/auth';
 import Checkbox from '@components/Form/Checkbox/Checkbox.vue';
@@ -413,8 +413,9 @@ export default {
           type:     SECRET,
           metadata: {
             namespace:    this.value.metadata.namespace,
-            generateName: 'auth-'
-          },
+            generateName: 'auth-',
+            labels:       { [FLEET_LABELS.MANAGED]: 'true' }
+          }
         });
 
         let type, publicField, privateField;
@@ -576,10 +577,10 @@ export default {
         :mode="mode"
         generate-name="gitrepo-auth-"
         label-key="fleet.gitRepo.auth.git"
+        :cache-secrets="true"
         @input="updateAuth($event, 'clientSecretName')"
         @inputauthval="updateCachedAuthVal($event, 'clientSecretName')"
       />
-
       <SelectOrCreateAuthSecret
         data-testid="gitrepo-helm-auth"
         :value="value.spec.helmSecretName"
@@ -591,6 +592,7 @@ export default {
         generate-name="helmrepo-auth-"
         label-key="fleet.gitRepo.auth.helm"
         :pre-select="tempCachedValues.helmSecretName"
+        :cache-secrets="true"
         @input="updateAuth($event, 'helmSecretName')"
         @inputauthval="updateCachedAuthVal($event, 'helmSecretName')"
       />
@@ -696,6 +698,7 @@ export default {
               :mode="mode"
               :selectable="option => !option.disabled"
               :label="t('fleet.gitRepo.target.selectLabel')"
+              data-testid="fleet-gitrepo-target-cluster"
             >
               <template v-slot:option="opt">
                 <hr v-if="opt.kind === 'divider'">

package/edit/helm.cattle.io.projecthelmchart.vue

@@ -31,12 +31,7 @@ export default {
   async fetch() {
     await this.$store.dispatch('catalog/load');
     const inStore = this.$store.getters['currentStore'](NAMESPACE);
-
-    // this seems excessive but if we're gonna pull up specific configMaps we need then we need the configmaps to be in the store.
-    // ToDo: try to find a better way of loading these or just load the ones we need
-    await this.$store.dispatch(`${ inStore }/findAll`, { type: CONFIG_MAP });
-
-    const federatorSystemNamespacesConfigMap = await this.getConfigMap('cattle-monitoring-system/prometheus-federator-system-namespaces');
+    const federatorSystemNamespacesConfigMap = await this.$store.dispatch('cluster/find', { type: CONFIG_MAP, id: 'cattle-monitoring-system/prometheus-federator-system-namespaces' });
 
     this.systemNamespaces = JSON.parse(federatorSystemNamespacesConfigMap?.data?.['system-namespaces.json']);
 
@@ -53,22 +48,40 @@ export default {
     }
 
     return {
-      systemNamespaces: null,
-      namespaces:       [],
-      loading:          true
+      systemNamespaces:           null,
+      namespaces:                 [],
+      loading:                    true,
+      inStore:                    this.$store.getters['currentStore'](),
+      selectedNamespaceQuestions: null,
     };
   },
 
-  computed: {
-    selectedNamespaceQuestions() {
-      const inStore = this.$store.getters['currentStore']();
+  watch: {
+    /**
+     * Given the current namespace, fetch a specific secret from within which will contain a questions.yaml
+     */
+    async currentNamespace(neu, old) {
+      if (!neu) {
+        return;
+      }
 
-      const configMapRelationship = this.currentNamespace?.metadata?.relationships.find((relationship) => relationship?.toType === 'configmap');
+      const configMapRelationship = neu.metadata?.relationships.find((relationship) => relationship?.toType === CONFIG_MAP);
 
-      const questionsYaml = this.$store.getters[`${ inStore }/byId`](configMapRelationship?.toType, configMapRelationship?.toId)?.data?.['questions.yaml'];
+      if (!configMapRelationship?.toId) {
+        return;
+      }
 
-      return jsyaml.load(questionsYaml)?.questions;
-    },
+      const res = await this.$store.dispatch(`${ this.inStore }/find`, { type: CONFIG_MAP, id: configMapRelationship.toId });
+      const questionsYaml = res?.data?.['questions.yaml'];
+
+      if (!questionsYaml) {
+        return;
+      }
+      this.selectedNamespaceQuestions = jsyaml.load(questionsYaml)?.questions;
+    }
+  },
+
+  computed: {
     currentNamespace() {
       return this.namespaces.find((namespace) => namespace.id === this.value?.metadata?.namespace);
     }
@@ -78,9 +91,6 @@ export default {
     getNamespaceConfigMapId(namespace) {
       return this.currentNamespace?.metadata?.relationships.find((relationship) => relationship?.toType === 'configmap')?.toId;
     },
-    async getConfigMap(id) {
-      return await this.$store.dispatch('cluster/find', { type: CONFIG_MAP, id });
-    },
     namespaceFilter(namespace) {
       const excludeProjects = [...this.systemNamespaces?.systemProjectLabelValues || [], this.systemNamespaces?.projectReleaseLabelValue];
 

package/edit/kontainerDriver.vue

@@ -0,0 +1,65 @@
+<script>
+import CreateEditView from '@shell/mixins/create-edit-view';
+import CruResource from '@shell/components/CruResource.vue';
+import FormValidation from '@shell/mixins/form-validation';
+import CreateDriver from '@shell/components/CreateDriver';
+import { _CREATE } from '@shell/config/query-params';
+
+export default {
+  name: 'KontainerDriverEdit',
+
+  components: {
+    CruResource,
+    CreateDriver
+  },
+
+  mixins: [CreateEditView, FormValidation],
+
+  data() {
+    return {
+      fvFormRuleSets: [
+        { path: 'url', rules: ['required', 'url'] },
+        { path: 'uiUrl', rules: ['url'] },
+        { path: 'checksum', rules: ['alphanumeric'] },
+        { path: 'whitelistDomains', rules: ['wildcardHostname'] }
+      ]
+    };
+  },
+  props: {
+    value: {
+      type:     Object,
+      required: true,
+      default:  () => {}
+    },
+    mode: {
+      type:    String,
+      default: _CREATE,
+    },
+  },
+};
+</script>
+
+<template>
+  <CruResource
+    :mode="mode"
+    :show-as-form="true"
+    :can-yaml="false"
+    :resource="value"
+    :errors="fvUnreportedValidationErrors"
+    :validation-passed="fvFormIsValid"
+    :cancel-event="true"
+    :done-route="doneRoute"
+    :apply-hooks="applyHooks"
+    component-testid="kontainer-driver-edit"
+    @done="done"
+    @error="e=>errors = e"
+    @finish="save"
+    @cancel="done"
+  >
+    <CreateDriver
+      :mode="mode"
+      :value="value"
+      :rules="{url:fvGetAndReportPathRules('url'), uiUrl:fvGetAndReportPathRules('uiUrl'), checksum:fvGetAndReportPathRules('checksum'), whitelistDomains:fvGetAndReportPathRules('whitelistDomains')}"
+    />
+  </CruResource>
+</template>

package/edit/logging-flow/Match.vue

@@ -1,9 +1,12 @@
 <script>
 import KeyValue from '@shell/components/form/KeyValue';
 import Select from '@shell/components/form/Select';
+import LabeledSelect from '@shell/components/form/LabeledSelect';
 
 export default {
-  components: { KeyValue, Select },
+  components: {
+    KeyValue, Select, LabeledSelect
+  },
 
   props: {
     mode: {
@@ -23,11 +26,6 @@ export default {
       default: () => [],
     },
 
-    containers: {
-      type:    Array,
-      default: () => [],
-    },
-
     namespaces: {
       type:    Array,
       default: () => [],
@@ -89,15 +87,18 @@ export default {
     </h3>
     <div class="row">
       <div class="col span-12">
-        <Select
+        <LabeledSelect
           v-model="value.container_names"
-          class="lg"
-          :options="containers"
+          :mode="mode"
+          :options="[]"
+          :disabled="false"
           :placeholder="t('logging.flow.matches.containerNames.placeholder')"
           :multiple="true"
           :taggable="true"
           :clearable="true"
+          :searchable="true"
           :close-on-select="false"
+          no-options-label-key="logging.flow.matches.containerNames.enter"
           placement="top"
         />
       </div>

package/edit/logging-flow/index.vue

@@ -6,14 +6,12 @@ import Loading from '@shell/components/Loading';
 import NameNsDescription from '@shell/components/form/NameNsDescription';
 import Tabbed from '@shell/components/Tabbed';
 import Tab from '@shell/components/Tabbed/Tab';
-import {
-  LOGGING, NAMESPACE, NODE, POD, SCHEMA
-} from '@shell/config/types';
+import { LOGGING, NAMESPACE, NODE, SCHEMA } from '@shell/config/types';
 import jsyaml from 'js-yaml';
 import { createYaml } from '@shell/utils/create-yaml';
 import YamlEditor, { EDITOR_MODES } from '@shell/components/YamlEditor';
 import { allHash } from '@shell/utils/promise';
-import { isArray, uniq } from '@shell/utils/array';
+import { isArray } from '@shell/utils/array';
 import { matchRuleIsPopulated } from '@shell/models/logging.banzaicloud.io.flow';
 import LabeledSelect from '@shell/components/form/LabeledSelect';
 import { clone, set } from '@shell/utils/object';
@@ -55,7 +53,6 @@ export default {
     const hasAccessToOutputs = this.$store.getters[`cluster/schemaFor`](LOGGING.OUTPUT);
     const hasAccessToNamespaces = this.$store.getters[`cluster/schemaFor`](NAMESPACE);
     const hasAccessToNodes = this.$store.getters[`cluster/schemaFor`](NODE);
-    const hasAccessToPods = this.$store.getters[`cluster/schemaFor`](POD);
     const isFlow = this.value.type === LOGGING.FLOW;
 
     const getAllOrDefault = (type, hasAccess) => {
@@ -67,7 +64,6 @@ export default {
       allClusterOutputs: getAllOrDefault(LOGGING.CLUSTER_OUTPUT, hasAccessToClusterOutputs),
       allNamespaces:     getAllOrDefault(NAMESPACE, hasAccessToNamespaces),
       allNodes:          getAllOrDefault(NODE, hasAccessToNodes),
-      allPods:           getAllOrDefault(POD, hasAccessToPods),
     });
 
     for ( const k of Object.keys(hash) ) {
@@ -84,7 +80,8 @@ export default {
     if ( this.value.spec.filters?.length ) {
       filtersYaml = jsyaml.dump(this.value.spec.filters);
     } else {
-      filtersYaml = createYaml(schemas, LOGGING.SPOOFED.FILTERS, []);
+      // Note - no need to call fetchResourceFields here (spoofed type has popoulated resourceFields)
+      filtersYaml = createYaml(schemas, LOGGING.SPOOFED.FILTERS, {});
       // createYaml doesn't support passing reference types (array, map) as the first type. As such
       // I'm manipulating the output since I'm not sure it's something we want to actually support
       // seeing as it's really createResourceYaml and this here is a gray area between spoofed types
@@ -203,17 +200,6 @@ export default {
       return out;
     },
 
-    containerChoices() {
-      const out = [];
-
-      for ( const pod of this.allPods ) {
-        for ( const c of (pod.spec?.containers || []) ) {
-          out.push(c.name);
-        }
-      }
-
-      return uniq(out).sort();
-    },
   },
 
   watch: {
@@ -385,7 +371,6 @@ export default {
               :mode="mode"
               :namespaces="namespaceChoices"
               :nodes="nodeChoices"
-              :containers="containerChoices"
               :is-cluster-flow="value.type === LOGGING.CLUSTER_FLOW"
               @remove="e=>removeMatch(props.row.i)"
               @input="e=>updateMatch(e,props.row.i)"