feat: small changes to improve UI by jesusbalderramawgu · Pull Request #636 · openedx/frontend-app-gradebook

jesusbalderramawgu · 2026-09-28T21:06:29Z

Description

This project was recently upgraded to frontend-base, and we found out that we need to make some refactors and improve the UI, Currently is not in the best shape.

in the future this repo will need a refactor to improve the code and also to have a better UI and make it match with all the new styles.

What does this PR do?

I made a small change while we work on the refactor to make the UI a little bit better, we are using this frontend application inside the instructor dashboard so it is worth it to make this small changes.

Screnshots

Before

After

openedx-webhooks · 2026-09-28T21:06:34Z

Thanks for the pull request, @jesusbalderramawgu!

This repository is currently maintained by @farhaanbukhsh.

Once you've gone through the following steps feel free to tag them in a comment and let them know that your changes are ready for engineering review.

🔘 Get product approval

If you haven't already, check this list to see if your contribution needs to go through the product review process.

If it does, you'll need to submit a product proposal for your contribution, and have it reviewed by the Product Working Group.
- This process (including the steps you'll need to take) is documented here.
If it doesn't, simply proceed with the next step.

🔘 Provide context

To help your reviewers and other members of the community understand the purpose and larger context of your changes, feel free to add as much of the following information to the PR description as you can:

Dependencies

This PR must be merged before / after / at the same time as ...
Blockers

This PR is waiting for OEP-1234 to be accepted.
Timeline information

This PR must be merged by XX date because ...
Partner information

This is for a course on edx.org.
Supporting documentation
Relevant Open edX discussion forum threads

🔘 Get a green build

If one or more checks are failing, continue working on your changes until this is no longer the case and your build turns green.

Details

Where can I find more information?

If you'd like to get more details on all aspects of the review process for open source pull requests (OSPRs), check out the following resources:

When can I expect my changes to be merged?

Our goal is to get community contributions seen and reviewed as efficiently as possible.

However, the amount of time that it takes to review and merge a PR can vary significantly based on factors such as:

The size and impact of the changes that it introduces
The need for product review
Maintenance status of the parent repository

💡 As a result it may take up to several weeks or months to complete a review and merge your PR.

jesusbalderramawgu · 2026-09-28T21:07:21Z

I'm not rendering the CCX ID anymore because it is too long and I didn't consider it was necessary but let me know your thoughts on this, maybe it was there for a reasion.
Anything please let me know!

codecov · 2026-09-28T21:47:34Z

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 98.60%. Comparing base (93f7544) to head (96158d6).

Additional details and impacted files

@@            Coverage Diff             @@
##           master     #636      +/-   ##
==========================================
- Coverage   98.60%   98.60%   -0.01%     
==========================================
  Files         112      112              
  Lines        1220     1219       -1     
  Branches      209      207       -2     
==========================================
- Hits         1203     1202       -1     
  Misses         16       16              
  Partials        1        1

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

jesusbalderramawgu · 2026-09-28T21:58:29Z

@arbrandes, thank you and sorry about the imports I made a rebase and I messed up the imports, sorry for the inconveniences.

I have addressed your comments, thank you@

arbrandes

It's fine not to have the course ID in CCX, but we need to show something in the standalone gradebook to say what course the user is in. Ideas?

Also, a few further findings inline.

jesusbalderramawgu · 2026-09-29T21:05:54Z

It's fine not to have the course ID in CCX, but we need to show something in the standalone gradebook to say what course the user is in. Ideas?

Also, a few further findings inline.

well I added the courseName

It's fine not to have the course ID in CCX, but we need to show something in the standalone gradebook to say what course the user is in. Ideas?

Also, a few further findings inline.

well I added the course name, what do you think?

arbrandes · 2026-10-05T14:14:03Z

+const deriveCourseName = (courseId) => (
+  (courseId?.split(':')[1] ?? '').split('+').slice(0, 2).join(' ')
+);


This isn't the course name, it's org + course number: course-v1:TestU+CS101+2024 becomes "TestU CS101". Dropping the run means every run of a course shows the same label, which is the one thing a course identifier in the header should disambiguate.

Either show the real display name (the instructor dashboard gets it from its course info API, see CourseInfoSlot), or keep it simple and render the full courseId in smaller text below the heading. Long CCX ids can wrap with text-break, as before.

arbrandes · 2026-10-05T14:14:04Z

+          <Bubble className="mr-2">1</Bubble>
+          <h3 className="h4 text-primary-700 my-0">
+            <span>{formatMessage(messages.filterStepHeading)}</span>


Nit: now that the Bubble is outside the h3, the inner <span> does nothing and can go. Same at 58-60. The bare <div> wrapper at 47 is also left over from the ml-3 and can be dropped.

arbrandes · 2026-10-05T14:14:04Z

 import PropTypes from 'prop-types';
-
 import { useIntl } from '@openedx/frontend-base';
-
+import { Bubble } from '@openedx/paragon';
 import { useFilters } from '@src/data/filtersContext';


Nit: restore the blank lines between import groups (third-party, @src, local). The other files in this PR, including GradebookHeader/index.jsx, keep them.

jesusbalderramawgu · 2026-10-05T17:16:34Z

thank you @arbrandes, I brought back the courseId and followed your suggestion.

arbrandes

Ok, let's get this in! Thanks!

openedx-semantic-release-bot · 2026-10-06T13:13:15Z

🎉 This PR is included in version 2.0.0-alpha.7 🎉

The release is available on:

Your semantic-release bot 📦🚀

openedx-webhooks added the open-source-contribution PR author is not from Axim or 2U label Sep 28, 2026

openedx-webhooks added this to Contributions Sep 28, 2026

github-project-automation Bot moved this to Needs Triage in Contributions Sep 28, 2026

jesusbalderramawgu requested a review from arbrandes September 28, 2026 21:07

feat: small changes to improve UI

3afd942

jesusbalderramawgu force-pushed the improve-UI branch from e18f439 to 3afd942 Compare September 28, 2026 21:18

fix: changes back after rebase

a419bc9

arbrandes requested changes Sep 28, 2026

View reviewed changes

fix: tests fixed

4b01de5

jesusbalderramawgu added 2 commits September 28, 2026 15:54

fix: id messages and imports fixed

5d4b8ed

fix: results label back above the table

2ebe3c6

jesusbalderramawgu requested a review from arbrandes September 28, 2026 21:58

arbrandes requested changes Sep 29, 2026

View reviewed changes

Comment thread src/components/GradebookHeader/index.jsx Outdated

Comment thread src/components/GradesView/index.jsx Outdated

Comment thread src/components/GradesView/index.jsx

Comment thread src/components/GradesView/index.jsx Outdated

jesusbalderramawgu added 3 commits September 29, 2026 09:28

fix: small ui fixes

7c63082

refactor: course name added to view

1ba5da0

fix: test updated

347b586

jesusbalderramawgu requested a review from arbrandes September 29, 2026 21:07

mphilbrick211 added the mao-onboarding Reviewing this will help onboard devs from an Axim mission-aligned organization (MAO). label Sep 29, 2026

arbrandes requested changes Oct 5, 2026

View reviewed changes

fix: minor changes in UI

96158d6

jesusbalderramawgu requested a review from arbrandes October 5, 2026 17:16

arbrandes approved these changes Oct 6, 2026

View reviewed changes

arbrandes merged commit a9158aa into openedx:master Oct 6, 2026
6 checks passed

openedx-semantic-release-bot added the released on @latest label Oct 6, 2026

Conversation

jesusbalderramawgu commented Sep 28, 2026

Description

What does this PR do?

Screnshots

Before

After

Uh oh!

openedx-webhooks commented Sep 28, 2026

Uh oh!

jesusbalderramawgu commented Sep 28, 2026

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

codecov Bot commented Sep 28, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

jesusbalderramawgu commented Sep 28, 2026

Uh oh!

arbrandes left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

jesusbalderramawgu commented Sep 29, 2026

Uh oh!

arbrandes Oct 5, 2026

Choose a reason for hiding this comment

Uh oh!

arbrandes Oct 5, 2026

Choose a reason for hiding this comment

Uh oh!

arbrandes Oct 5, 2026

Choose a reason for hiding this comment

Uh oh!

jesusbalderramawgu commented Oct 5, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

arbrandes left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

openedx-semantic-release-bot commented Oct 6, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

codecov Bot commented Sep 28, 2026 •

edited

Loading

jesusbalderramawgu commented Oct 5, 2026 •

edited

Loading