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

Line breaks are lost when displaying text in info panel #2651

Open
4 tasks done
404-html opened this issue Feb 2, 2025 · 4 comments
Open
4 tasks done

Line breaks are lost when displaying text in info panel #2651

404-html opened this issue Feb 2, 2025 · 4 comments
Labels
type:bug Impaired feature or lacking behavior that is likely assumed

Comments

@404-html
Copy link
Member

404-html commented Feb 2, 2025

New Issue Checklist

Issue Description

When showing a multi line text in info panel, the line breaks are lost, and text is rendered as a single line.

Image

Steps to reproduce

Setup info panel on a collection, and return following from the cloud function:

{
  panel: {
    segments: [
      {
        title: "User Info",
        items: [
          {
            type: "text",
            text: `
line 1

line 2`,
          },
        ],
      },
    ],
  },
}

Actual Outcome

Besides the line breaks, text is wrapped into single line.

Expected Outcome

I would expect line breaks to be preserved.

Environment

Dashboard

  • Parse Dashboard version: 6.0.0-alpha.28
  • Browser (Safari, Chrome, Firefox, Edge, etc.): Chrome
  • Browser version: 131.0.6778.205 (Official Build) (arm64)

Server

  • Parse Server version: any
  • Operating system: any
  • Local or remote host (AWS, Azure, Google Cloud, Heroku, Digital Ocean, etc): local

Database

  • System (MongoDB or Postgres): any
  • Database version: any
  • Local or remote host (MongoDB Atlas, mLab, AWS, Azure, Google Cloud, etc): any

Logs

Copy link

parse-github-assistant bot commented Feb 2, 2025

Thanks for opening this issue!

  • 🚀 You can help us to fix this issue faster by opening a pull request with a failing test. See our Contribution Guide for how to make a pull request, or read our New Contributor's Guide if this is your first time contributing.

@404-html 404-html added the type:bug Impaired feature or lacking behavior that is likely assumed label Feb 2, 2025
@mtrezza
Copy link
Member

mtrezza commented Feb 2, 2025

You mean to convert \n to <br />? Did you try to do that conversion on your data side? It may get escaped, but worth a try.

@404-html
Copy link
Member Author

404-html commented Feb 2, 2025

You mean to convert \n to <br />? Did you try to do that conversion on your data side? It may get escaped, but worth a try.

Yes, I tried both (adding into text on the cloud function side) - no effect.
Here's what worked:

<p style="white-space: pre-line;">...</p>

@mtrezza
Copy link
Member

mtrezza commented Feb 2, 2025

What would be a solution to this? On one hand the data should be escaped to not put the burden on the developer. On the other hand how should they enter a line-break? I suggest to add an option the text item where the text is not escaped at all and just displayed as is. That would even allow for style tags<b> or lists <ul>. Could be risky though, if the data displayed is data from a user and that data includes malicious code. But we could add a warning label to that option.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
type:bug Impaired feature or lacking behavior that is likely assumed
Projects
None yet
Development

No branches or pull requests

2 participants