@rancher/shell 0.3.10 → 0.3.12

package/components/formatter/ExtensionCache.vue

@@ -0,0 +1,74 @@
+<script>
+import { BadgeState } from '@components/BadgeState';
+import { stateDisplay } from '@shell/plugins/dashboard-store/resource-class';
+
+export default {
+  props: {
+    value: {
+      type:    String,
+      default: ''
+    }
+  },
+
+  components: { BadgeState },
+
+  data() {
+    const STATES = {
+      cached: {
+        color: 'info', icon: 'dot-open', label: 'Cached', compoundIcon: 'checkmark'
+      },
+      pending: {
+        color: 'warning', icon: 'tag', label: 'In Progress', compoundIcon: 'info'
+      },
+      disabled: {
+        color: 'error', icon: 'dot-half', label: 'Cache Disabled', compoundIcon: 'info'
+      },
+    };
+
+    return {
+      STATES,
+      stateDisplay:    '',
+      stateBackground: ''
+    };
+  },
+
+  watch: {
+    value: {
+      handler() {
+        const out = this.value || 'pending';
+        const color = this.colorForState(out);
+
+        this.stateDisplay = stateDisplay(out);
+        this.stateBackground = color.replace('text-', 'bg-');
+      },
+      immediate: true
+    }
+  },
+
+  methods: {
+    colorForState(state) {
+      const key = (state).toLowerCase();
+      let color;
+
+      if ( this.STATES[key] && this.STATES[key].color ) {
+        color = this.STATES[key].color;
+      }
+
+      if ( !color ) {
+        color = 'info';
+      }
+
+      return `text-${ color }`;
+    }
+  }
+};
+</script>
+
+<template>
+  <div>
+    <BadgeState
+      :color="stateBackground"
+      :label="stateDisplay"
+    />
+  </div>
+</template>

package/components/nav/Header.vue

@@ -478,6 +478,7 @@ export default {
 
           <button
             v-if="showKubeShell"
+            id="btn-kubectl"
             v-clean-tooltip="t('nav.shellShortcut', {key: shellShortcut})"
             v-shortkey="{windows: ['ctrl', '`'], mac: ['meta', '`']}"
             :disabled="!shellEnabled"

package/components/nav/WindowManager/ContainerShell.vue

@@ -61,6 +61,12 @@ export default {
       type:    String,
       default: null,
     },
+
+    // Runs this command immediately after connecting
+    commandOnFirstConnect: {
+      type:    String,
+      default: null
+    }
   },
 
   data() {
@@ -267,6 +273,10 @@ export default {
         this.isOpening = false;
         this.fit();
         this.flush();
+
+        if (this.commandOnFirstConnect) {
+          this.terminal.paste(`${ this.commandOnFirstConnect }`);
+        }
       });
 
       this.socket.addEventListener(EVENT_DISCONNECTED, (e) => {

package/components/nav/WindowManager/index.vue

@@ -307,6 +307,7 @@ export default {
 <template>
   <div
     id="windowmanager"
+    data-testid="windowmanager"
     class="windowmanager"
     :class="{[pinClass]: true}"
   >

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, RBAC_GROUPS, RBAC_USERS, RBAC_SERVICE_ACCOUNTS, ROLE,
+  DURATION, MESSAGE, REASON, LAST_SEEN_TIME, EVENT_TYPE, OBJECT, ROLE,
 } from '@shell/config/table-headers';
 
 import { DSL } from '@shell/store/type-map';
@@ -227,15 +227,6 @@ export function init(store) {
     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: [
       {

package/config/product/monitoring.js

@@ -79,7 +79,8 @@ export function init(store) {
           to:            { type: 'string' },
           send_resolved: { type: 'boolean' },
           from:          { type: 'string' },
-          smarthost:     { type: 'string' },
+          host:          { type: 'string' },
+          port:          { type: 'string' },
           require_tls:   { type: 'boolean' },
           auth_username: { type: 'string' },
           auth_password: { type: 'string' }

package/config/router.js

@@ -10,8 +10,8 @@ Vue.use(Router);
 
 export const routerOptions = {
   mode:                 'history',
-  // Note: router base comes from the VUE_APP_ROUTER_BASE env var
-  base:                 process.env.VUE_APP_ROUTER_BASE || '/',
+  // Note: router base comes from the ROUTER_BASE env var
+  base:                 process.env.routerBase || '/',
   linkActiveClass:      'nuxt-link-active',
   linkExactActiveClass: 'nuxt-link-exact-active',
   scrollBehavior,
@@ -230,7 +230,7 @@ export const routerOptions = {
     name:      'c-cluster-settings-brand'
   }, {
     path:      '/c/:cluster/settings/DefaultLinksEditor',
-    component: () => interopDefault(import('../pages/c/_cluster/settings/DefaultLinksEditor.vue' /* webpackChunkName: "shell/pages/c/_cluster/settings/DefaultLinksEditor" */)),
+    component: () => interopDefault(import('../pages/c/_cluster/settings/DefaultLinksEditor.vue' /* webpackChunkName: "pages/c/_cluster/settings/DefaultLinksEditor" */)),
     name:      'c-cluster-settings-DefaultLinksEditor'
   }, {
     path:      '/c/:cluster/settings/links',

package/config/table-headers.js

@@ -970,27 +970,35 @@ export const FLEET_BUNDLE_TYPE = {
   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),
-};
+export const UI_PLUGIN_CATALOG = [
+  {
+    name:          'state',
+    labelKey:      'tableHeaders.state',
+    sort:          ['stateSort', 'nameSort'],
+    value:         'state',
+    width:         100,
+    default:       'unknown',
+    formatter:     'BadgeStateFormatter',
+    formatterOpts: { arbitrary: true }
+  },
+  {
+    name:      'name',
+    labelKey:  'tableHeaders.name',
+    value:     'name',
+    sort:      ['nameSort'],
+    formatter: 'LinkDetail'
+  },
+  {
+    name:     'image',
+    sort:     ['image'],
+    labelKey: 'plugins.manageCatalog.headers.image.label',
+    value:    'deploymentImage'
+  },
+  {
+    name:      'cacheState',
+    sort:      ['cacheState'],
+    labelKey:  'plugins.manageCatalog.headers.cacheState.label',
+    value:     'cacheState',
+    formatter: 'ExtensionCache'
+  }
+];

package/config/uiplugins.js

@@ -38,6 +38,13 @@ export const UI_PLUGIN_CHART_ANNOTATIONS = {
   DISPLAY_NAME:       'catalog.cattle.io/display-name',
 };
 
+// Extension catalog labels
+export const UI_PLUGIN_LABELS = {
+  CATALOG_IMAGE: 'catalog.cattle.io/ui-extensions-catalog-image',
+  REPOSITORY:    'catalog.cattle.io/ui-extensions-repository',
+  CATALOG:       'catalog.cattle.io/ui-extensions-catalog'
+};
+
 // Plugin Metadata properties
 export const UI_PLUGIN_METADATA = {
   RANCHER_VERSION:   'rancherVersion',
@@ -99,6 +106,10 @@ export function shouldNotLoadPlugin(plugin, rancherVersion) {
     }
   }
 
+  if (plugin.metadata?.[UI_PLUGIN_LABELS.CATALOG]) {
+    return true;
+  }
+
   return false;
 }
 

package/config/workload.ts

@@ -0,0 +1 @@
+export const SEPARATOR = { separator: true };

package/core/types.ts

@@ -1,5 +1,5 @@
 import { ProductFunction } from './plugin';
-import { RouteConfig } from 'vue-router';
+import { RouteConfig, Location } from 'vue-router';
 
 // package.json metadata
 export interface PackageMetadata {
@@ -213,6 +213,11 @@ export interface ProductOptions {
    */
   weight?: number;
 
+  /**
+   * The route that the product will lead to if click on in navigation.
+   */
+  to?: Location;
+
   /**
    * Leaving these here for completeness but I don't think these should be advertised as useable to plugin creators.
    */
@@ -220,7 +225,6 @@ export interface ProductOptions {
   // removable: string;
   // showWorkspaceSwitcher: boolean;
   // supportRoute: string;
-  // to: string;
   // typeStoreMap: string;
 }
 
@@ -231,7 +235,12 @@ export interface HeaderOptions {
   name?: string;
 
   /**
-   * A translation key where the resulting string will show in the table column
+   * A string that will show in the table column as a header
+   */
+  label?: string;
+
+  /**
+   * A translation key where the resulting string will show in the table column as a header
    */
   labelKey?: string;
 
@@ -243,12 +252,13 @@ export interface HeaderOptions {
   /**
    * A string which represents the path to access the value from the row object which we'll use to sort i.e. `row.meta.value`
    */
-  sort?: string;
+  sort?: string | string[];
 
   /**
-   * A string which represents the path to access the value from the row object which we'll use to search i.e. `row.meta.value`
+   * A string which represents the path to access the value from the row object which we'll use to search i.e. `row.meta.value`.
+   * It can be false to disable searching on this field
    */
-  search?: string;
+  search?: string | boolean;
 
   /**
    * Number of pixels the column should be in the table
@@ -368,6 +378,14 @@ export interface DSLReturnType {
    */
   product: (options: ProductOptions) => void;
 
+  /**
+   * Create and label a group. The group will show up in navigation
+   * @param groupNane Name of the group
+   * @param label Label in navigation
+   * @returns {@link void}
+   */
+  mapGroup: (groupName: string, label: string) => void;
+
   /**
    * Leaving these here for completeness but I don't think these should be advertised as useable to plugin creators.
    */
@@ -376,7 +394,7 @@ export interface DSLReturnType {
   // hideBulkActions: (type: string, field)
   // ignoreGroup: (regexOrString)
   // ignoreType: (regexOrString)
-  // mapGroup: (match, replace)
+  //
   // mapType: (match, replace)
   // moveType: (match, group)
   // setGroupDefaultType: (input, defaultType)

package/creators/pkg/files/.github/workflows/build-container.yml

@@ -0,0 +1,64 @@
+name: Build and release container to registry
+
+on:
+  push:
+    branches:
+      - main
+
+env:
+  REGISTRY: ghcr.io
+  IMAGE_NAME: ${{ github.repository }}
+
+jobs:
+  build:
+    name: Build container image
+    if: github.ref == 'refs/heads/main' && github.event_name != 'pull_request'
+    runs-on: ubuntu-latest
+    permissions: write-all
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+
+      - name: Configure Git
+        run: |
+          git config user.name "${{ github.actor }}"
+          git config user.email "${{ github.actor }}@users.noreply.github.com"
+
+      - name: Login to GitHub Container Registry
+        uses: docker/login-action@v2
+        with:
+          registry: ${{ env.REGISTRY }}
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Setup Helm
+        uses: azure/setup-helm@v3
+        with:
+          version: v3.8.0
+
+      - name: Setup yq
+        uses: chrisdickinson/setup-yq@v1.0.1
+        with:
+          yq-version: v4.28.2
+
+      - name: Setup Nodejs and npm
+        uses: actions/setup-node@v3
+        with:
+          node-version: '16'
+
+      - name: Setup yarn
+        run: npm install -g yarn
+
+      - name: Setup Nodejs with yarn caching
+        uses: actions/setup-node@v3
+        with:
+          node-version: '16'
+          cache: yarn
+
+      - name: Install dependencies
+        run: yarn
+
+      - name: Build and push UI image
+        run: |
+          yarn publish-pkgs -cp -r ${{ env.REGISTRY }} -o ${{ github.repository_owner }}

package/creators/pkg/init

@@ -114,14 +114,21 @@ if (addWorkflowFolder) {
     fs.mkdirSync(workflowDir, { recursive: true });
   }
 
-  const workflowFile = path.join(workflowDir, 'build-extension.yml');
+  const files = [
+    'build-extension.yml',
+    'build-container.yml'
+  ];
 
-  if (!fs.existsSync(workflowFile)) {
-    const src = path.join(__dirname, 'files/.github/workflows', 'build-extension.yml');
+  files.forEach((fileName) => {
+    const file = path.join(workflowDir, fileName);
 
-    console.log(`  Adding file 'build-extension.yml' to root workflows`);
-    fs.copySync(src, workflowFile);
-  }
+    if (!fs.existsSync(file)) {
+      const src = path.join(__dirname, 'files/.github/workflows', fileName);
+
+      console.log(`  Adding file ${ fileName } to root workflows`);
+      fs.copySync(src, file);
+    }
+  });
 }
 
 // Copy base files

package/detail/helm.cattle.io.projecthelmchart.vue

@@ -43,8 +43,8 @@ export default {
       };
     },
     monitoringNamespace() {
-      // arbitrarily picking the alertmanagerURL here, they're all going to be the same.
-      return this.pullKeyFromUrl(this.relativeDashboardValues.alertmanagerURL, 'namespaces');
+      // picking the prometheusURL here, they're all going to be the same, but alertmanager and grafana can be deactivated
+      return this.pullKeyFromUrl(this.relativeDashboardValues.prometheusURL, 'namespaces');
     },
     alertServiceEndpoint() {
       return this.pullServiceEndpointFromUrl(this.relativeDashboardValues.alertmanagerURL);

package/detail/node.vue

@@ -116,7 +116,7 @@ export default {
       return null;
     },
     memoryUnits() {
-      const exponent = exponentNeeded(this.value.ramCapacity, 1024);
+      const exponent = exponentNeeded(this.value.ramReserved, 1024);
 
       return `${ UNITS[exponent] }iB`;
     },
@@ -231,7 +231,7 @@ export default {
       />
       <ConsumptionGauge
         :resource-name="t('node.detail.glance.consumptionGauge.memory')"
-        :capacity="value.ramCapacity"
+        :capacity="value.ramReserved"
         :used="value.ramUsage"
         :units="memoryUnits"
         :number-formatter="memoryFormatter"

package/detail/workload/index.vue

@@ -15,7 +15,7 @@ import V1WorkloadMetrics from '@shell/mixins/v1-workload-metrics';
 import { mapGetters } from 'vuex';
 import { allDashboardsExist } from '@shell/utils/grafana';
 import PlusMinus from '@shell/components/form/PlusMinus';
-import { matches } from '~shell/utils/selector';
+import { matches } from '@shell/utils/selector';
 
 const SCALABLE_TYPES = Object.values(SCALABLE_WORKLOAD_TYPES);
 const WORKLOAD_METRICS_DETAIL_URL = '/api/v1/namespaces/cattle-monitoring-system/services/http:rancher-monitoring-grafana:80/proxy/d/rancher-workload-pods-1/rancher-workload-pods?orgId=1';

package/edit/__tests__/management.cattle.io.setting.test.ts

@@ -2,7 +2,7 @@ import { mount } from '@vue/test-utils';
 import Settings from '@shell/edit/management.cattle.io.setting.vue';
 import { SETTING } from '@shell/config/settings';
 
-describe('management.cattle.io.setting should', () => {
+describe('view: management.cattle.io.setting should', () => {
   const requiredSetup = () => ({
     // Remove all these mocks after migration to Vue 2.7/3 due mixin logic
     mocks: {

package/edit/autoscaling.horizontalpodautoscaler/metric-target.vue

@@ -72,7 +72,6 @@ export default {
 
   watch: {
     resourceName(newRn, _oldRn) {
-      // debugger;
       const {
         value: { type: metricType },
         targetTypes,
@@ -93,7 +92,6 @@ export default {
     },
 
     'value.type'(targetType, oldType) {
-      // debugger;
       const { targetTypes, resourceName } = this;
       const toDelete = findBy(targetTypes, { value: oldType });
       const nue = findBy(targetTypes, { value: targetType });

package/edit/logging.banzaicloud.io.output/__tests__/logging.banzaicloud.io.output.test.ts

@@ -0,0 +1,43 @@
+import { mount } from '@vue/test-utils';
+import Banzai from '@shell/edit/logging.banzaicloud.io.output/index.vue';
+
+describe('view: logging.banzaicloud.io.output', () => {
+  it.each([
+    ['http://localhost:3100', []],
+    ['not a proper URL', ['logging.loki.urlInvalid']],
+  ])('should validate Loki URL on save', (url, expectation) => {
+    const wrapper = mount(Banzai, {
+      data:      () => ({ selectedProvider: 'loki' }),
+      propsData: {
+        value: {
+          save: jest.fn(),
+          spec: { loki: { url } }
+        }
+      },
+      mocks: {
+        $store: {
+          getters: {
+            currentStore:              () => 'current_store',
+            'management/schemaFor':    jest.fn(),
+            'current_store/all':       jest.fn(),
+            'current_store/schemaFor': jest.fn(),
+            'cluster/all':             jest.fn(),
+            'type-map/isSpoofed':      jest.fn(),
+            'i18n/t':                  jest.fn().mockImplementation((key: string) => key),
+            namespaces:                () => ({}),
+          }
+        },
+        $route: {
+          name:  'whatever',
+          query: { AS: '' }
+        },
+        $router: { replace: jest.fn() },
+      }
+    });
+    const fakeDone = jest.fn();
+
+    (wrapper.vm as any).saveSettings(fakeDone);
+
+    expect((wrapper.vm as any).errors).toStrictEqual(expectation);
+  });
+});

package/edit/logging.banzaicloud.io.output/index.vue

@@ -70,7 +70,7 @@ export default {
       // I'm manipulating the output since I'm not sure it's something we want to actually support
       // seeing as it's really createResourceYaml and this here is a gray area between spoofed types
       // and just a field within a spec.
-      bufferYaml = bufferYaml.substring(bufferYaml.indexOf('\n') + 1).replaceAll('#  ', '#');
+      bufferYaml = bufferYaml.substring(bufferYaml.indexOf('\n') + 1).replace(/# {2}/g, '#');
     }
 
     return {
@@ -78,7 +78,7 @@ export default {
       initialBufferYaml:            bufferYaml,
       providers,
       selectedProvider,
-      hasMultipleProvidersSelected: selectedProviders.length > 1,
+      hasMultipleProvidersSelected: selectedProviders?.length > 1,
       selectedProviders,
       LOGGING
     };
@@ -91,8 +91,11 @@ export default {
     enabledProviders() {
       return this.providers.filter(p => p.enabled);
     },
+    isNamespaced() {
+      return this.value.type !== LOGGING?.CLUSTER_OUTPUT;
+    },
     cruMode() {
-      if (this.selectedProviders.length > 1 || !this.value.allProvidersSupported) {
+      if (this.hasMultipleProvidersSelected || !this.value.allProvidersSupported) {
         return _VIEW;
       }
 
@@ -173,10 +176,10 @@ export default {
         :mode="mode"
         label="generic.name"
         :register-before-hook="registerBeforeHook"
-        :namespaced="value.type !== LOGGING.CLUSTER_OUTPUT"
+        :namespaced="isNamespaced"
       />
       <Banner
-        v-if="selectedProviders.length > 1"
+        v-if="hasMultipleProvidersSelected"
         color="info"
       >
         This output is configured with multiple providers. We currently only support a single provider per output. You can view or edit the YAML.

package/edit/logging.banzaicloud.io.output/providers/__tests__/loki.test.ts

@@ -0,0 +1,13 @@
+import { shallowMount } from '@vue/test-utils';
+import Loki from '@shell/edit/logging.banzaicloud.io.output/providers/loki.vue';
+
+describe('component: Loki', () => {
+  it('should display URL placeholder', () => {
+    const wrapper = shallowMount(Loki, { propsData: { mode: 'edit', namespace: 'whatever' } });
+    const url = 'https://127.0.0.1:8000';
+
+    const placeholder = wrapper.find('[data-testid="loki-url"]').attributes('placeholder');
+
+    expect(placeholder).toBe(url);
+  });
+});

package/edit/logging.banzaicloud.io.output/providers/loki.vue

@@ -48,6 +48,7 @@ export default {
           :disabled="disabled"
           class="url"
           placeholder="https://127.0.0.1:8000"
+          data-testid="loki-url"
           :label="t('logging.loki.url')"
         />
       </div>

package/edit/monitoring.coreos.com.alertmanagerconfig/receiverConfig.vue

@@ -122,8 +122,6 @@ export default {
      */
     const receiverSchema = this.$store.getters['cluster/schemaFor'](MONITORING.SPOOFED.ALERTMANAGERCONFIG_RECEIVER_SPEC);
 
-    // debugger;
-
     if (!receiverSchema) {
       throw new Error("Can't render the form because the AlertmanagerConfig schema is not loaded yet.");
     }