export interface Props {
edition: Edition;
+ editions: Edition[];
onClose: () => void;
updateEditionStatus: (editionStatus: EditionStatus) => void;
}
render() {
const { edition } = this.props;
- const { status } = this.state;
+ const { loading, status } = this.state;
const header = translateWithParameters('marketplace.install_x', edition.name);
return (
<Modal
<LicenseEditionSet
className="modal-body"
edition={edition}
+ editions={this.props.editions}
updateLicense={this.handleLicenseChange}
/>
<footer className="modal-foot">
- {this.state.loading && <i className="spinner spacer-right" />}
+ {loading && <i className="spinner spacer-right" />}
{status &&
['NO_INSTALL', 'AUTOMATIC_INSTALL'].includes(status) && (
- <button className="js-confirm" onClick={this.handleConfirmClick}>
+ <button className="js-confirm" onClick={this.handleConfirmClick} disabled={loading}>
{status === 'NO_INSTALL' ? translate('save') : translate('marketplace.install')}
</button>
)}
export interface Props {
className?: string;
- edition: Edition;
+ edition?: Edition;
+ editions: Edition[];
updateLicense: (license?: string, status?: string) => void;
}
interface State {
license: string;
+ licenseEdition?: Edition;
loading: boolean;
previewStatus?: string;
}
constructor(props: Props) {
super(props);
this.state = { license: '', loading: false };
- this.fetchLicensePreview = debounce(this.fetchLicensePreview, 250);
+ this.fetchLicensePreview = debounce(this.fetchLicensePreview, 100);
}
componentDidMount() {
fetchLicensePreview = (license: string) =>
getLicensePreview({ license }).then(
- r => {
+ ({ previewStatus, nextEditionKey }) => {
if (this.mounted) {
- this.updateLicense(license, r.previewStatus);
+ this.updateLicense(
+ license,
+ this.props.editions.find(edition => edition.key === nextEditionKey),
+ previewStatus
+ );
}
},
() => {
if (this.mounted) {
- this.updateLicense(license, undefined);
+ this.updateLicense(license, undefined, undefined);
}
}
);
this.fetchLicensePreview(license);
this.setState({ license });
} else {
- this.updateLicense(license, undefined);
+ this.updateLicense(license, undefined, undefined);
}
};
- updateLicense = (license: string, previewStatus?: string) => {
- this.setState({ license, previewStatus });
+ updateLicense = (license: string, licenseEdition?: Edition, previewStatus?: string) => {
+ this.setState({ license, licenseEdition, previewStatus });
this.props.updateLicense(license, previewStatus);
};
render() {
const { className, edition } = this.props;
- const { license, previewStatus } = this.state;
+ const { license, licenseEdition, previewStatus } = this.state;
+
return (
<div className={className}>
- <label htmlFor="set-license">
- {translateWithParameters('marketplace.enter_license_for_x', edition.name)}
- <em className="mandatory">*</em>
- </label>
+ {edition && (
+ <label className="spacer-bottom" htmlFor="set-license">
+ {translateWithParameters('marketplace.enter_license_for_x', edition.name)}
+ <em className="mandatory">*</em>
+ </label>
+ )}
<textarea
autoFocus={true}
id="set-license"
- className="spacer-top display-block"
+ className="display-block"
cols={62}
onChange={this.handleLicenseChange}
required={true}
rows={6}
value={license}
/>
- {previewStatus && (
+ {previewStatus &&
+ licenseEdition && (
<p
className={classNames('alert spacer-top', {
'alert-warning': previewStatus === 'AUTOMATIC_INSTALL',
})}>
{translateWithParameters(
'marketplace.license_preview_status.' + previewStatus,
- edition.name
+ licenseEdition.name
)}
{previewStatus === 'MANUAL_INSTALL' && (
<p className="spacer-top">
<a
className="button"
- download={`sonarqube-${edition.name}.zip`}
- href={edition.download_link}
+ download={`sonarqube-${licenseEdition.name}.zip`}
+ href={licenseEdition.download_link}
target="_blank">
{translate('marketplace.download_package')}
</a>
)}
</p>
)}
- <a
- className="display-inline-block spacer-top"
- href={edition.request_license_link}
- target="_blank">
- {translate('marketplace.i_need_a_license')}
- </a>
+ {edition && (
+ <a
+ className="display-inline-block spacer-top"
+ href={edition.request_license_link}
+ target="_blank">
+ {translate('marketplace.i_need_a_license')}
+ </a>
+ )}
</div>
);
}