diff options
Diffstat (limited to 'app/assets/javascripts/serverless')
5 files changed, 39 insertions, 101 deletions
diff --git a/app/assets/javascripts/serverless/components/empty_state.vue b/app/assets/javascripts/serverless/components/empty_state.vue index 8a5ed9debb3..6d1cea519c4 100644 --- a/app/assets/javascripts/serverless/components/empty_state.vue +++ b/app/assets/javascripts/serverless/components/empty_state.vue @@ -1,6 +1,8 @@ <script> import { GlEmptyState, GlLink, GlSprintf } from '@gitlab/ui'; import { mapState } from 'vuex'; +import { s__ } from '~/locale'; +import { DEPRECATION_POST_LINK } from '../constants'; export default { components: { @@ -8,6 +10,13 @@ export default { GlLink, GlSprintf, }, + i18n: { + title: s__('Serverless|Getting started with serverless'), + description: s__( + 'Serverless|Serverless was %{postLinkStart}deprecated%{postLinkEnd}. But if you opt to use it, you must install Knative in your Kubernetes cluster first. %{linkStart}Learn more.%{linkEnd}', + ), + }, + deprecationPostLink: DEPRECATION_POST_LINK, computed: { ...mapState(['emptyImagePath', 'helpPath']), }, @@ -15,18 +24,12 @@ export default { </script> <template> - <gl-empty-state - :svg-path="emptyImagePath" - :title="s__('Serverless|Getting started with serverless')" - > + <gl-empty-state :svg-path="emptyImagePath" :title="$options.i18n.title"> <template #description> - <gl-sprintf - :message=" - s__( - 'Serverless|In order to start using functions as a service, you must first install Knative on your Kubernetes cluster. %{linkStart}More information%{linkEnd}', - ) - " - > + <gl-sprintf :message="$options.i18n.description"> + <template #postLink="{ content }"> + <gl-link :href="$options.deprecationPostLink" target="_blank">{{ content }}</gl-link> + </template> <template #link="{ content }"> <gl-link :href="helpPath">{{ content }}</gl-link> </template> diff --git a/app/assets/javascripts/serverless/components/functions.vue b/app/assets/javascripts/serverless/components/functions.vue index b2d7aa75051..e9461aa3ead 100644 --- a/app/assets/javascripts/serverless/components/functions.vue +++ b/app/assets/javascripts/serverless/components/functions.vue @@ -1,8 +1,14 @@ <script> -import { GlLink, GlLoadingIcon, GlSafeHtmlDirective as SafeHtml } from '@gitlab/ui'; +import { + GlLink, + GlAlert, + GlSprintf, + GlLoadingIcon, + GlSafeHtmlDirective as SafeHtml, +} from '@gitlab/ui'; import { mapState, mapActions, mapGetters } from 'vuex'; import { sprintf, s__ } from '~/locale'; -import { CHECKING_INSTALLED } from '../constants'; +import { CHECKING_INSTALLED, DEPRECATION_POST_LINK } from '../constants'; import EmptyState from './empty_state.vue'; import EnvironmentRow from './environment_row.vue'; @@ -11,11 +17,14 @@ export default { EnvironmentRow, EmptyState, GlLink, + GlAlert, + GlSprintf, GlLoadingIcon, }, directives: { SafeHtml, }, + deprecationPostLink: DEPRECATION_POST_LINK, computed: { ...mapState(['installed', 'isLoading', 'hasFunctionData', 'helpPath', 'statusPath']), ...mapGetters(['getFunctions']), @@ -65,6 +74,17 @@ export default { <template> <section id="serverless-functions" class="flex-grow"> + <gl-alert class="gl-mt-6" variant="warning" :dismissible="false"> + <gl-sprintf + :message="s__('Serverless|Serverless was %{linkStart}deprecated%{linkEnd} in GitLab 14.3.')" + ><template #link="{ content }" + ><gl-link :href="$options.deprecationPostLink" target="_blank">{{ + content + }}</gl-link></template + ></gl-sprintf + > + </gl-alert> + <gl-loading-icon v-if="checkingInstalled" size="lg" class="gl-mt-3 gl-mb-3" /> <div v-else-if="isInstalled"> diff --git a/app/assets/javascripts/serverless/constants.js b/app/assets/javascripts/serverless/constants.js index 2fa15e56ccb..42c9ee983b4 100644 --- a/app/assets/javascripts/serverless/constants.js +++ b/app/assets/javascripts/serverless/constants.js @@ -5,3 +5,6 @@ export const X_INTERVAL = 5; // Reflects the number of verticle bars on the x-ax export const CHECKING_INSTALLED = 'checking'; // The backend is still determining whether or not Knative is installed export const TIMEOUT = 'timeout'; + +export const DEPRECATION_POST_LINK = + 'https://about.gitlab.com/releases/2021/09/22/gitlab-14-3-released/#gitlab-serverless'; diff --git a/app/assets/javascripts/serverless/survey_banner.js b/app/assets/javascripts/serverless/survey_banner.js deleted file mode 100644 index 070e8f4c661..00000000000 --- a/app/assets/javascripts/serverless/survey_banner.js +++ /dev/null @@ -1,36 +0,0 @@ -import Vue from 'vue'; -import { setUrlParams } from '~/lib/utils/url_utility'; -import SurveyBanner from './survey_banner.vue'; - -let bannerInstance; -const SURVEY_URL_BASE = 'https://gitlab.fra1.qualtrics.com/jfe/form/SV_00PfofFfY9s8Shf'; - -export default function initServerlessSurveyBanner() { - const el = document.querySelector('.js-serverless-survey-banner'); - if (el && !bannerInstance) { - const { userName, userEmail } = el.dataset; - - // pre-populate survey fields - const surveyUrl = setUrlParams( - { - Q_PopulateResponse: JSON.stringify({ - QID1: userEmail, - QID2: userName, - QID16: '1', // selects "yes" to "do you currently use GitLab?" - }), - }, - SURVEY_URL_BASE, - ); - - bannerInstance = new Vue({ - el, - render(createElement) { - return createElement(SurveyBanner, { - props: { - surveyUrl, - }, - }); - }, - }); - } -} diff --git a/app/assets/javascripts/serverless/survey_banner.vue b/app/assets/javascripts/serverless/survey_banner.vue deleted file mode 100644 index c48c294c0f7..00000000000 --- a/app/assets/javascripts/serverless/survey_banner.vue +++ /dev/null @@ -1,52 +0,0 @@ -<script> -import { GlBanner } from '@gitlab/ui'; -import Cookies from 'js-cookie'; -import { parseBoolean } from '~/lib/utils/common_utils'; - -export default { - components: { - GlBanner, - }, - props: { - surveyUrl: { - type: String, - required: true, - }, - }, - data() { - return { - visible: true, - }; - }, - created() { - if (parseBoolean(Cookies.get('hide_serverless_survey'))) { - this.visible = false; - } - }, - methods: { - handleClose() { - Cookies.set('hide_serverless_survey', 'true', { expires: 365 * 10 }); - this.visible = false; - }, - }, -}; -</script> - -<template> - <gl-banner - v-if="visible" - class="mt-4" - :title="s__('Serverless|Help shape the future of Serverless at GitLab')" - :button-text="s__('Serverless|Sign up for First Look')" - :button-link="surveyUrl" - @close="handleClose" - > - <p> - {{ - s__( - 'Serverless|We are continually striving to improve our Serverless functionality. As a Knative user, we would love to hear how we can make this experience better for you. Sign up for GitLab First Look today and we will be in touch shortly.', - ) - }} - </p> - </gl-banner> -</template> |