show more profile changelog

2 files changed, 43 insertions, 2 deletions

diff --git a/server/sonar-web/src/main/js/apps/quality-profiles/changelog/ChangelogContainer.js b/server/sonar-web/src/main/js/apps/quality-profiles/changelog/ChangelogContainer.js
index 247b3a6f402..2c0bdd1c882 100644
--- a/server/sonar-web/src/main/js/apps/quality-profiles/changelog/ChangelogContainer.js
+++ b/server/sonar-web/src/main/js/apps/quality-profiles/changelog/ChangelogContainer.js
@@ -23,6 +23,7 @@ import ChangelogSearch from './ChangelogSearch';
 import ChangelogEmpty from './ChangelogEmpty';
 import { getProfileChangelog } from '../../../api/quality-profiles';
 import { ProfileType } from '../propTypes';
+import { translate } from '../../../helpers/l10n';
 
 export default class ChangelogContainer extends React.Component {
   static propTypes = {
@@ -82,6 +83,35 @@ export default class ChangelogContainer extends React.Component {
     });
   }
 
+  loadMore (e) {
+    e.preventDefault();
+    e.target.blur();
+
+    this.setState({ loading: true });
+    const { query } = this.props.location;
+    const data = {
+      profileKey: this.props.profile.key,
+      p: this.state.page + 1
+    };
+    if (query.since) {
+      data.since = query.since;
+    }
+    if (query.to) {
+      data.to = query.to;
+    }
+
+    getProfileChangelog(data).then(r => {
+      if (this.mounted) {
+        this.setState({
+          events: [...this.state.events, ...r.events],
+          total: r.total,
+          page: r.p,
+          loading: false
+        });
+      }
+    });
+  }
+
   handleFromDateChange (fromDate) {
     const query = { ...this.props.location.query, since: fromDate };
     this.context.router.push({ pathname: '/changelog', query });
@@ -100,6 +130,9 @@ export default class ChangelogContainer extends React.Component {
   render () {
     const { query } = this.props.location;
 
+    const shouldDisplayFooter = this.state.events != null &&
+        this.state.events.length < this.state.total;
+
     return (
         <div className="quality-profile-box js-profile-changelog">
           <header className="spacer-bottom">
@@ -122,6 +155,14 @@ export default class ChangelogContainer extends React.Component {
           {this.state.events != null && this.state.events.length > 0 && (
               <Changelog events={this.state.events}/>
           )}
+
+          {shouldDisplayFooter && (
+              <footer className="text-center spacer-top small">
+                <a href="#" onClick={this.loadMore.bind(this)}>
+                  {translate('show_more')}
+                </a>
+              </footer>
+          )}
         </div>
     );
   }
diff --git a/server/sonar-web/src/main/js/apps/quality-profiles/changelog/ParameterChange.js b/server/sonar-web/src/main/js/apps/quality-profiles/changelog/ParameterChange.js
index 82e685af470..d3ea5ecedb0 100644
--- a/server/sonar-web/src/main/js/apps/quality-profiles/changelog/ParameterChange.js
+++ b/server/sonar-web/src/main/js/apps/quality-profiles/changelog/ParameterChange.js
@@ -31,7 +31,7 @@ export default class ParameterChange extends React.Component {
 
     if (value == null) {
       return (
-          <div>
+          <div style={{ whiteSpace: 'normal '}}>
             {translateWithParameters(
                 'quality_profiles.changelog.parameter_reset_to_default_value',
                 name
@@ -41,7 +41,7 @@ export default class ParameterChange extends React.Component {
     }
 
     return (
-        <div>
+        <div style={{ whiteSpace: 'normal '}}>
           {translateWithParameters(
               'quality_profiles.parameter_set_to',
               name,