* adding opt in for telemetry to start trial and upload license * fixing scrolling issue with start basic modal in small browser window and improving a11y for read more * Design cleanup Mostly spacing and alignment fixes. * updating jest snapshots * IE Fixes * PR feedback
This commit is contained in:
Bill McConaghy
GitHub
parent
16162f2995
commit
3b9679960a
|
|
@ -1,5 +1,5 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`AddLicense component when license is active should display correct verbiage 1`] = `"<div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\">Update your license</span><div class=\\"euiText euiText--small euiCard__description\\"><p>If you already have a new license, upload it now.</p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary\\" href=\\"#/management/elasticsearch/license_management/upload_license\\" data-test-subj=\\"updateLicenseButton\\" style=\\"margin-top: auto;\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Update license</span></span></a></span></div>"`;
|
||||
exports[`AddLicense component when license is active should display correct verbiage 1`] = `"<div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\">Update your license</span><div class=\\"euiText euiText--small euiCard__description\\"><p>If you already have a new license, upload it now.</p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary licenseManagement__marginTop\\" href=\\"#/management/elasticsearch/license_management/upload_license\\" data-test-subj=\\"updateLicenseButton\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Update license</span></span></a></span></div>"`;
|
||||
|
||||
exports[`AddLicense component when license is expired should display with correct verbiage 1`] = `"<div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\">Update your license</span><div class=\\"euiText euiText--small euiCard__description\\"><p>If you already have a new license, upload it now.</p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary\\" href=\\"#/management/elasticsearch/license_management/upload_license\\" data-test-subj=\\"updateLicenseButton\\" style=\\"margin-top: auto;\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Update license</span></span></a></span></div>"`;
|
||||
exports[`AddLicense component when license is expired should display with correct verbiage 1`] = `"<div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\">Update your license</span><div class=\\"euiText euiText--small euiCard__description\\"><p>If you already have a new license, upload it now.</p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary licenseManagement__marginTop\\" href=\\"#/management/elasticsearch/license_management/upload_license\\" data-test-subj=\\"updateLicenseButton\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Update license</span></span></a></span></div>"`;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`RequestTrialExtension component should display when license is active and trial has been used 1`] = `"<div class=\\"euiFlexItem\\"><div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\">Extend your trial</span><div class=\\"euiText euiText--small euiCard__description\\"><p><span>If you’d like to continuing using security, machine learning, and our other awesome <a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co/subscriptions/xpack\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\">Platinum features</a>, request an extension now.</span></p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary\\" href=\\"https://www.elastic.co/trialextension\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\" data-test-subj=\\"extendTrialButton\\" style=\\"margin-top: auto;\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Extend trial</span></span></a></span></div></div>"`;
|
||||
exports[`RequestTrialExtension component should display when license is active and trial has been used 1`] = `"<div class=\\"euiFlexItem\\"><div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\">Extend your trial</span><div class=\\"euiText euiText--small euiCard__description\\"><p><span>If you’d like to continuing using security, machine learning, and our other awesome <a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co/subscriptions/xpack\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\">Platinum features</a>, request an extension now.</span></p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary licenseManagement__marginTop\\" href=\\"https://www.elastic.co/trialextension\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\" data-test-subj=\\"extendTrialButton\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Extend trial</span></span></a></span></div></div>"`;
|
||||
|
||||
exports[`RequestTrialExtension component should display when license is not active and trial has been used 1`] = `"<div class=\\"euiFlexItem\\"><div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\">Extend your trial</span><div class=\\"euiText euiText--small euiCard__description\\"><p><span>If you’d like to continuing using security, machine learning, and our other awesome <a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co/subscriptions/xpack\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\">Platinum features</a>, request an extension now.</span></p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary\\" href=\\"https://www.elastic.co/trialextension\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\" data-test-subj=\\"extendTrialButton\\" style=\\"margin-top: auto;\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Extend trial</span></span></a></span></div></div>"`;
|
||||
exports[`RequestTrialExtension component should display when license is not active and trial has been used 1`] = `"<div class=\\"euiFlexItem\\"><div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\">Extend your trial</span><div class=\\"euiText euiText--small euiCard__description\\"><p><span>If you’d like to continuing using security, machine learning, and our other awesome <a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co/subscriptions/xpack\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\">Platinum features</a>, request an extension now.</span></p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary licenseManagement__marginTop\\" href=\\"https://www.elastic.co/trialextension\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\" data-test-subj=\\"extendTrialButton\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Extend trial</span></span></a></span></div></div>"`;
|
||||
|
||||
exports[`RequestTrialExtension component should display when platinum license is not active and trial has been used 1`] = `"<div class=\\"euiFlexItem\\"><div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\">Extend your trial</span><div class=\\"euiText euiText--small euiCard__description\\"><p><span>If you’d like to continuing using security, machine learning, and our other awesome <a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co/subscriptions/xpack\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\">Platinum features</a>, request an extension now.</span></p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary\\" href=\\"https://www.elastic.co/trialextension\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\" data-test-subj=\\"extendTrialButton\\" style=\\"margin-top: auto;\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Extend trial</span></span></a></span></div></div>"`;
|
||||
exports[`RequestTrialExtension component should display when platinum license is not active and trial has been used 1`] = `"<div class=\\"euiFlexItem\\"><div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\">Extend your trial</span><div class=\\"euiText euiText--small euiCard__description\\"><p><span>If you’d like to continuing using security, machine learning, and our other awesome <a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co/subscriptions/xpack\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\">Platinum features</a>, request an extension now.</span></p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary licenseManagement__marginTop\\" href=\\"https://www.elastic.co/trialextension\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\" data-test-subj=\\"extendTrialButton\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Extend trial</span></span></a></span></div></div>"`;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,158 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`TelemetryOptIn should display when telemetry not opted in 1`] = `
|
||||
<TelemetryOptIn>
|
||||
<EuiText
|
||||
grow={true}
|
||||
>
|
||||
<div
|
||||
className="euiText"
|
||||
>
|
||||
<p>
|
||||
Gold and platinum customers: help support give you better service.
|
||||
</p>
|
||||
</div>
|
||||
</EuiText>
|
||||
<EuiSpacer
|
||||
size="s"
|
||||
>
|
||||
<div
|
||||
className="euiSpacer euiSpacer--s"
|
||||
/>
|
||||
</EuiSpacer>
|
||||
<EuiCheckbox
|
||||
checked={false}
|
||||
compressed={false}
|
||||
disabled={false}
|
||||
id="isOptingInToTelemetry"
|
||||
indeterminate={false}
|
||||
label={
|
||||
<span>
|
||||
Send basic feature usage statistics to Elastic periodically.
|
||||
<EuiPopover
|
||||
anchorPosition="downCenter"
|
||||
button={
|
||||
<EuiLink
|
||||
color="primary"
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
>
|
||||
Read more
|
||||
</EuiLink>
|
||||
}
|
||||
className="licenseManagement__baseline"
|
||||
closePopover={[Function]}
|
||||
hasArrow={true}
|
||||
id="readMorePopover"
|
||||
isOpen={false}
|
||||
ownFocus={true}
|
||||
panelPaddingSize="m"
|
||||
>
|
||||
<EuiText
|
||||
className="licenseManagement__narrowText"
|
||||
grow={true}
|
||||
>
|
||||
<p>
|
||||
This feature periodically sends basic feature usage statistics. This information will not be shared outside of Elastic. See an
|
||||
<EuiLink
|
||||
color="primary"
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
>
|
||||
example
|
||||
</EuiLink>
|
||||
|
||||
or read our
|
||||
|
||||
<EuiLink
|
||||
color="primary"
|
||||
href="https://www.elastic.co/legal/telemetry-privacy-statement"
|
||||
target="_blank"
|
||||
type="button"
|
||||
>
|
||||
telemetry privacy statement
|
||||
</EuiLink>
|
||||
. You can disable this feature any time.
|
||||
</p>
|
||||
</EuiText>
|
||||
</EuiPopover>
|
||||
</span>
|
||||
}
|
||||
onChange={[Function]}
|
||||
>
|
||||
<div
|
||||
className="euiCheckbox"
|
||||
>
|
||||
<input
|
||||
checked={false}
|
||||
className="euiCheckbox__input"
|
||||
disabled={false}
|
||||
id="isOptingInToTelemetry"
|
||||
onChange={[Function]}
|
||||
type="checkbox"
|
||||
/>
|
||||
<div
|
||||
className="euiCheckbox__square"
|
||||
/>
|
||||
<label
|
||||
className="euiCheckbox__label"
|
||||
htmlFor="isOptingInToTelemetry"
|
||||
>
|
||||
<span>
|
||||
Send basic feature usage statistics to Elastic periodically.
|
||||
<EuiPopover
|
||||
anchorPosition="downCenter"
|
||||
button={
|
||||
<EuiLink
|
||||
color="primary"
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
>
|
||||
Read more
|
||||
</EuiLink>
|
||||
}
|
||||
className="licenseManagement__baseline"
|
||||
closePopover={[Function]}
|
||||
hasArrow={true}
|
||||
id="readMorePopover"
|
||||
isOpen={false}
|
||||
ownFocus={true}
|
||||
panelPaddingSize="m"
|
||||
>
|
||||
<EuiOutsideClickDetector
|
||||
onOutsideClick={[Function]}
|
||||
>
|
||||
<div
|
||||
className="euiPopover euiPopover--anchorDownCenter licenseManagement__baseline"
|
||||
id="readMorePopover"
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
>
|
||||
<div
|
||||
className="euiPopover__anchor"
|
||||
>
|
||||
<EuiLink
|
||||
color="primary"
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
>
|
||||
<button
|
||||
className="euiLink euiLink--primary"
|
||||
onClick={[Function]}
|
||||
type="button"
|
||||
>
|
||||
Read more
|
||||
</button>
|
||||
</EuiLink>
|
||||
</div>
|
||||
</div>
|
||||
</EuiOutsideClickDetector>
|
||||
</EuiPopover>
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
</EuiCheckbox>
|
||||
</TelemetryOptIn>
|
||||
`;
|
||||
|
||||
exports[`TelemetryOptIn should not display when telemetry is opted in 1`] = `<TelemetryOptIn />`;
|
||||
File diff suppressed because it is too large
Load diff
|
|
@ -0,0 +1,22 @@
|
|||
/*
|
||||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
||||
* or more contributor license agreements. Licensed under the Elastic License;
|
||||
* you may not use this file except in compliance with the Elastic License.
|
||||
*/
|
||||
import React from 'react';
|
||||
import { TelemetryOptIn } from '../public/components/telemetry_opt_in';
|
||||
import { mount } from 'enzyme';
|
||||
describe('TelemetryOptIn', () => {
|
||||
test('should display when telemetry not opted in', () => {
|
||||
const telemetry = require('../public/lib/telemetry');
|
||||
telemetry.showTelemetryOptIn = () => { return true; };
|
||||
const rendered = mount(<TelemetryOptIn />);
|
||||
expect(rendered).toMatchSnapshot();
|
||||
});
|
||||
test('should not display when telemetry is opted in', () => {
|
||||
const telemetry = require('../public/lib/telemetry');
|
||||
telemetry.showTelemetryOptIn = () => { return false; };
|
||||
const rendered = mount(<TelemetryOptIn />);
|
||||
expect(rendered).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
/*
|
||||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
||||
* or more contributor license agreements. Licensed under the Elastic License;
|
||||
* you may not use this file except in compliance with the Elastic License.
|
||||
*/
|
||||
|
||||
export { TelemetryOptIn } from './telemetry_opt_in';
|
||||
|
|
@ -0,0 +1,118 @@
|
|||
/*
|
||||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
||||
* or more contributor license agreements. Licensed under the Elastic License;
|
||||
* you may not use this file except in compliance with the Elastic License.
|
||||
*/
|
||||
|
||||
import React, { Fragment } from 'react';
|
||||
import {
|
||||
EuiLink,
|
||||
EuiCheckbox,
|
||||
EuiSpacer,
|
||||
EuiText,
|
||||
EuiPopover
|
||||
} from '@elastic/eui';
|
||||
import { showTelemetryOptIn, getTelemetryFetcher, PRIVACY_STATEMENT_URL, OptInExampleFlyout } from '../../lib/telemetry';
|
||||
|
||||
export class TelemetryOptIn extends React.Component {
|
||||
constructor() {
|
||||
super();
|
||||
this.state = {
|
||||
showMoreTelemetryInfo: false,
|
||||
isOptingInToTelemetry: false,
|
||||
showExample: false
|
||||
};
|
||||
}
|
||||
isOptingInToTelemetry = () => {
|
||||
return this.state.isOptingInToTelemetry;
|
||||
}
|
||||
closeReadMorePopover = () => {
|
||||
this.setState({ showMoreTelemetryInfo: false });
|
||||
}
|
||||
onClickReadMore = () => {
|
||||
const { showMoreTelemetryInfo } = this.state;
|
||||
this.setState({ showMoreTelemetryInfo: !showMoreTelemetryInfo });
|
||||
}
|
||||
onClickExample = () => {
|
||||
this.setState({ showExample: true });
|
||||
this.closeReadMorePopover();
|
||||
}
|
||||
onChangeOptIn = event => {
|
||||
const isOptingInToTelemetry = event.target.checked;
|
||||
this.setState({ isOptingInToTelemetry });
|
||||
}
|
||||
render() {
|
||||
const { showMoreTelemetryInfo, isOptingInToTelemetry, showExample } = this.state;
|
||||
const { isStartTrial } = this.props;
|
||||
|
||||
let example = null;
|
||||
if (showExample) {
|
||||
example = (
|
||||
<OptInExampleFlyout
|
||||
onClose={() => this.setState({ showExample: false })}
|
||||
fetchTelemetry={getTelemetryFetcher}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
let toCurrentCustomers;
|
||||
if (!isStartTrial) {
|
||||
toCurrentCustomers = (
|
||||
<Fragment>
|
||||
<EuiText>
|
||||
<p>Gold and platinum customers: help support give you better service.</p>
|
||||
</EuiText>
|
||||
<EuiSpacer size="s"/>
|
||||
</Fragment>
|
||||
);
|
||||
}
|
||||
|
||||
const readMoreButton = (
|
||||
<EuiLink onClick={this.onClickReadMore}>
|
||||
Read more
|
||||
</EuiLink>
|
||||
);
|
||||
|
||||
const popover = (
|
||||
<EuiPopover
|
||||
ownFocus
|
||||
id="readMorePopover"
|
||||
button={readMoreButton}
|
||||
isOpen={showMoreTelemetryInfo}
|
||||
closePopover={this.closeReadMorePopover}
|
||||
className="licenseManagement__baseline"
|
||||
>
|
||||
<EuiText className="licenseManagement__narrowText" >
|
||||
<p>
|
||||
This feature periodically sends basic feature usage statistics.
|
||||
This information will not be shared outside of Elastic.
|
||||
See an <EuiLink onClick={this.onClickExample}>example</EuiLink>
|
||||
{' '}
|
||||
or read our
|
||||
{' '}
|
||||
<EuiLink
|
||||
href={PRIVACY_STATEMENT_URL}
|
||||
target="_blank"
|
||||
>
|
||||
telemetry privacy statement
|
||||
</EuiLink>.
|
||||
You can disable this feature any time.
|
||||
</p>
|
||||
</EuiText>
|
||||
</EuiPopover>
|
||||
);
|
||||
|
||||
return showTelemetryOptIn() ? (
|
||||
<Fragment>
|
||||
{example}
|
||||
{toCurrentCustomers}
|
||||
<EuiCheckbox
|
||||
label={<span>Send basic feature usage statistics to Elastic periodically. {popover}</span>}
|
||||
id="isOptingInToTelemetry"
|
||||
checked={isOptingInToTelemetry}
|
||||
onChange={this.onChangeOptIn}
|
||||
/>
|
||||
</Fragment>
|
||||
) : null;
|
||||
}
|
||||
}
|
||||
32
x-pack/plugins/license_management/public/lib/telemetry.js
Normal file
32
x-pack/plugins/license_management/public/lib/telemetry.js
Normal file
|
|
@ -0,0 +1,32 @@
|
|||
/*
|
||||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
||||
* or more contributor license agreements. Licensed under the Elastic License;
|
||||
* you may not use this file except in compliance with the Elastic License.
|
||||
*/
|
||||
|
||||
import { fetchTelemetry } from '../../../xpack_main/public/hacks/fetch_telemetry';
|
||||
export { PRIVACY_STATEMENT_URL } from '../../../xpack_main/common/constants';
|
||||
export { TelemetryOptInProvider } from '../../../xpack_main/public/services/telemetry_opt_in';
|
||||
export { OptInExampleFlyout } from '../../../xpack_main/public/components';
|
||||
|
||||
let telemetryEnabled;
|
||||
let httpClient;
|
||||
let telemetryOptInService;
|
||||
export const setTelemetryEnabled = (isTelemetryEnabled) => {
|
||||
telemetryEnabled = isTelemetryEnabled;
|
||||
};
|
||||
export const setHttpClient = (anHttpClient) => {
|
||||
httpClient = anHttpClient;
|
||||
};
|
||||
export const setTelemetryOptInService = (aTelemetryOptInService) => {
|
||||
telemetryOptInService = aTelemetryOptInService;
|
||||
};
|
||||
export const optInToTelemetry = async (enableTelemetry) => {
|
||||
await telemetryOptInService.setOptIn(enableTelemetry);
|
||||
};
|
||||
export const showTelemetryOptIn = () => {
|
||||
return telemetryEnabled && !telemetryOptInService.getOptIn();
|
||||
};
|
||||
export const getTelemetryFetcher = () => {
|
||||
return fetchTelemetry(httpClient);
|
||||
};
|
||||
|
|
@ -8,6 +8,8 @@ import React from 'react';
|
|||
import { render, unmountComponentAtNode } from 'react-dom';
|
||||
import { Provider } from 'react-redux';
|
||||
import { HashRouter } from 'react-router-dom';
|
||||
import { setTelemetryOptInService, setTelemetryEnabled, setHttpClient, TelemetryOptInProvider } from './lib/telemetry';
|
||||
|
||||
|
||||
import App from './app';
|
||||
import { BASE_PATH } from "../common/constants/base_path";
|
||||
|
|
@ -49,7 +51,14 @@ const manageAngularLifecycle = ($scope, $route, elem) => {
|
|||
elem && unmountComponentAtNode(elem);
|
||||
});
|
||||
};
|
||||
|
||||
const initializeTelemetry = ($injector) => {
|
||||
const telemetryEnabled = $injector.get('telemetryEnabled');
|
||||
const Private = $injector.get('Private');
|
||||
const telemetryOptInProvider = Private(TelemetryOptInProvider);
|
||||
setTelemetryOptInService(telemetryOptInProvider);
|
||||
setTelemetryEnabled(telemetryEnabled);
|
||||
setHttpClient($injector.get('$http'));
|
||||
};
|
||||
routes
|
||||
.when(`${BASE_PATH}:view?`, {
|
||||
template: template,
|
||||
|
|
@ -57,6 +66,7 @@ routes
|
|||
controller: class LicenseManagementController {
|
||||
|
||||
constructor($injector, $window, $rootScope, $scope, $route, kbnUrl) {
|
||||
initializeTelemetry($injector);
|
||||
let autoLogout = null;
|
||||
/* if security is disabled, there will be no autoLogout service,
|
||||
so just substitute noop function in that case */
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@ export const AddLicense = ({ uploadPath = `#${BASE_PATH}upload_license` }) => {
|
|||
footer={
|
||||
<EuiButton
|
||||
data-test-subj="updateLicenseButton"
|
||||
style={{ marginTop: 'auto' }}
|
||||
className="licenseManagement__marginTop"
|
||||
href={uploadPath}
|
||||
>
|
||||
Update license
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@ export const RequestTrialExtension = ({ shouldShowRequestTrialExtension }) => {
|
|||
footer={
|
||||
<EuiButton
|
||||
data-test-subj="extendTrialButton"
|
||||
style={{ marginTop: 'auto' }}
|
||||
className="licenseManagement__marginTop"
|
||||
target="_blank"
|
||||
href="https://www.elastic.co/trialextension"
|
||||
>
|
||||
|
|
|
|||
|
|
@ -7,17 +7,24 @@
|
|||
import React from 'react';
|
||||
|
||||
import {
|
||||
EuiButtonEmpty,
|
||||
EuiButton,
|
||||
EuiFlexGroup,
|
||||
EuiFlexItem,
|
||||
EuiCard,
|
||||
EuiLink,
|
||||
EuiOverlayMask,
|
||||
EuiConfirmModal,
|
||||
EuiText
|
||||
EuiText,
|
||||
EuiModal,
|
||||
EuiModalFooter,
|
||||
EuiModalHeader,
|
||||
EuiModalBody,
|
||||
EuiModalHeaderTitle
|
||||
} from '@elastic/eui';
|
||||
|
||||
import { ELASTIC_WEBSITE_URL, DOC_LINK_VERSION } from 'ui/documentation_links';
|
||||
|
||||
import { TelemetryOptIn } from '../../../components/telemetry_opt_in';
|
||||
import { optInToTelemetry } from '../../../lib/telemetry';
|
||||
const esBase = `${ELASTIC_WEBSITE_URL}guide/en/elasticsearch/reference/${DOC_LINK_VERSION}`;
|
||||
const securityDocumentationLink = `${esBase}/security-settings.html`;
|
||||
|
||||
|
|
@ -30,63 +37,110 @@ export class StartTrial extends React.PureComponent {
|
|||
componentWillMount() {
|
||||
this.props.loadTrialStatus();
|
||||
}
|
||||
|
||||
startLicenseTrial = () => {
|
||||
const { startLicenseTrial } = this.props;
|
||||
if (this.telemetryOptIn.isOptingInToTelemetry()) {
|
||||
optInToTelemetry(true);
|
||||
}
|
||||
startLicenseTrial();
|
||||
}
|
||||
cancel = () => {
|
||||
this.setState({ showConfirmation: false });
|
||||
}
|
||||
acknowledgeModal() {
|
||||
const { showConfirmation } = this.state;
|
||||
if (!showConfirmation) {
|
||||
return null;
|
||||
}
|
||||
const { startLicenseTrial } = this.props;
|
||||
|
||||
return (
|
||||
<EuiOverlayMask>
|
||||
<EuiConfirmModal
|
||||
title="Start your free 30-day trial"
|
||||
onCancel={() => this.setState({ showConfirmation: false })}
|
||||
onConfirm={() => startLicenseTrial()}
|
||||
cancelButtonText="Cancel"
|
||||
confirmButtonText="Start my trial"
|
||||
<EuiModal
|
||||
className="licenseManagement__modal"
|
||||
onClose={this.cancel}
|
||||
>
|
||||
<div>
|
||||
<EuiText>
|
||||
<p>
|
||||
<EuiModalHeader>
|
||||
<EuiModalHeaderTitle data-test-subj="confirmModalTitleText">
|
||||
Start your free 30-day trial
|
||||
</EuiModalHeaderTitle>
|
||||
</EuiModalHeader>
|
||||
<EuiModalBody>
|
||||
<EuiText data-test-subj="confirmModalBodyText">
|
||||
<div>
|
||||
<EuiText>
|
||||
<p>
|
||||
This trial is for the full set of{' '}
|
||||
<EuiLink
|
||||
href="https://www.elastic.co/subscriptions/xpack"
|
||||
target="_blank"
|
||||
>
|
||||
<EuiLink
|
||||
href="https://www.elastic.co/subscriptions/xpack"
|
||||
target="_blank"
|
||||
>
|
||||
Platinum features
|
||||
</EuiLink> of the Elastic Stack. You'll get immediate access to:
|
||||
</p>
|
||||
<ul>
|
||||
<li>Machine learning</li>
|
||||
<li>Alerting</li>
|
||||
<li>Graph capabilities</li>
|
||||
<li>JDBC connectivity for SQL</li>
|
||||
</ul>
|
||||
<p>
|
||||
</EuiLink> of the Elastic Stack. You'll get immediate access to:
|
||||
</p>
|
||||
<ul>
|
||||
<li>Machine learning</li>
|
||||
<li>Alerting</li>
|
||||
<li>Graph capabilities</li>
|
||||
<li>JDBC connectivity for SQL</li>
|
||||
</ul>
|
||||
<p>
|
||||
Security features, such as authentication (native, AD/LDAP, SAML,
|
||||
PKI), role-based access control, and auditing, require
|
||||
configuration. See the{' '}
|
||||
<EuiLink
|
||||
href={securityDocumentationLink}
|
||||
target="_blank"
|
||||
>
|
||||
<EuiLink
|
||||
href={securityDocumentationLink}
|
||||
target="_blank"
|
||||
>
|
||||
documentation
|
||||
</EuiLink>{' '}
|
||||
</EuiLink>{' '}
|
||||
for instructions.
|
||||
</p>
|
||||
<p>
|
||||
</p>
|
||||
<p>
|
||||
By starting this trial, you agree that it is subject to these{' '}
|
||||
<EuiLink
|
||||
href="https://elastic.co/legal/trial_license"
|
||||
target="_blank"
|
||||
>
|
||||
<EuiLink
|
||||
href="https://elastic.co/legal/trial_license"
|
||||
target="_blank"
|
||||
>
|
||||
terms and conditions
|
||||
</EuiLink>.
|
||||
</p>
|
||||
</EuiLink>.
|
||||
</p>
|
||||
</EuiText>
|
||||
</div>
|
||||
</EuiText>
|
||||
</div>
|
||||
</EuiConfirmModal>
|
||||
</EuiModalBody>
|
||||
|
||||
<EuiModalFooter>
|
||||
<EuiFlexGroup justifyContent="spaceBetween" alignItems="center">
|
||||
<EuiFlexItem grow={false}>
|
||||
<TelemetryOptIn isStartTrial={true} ref={(ref) => {this.telemetryOptIn = ref; }}/>
|
||||
</EuiFlexItem>
|
||||
<EuiFlexItem grow={false} className="licenseManagement__ieFlex">
|
||||
<EuiFlexGroup responsive={false}>
|
||||
<EuiFlexItem grow={false} className="licenseManagement__ieFlex">
|
||||
<EuiButtonEmpty
|
||||
data-test-subj="confirmModalCancelButton"
|
||||
onClick={this.cancel}
|
||||
buttonRef={this.cancelRef}
|
||||
>
|
||||
Cancel
|
||||
</EuiButtonEmpty>
|
||||
</EuiFlexItem>
|
||||
<EuiFlexItem grow={false} className="licenseManagement__ieFlex">
|
||||
<EuiButton
|
||||
data-test-subj="confirmModalConfirmButton"
|
||||
onClick={this.startLicenseTrial}
|
||||
fill
|
||||
buttonRef={this.confirmRef}
|
||||
color="primary"
|
||||
>
|
||||
Start my trial
|
||||
</EuiButton>
|
||||
</EuiFlexItem>
|
||||
</EuiFlexGroup>
|
||||
</EuiFlexItem>
|
||||
</EuiFlexGroup>
|
||||
</EuiModalFooter>
|
||||
</EuiModal>
|
||||
</EuiOverlayMask>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
* you may not use this file except in compliance with the Elastic License.
|
||||
*/
|
||||
|
||||
import React from 'react';
|
||||
import React, { Fragment } from 'react';
|
||||
import { BASE_PATH } from '../../../common/constants';
|
||||
import {
|
||||
EuiButton,
|
||||
|
|
@ -18,9 +18,11 @@ import {
|
|||
EuiTitle,
|
||||
EuiFlexGroup,
|
||||
EuiFlexItem,
|
||||
EuiPanel
|
||||
EuiPageContent,
|
||||
EuiPageContentBody,
|
||||
} from '@elastic/eui';
|
||||
|
||||
import { TelemetryOptIn } from '../../components/telemetry_opt_in';
|
||||
import { optInToTelemetry } from '../../lib/telemetry';
|
||||
export class UploadLicense extends React.PureComponent {
|
||||
componentDidMount() {
|
||||
this.props.addUploadErrorMessage('');
|
||||
|
|
@ -29,11 +31,10 @@ export class UploadLicense extends React.PureComponent {
|
|||
const file = this.file;
|
||||
const fr = new FileReader();
|
||||
fr.onload = ({ target: { result } }) => {
|
||||
this.props.uploadLicense(
|
||||
result,
|
||||
this.props.currentLicenseType,
|
||||
acknowledge
|
||||
);
|
||||
if (this.telemetryOptIn.isOptingInToTelemetry()) {
|
||||
optInToTelemetry(true);
|
||||
}
|
||||
this.props.uploadLicense(result, this.props.currentLicenseType, acknowledge);
|
||||
};
|
||||
fr.readAsText(file);
|
||||
};
|
||||
|
|
@ -43,10 +44,7 @@ export class UploadLicense extends React.PureComponent {
|
|||
};
|
||||
|
||||
acknowledgeModal() {
|
||||
const {
|
||||
needsAcknowledgement,
|
||||
messages: [firstLine, ...messages] = []
|
||||
} = this.props;
|
||||
const { needsAcknowledgement, messages: [firstLine, ...messages] = [] } = this.props;
|
||||
if (!needsAcknowledgement) {
|
||||
return null;
|
||||
}
|
||||
|
|
@ -63,7 +61,9 @@ export class UploadLicense extends React.PureComponent {
|
|||
<EuiText>{firstLine}</EuiText>
|
||||
<EuiText>
|
||||
<ul>
|
||||
{messages.map(message => <li key={message}>{message}</li>)}
|
||||
{messages.map(message => (
|
||||
<li key={message}>{message}</li>
|
||||
))}
|
||||
</ul>
|
||||
</EuiText>
|
||||
</div>
|
||||
|
|
@ -95,53 +95,59 @@ export class UploadLicense extends React.PureComponent {
|
|||
render() {
|
||||
const { currentLicenseType, applying } = this.props;
|
||||
return (
|
||||
<div className="licenseManagement__contain">
|
||||
<EuiFlexGroup justifyContent="spaceAround">
|
||||
<EuiFlexItem grow={false}>
|
||||
<EuiTitle size="l">
|
||||
<h1>Upload your license</h1>
|
||||
</EuiTitle>
|
||||
</EuiFlexItem>
|
||||
</EuiFlexGroup>
|
||||
<EuiSpacer />
|
||||
<EuiPanel>
|
||||
{this.acknowledgeModal()}
|
||||
<Fragment>
|
||||
<EuiTitle className="eui-textCenter" size="l">
|
||||
<h1>Upload your license</h1>
|
||||
</EuiTitle>
|
||||
|
||||
<EuiSpacer />
|
||||
|
||||
<EuiPageContent horizontalPosition="center" verticalPosition="center">
|
||||
<EuiPageContentBody>
|
||||
{this.acknowledgeModal()}
|
||||
|
||||
<EuiText>
|
||||
Your license key is a JSON file with a signature attached.
|
||||
</EuiText>
|
||||
<EuiText>
|
||||
Uploading a license will replace your current{' '}
|
||||
<strong>{currentLicenseType.toUpperCase()}</strong> license.
|
||||
</EuiText>
|
||||
<EuiSpacer />
|
||||
<EuiForm
|
||||
isInvalid={!!this.errorMessage()}
|
||||
error={this.errorMessage()}
|
||||
>
|
||||
<EuiText>
|
||||
<EuiFilePicker
|
||||
id="licenseFile"
|
||||
initialPromptText="Select or drag your license file"
|
||||
onChange={this.handleFile}
|
||||
/>
|
||||
<p>Your license key is a JSON file with a signature attached.</p>
|
||||
<p>
|
||||
Uploading a license will replace your current{' '}
|
||||
<strong>{currentLicenseType.toUpperCase()}</strong> license.
|
||||
</p>
|
||||
</EuiText>
|
||||
<EuiSpacer size="m" />
|
||||
<EuiFlexGroup justifyContent="spaceBetween">
|
||||
<EuiFlexItem grow={false}>
|
||||
<EuiButtonEmpty href={`#${BASE_PATH}home`}>
|
||||
Cancel
|
||||
</EuiButtonEmpty>
|
||||
</EuiFlexItem>
|
||||
<EuiFlexItem grow={false}>
|
||||
<EuiButton data-test-subj="uploadLicenseButton" fill isLoading={applying} onClick={this.submit}>
|
||||
{applying ? 'Uploading...' : 'Upload'}
|
||||
</EuiButton>
|
||||
</EuiFlexItem>
|
||||
</EuiFlexGroup>
|
||||
</EuiForm>
|
||||
</EuiPanel>
|
||||
</div>
|
||||
<EuiSpacer />
|
||||
<EuiForm isInvalid={!!this.errorMessage()} error={this.errorMessage()}>
|
||||
<EuiText>
|
||||
<EuiFilePicker
|
||||
id="licenseFile"
|
||||
initialPromptText="Select or drag your license file"
|
||||
onChange={this.handleFile}
|
||||
/>
|
||||
</EuiText>
|
||||
<EuiSpacer size="m" />
|
||||
<TelemetryOptIn
|
||||
ref={ref => {
|
||||
this.telemetryOptIn = ref;
|
||||
}}
|
||||
/>
|
||||
<EuiSpacer size="m" />
|
||||
<EuiFlexGroup justifyContent="spaceBetween">
|
||||
<EuiFlexItem grow={false}>
|
||||
<EuiButtonEmpty href={`#${BASE_PATH}home`}>Cancel</EuiButtonEmpty>
|
||||
</EuiFlexItem>
|
||||
<EuiFlexItem grow={false}>
|
||||
<EuiButton
|
||||
data-test-subj="uploadLicenseButton"
|
||||
fill
|
||||
isLoading={applying}
|
||||
onClick={this.submit}
|
||||
>
|
||||
{applying ? 'Uploading...' : 'Upload'}
|
||||
</EuiButton>
|
||||
</EuiFlexItem>
|
||||
</EuiFlexGroup>
|
||||
</EuiForm>
|
||||
</EuiPageContentBody>
|
||||
</EuiPageContent>
|
||||
</Fragment>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,10 +11,23 @@
|
|||
min-height: auto;
|
||||
}
|
||||
|
||||
.licenseManagement__pageContent {
|
||||
flex-grow: 0; // Temporary fix for EUI bug.
|
||||
}
|
||||
// EUITODO: Fix modal width/max-width
|
||||
.licenseManagement__modal {
|
||||
width: 70vw;
|
||||
|
||||
.licenseManagement__contain {
|
||||
margin: auto;
|
||||
@media only screen and (max-width: 767px) {
|
||||
width: ~"calc(100vw + 2px)";
|
||||
}
|
||||
}
|
||||
.licenseManagement__baseline {
|
||||
vertical-align: baseline;
|
||||
}
|
||||
.licenseManagement__narrowText {
|
||||
width: 240px;
|
||||
}
|
||||
.licenseManagement__marginTop {
|
||||
margin-top: auto;
|
||||
}
|
||||
.licenseManagement__ieFlex {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue