Skip to content

Commit b17472b

Browse files
committed
Add click feedback to copy blueprint button
Shows a checkmark icon for 2 seconds after copying to indicate success.
1 parent 5479ce8 commit b17472b

File tree

1 file changed

+15
-2
lines changed
  • packages/playground/personal-wp/src/components/menu-overlay

1 file changed

+15
-2
lines changed

packages/playground/personal-wp/src/components/menu-overlay/index.tsx

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { useState, useEffect, useCallback } from 'react';
2-
import { external, trash, copy } from '@wordpress/icons';
2+
import { external, trash, copy, check } from '@wordpress/icons';
33
import { Icon } from '@wordpress/icons';
44
import { Spinner } from '@wordpress/components';
55
import { logger } from '@php-wasm/logger';
@@ -98,6 +98,7 @@ export function MenuOverlay({ onClose }: MenuOverlayProps) {
9898
const [showDeleteButton, setShowDeleteButton] = useState(false);
9999
const [isDeleting, setIsDeleting] = useState(false);
100100
const [showRecoveryButton, setShowRecoveryButton] = useState(false);
101+
const [copiedAppPath, setCopiedAppPath] = useState<string | null>(null);
101102

102103
const handlePaste = useCallback(
103104
(e: ClipboardEvent) => {
@@ -290,10 +291,22 @@ export function MenuOverlay({ onClose }: MenuOverlayProps) {
290291
app.blueprintUrl
291292
)
292293
);
294+
setCopiedAppPath(app.path);
295+
setTimeout(
296+
() => setCopiedAppPath(null),
297+
2000
298+
);
293299
}}
294300
title="Copy blueprint"
295301
>
296-
<Icon icon={copy} size={16} />
302+
<Icon
303+
icon={
304+
copiedAppPath === app.path
305+
? check
306+
: copy
307+
}
308+
size={16}
309+
/>
297310
</button>
298311
{app.isCustom && (
299312
<button

0 commit comments

Comments
 (0)