From cbcf60172063cf62e68f35dd2443434bd93b95f9 Mon Sep 17 00:00:00 2001 From: Joel Griffith Date: Wed, 13 Nov 2019 10:21:42 -0800 Subject: [PATCH] [7.x] [Telemetry] Remove telemetry splash page and add conditional messaging (#50189) (#50429) * [Telemetry] Remove telemetry splash page and add conditional messaging (#50189) * Removing tel splash page in UI layer * Removing more components * New disclaimer text * Removing telemetry i18n text * More i18n text removals * Snapshot updates * Snapshot tests + quick links for tel opt-out when possible * Fixing TS issues in test * i18n updates --- .../__snapshots__/home.test.js.snap | 4 +- .../__snapshots__/welcome.test.tsx.snap | 188 ++++++++++++++++++ .../kibana/public/home/components/home.js | 11 +- .../kibana/public/home/components/home_app.js | 6 - .../home/components/telemetry_opt_in/index.ts | 23 --- .../telemetry_opt_in_card.tsx | 81 -------- .../public/home/components/welcome.test.tsx | 52 +++++ .../kibana/public/home/components/welcome.tsx | 85 ++++---- .../translations/translations/ja-JP.json | 3 - .../translations/translations/zh-CN.json | 3 - 10 files changed, 284 insertions(+), 172 deletions(-) create mode 100644 src/legacy/core_plugins/kibana/public/home/components/__snapshots__/welcome.test.tsx.snap delete mode 100644 src/legacy/core_plugins/kibana/public/home/components/telemetry_opt_in/index.ts delete mode 100644 src/legacy/core_plugins/kibana/public/home/components/telemetry_opt_in/telemetry_opt_in_card.tsx create mode 100644 src/legacy/core_plugins/kibana/public/home/components/welcome.test.tsx diff --git a/src/legacy/core_plugins/kibana/public/home/components/__snapshots__/home.test.js.snap b/src/legacy/core_plugins/kibana/public/home/components/__snapshots__/home.test.js.snap index 71c336b1d48d20..0bf8c808ae9203 100644 --- a/src/legacy/core_plugins/kibana/public/home/components/__snapshots__/home.test.js.snap +++ b/src/legacy/core_plugins/kibana/public/home/components/__snapshots__/home.test.js.snap @@ -1072,10 +1072,8 @@ exports[`home welcome should show the normal home page if welcome screen is disa exports[`home welcome should show the welcome screen if enabled, and there are no index patterns defined 1`] = ` `; diff --git a/src/legacy/core_plugins/kibana/public/home/components/__snapshots__/welcome.test.tsx.snap b/src/legacy/core_plugins/kibana/public/home/components/__snapshots__/welcome.test.tsx.snap new file mode 100644 index 00000000000000..5a6c6eba5c8dba --- /dev/null +++ b/src/legacy/core_plugins/kibana/public/home/components/__snapshots__/welcome.test.tsx.snap @@ -0,0 +1,188 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`should render a Welcome screen with no telemetry disclaimer 1`] = ` + +
+
+
+ + + + + +

+ +

+ + +

+ +

+ + +
+
+
+ + + + + + + +
+
+ +`; + +exports[`should render a Welcome screen with the telemetry disclaimer 1`] = ` + +
+
+
+ + + + + +

+ +

+ + +

+ +

+ + +
+
+
+ + + + + + + + + + + + + + + + + +
+
+ +`; diff --git a/src/legacy/core_plugins/kibana/public/home/components/home.js b/src/legacy/core_plugins/kibana/public/home/components/home.js index 7f67b7ea0f3e1b..3266bbb79c625b 100644 --- a/src/legacy/core_plugins/kibana/public/home/components/home.js +++ b/src/legacy/core_plugins/kibana/public/home/components/home.js @@ -51,6 +51,7 @@ export class Home extends Component { getServices().getInjected('disableWelcomeScreen') || props.localStorage.getItem(KEY_ENABLE_WELCOME) === 'false' ); + const showTelemetryDisclaimer = getServices().getInjected('allowChangingOptInStatus'); this.state = { // If welcome is enabled, we wait for loading to complete @@ -60,6 +61,7 @@ export class Home extends Component { isLoading: isWelcomeEnabled, isNewKibanaInstance: false, isWelcomeEnabled, + showTelemetryDisclaimer, }; } @@ -228,10 +230,7 @@ export class Home extends Component { ); } @@ -254,10 +253,6 @@ export class Home extends Component { Home.propTypes = { addBasePath: PropTypes.func.isRequired, - fetchTelemetry: PropTypes.func.isRequired, - getTelemetryBannerId: PropTypes.func.isRequired, - setOptIn: PropTypes.func.isRequired, - shouldShowTelemetryOptIn: PropTypes.bool, directories: PropTypes.arrayOf( PropTypes.shape({ id: PropTypes.string.isRequired, diff --git a/src/legacy/core_plugins/kibana/public/home/components/home_app.js b/src/legacy/core_plugins/kibana/public/home/components/home_app.js index e4a6753e0771a2..f8476a0c09670d 100644 --- a/src/legacy/core_plugins/kibana/public/home/components/home_app.js +++ b/src/legacy/core_plugins/kibana/public/home/components/home_app.js @@ -31,8 +31,6 @@ import { getServices } from '../kibana_services'; export function HomeApp({ directories }) { const { - telemetryOptInProvider, - shouldShowTelemetryOptIn, getInjected, savedObjectsClient, getBasePath, @@ -85,10 +83,6 @@ export function HomeApp({ directories }) { find={savedObjectsClient.find} localStorage={localStorage} urlBasePath={getBasePath()} - shouldShowTelemetryOptIn={shouldShowTelemetryOptIn} - setOptIn={telemetryOptInProvider.setOptIn} - fetchTelemetry={telemetryOptInProvider.fetchExample} - getTelemetryBannerId={telemetryOptInProvider.getBannerId} /> diff --git a/src/legacy/core_plugins/kibana/public/home/components/telemetry_opt_in/index.ts b/src/legacy/core_plugins/kibana/public/home/components/telemetry_opt_in/index.ts deleted file mode 100644 index 63636433bc00b0..00000000000000 --- a/src/legacy/core_plugins/kibana/public/home/components/telemetry_opt_in/index.ts +++ /dev/null @@ -1,23 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ -import { renderTelemetryOptInCard, Props } from './telemetry_opt_in_card'; - -export const TelemetryOptInCard = (props: Props) => { - return renderTelemetryOptInCard(props); -}; diff --git a/src/legacy/core_plugins/kibana/public/home/components/telemetry_opt_in/telemetry_opt_in_card.tsx b/src/legacy/core_plugins/kibana/public/home/components/telemetry_opt_in/telemetry_opt_in_card.tsx deleted file mode 100644 index 572188d9c9b930..00000000000000 --- a/src/legacy/core_plugins/kibana/public/home/components/telemetry_opt_in/telemetry_opt_in_card.tsx +++ /dev/null @@ -1,81 +0,0 @@ -/* - * Licensed to Elasticsearch B.V. under one or more contributor - * license agreements. See the NOTICE file distributed with - * this work for additional information regarding copyright - * ownership. Elasticsearch B.V. licenses this file to you under - * the Apache License, Version 2.0 (the "License"); you may - * not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -import React from 'react'; -import { FormattedMessage } from '@kbn/i18n/react'; -import { - // @ts-ignore - EuiCard, - EuiButton, -} from '@elastic/eui'; -import { OptInMessage } from '../../../../../telemetry/public/components/opt_in_message'; - -export interface Props { - urlBasePath: string; - onConfirm: () => void; - onDecline: () => void; - fetchTelemetry: () => Promise; -} - -export function renderTelemetryOptInCard({ - urlBasePath, - fetchTelemetry, - onConfirm, - onDecline, -}: Props) { - return ( - - } - description={} - footer={ -
- - - - - - -
- } - /> - ); -} diff --git a/src/legacy/core_plugins/kibana/public/home/components/welcome.test.tsx b/src/legacy/core_plugins/kibana/public/home/components/welcome.test.tsx new file mode 100644 index 00000000000000..195a527707af6f --- /dev/null +++ b/src/legacy/core_plugins/kibana/public/home/components/welcome.test.tsx @@ -0,0 +1,52 @@ +/* + * Licensed to Elasticsearch B.V. under one or more contributor + * license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright + * ownership. Elasticsearch B.V. licenses this file to you under + * the Apache License, Version 2.0 (the "License"); you may + * not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, + * software distributed under the License is distributed on an + * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY + * KIND, either express or implied. See the License for the + * specific language governing permissions and limitations + * under the License. + */ + +import React from 'react'; +import { shallow } from 'enzyme'; +import { Welcome } from './welcome'; + +jest.mock('../kibana_services', () => ({ + getServices: () => ({ + addBasePath: (path: string) => `root${path}`, + trackUiMetric: () => {}, + METRIC_TYPE: { + LOADED: 'loaded', + CLICK: 'click', + }, + }), +})); + +test('should render a Welcome screen with the telemetry disclaimer', () => { + const component = shallow( + // @ts-ignore + {}} showTelemetryDisclaimer={true} /> + ); + + expect(component).toMatchSnapshot(); +}); + +test('should render a Welcome screen with no telemetry disclaimer', () => { + // @ts-ignore + const component = shallow( + // @ts-ignore + {}} showTelemetryDisclaimer={false} /> + ); + + expect(component).toMatchSnapshot(); +}); diff --git a/src/legacy/core_plugins/kibana/public/home/components/welcome.tsx b/src/legacy/core_plugins/kibana/public/home/components/welcome.tsx index afe43a23e18cb0..d919a4ecf239c2 100644 --- a/src/legacy/core_plugins/kibana/public/home/components/welcome.tsx +++ b/src/legacy/core_plugins/kibana/public/home/components/welcome.tsx @@ -25,6 +25,8 @@ import React from 'react'; import { + EuiLink, + EuiTextColor, EuiTitle, EuiSpacer, EuiFlexGroup, @@ -37,29 +39,18 @@ import { FormattedMessage } from '@kbn/i18n/react'; import { getServices } from '../kibana_services'; import { SampleDataCard } from './sample_data'; -import { TelemetryOptInCard } from './telemetry_opt_in'; interface Props { urlBasePath: string; - onSkip: () => {}; - fetchTelemetry: () => Promise; - setOptIn: (enabled: boolean) => Promise; - getTelemetryBannerId: () => string; - shouldShowTelemetryOptIn: boolean; -} - -interface State { - step: number; + onSkip: () => void; + showTelemetryDisclaimer: boolean; } /** * Shows a full-screen welcome page that gives helpful quick links to beginners. */ -export class Welcome extends React.PureComponent { +export class Welcome extends React.Component { private services = getServices(); - public readonly state: State = { - step: 0, - }; private hideOnEsc = (e: KeyboardEvent) => { if (e.key === 'Escape') { @@ -72,19 +63,11 @@ export class Welcome extends React.PureComponent { window.location.href = path; } - private async handleTelemetrySelection(confirm: boolean) { - const metricName = `telemetryOptIn${confirm ? 'Confirm' : 'Decline'}`; - this.services.trackUiMetric(this.services.METRIC_TYPE.CLICK, metricName); - await this.props.setOptIn(confirm); - const bannerId = this.props.getTelemetryBannerId(); - this.services.banners.remove(bannerId); - this.setState(() => ({ step: 1 })); - } - private onSampleDataDecline = () => { this.services.trackUiMetric(this.services.METRIC_TYPE.CLICK, 'sampleDataDecline'); this.props.onSkip(); }; + private onSampleDataConfirm = () => { this.services.trackUiMetric(this.services.METRIC_TYPE.CLICK, 'sampleDataConfirm'); this.redirecToSampleData(); @@ -92,12 +75,6 @@ export class Welcome extends React.PureComponent { componentDidMount() { this.services.trackUiMetric(this.services.METRIC_TYPE.LOADED, 'welcomeScreenMount'); - if (this.props.shouldShowTelemetryOptIn) { - this.services.trackUiMetric( - this.services.METRIC_TYPE.COUNT, - 'welcomeScreenWithTelemetryOptIn' - ); - } document.addEventListener('keydown', this.hideOnEsc); } @@ -106,8 +83,7 @@ export class Welcome extends React.PureComponent { } render() { - const { urlBasePath, shouldShowTelemetryOptIn, fetchTelemetry } = this.props; - const { step } = this.state; + const { urlBasePath, showTelemetryDisclaimer } = this.props; return ( @@ -137,20 +113,39 @@ export class Welcome extends React.PureComponent {
- {shouldShowTelemetryOptIn && step === 0 && ( - - )} - {(!shouldShowTelemetryOptIn || step === 1) && ( - + + + {showTelemetryDisclaimer && ( + + + + + + + + + + )} diff --git a/x-pack/plugins/translations/translations/ja-JP.json b/x-pack/plugins/translations/translations/ja-JP.json index a5f051e2daf261..b912aba2743d5e 100644 --- a/x-pack/plugins/translations/translations/ja-JP.json +++ b/x-pack/plugins/translations/translations/ja-JP.json @@ -2461,9 +2461,6 @@ "kbn.home.addData.siem.addSiemEventsButtonLabel": "セキュリティイベントを追加", "kbn.home.addData.siem.nameDescription": "即利用可能なビジュアライゼーションで、セキュリティイベントをまとめてインタラクティブな調査を可能にします。", "kbn.home.addData.siem.nameTitle": "SIEM", - "kbn.home.telemtery.optInCardConfirmButtonLabel": "はい", - "kbn.home.telemtery.optInCardDeclineButtonLabel": "いいえ", - "kbn.home.telemtery.optInCardTitle": "Elastic Stack の改善にご協力ください", "kbn.home.tutorial.tabs.siemTitle": "SIEM", "kbn.home.welcomeHomePageHeader": "Kibana ホーム", "kbn.discover.reloadSavedSearchButton": "検索をリセット", diff --git a/x-pack/plugins/translations/translations/zh-CN.json b/x-pack/plugins/translations/translations/zh-CN.json index cdc5198252ce3c..fcff5689fd817b 100644 --- a/x-pack/plugins/translations/translations/zh-CN.json +++ b/x-pack/plugins/translations/translations/zh-CN.json @@ -2462,9 +2462,6 @@ "kbn.home.addData.siem.addSiemEventsButtonLabel": "添加安全事件", "kbn.home.addData.siem.nameDescription": "集中安全事件，以通过即用型可视化实现交互式调查。", "kbn.home.addData.siem.nameTitle": "SIEM", - "kbn.home.telemtery.optInCardConfirmButtonLabel": "是", - "kbn.home.telemtery.optInCardDeclineButtonLabel": "否", - "kbn.home.telemtery.optInCardTitle": "帮助我们改进 Elastic Stack", "kbn.home.tutorial.tabs.siemTitle": "SIEM", "kbn.home.welcomeHomePageHeader": "Kibana 主页", "kbn.discover.reloadSavedSearchButton": "重置搜索",