interface DetailsAttributeDataProps {
label: string;
classLabel?: string;
- value?: string | number;
+ value?: any;
classValue?: string;
lowercaseValue?: boolean;
link?: string;
import { collectionFilesItemActionSet } from './views-components/context-menu/action-sets/collection-files-item-action-set';
import { collectionActionSet } from './views-components/context-menu/action-sets/collection-action-set';
import { collectionResourceActionSet } from './views-components/context-menu/action-sets/collection-resource-action-set';
+import { processActionSet } from './views-components/context-menu/action-sets/process-action-set';
const getBuildNumber = () => "BN-" + (process.env.REACT_APP_BUILD_NUMBER || "dev");
const getGitCommit = () => "GIT-" + (process.env.REACT_APP_GIT_COMMIT || "latest").substr(0, 7);
addMenuActionSet(ContextMenuKind.COLLECTION_FILES_ITEM, collectionFilesItemActionSet);
addMenuActionSet(ContextMenuKind.COLLECTION, collectionActionSet);
addMenuActionSet(ContextMenuKind.COLLECTION_RESOURCE, collectionResourceActionSet);
+addMenuActionSet(ContextMenuKind.PROCESS, processActionSet);
fetchConfig()
.then(config => {
--- /dev/null
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import { ContextMenuActionSet } from "../context-menu-action-set";
+import { ToggleFavoriteAction } from "../actions/favorite-action";
+import { toggleFavorite } from "~/store/favorites/favorites-actions";
+import {
+ RenameIcon, ShareIcon, MoveToIcon, CopyIcon, DetailsIcon, ProvenanceGraphIcon,
+ AdvancedIcon, RemoveIcon, ReRunProcessIcon, LogIcon
+} from "~/components/icon/icon";
+import { favoritePanelActions } from "~/store/favorite-panel/favorite-panel-action";
+
+export const processActionSet: ContextMenuActionSet = [[
+ {
+ icon: RenameIcon,
+ name: "Edit process",
+ execute: (dispatch, resource) => {
+ // add code
+ }
+ },
+ {
+ icon: ShareIcon,
+ name: "Share",
+ execute: (dispatch, resource) => {
+ // add code
+ }
+ },
+ {
+ icon: MoveToIcon,
+ name: "Move to",
+ execute: (dispatch, resource) => {
+ // add code
+ }
+ },
+ {
+ component: ToggleFavoriteAction,
+ execute: (dispatch, resource) => {
+ dispatch<any>(toggleFavorite(resource)).then(() => {
+ dispatch<any>(favoritePanelActions.REQUEST_ITEMS());
+ });
+ }
+ },
+ {
+ icon: CopyIcon,
+ name: "Copy to project",
+ execute: (dispatch, resource) => {
+ // add code
+ }
+ },
+ {
+ icon: ReRunProcessIcon,
+ name: "Re-run process",
+ execute: (dispatch, resource) => {
+ // add code
+ }
+ },
+ {
+ icon: DetailsIcon,
+ name: "View details",
+ execute: (dispatch, resource) => {
+ // add code
+ }
+ },
+ {
+ icon: LogIcon,
+ name: "Log",
+ execute: (dispatch, resource) => {
+ // add code
+ }
+ },
+ {
+ icon: ProvenanceGraphIcon,
+ name: "Provenance graph",
+ execute: (dispatch, resource) => {
+ // add code
+ }
+ },
+ {
+ icon: AdvancedIcon,
+ name: "Advanced",
+ execute: (dispatch, resource) => {
+ // add code
+ }
+ },
+ {
+ icon: RemoveIcon,
+ name: "Remove",
+ execute: (dispatch, resource) => {
+ // add code
+ }
+ }
+]];
COLLECTION_FILES = "CollectionFiles",
COLLECTION_FILES_ITEM = "CollectionFilesItem",
COLLECTION = 'Collection',
- COLLECTION_RESOURCE = 'CollectionResource'
+ COLLECTION_RESOURCE = 'CollectionResource',
+ PROCESS = "Process"
}
+++ /dev/null
-// Copyright (C) The Arvados Authors. All rights reserved.
-//
-// SPDX-License-Identifier: AGPL-3.0
-
-import { Dispatch } from "redux";
-import { reduxForm, reset, startSubmit, stopSubmit } from "redux-form";
-import { withDialog } from "~/store/dialog/with-dialog";
-import { dialogActions } from "~/store/dialog/dialog-actions";
-import { DialogCollectionCreateWithSelected } from "../dialog-create/dialog-collection-create-selected";
-import { resetPickerProjectTree } from "~/store/project-tree-picker/project-tree-picker-actions";
-
-export const DIALOG_COLLECTION_CREATE_WITH_SELECTED = 'dialogCollectionCreateWithSelected';
-
-export const createCollectionWithSelected = () =>
- (dispatch: Dispatch) => {
- dispatch(reset(DIALOG_COLLECTION_CREATE_WITH_SELECTED));
- dispatch<any>(resetPickerProjectTree());
- dispatch(dialogActions.OPEN_DIALOG({ id: DIALOG_COLLECTION_CREATE_WITH_SELECTED, data: {} }));
- };
-
-export const [DialogCollectionCreateWithSelectedFile] = [DialogCollectionCreateWithSelected]
- .map(withDialog(DIALOG_COLLECTION_CREATE_WITH_SELECTED))
- .map(reduxForm({
- form: DIALOG_COLLECTION_CREATE_WITH_SELECTED,
- onSubmit: (data, dispatch) => {
- dispatch(startSubmit(DIALOG_COLLECTION_CREATE_WITH_SELECTED));
- setTimeout(() => dispatch(stopSubmit(DIALOG_COLLECTION_CREATE_WITH_SELECTED, { name: 'Invalid name' })), 2000);
- }
- }));
+++ /dev/null
-// Copyright (C) The Arvados Authors. All rights reserved.
-//
-// SPDX-License-Identifier: AGPL-3.0
-
-import * as React from "react";
-import { InjectedFormProps, Field, WrappedFieldProps } from "redux-form";
-import { Dialog, DialogTitle, DialogContent, DialogActions, Button, CircularProgress } from "@material-ui/core";
-import { WithDialogProps } from "~/store/dialog/with-dialog";
-import { TextField } from "~/components/text-field/text-field";
-import { COLLECTION_NAME_VALIDATION, COLLECTION_DESCRIPTION_VALIDATION, COLLECTION_PROJECT_VALIDATION } from "~/validators/validators";
-import { ProjectTreePicker } from "../project-tree-picker/project-tree-picker";
-
-export const DialogCollectionCreateWithSelected = (props: WithDialogProps<string> & InjectedFormProps<{ name: string }>) =>
- <form>
- <Dialog open={props.open}
- disableBackdropClick={true}
- disableEscapeKeyDown={true}>
- <DialogTitle>Create a collection</DialogTitle>
- <DialogContent style={{ display: 'flex' }}>
- <div>
- <Field
- name='name'
- component={TextField}
- validate={COLLECTION_NAME_VALIDATION}
- label="Collection Name" />
- <Field
- name='description'
- component={TextField}
- validate={COLLECTION_DESCRIPTION_VALIDATION}
- label="Description - optional" />
- </div>
- <Field
- name="projectUuid"
- component={Picker}
- validate={COLLECTION_PROJECT_VALIDATION} />
- </DialogContent>
- <DialogActions>
- <Button
- variant='flat'
- color='primary'
- disabled={props.submitting}
- onClick={props.closeDialog}>
- Cancel
- </Button>
- <Button
- variant='contained'
- color='primary'
- type='submit'
- onClick={props.handleSubmit}
- disabled={props.pristine || props.invalid || props.submitting}>
- {props.submitting ? <CircularProgress size={20} /> : 'Create a collection'}
- </Button>
- </DialogActions>
- </Dialog>
- </form>;
-
-const Picker = (props: WrappedFieldProps) =>
- <div style={{ width: '400px', height: '144px', display: 'flex', flexDirection: 'column' }}>
- <ProjectTreePicker onChange={projectUuid => props.input.onChange(projectUuid)} />
- </div>;
import * as React from 'react';
import { compose } from 'redux';
-import { reduxForm, reset, startSubmit, stopSubmit, InjectedFormProps, Field } from 'redux-form';
+import { reduxForm, InjectedFormProps, Field } from 'redux-form';
import { withDialog, WithDialogProps } from '~/store/dialog/with-dialog';
import { FormDialog } from '~/components/form-dialog/form-dialog';
import { DialogContentText } from '@material-ui/core';
import * as React from 'react';
import {
StyleRulesCallback, WithStyles, withStyles, Card,
- CardHeader, IconButton, CardContent, Grid
+ CardHeader, IconButton, CardContent, Grid, Chip
} from '@material-ui/core';
import { ArvadosTheme } from '~/common/custom-theme';
import { ProcessResource } from '~/models/process';
import { DetailsAttribute } from '~/components/details-attribute/details-attribute';
import { RootState } from '~/store/store';
-type CssRules = 'card' | 'iconHeader' | 'label' | 'value';
+type CssRules = 'card' | 'iconHeader' | 'label' | 'value' | 'content' | 'chip' | 'headerText';
const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
card: {
- marginBottom: theme.spacing.unit * 2
+ marginBottom: theme.spacing.unit * 2,
+ width: '60%'
},
iconHeader: {
fontSize: '1.875rem',
value: {
textTransform: 'none',
fontSize: '0.875rem'
+ },
+ content: {
+ display: 'flex',
+ paddingBottom: '0px ',
+ paddingTop: '0px',
+ '&:last-child': {
+ paddingBottom: '0px ',
+ }
+ },
+ chip: {
+ height: theme.spacing.unit * 2.5,
+ width: theme.spacing.unit * 12,
+ backgroundColor: theme.customs.colors.green700,
+ color: theme.palette.common.white,
+ fontSize: '0.875rem',
+ borderRadius: theme.spacing.unit * 0.625
+ },
+ headerText: {
+ fontSize: '0.875rem',
+ display: 'flex',
+ position: 'relative',
+ justifyContent: 'flex-end',
+ top: -theme.spacing.unit * 4.5,
+ right: theme.spacing.unit * 2,
}
});
</IconButton>
}
title="Pipeline template that generates a config file from a template"
- subheader="(no description)"
- />
- <CardContent>
+ />
+ <CardContent className={classes.content}>
<Grid container direction="column">
- <Grid item xs={6}>
+ <Grid item xs={8}>
+ <DetailsAttribute classLabel={classes.label} classValue={classes.value}
+ label='Status' value={<Chip label="Complete" className={classes.chip} />} />
<DetailsAttribute classLabel={classes.label} classValue={classes.value}
- label='Collection UUID' value="uuid" />
+ label='Started at' value="1:25 PM 3/23/2018" />
+ <DetailsAttribute classLabel={classes.label} classValue={classes.value}
+ label='Finished at' value='1:25 PM 3/23/2018' />
+ </Grid>
+ </Grid>
+ <Grid container direction="column">
+ <Grid item xs={8}>
<DetailsAttribute classLabel={classes.label} classValue={classes.value}
- label='Number of files' value='14' />
+ label='Container output' />
<DetailsAttribute classLabel={classes.label} classValue={classes.value}
- label='Content size' value='54 MB' />
+ label='Show inputs' />
<DetailsAttribute classLabel={classes.label} classValue={classes.value}
- label='Owner' value="ownerUuid" />
+ label='Show command' />
</Grid>
</Grid>
</CardContent>
+ <span className={classes.headerText}>This container request was created from the workflow FastQC MultiQC</span>
</Card>
</div>;
}
import { RenameFileDialog } from '~/views-components/rename-file-dialog/rename-file-dialog';
import { FileRemoveDialog } from '~/views-components/file-remove-dialog/file-remove-dialog';
import { MultipleFilesRemoveDialog } from '~/views-components/file-remove-dialog/multiple-files-remove-dialog';
-import { DialogCollectionCreateWithSelectedFile } from '~/views-components/create-collection-dialog-with-selected/create-collection-dialog-with-selected';
import { UploadCollectionFilesDialog } from '~/views-components/upload-collection-files-dialog/upload-collection-files-dialog';
import { CollectionPartialCopyDialog } from '~/views-components/collection-partial-copy-dialog/collection-partial-copy-dialog';
import { MoveProjectDialog } from '~/views-components/dialog-forms/move-project-dialog';
<CreateCollectionDialog />
<RenameFileDialog />
<CollectionPartialCopyDialog />
- <DialogCollectionCreateWithSelectedFile />
<FileRemoveDialog />
<CopyCollectionDialog />
<MultipleFilesRemoveDialog />
}}
onContextMenu={(event, item) => {
this.openContextMenu(event, {
- uuid: item.uuid,
- name: item.name,
- description: item.description,
- kind: ContextMenuKind.COLLECTION
+ uuid: 'item.uuid',
+ name: 'item.name',
+ description: 'item.description',
+ kind: ContextMenuKind.PROCESS
});
}}
{...props} />
projects / arvados-workbench2.git / commitdiff