diff --git a/attached_assets/image_1772298579641.png b/attached_assets/image_1772298579641.png new file mode 100644 index 0000000..d71d9cb Binary files /dev/null and b/attached_assets/image_1772298579641.png differ diff --git a/client/src/pages/article.tsx b/client/src/pages/article.tsx index 16b1f83..4a028e0 100644 --- a/client/src/pages/article.tsx +++ b/client/src/pages/article.tsx @@ -9,6 +9,7 @@ import { Skeleton } from "@/components/ui/skeleton"; import Header from "@/components/header"; import Footer from "@/components/footer"; import DOMPurify from "dompurify"; +import { useEffect } from "react"; const ALLOWED_IFRAME_DOMAINS = [ "iframe.mediadelivery.net", @@ -23,8 +24,8 @@ const ALLOWED_IFRAME_DOMAINS = [ function sanitizeContent(html: string): string { return DOMPurify.sanitize(html, { - ADD_TAGS: ["iframe"], - ADD_ATTR: ["allow", "allowfullscreen", "frameborder", "scrolling", "src", "loading", "style"], + ADD_TAGS: ["iframe", "blockquote"], + ADD_ATTR: ["allow", "allowfullscreen", "frameborder", "scrolling", "src", "loading", "style", "class", "data-instgrm-permalink", "data-instgrm-version", "data-instgrm-captioned", "cite"], ALLOW_UNKNOWN_PROTOCOLS: false, }); } @@ -96,6 +97,31 @@ export default function ArticlePage() { queryKey: ["/api/articles", slug], }); + useEffect(() => { + if (!article?.content) return; + if (article.content.includes("instagram.com")) { + const existing = document.querySelector('script[src*="instagram.com/embed.js"]'); + if (existing) existing.remove(); + const script = document.createElement("script"); + script.src = "https://www.instagram.com/embed.js"; + script.async = true; + document.body.appendChild(script); + script.onload = () => { + if ((window as any).instgrm) { + (window as any).instgrm.Embeds.process(); + } + }; + } + if (article.content.includes("tiktok.com")) { + if (!document.querySelector('script[src*="tiktok.com/embed.js"]')) { + const script = document.createElement("script"); + script.src = "https://www.tiktok.com/embed.js"; + script.async = true; + document.body.appendChild(script); + } + } + }, [article?.content]); + if (isLoading) { return (