wba/frontend/src/js/component/wb-process-state.js

import { h, Component } from 'preact';
import makeArvadosRequest from 'make-arvados-request';

class WBProcessState extends Component {
  componentDidMount() {
    this.fetchData();
  }

  componentWillReceiveProps(nextProps) {
    this.props = nextProps;
    this.fetchData();
  }

  fetchData() {
    const { app, process } = this.props;
    const { arvHost, arvToken } = app.state;

    if (!process.container_uuid)
      return;

    let prom = makeArvadosRequest(arvHost, arvToken,
      '/arvados/v1/containers/' + process.container_uuid);
    prom = prom.then(xhr => this.setState({ 'container': xhr.response }));
    prom = prom.catch(() => this.setState({ 'apiError': 'Failed to fetch container' }));
  }

  render({ process }, { container, apiError }) {
    const runtimeStatus = container ? container.runtime_status : null;
    const error = runtimeStatus ? runtimeStatus.error : null;
    const warning = runtimeStatus ? runtimeStatus.warning : null;

    return (
      <div>
        { process.state }
        { apiError ? <i>{ [ ' / ', apiError ] }</i> : null }
        { container ? [ " / ", container.state ] : null }
        { !(error || warning) && container && container.state === 'Complete' ? " / Success" : null }
        { error ? [" / ", <a href={ '/container/' + container.uuid }
          title={ error }>E</a> ] : null }
        { warning ? [ " / ", <a href={ '/container/' + container.uuid }
          title={ warning }>W</a> ] : null }
      </div>
    );
  }
}

export default WBProcessState;