From 4ecae71b255eb43c0d893c9d09c6ef78fbd33ce1 Mon Sep 17 00:00:00 2001
From: Vaibhav-Vanjani <vaibhavvanjani234@gmail.com>
Date: Wed, 3 Dec 2025 16:26:14 +0530
Subject: [PATCH] copy button on blog page fix

---
 src/lib/components/blog/post-meta.svelte | 25 +++++++++++++++++-------
 1 file changed, 18 insertions(+), 7 deletions(-)

diff --git a/src/lib/components/blog/post-meta.svelte b/src/lib/components/blog/post-meta.svelte
index d9cb08190f..790135ccb5 100644
--- a/src/lib/components/blog/post-meta.svelte
+++ b/src/lib/components/blog/post-meta.svelte
@@ -3,7 +3,8 @@
     import { handleCopy } from '$lib/utils/copy';
     import { formatDate } from '$lib/utils/date';
     import type { AuthorData } from '$routes/blog/content';
-    import { page } from '$app/state';
+    import { Tooltip } from '$lib/components';
+    import { melt } from '@melt-ui/svelte';
 
     interface Props {
         date?: string;
@@ -27,6 +28,7 @@
         const blogPostUrl = encodeURI(currentURL);
         return shareOption.link.replace('{TITLE}', title + '.').replace('{URL}', blogPostUrl);
     };
+    const { copied, copy } = handleCopy(currentURL);
 </script>
 
 <header>
@@ -88,12 +90,21 @@
                                 <span class={sharingOption.icon} aria-hidden="true"></span>
                             </a>
                         {:else}
-                            <button
-                                aria-label={sharingOption.label}
-                                onclick={() => handleCopy(currentURL)}
-                            >
-                                <span class={sharingOption.icon} aria-hidden="true"></span>
-                            </button>
+                            <Tooltip>
+                                {#snippet asChild({ trigger })}
+                                    <button
+                                        onclick={copy}
+                                        use:melt={trigger}
+                                        aria-label={sharingOption.label}
+                                        class="cursor-pointer"
+                                    >
+                                        <span class={sharingOption.icon} aria-hidden="true"></span>
+                                    </button>
+                                {/snippet}
+                                {#snippet tooltip()}
+                                    {$copied ? 'Copied!' : 'Copy'}
+                                {/snippet}
+                            </Tooltip>
                         {/if}
                     </li>
                 {/each}