X-Git-Url: https://git.arvados.org/arvados-workbench2.git/blobdiff_plain/ee347878e1ad3b6f82787ac27b6d3b6510401ecd..4f88234088269faa064da9459376c3af2a740a7d:/src/views/process-panel/process-io-card.tsx

diff --git a/src/views/process-panel/process-io-card.tsx b/src/views/process-panel/process-io-card.tsx
index 4b2413ce..2857aa13 100644
--- a/src/views/process-panel/process-io-card.tsx
+++ b/src/views/process-panel/process-io-card.tsx
@@ -25,7 +25,7 @@ import {
     Chip,
 } from '@material-ui/core';
 import { ArvadosTheme } from 'common/custom-theme';
-import { CloseIcon, InfoIcon, ProcessIcon } from 'components/icon/icon';
+import { CloseIcon, InfoIcon, ProcessIcon, InputIcon, OutputIcon } from 'components/icon/icon';
 import { MPVPanelProps } from 'components/multi-panel-view/multi-panel-view';
 import {
   BooleanCommandInputParameter,
@@ -144,6 +144,7 @@ export const ProcessIOCard = withStyles(styles)(
         const handleChange = (event: React.MouseEvent<HTMLElement>, value: number) => {
             setTabState(value);
         }
+        const PanelIcon = label == ProcessIOCardType.INPUT ? InputIcon : OutputIcon;
 
         return <Card className={classes.card} data-cy="process-io-card">
             <CardHeader
@@ -152,7 +153,7 @@ export const ProcessIOCard = withStyles(styles)(
                     content: classes.title,
                     avatar: classes.avatar,
                 }}
-                avatar={<ProcessIcon className={classes.iconHeader} />}
+                avatar={<PanelIcon className={classes.iconHeader} />}
                 title={
                     <Typography noWrap variant='h6' color='inherit'>
                         {label}
@@ -169,10 +170,10 @@ export const ProcessIOCard = withStyles(styles)(
             <CardContent className={classes.content}>
                 <div>
                     <Tabs value={tabState} onChange={handleChange} variant="fullWidth">
-                        <Tab label="Preview" />
-                        <Tab label="Raw" />
-                        {label === ProcessIOCardType.INPUT && <Tab label="Input Mounts" />}
-                        {label === ProcessIOCardType.OUTPUT && <Tab label="Output Collection" />}
+                        <Tab label="Parameters" />
+                        <Tab label="JSON" />
+                        {label === ProcessIOCardType.INPUT && <Tab label="Collections" />}
+                        {label === ProcessIOCardType.OUTPUT && <Tab label="Collection" />}
                     </Tabs>
                     {tabState === 0 && <div className={classes.tableWrapper}>
                         {params.length ?