From 3afd9424f4ac7523d675fbcbcc6865cac99d1ceb Mon Sep 17 00:00:00 2001 From: Jesus Balderrama Date: Mon, 28 Sep 2026 14:46:05 -0600 Subject: [PATCH 1/9] feat: small changes to improve UI --- src/components/GradebookHeader/index.jsx | 2 +- .../GradesView/FilterMenuToggle/index.jsx | 3 +- .../GradesView/ScoreViewInput/index.jsx | 5 +- src/components/GradesView/index.jsx | 48 ++++++++++++------- src/components/GradesView/messages.js | 4 +- 5 files changed, 38 insertions(+), 24 deletions(-) diff --git a/src/components/GradebookHeader/index.jsx b/src/components/GradebookHeader/index.jsx index 8d8fa7d2..944142c0 100644 --- a/src/components/GradebookHeader/index.jsx +++ b/src/components/GradebookHeader/index.jsx @@ -31,7 +31,7 @@ export const GradebookHeader = () => { : null; const backLinkContent = ( <> - + {formatMessage(messages.backToDashboard)} ); diff --git a/src/components/GradesView/FilterMenuToggle/index.jsx b/src/components/GradesView/FilterMenuToggle/index.jsx index 86d4d8dd..cba934a9 100644 --- a/src/components/GradesView/FilterMenuToggle/index.jsx +++ b/src/components/GradesView/FilterMenuToggle/index.jsx @@ -18,8 +18,9 @@ export const FilterMenuToggle = () => { id="edit-filters-btn" className="btn-primary align-self-start" onClick={toggleFilterMenu} + size="sm" > - {formatMessage(messages.editFilters)} + {formatMessage(messages.editFilters)} ); }; diff --git a/src/components/GradesView/ScoreViewInput/index.jsx b/src/components/GradesView/ScoreViewInput/index.jsx index f2601b05..9c3043c6 100644 --- a/src/components/GradesView/ScoreViewInput/index.jsx +++ b/src/components/GradesView/ScoreViewInput/index.jsx @@ -15,12 +15,13 @@ export const ScoreViewInput = () => { const { setGradeFormat } = useGradebookUi(); const toggleFormat = (e) => setGradeFormat(e.target.value); return ( - - {formatMessage(messages.scoreView)}: + + {formatMessage(messages.scoreView)}: diff --git a/src/components/GradesView/index.jsx b/src/components/GradesView/index.jsx index c135f392..c753dea1 100644 --- a/src/components/GradesView/index.jsx +++ b/src/components/GradesView/index.jsx @@ -17,6 +17,7 @@ import ScoreViewInput from './ScoreViewInput'; import SearchControls from './SearchControls'; import SpinnerIcon from './SpinnerIcon'; import StatusAlerts from './StatusAlerts'; +import { Bubble, Container } from '@openedx/paragon'; import { useRefetchGrades } from './data/hooks'; import messages from './messages'; @@ -40,29 +41,40 @@ export const GradesView = ({ updateQueryParams }) => { -

- {formatMessage(messages.filterStepHeading)} -

-
- - -
+ +

+ + 1 + + {formatMessage(messages.filterStepHeading)} +

+
+ + +
+ + + + +

+ + 2 + + {formatMessage(messages.gradebookStepHeading)} +

+ +
+ + +
+ + - - - -

{formatMessage(messages.gradebookStepHeading)}

- -
- - -
+ - -

* {formatMessage(messages.mastersHint)}

diff --git a/src/components/GradesView/messages.js b/src/components/GradesView/messages.js index bcb9a3aa..6172a02e 100644 --- a/src/components/GradesView/messages.js +++ b/src/components/GradesView/messages.js @@ -3,12 +3,12 @@ import { defineMessages } from '@openedx/frontend-base'; const messages = defineMessages({ filterStepHeading: { id: 'gradebook.GradesView.filterHeading', - defaultMessage: 'Step 1: Filter the Grade Report', + defaultMessage: 'Filter the Grade Report', description: 'Filter controls container heading string', }, gradebookStepHeading: { id: 'gradebook.GradesView.gradebookStepHeading', - defaultMessage: 'Step 2: View or Modify Individual Grades', + defaultMessage: 'View or Modify Individual Grades', description: 'Alert text for invalid minimum course grade', }, mastersHint: { From a419bc96ee2b161cc54a3ba3ff38ad9afde205ed Mon Sep 17 00:00:00 2001 From: Jesus Balderrama Date: Mon, 28 Sep 2026 15:30:04 -0600 Subject: [PATCH 2/9] fix: changes back after rebase --- src/components/GradebookHeader/index.jsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/src/components/GradebookHeader/index.jsx b/src/components/GradebookHeader/index.jsx index 944142c0..a11ba727 100644 --- a/src/components/GradebookHeader/index.jsx +++ b/src/components/GradebookHeader/index.jsx @@ -1,7 +1,8 @@ import { Link } from 'react-router-dom'; import { resolveRouteByRole, useIntl } from '@openedx/frontend-base'; -import { Button } from '@openedx/paragon'; +import { Button, Icon, Hyperlink } from '@openedx/paragon'; +import { ArrowBackIos } from '@openedx/paragon/icons'; import { instructorDashboardUrl } from '@src/data/services/lms/urls'; import { useGradebookNavigation } from '@src/data/gradebookNavigationContext'; @@ -45,16 +46,15 @@ export const GradebookHeader = () => { ); } if (dashboardRoute?.isInternal) { - return {backLinkContent}; + return {backLinkContent}; } - return {backLinkContent}; + return {backLinkContent}; }; return ( -
+
{renderBackLink()} -

{formatMessage(messages.gradebook)}

+

{formatMessage(messages.gradebook)}

-

{courseId}

{showBulkManagement && (
- - + +

* {formatMessage(messages.mastersHint)}

From 7c6308203bc3b42a4f8c0d74840c1b610d5f53d2 Mon Sep 17 00:00:00 2001 From: Jesus Balderrama Date: Tue, 29 Sep 2026 09:28:36 -0600 Subject: [PATCH 6/9] fix: small ui fixes --- src/components/GradebookHeader/index.jsx | 16 +++++----- src/components/GradesView/GradesView.scss | 3 -- src/components/GradesView/index.jsx | 36 ++++++++++++----------- 3 files changed, 28 insertions(+), 27 deletions(-) diff --git a/src/components/GradebookHeader/index.jsx b/src/components/GradebookHeader/index.jsx index a11ba727..cbb3a078 100644 --- a/src/components/GradebookHeader/index.jsx +++ b/src/components/GradebookHeader/index.jsx @@ -1,6 +1,4 @@ -import { Link } from 'react-router-dom'; - -import { resolveRouteByRole, useIntl } from '@openedx/frontend-base'; +import { getLinkProps, resolveRouteByRole, useIntl } from '@openedx/frontend-base'; import { Button, Icon, Hyperlink } from '@openedx/paragon'; import { ArrowBackIos } from '@openedx/paragon/icons'; @@ -45,10 +43,14 @@ export const GradebookHeader = () => { ); } - if (dashboardRoute?.isInternal) { - return {backLinkContent}; - } - return {backLinkContent}; + return ( + + {backLinkContent} + + ); }; return (
diff --git a/src/components/GradesView/GradesView.scss b/src/components/GradesView/GradesView.scss index 419f2149..127374db 100644 --- a/src/components/GradesView/GradesView.scss +++ b/src/components/GradesView/GradesView.scss @@ -31,9 +31,6 @@ .intervention-report-description { margin-right: 40px; } - h4.step-message-1 { - margin-top: 40px; - } } .student-filters{ diff --git a/src/components/GradesView/index.jsx b/src/components/GradesView/index.jsx index 556e9c5e..169e73d6 100644 --- a/src/components/GradesView/index.jsx +++ b/src/components/GradesView/index.jsx @@ -39,26 +39,28 @@ export const GradesView = ({ updateQueryParams }) => {
-

- - 1 - - {formatMessage(messages.filterStepHeading)} -

-
- - +
+ 1 +

+ {formatMessage(messages.filterStepHeading)} +

+
+
+ + +
- - + + +
-

- - 2 - - {formatMessage(messages.gradebookStepHeading)} -

+
+ 2 +

+ {formatMessage(messages.gradebookStepHeading)} +

+
From 1ba5da06099f0efab84fe51892abb26f00b5c809 Mon Sep 17 00:00:00 2001 From: Jesus Balderrama Date: Tue, 29 Sep 2026 14:55:35 -0600 Subject: [PATCH 7/9] refactor: course name added to view --- src/components/GradebookHeader/index.jsx | 6 +++++- src/components/GradesView/index.jsx | 12 ++++++------ 2 files changed, 11 insertions(+), 7 deletions(-) diff --git a/src/components/GradebookHeader/index.jsx b/src/components/GradebookHeader/index.jsx index cbb3a078..aa1b7a0f 100644 --- a/src/components/GradebookHeader/index.jsx +++ b/src/components/GradebookHeader/index.jsx @@ -9,6 +9,10 @@ import messages from './messages'; const instructorDashboardRole = 'org.openedx.frontend.role.instructorDashboard'; +const deriveCourseName = (courseId) => ( + (courseId?.split(':')[1] ?? '').split('+').slice(0, 2).join(' ') +); + export const GradebookHeader = () => { const { formatMessage } = useIntl(); const { @@ -55,7 +59,7 @@ export const GradebookHeader = () => { return (
{renderBackLink()} -

{formatMessage(messages.gradebook)}

+

{formatMessage(messages.gradebook)}: {deriveCourseName(courseId)}

{showBulkManagement && (