Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

bug: empty new line is ignored by markdown parser in Message text #1756

Closed
MartinCupela opened this issue Sep 16, 2022 · 3 comments
Closed
Labels
bug Something isn't working cluster:markdown Issues related to text / markdown parsing status:confirmed Described issue has been reproduced by the repo maintainer

Comments

@MartinCupela
Copy link
Contributor

Describe the bug

Empty lines are ignored in the message text.

To Reproduce

Steps to reproduce the behavior:

  1. In message input type text, then add 1+ empty lines with Shift + Enter, type more text
  2. Send message
  3. Observe the message text ignoring the empty lines

image

Expected behavior

Empty lines are kept:

image

Package version

  • stream-chat-react: 10.0.2
@MartinCupela MartinCupela added bug Something isn't working status:confirmed Described issue has been reproduced by the repo maintainer labels Sep 16, 2022
@arnautov-anton
Copy link
Contributor

arnautov-anton commented Sep 19, 2022

Blocked by #1560.

@MartinCupela MartinCupela added the cluster:markdown Issues related to text / markdown parsing label Sep 22, 2022
@barrelmaker
Copy link

barrelmaker commented Sep 27, 2022

@MartinCupela Found a "solution"...don't think you're going to like it but it worked for me :) In the MessageText component you can add a step after the messageTextToRender to doubly replace all new lines to this:

messageTextToRender = messageTextToRender?.replaceAll("\n\n", "\n  ‎  \n").replaceAll("\n", "\n  \n")

Where the first replaceAll("\n\n", "\n ‎ \n") has a unicode empty character "U+200E" between the two \n. If you copy that exactly it will unfortunately work. For some reason, this is the only solution I've found to work.

Here is the MessageText component with a little more context:

const { t, userLanguage } = useTranslationContext("MessageText")
const message = propMessage || contextMessage
const hasAttachment = messageHasAttachments(message)

let messageTextToRender =
  message.i18n?.[`${userLanguage}_text` as `${TranslationLanguages}_text`] || message.text

messageTextToRender = messageTextToRender
  ?.replaceAll("\n\n", "\n  ‎  \n")
  .replaceAll("\n", "\n  \n")

const messageText = useMemo(
  () => renderText(messageTextToRender, message.mentioned_users),
  [message.mentioned_users, messageTextToRender]
)

const wrapperClass = customWrapperClass || "str-chat__message-text"
const innerClass =
  customInnerClass || `str-chat__message-text-inner str-chat__message-${theme}-text-inner`

if (!messageTextToRender && !message.quoted_message) return null

Don't ask me how or why this works, but if you're in a pinch it'll do the job.

@MartinCupela
Copy link
Contributor Author

fixed by #2170

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working cluster:markdown Issues related to text / markdown parsing status:confirmed Described issue has been reproduced by the repo maintainer
Projects
None yet
Development

No branches or pull requests

3 participants