Fix CFs list broken display in repairs and schedule views. (#107)

thelastpickle · Jun 27, 2017 · 3906a01 · 3906a01
1 parent 5ac5fbd
commit 3906a01
Show file tree

Hide file tree

Showing 7 changed files with 55 additions and 39 deletions.
diff --git a/reaper_ui/app/jsx/mixin.jsx b/reaper_ui/app/jsx/mixin.jsx
@@ -80,3 +80,15 @@ export const DeleteStatusMessageMixin = {
   }
 
 };
+
+export const CFsListRender = React.createClass({
+    render: function() {
+        return (
+            <ul>
+                {this.props.list.map(function(listValue){
+                    return <li>{listValue}</li>;
+                })}
+            </ul>
+        )
+    }
+});
diff --git a/reaper_ui/app/jsx/repair-list.jsx b/reaper_ui/app/jsx/repair-list.jsx
@@ -1,7 +1,6 @@
 import React from "react";
 import moment from "moment";
-import {RowDeleteMixin, RowAbortMixin, StatusUpdateMixin, DeleteStatusMessageMixin} from "jsx/mixin";
-
+import {RowDeleteMixin, RowAbortMixin, StatusUpdateMixin, DeleteStatusMessageMixin, CFsListRender} from "jsx/mixin";
 
 const TableRow = React.createClass({
   mixins: [RowDeleteMixin, StatusUpdateMixin, RowAbortMixin],
@@ -23,7 +22,7 @@ const TableRow = React.createClass({
         <td data-toggle="collapse" data-target={rowID}>{this.props.row.state}</td>
         <td data-toggle="collapse" data-target={rowID}>{this.props.row.cluster_name}</td>
         <td data-toggle="collapse" data-target={rowID}>{this.props.row.keyspace_name}</td>
-        <td data-toggle="collapse" data-target={rowID}>{this.props.row.column_families}</td>
+        <td data-toggle="collapse" data-target={rowID}><CFsListRender list={this.props.row.column_families} /></td>
         <td data-toggle="collapse" data-target={rowID}>{incremental}</td>
         <td data-toggle="collapse" data-target={rowID}>
           <div className="progress">

diff --git a/reaper_ui/app/jsx/schedule-list.jsx b/reaper_ui/app/jsx/schedule-list.jsx
@@ -1,7 +1,6 @@
 import React from "react";
 import moment from "moment";
-import {RowDeleteMixin, StatusUpdateMixin, DeleteStatusMessageMixin} from "jsx/mixin";
-
+import {RowDeleteMixin, StatusUpdateMixin, DeleteStatusMessageMixin, CFsListRender} from "jsx/mixin";
 
 const TableRow = React.createClass({
   mixins: [RowDeleteMixin, StatusUpdateMixin],
@@ -54,7 +53,7 @@ const TableRowDetails = React.createClass({
                 </tr>
                 <tr>
                     <td>CFs</td>
-                    <td>{this.props.row.column_families}</td>
+                    <td><CFsListRender list={this.props.row.column_families} /></td>
                 </tr>
                 <tr>
                     <td>Incremental</td>

diff --git a/src/main/resources/assets/deps.js b/src/main/resources/assets/deps.js
diff --git a/src/main/resources/assets/index.js b/src/main/resources/assets/index.js
diff --git a/src/main/resources/assets/repair.js b/src/main/resources/assets/repair.js
diff --git a/src/main/resources/assets/schedules.js b/src/main/resources/assets/schedules.js