"@types/react-copy-to-clipboard": "4.2.6",
"@types/react-dropzone": "4.2.2",
"@types/redux-form": "7.4.5",
+ "@types/shell-quote": "1.6.0",
"axios": "0.18.0",
"classnames": "2.2.6",
"lodash": "4.17.10",
"react-transition-group": "2.4.0",
"redux": "4.0.0",
"redux-thunk": "2.3.0",
+ "shell-quote": "1.6.1",
"unionize": "2.1.2",
"uuid": "3.3.2"
},
import { RootState } from '../store';
import { Dispatch } from 'redux';
import { getProcess } from '~/store/processes/process';
+import { quote } from 'shell-quote';
export const PROCESS_COMMAND_DIALOG_NAME = 'processCommandDialog';
const process = getProcess(processUuid)(getState().resources);
if (process) {
const data: ProcessCommandDialogData = {
- command: process.containerRequest.command.join(' '),
+ command: quote(process.containerRequest.command),
processName: process.containerRequest.name,
};
dispatch(dialogActions.OPEN_DIALOG({ id: PROCESS_COMMAND_DIALOG_NAME, data }));
// SPDX-License-Identifier: AGPL-3.0
import * as React from "react";
-import { Dialog, DialogTitle, DialogActions, Button, StyleRulesCallback, WithStyles, withStyles } from '@material-ui/core';
+import { Dialog, DialogTitle, DialogActions, Button, StyleRulesCallback, WithStyles, withStyles, Tooltip, IconButton, Grid, CardHeader } from '@material-ui/core';
import { withDialog } from "~/store/dialog/with-dialog";
import { PROCESS_COMMAND_DIALOG_NAME } from '~/store/processes/process-command-actions';
import { WithDialogProps } from '~/store/dialog/with-dialog';
import { ProcessCommandDialogData } from '~/store/processes/process-command-actions';
import { DefaultCodeSnippet } from "~/components/default-code-snippet/default-code-snippet";
import { compose } from 'redux';
+import * as CopyToClipboard from "react-copy-to-clipboard";
+import { CopyIcon } from '~/components/icon/icon';
-type CssRules = 'codeSnippet';
+type CssRules = 'codeSnippet' | 'copyToClipboard';
const styles: StyleRulesCallback<CssRules> = theme => ({
codeSnippet: {
marginLeft: theme.spacing.unit * 3,
marginRight: theme.spacing.unit * 3,
+ },
+ copyToClipboard: {
+ marginRight: theme.spacing.unit,
}
});
maxWidth="md"
onClose={props.closeDialog}
style={{ alignSelf: 'stretch' }}>
- <DialogTitle>{`Command - ${props.data.processName}`}</DialogTitle>
+ <CardHeader
+ title={`Command - ${props.data.processName}`}
+ action={
+ <Tooltip title="Copy to clipboard">
+ <CopyToClipboard text={props.data.command}>
+ <IconButton className={props.classes.copyToClipboard}>
+ <CopyIcon />
+ </IconButton>
+ </CopyToClipboard>
+ </Tooltip>
+ } />
<DefaultCodeSnippet
className={props.classes.codeSnippet}
lines={[props.data.command]} />