@rancher/shell 0.3.14 → 0.3.16

package/components/form/SimpleSecretSelector.vue

@@ -31,7 +31,7 @@ export default {
     // to choose from.
     const allSecrets = await this.$store.dispatch('cluster/findAll', { type: SECRET });
 
-    const allSecretsInNamespace = allSecrets.filter(secret => this.types.includes(secret._type) && secret.namespace === this.namespace);
+    const allSecretsInNamespace = allSecrets.filter((secret) => this.types.includes(secret._type) && secret.namespace === this.namespace);
 
     this.secrets = allSecretsInNamespace;
   },
@@ -83,7 +83,7 @@ export default {
 
   computed: {
     secretNames() {
-      const mappedSecrets = this.secrets.map(secret => ({
+      const mappedSecrets = this.secrets.map((secret) => ({
         label: secret.name,
         value: secret.name
       })).sort();
@@ -91,9 +91,9 @@ export default {
       return [{ label: 'None', value: NONE }, ...sortBy(mappedSecrets, 'label')];
     },
     keys() {
-      const secret = this.secrets.find(secret => secret.name === this.name) || {};
+      const secret = this.secrets.find((secret) => secret.name === this.name) || {};
 
-      return Object.keys(secret.data || {}).map(key => ({
+      return Object.keys(secret.data || {}).map((key) => ({
         label: key,
         value: key
       }));

package/components/form/Taints.vue

@@ -28,7 +28,7 @@ export default {
   },
 
   data() {
-    return { effectOptions: Object.values(EFFECT_VALUES).map(v => ({ label: v, value: v })) };
+    return { effectOptions: Object.values(EFFECT_VALUES).map((v) => ({ label: v, value: v })) };
   },
 
   computed: {

package/components/form/ValueFromResource.vue

@@ -129,7 +129,7 @@ export default {
       if (this.namespaced) {
         const map = this.$store.getters.namespaces();
 
-        return Object.keys(map).filter(key => map[key]);
+        return Object.keys(map).filter((key) => map[key]);
       } else {
         const inStore = this.$store.getters['currentStore'](NAMESPACE);
 
@@ -139,9 +139,9 @@ export default {
 
     sourceOptions() {
       if (this.type === 'configMapKeyRef' || this.type === 'configMapRef') {
-        return this.allConfigMaps.filter(map => this.namespaces.includes(map?.metadata?.namespace));
+        return this.allConfigMaps.filter((map) => this.namespaces.includes(map?.metadata?.namespace));
       } else if (this.type === 'secretRef' || this.type === 'secretKeyRef') {
-        return this.allSecrets.filter(secret => this.namespaces.includes(secret?.metadata?.namespace));
+        return this.allSecrets.filter((secret) => this.namespaces.includes(secret?.metadata?.namespace));
       } else {
         return [];
       }

package/components/form/WorkloadPorts.vue

@@ -56,7 +56,7 @@ export default {
     });
 
     // show host port column if existing port data has any host ports defined
-    const showHostPorts = !!rows.some(row => !!row.hostPort);
+    const showHostPorts = !!rows.some((row) => !!row.hostPort);
 
     return {
       rows,
@@ -110,15 +110,15 @@ export default {
     },
 
     clusterIPServicePorts() {
-      return ((this.services.filter(svc => svc.spec.type === 'ClusterIP') || [])[0] || {})?.spec?.ports;
+      return ((this.services.filter((svc) => svc.spec.type === 'ClusterIP') || [])[0] || {})?.spec?.ports;
     },
 
     loadBalancerServicePorts() {
-      return ((this.services.filter(svc => svc.spec.type === 'LoadBalancer') || [])[0] || {})?.spec?.ports;
+      return ((this.services.filter((svc) => svc.spec.type === 'LoadBalancer') || [])[0] || {})?.spec?.ports;
     },
 
     nodePortServicePorts() {
-      return ((this.services.filter(svc => svc.spec.type === 'NodePort') || [])[0] || {})?.spec?.ports;
+      return ((this.services.filter((svc) => svc.spec.type === 'NodePort') || [])[0] || {})?.spec?.ports;
     },
 
     ipamOptions() {
@@ -132,11 +132,11 @@ export default {
     },
 
     ipamIndex() {
-      return this.rows.findIndex(row => row._serviceType === 'LoadBalancer' && row.protocol === 'TCP');
+      return this.rows.findIndex((row) => row._serviceType === 'LoadBalancer' && row.protocol === 'TCP');
     },
 
     serviceWithIpam() {
-      return this.services.find(s => s?.metadata?.annotations[HCI_LABELS_ANNOTATIONS.CLOUD_PROVIDER_IPAM]);
+      return this.services.find((s) => s?.metadata?.annotations[HCI_LABELS_ANNOTATIONS.CLOUD_PROVIDER_IPAM]);
     },
 
     showIpam() {
@@ -159,7 +159,7 @@ export default {
     },
 
     provisioningCluster() {
-      const out = this.$store.getters['management/all'](CAPI.RANCHER_CLUSTER).find(c => c?.status?.clusterName === this.currentCluster.metadata.name);
+      const out = this.$store.getters['management/all'](CAPI.RANCHER_CLUSTER).find((c) => c?.status?.clusterName === this.currentCluster.metadata.name);
 
       return out;
     },
@@ -389,6 +389,7 @@ export default {
             :mode="mode"
             :options="ipamOptions"
             :label="t('servicesPage.harvester.ipam.label')"
+            :disabled="mode === 'edit'"
             @input="queueUpdate"
           />
         </div>

package/components/form/__tests__/Error.test.ts

@@ -26,7 +26,7 @@ describe('component: Error', () => {
   });
   it('should properly pass the component value property to test function', () => {
     const value = 'testValue';
-    const rules: Rule[] = [val => val];
+    const rules: Rule[] = [(val) => val];
 
     const wrapper = mount(Error, { propsData: { value, rules } });
     const element = wrapper.find('[data-testid="error-span"]');

package/components/form/__tests__/KeyValue.test.ts

@@ -32,4 +32,25 @@ describe('component: KeyValue', () => {
     expect(inputFieldTextArea).toBeUndefined();
     expect(inputFieldMultiline).toBeDefined();
   });
+
+  it('should have new lines in textarea', async() => {
+    const wrapper = mount(KeyValue, {
+      propsData: {
+        value:                  { foo: 'bar' },
+        valueMarkdownMultiline: false,
+      },
+      mocks:      { $store: { getters: { 'i18n/t': jest.fn() } } },
+      directives: { t }
+    });
+
+    const inputFieldTextArea = wrapper.find('[data-testid="text-area-auto-grow"]');
+
+    inputFieldTextArea.setValue('bar\n');
+
+    await inputFieldTextArea.trigger('keydown.enter');
+
+    const textArea = inputFieldTextArea.element as HTMLTextAreaElement;
+
+    expect(textArea.value).toBe('bar\n');
+  });
 });

package/components/formatter/ClusterLink.vue

@@ -27,7 +27,7 @@ export default {
 
     statusErrorConditions() {
       if (this.row.hasError) {
-        return this.row?.status.conditions.filter(condition => condition.error === true);
+        return this.row?.status.conditions.filter((condition) => condition.error === true);
       }
 
       return false;

package/components/formatter/ClusterProvider.vue

@@ -14,14 +14,25 @@ export default {
       // This is the workaround.
       isImported: props.row.mgmt?.providerForEmberParam === 'import'
     };
-  }
+  },
 };
 </script>
 
 <template>
   <div>
     <template v-if="row.machineProvider">
-      {{ row.machineProviderDisplay }}
+      <span v-if="row.isHarvester && row.mgmt && row.mgmt.isReady && !row.hasError">
+        <a
+          v-if="row.mgmt.isReady && !row.hasError"
+          role="button"
+          @click="row.goToHarvesterCluster()"
+        >
+          {{ row.machineProviderDisplay }}
+        </a>
+      </span>
+      <span v-else>
+        {{ row.machineProviderDisplay }}
+      </span>
     </template>
     <template v-else-if="row.isCustom">
       {{ t('cluster.provider.custom') }}

package/components/formatter/Endpoints.vue

@@ -24,7 +24,7 @@ export default {
     // value may be JSON from "field.cattle.io/publicEndpoints" label
     parsed() {
       const nodes = this.nodes;
-      const nodeWithExternal = nodes.find(node => !!node.externalIp) || {};
+      const nodeWithExternal = nodes.find((node) => !!node.externalIp) || {};
       const externalIp = nodeWithExternal.externalIp;
 
       if ( this.value && this.value.length ) {

package/components/formatter/FleetSummaryGraph.vue

@@ -24,7 +24,7 @@ export default {
     },
 
     stateParts() {
-      const keys = Object.keys(this.summary).filter(x => !x.startsWith('desired'));
+      const keys = Object.keys(this.summary).filter((x) => !x.startsWith('desired'));
 
       const out = keys.map((key) => {
         const textColor = colorForState(key);
@@ -36,7 +36,7 @@ export default {
           value: this.summary[key],
           sort:  stateSort(textColor, key),
         };
-      }).filter(x => x.value > 0);
+      }).filter((x) => x.value > 0);
 
       return sortBy(out, 'sort:desc');
     },

package/components/formatter/IngressTarget.vue

@@ -18,12 +18,12 @@ export default {
   },
 
   async fetch() {
-    await Promise.all(Object.values(WORKLOAD_TYPES).map(type => this.$store.dispatch('cluster/findAll', { type })));
+    await Promise.all(Object.values(WORKLOAD_TYPES).map((type) => this.$store.dispatch('cluster/findAll', { type })));
   },
 
   computed: {
     workloads() {
-      return Object.values(WORKLOAD_TYPES).flatMap(type => this.$store.getters['cluster/all'](type));
+      return Object.values(WORKLOAD_TYPES).flatMap((type) => this.$store.getters['cluster/all'](type));
     },
     paths() {
       return this.row.createRulesForListPage(this.workloads);

package/components/formatter/PodImages.vue

@@ -45,7 +45,7 @@ export default {
     },
     mainImage() {
       const images = this.images;
-      const filter = images.filter(image => !IGNORE_IMAGES.find(i => image.includes(i)));
+      const filter = images.filter((image) => !IGNORE_IMAGES.find((i) => image.includes(i)));
 
       return filter.length > 0 ? filter[0] : images[0];
     }

package/components/formatter/PrincipalGroupBindings.vue

@@ -16,7 +16,7 @@ export default {
 
       return globalRoleBindings
         // Bindings for this group
-        .filter(globalRoleBinding => globalRoleBinding.groupPrincipalName === principal.id)
+        .filter((globalRoleBinding) => globalRoleBinding.groupPrincipalName === principal.id)
         // Display name of role associated with binding
         .map((binding) => {
           const role = this.$store.getters['management/byId'](MANAGEMENT.GLOBAL_ROLE, binding.globalRoleName);

package/components/formatter/ReceiverIcons.vue

@@ -59,14 +59,14 @@ export default {
         }, {});
 
       // if there are keys other than those defined in RECEIVERS_TYPES and 'name', assume they're custom types and sum them under "custom"
-      const expectedKeys = RECEIVERS_TYPES.map(type => type.key).filter(key => key !== 'custom');
+      const expectedKeys = RECEIVERS_TYPES.map((type) => type.key).filter((key) => key !== 'custom');
 
       expectedKeys.push('name');
       const customKeys = Object.keys(receiver)
-        .filter(key => !expectedKeys.includes(key));
+        .filter((key) => !expectedKeys.includes(key));
 
       if (customKeys.length > 0) {
-        const customType = RECEIVERS_TYPES.find(type => type.name === 'custom');
+        const customType = RECEIVERS_TYPES.find((type) => type.name === 'custom');
         const customLabel = this.t(customType.label);
 
         types[customLabel] = { count: customKeys.length, logo: customType.logo };

package/components/formatter/ServiceType.vue

@@ -24,7 +24,7 @@ export default {
       cloned = 'headless';
     }
 
-    const match = DEFAULT_SERVICE_TYPES.find(s => s.id.toLowerCase() === cloned);
+    const match = DEFAULT_SERVICE_TYPES.find((s) => s.id.toLowerCase() === cloned);
     const translationLabel = match?.label;
     let translated;
 

package/components/formatter/WorkloadDetailEndpoints.vue

@@ -19,7 +19,7 @@ export default {
     // value may be JSON from "field.cattle.io/publicEndpoints" label
     parsed() {
       const nodes = this.nodes;
-      const nodeWithExternal = nodes.find(node => !!node.externalIp) || {};
+      const nodeWithExternal = nodes.find((node) => !!node.externalIp) || {};
       const externalIp = nodeWithExternal.externalIp;
 
       if ( this.value && this.value.length ) {

package/components/formatter/WorkloadHealthScale.vue

@@ -68,7 +68,7 @@ export default {
           color: `bg-${ value.color }`,
           value: value.count || 0,
           label: ucFirst(name)
-        })).filter(x => x.value > 0);
+        })).filter((x) => x.value > 0);
 
       return 5;
     },

package/components/formatter/__tests__/LiveDate.test.ts

@@ -52,7 +52,7 @@ describe('component: LiveDate', () => {
     let element = wrapper.find('span');
 
     expect(element.text()).toContain('Just now');
-    await new Promise(resolve => setTimeout(resolve, 1000));
+    await new Promise((resolve) => setTimeout(resolve, 1000));
     await wrapper.vm.liveUpdate(Date.now());
 
     element = wrapper.find('span');

package/components/graph/Bar.vue

@@ -29,7 +29,7 @@ export default {
       return { backgroundColor: `var(${ this.secondaryColor })` };
     },
     sliceStyles() {
-      return this.slices.map(slice => ({
+      return this.slices.map((slice) => ({
         left:       `${ slice }%`,
         visibility: slice < this.percentage ? 'visible' : 'hidden'
       }));

package/components/graph/LinePlot.vue

@@ -38,7 +38,7 @@ export default {
     },
     // get size of largest data set to scale x-axis
     largestSetSize() {
-      return this.dataSets.map(set => set.points.length).reduce((a, b) => Math.max(a, b));
+      return this.dataSets.map((set) => set.points.length).reduce((a, b) => Math.max(a, b));
     },
     lines() {
       const vm = this;
@@ -51,7 +51,7 @@ export default {
 
         const path = d3.line()
           .x((d, i) => vm.scaleX(range, i))
-          .y(d => vm.scaleY(domain, d));
+          .y((d) => vm.scaleY(domain, d));
 
         paths.push(path(dataSet));
       }
@@ -68,7 +68,7 @@ export default {
           const group = d3.selectAll(`.lines--${ i }`).selectAll('*').nodes();
 
           if (group) {
-            group.forEach(element => vm.animateLine(element));
+            group.forEach((element) => vm.animateLine(element));
           }
         });
       },

package/components/nav/Group.vue

@@ -108,7 +108,7 @@ export default {
 
         // If there is a default type, use it
         if (this.group.defaultType) {
-          const found = items.findIndex(i => i.name === this.group.defaultType);
+          const found = items.findIndex((i) => i.name === this.group.defaultType);
 
           index = (found === -1) ? 0 : found;
         }
@@ -146,7 +146,7 @@ export default {
           return true;
         } else if (item.route) {
           const navLevels = ['cluster', 'product', 'resource'];
-          const matchesNavLevel = navLevels.filter(param => !this.$route.params[param] || this.$route.params[param] !== item.route.params[param]).length === 0;
+          const matchesNavLevel = navLevels.filter((param) => !this.$route.params[param] || this.$route.params[param] !== item.route.params[param]).length === 0;
           const withoutHash = this.$route.hash ? this.$route.fullPath.slice(0, this.$route.fullPath.indexOf(this.$route.hash)) : this.$route.fullPath;
           const withoutQuery = withoutHash.split('?')[0];
 

package/components/nav/Header.vue

@@ -61,7 +61,7 @@ export default {
 
   computed: {
     ...mapGetters(['clusterReady', 'isExplorer', 'isMultiCluster', 'isRancher', 'currentCluster',
-      'currentProduct', 'backToRancherLink', 'backToRancherGlobalLink', 'pageActions', 'isSingleProduct']),
+      'currentProduct', 'backToRancherLink', 'backToRancherGlobalLink', 'pageActions', 'isSingleProduct', 'isRancherInHarvester']),
     ...mapGetters('type-map', ['activeProducts']),
 
     appName() {
@@ -292,7 +292,7 @@ export default {
       // Make sure we wait at least 1 second so that the user can see the visual indication that the config has been copied
       allHash({
         copy:     this.currentCluster.copyKubeConfig(),
-        minDelay: new Promise(resolve => setTimeout(resolve, 1000))
+        minDelay: new Promise((resolve) => setTimeout(resolve, 1000))
       }).finally(() => {
         this.kubeConfigCopying = false;
 
@@ -337,14 +337,14 @@ export default {
     ref="header"
   >
     <div>
-      <TopLevelMenu v-if="isMultiCluster || !isSingleProduct" />
+      <TopLevelMenu v-if="isRancherInHarvester || isMultiCluster || !isSingleProduct" />
     </div>
     <div
       class="menu-spacer"
       :class="{'isSingleProduct': isSingleProduct }"
     >
       <n-link
-        v-if="isSingleProduct"
+        v-if="isSingleProduct && !isRancherInHarvester"
         :to="singleProductLogoRoute"
       >
         <img
@@ -364,7 +364,7 @@ export default {
         class="cluster cluster-clipped"
       >
         <div
-          v-if="isSingleProduct"
+          v-if="isSingleProduct && !isRancherInHarvester"
           class="product-name"
         >
           {{ t(isSingleProduct.productNameKey) }}

package/components/nav/NamespaceFilter.vue

@@ -61,11 +61,11 @@ export default {
         if (this.namespaceFilterMode?.length) {
           // We always show dividers, projects and namespaces
           if (!forcedNamespaceValidTypes.includes(item.kind)) {
-            const validCustomType = this.namespaceFilterMode.find(prefix => item.kind.startsWith(prefix));
+            const validCustomType = this.namespaceFilterMode.find((prefix) => item.kind.startsWith(prefix));
 
             if (!validCustomType) {
               // Hide any invalid option that's not selected
-              return this.value.findIndex(v => v.id === item.id) >= 0;
+              return this.value.findIndex((v) => v.id === item.id) >= 0;
             }
           }
         }
@@ -96,7 +96,7 @@ export default {
         // Are we in restricted resource type mode, if so is this an allowed type?
         if (this.namespaceFilterMode?.length) {
           const isLastSelected = i.selected && (i.id === ALL || this.value.length === 1);
-          const kindAllowed = this.namespaceFilterMode.find(f => f === i.kind);
+          const kindAllowed = this.namespaceFilterMode.find((f) => f === i.kind);
           const isNotInProjectGroup = i.id === ALL_ORPHANS;
 
           i.enabled = (!isLastSelected && kindAllowed) && !isNotInProjectGroup;
@@ -327,7 +327,7 @@ export default {
           .map((value) => {
             return findBy(options, 'id', value);
           })
-          .filter(x => !!x);
+          .filter((x) => !!x);
 
         return filters;
       },
@@ -335,22 +335,22 @@ export default {
       set(neu) {
         const old = (this.value || []).slice();
 
-        neu = neu.filter(x => !!x.id);
+        neu = neu.filter((x) => !!x.id);
 
         const last = neu[neu.length - 1];
         const lastIsSpecial = last?.kind === NAMESPACE_FILTER_KINDS.SPECIAL;
-        const hadUser = !!old.find(x => x.id === ALL_USER);
-        const hadAll = !!old.find(x => x.id === ALL);
+        const hadUser = !!old.find((x) => x.id === ALL_USER);
+        const hadAll = !!old.find((x) => x.id === ALL);
 
         if (lastIsSpecial) {
           neu = [last];
         }
 
         if (neu.length > 1) {
-          neu = neu.filter(x => x.kind !== NAMESPACE_FILTER_KINDS.SPECIAL);
+          neu = neu.filter((x) => x.kind !== NAMESPACE_FILTER_KINDS.SPECIAL);
         }
 
-        if (neu.find(x => x.id === 'all')) {
+        if (neu.find((x) => x.id === 'all')) {
           neu = [];
         }
 
@@ -361,7 +361,7 @@ export default {
         if (neu.length === 0 && !hadUser && !hadAll) {
           ids = this.defaultOption();
         } else {
-          ids = neu.map(x => x.id);
+          ids = neu.map((x) => x.id);
         }
 
         this.$nextTick(() => {
@@ -522,7 +522,7 @@ export default {
       }
     },
     mouseOver(event) {
-      const el = event?.path?.find(e => e.classList.contains('ns-option'));
+      const el = event?.path?.find((e) => e.classList.contains('ns-option'));
 
       this.activeElement = el;
     },
@@ -615,15 +615,15 @@ export default {
       // Remove invalid
       if (!!this.namespaceFilterMode?.length) {
         this.value.forEach((v) => {
-          if (!this.namespaceFilterMode.find(f => f === v.kind)) {
-            const index = current.findIndex(c => c.id === v.id);
+          if (!this.namespaceFilterMode.find((f) => f === v.kind)) {
+            const index = current.findIndex((c) => c.id === v.id);
 
             current.splice(index, 1);
           }
         });
       }
 
-      const exists = current.findIndex(v => v.id === option.id);
+      const exists = current.findIndex((v) => v.id === option.id);
 
       // Remove if it exists (or always add if in singleton mode - we've reset the list above)
       if (exists !== -1) {