@rancher/shell 0.3.5 → 0.3.7

package/components/form/WorkloadPorts.vue

@@ -276,7 +276,7 @@ export default {
         'show-ipam': showIpam,
       }"
     >
-      <div class="service-type col">
+      <div class="service-type">
         <LabeledSelect
           v-model="row._serviceType"
           :mode="mode"
@@ -444,7 +444,7 @@ $checkbox: 75;
 }
 .ports-headers, .ports-row{
   display: grid;
-  grid-template-columns: 20% 32% 145px 90px .5fr .5fr;
+  grid-template-columns: 28% 28% 15% 10% 75px 0.5fr;
   grid-column-gap: $column-gutter;
   margin-bottom: 10px;
   align-items: center;

package/components/form/__tests__/NameNsDescription.ts

@@ -29,4 +29,31 @@ describe('component: NameNsDescription', () => {
 
     expect((wrapper.vm as any).options).toStrictEqual(result);
   });
+
+  it('should emit in case of new namespace', () => {
+    const namespaceName = 'test';
+    const newNamespaceName = 'bananas';
+    const wrapper = mount(NameNsDescription, {
+      propsData: {
+        value: { metadata: {} },
+        mode:  'create',
+      },
+      mocks: {
+        $store: {
+          getters: {
+            namespaces:          jest.fn(),
+            allowedNamespaces:   () => ({ [namespaceName]: true }),
+            currentStore:        () => 'cluster',
+            'cluster/schemaFor': jest.fn(),
+            'i18n/t':            jest.fn()
+          },
+        },
+        $refs: { name: { focus: jest.fn() } }
+      }
+    });
+
+    (wrapper.vm as any).updateNamespace(newNamespaceName);
+
+    expect(wrapper.emitted().isNamespaceNew?.[0][0]).toBe(true);
+  });
 });

package/components/formatter/WorkloadHealthScale.vue

@@ -2,10 +2,11 @@
 import Vue from 'vue';
 import ProgressBarMulti from '@shell/components/ProgressBarMulti';
 import PlusMinus from '@shell/components/form/PlusMinus';
-import { SCALABLE_WORKLOAD_TYPES } from '@shell/config/types';
+import { POD, SCALABLE_WORKLOAD_TYPES } from '@shell/config/types';
 import { ucFirst } from '@shell/utils/string';
 
 const SCALABLE_TYPES = Object.values(SCALABLE_WORKLOAD_TYPES);
+const INVALID_TYPES = [POD];
 
 export default {
   components: { PlusMinus, ProgressBarMulti },
@@ -47,6 +48,10 @@ export default {
       return !!SCALABLE_TYPES.includes(this.row.type) && this.row.canUpdate;
     },
 
+    canShow() {
+      return !INVALID_TYPES.includes(this.row.type);
+    },
+
     parts() {
       return this.cParts;
     },
@@ -162,8 +167,9 @@ export default {
 </script>
 
 <template>
+  <div v-if="!canShow" />
   <div
-    v-if="loading"
+    v-else-if="loading"
     class="hs-popover__loader"
   >
     <i class="icon icon-spinner" />

package/components/nav/NamespaceFilter.vue

@@ -953,6 +953,14 @@ export default {
                 color: var(--dropdown-hover-bg);
               }
             }
+
+            &:focus {
+              .ns-item {
+                > * {
+                  color: var(--dropdown-hover-text);
+                }
+              }
+            }
           }
         }
 

package/{nuxt/components → components/nuxt}/nuxt.js

@@ -1,5 +1,5 @@
 import Vue from 'vue'
-import { compile } from '../utils'
+import { compile } from '../../utils/nuxt'
 
 import NuxtError from '../../layouts/error.vue'
 

package/{nuxt → config}/middleware.js

@@ -1,12 +1,12 @@
-const middleware = {}
+const middleware = {};
 
-middleware['authenticated'] = require('../middleware/authenticated.js')
-middleware['authenticated'] = middleware['authenticated'].default || middleware['authenticated']
+middleware['authenticated'] = require('../middleware/authenticated.js');
+middleware['authenticated'] = middleware['authenticated'].default || middleware['authenticated'];
 
-middleware['i18n'] = require('../middleware/i18n.js')
-middleware['i18n'] = middleware['i18n'].default || middleware['i18n']
+middleware['i18n'] = require('../middleware/i18n.js');
+middleware['i18n'] = middleware['i18n'].default || middleware['i18n'];
 
-middleware['unauthenticated'] = require('../middleware/unauthenticated.js')
-middleware['unauthenticated'] = middleware['unauthenticated'].default || middleware['unauthenticated']
+middleware['unauthenticated'] = require('../middleware/unauthenticated.js');
+middleware['unauthenticated'] = middleware['unauthenticated'].default || middleware['unauthenticated'];
 
-export default middleware
+export default middleware;

package/config/product/explorer.js

@@ -18,7 +18,7 @@ import {
   STORAGE_CLASS_PROVISIONER, PERSISTENT_VOLUME_SOURCE,
   HPA_REFERENCE, MIN_REPLICA, MAX_REPLICA, CURRENT_REPLICA,
   ACCESS_KEY, DESCRIPTION, EXPIRES, EXPIRY_STATE, SUB_TYPE, AGE_NORMAN, SCOPE_NORMAN, PERSISTENT_VOLUME_CLAIM, RECLAIM_POLICY, PV_REASON, WORKLOAD_HEALTH_SCALE, POD_RESTARTS,
-  DURATION, MESSAGE, REASON, LAST_SEEN_TIME, EVENT_TYPE, OBJECT,
+  DURATION, MESSAGE, REASON, LAST_SEEN_TIME, EVENT_TYPE, OBJECT, RBAC_GROUPS, RBAC_USERS, RBAC_SERVICE_ACCOUNTS, ROLE,
 } from '@shell/config/table-headers';
 
 import { DSL } from '@shell/store/type-map';
@@ -157,9 +157,9 @@ export function init(store) {
     listGroups: [
       {
         icon:       'icon-cluster',
-        value:      'node',
+        value:      'role',
         field:      'groupByNode',
-        hideColumn: NODE_COL.name,
+        hideColumn: 'groupByNode',
         tooltipKey: 'resourceTable.groupBy.node'
       }
     ]
@@ -224,9 +224,30 @@ export function init(store) {
   headers(RBAC.CLUSTER_ROLE, [
     STATE,
     NAME_COL,
+    AGE,
+  ]);
+
+  headers(RBAC.CLUSTER_ROLE_BINDING, [
+    STATE,
+    NAME_COL,
+    RBAC_GROUPS,
+    RBAC_USERS,
+    RBAC_SERVICE_ACCOUNTS, // groupname //roles // users// service accounts
     AGE
   ]);
 
+  configureType(MANAGEMENT.CLUSTER_ROLE_TEMPLATE_BINDING, {
+    listGroups: [
+      {
+        icon:       'icon-role-binding',
+        value:      'node',
+        field:      'roleDisplay',
+        hideColumn: ROLE.name,
+        tooltipKey: 'resourceTable.groupBy.role'
+      }
+    ]
+  });
+
   headers(MANAGEMENT.USER, [
     STATE,
     USER_ID,

package/config/query-params.js

@@ -73,3 +73,4 @@ export const CLOUD_CREDENTIAL = 'cloud';
 
 // NAMESPACE/PROJECT
 export const PROJECT_ID = 'projectId';
+export const FLAT_VIEW = 'flatView';

package/config/router.js

@@ -1,7 +1,7 @@
 import Vue from 'vue';
 import Router from 'vue-router';
 import { normalizeURL } from 'ufo';
-import { interopDefault } from '../nuxt/utils';
+import { interopDefault } from '../utils/nuxt';
 import scrollBehavior from '../utils/router.scrollBehavior.js';
 
 const emptyFn = () => {};

package/{nuxt → config}/store.js

@@ -1,41 +1,41 @@
-import Vue from 'vue'
-import Vuex from 'vuex'
+import Vue from 'vue';
+import Vuex from 'vuex';
 
-Vue.use(Vuex)
+Vue.use(Vuex);
 
-const VUEX_PROPERTIES = ['state', 'getters', 'actions', 'mutations']
+const VUEX_PROPERTIES = ['state', 'getters', 'actions', 'mutations'];
 
 let store = {};
 
-(function updateModules () {
-  store = normalizeRoot(require('../store/index.js'), 'store/index.js')
+(function updateModules() {
+  store = normalizeRoot(require('../store/index.js'), 'store/index.js');
 
   // If store is an exported method = classic mode (deprecated)
 
   if (typeof store === 'function') {
-    return console.warn('Classic mode for store/ is deprecated and will be removed in Nuxt 3.')
+    return console.warn('Classic mode for store/ is deprecated and will be removed in Nuxt 3.'); // eslint-disable-line no-console
   }
 
   // Enforce store modules
-  store.modules = store.modules || {}
-
-  resolveStoreModules(require('../store/action-menu.js'), 'action-menu.js')
-  resolveStoreModules(require('../store/auth.js'), 'auth.js')
-  resolveStoreModules(require('../store/aws.js'), 'aws.js')
-  resolveStoreModules(require('../store/catalog.js'), 'catalog.js')
-  resolveStoreModules(require('../store/digitalocean.js'), 'digitalocean.js')
-  resolveStoreModules(require('../store/features.js'), 'features.js')
-  resolveStoreModules(require('../store/github.js'), 'github.js')
-  resolveStoreModules(require('../store/growl.js'), 'growl.js')
-  resolveStoreModules(require('../store/i18n.js'), 'i18n.js')
-  resolveStoreModules(require('../store/linode.js'), 'linode.js')
-  resolveStoreModules(require('../store/plugins.js'), 'plugins.js')
-  resolveStoreModules(require('../store/pnap.js'), 'pnap.js')
-  resolveStoreModules(require('../store/prefs.js'), 'prefs.js')
-  resolveStoreModules(require('../store/resource-fetch.js'), 'resource-fetch.js')
-  resolveStoreModules(require('../store/type-map.js'), 'type-map.js')
-  resolveStoreModules(require('../store/uiplugins.ts'), 'uiplugins.ts')
-  resolveStoreModules(require('../store/wm.js'), 'wm.js')
+  store.modules = store.modules || {};
+
+  resolveStoreModules(require('../store/action-menu.js'), 'action-menu.js');
+  resolveStoreModules(require('../store/auth.js'), 'auth.js');
+  resolveStoreModules(require('../store/aws.js'), 'aws.js');
+  resolveStoreModules(require('../store/catalog.js'), 'catalog.js');
+  resolveStoreModules(require('../store/digitalocean.js'), 'digitalocean.js');
+  resolveStoreModules(require('../store/features.js'), 'features.js');
+  resolveStoreModules(require('../store/github.js'), 'github.js');
+  resolveStoreModules(require('../store/growl.js'), 'growl.js');
+  resolveStoreModules(require('../store/i18n.js'), 'i18n.js');
+  resolveStoreModules(require('../store/linode.js'), 'linode.js');
+  resolveStoreModules(require('../store/plugins.js'), 'plugins.js');
+  resolveStoreModules(require('../store/pnap.js'), 'pnap.js');
+  resolveStoreModules(require('../store/prefs.js'), 'prefs.js');
+  resolveStoreModules(require('../store/resource-fetch.js'), 'resource-fetch.js');
+  resolveStoreModules(require('../store/type-map.js'), 'type-map.js');
+  resolveStoreModules(require('../store/uiplugins.ts'), 'uiplugins.ts');
+  resolveStoreModules(require('../store/wm.js'), 'wm.js');
 
   // If the environment supports hot reloading...
 
@@ -62,117 +62,120 @@ let store = {};
       '../store/wm.js',
     ], () => {
       // Update `root.modules` with the latest definitions.
-      updateModules()
+      updateModules();
       // Trigger a hot update in the store.
-      window.$nuxt.$store.hotUpdate(store)
-    })
+      window.$nuxt.$store.hotUpdate(store);
+    });
   }
-})()
+})();
 
 // createStore
 export const createStore = store instanceof Function ? store : () => {
-  return new Vuex.Store(Object.assign({
-    strict: (process.env.NODE_ENV !== 'production')
-  }, store))
-}
+  return new Vuex.Store(Object.assign({ strict: (process.env.NODE_ENV !== 'production') }, store));
+};
 
-function normalizeRoot (moduleData, filePath) {
-  moduleData = moduleData.default || moduleData
+function normalizeRoot(moduleData, filePath) {
+  moduleData = moduleData.default || moduleData;
 
   if (moduleData.commit) {
-    throw new Error(`[nuxt] ${filePath} should export a method that returns a Vuex instance.`)
+    throw new Error(`[nuxt] ${ filePath } should export a method that returns a Vuex instance.`);
   }
 
   if (typeof moduleData !== 'function') {
     // Avoid TypeError: setting a property that has only a getter when overwriting top level keys
-    moduleData = Object.assign({}, moduleData)
+    moduleData = Object.assign({}, moduleData);
   }
-  return normalizeModule(moduleData, filePath)
+
+  return normalizeModule(moduleData, filePath);
 }
 
-function normalizeModule (moduleData, filePath) {
+function normalizeModule(moduleData, filePath) {
   if (moduleData.state && typeof moduleData.state !== 'function') {
-    console.warn(`'state' should be a method that returns an object in ${filePath}`)
+    console.warn(`'state' should be a method that returns an object in ${ filePath }`); // eslint-disable-line no-console
+
+    const state = Object.assign({}, moduleData.state);
 
-    const state = Object.assign({}, moduleData.state)
     // Avoid TypeError: setting a property that has only a getter when overwriting top level keys
-    moduleData = Object.assign({}, moduleData, { state: () => state })
+    moduleData = Object.assign({}, moduleData, { state: () => state });
   }
-  return moduleData
+
+  return moduleData;
 }
 
-function resolveStoreModules (moduleData, filename) {
-  moduleData = moduleData.default || moduleData
+function resolveStoreModules(moduleData, filename) {
+  moduleData = moduleData.default || moduleData;
   // Remove store src + extension (./foo/index.js -> foo/index)
-  const namespace = filename.replace(/\.(js|mjs|ts)$/, '')
-  const namespaces = namespace.split('/')
-  let moduleName = namespaces[namespaces.length - 1]
-  const filePath = `store/${filename}`
+  const namespace = filename.replace(/\.(js|mjs|ts)$/, '');
+  const namespaces = namespace.split('/');
+  let moduleName = namespaces[namespaces.length - 1];
+  const filePath = `store/${ filename }`;
 
-  moduleData = moduleName === 'state'
-    ? normalizeState(moduleData, filePath)
-    : normalizeModule(moduleData, filePath)
+  moduleData = moduleName === 'state' ? normalizeState(moduleData, filePath) : normalizeModule(moduleData, filePath);
 
   // If src is a known Vuex property
   if (VUEX_PROPERTIES.includes(moduleName)) {
-    const property = moduleName
-    const propertyStoreModule = getStoreModule(store, namespaces, { isProperty: true })
+    const property = moduleName;
+    const propertyStoreModule = getStoreModule(store, namespaces, { isProperty: true });
 
     // Replace state since it's a function
-    mergeProperty(propertyStoreModule, moduleData, property)
-    return
+    mergeProperty(propertyStoreModule, moduleData, property);
+
+    return;
   }
 
   // If file is foo/index.js, it should be saved as foo
-  const isIndexModule = (moduleName === 'index')
+  const isIndexModule = (moduleName === 'index');
+
   if (isIndexModule) {
-    namespaces.pop()
-    moduleName = namespaces[namespaces.length - 1]
+    namespaces.pop();
+    moduleName = namespaces[namespaces.length - 1];
   }
 
-  const storeModule = getStoreModule(store, namespaces)
+  const storeModule = getStoreModule(store, namespaces);
 
   for (const property of VUEX_PROPERTIES) {
-    mergeProperty(storeModule, moduleData[property], property)
+    mergeProperty(storeModule, moduleData[property], property);
   }
 
   if (moduleData.namespaced === false) {
-    delete storeModule.namespaced
+    delete storeModule.namespaced;
   }
 }
 
-function normalizeState (moduleData, filePath) {
+function normalizeState(moduleData, filePath) {
   if (typeof moduleData !== 'function') {
-    console.warn(`${filePath} should export a method that returns an object`)
-    const state = Object.assign({}, moduleData)
-    return () => state
+    console.warn(`${ filePath } should export a method that returns an object`); // eslint-disable-line no-console
+    const state = Object.assign({}, moduleData);
+
+    return () => state;
   }
-  return normalizeModule(moduleData, filePath)
+
+  return normalizeModule(moduleData, filePath);
 }
 
-function getStoreModule (storeModule, namespaces, { isProperty = false } = {}) {
+function getStoreModule(storeModule, namespaces, { isProperty = false } = {}) {
   // If ./mutations.js
   if (!namespaces.length || (isProperty && namespaces.length === 1)) {
-    return storeModule
+    return storeModule;
   }
 
-  const namespace = namespaces.shift()
+  const namespace = namespaces.shift();
 
-  storeModule.modules[namespace] = storeModule.modules[namespace] || {}
-  storeModule.modules[namespace].namespaced = true
-  storeModule.modules[namespace].modules = storeModule.modules[namespace].modules || {}
+  storeModule.modules[namespace] = storeModule.modules[namespace] || {};
+  storeModule.modules[namespace].namespaced = true;
+  storeModule.modules[namespace].modules = storeModule.modules[namespace].modules || {};
 
-  return getStoreModule(storeModule.modules[namespace], namespaces, { isProperty })
+  return getStoreModule(storeModule.modules[namespace], namespaces, { isProperty });
 }
 
-function mergeProperty (storeModule, moduleData, property) {
+function mergeProperty(storeModule, moduleData, property) {
   if (!moduleData) {
-    return
+    return;
   }
 
   if (property === 'state') {
-    storeModule.state = moduleData || storeModule.state
+    storeModule.state = moduleData || storeModule.state;
   } else {
-    storeModule[property] = Object.assign({}, storeModule[property], moduleData)
+    storeModule[property] = Object.assign({}, storeModule[property], moduleData);
   }
 }

package/config/table-headers.js

@@ -718,7 +718,7 @@ export const APP_SUMMARY = {
 
 export const CONSTRAINT_VIOLATION_CONSTRAINT_LINK = {
   name:          'Constraint',
-  label:         'Constraint',
+  labelKey:      'tableHeaders.constraint',
   value:         'constraintLink',
   sort:          `constraintLink.text`,
   formatter:     'Link',
@@ -727,30 +727,39 @@ export const CONSTRAINT_VIOLATION_CONSTRAINT_LINK = {
 
 export const CONSTRAINT_VIOLATION_RESOURCE_LINK = {
   name:          'Name',
-  label:         'Name',
+  labelKey:      'tableHeaders.name',
   value:         'resourceLink',
   sort:          `resourceLink.text`,
+  search:        `resourceLink.text`,
   formatter:     'Link',
   formatterOpts: { options: { internal: true } },
 };
 
 export const CONSTRAINT_VIOLATION_TYPE = {
-  name:  'Type',
-  label: 'Type',
-  value: `kind`,
-  sort:  `kind`
+  name:     'Type',
+  labelKey: 'tableHeaders.type',
+  value:    `kind`,
+  sort:     `kind`
+};
+
+export const CONSTRAINT_VIOLATION_NAMESPACE = {
+  name:     'Namespace',
+  labelKey: 'tableHeaders.namespace',
+  value:    `namespace`,
+  sort:     `namespace`,
+  search:   `namespace`,
 };
 
 export const CONSTRAINT_VIOLATION_MESSAGE = {
-  name:  'Message',
-  label: 'Message',
-  value: `message`,
-  sort:  `message`
+  name:     'Message',
+  labelKey: 'tableHeaders.message',
+  value:    `message`,
+  sort:     `message`
 };
 
 export const CONSTRAINT_VIOLATION_TEMPLATE_LINK = {
   name:          'TemplateLink',
-  label:         'Template',
+  labelKey:      'tableHeaders.template',
   value:         `templateLink`,
   sort:          `templateLink.text`,
   formatter:     'Link',
@@ -759,7 +768,7 @@ export const CONSTRAINT_VIOLATION_TEMPLATE_LINK = {
 
 export const CONSTRAINT_VIOLATION_COUNT = {
   name:          'Count',
-  label:         'Count',
+  labelKey:      'tableHeaders.count',
   value:         `count`,
   sort:          `count`,
   formatter:     'QualityText',
@@ -960,3 +969,28 @@ export const FLEET_BUNDLE_TYPE = {
   sort:     ['bundleType'],
   width:    100,
 };
+
+// export const RBAC_ROLE = {
+//   name:  'role',
+//   value: 'roleRef.name',
+//   sort:  ['roleRef.name'],
+// };
+
+export const RBAC_USERS = {
+  name:     'users',
+  sort:     ['users'],
+  getValue: row => row.users?.map(({ name }) => name),
+};
+
+export const RBAC_GROUPS = {
+  name: 'groups',
+  sort: ['groups'],
+
+  getValue: row => row.groups?.map(({ name }) => name),
+};
+
+export const RBAC_SERVICE_ACCOUNTS = {
+  name:     'serviceAccount',
+  sort:     ['serviceAccount'],
+  getValue: row => row.serviceAccounts?.map(({ name }) => name),
+};

package/config/types.js

@@ -66,6 +66,8 @@ export const STORAGE_CLASS = 'storage.k8s.io.storageclass';
 export const CSI_DRIVER = 'storage.k8s.io.csidriver';
 export const OBJECT_META = 'io.k8s.apimachinery.pkg.apis.meta.v1.ObjectMeta';
 export const NETWORK_ATTACHMENT = 'k8s.cni.cncf.io.networkattachmentdefinition';
+export const USER = 'user';
+export const GROUP = 'group';
 
 export const RBAC = {
   ROLE:                 'rbac.authorization.k8s.io.role',
@@ -93,6 +95,11 @@ const {
 
 export const SCALABLE_WORKLOAD_TYPES = scalableWorkloads;
 
+export const LIST_WORKLOAD_TYPES = {
+  ...WORKLOAD_TYPES,
+  POD
+};
+
 export const METRIC = {
   NODE: 'metrics.k8s.io.nodemetrics',
   POD:  'metrics.k8s.io.podmetrics',

package/core/plugin.ts

@@ -16,13 +16,15 @@ import {
   PluginRouteConfig, RegisterStore, UnregisterStore, CoreStoreSpecifics, CoreStoreConfig, OnNavToPackage, OnNavAwayFromPackage, OnLogOut
 } from '@shell/core/types';
 
+export type ProductFunction = (plugin: IPlugin, store: any) => void;
+
 export class Plugin implements IPlugin {
   public id: string;
   public name: string;
   public types: any = {};
   public l10n: { [key: string]: Function[] } = {};
   public locales: { locale: string, label: string}[] = [];
-  public products: Function[] = [];
+  public products: ProductFunction[] = [];
   public productNames: string[] = [];
   public routes: { parent?: string, route: RouteConfig }[] = [];
   public stores: { storeName: string, register: RegisterStore, unregister: UnregisterStore }[] = [];
@@ -83,7 +85,7 @@ export class Plugin implements IPlugin {
     return storeDSL;
   }
 
-  addProduct(product: Function): void {
+  addProduct(product: ProductFunction): void {
     this.products.push(product);
   }