Add latest changes from gitlab-org/gitlab@14-8-stable-eev14.8.0-rc42

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>