From 8dc759378055c4417a84d2ec8c58d1525bbd9d6c Mon Sep 17 00:00:00 2001
From: Bianca Severino <bseverino@edx.org>
Date: Fri, 9 Apr 2021 12:55:48 -0400
Subject: [PATCH] fix: pass username into proctoring info panel (#406)

Pass a username into the proctoring info panel, allowing staff
to view a specific learner's onboarding status while masquerading.
---
 src/course-home/data/api.js                              | 7 +++++--
 src/course-home/outline-tab/OutlineTab.jsx               | 2 ++
 .../outline-tab/widgets/ProctoringInfoPanel.jsx          | 9 +++++++--
 3 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/src/course-home/data/api.js b/src/course-home/data/api.js
index 1e7104d8..4ac3268d 100644
--- a/src/course-home/data/api.js
+++ b/src/course-home/data/api.js
@@ -142,8 +142,11 @@ export async function getProgressTabData(courseId) {
   }
 }
 
-export async function getProctoringInfoData(courseId) {
-  const url = `${getConfig().LMS_BASE_URL}/api/edx_proctoring/v1/user_onboarding/status?course_id=${encodeURIComponent(courseId)}`;
+export async function getProctoringInfoData(courseId, username) {
+  let url = `${getConfig().LMS_BASE_URL}/api/edx_proctoring/v1/user_onboarding/status?course_id=${encodeURIComponent(courseId)}`;
+  if (username) {
+    url += `&username=${encodeURIComponent(username)}`;
+  }
   try {
     const { data } = await getAuthenticatedHttpClient().get(url);
     return data;
diff --git a/src/course-home/outline-tab/OutlineTab.jsx b/src/course-home/outline-tab/OutlineTab.jsx
index 1b82f854..538c21df 100644
--- a/src/course-home/outline-tab/OutlineTab.jsx
+++ b/src/course-home/outline-tab/OutlineTab.jsx
@@ -39,6 +39,7 @@ function OutlineTab({ intl }) {
   const {
     org,
     title,
+    username,
   } = useModel('courseHomeMeta', courseId);
 
   const {
@@ -204,6 +205,7 @@ function OutlineTab({ intl }) {
           <div className="col col-12 col-md-4">
             <ProctoringInfoPanel
               courseId={courseId}
+              username={username}
             />
             {courseGoalToDisplay && goalOptions && goalOptions.length > 0 && (
               <UpdateGoalSelector
diff --git a/src/course-home/outline-tab/widgets/ProctoringInfoPanel.jsx b/src/course-home/outline-tab/widgets/ProctoringInfoPanel.jsx
index 212e85a3..d6f13837 100644
--- a/src/course-home/outline-tab/widgets/ProctoringInfoPanel.jsx
+++ b/src/course-home/outline-tab/widgets/ProctoringInfoPanel.jsx
@@ -9,7 +9,7 @@ import { Button } from '@edx/paragon';
 import messages from '../messages';
 import { getProctoringInfoData } from '../../data/api';
 
-function ProctoringInfoPanel({ courseId, intl }) {
+function ProctoringInfoPanel({ courseId, username, intl }) {
   const [status, setStatus] = useState('');
   const [link, setLink] = useState('');
   const [releaseDate, setReleaseDate] = useState(null);
@@ -74,7 +74,7 @@ function ProctoringInfoPanel({ courseId, intl }) {
   }
 
   useEffect(() => {
-    getProctoringInfoData(courseId)
+    getProctoringInfoData(courseId, username)
       .then(
         response => {
           if (response) {
@@ -172,7 +172,12 @@ function ProctoringInfoPanel({ courseId, intl }) {
 
 ProctoringInfoPanel.propTypes = {
   courseId: PropTypes.string.isRequired,
+  username: PropTypes.string,
   intl: intlShape.isRequired,
 };
 
+ProctoringInfoPanel.defaultProps = {
+  username: null,
+};
+
 export default injectIntl(ProctoringInfoPanel);