Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Usability: Add filter modal for exercises #8858

Draft
wants to merge 97 commits into
base: develop
Choose a base branch
from

Conversation

florian-glombik
Copy link
Contributor

@florian-glombik florian-glombik commented Jun 23, 2024

Checklist

General

Client

  • Important: I implemented the changes with a very good performance, prevented too many (unnecessary) REST calls and made sure the UI is responsive, even with large data.
  • I strictly followed the client coding and design guidelines.
  • Following the theming guidelines, I specified colors only in the theming variable files and checked that the changes look consistent in both the light and the dark theme.
  • I added multiple integration tests (Jest) related to the features (with a high test coverage), while following the test guidelines.
  • I added authorities to all new routes and checked the course groups for displaying navigation elements (links, buttons).
  • I documented the TypeScript code using JSDoc style.
  • I added multiple screenshots/screencasts of my UI changes.
  • I translated all newly inserted strings into English and German.

Motivation and Context

Description

  • Added filter options for exercises:
    • exercise categories
    • exercise type
    • due date range
    • difficulty
    • achieved score
    • achievable points
  • The filters are considering general present values (e.g. if there was no Quiz exercise in a course, the exercise type quiz will not be an available filter option; the same applies to the general filter option - if there is only one exercise type in the course the filter option will not be displayed)
  • Introduced a shared component for the CustomExerciseCategoryBadgeComponent
  • Adjusted the usage of ExerciseCategory -> now really using the class object (and using equals and compare function) instead of actually having a string object in the background
  • Added a RangeSlider component as the ngBootstrap does not seem to offer such a functionality (https://getbootstrap.com/docs/5.0/forms/range/)

Steps for Testing

Prerequisites:

  • 1 Instructor
  • 2 Students
  • 1 Programming Exercise with Complaints enabled
  1. Log in to Artemis
  2. Navigate to Course Administration
  3. ...

Testserver States

Note

These badges show the state of the test servers.
Green = Currently available, Red = Currently locked
Click on the badges to get to the test servers.







Review Progress

Performance Review

  • I (as a reviewer) confirm that the client changes (in particular related to REST calls and UI responsiveness) are implemented with a very good performance

Code Review

  • Code Review 1
  • Code Review 2

Manual Tests

  • Test 1
  • Test 2

Test Coverage

Screenshots

@github-actions github-actions bot added the tests label Jun 23, 2024
return exercise
.categories!.flatMap((category: ExerciseCategory) => this.filterMap.get(category.category!)!)
.reduce((value1: boolean, value2: boolean) => value1 || value2);
return exercise.categories!.flatMap((category: ExerciseCategory) => this.filterMap.get(category.name!)!).reduce((value1: boolean, value2: boolean) => value1 || value2);
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

No change in logic, this line is now only wrapped because it is a few chars shorter after renaming

@florian-glombik florian-glombik force-pushed the feature/general/add-exercise-filter branch from de29694 to 0ec5246 Compare June 24, 2024 11:42
Comment on lines -370 to +373
exercise.categories = exercise.categories.map((category) => JSON.parse(category as string) as ExerciseCategory);
exercise.categories = exercise.categories.map((category) => {
const categoryObj = JSON.parse(category as unknown as string);
return new ExerciseCategory(categoryObj.color, categoryObj.category);
});
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We need to use a real object if we want to use the equals method

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
client Pull requests that update TypeScript code. (Added Automatically!) feature tests user interface
Projects
Status: Work In Progress
Development

Successfully merging this pull request may close these issues.

None yet

1 participant