From e12f3ba87e6d09057591652a6702632ea150e0df Mon Sep 17 00:00:00 2001
From: himaniraghav3 <himaniraghav@gmail.com>
Date: Thu, 12 Dec 2024 19:34:27 +0530
Subject: [PATCH] PM-226 Replace dangerouslySetInnerHtml with plaintext
 rendering

---
 src/components/ChallengeEditor/ChallengeView/index.js |  6 +-----
 src/components/ChallengeEditor/index.js               |  7 +------
 src/components/ChallengesComponent/index.js           | 10 +++-------
 src/components/ProjectCard/index.js                   |  3 +--
 4 files changed, 6 insertions(+), 20 deletions(-)

diff --git a/src/components/ChallengeEditor/ChallengeView/index.js b/src/components/ChallengeEditor/ChallengeView/index.js
index c2da57eb..a16bd8a2 100644
--- a/src/components/ChallengeEditor/ChallengeView/index.js
+++ b/src/components/ChallengeEditor/ChallengeView/index.js
@@ -4,7 +4,6 @@ import PropTypes from 'prop-types'
 import cn from 'classnames'
 import { withRouter } from 'react-router-dom'
 import styles from './ChallengeView.module.scss'
-import xss from 'xss'
 import Track from '../../Track'
 import NDAField from '../NDAField'
 import UseSchedulingAPIField from '../UseSchedulingAPIField'
@@ -114,10 +113,7 @@ const ChallengeView = ({
             <div className={cn(styles.row, styles.topRow)}>
               <div className={styles.col}>
                 <span>
-                  <span className={styles.fieldTitle}>Project:</span>
-                  <span dangerouslySetInnerHTML={{
-                    __html: xss(projectDetail ? projectDetail.name : '')
-                  }} />
+                  <span className={styles.fieldTitle}>Project: {projectDetail ? projectDetail.name : ''}</span>
                 </span>
               </div>
               {selectedMilestone &&
diff --git a/src/components/ChallengeEditor/index.js b/src/components/ChallengeEditor/index.js
index 0ce1ea9a..eaa1de82 100644
--- a/src/components/ChallengeEditor/index.js
+++ b/src/components/ChallengeEditor/index.js
@@ -8,8 +8,6 @@ import moment from 'moment-timezone'
 import { pick } from 'lodash/fp'
 import { withRouter } from 'react-router-dom'
 import { toastr } from 'react-redux-toastr'
-import xss from 'xss'
-
 import {
   VALIDATION_VALUE_TYPE,
   PRIZE_SETS_TYPE,
@@ -1704,10 +1702,7 @@ class ChallengeEditor extends Component {
             <div className={cn(styles.row, styles.topRow)}>
               <div className={styles.col}>
                 <span>
-                  <span className={styles.fieldTitle}>Project:</span>
-                  <span dangerouslySetInnerHTML={{
-                    __html: xss(projectDetail ? projectDetail.name : '')
-                  }} />
+                  <span className={styles.fieldTitle}>Project: {projectDetail ? projectDetail.name : ''}</span>
                 </span>
               </div>
               <div className={styles.col}>
diff --git a/src/components/ChallengesComponent/index.js b/src/components/ChallengesComponent/index.js
index 6fa3adc0..a69bdd9a 100644
--- a/src/components/ChallengesComponent/index.js
+++ b/src/components/ChallengesComponent/index.js
@@ -10,7 +10,6 @@ import { CONNECT_APP_URL, PROJECT_ROLES } from '../../config/constants'
 import { PrimaryButton } from '../Buttons'
 import ChallengeList from './ChallengeList'
 import styles from './ChallengesComponent.module.scss'
-import xss from 'xss'
 import { checkReadOnlyRoles } from '../../util/tc'
 
 const ChallengesComponent = ({
@@ -61,12 +60,9 @@ const ChallengesComponent = ({
       <Helmet title={activeProject ? activeProject.name : ''} />
       {!dashboard && <div className={styles.titleContainer}>
         <div className={styles.titleLinks}>
-          <div
-            className={styles.title}
-            dangerouslySetInnerHTML={{
-              __html: xss(activeProject ? activeProject.name : '')
-            }}
-          />
+          <div className={styles.title}>
+            {activeProject ? activeProject.name : ''}
+          </div>
           {activeProject && activeProject.id && (
             <span>
               (
diff --git a/src/components/ProjectCard/index.js b/src/components/ProjectCard/index.js
index c133a5fa..39016cb2 100644
--- a/src/components/ProjectCard/index.js
+++ b/src/components/ProjectCard/index.js
@@ -2,7 +2,6 @@ import React from 'react'
 import PT from 'prop-types'
 import { Link } from 'react-router-dom'
 import cn from 'classnames'
-import xss from 'xss'
 
 import styles from './ProjectCard.module.scss'
 
@@ -14,7 +13,7 @@ const ProjectCard = ({ projectName, projectId, selected, setActiveProject }) =>
         className={cn(styles.projectName, { [styles.selected]: selected })}
         onClick={() => setActiveProject(parseInt(projectId))}
       >
-        <div className={styles.name} dangerouslySetInnerHTML={{ __html: xss(projectName) }} />
+        <div className={styles.name}>{projectName}</div>
       </Link>
     </div>
   )