-
Notifications
You must be signed in to change notification settings - Fork 3
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
fix(DHIS2-17668): sanitise HTML in table instead of showing it as encoded text #338
Conversation
🚀 Deployed on https://pr-338--dhis2-data-approval.netlify.app |
618145a
to
76cc4d8
Compare
d2a0f63
to
0b01d22
Compare
bbc0b45
to
80be548
Compare
c88a8c2
to
91223a2
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks 🙏
<DataTableToolbar columns={columns.length}> | ||
<span | ||
dangerouslySetInnerHTML={{ | ||
__html: DOMPurify.sanitize(title), |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
this seems like the title should not be HTML? Isn't this just the dataset name, and so if someone calls their dataset <h2>My data set</h2>
, I guess they should get that string literal back? Not parsed HTML?
91223a2
to
86f6d0d
Compare
86f6d0d
to
f4be462
Compare
|
||
// Needs to have the same width as the table, so can't use the one from | ||
// @dhis2/ui | ||
const DataTableToolbar = ({ children, columns }) => ( |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Minor: It's not immediately obvious that columns
is a number here. columnCount
would be more descriptive maybe?
🎉 This PR is included in version 100.0.12 🎉 The release is available on: Your semantic-release bot 📦🚀 |
fixes https://dhis2.atlassian.net/browse/DHIS2-17668
This PR updates the handling of custom datasets to allow display custom HTML and CSS - this is made safe by using
react-html-parser
(similar to other applications like data-entry).We created a new component for displaying custom datasets, rather than sanitising all input, to avoid adding unnecessary overhead for the vast majority of usecases that don't use custom datasets.
Screenshots