healthyregions / SDOHPlace

Landing page and data discovery application for SDOH Place Project.
https://sdohplace.org
GNU General Public License v3.0
1 stars 0 forks source link

Render HTML in Description and Display Notes #181

Closed mradamcox closed 1 month ago

mradamcox commented 3 months ago

In the full item detail page, we should render the description and various notes fields as HTML. This would allow us to add links within the description metadata fields, which has been requested by folks working on the metadata records (it would really enrich the entries, as well).

pengyin-shan commented 3 months ago

Do we have a result item with description and various_notes fields that I can use to test this?

And can you explain render as HTML?

mradamcox commented 3 months ago

Sure, I have added this phrase to the Description field of the Social Vulnerability Index on the dev core: This is an <a href="https://sdohplace.org">example link</a> that should be rendered properly on the front-end.. When that field is displayed in the item details section, it should look like:

This is an example link that should be rendered properly on the front-end.

pengyin-shan commented 3 months ago

Ah I see, thanks for your explanation!

mradamcox commented 3 months ago

Ok, I added a link in the Neighborhood Atlas entry to test, and looks like we'll need more work on this, as the description currently gets cut off at the beginning of the HTML tag: https://discovery-app--cheerful-treacle-913a24.netlify.app/search?show=neighborhood-atlas

pengyin-shan commented 3 months ago

Ok, I added a link in the Neighborhood Atlas entry to test, and looks like we'll need more work on this, as the description currently gets cut off at the beginning of the HTML tag: https://discovery-app--cheerful-treacle-913a24.netlify.app/search?show=neighborhood-atlas

I see, I'll check on what happened.

pengyin-shan commented 3 months ago

I tested random hyperlinks and I could not replicate the issue locally...may I know the full description text we used for https://discovery-app--cheerful-treacle-913a24.netlify.app/search?show=neighborhood-atlas?

pengyin-shan commented 3 months ago

@mradamcox for this issue, do we still have the item with links in description that I can use for test?

mradamcox commented 3 months ago

Sorry yeah, just looking at this. The discovery_app branch deploy seems to be broken now somehow, I guess it must have something to do with the index. Looking into this now...

mradamcox commented 1 month ago

The problem was this line, the description was being truncated to its first sentence, which cut the link in half. There is no need to truncate the description anyway though. Technically it is an array, but passing this array into DOMPurify.sanitize() works just fine.