From c370fe8bd92bc9904cb07b96b562d83c719f1364 Mon Sep 17 00:00:00 2001 From: Stas Vilchik Date: Fri, 28 Apr 2017 09:19:35 +0200 Subject: apply feedback on issues page (part 2) (#1991) --- .../src/main/js/apps/issues/components/App.js | 3 - .../js/apps/issues/components/BulkChangeModal.js | 24 +++--- .../apps/issues/components/ComponentBreadcrumbs.js | 8 +- .../js/apps/issues/components/IssuesCounter.js | 2 +- .../components/__tests__/IssuesContainer-test.js | 31 +++++++ .../__snapshots__/IssuesContainer-test.js.snap | 25 ++++++ .../js/apps/issues/sidebar/CreationDateFacet.js | 96 ++++++++++++---------- .../sonar-web/src/main/js/apps/issues/styles.css | 9 ++ .../js/components/SourceViewer/SourceViewerCode.js | 1 + .../js/components/SourceViewer/components/Line.js | 4 +- .../sonar-web/src/main/less/components/issues.less | 5 ++ .../sonar-web/src/main/less/components/source.less | 4 + 12 files changed, 150 insertions(+), 62 deletions(-) create mode 100644 server/sonar-web/src/main/js/apps/issues/components/__tests__/IssuesContainer-test.js create mode 100644 server/sonar-web/src/main/js/apps/issues/components/__tests__/__snapshots__/IssuesContainer-test.js.snap (limited to 'server/sonar-web') diff --git a/server/sonar-web/src/main/js/apps/issues/components/App.js b/server/sonar-web/src/main/js/apps/issues/components/App.js index 8d71be0d1ff..7dc673d80dd 100644 --- a/server/sonar-web/src/main/js/apps/issues/components/App.js +++ b/server/sonar-web/src/main/js/apps/issues/components/App.js @@ -433,9 +433,6 @@ export default class App extends React.PureComponent { ): Promise> => { const { issues, openIssue, paging } = this.state; - /* eslint-disable no-console */ - console.log(`loadin issues from line ${from} to line ${to}`); - if (!openIssue || !paging) { return Promise.reject(); } diff --git a/server/sonar-web/src/main/js/apps/issues/components/BulkChangeModal.js b/server/sonar-web/src/main/js/apps/issues/components/BulkChangeModal.js index 057eb7e7cd4..8ec80944e7c 100644 --- a/server/sonar-web/src/main/js/apps/issues/components/BulkChangeModal.js +++ b/server/sonar-web/src/main/js/apps/issues/components/BulkChangeModal.js @@ -160,16 +160,20 @@ export default class BulkChangeModal extends React.PureComponent { handleSubmit = (e: Event) => { e.preventDefault(); - const query = pickBy({ - assign: this.state.assignee, - set_type: this.state.type, - set_severity: this.state.severity, - add_tags: this.state.addTags && this.state.addTags.join(), - remove_tags: this.state.removeTags && this.state.removeTags.join(), - do_transition: this.state.transition, - comment: this.state.comment, - sendNotifications: this.state.notifications - }); + const query = pickBy( + { + assign: this.state.assignee, + set_type: this.state.type, + set_severity: this.state.severity, + add_tags: this.state.addTags && this.state.addTags.join(), + remove_tags: this.state.removeTags && this.state.removeTags.join(), + do_transition: this.state.transition, + comment: this.state.comment, + sendNotifications: this.state.notifications + }, + // remove null, but keep empty string + x => x != null + ); const issueKeys = this.state.issues.map(issue => issue.key); this.setState({ submitting: true }); diff --git a/server/sonar-web/src/main/js/apps/issues/components/ComponentBreadcrumbs.js b/server/sonar-web/src/main/js/apps/issues/components/ComponentBreadcrumbs.js index 0fd09abce63..fafa016098a 100644 --- a/server/sonar-web/src/main/js/apps/issues/components/ComponentBreadcrumbs.js +++ b/server/sonar-web/src/main/js/apps/issues/components/ComponentBreadcrumbs.js @@ -47,7 +47,7 @@ export default class ComponentBreadcrumbs extends React.PureComponent { } {displayProject && - + {limitComponentName(issue.projectName)} @@ -56,7 +56,7 @@ export default class ComponentBreadcrumbs extends React.PureComponent { {displaySubProject && issue.subProject != null && - + {limitComponentName(issue.subProjectName)} @@ -64,7 +64,9 @@ export default class ComponentBreadcrumbs extends React.PureComponent { } - {collapsePath(issue.componentLongName)} + + {collapsePath(issue.componentLongName)} + ); diff --git a/server/sonar-web/src/main/js/apps/issues/components/IssuesCounter.js b/server/sonar-web/src/main/js/apps/issues/components/IssuesCounter.js index 0c6814735e1..019bf77961d 100644 --- a/server/sonar-web/src/main/js/apps/issues/components/IssuesCounter.js +++ b/server/sonar-web/src/main/js/apps/issues/components/IssuesCounter.js @@ -30,7 +30,7 @@ type Props = { const IssuesCounter = (props: Props) => ( - {props.current != null && {props.current + 1} / } + {props.current != null && {formatMeasure(props.current + 1, 'INT')} / } {formatMeasure(props.total, 'INT')} {' '} diff --git a/server/sonar-web/src/main/js/apps/issues/components/__tests__/IssuesContainer-test.js b/server/sonar-web/src/main/js/apps/issues/components/__tests__/IssuesContainer-test.js new file mode 100644 index 00000000000..31230e72610 --- /dev/null +++ b/server/sonar-web/src/main/js/apps/issues/components/__tests__/IssuesContainer-test.js @@ -0,0 +1,31 @@ +/* + * SonarQube + * Copyright (C) 2009-2017 SonarSource SA + * mailto:info 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. + */ +// @flow +import React from 'react'; +import { shallow } from 'enzyme'; +import IssuesCounter from '../IssuesCounter'; + +it('formats numbers', () => { + expect(shallow()).toMatchSnapshot(); +}); + +it('does not show current', () => { + expect(shallow()).toMatchSnapshot(); +}); diff --git a/server/sonar-web/src/main/js/apps/issues/components/__tests__/__snapshots__/IssuesContainer-test.js.snap b/server/sonar-web/src/main/js/apps/issues/components/__tests__/__snapshots__/IssuesContainer-test.js.snap new file mode 100644 index 00000000000..0af64820202 --- /dev/null +++ b/server/sonar-web/src/main/js/apps/issues/components/__tests__/__snapshots__/IssuesContainer-test.js.snap @@ -0,0 +1,25 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`does not show current 1`] = ` + + + 987,654,321 + + + issues.issues + +`; + +exports[`formats numbers 1`] = ` + + + + 1,235 + / + + 987,654,321 + + + issues.issues + +`; diff --git a/server/sonar-web/src/main/js/apps/issues/sidebar/CreationDateFacet.js b/server/sonar-web/src/main/js/apps/issues/sidebar/CreationDateFacet.js index 56e1328bc4f..a1ec652908d 100644 --- a/server/sonar-web/src/main/js/apps/issues/sidebar/CreationDateFacet.js +++ b/server/sonar-web/src/main/js/apps/issues/sidebar/CreationDateFacet.js @@ -19,11 +19,11 @@ */ // @flow import React from 'react'; -import classNames from 'classnames'; import moment from 'moment'; import { max } from 'lodash'; import FacetBox from './components/FacetBox'; import FacetHeader from './components/FacetHeader'; +import FacetItem from './components/FacetItem'; import { BarChart } from '../../../components/charts/bar-chart'; import DateInput from '../../../components/controls/DateInput'; import { translate } from '../../../helpers/l10n'; @@ -55,6 +55,13 @@ export default class CreationDateFacet extends React.PureComponent { property = 'createdAt'; + hasValue = (): boolean => + this.props.createdAfter.length > 0 || + this.props.createdAt.length > 0 || + this.props.createdBefore.length > 0 || + this.props.createdInLast.length > 0 || + this.props.sinceLeakPeriod; + handleHeaderClick = () => { this.props.onToggle(this.property); }; @@ -93,15 +100,11 @@ export default class CreationDateFacet extends React.PureComponent { }); }; - handlePeriodClick = (period?: string) => (e: Event & { target: HTMLElement }) => { - e.preventDefault(); - e.target.blur; + handlePeriodClick = (period: string) => { this.resetTo({ createdInLast: period }); }; - handleLeakPeriodClick = () => (e: Event & { target: HTMLElement }) => { - e.preventDefault(); - e.target.blur; + handleLeakPeriodClick = () => { this.resetTo({ sinceLeakPeriod: true }); }; @@ -200,39 +203,51 @@ export default class CreationDateFacet extends React.PureComponent { renderPrefefinedPeriods() { const { component, createdInLast, sinceLeakPeriod } = this.props; return ( -
- {translate('issues.facet.createdAt.or')} - - {translate('issues.facet.createdAt.all')} - + ); } @@ -249,13 +264,6 @@ export default class CreationDateFacet extends React.PureComponent { } render() { - const hasValue = - this.props.createdAfter.length > 0 || - this.props.createdAt.length > 0 || - this.props.createdBefore.length > 0 || - this.props.createdInLast.length > 0 || - this.props.sinceLeakPeriod; - return ( {this.props.open && this.renderInner()} diff --git a/server/sonar-web/src/main/js/apps/issues/styles.css b/server/sonar-web/src/main/js/apps/issues/styles.css index 63e28fcf51d..63867881965 100644 --- a/server/sonar-web/src/main/js/apps/issues/styles.css +++ b/server/sonar-web/src/main/js/apps/issues/styles.css @@ -216,3 +216,12 @@ .issues-workspace-list-component + .issues-workspace-list-item { margin-top: 0; } + +.issues-predefined-periods { + display: flex; +} + +.issues-predefined-periods .search-navigator-facet { + width: auto; + margin-right: 4px; +} \ No newline at end of file diff --git a/server/sonar-web/src/main/js/components/SourceViewer/SourceViewerCode.js b/server/sonar-web/src/main/js/components/SourceViewer/SourceViewerCode.js index e9b2f9cc8c7..59a21aa332d 100644 --- a/server/sonar-web/src/main/js/components/SourceViewer/SourceViewerCode.js +++ b/server/sonar-web/src/main/js/components/SourceViewer/SourceViewerCode.js @@ -158,6 +158,7 @@ export default class SourceViewerCode extends React.PureComponent { issueLocations={this.getIssueLocationsForLine(line)} issues={issuesForLine} key={line.line} + last={index === this.props.sources.length - 1 && !this.props.hasSourcesAfter} line={line} loadDuplications={this.props.loadDuplications} onClick={this.props.onLineClick} diff --git a/server/sonar-web/src/main/js/components/SourceViewer/components/Line.js b/server/sonar-web/src/main/js/components/SourceViewer/components/Line.js index 01ce80da9e9..dc4a26c300b 100644 --- a/server/sonar-web/src/main/js/components/SourceViewer/components/Line.js +++ b/server/sonar-web/src/main/js/components/SourceViewer/components/Line.js @@ -46,6 +46,7 @@ type Props = {| highlightedSymbols?: Array, issueLocations: Array, issues: Array, + last: boolean, line: SourceLine, loadDuplications: (SourceLine, HTMLElement) => void, onClick: (SourceLine, HTMLElement) => void, @@ -94,7 +95,8 @@ export default class Line extends React.PureComponent { const className = classNames('source-line', { 'source-line-highlighted': this.props.highlighted, 'source-line-shadowed': filtered === false, - 'source-line-filtered': filtered === true + 'source-line-filtered': filtered === true, + 'source-line-last': this.props.last }); return ( diff --git a/server/sonar-web/src/main/less/components/issues.less b/server/sonar-web/src/main/less/components/issues.less index 2bc33802fc3..18ef383c2b7 100644 --- a/server/sonar-web/src/main/less/components/issues.less +++ b/server/sonar-web/src/main/less/components/issues.less @@ -366,4 +366,9 @@ input.issue-action-options-search { .issue:not(.selected) .location-index { background-color: #ccc; +} + +.issue .menu { + max-height: 120px; + overflow: auto; } \ No newline at end of file diff --git a/server/sonar-web/src/main/less/components/source.less b/server/sonar-web/src/main/less/components/source.less index 07485b239d2..bc7eb17c41d 100644 --- a/server/sonar-web/src/main/less/components/source.less +++ b/server/sonar-web/src/main/less/components/source.less @@ -89,6 +89,10 @@ } } +.source-line-last .source-line-code-inner { + padding-bottom: 80px; +} + .source-viewer pre { height: @source-line-height; padding: 0; -- cgit v1.2.3