Remove clipboard copy button component

This commit is contained in:
mabashian 2021-06-02 09:32:59 -04:00
parent 66f140bb70
commit 7467779ea9
3 changed files with 0 additions and 152 deletions

View File

@ -1,90 +0,0 @@
import React from 'react';
import PropTypes from 'prop-types';
import { Button, Tooltip } from '@patternfly/react-core';
import { CopyIcon } from '@patternfly/react-icons';
export const clipboardCopyFunc = (event, text) => {
const clipboard = event.currentTarget.parentElement;
const el = document.createElement('input');
el.value = text;
clipboard.appendChild(el);
el.select();
document.execCommand('copy');
clipboard.removeChild(el);
};
class ClipboardCopyButton extends React.Component {
constructor(props) {
super(props);
this.state = {
copied: false,
};
this.handleCopyClick = this.handleCopyClick.bind(this);
}
handleCopyClick = event => {
const { stringToCopy, switchDelay } = this.props;
if (this.timer) {
window.clearTimeout(this.timer);
this.setState({ copied: false });
}
clipboardCopyFunc(event, stringToCopy);
this.setState({ copied: true }, () => {
this.timer = window.setTimeout(() => {
this.setState({ copied: false });
this.timer = null;
}, switchDelay);
});
};
render() {
const {
copyTip,
entryDelay,
exitDelay,
copiedSuccessTip,
isDisabled,
ouiaId,
} = this.props;
const { copied } = this.state;
return (
<Tooltip
entryDelay={entryDelay}
exitDelay={exitDelay}
trigger="mouseenter focus click"
content={copied ? copiedSuccessTip : copyTip}
>
<Button
ouiaId={ouiaId}
isDisabled={isDisabled}
variant="plain"
onClick={this.handleCopyClick}
aria-label={copyTip}
>
<CopyIcon />
</Button>
</Tooltip>
);
}
}
ClipboardCopyButton.propTypes = {
copyTip: PropTypes.string.isRequired,
entryDelay: PropTypes.number,
exitDelay: PropTypes.number,
copiedSuccessTip: PropTypes.string.isRequired,
stringToCopy: PropTypes.string.isRequired,
switchDelay: PropTypes.number,
isDisabled: PropTypes.bool.isRequired,
};
ClipboardCopyButton.defaultProps = {
entryDelay: 100,
exitDelay: 1600,
switchDelay: 2000,
};
export default ClipboardCopyButton;

View File

@ -1,61 +0,0 @@
import React from 'react';
import { mountWithContexts } from '../../../testUtils/enzymeHelpers';
import ClipboardCopyButton from './ClipboardCopyButton';
describe('ClipboardCopyButton', () => {
beforeEach(() => {
document.execCommand = jest.fn();
});
afterEach(() => {
jest.clearAllMocks();
});
test('renders the expected content', () => {
const wrapper = mountWithContexts(
<ClipboardCopyButton
clickTip="foo"
hoverTip="bar"
copyTip="baz"
copiedSuccessTip="qux"
stringToCopy="foobar!"
isDisabled={false}
/>
);
expect(wrapper).toHaveLength(1);
});
test('clicking button calls execCommand to copy to clipboard', async () => {
const mockDelay = 1;
const wrapper = mountWithContexts(
<ClipboardCopyButton
clickTip="foo"
hoverTip="bar"
copyTip="baz"
copiedSuccessTip="qux"
stringToCopy="foobar!"
isDisabled={false}
switchDelay={mockDelay}
/>
).find('ClipboardCopyButton');
expect(wrapper.state('copied')).toBe(false);
wrapper.find('Button').simulate('click');
expect(document.execCommand).toBeCalledWith('copy');
expect(wrapper.state('copied')).toBe(true);
await new Promise(resolve => setTimeout(resolve, mockDelay));
wrapper.update();
expect(wrapper.state('copied')).toBe(false);
});
test('should render disabled button', () => {
const wrapper = mountWithContexts(
<ClipboardCopyButton
clickTip="foo"
hoverTip="bar"
copyTip="baz"
copiedSuccessTip="qux"
stringToCopy="foobar!"
isDisabled
/>
);
expect(wrapper.find('Button').prop('isDisabled')).toBe(true);
});
});

View File

@ -1 +0,0 @@
export { default } from './ClipboardCopyButton';