Skip to content

Conversation

@Qilin127
Copy link

Fixes #12653

Outline of Solution
This pull request addresses the issue where mandatory fields in the "Copy Course" modal were not highlighted, and no clear message was shown when they were left empty.

The following changes have been implemented:

  • Added inline validation for the "Course ID" and "Course Name" fields.
  • If a user tries to proceed without filling in these fields, a descriptive error message ("The field '...' should not be empty.") now appears directly below the respective input box.
  • The error message text is colored red to visually indicate an error, consistent with the rest of the application's UI for validation.

UI:
Before (empty fields, no validation shown):
image

**After (validation messages shown for empty fields):**After (validation messages shown for empty fields):
image

- Added validation to the Course ID and Course Name input fields to ensure they are not empty.
- The error message is styled in red to match the application's design for invalid fields.
- Removed the toast message that was previously shown for empty fields, as the new inline validation provides better user experience.
feat(course): Highlight mandatory fields in copy course modal
@haonn12
Copy link

haonn12 commented Oct 24, 2025

Great improvement! 👍
The inline validation makes the "Copy Course" modal much clearer and more user-friendly.
I especially like how the error messages are placed directly below the fields — this is consistent with good UX practices.

Minor suggestions:

Consider verifying that the error messages also disappear immediately once the user fills in the required fields.

It might also be good to confirm that the validation text color matches the existing style variables (e.g., using the app’s defined error color instead of hardcoded red).

Overall, this is a solid and meaningful enhancement to the user experience. ✅

@Pan-zhong
Copy link

Great job on improving the Copy Course Modal!
The required-field validation now works smoothly and matches the Create Course form behavior.
UI feedback looks consistent and clear.
Just make sure the CSS class names stay aligned with the existing style conventions before final merge.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Copy course modal: Mandatory fields not highlighted

3 participants