xss

src/client/js/components/Admin/UserGroup/UserGroupCreateForm.jsx

@@ -13,6 +13,8 @@ class UserGroupCreateForm extends React.Component {
       name: '',
     };
 
+    this.xss = window.xss;
+
     this.handleChange = this.handleChange.bind(this);
     this.handleSubmit = this.handleSubmit.bind(this);
     this.validateForm = this.validateForm.bind(this);
@@ -40,7 +42,7 @@ class UserGroupCreateForm extends React.Component {
         const { userGroup, userGroupRelation } = res;
         this.props.onCreate(userGroup, userGroupRelation);
         this.setState({ name: '' });
-        apiSuccessHandler({ body: `Created ${userGroup.name}` });
+        apiSuccessHandler({ body: `Created ${this.xss.process(userGroup.name)}` });
       }
       else {
         throw new Error('Unable to create a group');

src/client/js/components/Admin/UserGroup/UserGroupDeleteModal.jsx

@@ -44,11 +44,9 @@ class UserGroupDeleteModal extends React.Component {
 
     this.state = this.initialState;
 
-    // retrieve xss library from window
     this.xss = window.xss;
 
     this.onHide = this.onHide.bind(this);
-    this.getGroupName = this.getGroupName.bind(this);
     this.handleActionChange = this.handleActionChange.bind(this);
     this.handleGroupChange = this.handleGroupChange.bind(this);
     this.handleSubmit = this.handleSubmit.bind(this);
@@ -62,10 +60,6 @@ class UserGroupDeleteModal extends React.Component {
     this.props.onHide();
   }
 
-  getGroupName(group) {
-    return this.xss.process(group.name);
-  }
-
   handleActionChange(e) {
     const actionName = e.target.value;
     this.setState({ actionName });
@@ -116,8 +110,8 @@ class UserGroupDeleteModal extends React.Component {
     });
 
     const options = groups.map((group) => {
-      const dataContent = `<i class="icon icon-fw icon-organization"></i> ${this.getGroupName(group)}`;
-      return <option key={group._id} value={group._id} data-content={dataContent}>{this.getGroupName(group)}</option>;
+      const dataContent = `<i class="icon icon-fw icon-organization"></i> ${this.xss.process(group.name)}`;
+      return <option key={group._id} value={group._id} data-content={dataContent}>{this.xss.process(group.name)}</option>;
     });
 
     const defaultOptionText = groups.length === 0 ? t('user_group_management.no_groups') : t('user_group_management.select_group');

src/client/js/components/Admin/UserGroup/UserGroupPage.jsx

@@ -19,6 +19,8 @@ class UserGroupPage extends React.Component {
       isDeleteModalShow: false,
     };
 
+    this.xss = window.xss;
+
     this.showDeleteModal = this.showDeleteModal.bind(this);
     this.hideDeleteModal = this.hideDeleteModal.bind(this);
     this.addUserGroup = this.addUserGroup.bind(this);
@@ -77,7 +79,7 @@ class UserGroupPage extends React.Component {
           };
         });
 
-        apiSuccessHandler({ body: `Deleted ${res.userGroup.name}` });
+        apiSuccessHandler({ body: `Deleted ${this.xss.process(res.userGroup.name)}` });
       }
       else {
         throw new Error('Unable to create a group');

src/client/js/components/Admin/UserGroup/UserGroupTable.jsx

@@ -7,6 +7,8 @@ class UserGroupTable extends React.Component {
   constructor(props) {
     super(props);
 
+    this.xss = window.xss;
+
     this.onDelete = this.onDelete.bind(this);
   }
 
@@ -42,16 +44,16 @@ class UserGroupTable extends React.Component {
                 <tr key={group._id}>
                   {this.props.isAclEnabled
                     ? (
-                      <td><a href={`/admin/user-group-detail/${group._id}`}>{group.name}</a></td>/* preventXSS */
+                      <td><a href={`/admin/user-group-detail/${group._id}`}>{this.xss.process(group.name)}</a></td>
                     )
                     : (
-                      <td>{group.name}</td>/* preventXSS */
+                      <td>{this.xss.process(group.name)}</td>
                     )
                   }
                   <td>
                     <ul className="list-inline">
                       {this.props.userGroupRelations[group._id].map((user) => {
-                        return <li key={user._id} className="list-inline-item badge badge-primary">{user.username}</li>;/* preventXSS ?? */
+                        return <li key={user._id} className="list-inline-item badge badge-primary">{this.xss.process(user.username)}</li>;
                       })}
                     </ul>
                   </td>
@@ -71,12 +73,7 @@ class UserGroupTable extends React.Component {
                             </li>
 
                             <li>
-                              <a
-                                href="#"
-                                data-user-group-id={group._id}
-                                data-user-group-name={group.name}/* encodeHTML */
-                                onClick={this.onDelete}
-                              >
+                              <a href="#" onClick={this.onDelete} data-user-group-id={group._id}>
                                 <i className="icon-fw icon-fire text-danger"></i> { t('Delete') }
                               </a>
                             </li>