Commit 267a277a authored by Nathan Friend's avatar Nathan Friend

Merge branch...

Merge branch '35530-serverless-on-knative-install-functions-view-invite-user-to-help-shape-gitlab-serverless' into 'master'

Place link in clusters page to pre-filled survey for Knative users

Closes #35530

See merge request gitlab-org/gitlab!23025
parents bee71dd6 3ea3d774
......@@ -8,13 +8,20 @@ import Flash from '../flash';
import Poll from '../lib/utils/poll';
import initSettingsPanels from '../settings_panels';
import eventHub from './event_hub';
import { APPLICATION_STATUS, INGRESS, INGRESS_DOMAIN_SUFFIX, CROSSPLANE } from './constants';
import {
APPLICATION_STATUS,
INGRESS,
INGRESS_DOMAIN_SUFFIX,
CROSSPLANE,
KNATIVE,
} from './constants';
import ClustersService from './services/clusters_service';
import ClustersStore from './stores/clusters_store';
import Applications from './components/applications.vue';
import RemoveClusterConfirmation from './components/remove_cluster_confirmation.vue';
import setupToggleButtons from '../toggle_buttons';
import initProjectSelectDropdown from '~/project_select';
import initServerlessSurveyBanner from '~/serverless/survey_banner';
const Environments = () => import('ee_component/clusters/components/environments.vue');
......@@ -326,6 +333,10 @@ export default class Clusters {
this.store.state.applications[INGRESS],
);
}
if (this.store.state.applications[KNATIVE]?.status === APPLICATION_STATUS.INSTALLED) {
initServerlessSurveyBanner();
}
}
showToken() {
......
import ServerlessBundle from '~/serverless/serverless_bundle';
import initServerlessSurveyBanner from '~/serverless/survey_banner';
document.addEventListener('DOMContentLoaded', () => {
initServerlessSurveyBanner();
new ServerlessBundle(); // eslint-disable-line no-new
});
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,
},
});
},
});
}
}
<script>
import Cookies from 'js-cookie';
import { parseBoolean } from '~/lib/utils/common_utils';
import { GlBanner } from '@gitlab/ui';
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>
......@@ -39,6 +39,8 @@
.js-cluster-application-notice
.flash-container
.js-serverless-survey-banner{ data: { user_name: current_user.name, user_email: current_user.email } }
%h4= @cluster.name
= render 'banner'
......
......@@ -10,6 +10,8 @@
help_path: help_page_path('user/project/clusters/serverless/index') } }
%div{ class: [('limit-container-width' unless fluid_layout)] }
.js-serverless-survey-banner{ data: { user_name: current_user.name, user_email: current_user.email } }
.js-serverless-functions-notice
.flash-container
......
---
title: Provide link to a survey for Knative users
merge_request: 23025
author:
type: other
......@@ -17972,6 +17972,9 @@ msgstr ""
msgid "Serverless|Getting started with serverless"
msgstr ""
msgid "Serverless|Help shape the future of Serverless at GitLab"
msgstr ""
msgid "Serverless|If you believe none of these apply, please check back later as the function data may be in the process of becoming available."
msgstr ""
......@@ -17984,6 +17987,9 @@ msgstr ""
msgid "Serverless|No functions available"
msgstr ""
msgid "Serverless|Sign up for First Look"
msgstr ""
msgid "Serverless|The deploy job has not finished."
msgstr ""
......@@ -17993,6 +17999,9 @@ msgstr ""
msgid "Serverless|There is currently no function data available from Knative. This could be for a variety of reasons including:"
msgstr ""
msgid "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."
msgstr ""
msgid "Serverless|Your %{startTag}.gitlab-ci.yml%{endTag} file is not properly configured."
msgstr ""
......
import { shallowMount } from '@vue/test-utils';
import Cookies from 'js-cookie';
import SurveyBanner from '~/serverless/survey_banner.vue';
import { GlBanner } from '@gitlab/ui';
describe('Knative survey banner', () => {
let wrapper;
function mountBanner() {
wrapper = shallowMount(SurveyBanner, {
propsData: {
surveyUrl: 'http://somesurvey.com/',
},
});
}
afterEach(() => {
wrapper.destroy();
wrapper = null;
});
it('should render the banner when the cookie is absent', () => {
jest.spyOn(Cookies, 'get').mockReturnValue(undefined);
mountBanner();
expect(Cookies.get).toHaveBeenCalled();
expect(wrapper.find(GlBanner).exists()).toBe(true);
});
it('should close the banner and set a cookie when close button is clicked', () => {
jest.spyOn(Cookies, 'get').mockReturnValue(undefined);
jest.spyOn(Cookies, 'set');
mountBanner();
expect(wrapper.find(GlBanner).exists()).toBe(true);
wrapper.find(GlBanner).vm.$emit('close');
return wrapper.vm.$nextTick().then(() => {
expect(Cookies.set).toHaveBeenCalledWith('hide_serverless_survey', 'true', { expires: 3650 });
expect(wrapper.find(GlBanner).exists()).toBe(false);
});
});
it('should not render the banner when the cookie is set', () => {
jest.spyOn(Cookies, 'get').mockReturnValue('true');
mountBanner();
expect(Cookies.get).toHaveBeenCalled();
expect(wrapper.find(GlBanner).exists()).toBe(false);
});
});
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