Skip to content

Commit

Permalink
Merge pull request stakwork#791 from aliraza556/feature-add-copy-butt…
Browse files Browse the repository at this point in the history
…on-to-ticket-editor

✨Add Copy to Clipboard Button in Ticket Editor
  • Loading branch information
humansinstitute authored Dec 19, 2024
2 parents fe52184 + f9b588c commit 8aacc81
Show file tree
Hide file tree
Showing 2 changed files with 69 additions and 1 deletion.
44 changes: 43 additions & 1 deletion src/components/common/TicketEditor/TicketEditor.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,11 @@ import {
EuiBadge
} from '@elastic/eui';
import { phaseTicketStore } from '../../../store/phase';
import { ActionButton, TicketButtonGroup } from '../../../people/widgetViews/workspace/style';
import {
ActionButton,
CopyButtonGroup,
TicketButtonGroup
} from '../../../people/widgetViews/workspace/style';
import {
TicketContainer,
TicketHeader,
Expand Down Expand Up @@ -49,6 +53,7 @@ const TicketEditor = observer(
);
const [selectedVersion, setSelectedVersion] = useState<number>(latestTicket?.version as number);
const [versionTicketData, setVersionTicketData] = useState<Ticket>(latestTicket as Ticket);
const [isCopying, setIsCopying] = useState(false);
const { main } = useStores();

const groupTickets = useMemo(
Expand Down Expand Up @@ -207,6 +212,33 @@ const TicketEditor = observer(
}
}
};
const handleCopy = async () => {
if (isCopying) return;

setIsCopying(true);
try {
await navigator.clipboard.writeText(versionTicketData.description);
setToasts([
{
id: `${Date.now()}-copy-success`,
title: 'Hive',
color: 'success',
text: 'Description copied to clipboard!'
}
]);
} catch (err) {
setToasts([
{
id: `${Date.now()}-copy-error`,
title: 'Hive',
color: 'danger',
text: 'Failed to copy description'
}
]);
} finally {
setIsCopying(false);
}
};

return (
<TicketContainer>
Expand Down Expand Up @@ -238,6 +270,16 @@ const TicketEditor = observer(
<EuiBadge color="success" style={{ marginBottom: '12px' }}>
Version {selectedVersion}
</EuiBadge>
<CopyButtonGroup>
<ActionButton
color="primary"
onClick={handleCopy}
disabled={isCopying}
data-testid="copy-description-btn"
>
Copy
</ActionButton>
</CopyButtonGroup>
</TicketHeaderInputWrap>
<TicketTextArea
value={versionTicketData.description}
Expand Down
26 changes: 26 additions & 0 deletions src/people/widgetViews/workspace/style.ts
Original file line number Diff line number Diff line change
Expand Up @@ -1635,3 +1635,29 @@ export const Select = styled.select`
export const Option = styled.option`
font-size: 14px;
`;

export const CopyButtonGroup = styled.div`
display: flex;
align-items: center;
justify-content: flex-end;
margin-left: auto;
margin-top: calc(100px - 134px);
${ActionButton} {
transition: background-color 0.2s ease;
width: auto;
min-width: 100px;
&[color='primary'] {
background-color: #618aff;
&:hover {
background-color: #7599ff;
}
&:active {
background-color: #4b7bff;
}
}
}
`;

0 comments on commit 8aacc81

Please sign in to comment.