color: arvadosPurple
}
}
+ },
+ MuiStepIcon: {
+ root: {
+ '&$active': {
+ color: arvadosPurple
+ },
+ '&$completed': {
+ color: 'inherited'
+ },
+ }
}
},
mixins: {
import { History, Location } from 'history';
import { RootStore } from '~/store/store';
-import { matchProcessRoute, matchProcessLogRoute, matchProjectRoute, matchCollectionRoute, matchFavoritesRoute, matchTrashRoute, matchRootRoute, matchSharedWithMeRoute, matchWorkflowRoute } from './routes';
+import { matchProcessRoute, matchProcessLogRoute, matchProjectRoute, matchCollectionRoute, matchFavoritesRoute, matchTrashRoute, matchRootRoute, matchSharedWithMeRoute, matchRunProcessRoute, matchWorkflowRoute } from './routes';
import { loadProject, loadCollection, loadFavorites, loadTrash, loadProcess, loadProcessLog } from '~/store/workbench/workbench-actions';
import { navigateToRootProject } from '~/store/navigation/navigation-action';
-import { loadSharedWithMe, loadWorkflow } from '~/store/workbench/workbench-actions';
+import { loadSharedWithMe, loadRunProcess, loadWorkflow } from '../store/workbench/workbench-actions';
export const addRouteChangeHandlers = (history: History, store: RootStore) => {
const handler = handleLocationChange(store);
const processMatch = matchProcessRoute(pathname);
const processLogMatch = matchProcessLogRoute(pathname);
const sharedWithMeMatch = matchSharedWithMeRoute(pathname);
+ const runProcessMatch = matchRunProcessRoute(pathname);
const workflowMatch = matchWorkflowRoute(pathname);
if (projectMatch) {
store.dispatch(navigateToRootProject);
} else if (sharedWithMeMatch) {
store.dispatch(loadSharedWithMe);
+ } else if (runProcessMatch) {
+ store.dispatch(loadRunProcess);
} else if (workflowMatch) {
store.dispatch(loadWorkflow);
}
TRASH: '/trash',
PROCESS_LOGS: `/process-logs/:id(${RESOURCE_UUID_PATTERN})`,
SHARED_WITH_ME: '/shared-with-me',
+ RUN_PROCESS: '/run-process',
WORKFLOWS: '/workflows'
};
export const matchSharedWithMeRoute = (route: string) =>
matchPath(route, { path: Routes.SHARED_WITH_ME });
+export const matchRunProcessRoute = (route: string) =>
+ matchPath(route, { path: Routes.RUN_PROCESS });
+
export const matchWorkflowRoute = (route: string) =>
matchPath<ResourceRouteParams>(route, { path: Routes.WORKFLOWS });
};
export const navigateToSharedWithMe = push(Routes.SHARED_WITH_ME);
+
+export const navigateToRunProcess = push(Routes.RUN_PROCESS);
\ No newline at end of file
--- /dev/null
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import { Dispatch } from 'redux';
+import { unionize, ofType, UnionOf } from "~/common/unionize";
+import { ServiceRepository } from "~/services/services";
+import { RootState } from '~/store/store';
+
+export const runProcessPanelActions = unionize({
+ CHANGE_STEP: ofType<number>()
+});
+
+export type RunProcessPanelAction = UnionOf<typeof runProcessPanelActions>;
+
+export const loadRunProcessPanel = () =>
+ (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
+
+ };
+
+export const goToStep = (step: number) => runProcessPanelActions.CHANGE_STEP(step);
\ No newline at end of file
--- /dev/null
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import { RunProcessPanelAction, runProcessPanelActions } from '~/store/run-process-panel/run-process-panel-actions';
+
+interface RunProcessPanel {
+ currentStep: number;
+}
+
+const initialState: RunProcessPanel = {
+ currentStep: 0
+};
+
+export const runProcessPanelReducer = (state = initialState, action: RunProcessPanelAction): RunProcessPanel =>
+ runProcessPanelActions.match(action, {
+ CHANGE_STEP: currentStep => ({ ...state, currentStep }),
+ default: () => state
+ });
\ No newline at end of file
import { SHARED_WITH_ME_PANEL_ID } from '~/store/shared-with-me-panel/shared-with-me-panel-actions';
import { SharedWithMeMiddlewareService } from './shared-with-me-panel/shared-with-me-middleware-service';
import { progressIndicatorReducer } from './progress-indicator/progress-indicator-reducer';
+import { runProcessPanelReducer } from '~/store/run-process-panel/run-process-panel-reducer';
import { WorkflowMiddlewareService } from './workflow-panel/workflow-middleware-service';
import { WORKFLOW_PANEL_ID } from './workflow-panel/workflow-panel-actions';
treePicker: treePickerReducer,
fileUploader: fileUploaderReducer,
processPanel: processPanelReducer,
- progressIndicator: progressIndicatorReducer
+ progressIndicator: progressIndicatorReducer,
+ runProcessPanel: runProcessPanelReducer
});
import { FilterBuilder } from '~/services/api/filter-builder';
import { GroupContentsResource } from '~/services/groups-service/groups-service';
import { unionize, ofType, UnionOf, MatchCases } from '~/common/unionize';
+import { loadRunProcessPanel } from '~/store/run-process-panel/run-process-panel-actions';
export const WORKBENCH_LOADING_SCREEN = 'workbenchLoadingScreen';
await dispatch<any>(setSidePanelBreadcrumbs(SidePanelTreeCategory.SHARED_WITH_ME));
});
+export const loadRunProcess = handleFirstTimeLoad(
+ async (dispatch: Dispatch) => {
+ dispatch<any>(loadRunProcessPanel());
+ }
+);
+
export const loadWorkflow = handleFirstTimeLoad(async (dispatch: Dispatch<any>) => {
dispatch(activateSidePanelTreeItem(SidePanelTreeCategory.WORKFLOWS));
await dispatch(loadWorkflowPanel());
dispatch(setSidePanelBreadcrumbs(SidePanelTreeCategory.WORKFLOWS));
});
+
const finishLoadingProject = (project: GroupContentsResource | string) =>
async (dispatch: Dispatch<any>) => {
const uuid = typeof project === 'string' ? project : project.uuid;
import { openProjectCreateDialog } from '~/store/projects/project-create-actions';
import { openCollectionCreateDialog } from '~/store/collections/collection-create-actions';
import { matchProjectRoute } from '~/routes/routes';
+import { navigateToRunProcess } from '~/store/navigation/navigation-action';
type CssRules = 'button' | 'menuItem' | 'icon';
<MenuItem className={classes.menuItem} onClick={this.handleNewCollectionClick}>
<CollectionIcon className={classes.icon} /> New collection
</MenuItem>
- <MenuItem className={classes.menuItem}>
+ <MenuItem className={classes.menuItem} onClick={this.handleRunProcessClick}>
<ProcessIcon className={classes.icon} /> Run a process
</MenuItem>
<MenuItem className={classes.menuItem} onClick={this.handleNewProjectClick}>
this.props.dispatch<any>(openProjectCreateDialog(this.props.currentItemId));
}
+ handleRunProcessClick = () => {
+ this.props.dispatch<any>(navigateToRunProcess);
+ }
+
handleNewCollectionClick = () => {
this.props.dispatch<any>(openCollectionCreateDialog(this.props.currentItemId));
}
--- /dev/null
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import * as React from 'react';
+import { Stepper, Step, StepLabel, StepContent, Button } from '@material-ui/core';
+
+export interface RunProcessPanelRootDataProps {
+ currentStep: number;
+}
+
+export interface RunProcessPanelRootActionProps {
+ onClick: (step: number) => void;
+}
+
+type RunProcessPanelRootProps = RunProcessPanelRootDataProps & RunProcessPanelRootActionProps;
+
+export const RunProcessPanelRoot = ({ currentStep, onClick, ...props }: RunProcessPanelRootProps) =>
+ <Stepper activeStep={currentStep} orientation="vertical" elevation={2}>
+ <Step>
+ <StepLabel>Choose a workflow</StepLabel>
+ <StepContent>
+ <Button variant="contained" color="primary" onClick={() => onClick(1)}>
+ Next
+ </Button>
+ </StepContent>
+ </Step>
+ <Step>
+ <StepLabel>Select inputs</StepLabel>
+ <StepContent>
+ <Button color="primary" onClick={() => onClick(0)}>
+ Back
+ </Button>
+ <Button variant="contained" color="primary">
+ Run Process
+ </Button>
+ </StepContent>
+ </Step>
+ </Stepper>;
\ No newline at end of file
--- /dev/null
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import { Dispatch } from 'redux';
+import { connect } from 'react-redux';
+import { RootState } from '~/store/store';
+import { RunProcessPanelRootDataProps, RunProcessPanelRootActionProps, RunProcessPanelRoot } from '~/views/run-process-panel/run-process-panel-root';
+import { goToStep } from '~/store/run-process-panel/run-process-panel-actions';
+
+const mapStateToProps = ({ runProcessPanel }: RootState): RunProcessPanelRootDataProps => {
+ return {
+ currentStep: runProcessPanel.currentStep
+ };
+};
+
+const mapDispatchToProps = (dispatch: Dispatch): RunProcessPanelRootActionProps => ({
+ onClick: (step: number) => {
+ dispatch<any>(goToStep(step));
+ }
+});
+
+export const RunProcessPanel = connect(mapStateToProps, mapDispatchToProps)(RunProcessPanelRoot);
\ No newline at end of file
import { MoveCollectionDialog } from '~/views-components/dialog-forms/move-collection-dialog';
import { FilesUploadCollectionDialog } from '~/views-components/dialog-forms/files-upload-collection-dialog';
import { PartialCopyCollectionDialog } from '~/views-components/dialog-forms/partial-copy-collection-dialog';
-import { TrashPanel } from "~/views/trash-panel/trash-panel";
+import { ProcessCommandDialog } from '~/views-components/process-command-dialog/process-command-dialog';
import { MainContentBar } from '~/views-components/main-content-bar/main-content-bar';
import { Grid } from '@material-ui/core';
-import { SharedWithMePanel } from '../shared-with-me-panel/shared-with-me-panel';
+import { TrashPanel } from "~/views/trash-panel/trash-panel";
+import { SharedWithMePanel } from '~/views/shared-with-me-panel/shared-with-me-panel';
+import { RunProcessPanel } from '~/views/run-process-panel/run-process-panel';
import SplitterLayout from 'react-splitter-layout';
-import { ProcessCommandDialog } from '~/views-components/process-command-dialog/process-command-dialog';
import { WorkflowPanel } from '~/views/workflow-panel/workflow-panel';
type CssRules = 'root' | 'container' | 'splitter' | 'asidePanel' | 'contentWrapper' | 'content';
<Route path={Routes.TRASH} component={TrashPanel} />
<Route path={Routes.PROCESS_LOGS} component={ProcessLogPanel} />
<Route path={Routes.SHARED_WITH_ME} component={SharedWithMePanel} />
+ <Route path={Routes.RUN_PROCESS} component={RunProcessPanel} />
<Route path={Routes.WORKFLOWS} component={WorkflowPanel} />
</Switch>
</Grid>