diff --git a/src/components/views/elements/Spoiler.js b/src/components/views/elements/Spoiler.js
index 9be7bc7784..b75967b225 100644
--- a/src/components/views/elements/Spoiler.js
+++ b/src/components/views/elements/Spoiler.js
@@ -1,15 +1,28 @@
-'use strict';
+/*
+ Copyright 2019 Sorunome
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ */
import React from 'react';
-module.exports = React.createClass({
- displayName: 'Spoiler',
-
- getInitialState() {
- return {
+export default class Spoiler extends React.Component {
+ constructor(props) {
+ super(props);
+ this.state = {
visible: false,
};
- },
+ }
toggleVisible(e) {
if (!this.state.visible) {
@@ -18,12 +31,15 @@ module.exports = React.createClass({
e.stopPropagation();
}
this.setState({ visible: !this.state.visible });
- },
+ }
- render: function() {
+ render() {
const reason = this.props.reason ? (
{"(" + this.props.reason + ")"}
) : null;
+ // react doesn't allow appending a DOM node as child.
+ // as such, we pass the this.props.contentHtml instead and then set the raw
+ // HTML content. This is secure as the contents have already been parsed previously
return (
{ reason }
@@ -32,4 +48,4 @@ module.exports = React.createClass({
);
}
-})
+}