@rancher/shell 3.0.0-rc.8 → 3.0.0

package/assets/translations/en-us.yaml

@@ -230,7 +230,6 @@ product:
   settings: Global Settings
   clusterManagement: Cluster Management
   monitoring: Monitoring
-  mcapps: Global Configuration
   neuvector: NeuVector
   harvesterManager: Virtualization Management
   rancher: Rancher
@@ -1474,10 +1473,13 @@ cluster:
     placeholder: A unique name for the cluster
   directoryConfig:
     title: Data directory configuration
-    checkboxText: Use the same path for System-agent, Provisioning and K8s Distro data directories configuration
+    radioInput:
+      defaultLabel: Use default data directory configuration
+      commonLabel: Use a common base directory for data directory configuration (sub-directories will be used for the system-agent, provisioning and distro paths)
+      customLabel: Use custom data directories
     common: 
-      label: Data directory configuration path
-      tooltip: Data directory configuration for System-agent, Provisioning and K8s Distro
+      label: Data directory base path
+      tooltip: Data directory base path. We will append the sub-directories appropriate for each directory (/agent, /provisioning and either /rke2 or /k3s)
     systemAgent: 
       label: System-agent directory path
       tooltip: Data directory for the system-agent connection info and plans
@@ -1832,8 +1834,8 @@ cluster:
 
   architecture:
     label:
-      unknown: Unknown
-      mixed: Mixed
+      unknown: unknown
+      mixed: mixed
 
   availabilityWarnings:
     node: Node {name} is inactive
@@ -2995,8 +2997,8 @@ landing:
       other {cores}}
     cpuUsed: CPU Used
     memoryUsed: Memory Used
-  seeWhatsNew: Learn more about the improvements and new capabilities in this version.
-  whatsNewLink: "What's new in 2.9"
+  seeWhatsNew: Learn more about the improvements and new capabilities in this version and read about the UI framework migration in 2.10
+  whatsNewLink: "What's new in 2.10"
   learnMore: Learn More
   support: Support
   community:
@@ -5277,7 +5279,7 @@ setup:
     dockerSuffix: ""
     helmPrefix: 'For a Helm installation, run:'
     helmSuffix: ""
-  eula: By checking the box, you accept the <a href="https://rancher.com/eula" target="_blank" rel="noopener noreferrer nofollow">End User License Agreement & Terms & Conditions</a>
+  eula: By checking the box, you accept the <a href="https://www.suse.com/licensing/eula/download/suse_end_user_license_agreement_june_2024.pdf" target="_blank" rel="noopener noreferrer nofollow">End User License Agreement & Terms & Conditions</a>
   newPassword: New Password
   newUserSetPassword: The first order of business is to set a strong password. We suggest using this random one generated just for you, but enter your own if you like.
   serverUrl:
@@ -7413,6 +7415,7 @@ advancedSettings:
     'brand': Folder name for an alternative theme defined in '/assets/brand'
     'hide-local-cluster': Hide the local cluster
     'agent-tls-mode': "Rancher Certificate Verification. In `strict` mode the agents (system, cluster, fleet, etc) will only trust Rancher installations which are using a certificate signed by the CABundle in the `cacerts` setting. When the mode is system-store, the agents will trust any certificate signed by a CABundle in the operating system’s trust store."
+    'k3s-based-upgrader-uninstall-concurrency': Defines the maximum number of clusters in which Rancher can concurrently uninstall the legacy `rancher-k3s-upgrader` or `rancher-rke2-upgrader` app from imported K3s or RKE2 clusters.
   warnings:
     'agent-tls-mode': 'Changing this setting will cause all agents to be redeployed.'
   editHelp:
@@ -7737,8 +7740,6 @@ legacy:
   catalogs: Catalogs
   configMaps: Config Maps
   configuration: Configuration
-  globalDnsEntries: Global DNS Entries
-  globalDnsProviders: Global DNS Providers
   notifiers: Notifiers
   monitoring: Monitoring
   secrets: Secrets

package/assets/translations/zh-hans.yaml

@@ -222,7 +222,6 @@ product:
   settings: 全局设置
   clusterManagement: 集群管理
   monitoring: 监控
-  mcapps: 全局配置
   neuvector: NeuVector
   harvesterManager: 虚拟化管理
   rancher: Rancher
@@ -4960,7 +4959,7 @@ setup:
     dockerSuffix: ""
     helmPrefix: 'Helm 安装，运行：'
     helmSuffix: ""
-  eula: 选中此框，即表示你接受<a href="https://rancher.com/eula" target="_blank" rel="noopener noreferrer nofollow">最终用户许可协议及条款和条件</a>
+  eula: 选中此框，即表示你接受<a href="https://www.suse.com/licensing/eula/download/suse_end_user_license_agreement_june_2024.pdf" target="_blank" rel="noopener noreferrer nofollow">最终用户许可协议及条款和条件</a>
   newPassword: 新密码
   newUserSetPassword: 请设置强密码。建议使用生成的随机密码。你也可以自行设置。
   serverUrl:
@@ -7335,8 +7334,6 @@ legacy:
   catalogs: 应用商店
   configMaps: ConfigMaps
   configuration: 配置
-  globalDnsEntries: 全局 DNS 条目
-  globalDnsProviders: 全局 DNS 提供商
   notifiers: Notifiers
   monitoring: 监控
   secrets: 密文

package/components/EmberPage.vue

@@ -31,14 +31,6 @@ const INTERCEPTS = {
       resource: CAPI.RANCHER_CLUSTER,
     }
   },
-  'global-admin.catalog': {
-    name:   'c-cluster-mcapps-pages-page',
-    params: {
-      cluster: 'local',
-      product: 'mcapps',
-      page:    'catalogs'
-    }
-  },
   'authenticated.cluster.istio.cluster-setting': { name: 'c-cluster-explorer-tools' },
 };
 

package/components/ResourceTable.vue

@@ -204,7 +204,31 @@ export default {
     // Confirm which store we're in, if schema isn't available we're probably showing a list with different types
     const inStore = this.schema?.id ? this.$store.getters['currentStore'](this.schema.id) : undefined;
 
-    return { inStore };
+    return {
+      inStore,
+      /**
+       * Override the sortGenerationFn given changes in the rows we pass through to sortable table
+       *
+       * Primary purpose is to directly connect an iteration of `rows` with a sortGeneration string. This avoids
+       * reactivity issues where `rows` hasn't yet changed but something like workspaces has (stale values stored against fresh key)
+       */
+      sortGeneration: undefined
+    };
+  },
+
+  watch: {
+    filteredRows: {
+      handler() {
+        // This is only prevalent in fleet world and the workspace switcher
+        // - it's singular (a --> b --> c) instead of namespace switchers additive (a --> a+b --> a)
+        // - this means it's much more likely to switch between resource sets containing the same mount of rows
+        //
+        if (this.currentProduct.showWorkspaceSwitcher) {
+          this.sortGeneration = this.safeSortGenerationFn(this.schema, this.$store);
+        }
+      },
+      immediate: true
+    }
   },
 
   computed: {
@@ -556,6 +580,7 @@ export default {
     :adv-filter-hide-labels-as-cols="advFilterHideLabelsAsCols"
     :adv-filter-prevent-filtering-labels="advFilterPreventFilteringLabels"
     :key-field="keyField"
+    :sortGeneration="sortGeneration"
     :sort-generation-fn="safeSortGenerationFn"
     :use-query-params-for-simple-filtering="useQueryParamsForSimpleFiltering"
     :force-update-live-and-delayed="forceUpdateLiveAndDelayed"

package/components/SortableTable/actions.js

@@ -18,7 +18,7 @@ export default {
     };
   },
 
-  beforeDestroy() {
+  beforeUnmount() {
     window.removeEventListener('resize', this.onWindowResize);
   },
 

package/components/SortableTable/index.vue

@@ -37,7 +37,7 @@ import ButtonMultiAction from '@shell/components/ButtonMultiAction.vue';
 // --> filtering.js filteredRows
 // --> paging.js pageRows
 // --> grouping.js groupedRows
-// --> index.vue displayedRows
+// --> index.vue displayRows
 
 export default {
   name: 'SortableTable',
@@ -77,11 +77,13 @@ export default {
       type:     Array,
       required: true
     },
+
     rows: {
       // The array of objects to show
       type:     Array,
       required: true
     },
+
     keyField: {
       // Field that is unique for each row.
       type:    String,
@@ -285,11 +287,25 @@ export default {
       default: true
     },
 
+    /**
+     * Provide a unique key that will provide a new value given changes to the environment that
+     * should kick off an update to table rows (for instance resource list generation or change of namespace)
+     *
+     * This does not have to update given internal facets like sort order or direction
+     */
     sortGenerationFn: {
       type:    Function,
       default: null,
     },
 
+    /**
+     * Can be used in place of sortGenerationFn
+     */
+    sortGeneration: {
+      type:    String,
+      default: null
+    },
+
     /**
      * The list will always be sorted by these regardless of what the user has selected
      */

package/components/SortableTable/selection.js

@@ -20,7 +20,7 @@ export default {
     table.addEventListener('contextmenu', this._onRowContextBound);
   },
 
-  beforeDestroy() {
+  beforeUnmount() {
     const table = this.$el.querySelector('TABLE');
 
     table.removeEventListener('click', this._onRowClickBound);

package/components/SortableTable/sorting.js

@@ -39,9 +39,17 @@ export default {
 
       let key;
 
-      if ( this.sortGenerationFn ) {
-        key = `${ this.sortGenerationFn.apply(this) }/${ this.rows.length }/${ this.descending }/${ this.sortFields.join(',') }`;
-
+      // Why is sortGeneration needed when we have sortGenerationFn?
+      // 1. sortGenerationFn is called when this fn is kicked off and returns latest and greatest string (given things like namespace)
+      // 2. it can be kicked off with stale rows... which is then stored against latest string
+      // 3. when updates rows comes through... sortGenerationFn returns same string
+      // 4. we therefor think nothing has changed and return old, stale rows
+      // This is avoided by outside storage of sortGeneration against rows
+      // (it would be nice to have that hash on the rows object itself, but it gets messy)
+      const sortGenerationKey = this.sortGeneration || this.sortGenerationFn?.apply(this);
+
+      if ( sortGenerationKey) {
+        key = `${ sortGenerationKey }/${ this.rows.length }/${ this.descending }/${ this.sortFields.join(',') }`;
         if ( this.cacheKey === key ) {
           return this.cachedRows;
         }

package/components/fleet/FleetClusters.vue

@@ -42,7 +42,6 @@ export default {
           value:    'status.display.readyBundles',
           sort:     'status.summary.ready',
           search:   false,
-          align:    'center',
         },
         {
           name:     'reposReady',
@@ -50,7 +49,6 @@ export default {
           value:    'status.readyGitRepos',
           sort:     'status.summary.ready',
           search:   false,
-          align:    'center',
         },
         FLEET_SUMMARY,
         {
@@ -62,7 +60,6 @@ export default {
           formatter:     'LiveDate',
           formatterOpts: { addSuffix: true },
           width:         120,
-          align:         'right'
         },
         AGE,
       ];

package/components/form/ColorInput.vue

@@ -40,6 +40,11 @@ export default {
     componentTestid: {
       type:    String,
       default: 'color-input'
+    },
+
+    disabled: {
+      type:    Boolean,
+      default: false,
     }
   },
 
@@ -56,6 +61,12 @@ export default {
      */
     inputValue() {
       return this.value ? this.value : this.defaultValue;
+    },
+
+    isDisabled() {
+      const disabled = this.disabled;
+
+      return this.mode !== this.editMode || disabled;
     }
   },
 
@@ -69,7 +80,7 @@ export default {
 <template>
   <div
     class="color-input"
-    :class="{[mode]:mode, disabled: mode !== editMode}"
+    :class="{[mode]:mode, disabled: isDisabled}"
     :data-testid="componentTestid + '-color-input'"
   >
     <label class="text-label"><t
@@ -89,7 +100,7 @@ export default {
         <input
           ref="input"
           type="color"
-          :disabled="mode !== editMode"
+          :disabled="isDisabled"
           :value="inputValue"
           @input="$emit('update:value', $event.target.value)"
         >

package/components/form/HookOption.vue

@@ -150,35 +150,37 @@ export default {
     <template v-if="selectHook === 'httpGet'">
       <h4>{{ t('workload.container.lifecycleHook.httpGet.title') }}</h4>
       <div class="var-row">
-        <template @update:value="update">
-          <LabeledInput
-            v-model:value="value.httpGet.host"
-            :label="t('workload.container.lifecycleHook.httpGet.host.label')"
-            :placeholder="t('workload.container.lifecycleHook.httpGet.host.placeholder')"
-            :mode="mode"
-          />
-          <LabeledInput
-            v-model:value="value.httpGet.path"
-            :label="t('workload.container.lifecycleHook.httpGet.path.label')"
-            :placeholder="t('workload.container.lifecycleHook.httpGet.path.placeholder')"
-            :mode="mode"
-          />
-          <LabeledInput
-            v-model:value.number="value.httpGet.port"
-            type="number"
-            :label="t('workload.container.lifecycleHook.httpGet.port.label')"
-            :placeholder="t('workload.container.lifecycleHook.httpGet.port.placeholder')"
-            :mode="mode"
-            required
-          />
-          <LabeledSelect
-            v-model:value="value.httpGet.scheme"
-            :label="t('workload.container.lifecycleHook.httpGet.scheme.label')"
-            :placeholder="t('workload.container.lifecycleHook.httpGet.scheme.placeholder')"
-            :options="schemeOptions"
-            :mode="mode"
-          />
-        </template>
+        <LabeledInput
+          v-model:value="value.httpGet.host"
+          :label="t('workload.container.lifecycleHook.httpGet.host.label')"
+          :placeholder="t('workload.container.lifecycleHook.httpGet.host.placeholder')"
+          :mode="mode"
+          @update:value="update"
+        />
+        <LabeledInput
+          v-model:value="value.httpGet.path"
+          :label="t('workload.container.lifecycleHook.httpGet.path.label')"
+          :placeholder="t('workload.container.lifecycleHook.httpGet.path.placeholder')"
+          :mode="mode"
+          @update:value="update"
+        />
+        <LabeledInput
+          v-model:value.number="value.httpGet.port"
+          type="number"
+          :label="t('workload.container.lifecycleHook.httpGet.port.label')"
+          :placeholder="t('workload.container.lifecycleHook.httpGet.port.placeholder')"
+          :mode="mode"
+          required
+          @update:value="update"
+        />
+        <LabeledSelect
+          v-model:value="value.httpGet.scheme"
+          :label="t('workload.container.lifecycleHook.httpGet.scheme.label')"
+          :placeholder="t('workload.container.lifecycleHook.httpGet.scheme.placeholder')"
+          :options="schemeOptions"
+          :mode="mode"
+          @update:value="update"
+        />
       </div>
 
       <h4>{{ t('workload.container.lifecycleHook.httpHeaders.title') }}</h4>

package/components/form/LabeledSelect.vue

@@ -139,7 +139,6 @@ export default {
     filteredAttrs() {
       const {
         class: _class,
-        taggable,
         ...rest
       } = this.$attrs;
 

package/components/form/LifecycleHooks.vue

@@ -69,7 +69,7 @@ export default {
       <HookOption
         v-model:value="postStart"
         :mode="mode"
-        @input="update"
+        @update:value="update"
       />
     </div>
 
@@ -80,7 +80,7 @@ export default {
       <HookOption
         v-model:value="preStop"
         :mode="mode"
-        @input="update"
+        @update:value="update"
       />
     </div>
   </div>

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

@@ -0,0 +1,27 @@
+import { shallowMount } from '@vue/test-utils';
+import ColorInput from '@shell/components/form/ColorInput.vue';
+
+describe('colorInput.vue', () => {
+  it('disables the input when disabled prop is true', () => {
+    const wrapper = shallowMount(
+      ColorInput,
+      { props: { disabled: true } }
+    );
+
+    const colorWrapper = wrapper.find('.color-input');
+    const colorInput = wrapper.find('input');
+
+    expect(colorWrapper.classes()).toContain('disabled');
+    expect(Object.keys(colorInput.attributes())).toContain('disabled');
+  });
+
+  it('defaults to enabled when no disabled prop is passed', () => {
+    const wrapper = shallowMount(ColorInput);
+
+    const colorWrapper = wrapper.find('.color-input');
+    const colorInput = wrapper.find('input');
+
+    expect(colorWrapper.classes()).not.toContain('disabled');
+    expect(Object.keys(colorInput.attributes())).not.toContain('disabled');
+  });
+});

package/components/formatter/SecretData.vue

@@ -43,7 +43,7 @@ export default {
 
 <template>
   <div v-if="isTLS">
-    <t k="secret.certificate.cn" /> {{ cn }} <span v-if="row.unrepeatedSans.length">{{ t('secret.certificate.plusMore', {n:row.unrepeatedSans.length}) }}</span><br>
+    <t k="secret.certificate.cn" /> {{ cn }} <span v-if="row.unrepeatedSans && row.unrepeatedSans.length">{{ t('secret.certificate.plusMore', {n:row.unrepeatedSans.length}) }}</span><br>
     <t k="secret.certificate.expires" />: <DateComponent
       :class="dateClass"
       :value="expiration"

package/components/nav/Header.vue

@@ -1,7 +1,7 @@
 <script>
 import { mapGetters } from 'vuex';
 import debounce from 'lodash/debounce';
-import { NORMAN, STEVE, MANAGEMENT } from '@shell/config/types';
+import { NORMAN, STEVE } from '@shell/config/types';
 import { ucFirst } from '@shell/utils/string';
 import { isAlternate, isMac } from '@shell/utils/platform';
 import Import from '@shell/components/Import';
@@ -20,7 +20,7 @@ import { ActionLocation, ExtensionPoint } from '@shell/core/types';
 import { getApplicableExtensionEnhancements } from '@shell/core/plugin-helpers';
 import IconOrSvg from '@shell/components/IconOrSvg';
 import { wait } from '@shell/utils/async';
-import { authProvidersInfo, parseAuthProvidersInfo } from '@shell/utils/auth';
+import { configType } from '@shell/models/management.cattle.io.authconfig';
 import HeaderPageActionMenu from './HeaderPageActionMenu.vue';
 
 export default {
@@ -48,7 +48,7 @@ export default {
 
   fetch() {
     // fetch needed data to check if any auth provider is enabled
-    authProvidersInfo(this.$store);
+    this.$store.dispatch('auth/getAuthProviders');
   },
 
   data() {
@@ -89,11 +89,10 @@ export default {
       'showTopLevelMenu'
     ]),
 
-    authProviderEnabled() {
-      const authProviders = this.$store.getters['management/all'](MANAGEMENT.AUTH_CONFIG);
-      const authInfo = parseAuthProvidersInfo(authProviders);
+    samlAuthProviderEnabled() {
+      const publicAuthProviders = this.$store.getters['rancher/all']('authProvider');
 
-      return authInfo.enabled?.[0] || {};
+      return publicAuthProviders.find((authProvider) => configType[authProvider.id] === 'saml') || {};
     },
 
     shouldShowSloLogoutModal() {
@@ -102,11 +101,9 @@ export default {
         return false;
       }
 
-      const {
-        logoutAllSupported, logoutAllEnabled, logoutAllForced, configType
-      } = this.authProviderEnabled;
+      const { logoutAllSupported, logoutAllEnabled, logoutAllForced } = this.samlAuthProviderEnabled;
 
-      return configType === 'saml' && logoutAllSupported && logoutAllEnabled && !logoutAllForced;
+      return logoutAllSupported && logoutAllEnabled && !logoutAllForced;
     },
 
     appName() {
@@ -260,7 +257,7 @@ export default {
     showSloModal() {
       this.$store.dispatch('management/promptModal', {
         component:      'SloDialog',
-        componentProps: { authProvider: this.authProviderEnabled },
+        componentProps: { authProvider: this.samlAuthProviderEnabled },
         modalWidth:     '500px'
       });
     },
@@ -1118,7 +1115,7 @@ export default {
       display: flex;
       justify-content: space-between;
       padding: 10px;
-      color: var(--link);
+      color: var(--popover-text);
     }
 
     div.menu-separator {

package/components/nav/TopLevelMenu.vue

@@ -10,7 +10,6 @@ import { sortBy } from '@shell/utils/sort';
 import { ucFirst } from '@shell/utils/string';
 import { KEY } from '@shell/utils/platform';
 import { getVersionInfo } from '@shell/utils/version';
-import { LEGACY } from '@shell/store/features';
 import { SETTING } from '@shell/config/settings';
 import { filterOnlyKubernetesClusters, filterHiddenLocalCluster } from '@shell/utils/cluster';
 import { getProductFromRoute } from '@shell/utils/router';
@@ -68,10 +67,6 @@ export default {
       };
     },
 
-    legacyEnabled() {
-      return this.features(LEGACY);
-    },
-
     showClusterSearch() {
       return this.clusters.length > this.maxClustersToShow;
     },
@@ -255,12 +250,6 @@ export default {
       });
     },
 
-    legacyApps() {
-      const options = this.options;
-
-      return options.filter((opt) => opt.inStore === 'management' && opt.category === 'legacy');
-    },
-
     configurationApps() {
       const options = this.options;
 
@@ -347,7 +336,6 @@ export default {
       const appBar = {
         hciApps:           this.hciApps,
         multiClusterApps:  this.multiClusterApps,
-        legacyApps:        this.legacyApps,
         configurationApps: this.configurationApps,
         pinFiltered:       this.pinFiltered,
         clustersFiltered:  this.clustersFiltered,
@@ -856,34 +844,6 @@ export default {
                 </router-link>
               </div>
             </template>
-            <template v-if="legacyEnabled">
-              <div
-                class="category-title"
-              >
-                <hr>
-                <span>
-                  {{ t('nav.categories.legacy') }}
-                </span>
-              </div>
-              <div
-                v-for="(a, i) in appBar.legacyApps"
-                :key="i"
-                @click="hide()"
-              >
-                <router-link
-                  class="option"
-                  :class="{'active-menu-link': a.isMenuActive }"
-                  :to="a.to"
-                >
-                  <IconOrSvg
-                    v-tooltip="getTooltipConfig(a.label)"
-                    :icon="a.icon"
-                    :src="a.svg"
-                  />
-                  <div>{{ a.label }}</div>
-                </router-link>
-              </div>
-            </template>
 
             <!-- App menu -->
             <template v-if="configurationApps.length">

package/components/nav/WorkspaceSwitcher.vue

@@ -92,7 +92,6 @@ export default {
       ref="select"
       v-model:value="value"
       label="label"
-      :append-to-body="false"
       :options="options"
       :clearable="false"
       :reduce="(opt) => opt.value"

package/config/private-label.js

@@ -1,9 +1,10 @@
 import { SETTING } from './settings';
+import { CURRENT_RANCHER_VERSION } from './version';
 
 export const ANY = 0;
 export const STANDARD = 1;
 export const CUSTOM = 2;
-export const DOCS_BASE = 'https://ranchermanager.docs.rancher.com/v2.9';
+export const DOCS_BASE = `https://ranchermanager.docs.rancher.com/v${ CURRENT_RANCHER_VERSION }`;
 
 const STANDARD_VENDOR = 'Rancher';
 const STANDARD_PRODUCT = 'Explorer';