|
- import { h, Component } from 'preact';
- import { route } from 'preact-router';
- import makeArvadosRequest from 'make-arvados-request';
- import WBTable from 'wb-table';
- import WBPagination from 'wb-pagination';
- import WBCheckboxes from 'wb-checkboxes';
- import wbFormatDate from 'wb-format-date';
- import wbFetchObjects from 'wb-fetch-objects';
- import WBNameAndUuid from 'wb-name-and-uuid';
-
- class WBProcessListing extends Component {
-
- constructor(...args) {
- super(...args);
- this.state.rows = [];
- this.state.numPages = 0;
- this.state.requestStates = [ 'Uncommitted', 'Committed', 'Final' ];
- // this.state.containerStates = [ 'Queued', 'Locked', 'Running', 'Cancelled', 'Complete' ];
- this.state.reqStateMask = [ true, true, true ];
- // this.state.contStateMask = [ true, true, true, true, true ];
- }
-
- componentDidMount() {
- this.fetchItems();
- }
-
- prepareRows(requests, containerLookup, ownerLookup, outputLookup) {
- const { renderRenameLink, renderDeleteButton } = this.props;
- return requests.map(item => {
- const container = item.container_uuid in containerLookup ?
- containerLookup[item.container_uuid] : null;
- const runtimeStatus = container ? container.runtime_status : null;
- const error = runtimeStatus ? runtimeStatus.error : null;
- const warning = runtimeStatus ? runtimeStatus.warning : null;
-
- return ( [
- (<div>
- <div>
- <a href={ '/process/' + item['uuid'] }>
- { item['name'] }
- </a> { renderRenameLink(item, () => this.fetchItems()) }
- </div>
- <div>{ item['uuid'] }</div>
- </div>),
- ( <div>
- { item['state'] }
- { item.container_uuid ?
- container ?
- [ " / ", container.state ] :
- [ " / ", <i>Container Not Found</i> ] :
- 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> ),
- ( <WBNameAndUuid uuid={ item['owner_uuid'] } lookup={ ownerLookup } /> ),
- wbFormatDate(item['created_at']),
- ( <WBNameAndUuid uuid={ item['output_uuid'] } lookup={ outputLookup } /> ),
- (<div>
- { renderDeleteButton(item, () => this.fetchItems()) }
- </div>)
- ] );
- });
- }
-
- fetchItems() {
- const { arvHost, arvToken } = this.props.appState;
- const { requestStates, reqStateMask } = this.state;
- const { activePage, itemsPerPage, ownerUuid,
- requestingContainerUuid } = this.props;
-
- const filters = [
- [ 'requesting_container_uuid', '=', requestingContainerUuid ]
- ];
- if (!reqStateMask.reduce((a, b) => a & b))
- filters.push([ 'state', 'in', requestStates.filter((_, idx) => reqStateMask[idx]) ]);
- if (ownerUuid)
- filters.push([ 'owner_uuid', '=', ownerUuid ]);
- //if (requestingContainerUuid)
- //filters.push();
-
- let prom = makeArvadosRequest(arvHost, arvToken,
- '/arvados/v1/container_requests?filters=' + encodeURIComponent(JSON.stringify(filters)) +
- '&limit=' + itemsPerPage +
- '&offset=' + (itemsPerPage * activePage));
-
- let requests;
- let numPages;
- prom = prom.then(xhr => {
- requests = xhr.response.items;
- numPages = Math.ceil(xhr.response['items_available'] / xhr.response['limit']);
- /* container_uuids = requests.map(r => r.container_uuid);
- container_uuids = container_uuids.filter(uuid => uuid);
- const filters_1 = [
- [ 'uuid', 'in', container_uuids ]
- ];
- return makeArvadosRequest(arvHost, arvToken,
- '/arvados/v1/containers?filters=' +
- encodeURIComponent(JSON.stringify(filters_1)));*/
- return wbFetchObjects(arvHost, arvToken,
- requests.map(r => r.container_uuid).filter(uuid => uuid));
- });
-
- let containerLookup;
- prom = prom.then(lookup => {
- containerLookup = lookup;
- // const containers = xhr.response.items;
- // containers.map(c => (containerLookup[c.uuid] = c));
- return wbFetchObjects(arvHost, arvToken,
- requests.map(r => r.owner_uuid).filter(uuid => uuid));
- });
-
- let ownerLookup;
- prom = prom.then(lookup => {
- ownerLookup = lookup;
- return wbFetchObjects(arvHost, arvToken,
- requests.map(r => r.output_uuid).filter(uuid => uuid));
- });
-
- let outputLookup;
- prom = prom.then(lookup => (outputLookup = lookup));
-
- // prom = prom.then(() => makeArvadosRequest(arvHost, arvToken,
- // '/arvados/v1/'))
-
- prom = prom.then(() =>
- this.setState({
- 'numPages': numPages,
- 'rows': this.prepareRows(requests, containerLookup,
- ownerLookup, outputLookup)
- }));
- }
-
- componentWillReceiveProps(nextProps, nextState) {
- // this.setState({ 'rows': [] }); // .rows = [];
- this.props = nextProps;
- this.fetchItems();
- }
-
- render({ appState, ownerUuid, activePage, onPageChanged },
- { rows, numPages, requestStates, containerStates,
- reqStateMask, contStateMask }) {
-
- return (
- <div>
- <WBCheckboxes items={ requestStates } checked={ reqStateMask }
- cssClass="float-left mx-2 my-2" title="Request State: "
- onChange={ () => this.fetchItems() } />
-
- <WBTable columns={ [ 'Name', 'Status', 'Owner', 'Created At', 'Output', 'Actions' ] }
- rows={ rows } />
-
- <WBPagination numPages={ numPages }
- activePage={ activePage }
- onPageChanged={ i => onPageChanged(i) } />
- </div>
- );
- }
- }
-
- WBProcessListing.defaultProps = {
- 'itemsPerPage': 100,
- 'ownerUuid': null,
- 'requestingContainerUuid': null
- };
-
- export default WBProcessListing;
|