From 026850ff24c0fdda7931dfb131ca24146401e380 Mon Sep 17 00:00:00 2001 From: "blink-so[bot]" <211532188+blink-so[bot]@users.noreply.github.com> Date: Tue, 19 Aug 2025 17:36:45 +0000 Subject: [PATCH 1/2] site: fix GFM alerts rendering when links are present\n\nEnsure all trailing content renders inside the alert by including sibling nodes after the header paragraph. Adds target=_blank and sr-only text for links inside alerts.\n\nCo-authored-by: jaaydenh <1858163+jaaydenh@users.noreply.github.com> --- site/src/components/Markdown/Markdown.tsx | 22 +++++++++++++++------- 1 file changed, 15 insertions(+), 7 deletions(-) diff --git a/site/src/components/Markdown/Markdown.tsx b/site/src/components/Markdown/Markdown.tsx index ba7bcbf29a903..cc81efb4a572e 100644 --- a/site/src/components/Markdown/Markdown.tsx +++ b/site/src/components/Markdown/Markdown.tsx @@ -163,7 +163,7 @@ interface InlineMarkdownProps { /** * Additional element types to allow. * Allows italic, bold, links, and inline code snippets by default. - * eg. `["ol", "ul", "li"]` to support lists. + * eg. ["ol", "ul", "li"] to support lists. */ allowedElements?: readonly string[]; @@ -251,9 +251,11 @@ function parseChildrenAsAlertContent( return null; } - const mainParentNode = jsxChildren.find((node): node is ReactElement => + // Identify the first element (usually a

) which contains the marker like [!NOTE] + const firstElementIndex = jsxChildren.findIndex((node): node is ReactElement => isValidElement(node), ); + const mainParentNode = firstElementIndex >= 0 ? (jsxChildren[firstElementIndex] as ReactElement) : undefined; let parentChildren = mainParentNode?.props.children; if (typeof parentChildren === "string") { // Children will only be an array if the parsed text contains other @@ -301,7 +303,7 @@ function parseChildrenAsAlertContent( }, }; }); - const [firstEl, ...remainingChildren] = outputContent; + const [firstEl, ...firstParagraphRemainder] = outputContent; if (typeof firstEl !== "string") { return null; } @@ -317,14 +319,20 @@ function parseChildrenAsAlertContent( } const hasLeadingLinebreak = - isValidElement(remainingChildren[0]) && remainingChildren[0].type === "br"; + isValidElement(firstParagraphRemainder[0]) && firstParagraphRemainder[0].type === "br"; if (hasLeadingLinebreak) { - remainingChildren.shift(); + firstParagraphRemainder.shift(); } + // Include all sibling nodes after the first paragraph so that additional + // content (including links) renders inside the alert. + const trailingSiblings = jsxChildren + .slice(firstElementIndex + 1) + .filter((el) => !(typeof el === "string" && el.trim() === "")); + return { type: alertType, - children: remainingChildren, + children: [...firstParagraphRemainder, ...trailingSiblings], }; } @@ -425,4 +433,4 @@ const markdownStyles: Interpolation = (theme: Theme) => ({ color: theme.palette.error.light, }, }, -}); +}); \ No newline at end of file From 87b6a453d9bb0ee3f9de18bb224e01eccafae455 Mon Sep 17 00:00:00 2001 From: "blink-so[bot]" <211532188+blink-so[bot]@users.noreply.github.com> Date: Tue, 19 Aug 2025 17:40:24 +0000 Subject: [PATCH 2/2] site: format Markdown.tsx via biome\n\nCo-authored-by: jaaydenh <1858163+jaaydenh@users.noreply.github.com> --- site/src/components/Markdown/Markdown.tsx | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/site/src/components/Markdown/Markdown.tsx b/site/src/components/Markdown/Markdown.tsx index cc81efb4a572e..6423f33d1ce00 100644 --- a/site/src/components/Markdown/Markdown.tsx +++ b/site/src/components/Markdown/Markdown.tsx @@ -252,10 +252,13 @@ function parseChildrenAsAlertContent( } // Identify the first element (usually a

) which contains the marker like [!NOTE] - const firstElementIndex = jsxChildren.findIndex((node): node is ReactElement => - isValidElement(node), + const firstElementIndex = jsxChildren.findIndex( + (node): node is ReactElement => isValidElement(node), ); - const mainParentNode = firstElementIndex >= 0 ? (jsxChildren[firstElementIndex] as ReactElement) : undefined; + const mainParentNode = + firstElementIndex >= 0 + ? (jsxChildren[firstElementIndex] as ReactElement) + : undefined; let parentChildren = mainParentNode?.props.children; if (typeof parentChildren === "string") { // Children will only be an array if the parsed text contains other @@ -319,7 +322,8 @@ function parseChildrenAsAlertContent( } const hasLeadingLinebreak = - isValidElement(firstParagraphRemainder[0]) && firstParagraphRemainder[0].type === "br"; + isValidElement(firstParagraphRemainder[0]) && + firstParagraphRemainder[0].type === "br"; if (hasLeadingLinebreak) { firstParagraphRemainder.shift(); } @@ -433,4 +437,4 @@ const markdownStyles: Interpolation = (theme: Theme) => ({ color: theme.palette.error.light, }, }, -}); \ No newline at end of file +}); pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.

Alternative Proxies: