source.dussan.org Git - sonarqube.git/blob

   1 /*
   2  * SonarQube
   3  * Copyright (C) 2009-2021 SonarSource SA
   4  * mailto:info AT sonarsource DOT com
   5  *
   6  * This program is free software; you can redistribute it and/or
   7  * modify it under the terms of the GNU Lesser General Public
   8  * License as published by the Free Software Foundation; either
   9  * version 3 of the License, or (at your option) any later version.
  10  *
  11  * This program is distributed in the hope that it will be useful,
  12  * but WITHOUT ANY WARRANTY; without even the implied warranty of
  13  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
  14  * Lesser General Public License for more details.
  15  *
  16  * You should have received a copy of the GNU Lesser General Public License
  17  * along with this program; if not, write to the Free Software Foundation,
  18  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  19  */
  20 import * as React from 'react';
  21 import { getProjectBadgesToken } from '../../../../../../api/project-badges';
  22 import CodeSnippet from '../../../../../../components/common/CodeSnippet';
  23 import { Alert } from '../../../../../../components/ui/Alert';
  24 import { getBranchLikeQuery } from '../../../../../../helpers/branch-like';
  25 import { translate } from '../../../../../../helpers/l10n';
  26 import { BranchLike } from '../../../../../../types/branch-like';
  27 import { MetricKey } from '../../../../../../types/metrics';
  28 import BadgeButton from './BadgeButton';
  29 import BadgeParams from './BadgeParams';
  30 import './styles.css';
  31 import { BadgeOptions, BadgeType, getBadgeSnippet, getBadgeUrl } from './utils';
  32
  33 interface Props {
  34   branchLike?: BranchLike;
  35   metrics: T.Dict<T.Metric>;
  36   project: string;
  37   qualifier: string;
  38 }
  39
  40 interface State {
  41   token: string;
  42   selectedType: BadgeType;
  43   badgeOptions: BadgeOptions;
  44 }
  45
  46 export default class ProjectBadges extends React.PureComponent<Props, State> {
  47   mounted = false;
  48   state: State = {
  49     token: '',
  50     selectedType: BadgeType.measure,
  51     badgeOptions: { metric: MetricKey.alert_status }
  52   };
  53
  54   componentDidMount() {
  55     this.mounted = true;
  56     this.fetchToken();
  57   }
  58
  59   componentWillUnmount() {
  60     this.mounted = false;
  61   }
  62
  63   async fetchToken() {
  64     const { project } = this.props;
  65     const token = await getProjectBadgesToken(project);
  66     if (this.mounted) {
  67       this.setState({ token });
  68     }
  69   }
  70
  71   handleSelectBadge = (selectedType: BadgeType) => {
  72     this.setState({ selectedType });
  73   };
  74
  75   handleUpdateOptions = (options: Partial<BadgeOptions>) => {
  76     this.setState(state => ({ badgeOptions: { ...state.badgeOptions, ...options } }));
  77   };
  78
  79   render() {
  80     const { branchLike, project, qualifier } = this.props;
  81     const { selectedType, badgeOptions, token } = this.state;
  82     const fullBadgeOptions = { project, ...badgeOptions, ...getBranchLikeQuery(branchLike) };
  83
  84     return (
  85       <div className="display-flex-column">
  86         <h3>{translate('overview.badges.get_badge', qualifier)}</h3>
  87         <p className="big-spacer-bottom">{translate('overview.badges.description', qualifier)}</p>
  88         <BadgeButton
  89           onClick={this.handleSelectBadge}
  90           selected={BadgeType.measure === selectedType}
  91           type={BadgeType.measure}
  92           url={getBadgeUrl(BadgeType.measure, fullBadgeOptions, token)}
  93         />
  94         <p className="huge-spacer-bottom spacer-top">
  95           {translate('overview.badges', BadgeType.measure, 'description', qualifier)}
  96         </p>
  97         <BadgeButton
  98           onClick={this.handleSelectBadge}
  99           selected={BadgeType.qualityGate === selectedType}
 100           type={BadgeType.qualityGate}
 101           url={getBadgeUrl(BadgeType.qualityGate, fullBadgeOptions, token)}
 102         />
 103         <p className="huge-spacer-bottom spacer-top">
 104           {translate('overview.badges', BadgeType.qualityGate, 'description', qualifier)}
 105         </p>
 106         <BadgeParams
 107           className="big-spacer-bottom display-flex-column"
 108           metrics={this.props.metrics}
 109           options={badgeOptions}
 110           type={selectedType}
 111           updateOptions={this.handleUpdateOptions}
 112         />
 113         <Alert variant="warning">{translate('overview.badges.leak_warning')}</Alert>
 114         <CodeSnippet
 115           isOneLine={true}
 116           snippet={getBadgeSnippet(selectedType, fullBadgeOptions, token)}
 117         />
 118       </div>
 119     );
 120   }
 121 }