From ace68ba45b481f11cb0ed4f9c8f26cbf304837de Mon Sep 17 00:00:00 2001
From: "kshitij.sobti" <kshitij@sobti.in>
Date: Wed, 23 Oct 2024 19:18:57 +0530
Subject: [PATCH] fixup!: combine the grades slots into a single one

---
 src/course-home/progress-tab/ProgressTab.jsx  | 14 ++----
 .../ProgressTabDetailedGradesSlot/README.md   | 43 -------------------
 .../ProgressTabDetailedGradesSlot/index.jsx   | 20 ---------
 .../README.md                                 |  0
 .../ProgressTabGradeBreakdownSlot/index.jsx   | 33 ++++++++++++++
 .../ProgressTabGradeSummarySlot/index.jsx     | 20 ---------
 6 files changed, 36 insertions(+), 94 deletions(-)
 delete mode 100644 src/plugin-slots/ProgressTabDetailedGradesSlot/README.md
 delete mode 100644 src/plugin-slots/ProgressTabDetailedGradesSlot/index.jsx
 rename src/plugin-slots/{ProgressTabGradeSummarySlot => ProgressTabGradeBreakdownSlot}/README.md (100%)
 create mode 100644 src/plugin-slots/ProgressTabGradeBreakdownSlot/index.jsx
 delete mode 100644 src/plugin-slots/ProgressTabGradeSummarySlot/index.jsx

diff --git a/src/course-home/progress-tab/ProgressTab.jsx b/src/course-home/progress-tab/ProgressTab.jsx
index 8bed75740c..585b12b2c4 100644
--- a/src/course-home/progress-tab/ProgressTab.jsx
+++ b/src/course-home/progress-tab/ProgressTab.jsx
@@ -7,8 +7,7 @@ import ProgressHeader from './ProgressHeader';
 
 import ProgressTabCertificateStatusSlot from '../../plugin-slots/ProgressTabCertificateStatusSlot';
 import ProgressTabCourseGradeSlot from '../../plugin-slots/ProgressTabCourseGradeSlot';
-import ProgressTabDetailedGradesSlot from '../../plugin-slots/ProgressTabDetailedGradesSlot';
-import ProgressTabGradeSummarySlot from '../../plugin-slots/ProgressTabGradeSummarySlot';
+import ProgressTabGradeBreakdownSlot from '../../plugin-slots/ProgressTabGradeBreakdownSlot';
 import ProgressTabRelatedLinksSlot from '../../plugin-slots/ProgressTabRelatedLinksSlot';
 import { useModel } from '../../generic/model-store';
 
@@ -17,11 +16,7 @@ const ProgressTab = () => {
     courseId,
   } = useSelector(state => state.courseHome);
 
-  const {
-    gradesFeatureIsFullyLocked, disableProgressGraph,
-  } = useModel('progress', courseId);
-
-  const applyLockedOverlay = gradesFeatureIsFullyLocked ? 'locked-overlay' : '';
+  const { disableProgressGraph } = useModel('progress', courseId);
 
   const windowWidth = useWindowSize().width;
   if (windowWidth === undefined) {
@@ -41,10 +36,7 @@ const ProgressTab = () => {
           {!disableProgressGraph && <CourseCompletion />}
           {!wideScreen && <ProgressTabCertificateStatusSlot courseId={courseId} />}
           <ProgressTabCourseGradeSlot courseId={courseId} />
-          <div className={`grades my-4 p-4 rounded raised-card ${applyLockedOverlay}`} aria-hidden={gradesFeatureIsFullyLocked}>
-            <ProgressTabGradeSummarySlot courseId={courseId} />
-            <ProgressTabDetailedGradesSlot courseId={courseId} />
-          </div>
+          <ProgressTabGradeBreakdownSlot courseId={courseId} />
         </div>
 
         {/* Side panel */}
diff --git a/src/plugin-slots/ProgressTabDetailedGradesSlot/README.md b/src/plugin-slots/ProgressTabDetailedGradesSlot/README.md
deleted file mode 100644
index 93789ea22c..0000000000
--- a/src/plugin-slots/ProgressTabDetailedGradesSlot/README.md
+++ /dev/null
@@ -1,43 +0,0 @@
-# Progress Tab Detailed Graded Slot
-
-### Slot ID: `progress_tab_detailed_grades_slot`
-### Props:
-* `courseId`
-
-## Description
-
-This slot is used to replace or modify the Detailed Grades view in the Progress Tab.
-
-## Example
-
-The following `env.config.jsx` will render the `course_id` and `unit_id` of the course as `<p>` elements in a `<div>`.
-
-![Screenshot of Content added after the Sequence Container](./images/post_sequence_container.png)
-
-```js
-import { DIRECT_PLUGIN, PLUGIN_OPERATIONS } from '@openedx/frontend-plugin-framework';
-
-const config = {
-  pluginSlots: {
-    progress_tab_detailed_grades_slot: {
-      plugins: [
-        {
-          // Insert custom content after detailed grades widget
-          op: PLUGIN_OPERATIONS.Insert,
-          widget: {
-            id: 'custom_detailed_grades_content',
-            type: DIRECT_PLUGIN,
-            RenderWidget: ({courseId}) => (
-              <div>
-                <p>📚: {courseId}</p>
-              </div>
-            ),
-          },
-        },
-      ]
-    }
-  },
-}
-
-export default config;
-```
diff --git a/src/plugin-slots/ProgressTabDetailedGradesSlot/index.jsx b/src/plugin-slots/ProgressTabDetailedGradesSlot/index.jsx
deleted file mode 100644
index b449687d3b..0000000000
--- a/src/plugin-slots/ProgressTabDetailedGradesSlot/index.jsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import PropTypes from 'prop-types';
-import { PluginSlot } from '@openedx/frontend-plugin-framework';
-import DetailedGrades from '../../course-home/progress-tab/grades/detailed-grades/DetailedGrades';
-
-const ProgressTabDetailedGradesSlot = ({ courseId }) => (
-  <PluginSlot
-    id="progress_tab_detailed_grades_slot"
-    pluginProps={{
-      courseId,
-    }}
-  >
-    <DetailedGrades />
-  </PluginSlot>
-);
-
-ProgressTabDetailedGradesSlot.propTypes = {
-  courseId: PropTypes.string.isRequired,
-};
-
-export default ProgressTabDetailedGradesSlot;
diff --git a/src/plugin-slots/ProgressTabGradeSummarySlot/README.md b/src/plugin-slots/ProgressTabGradeBreakdownSlot/README.md
similarity index 100%
rename from src/plugin-slots/ProgressTabGradeSummarySlot/README.md
rename to src/plugin-slots/ProgressTabGradeBreakdownSlot/README.md
diff --git a/src/plugin-slots/ProgressTabGradeBreakdownSlot/index.jsx b/src/plugin-slots/ProgressTabGradeBreakdownSlot/index.jsx
new file mode 100644
index 0000000000..de37ba54da
--- /dev/null
+++ b/src/plugin-slots/ProgressTabGradeBreakdownSlot/index.jsx
@@ -0,0 +1,33 @@
+import { useModel } from '@src/generic/model-store';
+import PropTypes from 'prop-types';
+import { PluginSlot } from '@openedx/frontend-plugin-framework';
+import React from 'react';
+import DetailedGrades from '../../course-home/progress-tab/grades/detailed-grades/DetailedGrades';
+import GradeSummary from '../../course-home/progress-tab/grades/grade-summary/GradeSummary';
+
+const ProgressTabGradeBreakdownSlot = ({ courseId }) => {
+  const { gradesFeatureIsFullyLocked } = useModel('progress', courseId);
+  const applyLockedOverlay = gradesFeatureIsFullyLocked ? 'locked-overlay' : '';
+  return (
+    <PluginSlot
+      id="progress_tab_grade_breakdown_slot"
+      pluginProps={{
+        courseId,
+      }}
+    >
+      <div
+        className={`grades my-4 p-4 rounded raised-card ${applyLockedOverlay}`}
+        aria-hidden={gradesFeatureIsFullyLocked}
+      >
+        <GradeSummary />
+        <DetailedGrades />
+      </div>
+    </PluginSlot>
+  );
+};
+
+ProgressTabGradeBreakdownSlot.propTypes = {
+  courseId: PropTypes.string.isRequired,
+};
+
+export default ProgressTabGradeBreakdownSlot;
diff --git a/src/plugin-slots/ProgressTabGradeSummarySlot/index.jsx b/src/plugin-slots/ProgressTabGradeSummarySlot/index.jsx
deleted file mode 100644
index 2d0ebbccfb..0000000000
--- a/src/plugin-slots/ProgressTabGradeSummarySlot/index.jsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import PropTypes from 'prop-types';
-import { PluginSlot } from '@openedx/frontend-plugin-framework';
-import GradeSummary from '../../course-home/progress-tab/grades/grade-summary/GradeSummary';
-
-const ProgressTabGradeSummarySlot = ({ courseId }) => (
-  <PluginSlot
-    id="progress_tab_grade_summary_slot"
-    pluginProps={{
-      courseId,
-    }}
-  >
-    <GradeSummary />
-  </PluginSlot>
-);
-
-ProgressTabGradeSummarySlot.propTypes = {
-  courseId: PropTypes.string.isRequired,
-};
-
-export default ProgressTabGradeSummarySlot;