Commit a06b8041 authored by Mike Greiling's avatar Mike Greiling

Merge branch 'eks-cluster-form-help-text' into 'master'

EKS Clusters: Select cloud provider buttons

See merge request gitlab-org/gitlab!18608
parents 6e3a2208 469f0217
......@@ -12,11 +12,18 @@ export default {
type: String,
required: true,
},
kubernetesIntegrationHelpPath: {
type: String,
required: true,
},
},
};
</script>
<template>
<eks-cluster-configuration-form
:gitlab-managed-cluster-help-path="gitlabManagedClusterHelpPath"
/>
<div class="js-create-eks-cluster">
<eks-cluster-configuration-form
:gitlab-managed-cluster-help-path="gitlabManagedClusterHelpPath"
:kubernetes-integration-help-path="kubernetesIntegrationHelpPath"
/>
</div>
</template>
......@@ -35,6 +35,10 @@ export default {
type: String,
required: true,
},
kubernetesIntegrationHelpPath: {
type: String,
required: true,
},
},
computed: {
...mapState([
......@@ -94,6 +98,20 @@ export default {
securityGroupDropdownDisabled() {
return !this.selectedVpc;
},
kubernetesIntegrationHelpText() {
const escapedUrl = _.escape(this.kubernetesIntegrationHelpPath);
return sprintf(
s__(
'ClusterIntegration|Read our %{link_start}help page%{link_end} on Kubernetes cluster integration.',
),
{
link_start: `<a href="${escapedUrl}" target="_blank" rel="noopener noreferrer">`,
link_end: '</a>',
},
false,
);
},
roleDropdownHelpText() {
return sprintf(
s__(
......@@ -212,6 +230,10 @@ export default {
</script>
<template>
<form name="eks-cluster-configuration-form">
<h2>
{{ s__('ClusterIntegration|Enter the details for your Amazon EKS Kubernetes cluster') }}
</h2>
<p v-html="kubernetesIntegrationHelpText"></p>
<div class="form-group">
<label class="label-bold" for="eks-cluster-name">{{
s__('ClusterIntegration|Kubernetes cluster name')
......
......@@ -5,25 +5,22 @@ import createStore from './store';
Vue.use(Vuex);
export default () =>
new Vue({
el: '.js-create-eks-cluster-form-container',
export default el => {
const { gitlabManagedClusterHelpPath, kubernetesIntegrationHelpPath } = el.dataset;
return new Vue({
el,
store: createStore(),
components: {
CreateEksCluster,
},
data() {
const { gitlabManagedClusterHelpPath } = document.querySelector(this.$options.el).dataset;
return {
gitlabManagedClusterHelpPath,
};
},
render(createElement) {
return createElement('create-eks-cluster', {
props: {
gitlabManagedClusterHelpPath: this.gitlabManagedClusterHelpPath,
gitlabManagedClusterHelpPath,
kubernetesIntegrationHelpPath,
},
});
},
});
};
document.addEventListener('DOMContentLoaded', () => {
if (gon.features.createEksClusters) {
import(/* webpackChunkName: 'eks_cluster' */ '~/create_cluster/eks_cluster')
.then(({ default: initCreateEKSCluster }) => initCreateEKSCluster())
.then(({ default: initCreateEKSCluster }) => {
const el = document.querySelector('.js-create-eks-cluster-form-container');
if (el) {
initCreateEKSCluster(el);
}
})
.catch(() => {});
}
});
......@@ -3,6 +3,6 @@
- label = local_assigns.fetch(:label)
= link_to clusterable.new_path(provider: provider), class: 'btn gl-button btn-outline flex-fill d-inline-flex flex-column mr-3 justify-content-center align-items-center' do
= image_tag logo_path, alt: label, class: 'gl-w-13 gl-h-13'
.svg-content= image_tag logo_path, alt: label, class: 'gl-w-13 gl-h-13'
%span
= label
......@@ -6,6 +6,6 @@
= create_cluster_label
.d-flex
= render partial: 'clusters/clusters/cloud_providers/cloud_provider_button',
locals: { provider: 'gke', label: gke_label, logo_path: '' }
locals: { provider: 'eks', label: eks_label, logo_path: 'illustrations/logos/amazon_eks.svg' }
= render partial: 'clusters/clusters/cloud_providers/cloud_provider_button',
locals: { provider: 'eks', label: eks_label, logo_path: '' }
locals: { provider: 'gke', label: gke_label, logo_path: 'illustrations/logos/google_gke.svg' }
.js-create-eks-cluster-form-container{ data: { 'gitlab-managed-cluster-help-path' => help_page_path('user/project/clusters/index.md', anchor: 'gitlab-managed-clusters') } }
.js-create-eks-cluster-form-container{ data: { 'gitlab-managed-cluster-help-path' => help_page_path('user/project/clusters/index.md', anchor: 'gitlab-managed-clusters'),
'kubernetes-integration-help-path' => help_page_path('user/project/clusters/index') } }
......@@ -3,13 +3,12 @@
- zones_link_url = 'https://cloud.google.com/compute/docs/regions-zones/regions-zones'
- machine_type_link_url = 'https://cloud.google.com/compute/docs/machine-types'
- pricing_link_url = 'https://cloud.google.com/compute/pricing#machinetype'
- kubernetes_integration_url = help_page_path('user/project/clusters/index')
- help_link_start = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe
- help_link_end = ' %{external_link_icon}</a>'.html_safe % { external_link_icon: external_link_icon }
%p
- link_to_help_page = link_to(s_('ClusterIntegration|help page'),
help_page_path('user/project/clusters/index'), target: '_blank', rel: 'noopener noreferrer')
= s_('ClusterIntegration|Read our %{link_to_help_page} on Kubernetes cluster integration.').html_safe % { link_to_help_page: link_to_help_page }
= s_('ClusterIntegration|Read our %{link_start}help page%{link_end} on Kubernetes cluster integration.').html_safe % { link_start: help_link_start % { url: kubernetes_integration_url }, link_end: '</a>'.html_safe }
%p= link_to('Select a different Google account', @authorize_url)
......
- documentation_link_start = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: help_page_path("integration/google") }
- link_end = '<a/>'.html_safe
= s_('Google authentication is not %{link_start}property configured%{link_end}. Ask your GitLab administrator if you want to use this service.').html_safe % { link_start: documentation_link_start, link_end: link_end }
.signin-with-google
- create_account_link = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: 'https://accounts.google.com/SignUpWithoutGmail?service=cloudconsole&continue=https%3A%2F%2Fconsole.cloud.google.com%2Ffreetrial%3Futm_campaign%3D2018_cpanel%26utm_source%3Dgitlab%26utm_medium%3Dreferral' }
= link_to(image_tag('auth_buttons/signin_with_google.png', width: '191px', alt: _('Sign in with Google')), @authorize_url)
= s_('or %{link_start}create a new Google account%{link_end}').html_safe % { link_start: create_account_link, link_end: '</a>'.html_safe }
......@@ -2,7 +2,9 @@
- page_title _('Kubernetes Cluster')
- create_eks_enabled = Feature.enabled?(:create_eks_clusters)
- active_tab = local_assigns.fetch(:active_tab, 'create')
- link_end = '<a/>'.html_safe
- create_on_gke_tab_label = s_('ClusterIntegration|Create new Cluster on GKE')
- create_on_eks_tab_label = s_('ClusterIntegration|Create new Cluster on EKS')
- create_new_cluster_label = s_('ClusterIntegration|Create new Cluster')
= javascript_include_tag 'https://apis.google.com/js/api.js'
= render_gcp_signup_offer
......@@ -14,7 +16,16 @@
%ul.nav-links.nav-tabs.gitlab-tabs.nav{ role: 'tablist' }
%li.nav-item{ role: 'presentation' }
%a.nav-link{ href: '#create-cluster-pane', id: 'create-cluster-tab', class: active_when(active_tab == 'create'), data: { toggle: 'tab' }, role: 'tab' }
%span Create new Cluster on GKE
%span
- if create_eks_enabled
- if @gke_selected
= create_on_gke_tab_label
- elsif @eks_selected
= create_on_eks_tab_label
- else
= create_new_cluster_label
- else
= create_on_gke_tab_label
%li.nav-item{ role: 'presentation' }
%a.nav-link{ href: '#add-cluster-pane', id: 'add-cluster-tab', class: active_when(active_tab == 'add'), data: { toggle: 'tab' }, role: 'tab' }
%span Add existing cluster
......@@ -22,9 +33,14 @@
.tab-content.gitlab-tab-content
- if create_eks_enabled
.tab-pane{ id: 'create-cluster-pane', class: active_when(active_tab == 'create'), role: 'tabpanel' }
- if @gke_selected && @valid_gcp_token
- if @gke_selected
= render 'clusters/clusters/gcp/header'
= render 'clusters/clusters/gcp/form'
- if @valid_gcp_token
= render 'clusters/clusters/gcp/form'
- elsif @authorize_url
= render 'clusters/clusters/gcp/signin_with_google_button'
- else
= render 'clusters/clusters/gcp/gcp_not_configured'
- elsif @eks_selected
= render 'clusters/clusters/eks/index'
- else
......@@ -35,13 +51,9 @@
- if @valid_gcp_token
= render 'clusters/clusters/gcp/form'
- elsif @authorize_url
.signin-with-google
- create_account_link = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: 'https://accounts.google.com/SignUpWithoutGmail?service=cloudconsole&continue=https%3A%2F%2Fconsole.cloud.google.com%2Ffreetrial%3Futm_campaign%3D2018_cpanel%26utm_source%3Dgitlab%26utm_medium%3Dreferral' }
= link_to(image_tag('auth_buttons/signin_with_google.png', width: '191px', alt: _('Sign in with Google')), @authorize_url)
= s_('or %{link_start}create a new Google account%{link_end}').html_safe % { link_start: create_account_link, link_end: link_end }
= render 'clusters/clusters/gcp/signin_with_google_button'
- else
- documentation_link_start = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: help_page_path("integration/google") }
= s_('Google authentication is not %{link_start}property configured%{link_end}. Ask your GitLab administrator if you want to use this service.').html_safe % { link_start: documentation_link_start, link_end: link_end }
= render 'clusters/clusters/gcp/gcp_not_configured'
.tab-pane{ id: 'add-cluster-pane', class: active_when(active_tab == 'add'), role: 'tabpanel' }
= render 'clusters/clusters/user/header'
......
......@@ -3528,6 +3528,15 @@ msgstr ""
msgid "ClusterIntegration|Create cluster on"
msgstr ""
msgid "ClusterIntegration|Create new Cluster"
msgstr ""
msgid "ClusterIntegration|Create new Cluster on EKS"
msgstr ""
msgid "ClusterIntegration|Create new Cluster on GKE"
msgstr ""
msgid "ClusterIntegration|Did you know?"
msgstr ""
......@@ -3540,6 +3549,9 @@ msgstr ""
msgid "ClusterIntegration|Enable this setting if using role-based access control (RBAC)."
msgstr ""
msgid "ClusterIntegration|Enter the details for your Amazon EKS Kubernetes cluster"
msgstr ""
msgid "ClusterIntegration|Enter the details for your Kubernetes cluster"
msgstr ""
......@@ -3801,7 +3813,7 @@ msgstr ""
msgid "ClusterIntegration|RBAC-enabled cluster"
msgstr ""
msgid "ClusterIntegration|Read our %{link_to_help_page} on Kubernetes cluster integration."
msgid "ClusterIntegration|Read our %{link_start}help page%{link_end} on Kubernetes cluster integration."
msgstr ""
msgid "ClusterIntegration|Region"
......@@ -4017,9 +4029,6 @@ msgstr ""
msgid "ClusterIntegration|documentation"
msgstr ""
msgid "ClusterIntegration|help page"
msgstr ""
msgid "ClusterIntegration|installed via %{installed_via}"
msgstr ""
......
# frozen_string_literal: true
require 'spec_helper'
describe 'AWS EKS Cluster', :js do
let(:project) { create(:project) }
let(:user) { create(:user) }
before do
project.add_maintainer(user)
gitlab_sign_in(user)
allow(Projects::ClustersController).to receive(:STATUS_POLLING_INTERVAL) { 100 }
end
context 'when user does not have a cluster and visits cluster index page' do
let(:project_id) { 'test-project-1234' }
before do
visit project_clusters_path(project)
click_link 'Add Kubernetes cluster'
end
context 'when user creates a cluster on AWS EKS' do
before do
click_link 'Amazon EKS'
end
it 'user sees a form to create an EKS cluster' do
expect(page).to have_selector(:css, '.js-create-eks-cluster')
end
end
end
end
......@@ -177,6 +177,7 @@ describe 'Gcp Cluster', :js do
context 'when user has not dismissed GCP signup offer' do
before do
stub_feature_flags(create_eks_clusters: false)
visit project_clusters_path(project)
end
......@@ -200,6 +201,7 @@ describe 'Gcp Cluster', :js do
context 'when user has dismissed GCP signup offer' do
before do
stub_feature_flags(create_eks_clusters: false)
visit project_clusters_path(project)
end
......
......@@ -74,7 +74,7 @@ describe 'Clusters', :js do
visit project_clusters_path(project)
click_link 'Add Kubernetes cluster'
click_link 'Create new Cluster on GKE'
click_link 'Create new Cluster'
end
it 'user sees a link to create a GKE cluster' do
......
......@@ -123,6 +123,7 @@ describe('EksClusterConfigurationForm', () => {
store,
propsData: {
gitlabManagedClusterHelpPath: '',
kubernetesIntegrationHelpPath: '',
},
});
});
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment