Lectures: Replace guided mode with status bar edit and create view

[florian-glombik]

Checklist

General

• I tested all changes and their related features with all corresponding user types 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.

Client

• I strictly followed the client coding and design guidelines.
• I added multiple integration tests (Jest) related to the features (with a high test coverage), while following the test guidelines.
• I added multiple screenshots/screencasts of my UI changes.
• I translated all newly inserted strings into English and German.

Motivation and Context

We do currently have the guided mode for the creation of lectures, however, we consider the approach used for the creation of exercises (status bar that allows you to scroll to sections and displays the current state of these sections) as more user friendly than the current guided mode.

Description

• Introduce the status bar to the lecture create + edit view
• Remove the current guided mode
• Introduce signals and remove code smells
• Renamed previously named "wizard components" and replaced them in folder structure

Steps for Testing

Prerequisites:

• 1 Instructor

1. Create a new Lecture
2. Verify that no guided mode is offered anymore (no button in the upper right corner of the view)
3. Verify that the title and period section are offered
4. Fill out the sections and save the lecture
5. Verify that you are forwarded to the lecture edit page, but now attachments and units sections are available
6. Make changes to the attachments and units section
7. Verify that all changes have been saved
8. Verify that in edit mode the save button is enabled if there is a change made to title or period section (attachment / unit section changes are saved directly)

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

Code Review

• Code Review 1
• Code Review 2

Manual Tests

• Test 1
• Test 2

Test Coverage

Class/File	Line Coverage	Confirmation (assert/expect)
hasLectureUnsavedChanges.guard.ts	100%	✅
lecture-attachments.component.ts	97.2%	✅
lecture-unit-management.component.ts	89.47%	✅
lecture-update.component.ts	92.24%	✅
lecture.service.ts	97.08%	✅

Screenshots

new version (status bar instead of guided mode)

old version

Summary by CodeRabbit

Release Notes

• New Features

  • Introduced a streamlined lecture update process, enhancing form handling and state management.
  • Added new methods for ingesting lectures and retrieving ingestion states within the lecture service.
  • Updated localization files to improve user interface clarity and functionality for editing lectures.

• Bug Fixes

  • Improved error handling and robustness in various components, including lecture unit management and attachment handling.

• Refactor

  • Simplified component structures and removed unnecessary wizard mode logic for a more straightforward user experience.
  • Enhanced the Attachment class by removing an empty constructor to simplify the class definition.
  • Updated component properties and methods to utilize Angular's dependency injection more effectively.

• Chores

  • Removed deprecated components and associated tests to clean up the codebase.
  • Updated import paths and component references to reflect new directory structures.

[az108]

Code 👍

Change requests are addressed

[coderabbitai]

Actionable comments posted: 0

🧹 Nitpick comments (1)

src/test/javascript/spec/util/regex.util.spec.ts (1)

28-33: Validation of regex boundaries and anchors.
These scenarios confirm the function’s behavior with start and end anchors, vital for avoiding partial matches.

A possible extension might be to test empty strings or invalid regex patterns to confirm the function’s handling of edge cases.

📜 Review details

Configuration used: .coderabbit.yaml
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 3610375 and 8f58165.

📒 Files selected for processing (2)

• src/test/javascript/spec/component/shared/image-cropper/keyboard.util.spec.ts (1 hunks)
• src/test/javascript/spec/util/regex.util.spec.ts (1 hunks)

🧰 Additional context used

📓 Path-based instructions (2)

src/test/javascript/spec/util/regex.util.spec.ts (1)

Pattern src/test/javascript/spec/**/*.ts: jest: true; mock: NgMocks; bad_practices: avoid_full_module_import; perf_improvements: mock_irrelevant_deps; service_testing: mock_http_for_logic; no_schema: avoid_NO_ERRORS_SCHEMA; expectation_specificity: true; solutions: {boolean: toBeTrue/False, reference: toBe, existence: toBeNull/NotNull, undefined: toBeUndefined, class_obj: toContainEntries/toEqual, spy_calls: {not_called: not.toHaveBeenCalled, once: toHaveBeenCalledOnce, with_value: toHaveBeenCalledWith|toHaveBeenCalledExactlyOnceWith}}

src/test/javascript/spec/component/shared/image-cropper/keyboard.util.spec.ts (1)

Pattern src/test/javascript/spec/**/*.ts: jest: true; mock: NgMocks; bad_practices: avoid_full_module_import; perf_improvements: mock_irrelevant_deps; service_testing: mock_http_for_logic; no_schema: avoid_NO_ERRORS_SCHEMA; expectation_specificity: true; solutions: {boolean: toBeTrue/False, reference: toBe, existence: toBeNull/NotNull, undefined: toBeUndefined, class_obj: toContainEntries/toEqual, spy_calls: {not_called: not.toHaveBeenCalled, once: toHaveBeenCalledOnce, with_value: toHaveBeenCalledWith|toHaveBeenCalledExactlyOnceWith}}

🔇 Additional comments (12)

src/test/javascript/spec/component/shared/image-cropper/keyboard.util.spec.ts (4)

1-2: Great job keeping the imports minimal.

Since this file focuses on testing utility functions, importing only the needed methods keeps it clean and aligned with the guidance to avoid full-module imports.

---

4-24: Tests for getPositionForKey are comprehensive and consistent.

All arrow keys and the default key are tested individually, and the usage of “.toBe” for string comparisons is clear and correct. This ensures maximum coverage and specificity in each scenario.

---

26-46: Inverted position checks are correctly validated.

Similar to the first suite, you’ve tested each arrow key thoroughly, with proper default handling. The test naming is clear and matches the method’s intent.

---

48-70: Robust coverage for getEventForKey.

The tests handle all arrow keys plus an unknown key with correct clientX/clientY expectations. Using “.toEqual” for object comparisons is appropriate. The stepSize parameter further clarifies the function’s behavior for typical keyboard events.

src/test/javascript/spec/util/regex.util.spec.ts (8)

1-2: Import statement is concise and appropriate.
The import aligns with the test usage, and the function under test is correctly referenced.

---

3-3: Descriptive test suite name.
Using a suite name that matches the function helps keep tests organized and clear.

---

4-6: Comprehensive edge case test.
Testing behavior when the regex is undefined ensures robust handling of optional or missing parameters.

---

8-10: Good negative test scenario.
Validates behavior when the input string is undefined, covering potential null-like inputs.

---

12-14: Complete match scenario well-tested.
Ensures the function behaves correctly when there's an exact match, confirming no partial or extra characters are accepted.

---

16-18: Verifies partial match handling.
Appropriately confirms a false return on partial matches, preventing false positives.

---

20-22: Test for special characters is important.
Ensures that regex operators work as intended in real-world usage.

---

24-26: Confirmation of zero-match logic.
Helpful to confirm that a completely disjoint pattern appropriately returns false.