wba/frontend/src/js/page/wb-process-view.js

import { h, Component } from 'preact';
import WBNavbarCommon from 'wb-navbar-common';
import WBArvadosCrumbs from 'wb-arvados-crumbs';
import makeArvadosRequest from 'make-arvados-request';
import WBCommonFields from 'wb-common-fields';
import WBContainerRequestFields from 'wb-container-request-fields';
import WBProcessListing from 'wb-process-listing';
import WBProcessDashboard from 'wb-process-dashboard';

class WBProcessView extends Component {
  constructor(...args) {
    super(...args);
    this.state.objectUrls = [];
  }

  getUrl(props) {
    const page = ('page' in props ? props.page : this.props.page);
    return ('/process/' + this.props.uuid +
      (page ? '/' + page : ''));
  }

  fetchData() {
    let { arvHost, arvToken } = this.props.app.state;
    let prom = makeArvadosRequest(arvHost, arvToken,
      '/arvados/v1/container_requests/' + this.props.uuid);
    let req;
    let cont;
    prom = prom.then(xhr => {
      req = xhr.response;
      if (req.container_uuid) {
        let prom_1 = makeArvadosRequest(arvHost, arvToken,
          '/arvados/v1/containers/' + req.container_uuid);
        prom_1 = prom_1.then(xhr => (cont = xhr.response));
        return prom_1;
      }
    });
    prom = prom.then(() => {
      this.setState({
        'request': req,
        'container': cont
      });
    });
  }

  componentDidMount() {
    this.fetchData();
  }

  componentWillReceiveProps(nextProps) {
    this.props = nextProps;
    this.setState({ 'objectUrls': [], 'request': null, 'container': null });
    this.fetchData();
  }

  render({ app, uuid, page }, { container }) {
    return (
      <div>
        <WBNavbarCommon app={ app } />

        <WBArvadosCrumbs app={ app } uuid={ uuid } />

        <div class="my-2">
          This is the process view for { uuid }
        </div>

        <h2>Children Dashboard</h2>
        <WBProcessDashboard app={ app } parentProcessUuid={ uuid } lazy={ true } />

        <h2>Common Fields</h2>
        <WBCommonFields app={ app } uuid={ uuid } />

        <h2>Container Request Fields</h2>
        <WBContainerRequestFields app={ app } uuid={ uuid } />

        <h2>Children</h2>
        <WBProcessListing app={ app }
          appState={ app.state }
          requestingContainerUuid={ container ? container.uuid : null }
          waitForNextProps={ !container }
          itemsPerPage="20"
          activePage={ Number(page || 0) }
          getPageUrl={ page => this.getUrl({ page }) } />
      </div>
    );
  }
}

export default WBProcessView;