@rancher/shell 3.0.12-rc.3 → 3.0.12-rc.5

package/components/MgmtNodeList.vue

@@ -0,0 +1,184 @@
+<script>
+import { MANAGEMENT } from '@shell/config/types';
+import ResourceTable from '@shell/components/ResourceTable';
+import {
+  INTERNAL_EXTERNAL_IP,
+  STATE, NAME as NAME_COL, AGE, MANAGEMENT_NODE_OS
+} from '@shell/config/table-headers';
+
+// exclude roles column - it is not necessarily used (or used the same way) outside of Rancher provisioning
+export const DEFAULT_HEADERS = [STATE, {
+  ...NAME_COL,
+  value:         'status.nodeName',
+  formatterOpts: { reference: 'kubeNodeDetailLocation' }
+}, INTERNAL_EXTERNAL_IP, MANAGEMENT_NODE_OS, AGE];
+
+export default {
+  name: 'ClusterScopedManagementNodeList',
+
+  components: { ResourceTable },
+
+  props: {
+    resource: {
+      type:    Object,
+      default: () => {
+        return {};
+      }
+    },
+
+    // override default management node schema headers
+    headers: {
+      type:    Array,
+      default: () => DEFAULT_HEADERS
+    },
+
+    // function to get node group for a given node, used for grouping nodes by pool in the table
+    // result  should be an object with name and (optionally) description properties
+    getNodeGroup: {
+      type:    Function,
+      default: null
+    }
+
+  },
+
+  /**
+   * avoid fetching ALL nodes to find this cluster's nodes
+   * mgmt nodes do not have labels that can be used with a labelSelector action
+   * neither the prov cluster nor mgmt cluster list mgmt nodes in their metadata.relationships nor are the node names listed in either cluster's status
+   * BUT mgmt nodes are scoped to a cluster's namespace, so we can fetch only mgmt nodes in the cluster's namespace
+   */
+  async fetch() {
+    const canList = this.$store.getters['management/canList'](MANAGEMENT.NODE);
+
+    if ( canList ) {
+      const hasAllMgmtNodes = this.$store.getters['management/haveAll'](MANAGEMENT.NODE);
+
+      if (hasAllMgmtNodes) {
+        this.mgmtNodes = this.$store.getters['management/all'](MANAGEMENT.NODE);
+      } else {
+        const res = await this.$store.dispatch('management/findLabelSelector', {
+          type:     MANAGEMENT.NODE,
+          matching: {
+            namespace:     this.resource.mgmtClusterId,
+            labelSelector: {
+              matchExpressions: [
+                {
+                  key:      'management.cattle.io/nodename',
+                  operator: 'Exists',
+                }
+              ]
+            }
+          }
+        } );
+
+        this.mgmtNodes = res;
+      }
+    }
+  },
+
+  data() {
+    return {
+      mgmtNodes: [],
+
+      mgmtNodeSchema: this.$store.getters[`management/schemaFor`](MANAGEMENT.NODE),
+
+      noneGroupOption: {
+        tooltipKey: 'resourceTable.groupBy.none',
+        icon:       'icon-list-flat',
+        value:      'none',
+      },
+
+      poolGroupOption: {
+        tooltipKey: 'resourceTable.groupBy.pool',
+        icon:       'icon-cluster',
+        value:      'poolRef',
+        field:      'poolRef.name'
+      }
+
+    };
+  },
+
+  computed: {
+    nodes() {
+      return this.mgmtNodes.filter((x) => x.mgmtClusterId === this.resource.mgmtClusterId).map((node) => {
+        const poolRef = typeof this.getNodeGroup === 'function' ? this.getNodeGroup(node) : null;
+
+        node.poolRef = poolRef;
+
+        return node;
+      });
+    },
+  },
+};
+</script>
+
+<template>
+  <ResourceTable
+    v-bind="$attrs"
+    :schema="mgmtNodeSchema"
+    :headers="headers"
+    :rows="nodes"
+    :ignore-filter="true"
+    group-ref="poolRef"
+    data-testid="mgmt-node-table"
+    :group-options="[noneGroupOption, poolGroupOption]"
+  >
+    <template #main-row:isFake="{fullColspan}">
+      <tr class="main-row">
+        <td
+          :colspan="fullColspan"
+          class="no-entries"
+        >
+          {{ t('node.list.noNodes') }}
+        </td>
+      </tr>
+    </template>
+
+    <template #group-by="{group}">
+      <div
+        class="pool-row"
+        :class="{'has-description':group.ref}"
+      >
+        <div
+          v-trim-whitespace
+          class="group-tab"
+        >
+          {{ group.ref?.name || t('resourceTable.groupLabel.notInANodePool') }}
+          <div
+            v-if="group.ref && group.ref.description"
+            v-clean-html="group.ref.description"
+            class="description text-muted text-small"
+          />
+        </div>
+      </div>
+    </template>
+  </ResourceTable>
+</template>
+
+<style scoped lang="scss">
+.pool-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+
+  &.has-description {
+    .group-tab {
+      &, &::after {
+          height: 50px;
+      }
+
+      &::after {
+          right: -20px;
+      }
+
+      .description {
+          margin-top: -20px;
+      }
+    }
+  }
+  .group-header-buttons {
+    align-items: center;
+    display: flex;
+  }
+}
+</style>

package/components/PromptRestore.vue

@@ -7,16 +7,15 @@ import Date from '@shell/components/formatter/Date.vue';
 import RadioGroup from '@components/Form/Radio/RadioGroup.vue';
 import LabeledSelect from '@shell/components/form/LabeledSelect.vue';
 import { exceptionToErrorsArray } from '@shell/utils/error';
-import { CAPI, SNAPSHOT } from '@shell/config/types';
+import { CAPI, SNAPSHOT, OPERATION, MANAGEMENT } from '@shell/config/types';
 import { set } from '@shell/utils/object';
 import ChildHook, { BEFORE_SAVE_HOOKS } from '@shell/mixins/child-hook';
 import { DATE_FORMAT, TIME_FORMAT } from '@shell/store/prefs';
 import { escapeHtml } from '@shell/utils/string';
 import day from 'dayjs';
 import { sortBy } from '@shell/utils/sort';
-import { STATES_ENUM } from '@shell/plugins/dashboard-store/resource-class';
 import AppModal from '@shell/components/AppModal.vue';
-
+import { createOperationCR } from '@shell/utils/operation-cr';
 export default {
   components: {
     Card,
@@ -66,8 +65,41 @@ export default {
       return !!this.snapshot;
     },
 
-    isRke2() {
-      return !!this.snapshot?.rke2;
+    targetCluster() {
+      if (this.isCluster) {
+        return this.toRestore?.[0] || null;
+      }
+
+      if (this.snapshot?.cluster) {
+        return this.snapshot.cluster;
+      }
+
+      const snapshotClusterName = this.snapshot?.spec?.clusterName || this.snapshot?.clusterName;
+      const snapshotClusterId = this.snapshot?.clusterId || (snapshotClusterName ? `${ this.snapshot?.metadata?.namespace }/${ snapshotClusterName }` : null);
+
+      if (!snapshotClusterId) {
+        return null;
+      }
+
+      return this.$store.getters['management/byId'](CAPI.RANCHER_CLUSTER, snapshotClusterId);
+    },
+
+    targetMgmtCluster() {
+      if (this.targetCluster?.mgmt) {
+        return this.targetCluster.mgmt;
+      }
+
+      const mgmtClusterId = this.snapshot?.spec?.clusterName;
+
+      if (!mgmtClusterId) {
+        return null;
+      }
+
+      return this.$store.getters['management/byId'](MANAGEMENT.CLUSTER, mgmtClusterId);
+    },
+
+    isImported() {
+      return !!(this.targetCluster?.isImported || this.targetMgmtCluster?.isImported);
     },
 
     clusterSnapshots() {
@@ -77,6 +109,13 @@ export default {
         return [];
       }
     },
+    restoreModeLabels() {
+      return [
+        this.t('promptRestore.restoreMode.onlyEtcd'),
+        this.t('promptRestore.restoreMode.kubernetesVersionAndEtcd'),
+        this.t('promptRestore.restoreMode.clusterConfigKubernetesVersionAndEtcd')
+      ];
+    },
     restoreModeOptions() {
       return ['none', 'kubernetesVersion', 'all'];
     }
@@ -112,7 +151,7 @@ export default {
       const promise = this.$store.dispatch('management/findAll', { type: SNAPSHOT }).then((snapshots) => {
         const toRestoreClusterName = cluster?.clusterName || cluster?.metadata?.name;
 
-        return snapshots.filter((s) => s?.snapshotFile?.status === STATES_ENUM.SUCCESSFUL && s.clusterName === toRestoreClusterName
+        return snapshots.filter((s) => s?.restoreEnabled && s.clusterName === toRestoreClusterName
         );
       });
 
@@ -143,19 +182,41 @@ export default {
 
     async apply(buttonDone) {
       try {
-        const cluster = this.$store.getters['management/byId'](CAPI.RANCHER_CLUSTER, this.snapshot.clusterId);
+        const cluster = this.targetCluster;
+        const mgmtCluster = cluster?.mgmt || this.targetMgmtCluster;
 
-        await this.applyHooks(BEFORE_SAVE_HOOKS);
-
-        const now = cluster.spec?.rkeConfig?.etcdSnapshotRestore?.generation || 0;
+        const isImportedWithDayTwoOps = cluster?.isImportedWithDayTwoOps || mgmtCluster?.isDayTwoOpsEnabled;
 
-        set(cluster, 'spec.rkeConfig.etcdSnapshotRestore', {
-          generation:       now + 1,
-          name:             this.snapshot.name,
-          restoreRKEConfig: this.restoreMode,
-        });
+        await this.applyHooks(BEFORE_SAVE_HOOKS);
 
-        await cluster.save();
+        // For imported clusters with day 2 ops enabled, create an operation CR
+        if (isImportedWithDayTwoOps) {
+          if (!mgmtCluster) {
+            throw new Error(this.t('promptRestore.error.unableToResolveTargetCluster'));
+          }
+          const namespace = mgmtCluster?.id;
+          const safePrefix = mgmtCluster?.id;
+          const spec = {
+            clusterRef: {
+              apiVersion: 'management.cattle.io/v3',
+              kind:       'Cluster',
+              name:       mgmtCluster?.id,
+            },
+            args: { name: this.snapshot?.snapshotFile?.name },
+          };
+
+          createOperationCR(this.$store.dispatch, OPERATION.ETCD_SNAPSHOT_RESTORE, spec, namespace, safePrefix);
+        } else {
+          const now = cluster.spec?.rkeConfig?.etcdSnapshotRestore?.generation || 0;
+
+          set(cluster, 'spec.rkeConfig.etcdSnapshotRestore', {
+            generation:       now + 1,
+            name:             this.snapshot.name,
+            restoreRKEConfig: this.restoreMode,
+          });
+
+          await cluster.save();
+        }
 
         this.$store.dispatch('growl/success', {
           title:   this.t('promptRestore.notification.title'),
@@ -233,18 +294,25 @@ export default {
                 />
               </p>
             </div>
-            <div class="spacer" />
-            <RadioGroup
-              v-model:value="restoreMode"
-              name="restoreMode"
-              label="Restore Type"
-              :labels="['Only etcd', 'Kubernetes version and etcd', 'Cluster config, Kubernetes version and etcd']"
-              :options="restoreModeOptions"
-            />
+            <div v-if="!isImported">
+              <div class="spacer" />
+              <RadioGroup
+                v-model:value="restoreMode"
+                name="restoreMode"
+                :label="t('promptRestore.restoreMode.label')"
+                :labels="restoreModeLabels"
+                :options="restoreModeOptions"
+              />
+            </div>
           </form>
         </div>
       </template>
-
+      <Banner
+        v-for="(err, i) in errors"
+        :key="i"
+        color="error"
+        :label="err"
+      />
       <template #actions>
         <div class="dialog-actions">
           <button
@@ -259,13 +327,6 @@ export default {
             :disabled="!hasSnapshot"
             @click="apply"
           />
-
-          <Banner
-            v-for="(err, i) in errors"
-            :key="i"
-            color="error"
-            :label="err"
-          />
         </div>
       </template>
     </Card>

package/components/Questions/index.vue

@@ -474,6 +474,7 @@ export default {
             :value="get(value, q.variable)"
             :disabled="disabled"
             :chart-name="chartName"
+            :mode="mode"
             @update:value="update(q.variable, $event)"
           />
         </div>

package/components/Resource/Detail/Card/StateCard/__tests__/composables.test.ts

@@ -1,4 +1,4 @@
-import { useResourceCardRow } from '@shell/components/Resource/Detail/Card/StateCard/composables';
+import { useResourceCardRow, useResourceCardRowFromRelationships } from '@shell/components/Resource/Detail/Card/StateCard/composables';
 
 describe('useResourceCardRow', () => {
   describe('with default keys', () => {
@@ -140,3 +140,92 @@ describe('useResourceCardRow', () => {
     });
   });
 });
+
+describe('useResourceCardRowFromRelationships', () => {
+  it('should return empty props for empty relationships', () => {
+    const result = useResourceCardRowFromRelationships('Refers to', []);
+
+    expect(result.label).toBe('Refers to');
+    expect(result.color).toBeUndefined();
+    expect(result.counts).toBeUndefined();
+  });
+
+  it('should aggregate relationship states', () => {
+    const rels = [
+      { toType: 'configmap', state: 'active' },
+      { toType: 'secret', state: 'active' },
+      { toType: 'serviceaccount', state: 'error' }
+    ];
+
+    const result = useResourceCardRowFromRelationships('Refers to', rels);
+
+    expect(result.counts).toHaveLength(2);
+    expect(result.counts).toContainEqual(expect.objectContaining({ label: 'active', count: 2 }));
+    expect(result.counts).toContainEqual(expect.objectContaining({ label: 'error', count: 1 }));
+  });
+
+  it('should default missing state to "missing"', () => {
+    const rels = [
+      { toType: 'configmap' },
+      { toType: 'secret', state: 'active' }
+    ];
+
+    const result = useResourceCardRowFromRelationships('Refers to', rels);
+
+    expect(result.counts).toContainEqual(expect.objectContaining({
+      label: 'missing', count: 1, color: 'warning'
+    }));
+    expect(result.counts).toContainEqual(expect.objectContaining({
+      label: 'active', count: 1, color: 'success'
+    }));
+  });
+
+  it('should set the highest alert color as main color', () => {
+    const rels = [
+      { toType: 'configmap', state: 'active' },
+      { toType: 'secret', state: 'error' }
+    ];
+
+    const result = useResourceCardRowFromRelationships('Refers to', rels);
+
+    expect(result.color).toBe('error');
+  });
+
+  it('should sort by alert level then by count', () => {
+    const rels = [
+      { toType: 'a', state: 'active' },
+      { toType: 'b', state: 'active' },
+      { toType: 'c', state: 'active' },
+      { toType: 'd', state: 'error' },
+      { toType: 'e', state: 'warning' },
+      { toType: 'f', state: 'warning' }
+    ];
+
+    const result = useResourceCardRowFromRelationships('Refers to', rels);
+
+    expect(result.counts![0].color).toBe('error');
+    expect(result.counts![1].color).toBe('warning');
+    expect(result.counts![2].color).toBe('success');
+  });
+
+  it('should pass the to parameter through', () => {
+    const to = { hash: '#related' };
+    const result = useResourceCardRowFromRelationships('Refers to', [], to);
+
+    expect(result.to).toStrictEqual(to);
+  });
+
+  it('should handle all relationships having no state', () => {
+    const rels = [
+      { toType: 'configmap' },
+      { toType: 'secret' }
+    ];
+
+    const result = useResourceCardRowFromRelationships('Refers to', rels);
+
+    expect(result.counts).toHaveLength(1);
+    expect(result.counts![0]).toStrictEqual(expect.objectContaining({
+      label: 'missing', count: 2, color: 'warning'
+    }));
+  });
+});

package/components/Resource/Detail/Card/StateCard/composables.ts

@@ -1,11 +1,26 @@
 import { Count, Props as ResourceRowProps } from '@shell/components/Resource/Detail/ResourceRow.types';
-import { useI18n } from '@shell/composables/useI18n';
-import { INGRESS, SERVICE } from '@shell/config/types';
 import { isHigherAlert, StateColor } from '@shell/utils/style';
-import { computed, Ref, toValue } from 'vue';
-import { useStore } from 'vuex';
-import { Props as StateCardProps } from '@shell/components/Resource/Detail/Card/StateCard/types';
 import { RouteLocationRaw } from 'vue-router';
+import { simpleColorForState, stateDisplay as stateDisplayFn } from '@shell/plugins/dashboard-store/resource-class';
+
+interface Tuple extends Count {
+  color: StateColor;
+}
+
+export interface SummaryCountValue {
+  total: number;
+  namespace?: Record<string, number>;
+}
+
+export interface SummaryEntry {
+  property: string;
+  counts: Record<string, SummaryCountValue>;
+}
+
+export interface SummaryResult {
+  count: number;
+  summary: SummaryEntry[] | null;
+}
 
 export function useResourceCardRow(label: string, resources: any[], stateColorKey = 'stateSimpleColor', stateDisplayKey = 'stateDisplay', to?: RouteLocationRaw): ResourceRowProps {
   const agg: any = {};
@@ -20,12 +35,9 @@ export function useResourceCardRow(label: string, resources: any[], stateColorKe
     agg[state].count++;
   });
 
-  interface Tuple extends Count {
-    color: StateColor;
-  }
   const tuples: Tuple[] = Object.values(agg);
 
-  tuples.sort((left: any, right: any) => {
+  tuples.sort((left: Tuple, right: Tuple) => {
     if (isHigherAlert(left.color, right.color)) {
       return -1;
     }
@@ -49,94 +61,52 @@ export function useResourceCardRow(label: string, resources: any[], stateColorKe
   };
 }
 
-export interface Pairs {
-    label: string;
-    to?: RouteLocationRaw;
-    resources: any[];
-}
-
-export function useDefaultResources(pairs: Ref<Pairs[]>) {
-  const pairsValue = toValue(pairs);
-  const rows = computed(() => pairsValue.map(({ label, resources, to }) => useResourceCardRow(label, resources, undefined, undefined, to)));
-
-  return rows;
-}
-
-export function useResourcePair(label: string, type: string, resources?: any[]) {
-  const store = useStore();
+/**
+ * Builds a ResourceRowProps from relationship state data.
+ * Each relationship entry includes a `state` field (e.g. "active", "error").
+ */
+export function useResourceCardRowFromRelationships(label: string, relationships: any[], to?: RouteLocationRaw): ResourceRowProps {
+  if (!relationships.length) {
+    return {
+      label, color: undefined, counts: undefined, to
+    };
+  }
 
-  return computed(() => {
-    if (!resources) {
-      return undefined;
-    }
+  const agg: Record<string, { color: StateColor; label: string; count: number }> = {};
 
-    const resourcesValue = toValue(resources);
+  relationships.forEach((r: any) => {
+    const state = (r.state || 'missing').toLowerCase();
+    const color = simpleColorForState(state) as StateColor;
+    const display = (stateDisplayFn(state) as string)?.toLowerCase() || state;
 
-    return {
-      label,
-      resources: resourcesValue,
-      to:        (resourcesValue?.length > 0) ? {
-        name:   'c-cluster-product-resource',
-        params: {
-          cluster:  store.getters.currentCluster.id,
-          product:  store.getters.currentProduct.name,
-          resource: type
-        }
-      } : undefined,
+    agg[state] = agg[state] || {
+      color, label: display, count: 0
     };
+    agg[state].count++;
   });
-}
 
-export function useDefaultWorkloadResources(services?: any[], ingresses?: any[], referredToBy?: any[], refersTo?: any[]): StateCardProps {
-  const store = useStore();
-  const i18n = useI18n(store);
-
-  const pairs: Ref<(Pairs | undefined)[]> = computed(() => [
-    useResourcePair(i18n.t('component.resource.detail.card.resourcesCard.rows.services'), SERVICE, services).value,
-    useResourcePair(i18n.t('component.resource.detail.card.resourcesCard.rows.ingresses'), INGRESS, ingresses).value,
-    referredToBy ? {
-      label:     i18n.t('component.resource.detail.card.resourcesCard.rows.referredToBy'),
-      resources: toValue(referredToBy || []),
-      to:        { hash: '#related' }
-    } : undefined,
-    refersTo ? {
-      label:     i18n.t('component.resource.detail.card.resourcesCard.rows.refersTo'),
-      resources: toValue(refersTo || []),
-      to:        { hash: '#related' }
-    } : undefined
-  ]);
-
-  const remainingPairs = computed(() => pairs.value.filter((p: (Pairs | undefined)): p is Pairs => p !== undefined));
-
-  const rows = useDefaultResources(remainingPairs);
+  const tuples: Tuple[] = Object.values(agg);
 
-  return {
-    title: 'Resources',
-    rows:  rows.value
-  };
-}
+  tuples.sort((left: Tuple, right: Tuple) => {
+    if (isHigherAlert(left.color, right.color)) {
+      return -1;
+    }
 
-export function useDefaultWorkloadInsightsCardProps(): StateCardProps {
-  const store = useStore();
-  const i18n = useI18n(store);
-
-  const rows: ResourceRowProps[] = [
-    {
-      label:  i18n.t('component.resource.detail.card.insightsCard.rows.conditions'),
-      to:     '#conditions',
-      color:  'disabled',
-      counts: [{ label: 'Available', count: 1 }, { label: 'Progressing', count: 1 }]
-    },
-    {
-      label:  i18n.t('component.resource.detail.card.insightsCard.rows.events'),
-      to:     '#events',
-      color:  'disabled',
-      counts: [{ label: 'Normal', count: 2 }]
+    if (left.color !== right.color) {
+      return 1;
     }
-  ];
+
+    if (left.count === right.count) {
+      return 0;
+    }
+
+    return left.count > right.count ? -1 : 1;
+  });
 
   return {
-    title: i18n.t('component.resource.detail.card.insightsCard.title'),
-    rows
+    label,
+    color:  tuples.length ? tuples[0].color : undefined,
+    counts: tuples.length ? tuples : undefined,
+    to
   };
 }