`Modeling exercises`: Improve synchronization of team-based exercises #8078

loreanvictor · 2024-02-26T07:39:49Z

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.

Server

Important: I implemented the changes with a very good performance and prevented too many (unnecessary) database calls.
I strictly followed the server coding and design guidelines.
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.
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 documented the TypeScript code using JSDoc style.
I added multiple screenshots/screencasts of my UI changes.

Motivation and Context

In team-based modelling exercises, when multiple team members are working on the same UML diagram, the diagram is synchronised naively: peers exchange their local diagrams wholesale and one diagram wins, overriding all unsynced changes by other peers.

Description

This PR solves the aforementioned issue by using Apollon's patch-based realtime collaboration mechanism, where peers exchanges patches reflecting their recent local changes instead of whole diagrams, and reaching an eventually consistent state by applying said patches to their local state. All patches are in the standard JSONPatch format.

The server doesn't partake in the conflict resolution process except for determining the definite timeline of patches by re-emitting them to all clients, keeping the server code simple and straight-forward.

Patch-based communication also allows for continuous synchronisation between clients e.g. during movement of an element. While exchanging diagrams wholesale, continuous sync would effectively only allow one peer to modify the diagram, while with patch-based sync peers can simultaneously work on different parts of the diagram while seeing the work of their peers update in realtime.

The process for "saving" submissions in a team-based exercise remains unchanged: the clients check for changes on a routine interval and ask the server to save the whole diagram. The only change in this regard is that the server DOES NOT sync the diagram between team-members upon saving, to avoid resetting local work of each member (syncing is done via patches). This keeps the server-side logic simple as the server does not need to parse submissions and patch models (which also would require some debouncing mechanism on the server side).

Steps for Testing

Prerequisites:

2+ Students
1 Team-based modelling exercise
1+ Teams on said exercise
All students should be part of a team

Log in to Artemis as one of the students
Open the exercise > modeling editor
You should be able to make changes and the diagram state is saved
On another client (another system, browser, etc), log in as another student who is part of the same team
Open the exercise > modeling editor
Both students should see changes made by each other in realtime
Both students should be able to change different parts of the diagram without overriding each other's changes

Testserver States

Note

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

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
I (as a reviewer) confirm that the server changes (in particular related to database calls) are implemented with a very good performance

Code Review

Code Review 1
Code Review 2

Manual Tests

Test 1
Test 2

Test Coverage

Client

Class/File	Line Coverage	Confirmation (assert/expect)
modeling-submission-patch.model.ts	100%	✅
submission-patch-payload.model.ts	100%	✅
submission-patch.model.ts	100%	✅
submission-sync-payload.model.ts	100%	✅
modeling-submission.component.ts	87.34%	✅ ❌
modeling-editor.component.ts	78.64%	✅ ❌
team-submission-sync.component.ts	90%	✅ ❌

Server

Class/File	Line Coverage	Confirmation (assert/expect)
SubmissionPatch.java	100%	✅
ModelingSubmissionPatch.java	100%	✅
SubmissionPatchPayload.java	100%	✅
ParticipationTeamWebsocketService.java	87%	✅ ❌

Screenshots

Summary by CodeRabbit

New Features
- Introduced collaborative submission patching for modeling exercises, enhancing real-time collaboration.
- Added support for JSON patch format in submissions, allowing dynamic updates.
Enhancements
- Improved synchronization of submission patches between team members.
- Enhanced the modeling submission component with event bindings for patch handling.
Bug Fixes
- Fixed issues related to submission patching and synchronization.
Documentation
- Updated documentation to reflect new collaborative submission features.
Tests
- Added comprehensive tests for new submission patching functionality.
Chores
- Updated project dependencies to include zjsonpatch for JSON patch operations.

…oration

github-actions · 2024-03-04T12:08:45Z

There hasn't been any activity on this pull request recently. Therefore, this pull request has been automatically marked as stale and will be closed if no further activity occurs within seven days. Thank you for your contributions.

…cises

coderabbitai · 2024-03-11T09:21:04Z

Walkthrough

This update introduces enhancements and reformatting across multiple components of a Spring Boot project, focusing on collaborative editing features for modeling submissions. Notably, it adds support for JSON Patch operations, enabling real-time updates and synchronization between team members' submissions. The changes span from backend Java classes, including new DTOs for submission patches, to frontend Angular components, improving the user experience in collaborative exercises. Additionally, some configuration files and dependencies have been updated to support these new features.

Changes

Files	Summary
`.idea/runConfigurations/Artemis__BuildAgent_.xml` `.idea/runConfigurations/Artemis__Server_.xml`	Reformatted XML configuration without altering settings.
`.idea/runConfigurations/Artemis__Server__LocalVC___LocalCI_.xml`	Added `ALTERNATIVE_JRE_PATH_ENABLED` option.
`build.gradle` `gradle.properties`	Added `zjsonpatch` dependency for JSON patch operations.
`src/main/java/.../domain/SubmissionPatch.java` `src/main/java/.../domain/modeling/ModelingSubmissionPatch.java` `src/main/java/.../web/websocket/dto/SubmissionPatchPayload.java` `src/main/java/.../repository/StudentParticipationRepository.java` `src/main/webapp/app/entities/...` `src/main/webapp/app/exercises/modeling/participate/...` `src/main/webapp/app/exercises/shared/team-submission-sync/team-submission-sync.component.ts` `src/test/...`	Introduced and enhanced support for modeling submission patches, including DTOs, repository methods, WebSocket communication, and Angular components for real-time collaboration.
`src/main/java/.../web/websocket/team/ParticipationTeamWebsocketService.java`	Added methods to patch modeling submissions, enhancing collaboration.

Possibly related issues

ls1intum/Artemis#7880: The enhancements in real-time collaboration and submission patching could indirectly improve the consistency and reliability of template submissions and their statuses, addressing the issue's objectives related to the display of template submission status in programming exercises.

Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?

Share

Tips

Chat

There are 3 ways to chat with CodeRabbit:

Review comments: Directly reply to a review comment made by CodeRabbit. Example:
- I pushed a fix in commit <commit_id>.
- Generate unit testing code for this file.
- Open a follow-up GitHub issue for this discussion.
Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
- @coderabbitai generate unit testing code for this file.
- @coderabbitai modularize this function.
PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
- @coderabbitai generate interesting stats about this repository and render them as a table.
- @coderabbitai show all the console.log statements in this repository.
- @coderabbitai read src/utils.ts and generate unit testing code.
- @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (invoked as PR comments)

@coderabbitai pause to pause the reviews on a PR.
@coderabbitai resume to resume the paused reviews.
@coderabbitai review to trigger a review. This is useful when automatic reviews are disabled for the repository.
@coderabbitai resolve resolve all the CodeRabbit review comments.
@coderabbitai help to get help.

Additionally, you can add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.

CodeRabbit Configration File (`.coderabbit.yaml`)

You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
Please see the configuration documentation for more information.
If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/coderabbit-overrides.v2.json

Documentation and Community

Visit our Documentation for detailed information on how to use CodeRabbit.
Join our Discord Community to get help, request features, and share feedback.
Follow us on X/Twitter for updates and announcements.

…cises

src/main/java/de/tum/in/www1/artemis/web/websocket/team/ParticipationTeamWebsocketService.java

src/main/webapp/app/entities/submission-patch.model.ts

src/main/java/de/tum/in/www1/artemis/domain/SubmissionPatch.java

src/main/webapp/app/exercises/shared/team-submission-sync/team-submission-sync.component.ts

…cises

basak-akan

Thank you for the explanation it is now more clear to me how Apollon works.
Re-tested on TS2 and worked well 👍

…cises

basak-akan

Re-tested on TS2 worked well, thanks for the fix. Code lgtm

milljoniaer

Thanks, looks good, I just added two minor code style suggestions

milljoniaer · 2024-03-27T10:36:48Z

src/main/webapp/app/entities/submission-patch-payload.model.ts

+ * @param arg
+ */
+export function isSubmissionPatchPayload(arg: any): arg is SubmissionPatchPayload {
+    return arg.submissionPatch !== undefined && arg.sender !== undefined;


Suggested change

return arg.submissionPatch !== undefined && arg.sender !== undefined;

return Boolean(arg.submissionPatch && arg.sender);

milljoniaer · 2024-03-27T10:37:15Z

src/main/webapp/app/entities/submission-sync-payload.model.ts

@@ -5,3 +5,7 @@ export class SubmissionSyncPayload {
    public submission: Submission;
    public sender: User;
 }
+
+export function isSubmissionSyncPayload(arg: any): arg is SubmissionSyncPayload {
+    return arg.submission !== undefined && arg.sender !== undefined;


Suggested change

return arg.submission !== undefined && arg.sender !== undefined;

return Boolean(arg.submission && arg.sender);

milljoniaer · 2024-03-27T10:37:35Z

src/main/webapp/app/exercises/modeling/participate/modeling-submission.component.ts

@@ -97,10 +98,11 @@ export class ModelingSubmissionComponent implements OnInit, OnDestroy, Component
    examMode = false;

    // submission sync with team members
-    teamSyncInterval: number;


…cises

basak-akan

Re-approve

sync team-based modeling exercises using apollon's patch-based collab…

94fbae3

…oration

artemis-bot added this to In progress in Artemis Development Feb 26, 2024

github-actions bot added the server Pull requests that update Java code. (Added Automatically!) label Feb 26, 2024

github-actions bot assigned loreanvictor Feb 26, 2024

github-actions bot added the client Pull requests that update TypeScript code. (Added Automatically!) label Feb 26, 2024

loreanvictor changed the title ~~Modeling exercisesLsync team-based modeling exercises using apollon's patch-based collaboration~~ Modeling exercises: sync team-based modeling exercises using apollon's patch-based collaboration Feb 26, 2024

github-actions bot added the stale label Mar 4, 2024

loreanvictor added 3 commits March 9, 2024 15:14

add persistence through the previous syncing mechanism

08acad7

merge with develop

9f82857

add tests

fb3412e

github-actions bot added the tests label Mar 11, 2024

Merge branch 'develop' into feature/patch-syncing-team-modelling-exer…

e2e3bb5

…cises

loreanvictor removed the stale label Mar 11, 2024

loreanvictor marked this pull request as ready for review March 11, 2024 09:20

loreanvictor requested a review from a team as a code owner March 11, 2024 09:20

artemis-bot moved this from In progress to Ready for review in Artemis Development Mar 11, 2024

loreanvictor added the ready for review label Mar 11, 2024

Merge branch 'develop' into feature/patch-syncing-team-modelling-exer…

dec071a

…cises

coderabbitai bot requested changes Mar 11, 2024

View reviewed changes

Artemis Development automation moved this from Ready for review to Review in progress Mar 11, 2024

loreanvictor added 4 commits March 14, 2024 18:24

Merge branch 'develop' into feature/patch-syncing-team-modelling-exer…

4435893

…cises

sync run conf with develop

7e0b622

add more documentation, fix issues mentioned by code rabbit

2dee861

increase websocket service coverage

a1a2881

loreanvictor added the deploy:artemis-test6 label Mar 15, 2024

loreanvictor temporarily deployed to artemis-test6.artemis.cit.tum.de March 15, 2024 15:50 — with GitHub Actions Inactive

github-actions bot added lock:artemis-test6 and removed deploy:artemis-test6 labels Mar 15, 2024

basak-akan previously approved these changes Mar 24, 2024

View reviewed changes

update apollon to 3.3.9

be48a50

loreanvictor dismissed basak-akan’s stale review via be48a50 March 24, 2024 15:45

loreanvictor requested review from basak-akan, MaximilianAnzinger and matthiaslehnertum March 24, 2024 15:49

matthiaslehnertum previously approved these changes Mar 24, 2024

View reviewed changes

Merge branch 'develop' into feature/patch-syncing-team-modelling-exer…

d266276

…cises

basak-akan added the deploy:artemis-test2 label Mar 26, 2024

basak-akan temporarily deployed to artemis-test2.artemis.cit.tum.de March 26, 2024 20:12 — with GitHub Actions Inactive

github-actions bot added lock:artemis-test2 and removed deploy:artemis-test2 labels Mar 26, 2024

basak-akan previously approved these changes Mar 26, 2024

View reviewed changes

basak-akan removed the lock:artemis-test2 label Mar 26, 2024

milljoniaer previously approved these changes Mar 27, 2024

View reviewed changes

Merge branch 'develop' into feature/patch-syncing-team-modelling-exer…

867ed7d

…cises

loreanvictor dismissed stale reviews from milljoniaer, basak-akan, and matthiaslehnertum via 867ed7d March 30, 2024 11:00

krusche added this to the 7.0.0 milestone Apr 3, 2024

loreanvictor requested review from matthiaslehnertum, milljoniaer and basak-akan April 4, 2024 10:41

Merge branch 'develop' into feature/patch-syncing-team-modelling-exer…

44cd99f

…cises

matthiaslehnertum approved these changes Apr 4, 2024

View reviewed changes

milljoniaer approved these changes Apr 4, 2024

View reviewed changes

basak-akan approved these changes Apr 4, 2024

View reviewed changes

MaximilianAnzinger approved these changes Apr 4, 2024

View reviewed changes

krusche merged commit a9a196a into develop Apr 5, 2024
20 of 29 checks passed

krusche deleted the feature/patch-syncing-team-modelling-exercises branch April 5, 2024 20:29

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

`Modeling exercises`: Improve synchronization of team-based exercises #8078

`Modeling exercises`: Improve synchronization of team-based exercises #8078

loreanvictor commented Feb 26, 2024 •

edited

github-actions bot commented Mar 4, 2024

coderabbitai bot commented Mar 11, 2024 •

edited

Chat

CodeRabbit Commands (invoked as PR comments)

CodeRabbit Configration File (`.coderabbit.yaml`)

Documentation and Community

basak-akan left a comment

basak-akan left a comment

milljoniaer left a comment

milljoniaer Mar 27, 2024

milljoniaer Mar 27, 2024

milljoniaer Mar 27, 2024

basak-akan left a comment

	return arg.submissionPatch !== undefined && arg.sender !== undefined;
	return Boolean(arg.submissionPatch && arg.sender);

	return arg.submission !== undefined && arg.sender !== undefined;
	return Boolean(arg.submission && arg.sender);

Modeling exercises: Improve synchronization of team-based exercises #8078

Modeling exercises: Improve synchronization of team-based exercises #8078

Conversation

loreanvictor commented Feb 26, 2024 • edited

Checklist

General

Server

Client

Motivation and Context

Description

Steps for Testing

Testserver States

Review Progress

Performance Review

Code Review

Manual Tests

Test Coverage

Client

Server

Screenshots

Summary by CodeRabbit

github-actions bot commented Mar 4, 2024

coderabbitai bot commented Mar 11, 2024 • edited

Walkthrough

Changes

Possibly related issues

Chat

CodeRabbit Commands (invoked as PR comments)

CodeRabbit Configration File (.coderabbit.yaml)

Documentation and Community

basak-akan left a comment

Choose a reason for hiding this comment

basak-akan left a comment

Choose a reason for hiding this comment

milljoniaer left a comment

Choose a reason for hiding this comment

milljoniaer Mar 27, 2024

Choose a reason for hiding this comment

milljoniaer Mar 27, 2024

Choose a reason for hiding this comment

milljoniaer Mar 27, 2024

Choose a reason for hiding this comment

basak-akan left a comment

Choose a reason for hiding this comment

`Modeling exercises`: Improve synchronization of team-based exercises #8078

`Modeling exercises`: Improve synchronization of team-based exercises #8078

loreanvictor commented Feb 26, 2024 •

edited

coderabbitai bot commented Mar 11, 2024 •

edited

CodeRabbit Configration File (`.coderabbit.yaml`)