SONAR-6928 Rewrite the System Info page

6 files changed, 119 insertions, 67 deletions

diff --git a/server/sonar-web/src/main/js/api/system.js b/server/sonar-web/src/main/js/api/system.js
index 226f8724ef8..fab447ccdbd 100644
--- a/server/sonar-web/src/main/js/api/system.js
+++ b/server/sonar-web/src/main/js/api/system.js
@@ -1,13 +1,12 @@
-import { getJSON } from '../helpers/request.js';
-import $ from 'jquery';
+import { getJSON, postJSON } from '../helpers/request';
 
-// TODO migrate to fetch()
 export function setLogLevel (level) {
-  let url = baseUrl + '/api/system/change_log_level';
-  return $.post(url, { level });
+  let url = window.baseUrl + '/api/system/change_log_level';
+  let data = { level };
+  return postJSON(url, data);
 }
 
 export function getSystemInfo () {
-  let url = baseUrl + '/api/system/info';
+  let url = window.baseUrl + '/api/system/info';
   return getJSON(url);
 }
diff --git a/server/sonar-web/src/main/js/helpers/request.js b/server/sonar-web/src/main/js/helpers/request.js
index 74a5eaaf3bc..00029d3e991 100644
--- a/server/sonar-web/src/main/js/helpers/request.js
+++ b/server/sonar-web/src/main/js/helpers/request.js
@@ -46,18 +46,23 @@ class Request {
   submit () {
     let url = this.url;
     let options = _.defaults(this.options, OPTIONS);
-    let headers = _.defaults(this.headers, HEADERS);
-    options.headers = headers;
+    options.headers = _.defaults(this.headers, HEADERS);
     if (this.data) {
-      if (options.type === 'GET') {
+      if (options.method === 'GET') {
         url += '?' + queryString(this.data);
       } else {
+        options.headers['Content-Type'] = 'application/x-www-form-urlencoded';
         options.body = queryString(this.data);
       }
     }
     return window.fetch(url, options);
   }
 
+  setMethod (method) {
+    this.options.method = method;
+    return this;
+  }
+
   setData (data) {
     this.data = data;
     return this;
@@ -112,4 +117,19 @@ export function getJSON (url, data) {
       .submit()
       .then(checkStatus)
       .then(parseJSON);
-}
\ No newline at end of file
+}
+
+
+/**
+ * Shortcut to do a POST request and return response json
+ * @param url
+ * @param data
+ */
+export function postJSON (url, data) {
+  return request(url)
+      .setMethod('POST')
+      .setData(data)
+      .submit()
+      .then(checkStatus)
+      .then(parseJSON);
+}
diff --git a/server/sonar-web/src/main/webapp/WEB-INF/app/controllers/system_controller.rb b/server/sonar-web/src/main/webapp/WEB-INF/app/controllers/system_controller.rb
index 0234fe68808..b570e238edd 100644
--- a/server/sonar-web/src/main/webapp/WEB-INF/app/controllers/system_controller.rb
+++ b/server/sonar-web/src/main/webapp/WEB-INF/app/controllers/system_controller.rb
@@ -23,13 +23,7 @@ class SystemController < ApplicationController
   before_filter :admin_required
 
   def index
-    @monitors = [
-      Java::OrgSonarServerPlatform::Platform.component(Java::OrgSonarServerPlatformMonitoring::SonarQubeMonitor.java_class),
-      Java::OrgSonarServerPlatform::Platform.component(Java::OrgSonarServerPlatformMonitoring::DatabaseMonitor.java_class),
-      Java::OrgSonarServerPlatform::Platform.component(Java::OrgSonarServerPlatformMonitoring::SystemMonitor.java_class),
-      Java::OrgSonarServerPlatform::Platform.component(Java::OrgSonarServerPlatformMonitoring::EsMonitor.java_class),
-      Java::OrgSonarServerPlatform::Platform.component(Java::OrgSonarServerPlatformMonitoring::JvmPropertiesMonitor.java_class)
-    ]
+
   end
 
   def new
diff --git a/server/sonar-web/src/main/webapp/WEB-INF/app/views/system/_monitor.html.erb b/server/sonar-web/src/main/webapp/WEB-INF/app/views/system/_monitor.html.erb
deleted file mode 100644
index d0aaca67df5..00000000000
--- a/server/sonar-web/src/main/webapp/WEB-INF/app/views/system/_monitor.html.erb
+++ /dev/null
@@ -1,35 +0,0 @@
-<table class="data width100" id="<%= monitor.name().parameterize -%>">
-    <thead>
-    <tr>
-      <th colspan="2"><h2><%= h monitor.name() -%></h2></th>
-    </tr>
-    </thead>
-    <tbody>
-    <% monitor.attributes().to_hash.each do |attribute_key, attribute_value| %>
-
-      <% if attribute_value.respond_to?(:to_hash)
-          attribute_value.to_hash.each do |group_key, group_value|
-      %>
-        <tr class="<%= cycle('even','odd', :name => monitor.name()) -%>">
-          <td width="25%" nowrap="nowrap"><%= h "#{attribute_key} - #{group_key}" -%></td>
-          <td width="75%">
-            <table>
-            <% group_value.to_hash.each do |group_attr_key, group_attr_value| %>
-              <tr><td style="padding: 2px 10px 2px 0"><%= h group_attr_key -%></td><td><%= h group_attr_value -%></td></tr>
-            <% end %>
-            </table>
-          </td>
-        </tr>
-         <% end %>
-
-      <% else %>
-        <tr class="<%= cycle('even','odd', :name => monitor.name()) -%>" id="<%= "#{monitor.name()}-#{attribute_key}".parameterize -%>">
-          <td width="25%" nowrap="nowrap"><%= h attribute_key -%></td>
-          <td width="75%"><%= h attribute_value -%></td>
-        </tr>
-      <% end %>
-
-    <% end %>
-    </tbody>
-  </table>
-  <br/>
diff --git a/server/sonar-web/src/main/webapp/WEB-INF/app/views/system/index.html.erb b/server/sonar-web/src/main/webapp/WEB-INF/app/views/system/index.html.erb
index 51e1c98c663..1cb19867388 100644
--- a/server/sonar-web/src/main/webapp/WEB-INF/app/views/system/index.html.erb
+++ b/server/sonar-web/src/main/webapp/WEB-INF/app/views/system/index.html.erb
@@ -1,16 +1,4 @@
-<div class="page">
-  <header class="page-header">
-    <h1 class="page-title"><%= message('system_info.page') -%></h1>
-    <div class="page-actions">
-      <div>
-        <a href="<%= ApplicationController.root_context -%>/api/system/logs" id="logs-link">Logs</a>&nbsp;&nbsp;
-        <a href="<%= ApplicationController.root_context -%>/api/system/info" id="download-link">Download</a>
-      </div>
-    </div>
-  </header>
+<% content_for :extra_script do %>
+<script src="<%= ApplicationController.root_context -%>/js/bundles/system.js?v=<%= sonar_version -%>"></script>
+<% end %>
 
-  <% @monitors.each do |monitor| %>
-    <%= render :partial => 'monitor', :locals => {:monitor => monitor} -%>
-  <% end %>
-
-</div>
diff --git a/server/sonar-web/tests/apps/system-test.js b/server/sonar-web/tests/apps/system-test.js
new file mode 100644
index 00000000000..274917cbc1c
--- /dev/null
+++ b/server/sonar-web/tests/apps/system-test.js
@@ -0,0 +1,86 @@
+import React from 'react/addons';
+import ItemValue from '../../src/main/js/apps/system/item-value';
+
+let TestUtils = React.addons.TestUtils;
+let expect = require('chai').expect;
+let sinon = require('sinon');
+
+describe('System', function () {
+
+  describe('Item Value', function () {
+    it('should render string', () => {
+      let result = TestUtils.renderIntoDocument(<ItemValue value="/some/path/as/an/example"/>);
+      let content = React.findDOMNode(TestUtils.findRenderedDOMComponentWithTag(result, 'code'));
+      expect(content.textContent).to.equal('/some/path/as/an/example');
+    });
+
+    it('should render `true`', () => {
+      let result = TestUtils.renderIntoDocument(<ItemValue value={true}/>);
+      TestUtils.findRenderedDOMComponentWithClass(result, 'icon-check');
+    });
+
+    it('should render `false`', () => {
+      let result = TestUtils.renderIntoDocument(<ItemValue value={false}/>);
+      TestUtils.findRenderedDOMComponentWithClass(result, 'icon-delete');
+    });
+
+    it('should render object', () => {
+      let result = TestUtils.renderIntoDocument(<ItemValue value={{ name: 'Java', version: '3.2' }}/>);
+      TestUtils.findRenderedDOMComponentWithTag(result, 'table');
+      expect(TestUtils.scryRenderedDOMComponentsWithTag(result, 'tr')).to.have.length(2);
+    });
+
+    it('should render `true` inside object', () => {
+      let result = TestUtils.renderIntoDocument(<ItemValue value={{ name: 'Java', isCool: true }}/>);
+      TestUtils.findRenderedDOMComponentWithTag(result, 'table');
+      TestUtils.findRenderedDOMComponentWithClass(result, 'icon-check');
+    });
+
+    it('should render object inside object', () => {
+      let result = TestUtils.renderIntoDocument(
+          <ItemValue value={{ users: { docs: 1, shards: 5 }, tests: { docs: 68, shards: 5 }  }}/>);
+      expect(TestUtils.scryRenderedDOMComponentsWithTag(result, 'table')).to.have.length(3);
+      expect(TestUtils.scryRenderedDOMComponentsWithTag(result, 'tr')).to.have.length(6);
+    });
+  });
+
+  describe('Log Level', function () {
+    var previousFetch, fetchUrl, fetchOptions;
+
+    before(function () {
+      previousFetch = window.fetch;
+      window.fetch = function (url, options) {
+        fetchUrl = url;
+        fetchOptions = options;
+        return Promise.resolve();
+      };
+    });
+
+    after(function () {
+      window.fetch = previousFetch;
+    });
+
+    it('should render select box', () => {
+      let result = TestUtils.renderIntoDocument(<ItemValue value="INFO" name="Logs Level"/>);
+      TestUtils.findRenderedDOMComponentWithTag(result, 'select');
+      expect(TestUtils.scryRenderedDOMComponentsWithTag(result, 'option')).to.have.length(3);
+    });
+
+    it('should set initial value', () => {
+      let result = TestUtils.renderIntoDocument(<ItemValue value="DEBUG" name="Logs Level"/>);
+      let select = React.findDOMNode(TestUtils.findRenderedDOMComponentWithTag(result, 'select'));
+      expect(select.value).to.equal('DEBUG');
+    });
+
+    it('should change value', () => {
+      let result = TestUtils.renderIntoDocument(<ItemValue value="INFO" name="Logs Level"/>);
+      let select = React.findDOMNode(TestUtils.findRenderedDOMComponentWithTag(result, 'select'));
+      select.value = 'TRACE';
+      TestUtils.Simulate.change(select);
+      expect(fetchUrl).to.equal('/api/system/change_log_level');
+      expect(fetchOptions.method).to.equal('POST');
+      expect(fetchOptions.body).to.equal('level=TRACE');
+    });
+  });
+
+});