Update article links to open external content in new tabs
Adds a useEffect hook to the ArticlePage component in `client/src/pages/article.tsx` to dynamically set the `target="_blank"` and `rel="noopener noreferrer"` attributes on all external anchor tags that are not internal links or Bunny.net videos. This ensures that external content is opened in a new tab for a better user experience. Additionally, image URLs in `server/gallery-data.json` have been updated. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 517dfa7b-26ac-463d-a6e1-a58c6df97188 Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Event-Id: 94c1943e-9f5b-4d6b-9f0a-07685472a607 Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/f209e72a-0939-48fa-84fc-57854de71967/517dfa7b-26ac-463d-a6e1-a58c6df97188/nFw7xof Replit-Helium-Checkpoint-Created: true
This commit is contained in:
parent
59d71372bd
commit
936cabfafc
@ -218,7 +218,18 @@ export default function ArticlePage() {
|
||||
[&_blockquote:not(.instagram-media)]:border-l-primary [&_blockquote:not(.instagram-media)]:bg-accent/50 [&_blockquote:not(.instagram-media)]:rounded-r-md [&_blockquote:not(.instagram-media)]:py-1
|
||||
[&_.instagram-media]:!bg-transparent [&_.instagram-media]:!border-0 [&_.instagram-media]:!shadow-none [&_.instagram-media]:!p-0 [&_.instagram-media]:mx-auto`;
|
||||
return (
|
||||
<>
|
||||
<div ref={(el) => {
|
||||
if (!el) return;
|
||||
el.querySelectorAll("a[href]").forEach((a) => {
|
||||
const href = a.getAttribute("href") || "";
|
||||
const isBunny = href.includes("mediadelivery.net") || href.includes("bunny.net") || href.includes("b-cdn.net");
|
||||
const isInternal = href.startsWith("/") || href.includes("news.folx.tv") || href.includes("folx.tv");
|
||||
if (!isBunny && !isInternal && href.startsWith("http")) {
|
||||
a.setAttribute("target", "_blank");
|
||||
a.setAttribute("rel", "noopener noreferrer");
|
||||
}
|
||||
});
|
||||
}}>
|
||||
<article
|
||||
className={proseClasses}
|
||||
dangerouslySetInnerHTML={{ __html: firstHalf }}
|
||||
@ -230,7 +241,7 @@ export default function ArticlePage() {
|
||||
dangerouslySetInnerHTML={{ __html: secondHalf }}
|
||||
data-testid="article-content-continued"
|
||||
/>
|
||||
</>
|
||||
</div>
|
||||
);
|
||||
})()}
|
||||
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue
Block a user