@rancher/shell 3.0.9-rc.5 → 3.0.9

package/components/form/NodeScheduling.vue

@@ -1,17 +1,24 @@
-<script>
+<script lang="ts">
 import { mapGetters } from 'vuex';
 import { RadioGroup } from '@components/Form/Radio';
-import LabeledSelect from '@shell/components/form/LabeledSelect';
-import NodeAffinity from '@shell/components/form/NodeAffinity';
+import ResourceLabeledSelect from '@shell/components/form/ResourceLabeledSelect.vue';
+import NodeAffinity from '@shell/components/form/NodeAffinity.vue';
 import { HARVESTER_NAME as VIRTUAL } from '@shell/config/features';
 import { _VIEW } from '@shell/config/query-params';
 import { isEmpty } from '@shell/utils/object';
 import { HOSTNAME } from '@shell/config/labels-annotations';
+import { ResourceLabeledSelectPaginateSettings, ResourceLabeledSelectSettings } from '@shell/types/components/resourceLabeledSelect';
+import { NODE } from '@shell/config/types';
+import { LabelSelectPaginationFunctionOptions } from '@shell/components/form/labeled-select-utils/labeled-select.utils';
+import { PaginationFilterEquality, PaginationParamFilter } from '@shell/types/store/pagination.types';
+import { KubeNode, KubeNodeTaint } from '@shell/types/resources/node';
+
+const parseNode = (node: string | KubeNode) => typeof node === 'string' ? node : node.id;
 
 export default {
   components: {
     RadioGroup,
-    LabeledSelect,
+    ResourceLabeledSelect,
     NodeAffinity,
   },
 
@@ -23,6 +30,9 @@ export default {
       }
     },
 
+    /**
+     * HARVESTER ONLY PROPERTY
+     */
     nodes: {
       type:    Array,
       default: () => []
@@ -39,12 +49,71 @@ export default {
     },
   },
 
-  data() {
+  data(): {
+    selectNode: string | null;
+    nodeName: string;
+    nodeAffinity: any;
+    nodeSelector: any;
+    nodeSchedulingAllSettings: ResourceLabeledSelectSettings;
+    nodeSchedulingPaginationSettings: ResourceLabeledSelectPaginateSettings;
+    NODE: string;
+    } {
+    const keys = [
+      `node-role.kubernetes.io/control-plane`,
+      `node-role.kubernetes.io/etcd`
+    ];
+
+    // Settings used by ResourceLabeledSelect when node pagination disabled
+    const nodeSchedulingAllSettings: ResourceLabeledSelectSettings = {
+      updateResources(nodes: (string | KubeNode)[]) {
+        return nodes
+          .filter((node) => {
+            if (typeof node === 'string') {
+              // Already passed check
+              return true;
+            }
+
+            const taints = node.spec?.taints || [];
+
+            return taints.every((taint: KubeNodeTaint) => !keys.includes(taint.key));
+          })
+          .map(parseNode);
+      },
+    };
+
+    // Settings used by ResourceLabeledSelect when node pagination enabled
+    const nodeSchedulingPaginationSettings: ResourceLabeledSelectPaginateSettings = {
+      updateResources(nodes: (string | KubeNode)[]) {
+        return nodes.map(parseNode);
+      },
+      requestSettings: (opts: LabelSelectPaginationFunctionOptions) => {
+        const { filter } = opts.opts;
+        const filters = !!filter ? [
+          PaginationParamFilter.createSingleField({
+            field: 'metadata.name', value: filter, exact: false
+          })
+        ] : [];
+
+        filters.push(...keys.map((k) => PaginationParamFilter.createSingleField( ({
+          field: 'spec.taints.key', value: k, equality: PaginationFilterEquality.NOT_CONTAINS
+        }))));
+
+        opts.filters = filters;
+        opts.groupByNamespace = false;
+        opts.sort = [{ asc: true, field: 'metadata.name' }];
+
+        return opts;
+      }
+    };
+
     return {
       selectNode:   null,
       nodeName:     '',
       nodeAffinity: {},
       nodeSelector: {},
+      nodeSchedulingAllSettings,
+      nodeSchedulingPaginationSettings,
+      NODE
     };
   },
 
@@ -147,6 +216,9 @@ export default {
   watch: {
     'value.nodeSelector': {
       handler(nodeSelector) {
+        // Harvester specific code should not live in rancher/dashboard components
+        // This was brought into harvester/dashboard via https://github.com/harvester/dashboard/pull/342
+        // rancher/dashboard via https://github.com/rancher/dashboard/pull/6310
         if (this.isHarvester && nodeSelector?.[HOSTNAME]) {
           this.selectNode = 'nodeSelector';
           const nodeName = nodeSelector[HOSTNAME];
@@ -187,14 +259,16 @@ export default {
     <template v-if="selectNode === 'nodeSelector'">
       <div class="row">
         <div class="col span-6">
-          <LabeledSelect
+          <ResourceLabeledSelect
             v-model:value="nodeName"
             :label="t('workload.scheduling.affinity.nodeName')"
-            :options="nodes || []"
+            :resource-type="NODE"
             :mode="mode"
             :multiple="false"
             :loading="loading"
             :data-testid="'node-scheduling-nodeSelector'"
+            :allResourcesSettings="nodeSchedulingAllSettings"
+            :paginatedResourceSettings="nodeSchedulingPaginationSettings"
             @update:value="update"
           />
         </div>

package/components/form/NotificationSettings.vue

@@ -3,7 +3,7 @@ import { LabeledInput } from '@components/Form/LabeledInput';
 import { Checkbox } from '@components/Form/Checkbox';
 import { _EDIT, _VIEW } from '@shell/config/query-params';
 
-export default ({
+export default {
 
   name: 'NotificationSettings',
 
@@ -29,7 +29,7 @@ export default ({
     },
   },
 
-});
+};
 </script>
 
 <template>

package/components/form/PodAffinity.vue

@@ -2,7 +2,7 @@
 import { mapGetters } from 'vuex';
 import { _VIEW } from '@shell/config/query-params';
 import { get, set, isEmpty, clone } from '@shell/utils/object';
-import { POD, NODE, NAMESPACE } from '@shell/config/types';
+import { POD, NAMESPACE } from '@shell/config/types';
 import MatchExpressions from '@shell/components/form/MatchExpressions';
 import LabeledSelect from '@shell/components/form/LabeledSelect';
 import { RadioGroup } from '@components/Form/Radio';
@@ -11,7 +11,6 @@ import { randomStr } from '@shell/utils/string';
 import { sortBy } from '@shell/utils/sort';
 import debounce from 'lodash/debounce';
 import ArrayListGrouped from '@shell/components/form/ArrayListGrouped';
-import { getUniqueLabelKeys } from '@shell/utils/array';
 
 const NAMESPACE_SELECTION_OPTION_VALUES = {
   POD:      'pod',
@@ -47,11 +46,6 @@ export default {
       default: 'create'
     },
 
-    nodes: {
-      type:    Array,
-      default: () => []
-    },
-
     namespaces: {
       type:    Array,
       default: null
@@ -110,10 +104,6 @@ export default {
       return POD;
     },
 
-    node() {
-      return NODE;
-    },
-
     labeledInputNamespaceLabel() {
       return this.removeLabeledInputNamespaceLabel ? '' : this.overwriteLabels?.namespaceInputLabel || this.t('workload.scheduling.affinity.matchExpressions.inNamespaces');
     },
@@ -132,14 +122,6 @@ export default {
       return out;
     },
 
-    existingNodeLabels() {
-      return getUniqueLabelKeys(this.nodes);
-    },
-
-    hasNodes() {
-      return this.nodes.length;
-    },
-
     namespaceSelectionOptions() {
       if (this.allNamespacesOptionAvailable) {
         return [
@@ -440,24 +422,7 @@ export default {
           />
           <div class="row mt-20">
             <div class="col span-9">
-              <LabeledSelect
-                v-if="hasNodes"
-                v-model:value="props.row.value.topologyKey"
-                :taggable="true"
-                :searchable="true"
-                :close-on-select="false"
-                :mode="mode"
-                required
-                :label="t('workload.scheduling.affinity.topologyKey.label')"
-                :placeholder="topologyKeyPlaceholder"
-                :options="existingNodeLabels"
-                :disabled="mode==='view'"
-                :loading="loading"
-                :data-testid="`pod-affinity-topology-select-index${props.i}`"
-                @update:value="update"
-              />
               <LabeledInput
-                v-else
                 v-model:value="props.row.value.topologyKey"
                 :mode="mode"
                 :label="t('workload.scheduling.affinity.topologyKey.label')"

package/components/form/ResourceLabeledSelect.vue

@@ -137,13 +137,17 @@ export default defineComponent({
       const filters = !!filter ? [PaginationParamFilter.createSingleField({
         field: 'metadata.name', value: filter, exact: false
       })] : [];
+      const schema = this.$store.getters[`${ this.validInStore }/schema`](this.resourceType);
+      const namespaced = typeof schema?.attributes?.namespaced !== 'undefined' ? schema.attributes.namespaced : false;
+
       const defaultOptions: LabelSelectPaginationFunctionOptions = {
         opts,
         filters,
-        type:  this.resourceType,
-        ctx:   { getters: this.$store.getters, dispatch: this.$store.dispatch },
-        sort:  [{ asc: true, field: 'metadata.name' }],
-        store: this.validInStore
+        type:             this.resourceType,
+        ctx:              { getters: this.$store.getters, dispatch: this.$store.dispatch },
+        sort:             [{ asc: true, field: 'metadata.name' }],
+        store:            this.validInStore,
+        groupByNamespace: namespaced,
       };
       const options = this.paginatedResourceSettings?.requestSettings ? this.paginatedResourceSettings.requestSettings(defaultOptions) : defaultOptions;
       const res = await labelSelectPaginationFunction(options);

package/components/form/ResourceQuota/Namespace.vue

@@ -35,11 +35,11 @@ export default {
   computed: {
     ...QUOTA_COMPUTED,
     projectResourceQuotaLimits() {
-      return this.project?.spec?.resourceQuota?.limit || {};
+      return this.flatListFromLimits(this.project?.spec?.resourceQuota?.limit || {});
     },
     namespaceResourceQuotaLimits() {
       return this.project.namespaces.map((namespace) => ({
-        ...namespace.resourceQuota.limit,
+        ...this.flatListFromLimits(namespace.resourceQuota.limit),
         id: namespace.id
       }));
     },
@@ -47,7 +47,7 @@ export default {
       return Object.keys(this.projectResourceQuotaLimits);
     },
     defaultResourceQuotaLimits() {
-      return this.project.spec.namespaceDefaultResourceQuota.limit;
+      return this.flatListFromLimits(this.project.spec.namespaceDefaultResourceQuota.limit || {});
     }
   },
 
@@ -57,14 +57,35 @@ export default {
         .filter((type) => !this.types.includes(type.value) || type.value === currentType);
     },
     update(key, value) {
-      const resourceQuota = {
-        limit: {
-          ...this.value.resourceQuota.limit,
-          [key]: value
+      this.value['resourceQuota'] = { limit: this.limitsFromFlatList(key, value) };
+    },
+    flatListFromLimits(limit) {
+      const result = {};
+
+      Object.keys(limit || {}).forEach((key) => {
+        if (key === 'extended') {
+          Object.keys(limit.extended || {}).forEach((extKey) => {
+            result[`extended.${ extKey }`] = limit.extended[extKey];
+          });
+        } else {
+          result[key] = limit[key];
         }
-      };
+      });
+
+      return result;
+    },
+    limitsFromFlatList(key, value) {
+      const limit = { ...this.value.resourceQuota.limit };
+
+      if (key.startsWith('extended.')) {
+        const resourceIdentifier = key.slice('extended.'.length);
+
+        limit.extended = { ...(limit.extended || {}), [resourceIdentifier]: value };
+      } else {
+        limit[key] = value;
+      }
 
-      this.value['resourceQuota'] = resourceQuota;
+      return limit;
     }
   },
 };

package/components/form/ResourceQuota/NamespaceRow.vue

@@ -61,17 +61,35 @@ export default {
     // We want to update the value first so that the value will be rounded to the project limit.
     // This is relevant when switching projects. If the value is 1200 and the project that it was
     // switched to only has capacity for 800 more this will force the value to be set to 800.
-    if (this.value?.limit?.[this.type]) {
-      this.update(this.value.limit[this.type]);
+    if (this.currentLimit) {
+      this.update(this.currentLimit);
     }
 
-    if (!this.value?.limit?.[this.type]) {
+    if (!this.currentLimit) {
       this.update(this.defaultResourceQuotaLimits[this.type]);
     }
   },
 
   computed: {
     ...ROW_COMPUTED,
+    currentLimit() {
+      const limit = this.value.limit || {};
+
+      if (this.type.startsWith('extended.')) {
+        const resourceIdentifier = this.type.slice('extended.'.length);
+
+        return (limit.extended || {})[resourceIdentifier];
+      }
+
+      return limit[this.type];
+    },
+    displayType() {
+      if (this.type.startsWith('extended.')) {
+        return this.type.slice('extended.'.length);
+      }
+
+      return this.type;
+    },
     limitValue() {
       return parseSi(this.projectResourceQuotaLimits[this.type]);
     },
@@ -92,7 +110,7 @@ export default {
       return this.namespaceLimits.reduce((sum, limit) => sum + limit, 0);
     },
     totalContribution() {
-      return this.namespaceContribution + parseSi(this.value.limit[this.type] || '0', this.siOptions);
+      return this.namespaceContribution + parseSi(this.currentLimit || '0', this.siOptions);
     },
     percentageUsed() {
       return Math.min(this.totalContribution * 100 / this.projectLimit, 100);
@@ -127,7 +145,7 @@ export default {
         },
         {
           label: t('resourceQuota.tooltip.namespace'),
-          value: this.value.limit[this.type]
+          value: this.currentLimit
         },
         {
           label: t('resourceQuota.tooltip.available'),
@@ -178,7 +196,7 @@ export default {
     <Select
       class="mr-10"
       :mode="mode"
-      :value="type"
+      :value="displayType"
       :disabled="true"
       :options="types"
     />
@@ -192,7 +210,7 @@ export default {
       />
     </div>
     <UnitInput
-      :value="value.limit[type]"
+      :value="currentLimit"
       :mode="mode"
       :placeholder="typeOption.placeholder"
       :increment="typeOption.increment"