|
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596 |
- 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';
-
- class WBProjectListing extends Component {
-
- constructor(...args) {
- super(...args);
- this.state.rows = [];
- this.state.numPages = 0;
- }
-
- componentDidMount() {
- this.fetchItems();
- }
-
- prepareRows(items) {
- const { app, renderRenameLink, renderDeleteButton,
- renderSelectionCell, renderSharingButton } = this.props;
-
- return items.map(item => [
- renderSelectionCell(item),
- (<div>
- <div>
- <a href="#"
- onclick={ e => { e.preventDefault(); route('/browse/' + item['uuid']) }}>
- { item['name'] }
- </a> { renderRenameLink(item, () => this.fetchItems()) }
- </div>
- <div>{ item['uuid'] }</div>
- </div>),
- item['description'],
- item['owner_uuid'],
- (<div>
- <button class="btn btn-outline-warning m-1" title="Add to Toolbox"
- onclick={ () => (app.addToToolbox(item.uuid)) }>
- <i class="fas fa-toolbox"></i>
- </button>
- { renderDeleteButton(item, () => this.fetchItems()) }
- { renderSharingButton(item) }
- </div>)
- ]);
- }
-
- fetchItems() {
- let { activePage, mode, itemsPerPage, ownerUuid, app } = this.props;
- let { arvHost, arvToken } = app.state;
- let filters = [
- [ 'group_class', '=', 'project' ]
- ];
- if (ownerUuid)
- filters.push([ 'owner_uuid', '=', ownerUuid ]);
- let prom = makeArvadosRequest(arvHost, arvToken,
- '/arvados/v1/groups' + (mode === 'shared-with-me' ? '/shared' : '') +
- '?filters=' + encodeURIComponent(JSON.stringify(filters)) +
- '&limit=' + itemsPerPage +
- '&offset=' + (itemsPerPage * activePage));
- prom = prom.then(xhr =>
- this.setState({
- 'numPages': Math.ceil(xhr.response['items_available'] / xhr.response['limit']),
- 'rows': this.prepareRows(xhr.response['items'])
- }));
- }
-
- componentWillReceiveProps(nextProps, nextState) {
- // this.setState({ 'rows': [] }); // .rows = [];
- this.props = nextProps;
- this.fetchItems();
- }
-
- render({ arvHost, arvToken, ownerUuid, activePage, getPageUrl }, { rows, numPages }) {
- return (
- <div>
- <WBTable columns={ [ '', 'Name', 'Description', 'Owner', 'Actions' ] }
- headerClasses={ [ 'w-1' ] }
- rows={ rows } />
-
- <WBPagination numPages={ numPages }
- activePage={ activePage }
- getPageUrl={ getPageUrl } />
- </div>
- );
- }
- }
-
- WBProjectListing.defaultProps = {
- 'itemsPerPage': 100,
- 'ownerUuid': null,
- 'renderRenameLink': () => null,
- 'renderDeleteButton': () => null,
- 'renderSelectionCell': () => null
- };
-
- export default WBProjectListing;
|