From 4c7240dff8ee4e2a36e619930bcbe38478d62e07 Mon Sep 17 00:00:00 2001 From: themashcodee Date: Mon, 26 Aug 2024 21:46:02 +0530 Subject: [PATCH] =?UTF-8?q?fix:=20=F0=9F=90=9B=20fix=20bug=20in=20parsing?= =?UTF-8?q?=20links?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 +- .../markdown_parser/elements/paragraph.tsx | 2 ++ src/utils/markdown_parser/parser.tsx | 22 +++++++++++++++- .../markdown_parser/sub_elements/html.tsx | 25 +++++++++++++++++++ .../markdown_parser/sub_elements/index.ts | 1 + src/utils/markdown_parser/types.ts | 6 +++++ 6 files changed, 56 insertions(+), 2 deletions(-) create mode 100644 src/utils/markdown_parser/sub_elements/html.tsx diff --git a/package.json b/package.json index 042d84e..797a5e9 100644 --- a/package.json +++ b/package.json @@ -11,7 +11,7 @@ ], "repository": "https://github.com/themashcodee/slack-blocks-to-jsx.git", "license": "MIT", - "version": "0.5.6", + "version": "0.5.7", "main": "dist/index.js", "module": "dist/index.mjs", "types": "dist/index.d.ts", diff --git a/src/utils/markdown_parser/elements/paragraph.tsx b/src/utils/markdown_parser/elements/paragraph.tsx index 55317e7..6dd2b4e 100644 --- a/src/utils/markdown_parser/elements/paragraph.tsx +++ b/src/utils/markdown_parser/elements/paragraph.tsx @@ -1,6 +1,7 @@ import { Delete, Emphasis, + HTML, InlineCode, Link, SlackBroadcast, @@ -25,6 +26,7 @@ export const Paragraph = (props: Props) => {

{element.children.map((subelement, i) => { if (subelement.type === "text") return ; + if (subelement.type === "html") return ; if (subelement.type === "emphasis") return ; if (subelement.type === "inlineCode") return ; if (subelement.type === "delete") return ; diff --git a/src/utils/markdown_parser/parser.tsx b/src/utils/markdown_parser/parser.tsx index 462ee26..2029d73 100644 --- a/src/utils/markdown_parser/parser.tsx +++ b/src/utils/markdown_parser/parser.tsx @@ -28,6 +28,16 @@ type Options = { hooks: GlobalStore["hooks"]; }; +// Helper function to check if a string is a valid URL +function isValidURL(string: string) { + try { + new URL(string); + return true; + } catch (_) { + return false; + } +} + export const markdown_parser = (markdown: string, options: Options): ReactNode => { if (!markdown) return null; @@ -40,7 +50,16 @@ export const markdown_parser = (markdown: string, options: Options): ReactNode = // REPLACE SINGLE tilde WITH DOUBLE tilde text_string = text_string.replace(/(? to [label](link), EXCLUDING LINKS STARTING WITH !date - text_string = text_string.replace(/<(?!(?:!date))([^|>]+)\|([^>]+)>/g, "[$2]($1)"); + text_string = text_string.replace(/<(?!(?:!date))([^|>]+)\|([^>]+)>/g, (match, link, label) => { + if (isValidURL(link)) return `[${label}](${link})`; + return match; + }); + // CHANGE LINK FORMATTING FROM to [link](link), EXCLUDING LINKS STARTING WITH !date + text_string = text_string.replace(/<(?!(?:!date))([^|>]+)>/g, (match, link) => { + if (isValidURL(link)) return `[${link}](${link})`; + return match; + }); + // REPLACE \n\n WITH '[[DOUBLE_LINE_BREAK]]' to prevent @yozora/parser to eat it text_string = text_string.replace(/\n\n/g, "[[DOUBLE_LINE_BREAK]]"); // REPLACE with @here @@ -51,6 +70,7 @@ export const markdown_parser = (markdown: string, options: Options): ReactNode = text_string = text_string.replace(//g, "@channel"); const parsed_data = parser.parse(text_string); + console.log({ text_string, parsed_data }); const elements = parsed_data.children as unknown as MarkdownElement[]; diff --git a/src/utils/markdown_parser/sub_elements/html.tsx b/src/utils/markdown_parser/sub_elements/html.tsx new file mode 100644 index 0000000..1667fcd --- /dev/null +++ b/src/utils/markdown_parser/sub_elements/html.tsx @@ -0,0 +1,25 @@ +import { HTMLSubElement } from "../types"; + +type Props = { + element: HTMLSubElement; +}; + +export const HTML = (props: Props) => { + const { element } = props; + + if (!element.value) return {element.value}; + if (element.value === " ") return  ; + + return ( + + {element.value.split("[[DOUBLE_LINE_BREAK]]").map((line, index) => { + return ( + + {index > 0 && } + {line} + + ); + })} + + ); +}; diff --git a/src/utils/markdown_parser/sub_elements/index.ts b/src/utils/markdown_parser/sub_elements/index.ts index a0ce7bd..8df1cc0 100644 --- a/src/utils/markdown_parser/sub_elements/index.ts +++ b/src/utils/markdown_parser/sub_elements/index.ts @@ -10,3 +10,4 @@ export * from "./slack_user_group_mention"; export * from "./slack_broadcast"; export * from "./slack_date"; export * from "./slack_emoji"; +export * from "./html"; diff --git a/src/utils/markdown_parser/types.ts b/src/utils/markdown_parser/types.ts index 756d324..af1f4f0 100644 --- a/src/utils/markdown_parser/types.ts +++ b/src/utils/markdown_parser/types.ts @@ -3,6 +3,11 @@ export type SlackEmojiSubElement = { value: string; }; +export type HTMLSubElement = { + type: "html"; + value: string; +}; + export type SlackDateSubElement = { type: "slack_date"; value: { @@ -114,6 +119,7 @@ export type ParagraphElement = { | SlackBroadcastSubElement | SlackDateSubElement | SlackEmojiSubElement + | HTMLSubElement )[]; };