`Adaptive learning`: Refactor competencies instructor page

[JohannesWt]

Checklist

General

• [ ] I tested all changes and their related features with all corresponding user types on a test server.
• [ ] This is a small issue that I tested locally and was confirmed by another developer on a test server.
• [ ] Language: I followed the guidelines for inclusive, diversity-sensitive, and appreciative language.
• [ ] I chose a title conforming to the naming conventions for pull requests.

Server

• [ ] Important: I implemented the changes with a very good performance and prevented too many (unnecessary) and too complex database calls.
• [ ] I strictly followed the principle of data economy for all database calls.
• [ ] I strictly followed the server coding and design guidelines.
• [ ] I added multiple integration tests (Spring) related to the features (with a high test coverage).
• [ ] I added pre-authorization annotations according to the guidelines and checked the course groups for all new REST Calls (security).
• [ ] I documented the Java code using JavaDoc style.

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 (e.g. using paging).
• [ ] I strictly followed the principle of data economy for all client-server REST calls.
• [ ] 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.

Changes affecting Programming Exercises

• [ ] High priority: I tested all changes and their related features with all corresponding user types on a test server configured with the integrated lifecycle setup (LocalVC and LocalCI).
• [ ] I tested all changes and their related features with all corresponding user types on a test server configured with Gitlab and Jenkins.

Motivation and Context

Description

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. ...

Exam Mode Testing

Prerequisites:

• 1 Instructor
• 2 Students
• 1 Exam with a Programming Exercise

1. Log in to Artemis
2. Participate in the exam as a student
3. Make sure that the UI of the programming exercise in the exam mode stays unchanged. You can use the exam mode documentation as reference.
4. ...

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 even for very large courses with more than 2000 students.
• [ ] I (as a reviewer) confirm that the server changes (in particular related to database calls) are implemented with a very good performance even for very large courses with more than 2000 students.

Code Review

• [ ] Code Review 1
• [ ] Code Review 2

Manual Tests

• [ ] Test 1
• [ ] Test 2

Exam Mode Test

• [ ] Test 1
• [ ] Test 2

Performance Tests

• [ ] Test 1
• [ ] Test 2

Test Coverage

Client

Class/File	Line Coverage	Confirmation (assert/expect)
course-competencies-management-table.component.ts	100%	✅
course-competencies-relation-graph.component.ts	100%	✅
course-competencies-relation-modal.component.ts	96.96%	✅ ❌
course-competency-relation-node.component.ts	100%	✅
course-competency-relation-form.component.ts	83.33%	✅ ❌
course-competencies-instructor-page.component.ts	100%	✅
course-competency-api.service.ts	100%	✅
base-api-http.service.ts	90.47%	✅ ❌
course-management.route.ts	not found (modified)	❌

Screenshots