From 5b19670d0ac81994f5429565e8abab79b6e99b18 Mon Sep 17 00:00:00 2001
From: AfaqShuaib09 <afaq.shoaib09@gmail.com>
Date: Thu, 13 Jul 2023 02:25:54 +0500
Subject: [PATCH 1/2] feat: add watchers field to course edit form

---
 .../EditCoursePage/EditCourseForm.jsx         | 23 ++++++++++++++++
 .../EditCoursePage/EditCoursePage.test.jsx    |  3 +++
 .../EditCourseForm.test.jsx.snap              | 27 +++++++++++++++++++
 .../EditCoursePage.test.jsx.snap              | 13 +++++++++
 src/components/EditCoursePage/index.jsx       |  3 +++
 5 files changed, 69 insertions(+)

diff --git a/src/components/EditCoursePage/EditCourseForm.jsx b/src/components/EditCoursePage/EditCourseForm.jsx
index 4b982a10a..a4aae7273 100644
--- a/src/components/EditCoursePage/EditCourseForm.jsx
+++ b/src/components/EditCoursePage/EditCourseForm.jsx
@@ -1091,6 +1091,28 @@ export class BaseEditCourseForm extends React.Component {
               disabled={disabled}
               optional
             />
+            {administrator && (
+              <Field
+                name="watchers"
+                component={RenderInputTextField}
+                label={
+                  <FieldLabel
+                    text="Watchers"
+                    optional
+                    helpText={(
+                      <div>
+                        <p>
+                          A comma-separated list of email addresses that will be notified if the any of the course run of the course is published or scheduled.
+                        </p>
+                      </div>
+                    )}
+                  />
+                }
+                extraInput={{ onInvalid: this.openCollapsible }}
+                disabled={disabled}
+                optional
+              />
+            )}
             {administrator && (
             <>
               <FieldLabel text="Merchandising Location Restriction" className="mb-2" />
@@ -1313,6 +1335,7 @@ BaseEditCourseForm.propTypes = {
         external_course_marketing_type: PropTypes.string,
       }),
       topics: PropTypes.arrayOf(PropTypes.string),
+      watchers: PropTypes.arrayOf(PropTypes.string),
     }),
   }),
   courseSubmitInfo: PropTypes.shape({
diff --git a/src/components/EditCoursePage/EditCoursePage.test.jsx b/src/components/EditCoursePage/EditCoursePage.test.jsx
index e4e387c7f..1610a9b20 100644
--- a/src/components/EditCoursePage/EditCoursePage.test.jsx
+++ b/src/components/EditCoursePage/EditCoursePage.test.jsx
@@ -161,6 +161,7 @@ describe('EditCoursePage', () => {
       skill_names: [],
       organization_logo_override_url: 'http://image.src.small',
       organization_short_code_override: 'test short code',
+      watchers: [],
       location_restriction: {
         restriction_type: 'allowlist',
         countries: [
@@ -426,6 +427,7 @@ describe('EditCoursePage', () => {
       },
       organization_logo_override: 'http://image.src.small',
       organization_short_code_override: 'test short code',
+      watchers: [],
       outcome: '<p>Stuff</p>',
       prerequisites_raw: '',
       prices: {
@@ -967,6 +969,7 @@ describe('EditCoursePage', () => {
       },
       organization_logo_override: 'http://image.src.small',
       organization_short_code_override: 'test short code',
+      watchers: [],
       outcome: '<p>Stuff</p>',
       prerequisites_raw: '',
       prices: {
diff --git a/src/components/EditCoursePage/__snapshots__/EditCourseForm.test.jsx.snap b/src/components/EditCoursePage/__snapshots__/EditCourseForm.test.jsx.snap
index 3c545dfab..68f1356fc 100644
--- a/src/components/EditCoursePage/__snapshots__/EditCourseForm.test.jsx.snap
+++ b/src/components/EditCoursePage/__snapshots__/EditCourseForm.test.jsx.snap
@@ -6706,6 +6706,33 @@ exports[`BaseEditCourseForm renders html correctly with administrator being true
         requiredHeight={110}
         requiredWidth={110}
       />
+      <Field
+        component={[Function]}
+        disabled={true}
+        extraInput={
+          Object {
+            "onInvalid": [Function],
+          }
+        }
+        label={
+          <FieldLabel
+            className=""
+            extraText=""
+            helpText={
+              <div>
+                <p>
+                  A comma-separated list of email addresses that will be notified if the any of the course run of the course is published or scheduled.
+                </p>
+              </div>
+            }
+            id={null}
+            optional={true}
+            text="Watchers"
+          />
+        }
+        name="watchers"
+        optional={true}
+      />
       <FieldLabel
         className="mb-2"
         extraText=""
diff --git a/src/components/EditCoursePage/__snapshots__/EditCoursePage.test.jsx.snap b/src/components/EditCoursePage/__snapshots__/EditCoursePage.test.jsx.snap
index 6f39082b3..0b03bab16 100644
--- a/src/components/EditCoursePage/__snapshots__/EditCoursePage.test.jsx.snap
+++ b/src/components/EditCoursePage/__snapshots__/EditCoursePage.test.jsx.snap
@@ -169,6 +169,7 @@ exports[`EditCoursePage renders html correctly 1`] = `
           "type": undefined,
           "url_slug": undefined,
           "videoSrc": undefined,
+          "watchers": undefined,
         }
       }
       onSubmit={[Function]}
@@ -471,6 +472,7 @@ exports[`EditCoursePage renders page correctly with courseInfo 1`] = `
               "image": null,
               "src": "https://www.video.information/watch?v=cVsQLlk-T0s",
             },
+            "watchers": Array [],
           },
           "error": null,
           "isFetching": false,
@@ -693,6 +695,7 @@ exports[`EditCoursePage renders page correctly with courseInfo 1`] = `
           "type": "8a8f30e1-23ce-4ed3-a361-1325c656b67b",
           "url_slug": undefined,
           "videoSrc": "https://www.video.information/watch?v=cVsQLlk-T0s",
+          "watchers": Array [],
         }
       }
       number="Test101x"
@@ -975,6 +978,7 @@ exports[`EditCoursePage renders page correctly with courseInfo and courseOptions
               "image": null,
               "src": "https://www.video.information/watch?v=cVsQLlk-T0s",
             },
+            "watchers": Array [],
           },
           "error": null,
           "isFetching": false,
@@ -1570,6 +1574,7 @@ exports[`EditCoursePage renders page correctly with courseInfo and courseOptions
           "type": "8a8f30e1-23ce-4ed3-a361-1325c656b67b",
           "url_slug": undefined,
           "videoSrc": "https://www.video.information/watch?v=cVsQLlk-T0s",
+          "watchers": Array [],
         }
       }
       number="Test101x"
@@ -1767,6 +1772,7 @@ exports[`EditCoursePage renders page correctly with courseInfo error 1`] = `
           "type": undefined,
           "url_slug": undefined,
           "videoSrc": undefined,
+          "watchers": undefined,
         }
       }
       onSubmit={[Function]}
@@ -2070,6 +2076,7 @@ exports[`EditCoursePage renders page correctly with courseInfo, courseOptions, a
               "image": null,
               "src": "https://www.video.information/watch?v=cVsQLlk-T0s",
             },
+            "watchers": Array [],
           },
           "error": null,
           "isFetching": false,
@@ -2733,6 +2740,7 @@ exports[`EditCoursePage renders page correctly with courseInfo, courseOptions, a
           "type": "8a8f30e1-23ce-4ed3-a361-1325c656b67b",
           "url_slug": undefined,
           "videoSrc": "https://www.video.information/watch?v=cVsQLlk-T0s",
+          "watchers": Array [],
         }
       }
       number="Test101x"
@@ -2946,6 +2954,7 @@ exports[`EditCoursePage renders page correctly with courseInfo, courseOptions, a
           "type": undefined,
           "url_slug": undefined,
           "videoSrc": undefined,
+          "watchers": undefined,
         }
       }
       onSubmit={[Function]}
@@ -3537,6 +3546,7 @@ exports[`EditCoursePage renders page correctly with courseOptions 1`] = `
           "type": undefined,
           "url_slug": undefined,
           "videoSrc": undefined,
+          "watchers": undefined,
         }
       }
       onSubmit={[Function]}
@@ -3734,6 +3744,7 @@ exports[`EditCoursePage renders page correctly with courseOptions error 1`] = `
           "type": undefined,
           "url_slug": undefined,
           "videoSrc": undefined,
+          "watchers": undefined,
         }
       }
       onSubmit={[Function]}
@@ -4016,6 +4027,7 @@ exports[`EditCoursePage renders page correctly with courseRunOptions 1`] = `
           "type": undefined,
           "url_slug": undefined,
           "videoSrc": undefined,
+          "watchers": undefined,
         }
       }
       onSubmit={[Function]}
@@ -4213,6 +4225,7 @@ exports[`EditCoursePage renders page correctly with courseRunOptions error 1`] =
           "type": undefined,
           "url_slug": undefined,
           "videoSrc": undefined,
+          "watchers": undefined,
         }
       }
       onSubmit={[Function]}
diff --git a/src/components/EditCoursePage/index.jsx b/src/components/EditCoursePage/index.jsx
index 1b91d6e28..7948fbd00 100644
--- a/src/components/EditCoursePage/index.jsx
+++ b/src/components/EditCoursePage/index.jsx
@@ -370,6 +370,7 @@ class EditCoursePage extends React.Component {
       organization_logo_override: courseData.organization_logo_override_url,
       organization_short_code_override:
         courseData.organization_short_code_override,
+      watchers: courseData.watchers ? courseData.watchers.split(',') : [],
       outcome: courseData.outcome,
       prerequisites_raw: courseData.prerequisites_raw,
       ...priceData,
@@ -615,6 +616,7 @@ class EditCoursePage extends React.Component {
           enterprise_subscription_inclusion,
           organization_short_code_override,
           organization_logo_override_url,
+          watchers,
         },
       },
     } = this.props;
@@ -657,6 +659,7 @@ class EditCoursePage extends React.Component {
       enterprise_subscription_inclusion,
       organization_short_code_override,
       organization_logo_override_url,
+      watchers,
       location_restriction: this.buildLocationRestriction(),
       in_year_value: this.buildInYearValue(),
       tags: topics?.length ? topics.map(t => ({ label: t, value: t })) : null,

From 43df5ff423526c09630ff0d35ae4e2687ec836cc Mon Sep 17 00:00:00 2001
From: AfaqShuaib09 <afaq.shoaib09@gmail.com>
Date: Thu, 13 Jul 2023 02:42:04 +0500
Subject: [PATCH 2/2] fix: lint issues

---
 src/components/EditCoursePage/EditCourseForm.jsx | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/components/EditCoursePage/EditCourseForm.jsx b/src/components/EditCoursePage/EditCourseForm.jsx
index a4aae7273..ac1fe69a5 100644
--- a/src/components/EditCoursePage/EditCourseForm.jsx
+++ b/src/components/EditCoursePage/EditCourseForm.jsx
@@ -1095,19 +1095,20 @@ export class BaseEditCourseForm extends React.Component {
               <Field
                 name="watchers"
                 component={RenderInputTextField}
-                label={
+                label={(
                   <FieldLabel
                     text="Watchers"
                     optional
                     helpText={(
                       <div>
                         <p>
-                          A comma-separated list of email addresses that will be notified if the any of the course run of the course is published or scheduled.
+                          A comma-separated list of email addresses that will be notified if the any of the course run
+                          of the course is published or scheduled.
                         </p>
                       </div>
                     )}
                   />
-                }
+                )}
                 extraInput={{ onInvalid: this.openCollapsible }}
                 disabled={disabled}
                 optional