From 769c503adc33e48f6dcec505d7646f8b53c11b8c Mon Sep 17 00:00:00 2001 From: Stas Vilchik Date: Wed, 29 Jun 2016 17:15:49 +0200 Subject: [PATCH] apply feedback for the quality profiles page --- .../quality-profiles/details/ProfileHeader.js | 30 ++++++++--- .../details/ProfileProjects.js | 3 +- .../quality-profiles/details/ProfileRules.js | 53 ++++++++++++++---- .../details/ProfileRulesRow.js | 29 ++++------ .../quality-profiles/details/ProgressBar.js | 54 ------------------- .../quality-profiles/home/ProfilesList.js | 7 ++- .../home/ProfilesListHeader.js | 2 +- .../main/js/apps/quality-profiles/styles.css | 10 ---- .../sonar-web/src/main/less/init/links.less | 2 +- .../resources/org/sonar/l10n/core.properties | 9 ++-- 10 files changed, 91 insertions(+), 108 deletions(-) delete mode 100644 server/sonar-web/src/main/js/apps/quality-profiles/details/ProgressBar.js diff --git a/server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileHeader.js b/server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileHeader.js index 1062f4cca72..62706071207 100644 --- a/server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileHeader.js +++ b/server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileHeader.js @@ -26,6 +26,7 @@ import DeleteProfileView from '../views/DeleteProfileView'; import { ProfileType } from '../propTypes'; import { translate } from '../../../helpers/l10n'; import { setDefaultProfile } from '../../../api/quality-profiles'; +import { getRulesUrl } from '../../../helpers/urls'; export default class ProfileHeader extends React.Component { static propTypes = { @@ -84,7 +85,10 @@ export default class ProfileHeader extends React.Component { '/api/qualityprofiles/backup?profileKey=' + encodeURIComponent(profile.key); - // TODO fix inline styles + const activateMoreUrl = getRulesUrl({ + qprofile: this.props.profile.key, + activation: 'false' + }); return (
@@ -92,6 +96,12 @@ export default class ProfileHeader extends React.Component { {translate('quality_profiles.page')} + {' / '} + + {profile.languageName} +

@@ -100,9 +110,6 @@ export default class ProfileHeader extends React.Component { className="link-base-color"> {profile.name} - - {this.props.profile.languageName} -

@@ -110,8 +117,7 @@ export default class ProfileHeader extends React.Component {
  • + className="button"> {translate('changelog')}
    • @@ -124,6 +130,18 @@ export default class ProfileHeader extends React.Component {
      +
    • + + {translate('compare')} + +
      • +
    • + + {translate('quality_profiles.activate_more_rules')} + +
    • - + {' '} {project.name}
      • diff --git a/server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileRules.js b/server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileRules.js index 539878dec9f..dd04d7cffde 100644 --- a/server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileRules.js +++ b/server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileRules.js @@ -132,6 +132,25 @@ export default class ProfileRules extends React.Component { ); } + renderActiveTotal () { + const rulesUrl = getRulesUrl({ + qprofile: this.props.profile.key, + activation: 'false' + }); + + if (this.state.total == null) { + return null; + } + + return ( + + + {formatMeasure(this.state.total, 'SHORT_INT')} + + + ); + } + getTooltipForType (type) { const { count } = this.state.activatedByType[type]; const total = this.state.allByType[type].count; @@ -162,6 +181,26 @@ export default class ProfileRules extends React.Component { ); } + renderTotalForType (type) { + const rulesUrl = getRulesUrl({ + qprofile: this.props.profile.key, + activation: 'false', + types: type + }); + + const { count } = this.state.allByType[type]; + + if (count == null) { + return null; + } + + return ( + + {formatMeasure(count, 'SHORT_INT')} + + ); + } + renderDeprecated () { const { profile } = this.props; @@ -186,8 +225,6 @@ export default class ProfileRules extends React.Component { } render () { - const { total, activatedTotal, allByType, activatedByType } = this.state; - const activateMoreUrl = getRulesUrl({ qprofile: this.props.profile.key, activation: 'false' @@ -212,21 +249,17 @@ export default class ProfileRules extends React.Component {
      • + renderCount={this.renderActiveCount.bind(this)} + renderTotal={this.renderActiveTotal.bind(this)}/>
        • {TYPES.map(type => (
      • + renderCount={this.renderCountForType.bind(this, type)} + renderTotal={this.renderTotalForType.bind(this, type)}/>
        • ))}
      diff --git a/server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileRulesRow.js b/server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileRulesRow.js index 6baf9ca811e..e945ed924ad 100644 --- a/server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileRulesRow.js +++ b/server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileRulesRow.js @@ -18,35 +18,26 @@ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ import React from 'react'; -import ProgressBar from './ProgressBar'; export default class ProfileRulesRow extends React.Component { static propTypes = { - count: React.PropTypes.number, - total: React.PropTypes.number, - tooltip: React.PropTypes.string, renderTitle: React.PropTypes.func.isRequired, - renderCount: React.PropTypes.func.isRequired + renderCount: React.PropTypes.func.isRequired, + renderTotal: React.PropTypes.func.isRequired }; render () { - const { total, count, tooltip, renderTitle, renderCount } = this.props; + const { renderTitle, renderCount, renderTotal } = this.props; return ( -
      -
      -
      - {renderTitle()} -
      -
      - {renderCount()} -
      +
      +
      + {renderTitle()}
      -
      - +
      + {renderCount()} + {' / '} + {renderTotal()}
      ); diff --git a/server/sonar-web/src/main/js/apps/quality-profiles/details/ProgressBar.js b/server/sonar-web/src/main/js/apps/quality-profiles/details/ProgressBar.js deleted file mode 100644 index 5efc85f7907..00000000000 --- a/server/sonar-web/src/main/js/apps/quality-profiles/details/ProgressBar.js +++ /dev/null @@ -1,54 +0,0 @@ -/* - * SonarQube - * Copyright (C) 2009-2016 SonarSource SA - * mailto:contact AT sonarsource DOT com - * - * This program is free software; you can redistribute it and/or - * modify it under the terms of the GNU Lesser General Public - * License as published by the Free Software Foundation; either - * version 3 of the License, or (at your option) any later version. - * - * This program is distributed in the hope that it will be useful, - * but WITHOUT ANY WARRANTY; without even the implied warranty of - * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU - * Lesser General Public License for more details. - * - * You should have received a copy of the GNU Lesser General Public License - * along with this program; if not, write to the Free Software Foundation, - * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. - */ -import React from 'react'; - -export default class ProgressBar extends React.Component { - static propTypes = { - width: React.PropTypes.number.isRequired, - height: React.PropTypes.number, - count: React.PropTypes.number.isRequired, - total: React.PropTypes.number.isRequired - }; - - static defaultProps = { - height: 2 - }; - - render () { - const { width, height } = this.props; - const p = this.props.total > 0 ? this.props.count / this.props.total : 0; - const fillWidth = this.props.width * p; - - const commonProps = { x: 0, y: 0, rx: 2, height }; - - return ( - - - - - ); - } -} diff --git a/server/sonar-web/src/main/js/apps/quality-profiles/home/ProfilesList.js b/server/sonar-web/src/main/js/apps/quality-profiles/home/ProfilesList.js index b4b10f4e4ae..e153d03a216 100644 --- a/server/sonar-web/src/main/js/apps/quality-profiles/home/ProfilesList.js +++ b/server/sonar-web/src/main/js/apps/quality-profiles/home/ProfilesList.js @@ -21,6 +21,7 @@ import React from 'react'; import { PropTypes as RouterPropTypes } from 'react-router'; import groupBy from 'lodash/groupBy'; import pick from 'lodash/pick'; +import sortBy from 'lodash/sortBy'; import ProfilesListRow from './ProfilesListRow'; import ProfilesListHeader from './ProfilesListHeader'; import RestoreBuiltInProfilesView from '../views/RestoreBuiltInProfilesView'; @@ -64,7 +65,7 @@ export default class ProfilesList extends React.Component { {')'} {this.props.canAdmin && (