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

package/composables/useStateColor.ts

@@ -0,0 +1,128 @@
+import { reactive } from 'vue';
+import { useStore } from 'vuex';
+import { colorForState } from '@shell/plugins/dashboard-store/resource-class';
+import type { StateColor } from '@shell/utils/style';
+import stevePaginationUtils from '@shell/plugins/steve/steve-pagination-utils';
+import { PaginationParamFilter } from '@shell/types/store/pagination.types';
+
+export interface StateSummaryEntry {
+  type: string;
+  summary: { property: string; counts: Record<string, { total: number; namespace: Record<string, number> }> }[] | null;
+}
+
+const stateColorCache = reactive<Record<string, StateColor>>({});
+const pendingResolves = new Set<string>();
+
+/**
+ * Composable that maps Kubernetes resource state names to dashboard color tokens.
+ *
+ * This scenario is to forcefully resolve state colors based on properties like error and transitioning.
+ * It is to be used when you only have the state name and don't have the actual state object
+ *
+ * Using a request of only one resource per unknown state, it will fetch the data to retrieve the state object.
+ * For normal cases where the object is already available, this composable is not needed.
+ *
+ * @returns `toStateColor` — synchronous lookup that triggers background API
+ *          resolution for unknown states when a resource type is provided.
+ */
+export function useStateColor() {
+  const store = useStore();
+
+  /**
+   * Returns the cached {@link StateColor} for a given state name.
+   * Falls back to `colorForState` as a temporary color and triggers an async
+   * resolve via the Steve API when `type` is provided. Once resolved, the
+   * reactive cache updates and the UI re-renders with the correct color.
+   *
+   * @param state - The resource state name (e.g. `'active'`, `'error'`). Case-insensitive.
+   * @param type - The Steve resource type (e.g. `'apps.deployment'`). Used to
+   *               fetch a resource via the API when the state is not cached.
+   * @returns The resolved color token.
+   */
+  function toStateColor(state: string, type: string): StateColor {
+    const stateLower = (state || '').toLowerCase();
+    const key = `${ type }:${ stateLower }`;
+
+    if (stateColorCache[key]) {
+      return stateColorCache[key];
+    }
+
+    if (!pendingResolves.has(key)) {
+      pendingResolves.add(key);
+      resolveStateColor(key, state, type);
+    }
+
+    const rawColor = colorForState(stateLower, false, false).replace('text-', '');
+
+    return (rawColor === 'darker' ? 'disabled' : rawColor) as StateColor;
+  }
+
+  async function resolveStateColor(key: string, originalName: string, type: string): Promise<void> {
+    try {
+      const schema = store.getters['cluster/schemaFor'](type);
+      const params = stevePaginationUtils.createParamsForPagination({
+        schema,
+        opt: {
+          pagination: {
+            page:                 1,
+            pageSize:             1,
+            sort:                 [],
+            filters:              [PaginationParamFilter.createSingleField({ field: 'metadata.state.name', value: originalName })],
+            projectsOrNamespaces: [],
+          }
+        }
+      });
+      const url = `${ store.getters['cluster/urlFor'](type) }?${ params }`;
+      const res = await store.dispatch('cluster/request', { url });
+      const resource = res?.data?.[0];
+
+      if (resource?.metadata?.state) {
+        const { error: isError, transitioning, name } = resource.metadata.state;
+        const rawColor = colorForState(name, isError, transitioning).replace('text-', '');
+
+        stateColorCache[key] = (rawColor === 'darker' ? 'disabled' : rawColor) as StateColor;
+      }
+    } catch {
+      // Keep the colorForState fallback
+    } finally {
+      pendingResolves.delete(key);
+    }
+  }
+
+  async function resolveStateColors(entries: StateSummaryEntry[]): Promise<void> {
+    const toResolve: Array<{ key: string; originalName: string; type: string }> = [];
+
+    for (const entry of entries) {
+      if (!entry.summary) {
+        continue;
+      }
+
+      for (const s of entry.summary) {
+        if (s.property === 'metadata.state.name') {
+          for (const stateName of Object.keys(s.counts)) {
+            const key = stateName.toLowerCase();
+
+            const cacheKey = `${ entry.type }:${ key }`;
+
+            if (!stateColorCache[cacheKey] && !pendingResolves.has(cacheKey)) {
+              pendingResolves.add(cacheKey);
+              toResolve.push({
+                key: cacheKey, originalName: stateName, type: entry.type
+              });
+            }
+          }
+        }
+      }
+    }
+
+    const concurrency = 10;
+
+    for (let i = 0; i < toResolve.length; i += concurrency) {
+      await Promise.all(
+        toResolve.slice(i, i + concurrency).map((r) => resolveStateColor(r.key, r.originalName, r.type))
+      );
+    }
+  }
+
+  return { toStateColor, resolveStateColors };
+}

package/config/home-links.js

@@ -44,7 +44,7 @@ const APP_COLLECTION_LINK = {
 
 const SUPPORT_LINK = {
   key:      'commercialSupport',
-  value:    '/support',
+  value:    'https://www.suse.com/products/rancher/',
   enabled:  true,
   readonly: true
 };

package/config/labels-annotations.js

@@ -19,6 +19,7 @@ export const NODE_ARCHITECTURE = 'kubernetes.io/arch';
 export const IMPORTED_CLUSTER_VERSION_MANAGEMENT = 'rancher.io/imported-cluster-version-management';
 export const UI_PROJECT_SECRET = 'management.cattle.io/project-scoped-secret';
 export const UI_PROJECT_SECRET_COPY = 'management.cattle.io/project-scoped-secret-copy';
+export const SERVICE_LINKS = 'ui.rancher/service-links';
 
 export const KUBERNETES = {
   SERVICE_ACCOUNT_UID:  'kubernetes.io/service-account.uid',

package/config/product/explorer.js

@@ -10,6 +10,7 @@ import {
   SNAPSHOT,
   VIRTUAL_TYPES,
   CAPI,
+  WORKLOAD_DASHBOARD,
 } from '@shell/config/types';
 
 import {
@@ -103,6 +104,7 @@ export function init(store) {
     CONFIG_MAP
   ], 'storage');
   basicType([
+    WORKLOAD_DASHBOARD,
     WORKLOAD,
     WORKLOAD_TYPES.DEPLOYMENT,
     WORKLOAD_TYPES.DAEMON_SET,
@@ -112,10 +114,6 @@ export function init(store) {
     POD,
   ], 'workload');
 
-  setGroupDefaultType('workload', () => {
-    return store.getters['features/get'](STEVE_CACHE) ? WORKLOAD_TYPES.DEPLOYMENT : undefined;
-  });
-
   weightGroup('cluster', 99, true);
   weightGroup('workload', 98, true);
   weightGroup('serviceDiscovery', 96, true);
@@ -586,6 +584,21 @@ export function init(store) {
     overview:   true,
   });
 
+  // Workload Dashboard - overview page using the Resource Summary API
+  virtualType({
+    label:          store.getters['i18n/t'](`typeLabel.${ WORKLOAD }`, { count: 2 }),
+    group:          'Root',
+    namespaced:     true,
+    name:           WORKLOAD_DASHBOARD,
+    weight:         100,
+    icon:           'folder',
+    ifHaveSubTypes: Object.values(WORKLOAD_TYPES),
+    ifFeature:      STEVE_CACHE,
+    route:          { name: 'c-cluster-explorer-workload-dashboard' },
+    exact:          true,
+    overview:       true,
+  });
+
   virtualType({
     labelKey:     'members.clusterAndProject',
     group:        'cluster',

package/config/product/manager.js

@@ -130,10 +130,12 @@ export function init(store) {
 
   basicType([
     HOSTED_PROVIDER,
+    CAPI.CAPI_PROVIDER,
     'rke-kontainer-providers',
     'rke-node-providers',
   ], 'providers');
 
+  weightType(CAPI.CAPI_PROVIDER, 4, true);
   weightType(CAPI.MACHINE_DEPLOYMENT, 4, true);
   weightType(CAPI.MACHINE_SET, 3, true);
   weightType(CAPI.MACHINE, 2, true);

package/config/router/index.js

@@ -9,6 +9,22 @@ export const routerOptions = {
   base:     process.env.routerBase || '/',
   routes:   Routes,
   fallback: false,
+  scrollBehavior(to, from, savedPosition) {
+    // Returning the savedPosition will result in a native-like behavior when
+    // navigating with back/forward buttons
+    if (savedPosition) {
+      return savedPosition;
+    }
+
+    // Handle the "skip to main content" link
+    if (to.hash === '#main-content') {
+      const el = document.getElementById('main-content');
+
+      el?.focus();
+
+      return { el: to.hash };
+    }
+  },
 };
 
 export function extendRouter(config, context) {

package/config/router/navigation-guards/__tests__/authentication.test.ts

@@ -0,0 +1,130 @@
+import { authenticate } from '@shell/config/router/navigation-guards/authentication';
+
+jest.mock('@shell/utils/router', () => ({ routeRequiresAuthentication: () => true }));
+
+const isLoggedInMock = jest.fn();
+const findMeMock = jest.fn();
+const notLoggedInMock = jest.fn();
+const noAuthMock = jest.fn();
+
+jest.mock('@shell/utils/auth', () => {
+  const actual = jest.requireActual('@shell/utils/auth');
+
+  return {
+    ...actual,
+    isLoggedIn:  (...args: any[]) => isLoggedInMock(...args),
+    findMe:      (...args: any[]) => findMeMock(...args),
+    notLoggedIn: (...args: any[]) => notLoggedInMock(...args),
+    noAuth:      (...args: any[]) => noAuthMock(...args),
+  };
+});
+
+function makeStore({ user, fromHeader }: { user: any, fromHeader: string }) {
+  const getters: Record<string, any> = {
+    'auth/enabled':    true,
+    'auth/loggedIn':   false,
+    'auth/user':       user,
+    'auth/fromHeader': fromHeader,
+  };
+
+  return {
+    dispatch: jest.fn().mockResolvedValue(undefined),
+    commit:   jest.fn(),
+    getters,
+  };
+}
+
+const to = { name: 'c-cluster-explorer', query: {} };
+
+describe('navigation-guards/authentication: mustChangePassword', () => {
+  beforeEach(() => {
+    isLoggedInMock.mockReset().mockResolvedValue(undefined);
+    findMeMock.mockReset();
+    notLoggedInMock.mockReset();
+    noAuthMock.mockReset();
+  });
+
+  it('redirects local users with mustChangePassword to auth-setup', async() => {
+    const store = makeStore({
+      user:       { mustChangePassword: true, principalIds: ['local://user-1'] },
+      fromHeader: 'true',
+    });
+
+    findMeMock.mockResolvedValue({ id: 'local://user-1', provider: 'local' });
+
+    const next = jest.fn();
+
+    await authenticate(to as any, {} as any, next, { store } as any);
+
+    expect(next).toHaveBeenCalledWith({ name: 'auth-setup' });
+    expect(isLoggedInMock).not.toHaveBeenCalled();
+  });
+
+  it('lets SSO users with mustChangePassword reach the requested route', async() => {
+    const me = { id: 'oidc_user://user@example.com', provider: 'genericoidc' };
+    const store = makeStore({
+      user:       { mustChangePassword: true, principalIds: ['local://user-1', me.id] },
+      fromHeader: 'true',
+    });
+
+    findMeMock.mockResolvedValue(me);
+
+    const next = jest.fn();
+
+    await authenticate(to as any, {} as any, next, { store } as any);
+
+    expect(next).toHaveBeenCalledWith();
+    expect(next).not.toHaveBeenCalledWith({ name: 'auth-setup' });
+    expect(isLoggedInMock).toHaveBeenCalledTimes(1);
+  });
+
+  it('does not redirect when mustChangePassword is false, regardless of provider', async() => {
+    const store = makeStore({
+      user:       { mustChangePassword: false, principalIds: ['local://user-1'] },
+      fromHeader: 'true',
+    });
+
+    findMeMock.mockResolvedValue({ id: 'local://user-1', provider: 'local' });
+
+    const next = jest.fn();
+
+    await authenticate(to as any, {} as any, next, { store } as any);
+
+    expect(next).toHaveBeenCalledWith();
+    expect(isLoggedInMock).toHaveBeenCalledTimes(1);
+  });
+
+  it('redirects local users with mustChangePassword to auth-setup for older-style fromHeader', async() => {
+    const store = makeStore({
+      user:       { mustChangePassword: true, principalIds: ['local://user-1'] },
+      fromHeader: 'unknown',
+    });
+
+    findMeMock.mockResolvedValue({ id: 'local://user-1', provider: 'local' });
+
+    const next = jest.fn();
+
+    await authenticate(to as any, {} as any, next, { store } as any);
+
+    expect(next).toHaveBeenCalledWith({ name: 'auth-setup' });
+    expect(isLoggedInMock).not.toHaveBeenCalled();
+  });
+
+  it('lets SSO users with mustChangePassword through for older-style fromHeader', async() => {
+    const me = { id: 'saml_user://user', provider: 'saml' };
+    const store = makeStore({
+      user:       { mustChangePassword: true, principalIds: ['local://user-1', me.id] },
+      fromHeader: 'unknown',
+    });
+
+    findMeMock.mockResolvedValue(me);
+
+    const next = jest.fn();
+
+    await authenticate(to as any, {} as any, next, { store } as any);
+
+    expect(next).toHaveBeenCalledWith();
+    expect(next).not.toHaveBeenCalledWith({ name: 'auth-setup' });
+    expect(isLoggedInMock).toHaveBeenCalledTimes(1);
+  });
+});

package/config/router/navigation-guards/authentication.js

@@ -61,19 +61,21 @@ export async function authenticate(to, from, next, { store }) {
     await store.dispatch('auth/getUser');
     const user = store.getters['auth/user'] || {};
 
-    if (user?.mustChangePassword) {
-      return next({ name: 'auth-setup' });
-    }
-
     // In newer versions the API calls return the auth state instead of having to make a new call all the time.
     const fromHeader = store.getters['auth/fromHeader'];
 
+    const mustChangePasswordFor = (me) => user?.mustChangePassword && me?.provider === 'local';
+
     if ( fromHeader === 'none' ) {
       noAuth(store);
       handleOidcRedirectToCallbackUrl();
     } else if ( fromHeader === 'true' ) {
       const me = await findMe(store);
 
+      if (mustChangePasswordFor(me)) {
+        return next({ name: 'auth-setup' });
+      }
+
       await isLoggedIn(store, getUserObject(user, me));
       handleOidcRedirectToCallbackUrl();
     } else if ( fromHeader === 'false' ) {
@@ -85,6 +87,10 @@ export async function authenticate(to, from, next, { store }) {
       try {
         const me = await findMe(store);
 
+        if (mustChangePasswordFor(me)) {
+          return next({ name: 'auth-setup' });
+        }
+
         await isLoggedIn(store, getUserObject(user, me));
         handleOidcRedirectToCallbackUrl();
       } catch (e) {

package/config/router/routes.js

@@ -58,12 +58,7 @@ export default [
         path:      '/home',
         component: () => interopDefault(import('@shell/pages/home.vue')),
         name:      'home'
-      },
-      {
-        path:      '/support',
-        component: () => interopDefault(import('@shell/pages/support/index.vue')),
-        name:      'support'
-      },
+      }
     ]
   },
   {
@@ -238,6 +233,21 @@ export default [
         path:      '/c/:cluster/fleet/application/create',
         component: () => interopDefault(import('@shell/pages/c/_cluster/fleet/application/create.vue')),
         name:      'c-cluster-fleet-application-create',
+      }, {
+        path:      '/c/:cluster/fleet/application/suse-app-collection/credentials',
+        component: () => interopDefault(import('@shell/pages/c/_cluster/fleet/application/suse-app-collection/credentials.vue')),
+        name:      'c-cluster-fleet-application-appco-credentials',
+        meta:      { disableWorkspaceSwitcher: true },
+      }, {
+        path:      '/c/:cluster/fleet/application/suse-app-collection/charts',
+        component: () => interopDefault(import('@shell/pages/c/_cluster/fleet/application/suse-app-collection/charts.vue')),
+        name:      'c-cluster-fleet-application-appco-charts',
+        meta:      { disableWorkspaceSwitcher: true },
+      }, {
+        path:      '/c/:cluster/fleet/application/suse-app-collection/chart',
+        component: () => interopDefault(import('@shell/pages/c/_cluster/fleet/application/suse-app-collection/chart.vue')),
+        name:      'c-cluster-fleet-application-appco-chart',
+        meta:      { disableWorkspaceSwitcher: true },
       }, {
         path:      '/c/:cluster/fleet/application/:resource/create',
         component: () => interopDefault(import('@shell/pages/c/_cluster/fleet/application/_resource/create.vue')),
@@ -349,6 +359,10 @@ export default [
         path:      '/c/:cluster/explorer/explorer-utils',
         component: () => interopDefault(import('@shell/pages/c/_cluster/explorer/explorer-utils.js')),
         name:      'c-cluster-explorer-explorer-utils'
+      }, {
+        path:      '/c/:cluster/explorer/workload-dashboard',
+        component: () => interopDefault(import('@shell/pages/c/_cluster/explorer/workload-dashboard/index.vue')),
+        name:      'c-cluster-explorer-workload-dashboard'
       }, {
         path:      '/c/:cluster/explorer/tools',
         component: () => interopDefault(import('@shell/pages/c/_cluster/explorer/tools/index.vue')),

package/config/settings.ts

@@ -63,7 +63,6 @@ export const SETTING = {
   AUTH_USER_INFO_RESYNC_CRON:                    'auth-user-info-resync-cron',
   AUTH_LOCAL_VALIDATE_DESC:                      'auth-password-requirements-description',
   PASSWORD_MIN_LENGTH:                           'password-min-length', // CATTLE_PASSWORD_MIN_LENGTH
-  UI_INDEX:                                      'ui-index',
   UI_DASHBOARD_INDEX:                            'ui-dashboard-index',
   UI_DASHBOARD_HARVESTER_LEGACY_PLUGIN:          'ui-dashboard-harvester-legacy-plugin',
   UI_OFFLINE_PREFERRED:                          'ui-offline-preferred',
@@ -164,7 +163,6 @@ export const ALLOWED_SETTINGS: GlobalSetting = {
   [SETTING.SERVER_URL]:                           { kind: 'url', canReset: true },
   [SETTING.RKE_METADATA_CONFIG]:                  { kind: 'json' },
   [SETTING.SYSTEM_DEFAULT_REGISTRY]:              {},
-  [SETTING.UI_INDEX]:                             {},
   [SETTING.UI_DASHBOARD_INDEX]:                   {},
   [SETTING.UI_OFFLINE_PREFERRED]:                 {
     kind:    'enum',

package/config/table-headers.js

@@ -793,11 +793,10 @@ export const FLEET_SUMMARY = {
 export const FLEET_APPLICATION_TYPE = {
   name:     'applicationType',
   labelKey: 'fleet.tableHeaders.applicationType',
-  value:    'kind',
-  sort:     'kind',
+  value:    'applicationType',
+  sort:     'applicationType',
   search:   false,
-  align:    'center',
-  width:    100,
+  width:    200,
 };
 
 export const FLEET_APPLICATION_SOURCE = {

package/config/types.js

@@ -81,6 +81,7 @@ export const RBAC = {
 };
 
 export const WORKLOAD = 'workload';
+export const WORKLOAD_DASHBOARD = 'workload-dashboard';
 
 /**
  * Rancher Workload types
@@ -279,6 +280,7 @@ export const CAPI = {
   MACHINE:              'cluster.x-k8s.io.machine',
   RANCHER_CLUSTER:      'provisioning.cattle.io.cluster',
   MACHINE_CONFIG_GROUP: 'rke-machine-config.cattle.io',
+  CAPI_PROVIDER:        'turtles-capi.cattle.io.capiprovider'
 };
 
 // --------------------------------------
@@ -295,6 +297,7 @@ export const FLEET = {
   DASHBOARD:                'fleet.cattle.io.dashboard',
   GIT_REPO:                 'fleet.cattle.io.gitrepo',
   HELM_OP:                  'fleet.cattle.io.helmop',
+  SUSE_APP_COLLECTION:      'suse-application-collection',
   WORKSPACE:                'management.cattle.io.fleetworkspace',
   TOKEN:                    'fleet.cattle.io.clusterregistrationtoken',
   BUNDLE_NAMESPACE_MAPPING: 'fleet.cattle.io.bundlenamespacemapping',
@@ -420,6 +423,12 @@ export const CLUSTER_REPO_APPCO_AUTH_GENERATE_NAME = 'clusterrepo-appco-auth-';
  */
 export const CLUSTER_REPO_AUTH_GENERATE_NAME = 'clusterrepo-auth-';
 
+/**
+ * The `generateName` prefix used when creating Helm Op authentication secrets
+ * for standard Helm sources.
+ */
+export const AUTH_GENERATE_NAME = 'auth-';
+
 export const ZERO_TIME = '0001-01-01T00:00:00Z';
 
 export const DEFAULT_GRAFANA_STORAGE_SIZE = '10Gi';

package/core/plugin-products-base.ts

@@ -1,7 +1,7 @@
 import { IExtension } from '@shell/core/types';
 import {
   ProductChild, ProductMetadata,
-  ConfigureTypeConfiguration, VirtualTypeConfiguration,
+  ResourcePageConfiguration, CustomPageConfiguration,
   ProductChildCustomPage, VueRouteComponent,
   OverviewPageRoutingMetadata
 } from '@shell/core/plugin-types';
@@ -343,7 +343,7 @@ export abstract class BasePluginProduct {
       this.registeredPageNames.add(finalName);
       this.pageIdMap.set(item.name, finalName);
 
-      const virtualTypeConfig: VirtualTypeConfiguration = {
+      const virtualTypeConfig: CustomPageConfiguration = {
         label:      item.label,
         labelKey:   item.labelKey,
         namespaced: false,
@@ -377,7 +377,7 @@ export abstract class BasePluginProduct {
 
       const route = pluginProductsHelpers.generateConfigureTypeRoute(parentName, item, { extendProduct: !this.isNewProduct });
 
-      const configureTypeConfig: ConfigureTypeConfiguration = {
+      const configureTypeConfig: ResourcePageConfiguration = {
         isCreatable: true,
         isEditable:  true,
         isRemovable: true,