|
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566 |
- import { h, Component, createRef } from 'preact';
- import WBDialog from 'wb-dialog';
- import linkState from 'linkstate';
- import makeArvadosRequest from 'make-arvados-request';
-
- class WBNewProjectDialog extends Component {
- constructor(...args) {
- super(...args);
- this.dialogRef = createRef();
- this.state.inputId = uuid.v4();
- }
-
- show(ownerUuid, callback) {
- const { inputId } = this.state;
- this.setState({
- 'ownerUuid': ownerUuid,
- 'newName': null,
- 'placeholderName': 'New Project (' + (new Date()).toISOString() + ')',
- 'callback': callback || (() => {})
- });
- this.dialogRef.current.show();
- $('#' + inputId).focus();
- }
-
- hide() {
- this.dialogRef.current.hide();
- }
-
- render({ app }, { ownerUuid, newName, placeholderName, callback, inputId,
- projectDescription }) {
-
- const { arvHost, arvToken } = app.state;
- return (
- <WBDialog title="New Project" ref={ this.dialogRef } accept={ () => {
- const group = {
- 'group_class': 'project',
- 'name': newName || placeholderName,
- 'description': projectDescription || null,
- 'owner_uuid': ownerUuid
- };
- makeArvadosRequest(arvHost, arvToken,
- '/arvados/v1/groups', { 'method': 'POST',
- 'data': JSON.stringify(group),
- 'expectedStatus': [200, 202] }
- ).then(callback);
- } }>
- <div>
- <div class="form-group">
- <label for={ inputId }>Project Name</label>
- <input type="text" class="form-control" id={ inputId }
- placeholder={ placeholderName }
- value={ newName } onChange={ linkState(this, 'newName') } />
- </div>
- <div class="form-group">
- <label for="projectDescription">Project Description (optional)</label>
- <input type="text" class="form-control" id="projectDescription"
- placeholder="Project Description (optional)"
- value={ projectDescription } onChange={ linkState(this, 'projectDescription') } />
- </div>
- </div>
- </WBDialog>
- );
- }
- }
-
- export default WBNewProjectDialog;
|