Adding the Registries accordion to the imported clusters edit pages

Fixes #13063

cypress/e2e/po/extensions/imported/cluster-edit.po.ts

@@ -31,6 +31,22 @@ export default class ClusterManagerEditImportedPagePo extends PagePo {
     return this.self().find('[data-testid="network-accordion"]').click();
   }
 
+  enableRepositoriesAccordion() {
+    return this.self().find('[data-testid="repositories-accordion"]').click();
+  }
+
+  privateRegistryCheckbox() {
+    return this.self().find('[data-testid="private-registry-enable-checkbox"]');
+  }
+
+  enablePrivateRegistryCheckbox() {
+    return this.privateRegistryCheckbox().click();
+  }
+
+  privateRegistry() {
+    return LabeledInputPo.byLabel(this.self(), 'Container Registry');
+  }
+
   resourceDetail() {
     return new ResourceDetailPo(this.self());
   }

cypress/e2e/po/extensions/imported/cluster-import-generic.po.ts

@@ -23,6 +23,10 @@ export default class ClusterManagerImportGenericPagePo extends PagePo {
     return LabeledInputPo.byLabel(this.self(), 'Name');
   }
 
+  repositoriesAccordion() {
+    return this.self().find('[data-testid="repositories-accordion"]');
+  }
+
   resourceDetail() {
     return new ResourceDetailPo(this.self());
   }

cypress/e2e/tests/pages/manager/cluster-manager.spec.ts

@@ -592,6 +592,7 @@ describe('Cluster Manager', { testIsolation: 'off', tags: ['@manager', '@adminUs
     const editImportedClusterPage = new ClusterManagerEditImportedPagePo('_');
     const fqdn = 'fqdn';
     const cacert = 'cacert';
+    const privateRegistry = 'registry.io';
 
     describe('Generic', () => {
       it('can create new cluster', () => {
@@ -605,6 +606,10 @@ describe('Cluster Manager', { testIsolation: 'off', tags: ['@manager', '@adminUs
 
         importClusterPage.waitForPage('mode=import');
         importClusterPage.selectGeneric(0);
+
+        // Verify that we only show when editing
+        importClusterPage.repositoriesAccordion().should('not.be.visible');
+
         importClusterPage.name().set(importGenericName);
         importClusterPage.create();
 
@@ -656,6 +661,10 @@ describe('Cluster Manager', { testIsolation: 'off', tags: ['@manager', '@adminUs
         editImportedClusterPage.ace().enterFdqn(fqdn);
         editImportedClusterPage.ace().enterCaCerts(cacert);
 
+        editImportedClusterPage.enableRepositoriesAccordion();
+        editImportedClusterPage.enablePrivateRegistryCheckbox();
+        editImportedClusterPage.privateRegistry().set(privateRegistry);
+
         editImportedClusterPage.save();
 
         // We should be taken back to the list page if the save was successful
@@ -666,6 +675,10 @@ describe('Cluster Manager', { testIsolation: 'off', tags: ['@manager', '@adminUs
         editImportedClusterPage.waitForPage();
         editImportedClusterPage.ace().fqdn().value().should('eq', fqdn );
         editImportedClusterPage.ace().caCerts().value().should('eq', cacert );
+
+        // We don't seem to be getting this value back from the backend right now.
+        // editImportedClusterPage.privateRegistryCheckbox().value().should('eq', true);
+        // editImportedClusterPage.privateRegistry().value().should('eq', privateRegistry);
       });
 
       it('can delete cluster by bulk actions', () => {

pkg/imported/components/CruImported.vue

@@ -27,15 +27,15 @@ import {
   clusterNameRequired,
   clusterNameChars,
   clusterNameStartEnd,
-  clusterNameLength
+  clusterNameLength,
 } from '../util/validators';
 
 const HARVESTER_HIDE_KEY = 'cm-harvester-import';
 const defaultCluster = {
-  agentEnvVars: [],
-  labels:       {},
-  annotations:  {},
-
+  agentEnvVars:   [],
+  labels:         {},
+  annotations:    {},
+  importedConfig: { privateRegistryURL: null }
 };
 
 export default defineComponent({
@@ -77,6 +77,11 @@ export default defineComponent({
       if ( this.normanCluster && !this.normanCluster?.agentEnvVars) {
         this.normanCluster.agentEnvVars = [];
       }
+      if ( this.normanCluster && !this.normanCluster?.importedConfig) {
+        this.normanCluster.importedConfig = {};
+      }
+
+      this.showPrivateRegistryInput = !!this.normanCluster?.importedConfig?.privateRegistryURL;
       this.getVersions();
     } else {
       this.normanCluster = await store.dispatch('rancher/create', { type: NORMAN.CLUSTER, ...defaultCluster }, { root: true });
@@ -85,13 +90,14 @@ export default defineComponent({
 
   data() {
     return {
-      normanCluster:    { name: '' },
-      loadingVersions:  false,
-      membershipUpdate: {},
-      config:           null,
-      allVersions:      [],
-      defaultVer:       '',
-      fvFormRuleSets:   [{
+      showPrivateRegistryInput: false,
+      normanCluster:            { name: '', importedConfig: { privateRegistryURL: null } },
+      loadingVersions:          false,
+      membershipUpdate:         {},
+      config:                   null,
+      allVersions:              [],
+      defaultVer:               '',
+      fvFormRuleSets:           [{
         path:  'name',
         rules: ['clusterNameRequired', 'clusterNameChars', 'clusterNameStartEnd', 'clusterNameLength'],
       }, {
@@ -100,6 +106,9 @@ export default defineComponent({
       }, {
         path:  'controlPlaneConcurrency',
         rules: ['controlPlaneConcurrencyRule']
+      }, {
+        path:  'normanCluster.importedConfig.privateRegistryURL',
+        rules: ['registryUrl']
       }
       ],
     };
@@ -314,6 +323,14 @@ export default defineComponent({
     },
   },
 
+  watch: {
+    showCustomRegistryInput(value) {
+      if (!value) {
+        this.normanCluster.importedConfig.privateRegistryURL = null;
+      }
+    }
+  }
+
 });
 </script>
 
@@ -455,6 +472,36 @@ export default defineComponent({
           @fqdn-changed="(val)=>normanCluster.localClusterAuthEndpoint.fqdn = val"
         />
       </Accordion>
+      <Accordion
+        v-if="isEdit"
+        title-key="imported.accordions.registries"
+        class="mb-20"
+        data-testid="registries-accordion"
+        :open-initially="false"
+      >
+        <Banner
+          color="info"
+          class="mt-0"
+        >
+          {{ t('cluster.privateRegistry.importedDescription') }}
+        </Banner>
+        <Checkbox
+          v-model:value="showPrivateRegistryInput"
+          class="mb-20"
+          :label="t('cluster.privateRegistry.label')"
+          data-testid="private-registry-enable-checkbox"
+        />
+        <LabeledInput
+          v-if="showPrivateRegistryInput"
+          v-model:value="normanCluster.importedConfig.privateRegistryURL"
+          :mode="mode"
+          :disabled="!isEdit"
+          :rules="fvGetAndReportPathRules('normanCluster.importedConfig.privateRegistryURL')"
+          label-key="catalog.chart.registry.custom.inputLabel"
+          data-testid="private-registry-url"
+          :placeholder="t('catalog.chart.registry.custom.placeholder')"
+        />
+      </Accordion>
       <Accordion
         class="mb-20"
         title-key="imported.accordions.advanced"

pkg/imported/l10n/en-us.yaml

@@ -15,6 +15,7 @@ imported:
     basics: Basics
     upgrade: Upgrade Strategy
     networking: Networking
+    registries: Registries
     clusterMembers: Member Roles
     labels: Labels and Annotations
     k3sOptions: K3S Options

shell/assets/translations/en-us.yaml

@@ -1969,8 +1969,10 @@ cluster:
     header: Registry for Rancher System Container Images
     label: Enable cluster scoped container registry for Rancher system container images
     description: "If enabled, Rancher will pull container images from this registry during cluster provisioning. By default, Rancher will also use this registry when installing Rancher's official Helm chart apps. If the cluster scoped registry is disabled, system images are pulled from the System Default Registry in the global settings."
+    importedDescription: "By default, Rancher will also use this registry when installing Rancher's official Helm chart apps. If the cluster scoped registry is disabled, system images are pulled from the System Default Registry in the global settings."
     docsLinkRke2: "For help configuring private registry mirrors, see the RKE2 <a href=\"https://docs.rke2.io/install/private_registry\" target=\"_blank\">documentation.</a>"
     docsLinkK3s: "For help configuring private registry mirrors, see the K3s <a href=\"https://docs.k3s.io/installation/private-registry\" target=\"_blank\">documentation.</a>"
+    privateRegistryUrlError: A registry must be a valid url. Scheme is optional.
   provider:
     aliyunecs: Aliyun ECS
     aliyunkubernetescontainerservice: Alibaba ACK

shell/utils/validators/formRules/index.ts

@@ -176,6 +176,17 @@ export default function(t: Translation, { key = 'Value' }: ValidationOptions): {
     return containers.map((container: any) => containerImage(container)).find((containerError: string) => containerError);
   };
 
+  const registryUrl = (privateRegistryURL: string) => {
+    const pattern = new RegExp('^([a-z\\-0-9]+:\\/\\/?)?' + // scheme (optional, https://, http://, file:/, admin:/)
+        '((([a-z\\d]([a-z\\d-]*[a-z\\d])*)\\.)+[a-z]{2,}|' + // domain name
+        '((\\d{1,3}\\.){3}\\d{1,3}))' + // ip address
+        '(\\:\\d+)?'); // port
+
+    const isValid = pattern.test(privateRegistryURL);
+
+    return isValid ? undefined : t('cluster.privateRegistry.privateRegistryUrlError');
+  };
+
   const dnsLabel: Validator = (val: string) => {
     const validators = [
       dnsChars,
@@ -504,6 +515,7 @@ export default function(t: Translation, { key = 'Value' }: ValidationOptions): {
     minValue,
     noUpperCase,
     portNumber,
+    registryUrl,
     required,
     requiredInt,
     isInteger,