dashboard-shell-shell 3.0.2-rc.105 → 3.0.5-test.1

package/detail/provisioning.cattle.io.cluster.vue

@@ -9,7 +9,7 @@ import Tab from '@shell/components/Tabbed/Tab';
 import { allHash } from '@shell/utils/promise';
 import { CAPI, MANAGEMENT, NORMAN, SNAPSHOT } from '@shell/config/types';
 import {
-  STATE, NAME as NAME_COL, AGE, AGE_NORMAN, INTERNAL_EXTERNAL_IP, STATE_NORMAN, ROLES, MACHINE_NODE_OS, MANAGEMENT_NODE_OS, NAME,
+  STATE, NAME as NAME_COL, AGE, INTERNAL_EXTERNAL_IP, STATE_NORMAN, ROLES, MACHINE_NODE_OS, MANAGEMENT_NODE_OS, NAME,
 } from '@shell/config/table-headers';
 import { STATES_ENUM } from '@shell/plugins/dashboard-store/resource-class';
 import CustomCommand from '@shell/edit/provisioning.cattle.io.cluster/CustomCommand';
@@ -137,8 +137,6 @@ export default {
     }
 
     if ( this.value.isRke1 && this.$store.getters['isRancher'] ) {
-      fetchOne.etcdBackups = this.$store.dispatch('rancher/findAll', { type: NORMAN.ETCD_BACKUP });
-
       fetchOne.normanNodePools = this.$store.dispatch('rancher/findAll', { type: NORMAN.NODE_POOL });
     }
 
@@ -149,7 +147,6 @@ export default {
     this.haveMachines = !!fetchOneRes.machines;
     this.haveDeployments = !!fetchOneRes.machineDeployments;
     this.clusterToken = fetchOneRes.clusterToken;
-    this.etcdBackups = fetchOneRes.etcdBackups;
 
     if (fetchOneRes.normanClusters) {
       // Does the user have access to the local cluster? Need to in order to be able to show the 'Related Resources' tab
@@ -267,7 +264,6 @@ export default {
       machineSchema:  this.$store.getters[`management/schemaFor`](CAPI.MACHINE),
 
       clusterToken: null,
-      etcdBackups:  null,
 
       logOpen:   false,
       logSocket: null,
@@ -448,7 +444,7 @@ export default {
 
     showSnapshots() {
       if (this.value.isRke1) {
-        return this.$store.getters['rancher/canList'](NORMAN.ETCD_BACKUP) && this.extDetailTabs.snapshots;
+        return false;
       } else if (this.value.isRke2) {
         return this.$store.getters['management/canList'](SNAPSHOT) && this.extDetailTabs.snapshots;
       }
@@ -456,6 +452,10 @@ export default {
       return false;
     },
 
+    isRke1() {
+      return this.value.isRke1;
+    },
+
     showEksNodeGroupWarning() {
       if ( this.value.provisioner === 'EKS' && this.value.state !== STATES_ENUM.ACTIVE) {
         const desiredTotal = this.value.eksNodeGroups.filter((g) => g.desiredSize === 0);
@@ -495,8 +495,14 @@ export default {
     },
 
     mgmtNodeSchemaHeaders() {
+      // Remove Cluster name being a link
+      const RKE1_NAME_COL = {
+        ...NAME_COL,
+        formatter: undefined
+      };
+
       const headers = [
-        STATE, NAME_COL,
+        STATE, RKE1_NAME_COL,
         {
           name:          'node-name',
           labelKey:      'tableHeaders.machineNodeName',
@@ -519,50 +525,10 @@ export default {
       return headers;
     },
 
-    rke1Snapshots() {
-      const mgmtId = this.value.mgmt?.id;
-
-      if ( !mgmtId ) {
-        return [];
-      }
-
-      return (this.etcdBackups || []).filter((x) => x.clusterId === mgmtId);
-    },
-
     rke2Snapshots() {
       return this.value.etcdSnapshots;
     },
 
-    rke1SnapshotHeaders() {
-      return [
-        STATE_NORMAN,
-        {
-          name:          'name',
-          labelKey:      'tableHeaders.name',
-          value:         'nameDisplay',
-          sort:          ['nameSort'],
-          canBeVariable: true,
-        },
-        {
-          name:     'version',
-          labelKey: 'tableHeaders.version',
-          value:    'status.kubernetesVersion',
-          sort:     'status.kubernetesVersion',
-          width:    150,
-        },
-        { ...AGE_NORMAN, canBeVariable: true },
-        {
-          name:      'manual',
-          labelKey:  'tableHeaders.manual',
-          value:     'manual',
-          formatter: 'Checked',
-          sort:      ['manual'],
-          align:     'center',
-          width:     50,
-        },
-      ];
-    },
-
     rke2SnapshotHeaders() {
       return [
         {
@@ -967,7 +933,7 @@ export default {
                 </div>
               </div>
               <div
-                v-if="group.ref"
+                v-if="group.ref && !isRke1"
                 class="right group-header-buttons"
               >
                 <MachineSummaryGraph
@@ -1103,10 +1069,10 @@ export default {
         <SortableTable
           class="snapshots"
           :data-testid="'cluster-snapshots-list'"
-          :headers="value.isRke1 ? rke1SnapshotHeaders : rke2SnapshotHeaders"
+          :headers="rke2SnapshotHeaders"
           default-sort-by="age"
           :table-actions="value.isRke1"
-          :rows="value.isRke1 ? rke1Snapshots : rke2Snapshots"
+          :rows="rke2Snapshots"
           :search="false"
           :groupable="true"
           :group-by="snapshotsGroupBy"

package/detail/service.vue

@@ -37,7 +37,15 @@ export default {
   },
 
   async fetch() {
-    await this.value.fetchPods();
+    if (this.podSchema) {
+      await this.value.fetchPods();
+    }
+  },
+
+  async unmounted() {
+    if (this.podSchema) {
+      await this.value.unWatchPods();
+    }
   },
 
   data() {
@@ -83,7 +91,6 @@ export default {
 
     return {
       servicePortInfoHeaders,
-      pods:            [],
       podTableHeaders: this.$store.getters['type-map/headersFor'](
         this.$store.getters['cluster/schemaFor'](POD)
       ),
@@ -150,6 +157,7 @@ export default {
     @input="$emit('input', $event)"
   >
     <Tab
+      v-if="podSchema"
       name="pods"
       :label="t('servicesPage.pods.label')"
       :weight="4"

package/detail/workload/index.vue

@@ -47,16 +47,20 @@ export default {
     } catch {}
 
     const hash = {
-      // Used in conjunction with `matches/match/label selectors`. Requires https://github.com/rancher/dashboard/issues/10417 to fix
-      allPods:      this.$store.dispatch('cluster/findAll', { type: POD }),
-      // Used in conjunction with `matches/match/label selectors`. Requires https://github.com/rancher/dashboard/issues/10417 to fix
-      allServices:  this.$store.dispatch('cluster/findAll', { type: SERVICE }),
       allIngresses: this.$store.dispatch('cluster/findAll', { type: INGRESS }),
       // Nodes should be fetched because they may be referenced in the target
       // column of a service list item.
       allNodes:     hasNodes ? this.$store.dispatch('cluster/findAll', { type: NODE }) : []
     };
 
+    if (this.podSchema) {
+      hash.pods = this.value.fetchPods();
+    }
+
+    if (this.serviceSchema) {
+      hash.servicesInNamespace = this.$store.dispatch('cluster/findAll', { type: SERVICE, opt: { namespaced: this.value.metadata.namespace } });
+    }
+
     if (this.value.type === WORKLOAD_TYPES.CRON_JOB) {
       hash.jobs = this.value.matchingJobs();
     }
@@ -85,10 +89,15 @@ export default {
     this.findMatchingIngresses();
   },
 
+  async unmounted() {
+    if (this.podSchema) {
+      await this.value.unWatchPods();
+    }
+  },
+
   data() {
     return {
-      allPods:                         [],
-      allServices:                     [],
+      servicesInNamespace:             [],
       allIngresses:                    [],
       matchingServices:                [],
       matchingIngresses:               [],
@@ -155,13 +164,15 @@ export default {
     },
 
     jobHeaders() {
-      return this.$store.getters['type-map/headersFor'](this.jobSchema);
+      return this.$store.getters['type-map/headersFor'](this.jobSchema).filter((h) => !h.name || h.name !== NAMESPACE_COL.name);
     },
+
     ingressHeaders() {
-      return this.$store.getters['type-map/headersFor'](this.ingressSchema);
+      return this.$store.getters['type-map/headersFor'](this.ingressSchema).filter((h) => !h.name || h.name !== NAMESPACE_COL.name);
     },
+
     serviceHeaders() {
-      return this.$store.getters['type-map/headersFor'](this.serviceSchema);
+      return this.$store.getters['type-map/headersFor'](this.serviceSchema).filter((h) => !h.name || h.name !== NAMESPACE_COL.name);
     },
 
     totalRuns() {
@@ -180,22 +191,6 @@ export default {
       }, 0);
     },
 
-    podRestarts() {
-      return this.value.pods.reduce((total, pod) => {
-        const { status:{ containerStatuses = [] } } = pod;
-
-        if (containerStatuses.length) {
-          total += containerStatuses.reduce((tot, container) => {
-            tot += container.restartCount;
-
-            return tot;
-          }, 0);
-        }
-
-        return total;
-      }, 0);
-    },
-
     podHeaders() {
       return this.$store.getters['type-map/headersFor'](this.podSchema).filter((h) => !h.name || h.name !== NAMESPACE_COL.name);
     },
@@ -213,12 +208,16 @@ export default {
     },
 
     showPodGaugeCircles() {
-      const podGauges = Object.values(this.value.podGauges);
+      const podGauges = Object.values(this.podGauges);
       const total = this.value.pods.length;
 
       return !podGauges.find((pg) => pg.count === total);
     },
 
+    podGauges() {
+      return this.value.calcPodGauges(this.value.pods);
+    },
+
     showJobGaugeCircles() {
       const jobGauges = Object.values(this.value.jobGauges);
       const total = this.isCronJob ? this.totalRuns : this.value.pods.length;
@@ -230,6 +229,7 @@ export default {
       return !!SCALABLE_TYPES.includes(this.value.type) && this.value.canUpdate;
     },
   },
+
   methods: {
     async scale(isUp) {
       try {
@@ -256,15 +256,13 @@ export default {
       if (!this.serviceSchema) {
         return [];
       }
-      const matchingPods = this.value.pods;
 
-      // Find Services that have selectors that match this
-      // workload's Pod(s).
-      const matchingServices = this.allServices.filter((service) => {
+      // Find Services that have selectors that match this workload's Pod(s).
+      this.matchingServices = this.servicesInNamespace.filter((service) => {
         const selector = service.spec.selector;
 
-        for (let i = 0; i < matchingPods.length; i++) {
-          const pod = matchingPods[i];
+        for (let i = 0; i < this.value.pods.length; i++) {
+          const pod = this.value.pods[i];
 
           if (service.metadata?.namespace === this.value.metadata?.namespace && matches(pod, selector)) {
             return true;
@@ -273,8 +271,6 @@ export default {
 
         return false;
       });
-
-      this.matchingServices = matchingServices;
     },
     findMatchingIngresses() {
       if (!this.ingressSchema) {
@@ -317,6 +313,16 @@ export default {
 
       this.matchingIngresses = matchingIngresses;
     }
+  },
+
+  watch: {
+    async 'value.jobRelationships.length'(neu, old) {
+      // If there are MORE jobs ensure we go out and fetch them (changes and removals are tracked by watches)
+      if (neu > old) {
+        // We don't need to worry about spam, this won't be called often and it will be infrequent
+        await this.value.matchingJobs();
+      }
+    }
   }
 };
 </script>
@@ -358,7 +364,7 @@ export default {
       </template>
       <template v-else>
         <CountGauge
-          v-for="(group, key) in value.podGauges"
+          v-for="(group, key) in podGauges"
           :key="key"
           :total="value.pods.length"
           :useful="group.count || 0"
@@ -382,22 +388,23 @@ export default {
           :headers="jobHeaders"
           key-field="id"
           :schema="jobSchema"
+          :namespaced="false"
           :groupable="false"
           :search="false"
         />
       </Tab>
       <Tab
-        v-else
+        v-else-if="value.podMatchExpression"
         name="pods"
         :label="t('tableHeaders.pods')"
         :weight="4"
       >
         <ResourceTable
-          v-if="value.pods"
           :rows="value.pods"
           :headers="podHeaders"
           key-field="id"
           :schema="podSchema"
+          :namespaced="false"
           :groupable="false"
           :search="false"
         />
@@ -414,7 +421,7 @@ export default {
             :detail-url="WORKLOAD_METRICS_DETAIL_URL"
             :summary-url="WORKLOAD_METRICS_SUMMARY_URL"
             :vars="graphVars"
-            graph-height="550px"
+            graph-height="600px"
           />
         </template>
       </Tab>
@@ -430,7 +437,7 @@ export default {
             :detail-url="WORKLOAD_PROJECT_METRICS_DETAIL_URL"
             :summary-url="WORKLOAD_PROJECT_METRICS_SUMMARY_URL"
             :vars="graphVars"
-            graph-height="550px"
+            graph-height="600px"
           />
         </template>
       </Tab>
@@ -464,6 +471,7 @@ export default {
           :headers="serviceHeaders"
           key-field="id"
           :schema="serviceSchema"
+          :namespaced="false"
           :groupable="false"
           :search="false"
           :table-actions="false"
@@ -505,6 +513,7 @@ export default {
           :headers="ingressHeaders"
           key-field="id"
           :schema="ingressSchema"
+          :namespaced="false"
           :groupable="false"
           :search="false"
           :table-actions="false"

package/dialog/AddCustomBadgeDialog.vue

@@ -213,7 +213,6 @@ export default {
   <Card
     class="prompt-badge"
     :show-highlight-border="false"
-    :trigger-focus-trap="true"
   >
     <template #title>
       <h4 class="text-default-text">

package/{pages/c/_cluster/uiplugins/AddExtensionRepos.vue → dialog/AddExtensionReposDialog.vue}

@@ -1,22 +1,32 @@
 <script>
-import { CATALOG } from '@shell/config/types';
-import Dialog from '@shell/components/Dialog.vue';
+import AsyncButton from '@shell/components/AsyncButton';
 import Checkbox from '@components/Form/Checkbox/Checkbox.vue';
+import { CATALOG } from '@shell/config/types';
 import { UI_PLUGINS_REPOS } from '@shell/config/uiplugins';
 import { isRancherPrime } from '@shell/config/version';
 
 export default {
-  emits: ['done'],
+  emits: ['close'],
+
+  components: { AsyncButton, Checkbox },
 
-  components: {
-    Checkbox,
-    Dialog,
+  props: {
+    /**
+     * Callback to update install status on extensions main screen
+     */
+    done: {
+      type:    Function,
+      default: () => {}
+    },
   },
 
   async fetch() {
     if (this.$store.getters['management/schemaFor'](CATALOG.CLUSTER_REPO)) {
       this.repos = await this.$store.dispatch('management/findAll', { type: CATALOG.CLUSTER_REPO, opt: { force: true } });
     }
+
+    this.addRepos.official = isRancherPrime() && !this.hasRancherUIPluginsRepo;
+    this.addRepos.partners = !this.hasRancherUIPartnersPluginsRepo;
   },
 
   data() {
@@ -25,8 +35,8 @@ export default {
       repos:    [],
       prime:    isRancherPrime(),
       addRepos: {
-        official: true,
-        partners: true
+        official: false,
+        partners: false
       },
       reposInfo: {
         official: {
@@ -57,14 +67,6 @@ export default {
   },
 
   methods: {
-    showDialog() {
-      this.addRepos = {
-        official: isRancherPrime() && !this.hasRancherUIPluginsRepo,
-        partners: !this.hasRancherUIPartnersPluginsRepo,
-      };
-      this.isDialogActive = true;
-    },
-
     async doAddRepos(btnCb) {
       this.errors = [];
       const promises = [];
@@ -96,24 +98,20 @@ export default {
         });
       }
 
-      this.$emit('done');
+      this.done();
+      this.$emit('close');
 
       btnCb(true);
     },
   }
 };
 </script>
+
 <template>
-  <Dialog
-    v-if="isDialogActive"
-    name="add-extensions-repos"
-    :title="t('plugins.addRepos.title')"
-    mode="add"
-    data-testid="add-extensions-repos-modal"
-    :return-focus-selector="returnFocusSelector"
-    @okay="doAddRepos"
-    @closed="isDialogActive = false"
-  >
+  <div class="modal-dialog">
+    <h4>
+      {{ t('plugins.addRepos.title') }}
+    </h4>
     <p class="mb-20">
       {{ t('plugins.addRepos.prompt', {}, true) }}
     </p>
@@ -124,7 +122,7 @@ export default {
     >
       <Checkbox
         v-model:value="addRepos.official"
-        :disabled="hasRancherUIPluginsRepo"
+        :disabled="$fetchState.pending || hasRancherUIPluginsRepo"
         :primary="true"
         label-key="plugins.setup.install.addRancherRepo"
         data-testid="add-extensions-repos-modal-add-official-repo"
@@ -142,7 +140,7 @@ export default {
     >
       <Checkbox
         v-model:value="addRepos.partners"
-        :disabled="hasRancherUIPartnersPluginsRepo"
+        :disabled="$fetchState.pending || hasRancherUIPartnersPluginsRepo"
         :primary="true"
         label-key="plugins.setup.install.addPartnersRancherRepo"
         data-testid="add-extensions-repos-modal-add-partners-repo"
@@ -154,22 +152,54 @@ export default {
         ({{ t('plugins.setup.installed') }})
       </div>
     </div>
-  </Dialog>
+    <div class="dialog-buttons mt-20">
+      <button
+        class="btn role-secondary"
+        @click="$emit('close')"
+      >
+        {{ t('generic.cancel') }}
+      </button>
+      <AsyncButton
+        mode="add"
+        class="ml-10"
+        @click="doAddRepos"
+      />
+    </div>
+  </div>
 </template>
+
 <style lang="scss" scoped>
-  .enable-plugin-support {
-    font-size: 14px;
-    margin-top: 20px;
-  }
+  .modal-dialog {
+    padding: 10px;
 
-  .plugin-setup-error {
-    font-size: 14px;
-    color: var(--error);
-    margin: 10px 0 0 0;
-  }
+    h4 {
+      font-weight: bold;
+    }
+
+    .enable-plugin-support {
+      font-size: 14px;
+      margin-top: 20px;
+    }
+
+    .plugin-setup-error {
+      font-size: 14px;
+      color: var(--error);
+      margin: 10px 0 0 0;
+    }
+
+    .checkbox-info {
+      margin-left: 20px;
+      opacity: 0.7;
+    }
 
-  .checkbox-info {
-    margin-left: 20px;
-    opacity: 0.7;
+    .dialog-buttons {
+      display: flex;
+      justify-content: flex-end;
+      margin-top: 10px;
+
+      > *:not(:last-child) {
+        margin-right: 10px;
+      }
+    }
   }
 </style>

package/dialog/AddonConfigConfirmationDialog.vue

@@ -27,7 +27,7 @@ export default {
       if (this.resources[0]) {
         this.resources[0](value);
         delete this.resources[0];
-        this.$emit('close', value);
+        this.$emit('close');
       }
     },