diff --git a/frontend/src/component/archive/archive-list-component.jsx b/frontend/src/component/archive/archive-list-component.jsx index 5dcd783ba5..52bd0ce863 100644 --- a/frontend/src/component/archive/archive-list-component.jsx +++ b/frontend/src/component/archive/archive-list-component.jsx @@ -8,7 +8,7 @@ const ArchivedFeature = ({ feature, revive }) => { const { name, description, enabled, strategies } = feature; const actions = [
{strategies && strategies.map(s => {s.name})}
, - revive(feature)} />, + revive(feature)} />, ]; const leftActions = [ diff --git a/frontend/src/component/feature/feature-component.jsx b/frontend/src/component/feature/feature-component.jsx index 599c15cafe..1fe816c2c6 100644 --- a/frontend/src/component/feature/feature-component.jsx +++ b/frontend/src/component/feature/feature-component.jsx @@ -24,6 +24,9 @@ const Feature = ({ , + + + , onFeatureRemove(name)} />, ]; diff --git a/frontend/src/component/history/history-component.jsx b/frontend/src/component/history/history-component.jsx new file mode 100644 index 0000000000..ad52076abc --- /dev/null +++ b/frontend/src/component/history/history-component.jsx @@ -0,0 +1,28 @@ +import React, { Component } from 'react'; +import HistoryList from './history-list-component'; + +class History extends Component { + + componentDidMount () { + this.props.fetchHistory(); + } + + toggleShowDiff () { + this.setState({ showData: !this.state.showData }); + } + + render () { + const { history } = this.props; + if (history.length < 0) { + return; + } + + return ( +
+
Last 100 changes
+ +
+ ); + } +} +export default History; diff --git a/frontend/src/component/history/history-container.js b/frontend/src/component/history/history-container.js index 6986b6d3d5..b8ff05c580 100644 --- a/frontend/src/component/history/history-container.js +++ b/frontend/src/component/history/history-container.js @@ -1,5 +1,5 @@ import { connect } from 'react-redux'; -import ListComponent from './history-list-component'; +import HistoryComponent from './history-component'; import { fetchHistory } from '../../store/history-actions'; const mapStateToProps = (state) => { @@ -10,6 +10,6 @@ const mapStateToProps = (state) => { }; }; -const HistoryListContainer = connect(mapStateToProps, { fetchHistory })(ListComponent); +const HistoryListContainer = connect(mapStateToProps, { fetchHistory })(HistoryComponent); export default HistoryListContainer; diff --git a/frontend/src/component/history/history-list-component.jsx b/frontend/src/component/history/history-list-component.jsx index fd2fbab7b1..d5c4fe5748 100644 --- a/frontend/src/component/history/history-list-component.jsx +++ b/frontend/src/component/history/history-list-component.jsx @@ -11,26 +11,20 @@ class HistoryList extends Component { this.state = { showData: false }; } - componentDidMount () { - this.props.fetchHistory(); - } - toggleShowDiff () { this.setState({ showData: !this.state.showData }); } render () { const { history } = this.props; - if (history.length < 0) { - return; + if (!history || history.length < 0) { + return null; } - const entries = history.map((entry) => ); return (
-
History
this.setState({ history: res, fetching: false })); + } + + render () { + if (this.state.fetching) { + return fetching..; + } + return ( +
+
Showing history for toggle: {this.props.toggleName}
+ +
+ ); + } +} +export default HistoryListToggle; diff --git a/frontend/src/data/history-api.js b/frontend/src/data/history-api.js index d61f751421..1b894267ab 100644 --- a/frontend/src/data/history-api.js +++ b/frontend/src/data/history-api.js @@ -8,6 +8,13 @@ function fetchAll () { .then(response => response.json()); } +function fetchHistoryForToggle (toggleName) { + return fetch(`${URI}/${toggleName}`) + .then(throwIfNotSuccess) + .then(response => response.json()); +} + module.exports = { fetchAll, + fetchHistoryForToggle, }; diff --git a/frontend/src/index.jsx b/frontend/src/index.jsx index 034e2a193f..611679d9f9 100644 --- a/frontend/src/index.jsx +++ b/frontend/src/index.jsx @@ -15,6 +15,7 @@ import EditFeatureToggle from './page/features/edit'; import Strategies from './page/strategies'; import CreateStrategies from './page/strategies/create'; import HistoryPage from './page/history'; +import HistoryTogglePage from './page/history/toggle'; import Archive from './page/archive'; import Metrics from './page/metrics'; import ClientStrategies from './page/client-strategies'; @@ -38,6 +39,7 @@ ReactDOM.render( + diff --git a/frontend/src/page/history/toggle.js b/frontend/src/page/history/toggle.js new file mode 100644 index 0000000000..eae6094429 --- /dev/null +++ b/frontend/src/page/history/toggle.js @@ -0,0 +1,10 @@ +import React, { PropTypes } from 'react'; +import HistoryListToggle from '../../component/history/history-list-toggle-component'; + +const render = ({ params }) => ; + +render.propTypes = { + params: PropTypes.object.isRequired, +}; + +export default render;