prevent editing on desc/title if not authorized to edit

frontend/src/components/TopicCard/Desc.js

@@ -31,8 +31,7 @@ class Desc extends Component {
       ? '<p.Click to add description...</p>'
       : Util.mdToHTML(this.props.desc)
 
-    const htmlSpan = <span dangerouslySetInnerHTML={{ __html: descHTML }} />
+    if (this.props.authorizedToEdit) {
-
     return (
       <div className="scroll">
         <div className="desc">
@@ -58,6 +57,17 @@ class Desc extends Component {
         </div>
       </div>
     )
+    } else {
+      return (
+        <div className="scroll">
+          <div className="desc">
+            <span className="riek_desc">
+              {this.props.desc}
+            </span>
+          </div>
+        </div>
+      )
+    }
   }
 }
 

frontend/src/components/TopicCard/Title.js

@@ -2,32 +2,43 @@ import React from 'react'
 import { RIETextArea } from 'riek'
 
 const Title = (props) => {
-  return (
+  if (props.authorizedToEdit) {
-		<span className="title">
+    return (
-			<RIETextArea value={props.name}
+      <span className="title">
-				propName="name"
+        <RIETextArea value={props.name}
-				change={props.onChange}
+          propName="name"
-				className="titleWrapper"
+          change={props.onChange}
-				id="titleActivator"
+          className="titleWrapper"
-				classEditing="riek-editing"
+          id="titleActivator"
-				editProps={{
+          classEditing="riek-editing"
-					onKeyPress: e => {
+          editProps={{
-						const ENTER = 13
+            onKeyPress: e => {
-						if (e.which === ENTER) {
+              const ENTER = 13
-							e.preventDefault()
+              if (e.which === ENTER) {
-							props.onChange({ name: e.target.value })
+                e.preventDefault()
-						}
+                props.onChange({ name: e.target.value })
-					}
+              }
-				}}
+            }
-			/>
+          }}
-		</span>
+        />
-  )
+      </span>
+    )
+  } else {
+    return (
+      <span className="title">
+        <span className="titleWrapper">
+          {props.name}
+        </span>
+      </span>
+    )
+  }
 }
 
 /*
  * Title.propTypes = {
  *   name: PropTypes.string,
- *   onChange: PropTypes.func
+ *   onChange: PropTypes.func,
+ *   authorizedToEdit: PropTypes.bool
  * }
  */
 

frontend/src/components/TopicCard/index.js

@@ -23,7 +23,10 @@ class ReactTopicCard extends Component {
     return (
       <div className={classname}>
         <div className={`CardOnGraph ${hasAttachment ? 'hasAttachment' : ''}`} id={`topic_${topicId}`}>
-          <Title name={topic.get('name')} onChange={this.props.updateTopic} />
+          <Title name={topic.get('name')}
+            onChange={this.props.updateTopic}
+            authorizedToEdit={topic.authorizeToEdit(ActiveMapper)}
+          />
           <Links topic={topic}
             ActiveMapper={this.props.ActiveMapper}
             updateTopic={this.props.updateTopic}