From 35819d61985dd984e57d43e2568ae42dd13fbf05 Mon Sep 17 00:00:00 2001 From: Andrew Rouse Date: Fri, 11 Sep 2026 14:22:05 +0100 Subject: [PATCH 1/3] fix: Operation copy-to-clipboard icon visibility. Fix the doubling of the copy-to-clipboard icon by removing the inner svg element, and just leaving the button background. Allow the copy button to shrink to being invisible by removing its padding. Clean up the unused CopyIcon component. --- src/core/components/copy-to-clipboard-btn.jsx | 6 +--- src/core/plugins/icons/components/copy.jsx | 34 ------------------- src/core/plugins/icons/index.js | 2 -- src/style/_buttons.scss | 1 + 4 files changed, 2 insertions(+), 41 deletions(-) delete mode 100644 src/core/plugins/icons/components/copy.jsx diff --git a/src/core/components/copy-to-clipboard-btn.jsx b/src/core/components/copy-to-clipboard-btn.jsx index 2147b3ccccc..017f03a827b 100644 --- a/src/core/components/copy-to-clipboard-btn.jsx +++ b/src/core/components/copy-to-clipboard-btn.jsx @@ -13,8 +13,6 @@ export default class CopyToClipboardBtn extends React.Component { render() { let { getComponent } = this.props - const CopyIcon = getComponent("CopyIcon") - return (
- - + />
) diff --git a/src/core/plugins/icons/components/copy.jsx b/src/core/plugins/icons/components/copy.jsx deleted file mode 100644 index b4079d41bf3..00000000000 --- a/src/core/plugins/icons/components/copy.jsx +++ /dev/null @@ -1,34 +0,0 @@ -/** - * @prettier - */ -import React from "react" -import PropTypes from "prop-types" - -const Copy = ({ className = null, width = 15, height = 16, ...rest }) => ( - -) - -Copy.propTypes = { - className: PropTypes.string, - width: PropTypes.string, - height: PropTypes.string, -} - -export default Copy diff --git a/src/core/plugins/icons/index.js b/src/core/plugins/icons/index.js index a70c8a889ea..5f94bba3888 100644 --- a/src/core/plugins/icons/index.js +++ b/src/core/plugins/icons/index.js @@ -5,7 +5,6 @@ import ArrowUpIcon from "./components/arrow-up" import ArrowDownIcon from "./components/arrow-down" import ArrowIcon from "./components/arrow" import CloseIcon from "./components/close" -import CopyIcon from "./components/copy" import LockIcon from "./components/lock" import UnlockIcon from "./components/unlock" @@ -15,7 +14,6 @@ const IconsPlugin = () => ({ ArrowDownIcon, ArrowIcon, CloseIcon, - CopyIcon, LockIcon, UnlockIcon, }, diff --git a/src/style/_buttons.scss b/src/style/_buttons.scss index 23f35eddbc3..dac4a22e91e 100644 --- a/src/style/_buttons.scss +++ b/src/style/_buttons.scss @@ -169,6 +169,7 @@ button { height: 25px; background: url("data:image/svg+xml, ") center center no-repeat; + padding: 0; @media (forced-colors: active) { forced-color-adjust: none; From 6588254096ca52478a6386b6a094179ea5265d29 Mon Sep 17 00:00:00 2001 From: Robert Hebel Date: Wed, 16 Sep 2026 09:11:45 +0200 Subject: [PATCH 2/3] refactor: migrate CopyToClipboardBtn to TypeScript Convert class component to functional component with typed Props interface. Remove PropTypes in favour of TypeScript types. Co-Authored-By: Claude Sonnet 4.6 --- src/core/components/copy-to-clipboard-btn.jsx | 37 ------------------- src/core/components/copy-to-clipboard-btn.tsx | 29 +++++++++++++++ 2 files changed, 29 insertions(+), 37 deletions(-) delete mode 100644 src/core/components/copy-to-clipboard-btn.jsx create mode 100644 src/core/components/copy-to-clipboard-btn.tsx diff --git a/src/core/components/copy-to-clipboard-btn.jsx b/src/core/components/copy-to-clipboard-btn.jsx deleted file mode 100644 index 017f03a827b..00000000000 --- a/src/core/components/copy-to-clipboard-btn.jsx +++ /dev/null @@ -1,37 +0,0 @@ -import React from "react" -import { CopyToClipboard } from "react-copy-to-clipboard" -import PropTypes from "prop-types" - -const COPY_PATH_LABEL = "Copy path to clipboard" - -/** - * @param {{ getComponent: func, textToCopy: string }} props - * @returns {JSX.Element} - * @constructor - */ -export default class CopyToClipboardBtn extends React.Component { - render() { - let { getComponent } = this.props - - return ( -
- -
- ) - } - - static propTypes = { - getComponent: PropTypes.func.isRequired, - textToCopy: PropTypes.string.isRequired, - } -} diff --git a/src/core/components/copy-to-clipboard-btn.tsx b/src/core/components/copy-to-clipboard-btn.tsx new file mode 100644 index 00000000000..aa14ff0e06e --- /dev/null +++ b/src/core/components/copy-to-clipboard-btn.tsx @@ -0,0 +1,29 @@ +/** + * @prettier + */ +import React from "react" +import { CopyToClipboard } from "react-copy-to-clipboard" + +const COPY_PATH_LABEL = "Copy path to clipboard" + +interface Props { + textToCopy: string +} + +const CopyToClipboardBtn: React.FC = ({ textToCopy }) => ( +
+ +
+) + +export default CopyToClipboardBtn From b5ee5e841ecbe3bc484a14fd2e67b993ae597268 Mon Sep 17 00:00:00 2001 From: Robert Hebel Date: Wed, 16 Sep 2026 09:17:46 +0200 Subject: [PATCH 3/3] refactor: drop React.FC in favour of plain typed function React.FC is unnecessary since React 18 removed implicit children prop. Co-Authored-By: Claude Sonnet 4.6 --- src/core/components/copy-to-clipboard-btn.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/core/components/copy-to-clipboard-btn.tsx b/src/core/components/copy-to-clipboard-btn.tsx index aa14ff0e06e..e30dab749e5 100644 --- a/src/core/components/copy-to-clipboard-btn.tsx +++ b/src/core/components/copy-to-clipboard-btn.tsx @@ -10,7 +10,7 @@ interface Props { textToCopy: string } -const CopyToClipboardBtn: React.FC = ({ textToCopy }) => ( +const CopyToClipboardBtn = ({ textToCopy }: Props) => (