added copy button to copy response (#5409)

Co-authored-by: Shashank Shekhar <48152748+sha5-git@users.noreply.github.com>
This commit is contained in:
Shashank Shekhar
2025-12-02 14:53:51 +05:30
committed by GitHub
parent bc4062b950
commit 8cee7bad39
3 changed files with 45 additions and 0 deletions

View File

@@ -0,0 +1,8 @@
import styled from 'styled-components';
const StyledWrapper = styled.div`
font-size: 0.8125rem;
color: ${(props) => props.theme.requestTabPanel.responseStatus};
`;
export default StyledWrapper;

View File

@@ -0,0 +1,33 @@
import React from 'react';
import StyledWrapper from './StyledWrapper';
import toast from 'react-hot-toast';
import { IconCopy } from '@tabler/icons';
const ResponseCopy = ({ item }) => {
const response = item.response || {};
const copyResponse = () => {
try {
const textToCopy = typeof response.data === 'string'
? response.data
: JSON.stringify(response.data, null, 2);
navigator.clipboard.writeText(textToCopy).then(() => {
toast.success('Response copied to clipboard');
}).catch(() => {
toast.error('Failed to copy response');
});
} catch (error) {
toast.error('Failed to copy response');
}
};
return (
<StyledWrapper className="ml-2 flex items-center">
<button onClick={copyResponse} disabled={!response.data} title="Copy response to clipboard">
<IconCopy size={16} strokeWidth={1.5} />
</button>
</StyledWrapper>
);
};
export default ResponseCopy;

View File

@@ -18,6 +18,7 @@ import ScriptErrorIcon from './ScriptErrorIcon';
import StyledWrapper from './StyledWrapper';
import ResponseSave from 'src/components/ResponsePane/ResponseSave';
import ResponseClear from 'src/components/ResponsePane/ResponseClear';
import ResponseCopy from 'src/components/ResponsePane/ResponseCopy';
import ResponseBookmark from 'src/components/ResponsePane/ResponseBookmark';
import SkippedRequest from './SkippedRequest';
import ClearTimeline from './ClearTimeline/index';
@@ -189,6 +190,9 @@ const ResponsePane = ({ item, collection }) => {
<>
<ResponseClear item={item} collection={collection} />
<ResponseSave item={item} />
<ResponseCopy item={item} />
<StatusCode status={response.status} />
<ResponseTime duration={response.duration} />
<ResponseBookmark item={item} collection={collection} responseSize={responseSize} />
<StatusCode status={response.status} isStreaming={item.response?.stream?.running} />
{item.response?.stream?.running