Post not found.
;
+ return
+ {/* Category badge */}
+
+ {category}
+
+
+ {/* Title */}
+
+ {title}
+
+
+ {/* Meta row */}
+
+ {author}
+ ·
+ {formattedDate}
+ ·
+ {readTime}
+
+
+ {/* Cover image */}
+ {coverImage && (
+ 
+ )}
+
+ {/* Tags */}
+ {tags.length > 0 && (
+
+ {tags.map((tag) => (
+
+ #{tag}
+
+ ))}
+
+ )}
+
+ {/* Article body */}
+
+
+ {/* Share Buttons — placed at the bottom as per issue spec */}
+
+
+ );
+};
+
+export default BlogPostLayout;
\ No newline at end of file
diff --git a/src/components/ShareButtons.jsx b/src/components/ShareButtons.jsx
new file mode 100644
index 0000000..6f6cb96
--- /dev/null
+++ b/src/components/ShareButtons.jsx
@@ -0,0 +1,148 @@
+import { useState } from "react";
+
+const ShareButtons = ({ title, url }) => {
+ const shareUrl = url || window.location.href;
+ const shareTitle = title || document.title;
+ const [copied, setCopied] = useState(false);
+
+ const links = {
+ twitter: `https://twitter.com/intent/tweet?text=${encodeURIComponent(
+ shareTitle
+ )}&url=${encodeURIComponent(shareUrl)}`,
+ linkedin: `https://www.linkedin.com/sharing/share-offsite/?url=${encodeURIComponent(
+ shareUrl
+ )}`,
+ whatsapp: `https://api.whatsapp.com/send?text=${encodeURIComponent(
+ shareTitle + " " + shareUrl
+ )}`,
+ };
+
+ const handleNativeShare = async () => {
+ if (navigator.share) {
+ try {
+ await navigator.share({ title: shareTitle, url: shareUrl });
+ } catch (err) {
+ // User cancelled or error — do nothing
+ }
+ }
+ };
+
+ const handleCopyLink = async () => {
+ try {
+ await navigator.clipboard.writeText(shareUrl);
+ setCopied(true);
+ setTimeout(() => setCopied(false), 2000);
+ } catch {
+ // Fallback for older browsers
+ const el = document.createElement("input");
+ el.value = shareUrl;
+ document.body.appendChild(el);
+ el.select();
+ document.execCommand("copy");
+ document.body.removeChild(el);
+ setCopied(true);
+ setTimeout(() => setCopied(false), 2000);
+ }
+ };
+
+ return (
+