1 files changed, 23 insertions, 0 deletions
diff --git a/app/assets/javascripts/create_cluster/eks_cluster/components/create_eks_cluster.vue b/app/assets/javascripts/create_cluster/eks_cluster/components/create_eks_cluster.vue
index 22ee368b8e0..6bcae6ab536 100644
--- a/app/assets/javascripts/create_cluster/eks_cluster/components/create_eks_cluster.vue
+++ b/app/assets/javascripts/create_cluster/eks_cluster/components/create_eks_cluster.vue
@@ -1,4 +1,5 @@
 <script>
+import { mapState } from 'vuex';
 import ServiceCredentialsForm from './service_credentials_form.vue';
 import EksClusterConfigurationForm from './eks_cluster_configuration_form.vue';
 
@@ -16,14 +17,36 @@ export default {
       type: String,
       required: true,
     },
+    accountAndExternalIdsHelpPath: {
+      type: String,
+      required: true,
+    },
+    createRoleArnHelpPath: {
+      type: String,
+      required: true,
+    },
+    externalLinkIcon: {
+      type: String,
+      required: true,
+    },
+  },
+  computed: {
+    ...mapState(['hasCredentials']),
   },
 };
 </script>
 <template>
   <div class="js-create-eks-cluster">
     <eks-cluster-configuration-form
+      v-if="hasCredentials"
       :gitlab-managed-cluster-help-path="gitlabManagedClusterHelpPath"
       :kubernetes-integration-help-path="kubernetesIntegrationHelpPath"
     />
+    <service-credentials-form
+      v-else
+      :create-role-arn-help-path="createRoleArnHelpPath"
+      :account-and-external-ids-help-path="accountAndExternalIdsHelpPath"
+      :external-link-icon="externalLinkIcon"
+    />
   </div>
 </template>