-
+ {{ $options.i18n.introText }}
+
+
-
+
{{ $options.i18n.description }}
+
+
{{ emptyStateHelpText }} diff --git a/app/assets/javascripts/clusters_list/constants.js b/app/assets/javascripts/clusters_list/constants.js index 0bade1fc281c73d8e42be6cd9905f87f96d3725b..cbb5bbd80dcaec177e0baed64be011efb7e20eca 100644 --- a/app/assets/javascripts/clusters_list/constants.js +++ b/app/assets/javascripts/clusters_list/constants.js @@ -141,3 +141,30 @@ export const AGENT_STATUSES = { }, }, }; + +export const I18N_AGENTS_EMPTY_STATE = { + introText: s__( + 'ClusterAgents|Use GitLab Agents to more securely integrate with your clusters to deploy your applications, run your pipelines, use review apps and much more.', + ), + multipleClustersText: s__( + 'ClusterAgents|If you are setting up multiple clusters and are using Auto DevOps, %{linkStart}read about using multiple Kubernetes clusters first.%{linkEnd}', + ), + learnMoreText: s__('ClusterAgents|Learn more about the GitLab Kubernetes Agent.'), + warningText: s__( + 'ClusterAgents|To install an Agent you should create an agent directory in the Repository first. We recommend that you add the Agent configuration to the directory before you start the installation process.', + ), + readMoreText: s__('ClusterAgents|Read more about getting started'), + repositoryButtonText: s__('ClusterAgents|Go to the repository'), + primaryButtonText: s__('ClusterAgents|Connect with a GitLab Agent'), +}; + +export const I18N_CLUSTERS_EMPTY_STATE = { + description: s__( + 'ClusterIntegration|Use certificates to integrate with your clusters to deploy your applications, run your pipelines, use review apps and much more in an easy way.', + ), + multipleClustersText: s__( + 'ClusterIntegration|If you are setting up multiple clusters and are using Auto DevOps, %{linkStart}read about using multiple Kubernetes clusters first.%{linkEnd}', + ), + learnMoreLinkText: s__('ClusterIntegration|Learn more about the GitLab managed clusters'), + buttonText: s__('ClusterIntegration|Connect with a certificate'), +}; diff --git a/app/assets/javascripts/clusters_list/load_agents.js b/app/assets/javascripts/clusters_list/load_agents.js index 3f00cabccdb068222153059ed0e46721a74cb9f2..e65de67515a8f7406b8de441395d35ec8e477c04 100644 --- a/app/assets/javascripts/clusters_list/load_agents.js +++ b/app/assets/javascripts/clusters_list/load_agents.js @@ -14,7 +14,7 @@ export default (Vue, VueApollo) => { emptyStateImage, defaultBranchName, projectPath, - agentDocsUrl, + multipleClustersDocsUrl, installDocsUrl, getStartedDocsUrl, integrationDocsUrl, @@ -27,7 +27,7 @@ export default (Vue, VueApollo) => { provide: { emptyStateImage, projectPath, - agentDocsUrl, + multipleClustersDocsUrl, installDocsUrl, getStartedDocsUrl, integrationDocsUrl, diff --git a/app/assets/javascripts/clusters_list/store/actions.js b/app/assets/javascripts/clusters_list/store/actions.js index 5f35a0b26f3034ded8ef7fc69f426bc1dc2bf892..f0f96fd7872d064696188c01542d934815940a58 100644 --- a/app/assets/javascripts/clusters_list/store/actions.js +++ b/app/assets/javascripts/clusters_list/store/actions.js @@ -3,7 +3,7 @@ import createFlash from '~/flash'; import axios from '~/lib/utils/axios_utils'; import { parseIntPagination, normalizeHeaders } from '~/lib/utils/common_utils'; import Poll from '~/lib/utils/poll'; -import { __ } from '~/locale'; +import { s__ } from '~/locale'; import { MAX_REQUESTS } from '../constants'; import * as types from './mutation_types'; @@ -65,7 +65,7 @@ export const fetchClusters = ({ state, commit, dispatch }) => { commit(types.SET_LOADING_CLUSTERS, false); commit(types.SET_LOADING_NODES, false); createFlash({ - message: __('Clusters|An error occurred while loading clusters'), + message: s__('Clusters|An error occurred while loading clusters'), }); dispatch('reportSentryError', { error: response, tag: 'fetchClustersErrorCallback' }); diff --git a/app/assets/stylesheets/pages/clusters.scss b/app/assets/stylesheets/pages/clusters.scss index de27ca2e5e86e634b94200540f59fbd0352d85b9..f54764f8d050d9035fe27a8e113a38ead0d8e41b 100644 --- a/app/assets/stylesheets/pages/clusters.scss +++ b/app/assets/stylesheets/pages/clusters.scss @@ -1,9 +1,13 @@ .clusters-container { - .empty-state .svg-content img { - width: 145px; + .empty-state .svg-content { + @include gl-pb-0; + + img { + width: 100px; + } } - .empty-state--agent { + .agents-empty-state { .text-content { @include gl-max-w-full; @include media-breakpoint-up(lg) { diff --git a/app/helpers/clusters_helper.rb b/app/helpers/clusters_helper.rb index cfdf4b3c8d290f2c852a8553feeeca9740e47e63..bc464b8809b8293ca9dacc4e543cb98114acb3ed 100644 --- a/app/helpers/clusters_helper.rb +++ b/app/helpers/clusters_helper.rb @@ -19,9 +19,9 @@ def display_cluster_agents?(clusterable) def js_cluster_agents_list_data(clusterable_project) { default_branch_name: clusterable_project.default_branch, - empty_state_image: image_path('illustrations/clusters_empty.svg'), + empty_state_image: image_path('illustrations/empty-state/empty-state-agents.svg'), project_path: clusterable_project.full_path, - agent_docs_url: help_page_path('user/clusters/agent/index'), + multiple_clusters_docs_url: help_page_path('user/project/clusters/multiple_kubernetes_clusters'), install_docs_url: help_page_path('administration/clusters/kas'), get_started_docs_url: help_page_path('user/clusters/agent/index', anchor: 'define-a-configuration-repository'), integration_docs_url: help_page_path('user/clusters/agent/index', anchor: 'get-started-with-gitops-and-the-gitlab-agent'), @@ -38,7 +38,7 @@ def js_clusters_list_data(clusterable) default: { path: image_path('illustrations/logos/kubernetes.svg'), text: _('Kubernetes Cluster') }, gcp: { path: image_path('illustrations/logos/google_gke.svg'), text: s_('ClusterIntegration|Google GKE') } }, - clusters_empty_state_image: image_path('illustrations/clusters_empty.svg'), + clusters_empty_state_image: image_path('illustrations/empty-state/empty-state-clusters.svg'), empty_state_help_text: clusterable.empty_state_help_text, new_cluster_path: clusterable.new_path(tab: 'create'), can_add_cluster: clusterable.can_add_cluster?.to_s diff --git a/locale/gitlab.pot b/locale/gitlab.pot index 658c60aac03579077bf925cf84eaf37d4aca86a1..048df725d94eb03d86df802ecc5bdee0bb73141e 100644 --- a/locale/gitlab.pot +++ b/locale/gitlab.pot @@ -7328,6 +7328,9 @@ msgstr "" msgid "ClusterAgents|Configuration" msgstr "" +msgid "ClusterAgents|Connect with a GitLab Agent" +msgstr "" + msgid "ClusterAgents|Connected" msgstr "" @@ -7358,16 +7361,13 @@ msgstr "" msgid "ClusterAgents|Go to the repository" msgstr "" -msgid "ClusterAgents|Install a new GitLab Agent" -msgstr "" - -msgid "ClusterAgents|Install new Agent" +msgid "ClusterAgents|If you are setting up multiple clusters and are using Auto DevOps, %{linkStart}read about using multiple Kubernetes clusters first.%{linkEnd}" msgstr "" -msgid "ClusterAgents|Integrate Kubernetes with a GitLab Agent" +msgid "ClusterAgents|Install a new GitLab Agent" msgstr "" -msgid "ClusterAgents|Integrate with the GitLab Agent" +msgid "ClusterAgents|Install new Agent" msgstr "" msgid "ClusterAgents|Last connected %{timeAgo}." @@ -7379,6 +7379,9 @@ msgstr "" msgid "ClusterAgents|Learn how to create an agent access token" msgstr "" +msgid "ClusterAgents|Learn more about the GitLab Kubernetes Agent." +msgstr "" + msgid "ClusterAgents|Make sure you are using a valid token." msgstr "" @@ -7418,12 +7421,6 @@ msgstr "" msgid "ClusterAgents|The Agent has not been connected in a long time. There might be a connectivity issue. Last contact was %{timeAgo}." msgstr "" -msgid "ClusterAgents|The GitLab Agent also requires %{linkStart}enabling the Agent Server%{linkEnd}" -msgstr "" - -msgid "ClusterAgents|The GitLab Kubernetes Agent allows an Infrastructure as Code, GitOps approach to integrating Kubernetes clusters with GitLab. %{linkStart}Learn more.%{linkEnd}" -msgstr "" - msgid "ClusterAgents|The recommended installation method provided below includes the token. If you want to follow the alternative installation method provided in the docs make sure you save the token value before you close the window." msgstr "" @@ -7442,6 +7439,9 @@ msgstr "" msgid "ClusterAgents|Unknown user" msgstr "" +msgid "ClusterAgents|Use GitLab Agents to more securely integrate with your clusters to deploy your applications, run your pipelines, use review apps and much more." +msgstr "" + msgid "ClusterAgents|You will need to create a token to connect to your agent" msgstr "" @@ -7595,6 +7595,9 @@ msgstr "" msgid "ClusterIntegration|Connect existing cluster" msgstr "" +msgid "ClusterIntegration|Connect with a certificate" +msgstr "" + msgid "ClusterIntegration|Connection Error" msgstr "" @@ -7757,6 +7760,9 @@ msgstr "" msgid "ClusterIntegration|If you are setting up multiple clusters and are using Auto DevOps, %{help_link_start}read this first%{help_link_end}." msgstr "" +msgid "ClusterIntegration|If you are setting up multiple clusters and are using Auto DevOps, %{linkStart}read about using multiple Kubernetes clusters first.%{linkEnd}" +msgstr "" + msgid "ClusterIntegration|If you do not wish to delete all associated GitLab resources, you can simply remove the integration." msgstr "" @@ -7769,12 +7775,6 @@ msgstr "" msgid "ClusterIntegration|Instance type" msgstr "" -msgid "ClusterIntegration|Integrate Kubernetes with a cluster certificate" -msgstr "" - -msgid "ClusterIntegration|Integrate with a cluster certificate" -msgstr "" - msgid "ClusterIntegration|Integration disabled" msgstr "" @@ -7796,9 +7796,6 @@ msgstr "" msgid "ClusterIntegration|Kubernetes cluster was successfully created." msgstr "" -msgid "ClusterIntegration|Kubernetes clusters allow you to use review apps, deploy your applications, run your pipelines, and much more in an easy way." -msgstr "" - msgid "ClusterIntegration|Kubernetes version" msgstr "" @@ -7820,6 +7817,9 @@ msgstr "" msgid "ClusterIntegration|Learn more about instance Kubernetes clusters" msgstr "" +msgid "ClusterIntegration|Learn more about the GitLab managed clusters" +msgstr "" + msgid "ClusterIntegration|Loading IAM Roles" msgstr "" @@ -8153,6 +8153,9 @@ msgstr "" msgid "ClusterIntegration|Unknown Error" msgstr "" +msgid "ClusterIntegration|Use certificates to integrate with your clusters to deploy your applications, run your pipelines, use review apps and much more in an easy way." +msgstr "" + msgid "ClusterIntegration|Uses the Cloud Run, Istio, and HTTP Load Balancing addons for this cluster." msgstr "" diff --git a/spec/features/admin/clusters/eks_spec.rb b/spec/features/admin/clusters/eks_spec.rb index a1bac720349bf3dac73adfc9b5f3286f69b9d569..bb2678de2ae1fc4b01c7ca4dd9236fea993a5307 100644 --- a/spec/features/admin/clusters/eks_spec.rb +++ b/spec/features/admin/clusters/eks_spec.rb @@ -14,7 +14,7 @@ before do visit admin_clusters_path - click_link 'Integrate with a cluster certificate' + click_link 'Connect with a certificate' end context 'when user creates a cluster on AWS EKS' do diff --git a/spec/features/clusters/create_agent_spec.rb b/spec/features/clusters/create_agent_spec.rb index d11684b910fecc24dde4d78adf15036a51b5b076..a05a3c4df9e750aaf07af2a35b9c856f72101700 100644 --- a/spec/features/clusters/create_agent_spec.rb +++ b/spec/features/clusters/create_agent_spec.rb @@ -26,7 +26,7 @@ it 'allows the user to select an agent to install, and displays the resulting agent token' do click_link('GitLab Agent managed clusters') - click_button('Integrate with the GitLab Agent') + click_button('Connect with a GitLab Agent') expect(page).to have_content('Install new Agent') click_button('Select an Agent') diff --git a/spec/features/groups/clusters/eks_spec.rb b/spec/features/groups/clusters/eks_spec.rb index c361c502cbbf88fe4a9ae19a34372f77ed64495a..fe62efbd3bfe75b1cbfe5bdac6177bdd7d026e1f 100644 --- a/spec/features/groups/clusters/eks_spec.rb +++ b/spec/features/groups/clusters/eks_spec.rb @@ -19,7 +19,7 @@ before do visit group_clusters_path(group) - click_link 'Integrate with a cluster certificate' + click_link 'Connect with a certificate' end context 'when user creates a cluster on AWS EKS' do diff --git a/spec/features/groups/clusters/user_spec.rb b/spec/features/groups/clusters/user_spec.rb index 2a7ededa39b0e75ede43c9cd6421915bf0b745a0..1788167c94c38e9f71ac18f8c84c094cd0ab80c9 100644 --- a/spec/features/groups/clusters/user_spec.rb +++ b/spec/features/groups/clusters/user_spec.rb @@ -25,7 +25,7 @@ before do visit group_clusters_path(group) - click_link 'Integrate with a cluster certificate' + click_link 'Connect with a certificate' click_link 'Connect existing cluster' end @@ -129,7 +129,7 @@ it 'user sees creation form with the successful message' do expect(page).to have_content('Kubernetes cluster integration was successfully removed.') - expect(page).to have_link('Integrate with a cluster certificate') + expect(page).to have_link('Connect with a certificate') end end end diff --git a/spec/features/projects/cluster_agents_spec.rb b/spec/features/projects/cluster_agents_spec.rb index 20762d98e266880c3d83a5a0b36f71b392b12e64..4b8f635f43253f5ece344a4da7d256f76418efa9 100644 --- a/spec/features/projects/cluster_agents_spec.rb +++ b/spec/features/projects/cluster_agents_spec.rb @@ -24,7 +24,7 @@ it 'displays empty state', :aggregate_failures do click_link 'GitLab Agent managed clusters' - expect(page).to have_content('Integrate with the GitLab Agent') + expect(page).to have_content('Connect with a GitLab Agent') expect(page).to have_selector('.empty-state') end end diff --git a/spec/features/projects/clusters/eks_spec.rb b/spec/features/projects/clusters/eks_spec.rb index 9f3f331cfab93f1a2b5773b42efb1e1c643769f7..3cbc71028d19fe3397a6d7b1d68f34b5cb81b31b 100644 --- a/spec/features/projects/clusters/eks_spec.rb +++ b/spec/features/projects/clusters/eks_spec.rb @@ -19,7 +19,7 @@ before do visit project_clusters_path(project) - click_link 'Integrate with a cluster certificate' + click_link 'Connect with a certificate' end context 'when user creates a cluster on AWS EKS' do diff --git a/spec/features/projects/clusters/gcp_spec.rb b/spec/features/projects/clusters/gcp_spec.rb index 21e587288f54a05ecba414dd2255d29767dba237..dec71c3c9013ca9f9601f7e6fe6382cfe56596d5 100644 --- a/spec/features/projects/clusters/gcp_spec.rb +++ b/spec/features/projects/clusters/gcp_spec.rb @@ -33,7 +33,7 @@ def submit_form before do visit project_clusters_path(project) - click_link 'Integrate with a cluster certificate' + click_link 'Connect with a certificate' click_link 'Create new cluster' click_link 'Google GKE' end @@ -162,7 +162,7 @@ def submit_form it 'user sees creation form with the successful message' do expect(page).to have_content('Kubernetes cluster integration was successfully removed.') - expect(page).to have_link('Integrate with a cluster certificate') + expect(page).to have_link('Connect with a certificate') end end end @@ -178,7 +178,7 @@ def submit_form end it 'user sees offer on cluster create page' do - click_link 'Integrate with a cluster certificate' + click_link 'Connect with a certificate' expect(page).to have_css('.gcp-signup-offer') end @@ -195,7 +195,7 @@ def submit_form find('.gcp-signup-offer .js-close').click wait_for_requests - click_link 'Integrate with a cluster certificate' + click_link 'Connect with a certificate' expect(page).not_to have_css('.gcp-signup-offer') end diff --git a/spec/features/projects/clusters/user_spec.rb b/spec/features/projects/clusters/user_spec.rb index 5b60edbcf876b317552b065c8080202a29b111c0..4d663ec5a5a3772da3a066c6aff8a1835eb74fb3 100644 --- a/spec/features/projects/clusters/user_spec.rb +++ b/spec/features/projects/clusters/user_spec.rb @@ -25,7 +25,7 @@ before do visit project_clusters_path(project) - click_link 'Integrate with a cluster certificate' + click_link 'Connect with a certificate' click_link 'Connect existing cluster' end @@ -116,7 +116,7 @@ it 'user sees creation form with the successful message' do expect(page).to have_content('Kubernetes cluster integration was successfully removed.') - expect(page).to have_link('Integrate with a cluster certificate') + expect(page).to have_link('Connect with a certificate') end end end diff --git a/spec/features/projects/clusters_spec.rb b/spec/features/projects/clusters_spec.rb index 6b03301aa74f72663f56421d5946213e17181d43..4190b83cfbfdf45ca69f7696b136c7f24b962172 100644 --- a/spec/features/projects/clusters_spec.rb +++ b/spec/features/projects/clusters_spec.rb @@ -19,7 +19,7 @@ end it 'sees empty state' do - expect(page).to have_link('Integrate with a cluster certificate') + expect(page).to have_link('Connect with a certificate') expect(page).to have_selector('.empty-state') end end @@ -214,7 +214,7 @@ before do visit project_clusters_path(project) - click_link 'Integrate with a cluster certificate' + click_link 'Connect with a certificate' click_link 'Create new cluster' end diff --git a/spec/frontend/clusters_list/components/agent_empty_state_spec.js b/spec/frontend/clusters_list/components/agent_empty_state_spec.js index a548721588e2e8199ca289c4c082677f233e2831..cf7957e8df166cce4036fbee04d7ce00b8f5d3bb 100644 --- a/spec/frontend/clusters_list/components/agent_empty_state_spec.js +++ b/spec/frontend/clusters_list/components/agent_empty_state_spec.js @@ -4,7 +4,7 @@ import { shallowMountExtended } from 'helpers/vue_test_utils_helper'; const emptyStateImage = '/path/to/image'; const projectPath = 'path/to/project'; -const agentDocsUrl = 'path/to/agentDocs'; +const multipleClustersDocsUrl = 'path/to/multipleClustersDocs'; const installDocsUrl = 'path/to/installDocs'; const getStartedDocsUrl = 'path/to/getStartedDocs'; const integrationDocsUrl = 'path/to/integrationDocs'; @@ -18,14 +18,14 @@ describe('AgentEmptyStateComponent', () => { const provideData = { emptyStateImage, projectPath, - agentDocsUrl, + multipleClustersDocsUrl, installDocsUrl, getStartedDocsUrl, integrationDocsUrl, }; const findConfigurationsAlert = () => wrapper.findComponent(GlAlert); - const findAgentDocsLink = () => wrapper.findByTestId('agent-docs-link'); + const findMultipleClustersDocsLink = () => wrapper.findByTestId('multiple-clusters-docs-link'); const findInstallDocsLink = () => wrapper.findByTestId('install-docs-link'); const findIntegrationButton = () => wrapper.findByTestId('integration-primary-button'); const findEmptyState = () => wrapper.findComponent(GlEmptyState); @@ -46,7 +46,7 @@ describe('AgentEmptyStateComponent', () => { }); it('renders correct href attributes for the links', () => { - expect(findAgentDocsLink().attributes('href')).toBe(agentDocsUrl); + expect(findMultipleClustersDocsLink().attributes('href')).toBe(multipleClustersDocsUrl); expect(findInstallDocsLink().attributes('href')).toBe(installDocsUrl); }); diff --git a/spec/frontend/clusters_list/components/clusters_empty_state_spec.js b/spec/frontend/clusters_list/components/clusters_empty_state_spec.js index 147135b7ac03e9653da1ad74b741ffb13b07fb2b..bda0e6c110c04aba26e3e231b24aac65af92df5b 100644 --- a/spec/frontend/clusters_list/components/clusters_empty_state_spec.js +++ b/spec/frontend/clusters_list/components/clusters_empty_state_spec.js @@ -11,10 +11,6 @@ const canAddCluster = true; describe('ClustersEmptyStateComponent', () => { let wrapper; - const propsData = { - childComponent: false, - }; - const provideData = { clustersEmptyStateImage, emptyStateHelpText: null, @@ -31,7 +27,6 @@ describe('ClustersEmptyStateComponent', () => { beforeEach(() => { wrapper = shallowMountExtended(ClustersEmptyState, { store: ClusterStore(entryData), - propsData, provide: provideData, stubs: { GlEmptyState }, }); @@ -56,7 +51,6 @@ describe('ClustersEmptyStateComponent', () => { provideData.emptyStateHelpText = emptyStateHelpText; wrapper = shallowMountExtended(ClustersEmptyState, { store: ClusterStore(entryData), - propsData, provide: provideData, }); }); diff --git a/spec/helpers/clusters_helper_spec.rb b/spec/helpers/clusters_helper_spec.rb index 3db906f2e629af258fd97b9fe41903a608026c8d..904151812e66e04f83772a7137715bd269400d42 100644 --- a/spec/helpers/clusters_helper_spec.rb +++ b/spec/helpers/clusters_helper_spec.rb @@ -69,7 +69,7 @@ end it 'displays image path' do - expect(subject[:empty_state_image]).to match(%r(/illustrations/logos/clusters_empty|svg)) + expect(subject[:empty_state_image]).to match(%r(/illustrations/empty-state/empty-state-agents|svg)) end it 'displays project path' do @@ -77,7 +77,7 @@ end it 'generates docs urls' do - expect(subject[:agent_docs_url]).to eq(help_page_path('user/clusters/agent/index')) + expect(subject[:multiple_clusters_docs_url]).to eq(help_page_path('user/project/clusters/multiple_kubernetes_clusters')) expect(subject[:install_docs_url]).to eq(help_page_path('administration/clusters/kas')) expect(subject[:get_started_docs_url]).to eq(help_page_path('user/clusters/agent/index', anchor: 'define-a-configuration-repository')) expect(subject[:integration_docs_url]).to eq(help_page_path('user/clusters/agent/index', anchor: 'get-started-with-gitops-and-the-gitlab-agent')) @@ -114,7 +114,7 @@ end it 'displays empty image path' do - expect(subject[:clusters_empty_state_image]).to match(%r(/illustrations/logos/clusters_empty|svg)) + expect(subject[:clusters_empty_state_image]).to match(%r(/illustrations/empty-state/empty-state-clusters|svg)) end it 'displays create cluster using certificate path' do