diff --git a/frontend/src/js/component/wb-collection-listing.js b/frontend/src/js/component/wb-collection-listing.js index 9e84eaf..576186a 100644 --- a/frontend/src/js/component/wb-collection-listing.js +++ b/frontend/src/js/component/wb-collection-listing.js @@ -21,7 +21,7 @@ class WBCollectionListing extends Component { } prepareRows(items, ownerLookup) { - let { app, renderRenameLink } = this.props; + let { app, renderRenameLink, renderDeleteButton } = this.props; return items.map(item => [ (
@@ -56,9 +56,7 @@ class WBCollectionListing extends Component { - + { renderDeleteButton(item, () => this.fetchItems()) }
) ]); } diff --git a/frontend/src/js/component/wb-process-listing.js b/frontend/src/js/component/wb-process-listing.js index 2c2bb27..34483ec 100644 --- a/frontend/src/js/component/wb-process-listing.js +++ b/frontend/src/js/component/wb-process-listing.js @@ -22,7 +22,7 @@ class WBProcessListing extends Component { } prepareRows(items) { - const { renderRenameLink } = this.props; + const { renderRenameLink, renderDeleteButton } = this.props; return items.map(item => [ (
@@ -38,7 +38,7 @@ class WBProcessListing extends Component { item['created_at'].replace('T', ' ').substr(0, item['created_at'].length - 11) + '', item['output_uuid'], (
- + { renderDeleteButton(item, () => this.fetchItems()) }
) ]); } diff --git a/frontend/src/js/component/wb-project-listing.js b/frontend/src/js/component/wb-project-listing.js index 8a40e53..26f4f4a 100644 --- a/frontend/src/js/component/wb-project-listing.js +++ b/frontend/src/js/component/wb-project-listing.js @@ -17,7 +17,7 @@ class WBProjectListing extends Component { } prepareRows(items) { - let { app, renderRenameLink } = this.props; + let { app, renderRenameLink, renderDeleteButton } = this.props; return items.map(item => [ (
@@ -36,6 +36,7 @@ class WBProjectListing extends Component { onclick={ () => (app.addToToolbox(item.uuid)) }> + { renderDeleteButton(item, () => this.fetchItems()) }
) ]); } diff --git a/frontend/src/js/component/wb-workflow-listing.js b/frontend/src/js/component/wb-workflow-listing.js index 95cd285..7933b5f 100644 --- a/frontend/src/js/component/wb-workflow-listing.js +++ b/frontend/src/js/component/wb-workflow-listing.js @@ -21,7 +21,7 @@ class WBWorkflowListing extends Component { } prepareRows(items, ownerLookup) { - const { renderRenameLink } = this.props; + const { renderRenameLink, renderDeleteButton } = this.props; return items.map(item => [ (
@@ -40,7 +40,7 @@ class WBWorkflowListing extends Component { - + { renderDeleteButton(item, () => this.fetchItems()) }
) ]); } diff --git a/frontend/src/js/dialog/wb-delete-dialog.js b/frontend/src/js/dialog/wb-delete-dialog.js new file mode 100644 index 0000000..d906cbc --- /dev/null +++ b/frontend/src/js/dialog/wb-delete-dialog.js @@ -0,0 +1,53 @@ +import { h, Component, createRef } from 'preact'; +import WBDialog from 'wb-dialog'; +import WBArvadosCrumbs from 'wb-arvados-crumbs'; +import linkState from 'linkstate'; +import wbDeleteObject from 'wb-delete-object'; +import arvadosTypeName from 'arvados-type-name'; + +class WBDeleteDialog extends Component { + constructor(...args) { + super(...args); + this.dialogRef = createRef(); + } + + show(item, callback) { + this.setState({ + 'item': item, + 'callback': callback || (() => {}) + }); + this.dialogRef.current.show(); + } + + hide() { + this.dialogRef.current.hide(); + } + + render({ app }, { item, callback }) { + const { arvHost, arvToken } = app.state; + + return ( + +
+
+ Are you sure you want to delete the following { item ? arvadosTypeName(item.uuid) : null }: +
+ { item ? : null } +
???
+
+ +
+ { e.preventDefault(); + wbDeleteObject(arvHost, arvToken, item.uuid).then(callback); } } /> + +
+
+ ); + } +} + +export default WBDeleteDialog; diff --git a/frontend/src/js/misc/wb-delete-object.js b/frontend/src/js/misc/wb-delete-object.js new file mode 100644 index 0000000..af2ac4e --- /dev/null +++ b/frontend/src/js/misc/wb-delete-object.js @@ -0,0 +1,11 @@ +import makeArvadosRequest from 'make-arvados-request'; +import arvadosTypeName from 'arvados-type-name'; + +function wbDeleteObject(arvHost, arvToken, uuid) { + const typeName = arvadosTypeName(uuid); + return makeArvadosRequest(arvHost, arvToken, + '/arvados/v1/' + typeName + 's/' + + uuid, { 'method': 'DELETE' }); +} + +export default wbDeleteObject; diff --git a/frontend/src/js/page/wb-browse.js b/frontend/src/js/page/wb-browse.js index 7b170b1..c7c90d4 100644 --- a/frontend/src/js/page/wb-browse.js +++ b/frontend/src/js/page/wb-browse.js @@ -9,11 +9,13 @@ import WBProcessListing from 'wb-process-listing'; import WBCollectionListing from 'wb-collection-listing'; import WBWorkflowListing from 'wb-workflow-listing'; import WBRenameDialog from 'wb-rename-dialog'; +import WBDeleteDialog from 'wb-delete-dialog'; class WBBrowse extends Component { constructor(...args) { super(...args); this.renameDialogRef = createRef(); + this.deleteDialogRef = createRef(); } getUrl(params) { @@ -45,6 +47,15 @@ class WBBrowse extends Component { ); } + renderDeleteButton(item, callback) { + return ( + + ); + } + render({ ownerUuid, activePage, appState, app, objTypeTab, collectionPage, processPage, workflowPage }) { @@ -52,6 +63,8 @@ class WBBrowse extends Component {
+ + @@ -66,7 +79,8 @@ class WBBrowse extends Component { itemsPerPage="5" activePage={ Number(activePage || 0) } onPageChanged={ i => route('/browse/' + (ownerUuid || '') + '/' + i) } - renderRenameLink={ (it, cb) => this.renderRenameLink(it, cb) } /> + renderRenameLink={ (it, cb) => this.renderRenameLink(it, cb) } + renderDeleteButton={ (it, cb) => this.renderDeleteButton(it, cb) } /> this.getUrl({ 'collectionPage': i }) } - renderRenameLink={ (it, cb) => this.renderRenameLink(it, cb) } /> + renderRenameLink={ (it, cb) => this.renderRenameLink(it, cb) } + renderDeleteButton={ (it, cb) => this.renderDeleteButton(it, cb) } /> ) : (objTypeTab === 'process' ? ( this.route({ 'processPage': i }) } - renderRenameLink={ (it, cb) => this.renderRenameLink(it, cb) } /> + renderRenameLink={ (it, cb) => this.renderRenameLink(it, cb) } + renderDeleteButton={ (it, cb) => this.renderDeleteButton(it, cb) } /> ) : (objTypeTab === 'workflow' ? ( this.getUrl({ 'workflowPage': i }) } - renderRenameLink={ (it, cb) => this.renderRenameLink(it, cb) } /> + renderRenameLink={ (it, cb) => this.renderRenameLink(it, cb) } + renderDeleteButton={ (it, cb) => this.renderDeleteButton(it, cb) } /> ) : null)) } diff --git a/frontend/src/js/widget/wb-dialog.js b/frontend/src/js/widget/wb-dialog.js index 570a625..204bc2c 100644 --- a/frontend/src/js/widget/wb-dialog.js +++ b/frontend/src/js/widget/wb-dialog.js @@ -34,10 +34,13 @@ class WBDialog extends Component {