1 // Copyright (C) The Arvados Authors. All rights reserved.
3 // SPDX-License-Identifier: AGPL-3.0
5 import React from "react";
6 import { StyleRulesCallback, WithStyles, withStyles } from "@material-ui/core";
7 import { ProcessIcon } from "components/icon/icon";
8 import { Process } from "store/processes/process";
9 import { SubprocessPanel } from "views/subprocess-panel/subprocess-panel";
10 import { SubprocessFilterDataProps } from "components/subprocess-filter/subprocess-filter";
11 import { MPVContainer, MPVPanelContent, MPVPanelState } from "components/multi-panel-view/multi-panel-view";
12 import { ArvadosTheme } from "common/custom-theme";
13 import { ProcessDetailsCard } from "./process-details-card";
14 import { ProcessIOCard, ProcessIOCardType, ProcessIOParameter } from "./process-io-card";
15 import { ProcessResourceCard } from "./process-resource-card";
16 import { getProcessPanelLogs, ProcessLogsPanel } from "store/process-logs-panel/process-logs-panel";
17 import { ProcessLogsCard } from "./process-log-card";
18 import { FilterOption } from "views/process-panel/process-log-form";
19 import { getInputCollectionMounts } from "store/processes/processes-actions";
20 import { WorkflowInputsData } from "models/workflow";
21 import { CommandOutputParameter } from "cwlts/mappings/v1.0/CommandOutputParameter";
22 import { AuthState } from "store/auth/auth-reducer";
23 import { ProcessCmdCard } from "./process-cmd-card";
24 import { ContainerRequestResource } from "models/container-request";
25 import { OutputDetails, NodeInstanceType } from "store/process-panel/process-panel";
26 import { NotFoundView } from 'views/not-found-panel/not-found-panel';
27 import { CollectionFile } from 'models/collection-file';
29 type CssRules = "root";
31 const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
37 export interface ProcessPanelRootDataProps {
39 subprocesses: Array<Process>;
40 filters: Array<SubprocessFilterDataProps>;
41 processLogsPanel: ProcessLogsPanel;
43 inputRaw: WorkflowInputsData | null;
44 inputParams: ProcessIOParameter[] | null;
45 outputData: OutputDetails | null;
46 outputDefinitions: CommandOutputParameter[];
47 outputParams: ProcessIOParameter[] | null;
48 nodeInfo: NodeInstanceType | null;
49 usageReport: string | null;
52 export interface ProcessPanelRootActionProps {
53 onContextMenu: (event: React.MouseEvent<HTMLElement>, process: Process) => void;
54 onToggle: (status: string) => void;
55 cancelProcess: (uuid: string) => void;
56 startProcess: (uuid: string) => void;
57 resumeOnHoldWorkflow: (uuid: string) => void;
58 onLogFilterChange: (filter: FilterOption) => void;
59 navigateToLog: (uuid: string) => void;
60 onCopyToClipboard: (uuid: string) => void;
61 loadInputs: (containerRequest: ContainerRequestResource) => void;
62 loadOutputs: (containerRequest: ContainerRequestResource) => void;
63 loadNodeJson: (containerRequest: ContainerRequestResource) => void;
64 loadOutputDefinitions: (containerRequest: ContainerRequestResource) => void;
65 updateOutputParams: () => void;
66 pollProcessLogs: (processUuid: string) => Promise<void>;
69 export type ProcessPanelRootProps = ProcessPanelRootDataProps & ProcessPanelRootActionProps & WithStyles<CssRules>;
71 const panelsData: MPVPanelState[] = [
73 { name: "Logs", visible: true },
74 { name: "Subprocesses" },
78 { name: "Resources" },
81 export const ProcessPanelRoot = withStyles(styles)(
96 loadOutputDefinitions,
99 }: ProcessPanelRootProps) => {
100 const outputUuid = process?.containerRequest.outputUuid;
101 const containerRequest = process?.containerRequest;
102 const inputMounts = getInputCollectionMounts(process?.containerRequest);
104 React.useEffect(() => {
105 if (containerRequest) {
106 // Load inputs from mounts or props
107 loadInputs(containerRequest);
108 // Fetch raw output (loads from props or keep)
109 loadOutputs(containerRequest);
110 // Loads output definitions from mounts into store
111 loadOutputDefinitions(containerRequest);
112 // load the assigned instance type from node.json in
113 // the log collection
114 loadNodeJson(containerRequest);
116 }, [containerRequest, loadInputs, loadOutputs, loadOutputDefinitions, loadNodeJson]);
118 const maxHeight = "100%";
120 // Trigger processing output params when raw or definitions change
121 React.useEffect(() => {
122 updateOutputParams();
123 }, [outputData, outputDefinitions, updateOutputParams]);
127 className={props.classes.root}
129 panelStates={panelsData}
130 justify-content="flex-start"
136 data-cy="process-details">
139 onContextMenu={event => props.onContextMenu(event, process)}
140 cancelProcess={props.cancelProcess}
141 startProcess={props.startProcess}
142 resumeOnHoldWorkflow={props.resumeOnHoldWorkflow}
148 minHeight={maxHeight}
149 maxHeight={maxHeight}
150 data-cy="process-logs">
152 onCopy={props.onCopyToClipboard}
154 lines={getProcessPanelLogs(processLogsPanel)}
156 label: processLogsPanel.selectedFilter,
157 value: processLogsPanel.selectedFilter,
159 filters={processLogsPanel.filters.map(filter => ({ label: filter, value: filter }))}
160 onLogFilterChange={props.onLogFilterChange}
161 navigateToLog={props.navigateToLog}
162 pollProcessLogs={props.pollProcessLogs}
168 maxHeight={maxHeight}
169 data-cy="process-children">
170 <SubprocessPanel process={process} />
175 maxHeight={maxHeight}
176 data-cy="process-outputs">
178 label={ProcessIOCardType.OUTPUT}
180 params={outputParams}
181 raw={outputData?.raw}
182 outputUuid={outputUuid || ""}
188 maxHeight={maxHeight}
189 data-cy="process-inputs">
191 label={ProcessIOCardType.INPUT}
202 data-cy="process-cmd">
204 onCopy={props.onCopyToClipboard}
211 data-cy="process-resources">
215 usageReport={usageReport}
222 messages={["Process not found"]}