@rancher/shell 3.0.5-rc.8 → 3.0.5

package/utils/__tests__/product.test.ts

@@ -0,0 +1,129 @@
+import { setProduct } from '@shell/utils/product';
+import { getProductFromRoute } from '@shell/utils/router';
+import { NAME as EXPLORER } from '@shell/config/product/explorer';
+import { RouteLocation } from 'vue-router';
+
+// Mock dependencies
+jest.mock('@shell/utils/router', () => ({ getProductFromRoute: jest.fn() }));
+
+const mockGetProductFromRoute = getProductFromRoute as jest.Mock;
+
+describe('utils/product', () => {
+  describe('setProduct', () => {
+    let mockStore: any;
+    let mockTo: RouteLocation;
+
+    beforeEach(() => {
+      jest.clearAllMocks();
+
+      // A stateful mock store to better simulate Vuex behavior
+      mockStore = {
+        productId: 'some-old-product',
+        products:  {
+          'some-old-product':       { name: 'some-old-product', inStore: 'store_a' },
+          'new-product-same-store': { name: 'new-product-same-store', inStore: 'store_a' },
+          'new-product-diff-store': { name: 'new-product-diff-store', inStore: 'store_b' },
+          [EXPLORER]:               { name: EXPLORER, inStore: 'explorer_store' },
+        },
+        getters: {
+          'type-map/isProductRegistered': jest.fn().mockReturnValue(true),
+          'i18n/t':                       jest.fn((key, args) => `${ key } ${ JSON.stringify(args) || '' }`),
+          get currentProduct() {
+            return mockStore.products[mockStore.productId];
+          },
+          get productId() {
+            return mockStore.productId;
+          }
+        },
+        commit: jest.fn((type, payload) => {
+          if (type === 'setProduct') {
+            mockStore.productId = payload;
+          }
+        }),
+        dispatch: jest.fn(),
+      };
+
+      mockTo = { matched: [{ path: '/c/:cluster/some-product' }] } as unknown as RouteLocation;
+    });
+
+    it('should dispatch loadingError if product is not found (wildcard route)', () => {
+      const product = 'invalid-product';
+
+      mockGetProductFromRoute.mockReturnValue(product);
+      mockTo.matched = [{ path: '/c/:cluster/:product' }] as any;
+
+      setProduct(mockStore, mockTo);
+
+      expect(mockStore.dispatch).toHaveBeenCalledWith('loadingError', expect.any(Error));
+      expect(mockStore.getters['i18n/t']).toHaveBeenCalledWith('nav.failWhale.productNotFound', { productNotFound: product }, true);
+      expect(mockStore.commit).not.toHaveBeenCalled();
+    });
+
+    it('should dispatch loadingError if product exists but route has no matches', () => {
+      const product = 'invalid-product';
+
+      mockGetProductFromRoute.mockReturnValue(product);
+      mockTo.matched = [] as any; // No matched routes
+
+      setProduct(mockStore, mockTo);
+
+      expect(mockStore.dispatch).toHaveBeenCalledWith('loadingError', expect.any(Error));
+      expect(mockStore.getters['i18n/t']).toHaveBeenCalledWith('nav.failWhale.productNotFound', { productNotFound: product }, true);
+      expect(mockStore.commit).not.toHaveBeenCalled();
+    });
+
+    it('should dispatch loadingError if product is not registered', () => {
+      const product = 'unregistered-product';
+
+      mockGetProductFromRoute.mockReturnValue(product);
+      mockStore.getters['type-map/isProductRegistered'].mockReturnValue(false);
+
+      setProduct(mockStore, mockTo);
+
+      expect(mockStore.dispatch).toHaveBeenCalledWith('loadingError', expect.any(Error));
+      expect(mockStore.getters['i18n/t']).toHaveBeenCalledWith('nav.failWhale.productNotFound', { productNotFound: product }, true);
+      expect(mockStore.commit).not.toHaveBeenCalled();
+    });
+
+    it('should default to EXPLORER product and reset catalog if store changes', () => {
+      mockGetProductFromRoute.mockReturnValue(null);
+
+      setProduct(mockStore, mockTo);
+
+      expect(mockStore.commit).toHaveBeenCalledWith('setProduct', EXPLORER);
+      expect(mockStore.commit).toHaveBeenCalledWith('catalog/reset');
+    });
+
+    it('should not call any commits if the product has not changed', () => {
+      const product = 'some-old-product';
+
+      mockGetProductFromRoute.mockReturnValue(product);
+
+      setProduct(mockStore, mockTo);
+
+      expect(mockStore.commit).not.toHaveBeenCalled();
+    });
+
+    it('should change product but not reset catalog if inStore is the same', () => {
+      const newProduct = 'new-product-same-store';
+
+      mockGetProductFromRoute.mockReturnValue(newProduct);
+
+      setProduct(mockStore, mockTo);
+
+      expect(mockStore.commit).toHaveBeenCalledWith('setProduct', newProduct);
+      expect(mockStore.commit).not.toHaveBeenCalledWith('catalog/reset');
+    });
+
+    it('should change product and reset catalog if inStore is different', () => {
+      const newProduct = 'new-product-diff-store';
+
+      mockGetProductFromRoute.mockReturnValue(newProduct);
+
+      setProduct(mockStore, mockTo);
+
+      expect(mockStore.commit).toHaveBeenCalledWith('setProduct', newProduct);
+      expect(mockStore.commit).toHaveBeenCalledWith('catalog/reset');
+    });
+  });
+});

package/utils/__tests__/resource.test.ts

@@ -0,0 +1,87 @@
+import { validateResource } from '@shell/utils/resource';
+import { canViewResource } from '@shell/utils/auth';
+import { getResourceFromRoute } from '@shell/utils/router';
+import { RouteLocation } from 'vue-router';
+
+// Mock dependencies from other modules
+jest.mock('@shell/utils/auth', () => ({ canViewResource: jest.fn() }));
+
+jest.mock('@shell/utils/router', () => ({ getResourceFromRoute: jest.fn() }));
+
+// Typed mocks for better intellisense and type-checking
+const mockCanViewResource = canViewResource as jest.Mock;
+const mockGetResourceFromRoute = getResourceFromRoute as jest.Mock;
+
+describe('validateResource', () => {
+  let mockStore: any;
+  let mockTo: RouteLocation;
+
+  beforeEach(() => {
+    // Reset mocks before each test to ensure test isolation
+    jest.clearAllMocks();
+
+    // A basic mock for the Vuex store
+    mockStore = {
+      getters: {
+        currentProduct: { name: 'explorer' },
+        'i18n/t':       jest.fn((key, args) => `i18n: ${ key } ${ JSON.stringify(args) || '' }`),
+      },
+      dispatch: jest.fn(),
+    };
+
+    // A mock for the route location object
+    mockTo = {
+      name:   'c-cluster-product-resource-id',
+      params: {
+        cluster:  'local',
+        product:  'explorer',
+        resource: 'pod',
+        id:       'my-pod'
+      }
+    } as unknown as RouteLocation;
+  });
+
+  it('should return false if no product is set in the store', () => {
+    mockStore.getters.currentProduct = null;
+    mockGetResourceFromRoute.mockReturnValue('pod');
+
+    const result = validateResource(mockStore, mockTo);
+
+    expect(result).toBe(false);
+    expect(mockStore.dispatch).not.toHaveBeenCalled();
+  });
+
+  it('should return false if no resource is found in the route', () => {
+    mockGetResourceFromRoute.mockReturnValue(null);
+
+    const result = validateResource(mockStore, mockTo);
+
+    expect(result).toBe(false);
+    expect(mockStore.dispatch).not.toHaveBeenCalled();
+  });
+
+  it('should return false if the user is authorized to view the resource', () => {
+    mockGetResourceFromRoute.mockReturnValue('pod');
+    mockCanViewResource.mockReturnValue(true);
+
+    const result = validateResource(mockStore, mockTo);
+
+    expect(result).toBe(false);
+    expect(mockStore.dispatch).not.toHaveBeenCalled();
+  });
+
+  it('should throw an error and dispatch loadingError if user cannot view the resource', () => {
+    const resource = 'pod';
+
+    mockGetResourceFromRoute.mockReturnValue(resource);
+    mockCanViewResource.mockReturnValue(false);
+
+    const errorMessage = `i18n: nav.failWhale.resourceNotFound {"resource":"${ resource }"}`;
+
+    mockStore.getters['i18n/t'].mockReturnValue(errorMessage);
+
+    expect(() => validateResource(mockStore, mockTo)).toThrow(errorMessage);
+    expect(mockStore.dispatch).toHaveBeenCalledWith('loadingError', expect.any(Error));
+    expect(mockStore.getters['i18n/t']).toHaveBeenCalledWith('nav.failWhale.resourceNotFound', { resource }, true);
+  });
+});

package/utils/alertmanagerconfig.js

@@ -19,8 +19,8 @@ export const fetchAlertManagerConfigSpecs = async($store) => {
   await schema.fetchResourceFields();
 
   return {
-    receiverSchema: schema.schemaDefinitions?.[`${ schema.schemaDefinition.id }.spec.receivers`],
-    routeSchema:    schema.schemaDefinitions?.[`${ schema.schemaDefinition.id }.spec.route`],
+    receiverSchema: schema.schemaDefinitions?.[`${ schema.schemaDefinition.type }.spec.receivers`],
+    routeSchema:    schema.schemaDefinitions?.[`${ schema.schemaDefinition.type }.spec.route`],
   };
 };
 

package/utils/auth.js

@@ -5,8 +5,6 @@ import {
 } from '@shell/config/query-params';
 import { MANAGEMENT, NORMAN } from '@shell/config/types';
 import { allHash } from '@shell/utils/promise';
-import { getProductFromRoute, getResourceFromRoute } from '@shell/utils/router';
-import { NAME as EXPLORER } from '@shell/config/product/explorer';
 import { findBy } from '@shell/utils/array';
 import { onExtensionsReady } from '@shell/utils/uiplugins';
 
@@ -201,6 +199,9 @@ export const checkPermissions = (types, getters) => {
   return allHash(hash);
 };
 
+/**
+ * Checks if the current user has access to the specified resource type
+ */
 export const canViewResource = (store, resource) => {
   // Note - don't use the current products store... because products can override stores for resources with `typeStoreMap`
   const inStore = store.getters['currentStore'](resource);
@@ -218,80 +219,6 @@ export const canViewResource = (store, resource) => {
   return !!validResource;
 };
 
-// ************************************************************
-//
-// BELOW ARE METHODS THAT ARE A PART OF THE AUTHENTICATED MIDDLEWARE REMOVAL. THIS IS A TEMPORARY HOME FOR THESE UTILS AND SHOULD BE REWRITTEN, MOVED OR DELETED.
-//
-// TODO: Remove and refactor everything below for more clarity and better organization. https://github.com/rancher/dashboard/issues/11111
-//
-// ************************************************************
-
-/**
- * Attempt to set the product in our datastore if the route matches a known product. Otherwise show an error page instead.
- */
-export function setProduct(store, to) {
-  let product = getProductFromRoute(to);
-
-  // since all products are hardcoded as routes (ex: c-local-explorer), if we match the wildcard route it means that the product does not exist
-  if ((product && (!to.matched.length || (to.matched.length && to.matched[0].path === '/c/:cluster/:product'))) ||
-  // if the product grabbed from the route is not registered, then we don't have it!
-  (product && !store.getters['type-map/isProductRegistered'](product))) {
-    const error = new Error(store.getters['i18n/t']('nav.failWhale.productNotFound', { productNotFound: product }, true));
-
-    return store.dispatch('loadingError', error);
-  }
-
-  if ( !product ) {
-    product = EXPLORER;
-  }
-
-  const oldProduct = store.getters['productId'];
-  const oldStore = store.getters['currentProduct']?.inStore;
-
-  if ( product !== oldProduct ) {
-    store.commit('setProduct', product);
-  }
-
-  const neuStore = store.getters['currentProduct']?.inStore;
-
-  if ( neuStore !== oldStore ) {
-    // If the product store changes, clear the catalog.
-    // There might be management catalog items in it vs cluster.
-    store.commit('catalog/reset');
-  }
-}
-
-/**
- * Check that the resource is valid, if not redirect to fail whale
- *
- * This requires that
- * - product is set
- * - product's store is set and setup (so we can check schema's within it)
- * - product's store has the schemaFor getter (extension stores might not have it)
- * - there's a resource associated with route (meta or param)
- */
-export function validateResource(store, to) {
-  const product = store.getters['currentProduct'];
-  const resource = getResourceFromRoute(to);
-
-  // In order to check a resource is valid we need these
-  if (!product || !resource) {
-    return false;
-  }
-
-  if (canViewResource(store, resource)) {
-    return false;
-  }
-
-  // Unknown resource, redirect to fail whale
-
-  const error = new Error(store.getters['i18n/t']('nav.failWhale.resourceNotFound', { resource }, true));
-
-  store.dispatch('loadingError', error);
-
-  throw error;
-}
-
 /**
  * Attempt to load the current user's principal
  */
@@ -336,7 +263,7 @@ export async function tryInitialSetup(store, password = 'admin') {
  */
 export async function isLoggedIn(store, userData) {
   store.commit('auth/hasAuth', true);
-  store.commit('auth/loggedInAs', userData.id);
+  store.dispatch('auth/loggedInAs', userData.id);
 
   // Init the notification center now that we know who the user is
   await store.dispatch('notifications/init', userData);

package/utils/product.ts

@@ -0,0 +1,39 @@
+import { getProductFromRoute } from '@shell/utils/router';
+import { NAME as EXPLORER } from '@shell/config/product/explorer';
+import { RouteLocation } from 'vue-router';
+import { Store } from 'vuex';
+
+/**
+ * Attempt to set the product in our datastore if the route matches a known product. Otherwise show an error page instead.
+ */
+export function setProduct(store: Store<any>, to: RouteLocation) {
+  let product = getProductFromRoute(to);
+
+  // since all products are hardcoded as routes (ex: c-local-explorer), if we match the wildcard route it means that the product does not exist
+  if ((product && (!to.matched.length || (to.matched.length && to.matched[0].path === '/c/:cluster/:product'))) ||
+  // if the product grabbed from the route is not registered, then we don't have it!
+  (product && !store.getters['type-map/isProductRegistered'](product))) {
+    const error = new Error(store.getters['i18n/t']('nav.failWhale.productNotFound', { productNotFound: product }, true));
+
+    return store.dispatch('loadingError', error);
+  }
+
+  if ( !product ) {
+    product = EXPLORER;
+  }
+
+  const oldProduct = store.getters['productId'];
+  const oldStore = store.getters['currentProduct']?.inStore;
+
+  if ( product !== oldProduct ) {
+    store.commit('setProduct', product);
+  }
+
+  const neuStore = store.getters['currentProduct']?.inStore;
+
+  if ( neuStore !== oldStore ) {
+    // If the product store changes, clear the catalog.
+    // There might be management catalog items in it vs cluster.
+    store.commit('catalog/reset');
+  }
+}

package/utils/resource.ts

@@ -0,0 +1,35 @@
+import { canViewResource } from '@shell/utils/auth';
+import { getResourceFromRoute } from '@shell/utils/router';
+import { RouteLocation } from 'vue-router';
+import { Store } from 'vuex';
+
+/**
+ * Check that the resource is valid, if not redirect to fail whale
+ *
+ * This requires that
+ * - product is set
+ * - product's store is set and setup (so we can check schema's within it)
+ * - product's store has the schemaFor getter (extension stores might not have it)
+ * - there's a resource associated with route (meta or param)
+ */
+export function validateResource(store: Store<any>, to: RouteLocation) {
+  const product = store.getters['currentProduct'];
+  const resource = getResourceFromRoute(to);
+
+  // In order to check a resource is valid we need these
+  if (!product || !resource) {
+    return false;
+  }
+
+  if (canViewResource(store, resource)) {
+    return false;
+  }
+
+  // Unknown resource, redirect to fail whale
+
+  const error = new Error(store.getters['i18n/t']('nav.failWhale.resourceNotFound', { resource }, true));
+
+  store.dispatch('loadingError', error);
+
+  throw error;
+}

package/utils/select.js

@@ -1,27 +1,3 @@
-export function onClickOption(option, e) {
-  if (!this.$attrs.multiple) {
-    return;
-  }
-
-  const getValue = (opt) => (this.optionKey ? this.get(opt, this.optionKey) : this.getOptionLabel(opt));
-  const optionValue = getValue(option);
-  const value = this.value || [];
-  const optionIndex = value.findIndex((option) => getValue(option) === optionValue);
-
-  if (optionIndex < 0) {
-    return;
-  }
-
-  this.value.splice(optionIndex, 1);
-
-  this.$emit('update:value', this.value);
-  e.preventDefault();
-  e.stopPropagation();
-
-  if (this.closeOnSelect) {
-    this.$refs['select-input'].closeSearchOptions();
-  }
-}
 
 // This is a simpler positionner for the dropdown for a select control
 // We used to use popper for these, but it does not suppotr fractional pixel placements which

package/utils/validators/formRules/__tests__/index.test.ts

@@ -114,6 +114,8 @@ describe('formRules', () => {
       ['git@github.com:rancher/dashboard/', undefined],
       ['git@github.com:rancher/%20dashboard/', undefined],
       ['git@github.com:rancher/dashboard/%20', undefined],
+      ['git@git.apps.local:fleet/fleet-local.git', undefined],
+      ['git@git.apps.local:33333/fleet/fleet-local.git', undefined],
 
       // Not valid HTTP(s)
       ['https://github.com/rancher/  dashboard.git', message],
@@ -140,6 +142,7 @@ describe('formRules', () => {
       ['git@githubcomrancher/dashboard', message],
       ['%20git@github.comrancher/dashboard', message],
       ['git@git%20hub.comrancher/dashboard', message],
+      ['git@git.apps.local:/fleet/fleet-local.git', message],
       ['git@.git', message],
       ['git@', message],
 

package/utils/validators/formRules/index.ts

@@ -191,6 +191,7 @@ export default function(
       protocol,
       authority,
       host,
+      port,
       path
     } = parse(url);
 
@@ -205,7 +206,7 @@ export default function(
     }
 
     // Test ssh, authority must be valid (SSH user + host)
-    if (!protocol && !authority.endsWith(':')) {
+    if (!protocol && !port && (!authority.endsWith(':') || path.startsWith('/'))) {
       return message;
     }
 

package/vue.config.js

@@ -546,7 +546,7 @@ module.exports = function(dir, appConfig = {}) {
       config.plugins.push(getVirtualModulesAutoImport(dir));
       config.plugins.push(getPackageImport(dir));
       config.plugins.push(createEnvVariablesPlugin(routerBasePath, rancherEnv));
-      config.plugins.push(new NodePolyfillPlugin()); // required from Webpack 5 to polyfill node modules
+      config.plugins.push(new NodePolyfillPlugin({ additionalAliases: ['process'] })); // required from Webpack 5 to polyfill node modules
 
       // The static assets need to be in the built assets directory in order to get served (primarily the favicon)
       config.plugins.push(new CopyWebpackPlugin({ patterns: [{ from: path.join(SHELL_ABS, 'static'), to: '.' }] }));

package/components/Resource/Detail/Metadata/Rectangle.vue

@@ -1,34 +0,0 @@
-<script setup lang="ts">
-export interface RectangleProps {
-    outline?: boolean;
-}
-
-const props = withDefaults(
-  defineProps<RectangleProps>(),
-  { outline: false }
-);
-
-</script>
-
-<template>
-  <div
-    class="rectangle"
-    :class="{outline: props.outline}"
-  >
-    <slot />
-  </div>
-</template>
-
-<style lang="scss" scoped>
-.rectangle {
-    border: 1px solid var(--tag-bg);
-    border-radius: 4px;
-    padding: 0 8px;
-    height: 23px;
-    line-height: 23px;
-
-    &:not(.outline) {
-        background-color: var(--tag-bg);
-    }
-}
-</style>

package/components/Resource/Detail/Metadata/__tests__/Rectangle.test.ts

@@ -1,24 +0,0 @@
-import { mount } from '@vue/test-utils';
-import Rectangle from '@shell/components/Resource/Detail/Metadata/Rectangle.vue';
-
-describe('component: Rectangle', () => {
-  it('should render container with class title and missing outline when passed outline:false', async() => {
-    const wrapper = mount(Rectangle, { props: { outline: false } });
-
-    expect(wrapper.find('.rectangle').exists()).toBeTruthy();
-    expect(wrapper.find('.rectangle.outline').exists()).toBeFalsy();
-  });
-
-  it('should render outline class when passed outline:true', async() => {
-    const wrapper = mount(Rectangle, { props: { outline: true } });
-
-    expect(wrapper.find('.rectangle.outline').exists()).toBeTruthy();
-  });
-
-  it('should render default slot', async() => {
-    const content = 'CONTENT';
-    const wrapper = mount(Rectangle, { slots: { default: content } });
-
-    expect(wrapper.find('.rectangle').element.innerHTML).toStrictEqual(content);
-  });
-});

package/components/ResourceDetail/Masthead/__tests__/legacy.test.ts

@@ -1,65 +0,0 @@
-import { mount, RouterLinkStub } from '@vue/test-utils';
-import { _VIEW } from '@shell/config/query-params';
-import Legacy from '@shell/components/ResourceDetail/Masthead/legacy.vue';
-import { createStore } from 'vuex';
-
-const mockedStore = () => {
-  return {
-    getters: {
-      currentStore:              () => 'current_store',
-      currentProduct:            { inStore: 'cluster' },
-      isExplorer:                false,
-      currentCluster:            {},
-      'type-map/labelFor':       jest.fn(),
-      'type-map/optionsFor':     jest.fn(),
-      'current_store/schemaFor': jest.fn(),
-    },
-  };
-};
-
-const requiredSetup = () => {
-  const store = createStore({ getters: { 'management/byId': () => jest.fn() } });
-
-  return {
-    stubs: {
-      'router-link': RouterLinkStub,
-      LiveDate:      true
-    },
-    provide: { store },
-    mocks:   { $store: mockedStore() }
-  };
-};
-
-describe('component: Masthead/legacy', () => {
-  it.each([
-    ['hidden', '', false, { displayName: 'admin', location: { id: 'resource-id' } }, false, false],
-    ['plain-text', 'admin', true, { displayName: 'admin', location: null }, false, true],
-    ['link', 'foo', true, { displayName: 'foo', location: { id: 'resource-id' } }, true, false],
-  ])('"Created By" should be %p, with text: %p', (
-    _,
-    text,
-    showCreatedBy,
-    createdBy,
-    showLink,
-    showPlainText,
-  ) => {
-    const wrapper = mount(Legacy, {
-      props: {
-        mode:  _VIEW,
-        value: {
-          showCreatedBy,
-          createdBy,
-        },
-      },
-      global: { ...requiredSetup() }
-    });
-
-    const container = wrapper.find('[data-testid="masthead-subheader-createdBy"]');
-    const link = wrapper.find('[data-testid="masthead-subheader-createdBy-link"]');
-    const plainText = wrapper.find('[data-testid="masthead-subheader-createdBy_plain-text"]');
-
-    expect(link.exists()).toBe(showLink);
-    expect(plainText.exists()).toBe(showPlainText);
-    expect(showLink || showPlainText ? container.element.textContent : '').toContain(text);
-  });
-});

package/utils/cookie-universal.js

@@ -1,10 +0,0 @@
-import cookieUniversal from 'cookie-universal';
-
-export default ({ req, res }, inject) => {
-  const options = {
-    alias:     'cookies',
-    parseJSON: true
-  };
-
-  inject(options.alias, cookieUniversal(req, res, options.parseJSON));
-};