update ufixitreviewonly to show equal access message

assets/js/Components/Forms/UfixitReviewOnly.js

@@ -1,34 +1,31 @@
-import React from 'react'
+import React, { useEffect, useState } from 'react'
 import { View } from '@instructure/ui-view'
 import { Text } from '@instructure/ui-text'
 
-class UfixitReviewOnly extends React.Component {
-  // constructor(props) {
-  //   super(props)
-
-  //   this.state = {
-  //     metadata: this.getMetadata(),
-  //   }
-  // }
-
-  // getMetadata() {
-  //   const issue = this.props.activeIssue
-  //   const metadata = JSON.parse(issue.metadata)
-  //   console.log(metadata)
-  //   return metadata
-  // }
+export default function UfixitReviewOnly(props) {
+  function getMetadata() {
+    const issue = props.activeIssue
+    const metadata = issue.metadata ? JSON.parse(issue.metadata) : {}
+    return metadata
+  }
 
+  const metadata = getMetadata()
+  const [message, setMessage] = useState("")
 
-  render() {
-    return (
-      <View as="div" margin="small small">
-        {/* {this.state.metadata.message ? <><Text lineHeight="double">{this.state.metadata.message}</Text><br /><br /></> : <></>} */}
-
-        {/* <Text fontStyle='italic' >{this.props.t('label.review_only')}</Text> */}
-        <Text lineHeight='double'>{this.props.t('label.review_only')}</Text>
-      </View>
-    )
-  }
-}
+  useEffect(() => {
+    if (metadata.message) {
+      // when using equal access, we should have metadata.message
+      setMessage(metadata.message)
+    }
+    else {
+      // otherwise, in phpally, we display the default "review" text
+      setMessage(props.t("label.review_only"))
+    }
+  }, [metadata])
 
-export default UfixitReviewOnly
+  return (
+    <View as="div" margin="small small">
+      <Text lineHeight='double'>{message}</Text>
+    </View>
+  )
+}