application/components/admin/cron.js

import React, {Component} from 'react';
import Immutable from 'immutable';

import {List, ListItem} from 'material-ui/List';
import Subheader from 'material-ui/Subheader';
import Divider from 'material-ui/Divider';

import FlatButton from 'material-ui/FlatButton';
import RaisedButton from 'material-ui/RaisedButton';
import IconButton from 'material-ui/IconButton';
import TextField from 'material-ui/TextField';

import LoadingIndicator from './../common/loading-indicator';

import {Toolbar, ToolbarGroup, ToolbarSeparator, ToolbarTitle} from 'material-ui/Toolbar';
import {Table, TableBody, TableHeader, TableHeaderColumn, TableRow, TableRowColumn} from 'material-ui/Table';

import {connect} from 'react-redux';
import Config from '../../config';
import ExpandingCard from './../expanding-card';

import {
    snackbarShowMessage
} from './../../redux/actions/snackbar-actions';

import {Row, Col} from './../flexbox';
import {timeToFormat} from './../../util/strings';

import ApiService from './../../services/api-service';

class CronCard extends Component {
    constructor(props) {
        super(props);

        this.state = {
            expanded: false,
            hasLoaded: false,
            jobs: Immutable.fromJS([])
        };

        this.api = new ApiService();
    }

    handleToggle(expanded) {
        if (this.props.onToggle) {
            this.props.onToggle('cron', expanded);
        }

        if (expanded && !this.state.hasLoaded) {
            const {dispatch} = this.props;
            this.api.get('/v3/status/cron')
                .then((json) => {
                    this.setState({
                        hasLoaded: true,
                        jobs: json
                    });
                });
        }
    }

    render() {
        let jobStatus = [];
        if (this.state.jobs.size) {
            jobStatus = this.state.jobs.map((job, i) => {
                return (
                    <TableRow
                        key={i}
                        selectable={false}
                        >
                        <TableRowColumn>{job.get('label')}</TableRowColumn>
                        <TableRowColumn>{timeToFormat(job.get('lastRun'))}</TableRowColumn>
                        <TableRowColumn>{timeToFormat(job.get('nextRun'))}</TableRowColumn>
                    </TableRow>
                )
            });
        }
        return (
            <ExpandingCard
                onToggle={this.handleToggle.bind(this)}
                title="Background Tasks"
                subtitle="Background processes and importers"
                expanded={this.props.openCard === 'cron'}
                >
                {
                    !this.state.hasLoaded
                    ? <LoadingIndicator />
                    : (
                        <Table
                            selectable={false}
                            >
                            <TableHeader
                                displaySelectAll={false}
                                adjustForCheckbox={false}
                                >
                                <TableRow>
                                    <TableHeaderColumn>Job</TableHeaderColumn>
                                    <TableHeaderColumn>Last Run</TableHeaderColumn>
                                    <TableHeaderColumn>Next Run</TableHeaderColumn>
                                </TableRow>
                            </TableHeader>
                            <TableBody
                                displayRowCheckbox={false}
                                >
                                {jobStatus}
                            </TableBody>
                        </Table>
                    )
                }
            </ExpandingCard>
        );
    }
}

export default CronCard;