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

package/components/__tests__/ButtonGroup.test.ts

@@ -118,4 +118,60 @@ describe('component: ButtonGroup', () => {
     expect(wrapper.emitted('update:value')).toHaveLength(1);
     expect(wrapper.emitted('update:value')![0][0]).toBe('val1');
   });
+
+  it.each([
+    ['small', 'btn-sm'],
+    ['medium', 'btn-md'],
+  ])('should apply the size class to each button when size is %s', (size, sizeClass) => {
+    const options = [
+      {
+        label: 'label1',
+        value: 'val1'
+      },
+      {
+        label: 'label2',
+        value: 'val2'
+      },
+    ];
+
+    const wrapper = shallowMount(ButtonGroup, {
+      props: {
+        options,
+        value: 'val1',
+        size
+      }
+    });
+
+    const buttons = wrapper.findAll('button');
+
+    expect(buttons).toHaveLength(2);
+    buttons.forEach((button) => {
+      expect(button.classes()).toContain(sizeClass);
+    });
+  });
+
+  it.each([
+    [undefined],
+    ['large'],
+  ])('should not apply a size class when size is %s', (size) => {
+    const options = [
+      {
+        label: 'label1',
+        value: 'val1'
+      },
+    ];
+
+    const wrapper = shallowMount(ButtonGroup, {
+      props: {
+        options,
+        value: 'val1',
+        ...(size ? { size } : {})
+      }
+    });
+
+    const button = wrapper.find('button');
+
+    expect(button.classes()).not.toContain('btn-sm');
+    expect(button.classes()).not.toContain('btn-md');
+  });
 });

package/components/__tests__/PromptRestore.test.ts

@@ -4,36 +4,46 @@ import PromptRestore from '@shell/components/PromptRestore.vue';
 import { createStore } from 'vuex';
 import { ExtendedVue, Vue } from 'vue/types/vue';
 import { DefaultProps } from 'vue/types/options';
-import { CAPI } from '@shell/config/types';
+import { CAPI, MANAGEMENT, OPERATION, SNAPSHOT } from '@shell/config/types';
 import { STATES_ENUM } from '@shell/plugins/dashboard-store/resource-class';
+import { createOperationCR } from '@shell/utils/operation-cr';
+
+jest.mock('@shell/utils/operation-cr', () => ({ createOperationCR: jest.fn() }));
 
 const RKE2_CLUSTER_NAME = 'rke2_cluster_name';
 const RKE2_SUCCESSFUL_SNAPSHOT_1 = {
-  clusterName:  RKE2_CLUSTER_NAME,
-  type:         CAPI.RANCHER_CLUSTER,
-  created:      'Thu Jul 20 2023 11:11:39',
-  snapshotFile: { status: STATES_ENUM.SUCCESSFUL },
-  id:           'rke2_id_1',
-  name:         'rke2_name_1'
+  clusterName:    RKE2_CLUSTER_NAME,
+  type:           CAPI.RANCHER_CLUSTER,
+  created:        'Thu Jul 20 2023 11:11:39',
+  restoreEnabled: true,
+  snapshotFile:   { status: STATES_ENUM.SUCCESSFUL },
+  id:             'rke2_id_1',
+  name:           'rke2_name_1'
 };
 const RKE2_SUCCESSFUL_SNAPSHOT_2 = {
-  clusterName:  RKE2_CLUSTER_NAME,
-  type:         CAPI.RANCHER_CLUSTER,
-  created:      'Thu Jul 20 2022 11:11:39',
-  snapshotFile: { status: STATES_ENUM.SUCCESSFUL },
-  id:           'rke2_id_2',
-  name:         'rke2_name_2'
+  clusterName:    RKE2_CLUSTER_NAME,
+  type:           CAPI.RANCHER_CLUSTER,
+  created:        'Thu Jul 20 2022 11:11:39',
+  restoreEnabled: true,
+  snapshotFile:   { status: STATES_ENUM.SUCCESSFUL },
+  id:             'rke2_id_2',
+  name:           'rke2_name_2'
 };
 const RKE2_FAILED_SNAPSHOT = {
-  clusterName:  RKE2_CLUSTER_NAME,
-  type:         CAPI.RANCHER_CLUSTER,
-  created:      'Thu Jul 20 2021 11:11:39',
-  snapshotFile: { status: STATES_ENUM.FAILED },
-  id:           'rke2_id_3',
-  name:         'rke2_name_3'
+  clusterName:    RKE2_CLUSTER_NAME,
+  type:           CAPI.RANCHER_CLUSTER,
+  created:        'Thu Jul 20 2021 11:11:39',
+  restoreEnabled: false,
+  snapshotFile:   { status: STATES_ENUM.FAILED },
+  id:             'rke2_id_3',
+  name:           'rke2_name_3'
 };
 
 describe('component: PromptRestore', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
   const rke2TestCases = [
     [[], 0],
     [[RKE2_FAILED_SNAPSHOT], 0],
@@ -72,4 +82,144 @@ describe('component: PromptRestore', () => {
 
     expect(wrapper.vm.clusterSnapshots).toHaveLength(expected);
   });
+
+  it('should restore imported cluster via operation CR', async() => {
+    (createOperationCR as jest.Mock).mockResolvedValue(undefined);
+    const clusterSave = jest.fn();
+    const buttonDone = jest.fn();
+
+    const importedCluster = {
+      isImported:              true,
+      isImportedWithDayTwoOps: true,
+      type:                    CAPI.RANCHER_CLUSTER,
+      metadata:                { name: 'imported-cluster' },
+      mgmt:                    { id: 'c-m-imported' },
+      save:                    clusterSave,
+    };
+
+    const getters: any = {};
+
+    getters['i18n/t'] = () => (key: string) => key;
+
+    const store = createStore({
+      modules: {
+        'action-menu': {
+          namespaced: true,
+          state:      {
+            showPromptRestore: true,
+            toRestore:         [importedCluster]
+          },
+          mutations: { togglePromptRestore: jest.fn() }
+        },
+      },
+      getters,
+      actions: {
+        'management/findAll': jest.fn().mockResolvedValue([]),
+        'growl/success':      jest.fn(),
+      }
+    });
+
+    const wrapper = shallowMount(
+      PromptRestore as unknown as ExtendedVue<Vue, {}, {}, {}, DefaultProps>,
+      { global: { mocks: { $store: store } } }
+    );
+
+    wrapper.vm.allSnapshots = {
+      'snapshot-1': {
+        name:         'snapshot-1',
+        snapshotFile: { name: 'snapshot-file-1' }
+      }
+    };
+    wrapper.vm.selectedSnapshot = 'snapshot-1';
+
+    await wrapper.vm.apply(buttonDone);
+
+    expect(createOperationCR).toHaveBeenCalledTimes(1);
+    expect((createOperationCR as jest.Mock).mock.calls[0][1]).toBe(OPERATION.ETCD_SNAPSHOT_RESTORE);
+    expect((createOperationCR as jest.Mock).mock.calls[0][2]).toStrictEqual({
+      clusterRef: {
+        apiVersion: 'management.cattle.io/v3',
+        kind:       'Cluster',
+        name:       'c-m-imported',
+      },
+      args: { name: 'snapshot-file-1' },
+    });
+    expect((createOperationCR as jest.Mock).mock.calls[0][3]).toBe('c-m-imported');
+    expect((createOperationCR as jest.Mock).mock.calls[0][4]).toBe('c-m-imported');
+    expect(clusterSave).not.toHaveBeenCalled();
+    expect(buttonDone).toHaveBeenCalledWith(true);
+  });
+
+  it('should restore imported snapshot by resolving target cluster from store', async() => {
+    (createOperationCR as jest.Mock).mockResolvedValue(undefined);
+    const buttonDone = jest.fn();
+    const byId = jest.fn();
+
+    const importedCluster = {
+      id:                      'fleet-default/imported-cluster',
+      isImportedWithDayTwoOps: true,
+      mgmt:                    { id: 'c-m-imported' },
+      isImported:              true,
+    };
+
+    byId.mockImplementation((type: string, id: string) => {
+      if (type === CAPI.RANCHER_CLUSTER && id === 'fleet-default/imported-cluster') {
+        return importedCluster;
+      }
+
+      if (type === MANAGEMENT.CLUSTER && id === 'c-m-imported') {
+        return importedCluster.mgmt;
+      }
+
+      return null;
+    });
+
+    const getters: any = {};
+
+    getters['i18n/t'] = () => (key: string) => key;
+    getters['management/byId'] = () => byId;
+
+    const store = createStore({
+      modules: {
+        'action-menu': {
+          namespaced: true,
+          state:      {
+            showPromptRestore: true,
+            toRestore:         [{
+              type:         SNAPSHOT,
+              metadata:     { namespace: 'fleet-default' },
+              spec:         { clusterName: 'imported-cluster', clusterRef: { name: 'c-m-imported' } },
+              snapshotFile: { name: 'snapshot-file-2' },
+              nameDisplay:  'snapshot-2',
+            }]
+          },
+          mutations: { togglePromptRestore: jest.fn() }
+        },
+      },
+      getters,
+      actions: { 'growl/success': jest.fn() }
+    });
+
+    const wrapper = shallowMount(
+      PromptRestore as unknown as ExtendedVue<Vue, {}, {}, {}, DefaultProps>,
+      { global: { mocks: { $store: store } } }
+    );
+
+    await wrapper.vm.apply(buttonDone);
+
+    expect(createOperationCR).toHaveBeenCalledTimes(1);
+    expect((createOperationCR as jest.Mock).mock.calls[0][1]).toBe(OPERATION.ETCD_SNAPSHOT_RESTORE);
+    expect((createOperationCR as jest.Mock).mock.calls[0][2]).toStrictEqual({
+      clusterRef: {
+        apiVersion: 'management.cattle.io/v3',
+        kind:       'Cluster',
+        name:       'c-m-imported',
+      },
+      args: { name: 'snapshot-file-2' },
+    });
+    expect((createOperationCR as jest.Mock).mock.calls[0][3]).toBe('c-m-imported');
+    expect((createOperationCR as jest.Mock).mock.calls[0][4]).toBe('c-m-imported');
+    expect(buttonDone).toHaveBeenCalledWith(true);
+    expect(byId).toHaveBeenCalledWith(CAPI.RANCHER_CLUSTER, 'fleet-default/imported-cluster');
+  });
 });

package/components/fleet/GitRepoAdvancedTab.vue

@@ -157,6 +157,7 @@ const validatePollingInterval = () => {
       label-key="fleet.gitRepo.auth.git"
       :cache-secrets="true"
       :show-ssh-known-hosts="true"
+      :allow-github-app="true"
       :is-github-dot-com-repository="isGithubDotComRepository"
       @update:value="updateAuth($event, 'clientSecretName')"
       @inputauthval="updateCachedAuthVal($event, 'clientSecretName')"

package/components/fleet/GitRepoMetadataTab.vue

@@ -14,6 +14,10 @@ defineProps({
   isView: {
     type:    Boolean,
     default: false
+  },
+  nameRules: {
+    type:    Array,
+    default: () => []
   }
 });
 
@@ -31,6 +35,7 @@ const updateValue = (event) => {
       :value="value"
       :namespaced="false"
       :mode="mode"
+      :rules="{ name: nameRules }"
       @update:value="updateValue"
     />
     <Labels

package/components/fleet/HelmOpAppCoConfigTab.vue

@@ -50,6 +50,7 @@ const props = withDefaults(defineProps<{
   hideTarget?: boolean;
   hideAdvanced?: boolean;
   hideChartConfig?: boolean;
+  nameRules?: ((val: any) => string | undefined)[];
 }>(), {
   appCoChartEntries:        () => ({} as Record<string, ChartEntry[]>),
   appCoChartsLoading:       false,
@@ -69,6 +70,7 @@ const props = withDefaults(defineProps<{
   hideTarget:               false,
   hideAdvanced:             false,
   hideChartConfig:          false,
+  nameRules:                () => [],
 });
 
 // eslint-disable-next-line func-call-spacing
@@ -309,6 +311,7 @@ defineExpose({ refreshYamlEditor });
           :mode="mode"
           :name-label="'fleet.helmOp.appCoConfig.name'"
           :no-bottom-margin="true"
+          :rules="{ name: nameRules }"
           data-testid="appco-config-name-ns-description"
           @update:value="emit('update:value', $event)"
         />
@@ -354,6 +357,7 @@ defineExpose({ refreshYamlEditor });
           :namespaced="false"
           :mode="mode"
           :name-label="'fleet.helmOp.appCoConfig.name'"
+          :rules="{ name: nameRules }"
           data-testid="appco-config-name-ns-description"
           @update:value="emit('update:value', $event)"
         />

package/components/fleet/HelmOpMetadataTab.vue

@@ -14,6 +14,10 @@ defineProps({
   isView: {
     type:    Boolean,
     default: false
+  },
+  nameRules: {
+    type:    Array,
+    default: () => []
   }
 });
 
@@ -31,6 +35,7 @@ const updateValue = (value) => {
       :value="value"
       :namespaced="false"
       :mode="mode"
+      :rules="{ name: nameRules }"
       @update:value="updateValue"
     />
     <Labels

package/components/form/FileSelector.vue

@@ -1,6 +1,7 @@
 <script>
 import { _EDIT, _VIEW } from '@shell/config/query-params';
 import { set } from '@shell/utils/object';
+import { RcButton } from '@components/RcButton';
 
 export function createOnSelected(field) {
   return function(contents) {
@@ -11,6 +12,8 @@ export function createOnSelected(field) {
 export default {
   emits: ['error', 'selected'],
 
+  components: { RcButton },
+
   props: {
     label: {
       type:     String,
@@ -70,6 +73,15 @@ export default {
     class: {
       type:    [String, Array],
       default: () => [],
+    },
+
+    /**
+     * Render the trigger as a small, secondary RcButton instead of the default
+     * plain button.
+     */
+    asRcButton: {
+      type:    Boolean,
+      default: false,
     }
 
   },
@@ -82,6 +94,11 @@ export default {
     customClass() {
       return ['file-selector', 'btn', ...(Array.isArray(this.class) ? this.class : [this.class])];
     },
+
+    // RcButton provides its own `btn` class, so we omit it here to avoid clashing styles
+    rcButtonClass() {
+      return ['file-selector', ...(Array.isArray(this.class) ? this.class : [this.class])];
+    },
   },
 
   methods: {
@@ -154,8 +171,29 @@ export default {
 </script>
 
 <template>
+  <RcButton
+    v-if="!isView && asRcButton"
+    variant="secondary"
+    size="small"
+    :disabled="disabled"
+    :aria-label="label"
+    :class="rcButtonClass"
+    data-testid="file-selector__uploader-button"
+    @click="selectFile"
+  >
+    <span>{{ label }}</span>
+    <input
+      ref="uploader"
+      type="file"
+      class="hide"
+      :multiple="multiple"
+      :webkitdirectory="directory"
+      :accept="accept"
+      @change="fileChange"
+    >
+  </RcButton>
   <button
-    v-if="!isView"
+    v-else-if="!isView"
     :disabled="disabled"
     :aria-label="label"
     type="button"

package/components/form/PrivateRegistry.constants.ts

@@ -0,0 +1,7 @@
+export const PRIVATE_REGISTRY_CONTEXT = {
+  PROVISIONING: 'provisioning',
+  IMPORTING:    'importing',
+  CHARTS:       'charts',
+} as const;
+
+export type PrivateRegistryContext = typeof PRIVATE_REGISTRY_CONTEXT[keyof typeof PRIVATE_REGISTRY_CONTEXT];