From d04f98dbcd508e7dc2e29744620aecd2ed992e2f Mon Sep 17 00:00:00 2001
From: jbpratt <bpratt@redhat.com>
Date: Tue, 9 Dec 2025 05:59:43 -0600
Subject: [PATCH] fix(web): use template literals for Fetch Tag pull commands
 (PROJQUAY-9952) (#4699)

ClipboardCopy children were passed as JSX expressions which creates an
array of React nodes. PatternFly's ClipboardCopy may join array children
with commas when extracting text, causing pull commands like:
"docker pull ,hostname,/,org,/,repo,:,tag"

Using template literals ensures a single string child is passed,
preventing the comma issue.

Co-authored-by: Claude <noreply@anthropic.com>
---
 web/src/routes/RepositoryDetails/Tags/TablePopover.tsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/web/src/routes/RepositoryDetails/Tags/TablePopover.tsx b/web/src/routes/RepositoryDetails/Tags/TablePopover.tsx
index 7828de470..0ddaf28ee 100644
--- a/web/src/routes/RepositoryDetails/Tags/TablePopover.tsx
+++ b/web/src/routes/RepositoryDetails/Tags/TablePopover.tsx
@@ -28,7 +28,7 @@ export default function TablePopover(props: TablePopoverProps) {
             hoverTip="Copy"
             clickTip="Copied"
           >
-            podman pull {domain}/{props.org}/{props.repo}:{props.tag}
+            {`podman pull ${domain}/${props.org}/${props.repo}:${props.tag}`}
           </ClipboardCopy>
           <br />
           <Text style={{fontWeight: 'bold'}}>Podman Pull (By Digest)</Text>
@@ -38,7 +38,7 @@ export default function TablePopover(props: TablePopoverProps) {
             hoverTip="Copy"
             clickTip="Copied"
           >
-            podman pull {domain}/{props.org}/{props.repo}@{props.digest}
+            {`podman pull ${domain}/${props.org}/${props.repo}@${props.digest}`}
           </ClipboardCopy>
           <br />
           <Text style={{fontWeight: 'bold'}}>Docker Pull (By Tag)</Text>
@@ -48,7 +48,7 @@ export default function TablePopover(props: TablePopoverProps) {
             hoverTip="Copy"
             clickTip="Copied"
           >
-            docker pull {domain}/{props.org}/{props.repo}:{props.tag}
+            {`docker pull ${domain}/${props.org}/${props.repo}:${props.tag}`}
           </ClipboardCopy>
           <br />
           <Text style={{fontWeight: 'bold'}}>Docker Pull (By Digest)</Text>
@@ -58,7 +58,7 @@ export default function TablePopover(props: TablePopoverProps) {
             hoverTip="Copy"
             clickTip="Copied"
           >
-            docker pull {domain}/{props.org}/{props.repo}@{props.digest}
+            {`docker pull ${domain}/${props.org}/${props.repo}@${props.digest}`}
           </ClipboardCopy>
         </div>
       }