PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 4

Use function from HTMLUtils for sanitizing

Browse source 
Encapsulates things a little nicer
This commit is contained in:
David Baker 2017-06-23 17:02:54 +01:00
parent 75ef80ecd4
commit 2efa099de2
2 changed files with 21 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
src/HtmlUtils.js
View file

@ -107,7 +107,17 @@ export function stripParagraphs(html: string): string {
return contentHTML;
}
var sanitizeHtmlParams = {
/*
* Given an untrusted HTML string, return a React node with an sanitized version
* of that HTML.
*/
export function sanitizedHtmlNode(insaneHtml) {
const saneHtml = sanitizeHtml(insaneHtml, sanitizeHtmlParams);
return <div dangerouslySetInnerHTML={{ __html: saneHtml }} dir="auto" />;
}
const sanitizeHtmlParams = {
allowedTags: [
'font', // custom to matrix for IRC-style font coloring
'del', // for markdown

26
src/components/structures/GroupView.js
View file

@ -16,8 +16,7 @@ limitations under the License.
import MatrixClientPeg from '../../MatrixClientPeg';
import sdk from '../../index';
import sanitizeHtml from "sanitize-html";
import { sanitizeHtmlParams } from '../../HtmlUtils';
import { sanitizedHtmlNode } from '../../HtmlUtils';
module.exports = React.createClass({
@ -53,14 +52,13 @@ module.exports = React.createClass({
},
_loadGroupFromServer: function(groupId) {
const self = this;
MatrixClientPeg.get().getGroupSummary(groupId).done(function(res) {
self.setState({
MatrixClientPeg.get().getGroupSummary(groupId).done((res) => {
this.setState({
phase: "GroupView.DISPLAY",
summary: res,
});
}, function(err) {
self.setState({
}, (err) => {
this.setState({
phase: err.errcode == 404 ? "GroupView.NOT_FOUND" :"GroupView.ERROR",
summary: null,
});
@ -68,15 +66,11 @@ module.exports = React.createClass({
},
render: function() {
var BaseAvatar = sdk.getComponent("avatars.BaseAvatar");
var Loader = sdk.getComponent("elements.Spinner");
const BaseAvatar = sdk.getComponent("avatars.BaseAvatar");
const Loader = sdk.getComponent("elements.Spinner");
if (this.state.phase == "GroupView.LOADING") {
return (
<div style={{margin: "auto"}}>
<Loader />
</div>
);
return <Loader />;
} else if (this.state.phase == "GroupView.DISPLAY") {
const summary = this.state.summary;
let avatar_url = null;
@ -85,7 +79,7 @@ module.exports = React.createClass({
}
let description = null;
if (summary.profile.long_description) {
description = sanitizeHtml(summary.profile.long_description);
description = sanitizedHtmlNode(summary.profile.long_description);
}
return (
<div style={{maxWidth: "960px", width: "100%", "margin": "20px auto"}}>
@ -112,7 +106,7 @@ module.exports = React.createClass({
</div>
</div>
</div>
<div dangerouslySetInnerHTML={{ __html: description }} />
{description}
</div>
);
} else if (this.state.phase == "GroupView.NOT_FOUND") {