```
xhost +local:root
-ARVADOS_DIR=/path/to/arvados
-docker run -ti -v$PWD:$PWD -v$ARVADOS_DIR:/usr/src/arvados -w$PWD --env="DISPLAY" --volume="/tmp/.X11-unix:/tmp/.X11-unix:rw" workbench2-build /bin/bash
+docker run -ti -v$PWD:$PWD -v$(realpath ../..):/usr/src/arvados -w$PWD --env="DISPLAY" --volume="/tmp/.X11-unix:/tmp/.X11-unix:rw" workbench2-build /bin/bash
(inside container)
yarn run cypress install
tools/run-integration-tests.sh -i -a /usr/src/arvados
type MPVHideablePanelProps = MPVHideablePanelDataProps & MPVHideablePanelActionProps;
-const MPVHideablePanel = ({doHidePanel, doMaximizePanel, doUnMaximizePanel, name, visible, maximized, illuminated, ...props}: MPVHideablePanelProps) =>
+const MPVHideablePanel = ({ doHidePanel, doMaximizePanel, doUnMaximizePanel, name, visible, maximized, illuminated, ...props }: MPVHideablePanelProps) =>
visible
- ? <>
- {React.cloneElement((props.children as ReactElement), { doHidePanel, doMaximizePanel, doUnMaximizePanel, panelName: name, panelMaximized: maximized, panelIlluminated: illuminated, panelRef: props.panelRef })}
- </>
- : null;
+ ? <>
+ {React.cloneElement((props.children as ReactElement), { doHidePanel, doMaximizePanel, doUnMaximizePanel, panelName: name, panelMaximized: maximized, panelIlluminated: illuminated, panelRef: props.panelRef })}
+ </>
+ : null;
interface MPVPanelDataProps {
panelName?: string;
// Props received by panel implementors
export type MPVPanelProps = MPVPanelDataProps & MPVPanelActionProps;
-type MPVPanelContentProps = {children: ReactElement} & MPVPanelProps & GridProps;
+type MPVPanelContentProps = { children: ReactElement } & MPVPanelProps & GridProps;
// Grid item compatible component for layout and MPV props passing
-export const MPVPanelContent = ({doHidePanel, doMaximizePanel, doUnMaximizePanel, panelName,
+export const MPVPanelContent = ({ doHidePanel, doMaximizePanel, doUnMaximizePanel, panelName,
panelMaximized, panelIlluminated, panelRef, forwardProps, maxHeight, minHeight,
- ...props}: MPVPanelContentProps) => {
+ ...props }: MPVPanelContentProps) => {
useEffect(() => {
if (panelRef && panelRef.current) {
- panelRef.current.scrollIntoView({alignToTop: true});
+ panelRef.current.scrollIntoView({ alignToTop: true });
}
}, [panelRef]);
? '100%'
: maxHeight;
- return <Grid item style={{maxHeight: maxH, minHeight}} {...props}>
+ return <Grid item style={{ maxHeight: maxH, minHeight }} {...props}>
<span ref={panelRef} /> {/* Element to scroll to when the panel is selected */}
- <Paper style={{height: '100%'}} elevation={panelIlluminated ? 8 : 0}>
- { forwardProps
+ <Paper style={{ height: '100%' }} elevation={panelIlluminated ? 8 : 0}>
+ {forwardProps
? React.cloneElement(props.children, { doHidePanel, doMaximizePanel, doUnMaximizePanel, panelName, panelMaximized })
- : props.children }
+ : props.children}
</Paper>
</Grid>;
}
type MPVContainerProps = MPVContainerDataProps & GridProps;
// Grid container compatible component that also handles panel toggling.
-const MPVContainerComponent = ({children, panelStates, classes, ...props}: MPVContainerProps & WithStyles<CssRules>) => {
+const MPVContainerComponent = ({ children, panelStates, classes, ...props }: MPVContainerProps & WithStyles<CssRules>) => {
if (children === undefined || children === null || children === {}) {
children = [];
} else if (!isArray(children)) {
}
const initialVisibility = (children as ReactNodeArray).map((_, idx) =>
!panelStates || // if panelStates wasn't passed, default to all visible panels
- (panelStates[idx] &&
- (panelStates[idx].visible || panelStates[idx].visible === undefined)));
+ (panelStates[idx] &&
+ (panelStates[idx].visible || panelStates[idx].visible === undefined)));
const [panelVisibility, setPanelVisibility] = useState<boolean[]>(initialVisibility);
const [previousPanelVisibility, setPreviousPanelVisibility] = useState<boolean[]>(initialVisibility);
const [highlightedPanel, setHighlightedPanel] = useState<number>(-1);
setPanelVisibility([
...panelVisibility.slice(0, idx),
true,
- ...panelVisibility.slice(idx+1)
+ ...panelVisibility.slice(idx + 1)
]);
setSelectedPanel(idx);
};
setPanelVisibility([
...panelVisibility.slice(0, idx),
false,
- ...panelVisibility.slice(idx+1)
+ ...panelVisibility.slice(idx + 1)
])
};
const maximizeFn = (idx: number) => () => {
setPanelVisibility([
...panelVisibility.slice(0, idx).map(() => false),
true,
- ...panelVisibility.slice(idx+1).map(() => false),
+ ...panelVisibility.slice(idx + 1).map(() => false),
]);
};
const unMaximizeFn = (idx: number) => () => {
setSelectedPanel(idx);
}
const panelName = panelStates === undefined
- ? `Panel ${idx+1}`
- : (panelStates[idx] && panelStates[idx].name) || `Panel ${idx+1}`;
+ ? `Panel ${idx + 1}`
+ : (panelStates[idx] && panelStates[idx].name) || `Panel ${idx + 1}`;
const btnVariant = panelVisibility[idx]
? "contained"
: "outlined";
const btnTooltip = panelVisibility[idx]
? ``
- :`Open ${panelName} panel`;
+ : `Open ${panelName} panel`;
const panelIsMaximized = panelVisibility[idx] &&
panelVisibility.filter(e => e).length === 1;
setHighlightedPanel(-1);
}}
onClick={showFn(idx)}>
- {panelName}
+ {panelName}
</Button>
</Tooltip>
];
return <Grid container {...props} className={classes.root}>
<Grid container item direction="row">
- { buttons.map((tgl, idx) => <Grid item key={idx}>{tgl}</Grid>) }
+ {buttons.map((tgl, idx) => <Grid item key={idx}>{tgl}</Grid>)}
</Grid>
<Grid container item {...props} xs className={classes.content}
onScroll={() => setSelectedPanel(-1)}>
- { panelVisibility.includes(true)
+ {panelVisibility.includes(true)
? panels
: <Grid container item alignItems='center' justify='center'>
<DefaultView messages={["All panels are hidden.", "Click on the buttons above to show them."]} icon={InfoIcon} />
- </Grid> }
+ </Grid>}
</Grid>
</Grid>;
};
//
// SPDX-License-Identifier: AGPL-3.0
-import { DataExplorerMiddlewareService, dataExplorerToListParams, getDataExplorerColumnFilters, getOrder } from "store/data-explorer/data-explorer-middleware-service";
+import { getDataExplorerColumnFilters } from "store/data-explorer/data-explorer-middleware-service";
import { RootState } from "../store";
import { ServiceRepository } from "services/services";
-import { FilterBuilder, joinFilters } from "services/api/filter-builder";
+import { joinFilters } from "services/api/filter-builder";
import { allProcessesPanelActions } from "./all-processes-panel-action";
import { Dispatch, MiddlewareAPI } from "redux";
-import { resourcesActions } from "store/resources/resources-actions";
-import { snackbarActions, SnackbarKind } from 'store/snackbar/snackbar-actions';
-import { progressIndicatorActions } from 'store/progress-indicator/progress-indicator-actions';
-import { getDataExplorer, DataExplorer } from "store/data-explorer/data-explorer-reducer";
-import { loadMissingProcessesInformation } from "store/project-panel/project-panel-middleware-service";
+import { DataExplorer } from "store/data-explorer/data-explorer-reducer";
import { DataColumns } from "components/data-table/data-table";
import {
- ProcessStatusFilter,
- buildProcessStatusFilters,
serializeOnlyProcessTypeFilters
} from "../resource-type-filters/resource-type-filters";
import { AllProcessesPanelColumnNames } from "views/all-processes-panel/all-processes-panel";
-import { containerRequestFieldsNoMounts, ContainerRequestResource } from "models/container-request";
+import { ProcessesMiddlewareService } from "store/processes/processes-middleware-service";
+import { ContainerRequestResource } from 'models/container-request';
-export class AllProcessesPanelMiddlewareService extends DataExplorerMiddlewareService {
- constructor(private services: ServiceRepository, id: string) {
- super(id);
+export class AllProcessesPanelMiddlewareService extends ProcessesMiddlewareService {
+ constructor(services: ServiceRepository, id: string) {
+ super(services, allProcessesPanelActions, id);
}
- async requestItems(api: MiddlewareAPI<Dispatch, RootState>, criteriaChanged?: boolean, background?: boolean) {
- const dataExplorer = getDataExplorer(api.getState().dataExplorer, this.getId());
- if (!dataExplorer) {
- api.dispatch(allProcessesPanelDataExplorerIsNotSet());
- } else {
- try {
- if (!background) { api.dispatch(progressIndicatorActions.START_WORKING(this.getId())); }
- const processItems = await this.services.containerRequestService.list(
- {
- ...getParams(dataExplorer),
- // Omit mounts when viewing all process panel
- select: containerRequestFieldsNoMounts,
- });
+ getFilters(api: MiddlewareAPI<Dispatch, RootState>, dataExplorer: DataExplorer): string | null {
+ const sup = super.getFilters(api, dataExplorer);
+ if (sup === null) { return null; }
+ const columns = dataExplorer.columns as DataColumns<string, ContainerRequestResource>;
- if (!background) { api.dispatch(progressIndicatorActions.PERSIST_STOP_WORKING(this.getId())); }
- api.dispatch(resourcesActions.SET_RESOURCES(processItems.items));
- await api.dispatch<any>(loadMissingProcessesInformation(processItems.items));
- api.dispatch(allProcessesPanelActions.SET_ITEMS({
- items: processItems.items.map((resource: any) => resource.uuid),
- itemsAvailable: processItems.itemsAvailable,
- page: Math.floor(processItems.offset / processItems.limit),
- rowsPerPage: processItems.limit
- }));
- } catch {
- if (!background) { api.dispatch(progressIndicatorActions.PERSIST_STOP_WORKING(this.getId())); }
- api.dispatch(allProcessesPanelActions.SET_ITEMS({
- items: [],
- itemsAvailable: 0,
- page: 0,
- rowsPerPage: dataExplorer.rowsPerPage
- }));
- api.dispatch(couldNotFetchAllProcessesListing());
- }
- }
+ const typeFilters = serializeOnlyProcessTypeFilters(getDataExplorerColumnFilters(columns, AllProcessesPanelColumnNames.TYPE));
+ return joinFilters(sup, typeFilters);
}
}
-
-const getParams = (dataExplorer: DataExplorer) => ({
- ...dataExplorerToListParams(dataExplorer),
- order: getOrder<ContainerRequestResource>(dataExplorer),
- filters: getFilters(dataExplorer)
-});
-
-const getFilters = (dataExplorer: DataExplorer) => {
- const columns = dataExplorer.columns as DataColumns<string, ContainerRequestResource>;
- const statusColumnFilters = getDataExplorerColumnFilters(columns, 'Status');
- const activeStatusFilter = Object.keys(statusColumnFilters).find(
- filterName => statusColumnFilters[filterName].selected
- ) || ProcessStatusFilter.ALL;
-
- const nameFilter = new FilterBuilder().addILike("name", dataExplorer.searchValue).getFilters();
- const statusFilter = buildProcessStatusFilters(new FilterBuilder(), activeStatusFilter).getFilters();
- const typeFilters = serializeOnlyProcessTypeFilters(getDataExplorerColumnFilters(columns, AllProcessesPanelColumnNames.TYPE));
-
- return joinFilters(
- nameFilter,
- statusFilter,
- typeFilters
- );
-};
-
-const allProcessesPanelDataExplorerIsNotSet = () =>
- snackbarActions.OPEN_SNACKBAR({
- message: 'All Processes panel is not ready.',
- kind: SnackbarKind.ERROR
- });
-
-const couldNotFetchAllProcessesListing = () =>
- snackbarActions.OPEN_SNACKBAR({
- message: 'Could not fetch All Processes listing.',
- kind: SnackbarKind.ERROR
- });
RESET_EXPLORER_SEARCH_VALUE: () => dataExplorerActions.RESET_EXPLORER_SEARCH_VALUE({ id }),
SET_REQUEST_STATE: (payload: { requestState: DataTableRequestState }) => dataExplorerActions.SET_REQUEST_STATE({ ...payload, id }),
});
+
+export type BoundDataExplorerActions = ReturnType<typeof bindDataExplorerActions>;
--- /dev/null
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import { ServiceRepository } from 'services/services';
+import { MiddlewareAPI, Dispatch } from 'redux';
+import {
+ DataExplorerMiddlewareService, dataExplorerToListParams, listResultsToDataExplorerItemsMeta, getDataExplorerColumnFilters, getOrder
+} from 'store/data-explorer/data-explorer-middleware-service';
+import { RootState } from 'store/store';
+import { snackbarActions, SnackbarKind } from 'store/snackbar/snackbar-actions';
+import { DataExplorer, getDataExplorer } from 'store/data-explorer/data-explorer-reducer';
+import { BoundDataExplorerActions } from 'store/data-explorer/data-explorer-action';
+import { updateResources } from 'store/resources/resources-actions';
+import { ListArguments } from 'services/common-service/common-service';
+import { ProcessResource } from 'models/process';
+import { FilterBuilder, joinFilters } from 'services/api/filter-builder';
+import { DataColumns } from 'components/data-table/data-table';
+import { ProcessStatusFilter, buildProcessStatusFilters } from '../resource-type-filters/resource-type-filters';
+import { ContainerRequestResource, containerRequestFieldsNoMounts } from 'models/container-request';
+import { progressIndicatorActions } from '../progress-indicator/progress-indicator-actions';
+import { loadMissingProcessesInformation } from '../project-panel/project-panel-middleware-service';
+
+export class ProcessesMiddlewareService extends DataExplorerMiddlewareService {
+ constructor(private services: ServiceRepository, private actions: BoundDataExplorerActions, id: string) {
+ super(id);
+ }
+
+ getFilters(api: MiddlewareAPI<Dispatch, RootState>, dataExplorer: DataExplorer): string | null {
+ const columns = dataExplorer.columns as DataColumns<string, ContainerRequestResource>;
+ const statusColumnFilters = getDataExplorerColumnFilters(columns, 'Status');
+ const activeStatusFilter = Object.keys(statusColumnFilters).find(
+ filterName => statusColumnFilters[filterName].selected
+ ) || ProcessStatusFilter.ALL;
+
+ const nameFilter = new FilterBuilder().addILike("name", dataExplorer.searchValue).getFilters();
+ const statusFilter = buildProcessStatusFilters(new FilterBuilder(), activeStatusFilter).getFilters();
+
+ return joinFilters(
+ nameFilter,
+ statusFilter,
+ );
+ }
+
+ getParams(api: MiddlewareAPI<Dispatch, RootState>, dataExplorer: DataExplorer): ListArguments | null {
+ const filters = this.getFilters(api, dataExplorer)
+ if (filters === null) {
+ return null;
+ }
+ return {
+ ...dataExplorerToListParams(dataExplorer),
+ order: getOrder<ProcessResource>(dataExplorer),
+ filters
+ };
+ }
+
+ async requestItems(api: MiddlewareAPI<Dispatch, RootState>, criteriaChanged?: boolean, background?: boolean) {
+ const state = api.getState();
+ const dataExplorer = getDataExplorer(state.dataExplorer, this.getId());
+
+ try {
+ if (!background) { api.dispatch(progressIndicatorActions.START_WORKING(this.getId())); }
+
+ const params = this.getParams(api, dataExplorer);
+
+ if (params !== null) {
+ const containerRequests = await this.services.containerRequestService.list(
+ {
+ ...this.getParams(api, dataExplorer),
+ select: containerRequestFieldsNoMounts
+ });
+ api.dispatch(updateResources(containerRequests.items));
+ await api.dispatch<any>(loadMissingProcessesInformation(containerRequests.items));
+ api.dispatch(this.actions.SET_ITEMS({
+ ...listResultsToDataExplorerItemsMeta(containerRequests),
+ items: containerRequests.items.map(resource => resource.uuid),
+ }));
+ } else {
+ api.dispatch(this.actions.SET_ITEMS({
+ itemsAvailable: 0,
+ page: 0,
+ rowsPerPage: dataExplorer.rowsPerPage,
+ items: [],
+ }));
+ }
+ if (!background) { api.dispatch(progressIndicatorActions.PERSIST_STOP_WORKING(this.getId())); }
+ } catch {
+ api.dispatch(snackbarActions.OPEN_SNACKBAR({
+ message: 'Could not fetch process list.',
+ kind: SnackbarKind.ERROR
+ }));
+ if (!background) { api.dispatch(progressIndicatorActions.PERSIST_STOP_WORKING(this.getId())); }
+ }
+ }
+}
import { dataExplorerMiddleware } from "./data-explorer/data-explorer-middleware";
import { FAVORITE_PANEL_ID } from "./favorite-panel/favorite-panel-action";
import { PROJECT_PANEL_ID } from "./project-panel/project-panel-action";
+import { WORKFLOW_PROCESSES_PANEL_ID } from "./workflow-panel/workflow-panel-actions";
import { ProjectPanelMiddlewareService } from "./project-panel/project-panel-middleware-service";
import { FavoritePanelMiddlewareService } from "./favorite-panel/favorite-panel-middleware-service";
import { AllProcessesPanelMiddlewareService } from "./all-processes-panel/all-processes-panel-middleware-service";
+import { WorkflowProcessesMiddlewareService } from "./workflow-panel/workflow-middleware-service";
import { collectionPanelReducer } from "./collection-panel/collection-panel-reducer";
import { dialogReducer } from "./dialog/dialog-reducer";
import { ServiceRepository } from "services/services";
const projectPanelMiddleware = dataExplorerMiddleware(new ProjectPanelMiddlewareService(services, PROJECT_PANEL_ID));
const favoritePanelMiddleware = dataExplorerMiddleware(new FavoritePanelMiddlewareService(services, FAVORITE_PANEL_ID));
const allProcessessPanelMiddleware = dataExplorerMiddleware(new AllProcessesPanelMiddlewareService(services, ALL_PROCESSES_PANEL_ID));
+ const workflowProcessessPanelMiddleware = dataExplorerMiddleware(new WorkflowProcessesMiddlewareService(services, WORKFLOW_PROCESSES_PANEL_ID));
const trashPanelMiddleware = dataExplorerMiddleware(new TrashPanelMiddlewareService(services, TRASH_PANEL_ID));
const searchResultsPanelMiddleware = dataExplorerMiddleware(new SearchResultsMiddlewareService(services, SEARCH_RESULTS_PANEL_ID));
const sharedWithMePanelMiddleware = dataExplorerMiddleware(new SharedWithMeMiddlewareService(services, SHARED_WITH_ME_PANEL_ID));
collectionsContentAddress,
subprocessMiddleware,
treePickerSearchMiddleware,
+ workflowProcessessPanelMiddleware
];
const reduceMiddlewaresFn: (a: Middleware[], b: MiddlewareListReducer) => Middleware[] = (a, b) => b(a, services);
//
// SPDX-License-Identifier: AGPL-3.0
-import { ServiceRepository } from 'services/services';
-import { MiddlewareAPI, Dispatch } from 'redux';
-import {
- DataExplorerMiddlewareService, dataExplorerToListParams, listResultsToDataExplorerItemsMeta, getDataExplorerColumnFilters, getOrder
-} from 'store/data-explorer/data-explorer-middleware-service';
-import { RootState } from 'store/store';
-import { snackbarActions, SnackbarKind } from 'store/snackbar/snackbar-actions';
-import { DataExplorer, getDataExplorer } from 'store/data-explorer/data-explorer-reducer';
-import { updateResources } from 'store/resources/resources-actions';
-import { ListResults } from 'services/common-service/common-service';
-import { ProcessResource } from 'models/process';
-import { FilterBuilder, joinFilters } from 'services/api/filter-builder';
+import { RootState } from "../store";
+import { ServiceRepository } from "services/services";
+import { FilterBuilder, joinFilters } from "services/api/filter-builder";
+import { Dispatch, MiddlewareAPI } from "redux";
+import { DataExplorer } from "store/data-explorer/data-explorer-reducer";
+import { ProcessesMiddlewareService } from "store/processes/processes-middleware-service";
import { subprocessPanelActions } from './subprocess-panel-actions';
-import { DataColumns } from 'components/data-table/data-table';
-import { ProcessStatusFilter, buildProcessStatusFilters } from '../resource-type-filters/resource-type-filters';
-import { ContainerRequestResource, containerRequestFieldsNoMounts } from 'models/container-request';
-import { progressIndicatorActions } from '../progress-indicator/progress-indicator-actions';
-import { loadMissingProcessesInformation } from '../project-panel/project-panel-middleware-service';
+import { getProcess } from "store/processes/process";
-export class SubprocessMiddlewareService extends DataExplorerMiddlewareService {
- constructor(private services: ServiceRepository, id: string) {
- super(id);
+export class SubprocessMiddlewareService extends ProcessesMiddlewareService {
+ constructor(services: ServiceRepository, id: string) {
+ super(services, subprocessPanelActions, id);
}
- async requestItems(api: MiddlewareAPI<Dispatch, RootState>, criteriaChanged?: boolean, background?: boolean) {
+ getFilters(api: MiddlewareAPI<Dispatch, RootState>, dataExplorer: DataExplorer): string | null {
const state = api.getState();
const parentContainerRequestUuid = state.processPanel.containerRequestUuid;
- if (parentContainerRequestUuid === "") { return; }
- const dataExplorer = getDataExplorer(state.dataExplorer, this.getId());
+ if (!parentContainerRequestUuid) { return null; }
- try {
- if (!background) { api.dispatch(progressIndicatorActions.START_WORKING(this.getId())); }
- const parentContainerRequest = await this.services.containerRequestService.get(parentContainerRequestUuid);
- if (parentContainerRequest.containerUuid) {
- const containerRequests = await this.services.containerRequestService.list(
- {
- ...getParams(dataExplorer, parentContainerRequest),
- select: containerRequestFieldsNoMounts
- });
- api.dispatch(updateResources(containerRequests.items));
- await api.dispatch<any>(loadMissingProcessesInformation(containerRequests.items));
- // Populate the actual user view
- api.dispatch(setItems(containerRequests));
- }
- if (!background) { api.dispatch(progressIndicatorActions.PERSIST_STOP_WORKING(this.getId())); }
- } catch {
- if (!background) { api.dispatch(progressIndicatorActions.PERSIST_STOP_WORKING(this.getId())); }
- api.dispatch(couldNotFetchSubprocesses());
- }
- }
-}
-
-export const getParams = (
- dataExplorer: DataExplorer,
- parentContainerRequest: ContainerRequestResource) => ({
- ...dataExplorerToListParams(dataExplorer),
- order: getOrder<ProcessResource>(dataExplorer),
- filters: getFilters(dataExplorer, parentContainerRequest)
- });
-
-export const getFilters = (
- dataExplorer: DataExplorer,
- parentContainerRequest: ContainerRequestResource) => {
- const columns = dataExplorer.columns as DataColumns<string, ProcessResource>;
- const statusColumnFilters = getDataExplorerColumnFilters(columns, 'Status');
- const activeStatusFilter = Object.keys(statusColumnFilters).find(
- filterName => statusColumnFilters[filterName].selected
- ) || ProcessStatusFilter.ALL;
-
- // Get all the subprocess' container requests and containers.
- const fb = new FilterBuilder().addEqual('requesting_container_uuid', parentContainerRequest.containerUuid);
- const statusFilters = buildProcessStatusFilters(fb, activeStatusFilter).getFilters();
+ const process = getProcess(parentContainerRequestUuid)(state.resources);
+ if (!process?.container) { return null; }
- const nameFilters = dataExplorer.searchValue
- ? new FilterBuilder()
- .addILike("name", dataExplorer.searchValue)
- .getFilters()
- : '';
+ const requesting_container = new FilterBuilder().addEqual('requesting_container_uuid', process.container.uuid).getFilters();
+ const sup = super.getFilters(api, dataExplorer);
+ if (sup === null) { return null; }
- return joinFilters(
- nameFilters,
- statusFilters
- );
-};
-
-export const setItems = (listResults: ListResults<ProcessResource>) =>
- subprocessPanelActions.SET_ITEMS({
- ...listResultsToDataExplorerItemsMeta(listResults),
- items: listResults.items.map(resource => resource.uuid),
- });
-
-const couldNotFetchSubprocesses = () =>
- snackbarActions.OPEN_SNACKBAR({
- message: 'Could not fetch subprocesses.',
- kind: SnackbarKind.ERROR
- });
+ return joinFilters(sup, requesting_container);
+ }
+}
initSidePanelTree,
loadSidePanelTreeProjects,
SidePanelTreeCategory,
- SIDE_PANEL_TREE,
+ SIDE_PANEL_TREE,
} from "store/side-panel-tree/side-panel-tree-actions";
import { updateResources } from "store/resources/resources-actions";
import { projectPanelColumns } from "views/project-panel/project-panel";
import { selectedToArray, selectedToKindSet } from "components/multiselect-toolbar/MultiselectToolbar";
import { deselectOne } from "store/multiselect/multiselect-actions";
import { treePickerActions } from "store/tree-picker/tree-picker-actions";
+import { workflowProcessesPanelColumns } from "views/workflow-panel/workflow-processes-panel-root";
+import { workflowProcessesPanelActions } from "store/workflow-panel/workflow-panel-actions";
export const WORKBENCH_LOADING_SCREEN = "workbenchLoadingScreen";
})
);
dispatch(subprocessPanelActions.SET_COLUMNS({ columns: subprocessPanelColumns }));
+ dispatch(workflowProcessesPanelActions.SET_COLUMNS({ columns: workflowProcessesPanelColumns }));
if (services.linkAccountService.getAccountToLink()) {
dispatch(linkAccountPanelActions.HAS_SESSION_DATA());
await dispatch<any>(finishLoadingProject(workflow.ownerUuid));
await dispatch<any>(activateSidePanelTreeItem(workflow.ownerUuid));
dispatch<any>(breadcrumbfunc(workflow.ownerUuid));
+ dispatch(workflowProcessesPanelActions.REQUEST_ITEMS());
}
}
});
export const loadVirtualMachinesAdmin = handleFirstTimeLoad(async (dispatch: Dispatch<any>) => {
await dispatch(loadVirtualMachinesPanel());
dispatch(setVirtualMachinesAdminBreadcrumbs());
- dispatch(treePickerActions.DEACTIVATE_TREE_PICKER_NODE({pickerId: SIDE_PANEL_TREE} ))
+ dispatch(treePickerActions.DEACTIVATE_TREE_PICKER_NODE({ pickerId: SIDE_PANEL_TREE }))
});
export const loadRepositories = handleFirstTimeLoad(async (dispatch: Dispatch<any>) => {
import { WorkflowResource } from 'models/workflow';
import { ListResults } from 'services/common-service/common-service';
import { workflowPanelActions } from 'store/workflow-panel/workflow-panel-actions';
+import { matchRegisteredWorkflowRoute } from 'routes/routes';
+import { ProcessesMiddlewareService } from "store/processes/processes-middleware-service";
+import { workflowProcessesPanelActions } from "./workflow-panel-actions";
+import { joinFilters } from "services/api/filter-builder";
export class WorkflowMiddlewareService extends DataExplorerMiddlewareService {
constructor(private services: ServiceRepository, id: string) {
message: 'Could not fetch workflows.',
kind: SnackbarKind.ERROR
});
+
+
+export class WorkflowProcessesMiddlewareService extends ProcessesMiddlewareService {
+ constructor(services: ServiceRepository, id: string) {
+ super(services, workflowProcessesPanelActions, id);
+ }
+
+ getFilters(api: MiddlewareAPI<Dispatch, RootState>, dataExplorer: DataExplorer): string | null {
+ const state = api.getState();
+
+ if (!state.router.location) { return null; }
+
+ const registeredWorkflowMatch = matchRegisteredWorkflowRoute(state.router.location.pathname);
+ if (!registeredWorkflowMatch) { return null; }
+
+ const workflow_uuid = registeredWorkflowMatch.params.id;
+
+ const requesting_container = new FilterBuilder().addEqual('properties.template_uuid', workflow_uuid).getFilters();
+ const sup = super.getFilters(api, dataExplorer);
+ if (sup === null) { return null; }
+
+ return joinFilters(sup, requesting_container);
+ }
+}
const WORKFLOW_PANEL_DETAILS_UUID = 'workflowPanelDetailsUuid';
export const workflowPanelActions = bindDataExplorerActions(WORKFLOW_PANEL_ID);
+export const WORKFLOW_PROCESSES_PANEL_ID = "workflowProcessesPanel";
+export const workflowProcessesPanelActions = bindDataExplorerActions(WORKFLOW_PROCESSES_PANEL_ID);
+
export const loadWorkflowPanel = () =>
async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
dispatch(workflowPanelActions.REQUEST_ITEMS());
});
export enum ProcessIOCardType {
- INPUT = "Inputs",
- OUTPUT = "Outputs",
+ INPUT = "Input Parameters",
+ OUTPUT = "Output Parameters",
}
export interface ProcessIOCardDataProps {
process?: Process;
import { MPVContainer, MPVPanelContent, MPVPanelState } from 'components/multi-panel-view/multi-panel-view';
import { ProcessIOCard, ProcessIOCardType } from 'views/process-panel/process-io-card';
import { NotFoundView } from 'views/not-found-panel/not-found-panel';
+import { WorkflowProcessesPanel } from './workflow-processes-panel';
type CssRules = 'root'
| 'button'
const { classes, item, inputParams, outputParams, workflowCollection } = this.props;
const panelsData: MPVPanelState[] = [
{ name: "Details" },
+ { name: "Runs" },
{ name: "Inputs" },
{ name: "Outputs" },
- { name: "Files" },
+ { name: "Definition" },
];
return item
? <MPVContainer className={classes.root} spacing={8} direction="column" justify-content="flex-start" wrap="nowrap" panelStates={panelsData}>
</CardContent>
</Card>
</MPVPanelContent>
+ <MPVPanelContent forwardProps xs>
+ <WorkflowProcessesPanel />
+ </MPVPanelContent>
<MPVPanelContent forwardProps xs data-cy="process-inputs">
<ProcessIOCard
label={ProcessIOCardType.INPUT}
</MPVPanelContent>
<MPVPanelContent xs>
<Card className={classes.filesCard}>
+ <CardHeader title="Workflow Definition" />
<ProcessOutputCollectionFiles isWritable={false} currentItemUuid={workflowCollection} />
</Card>
</MPVPanelContent>
--- /dev/null
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import React from 'react';
+import { DataExplorer } from "views-components/data-explorer/data-explorer";
+import { DataColumns } from 'components/data-table/data-table';
+import { DataTableFilterItem } from 'components/data-table-filters/data-table-filters';
+import { ContainerRequestState } from 'models/container-request';
+import { SortDirection } from 'components/data-table/data-column';
+import { ResourceKind } from 'models/resource';
+import { ResourceCreatedAtDate, ProcessStatus, ContainerRunTime } from 'views-components/data-explorer/renderers';
+import { ProcessIcon } from 'components/icon/icon';
+import { ResourceName } from 'views-components/data-explorer/renderers';
+import { WORKFLOW_PROCESSES_PANEL_ID } from 'store/workflow-panel/workflow-panel-actions';
+import { createTree } from 'models/tree';
+import { getInitialProcessStatusFilters } from 'store/resource-type-filters/resource-type-filters';
+import { ResourcesState } from 'store/resources/resources';
+import { MPVPanelProps } from 'components/multi-panel-view/multi-panel-view';
+import { StyleRulesCallback, Typography, WithStyles, withStyles } from '@material-ui/core';
+import { ArvadosTheme } from 'common/custom-theme';
+import { ProcessResource } from 'models/process';
+
+type CssRules = 'iconHeader' | 'cardHeader';
+
+const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
+ iconHeader: {
+ fontSize: '1.875rem',
+ color: theme.customs.colors.greyL,
+ marginRight: theme.spacing.unit * 2,
+ },
+ cardHeader: {
+ display: 'flex',
+ },
+});
+
+export enum WorkflowProcessesPanelColumnNames {
+ NAME = "Name",
+ STATUS = "Status",
+ CREATED_AT = "Created At",
+ RUNTIME = "Run Time"
+}
+
+export interface WorkflowProcessesPanelFilter extends DataTableFilterItem {
+ type: ResourceKind | ContainerRequestState;
+}
+
+export const workflowProcessesPanelColumns: DataColumns<string, ProcessResource> = [
+ {
+ name: WorkflowProcessesPanelColumnNames.NAME,
+ selected: true,
+ configurable: true,
+ sort: { direction: SortDirection.NONE, field: "name" },
+ filters: createTree(),
+ render: uuid => <ResourceName uuid={uuid} />
+ },
+ {
+ name: WorkflowProcessesPanelColumnNames.STATUS,
+ selected: true,
+ configurable: true,
+ mutuallyExclusiveFilters: true,
+ filters: getInitialProcessStatusFilters(),
+ render: uuid => <ProcessStatus uuid={uuid} />,
+ },
+ {
+ name: WorkflowProcessesPanelColumnNames.CREATED_AT,
+ selected: true,
+ configurable: true,
+ sort: { direction: SortDirection.DESC, field: "createdAt" },
+ filters: createTree(),
+ render: uuid => <ResourceCreatedAtDate uuid={uuid} />
+ },
+ {
+ name: WorkflowProcessesPanelColumnNames.RUNTIME,
+ selected: true,
+ configurable: true,
+ filters: createTree(),
+ render: uuid => <ContainerRunTime uuid={uuid} />
+ }
+];
+
+export interface WorkflowProcessesPanelDataProps {
+ resources: ResourcesState;
+}
+
+export interface WorkflowProcessesPanelActionProps {
+ onItemClick: (item: string) => void;
+ onContextMenu: (event: React.MouseEvent<HTMLElement>, item: string, resources: ResourcesState) => void;
+ onItemDoubleClick: (item: string) => void;
+}
+
+type WorkflowProcessesPanelProps = WorkflowProcessesPanelActionProps & WorkflowProcessesPanelDataProps;
+
+const DEFAULT_VIEW_MESSAGES = [
+ 'No processes available for listing.',
+ 'The current process may not have any or none matches current filtering.'
+];
+
+type WorkflowProcessesTitleProps = WithStyles<CssRules>;
+
+const WorkflowProcessesTitle = withStyles(styles)(
+ ({ classes }: WorkflowProcessesTitleProps) =>
+ <div className={classes.cardHeader}>
+ <ProcessIcon className={classes.iconHeader} /><span></span>
+ <Typography noWrap variant='h6' color='inherit'>
+ Run History
+ </Typography>
+ </div>
+);
+
+export const WorkflowProcessesPanelRoot = (props: WorkflowProcessesPanelProps & MPVPanelProps) => {
+ return <DataExplorer
+ id={WORKFLOW_PROCESSES_PANEL_ID}
+ onRowClick={props.onItemClick}
+ onRowDoubleClick={props.onItemDoubleClick}
+ onContextMenu={(event, item) => props.onContextMenu(event, item, props.resources)}
+ contextMenuColumn={true}
+ defaultViewIcon={ProcessIcon}
+ defaultViewMessages={DEFAULT_VIEW_MESSAGES}
+ doHidePanel={props.doHidePanel}
+ doMaximizePanel={props.doMaximizePanel}
+ doUnMaximizePanel={props.doUnMaximizePanel}
+ panelMaximized={props.panelMaximized}
+ panelName={props.panelName}
+ title={<WorkflowProcessesTitle />} />;
+};
--- /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 { openProcessContextMenu } from "store/context-menu/context-menu-actions";
+import { WorkflowProcessesPanelRoot, WorkflowProcessesPanelActionProps, WorkflowProcessesPanelDataProps } from "views/workflow-panel/workflow-processes-panel-root";
+import { RootState } from "store/store";
+import { navigateTo } from "store/navigation/navigation-action";
+import { loadDetailsPanel } from "store/details-panel/details-panel-action";
+import { getProcess } from "store/processes/process";
+
+const mapDispatchToProps = (dispatch: Dispatch): WorkflowProcessesPanelActionProps => ({
+ onContextMenu: (event, resourceUuid, resources) => {
+ const process = getProcess(resourceUuid)(resources);
+ if (process) {
+ dispatch<any>(openProcessContextMenu(event, process));
+ }
+ },
+ onItemClick: (uuid: string) => {
+ dispatch<any>(loadDetailsPanel(uuid));
+ },
+ onItemDoubleClick: uuid => {
+ dispatch<any>(navigateTo(uuid));
+ },
+});
+
+const mapStateToProps = (state: RootState): WorkflowProcessesPanelDataProps => ({
+ resources: state.resources,
+});
+
+export const WorkflowProcessesPanel = connect(mapStateToProps, mapDispatchToProps)(WorkflowProcessesPanelRoot);
projects / arvados.git / commitdiff