fix: correct rotation handle positioning during vertex rotation #592

HalilFocic · 2024-11-30T13:29:17Z

PR Checklist

Addresses an existing open issue: fixes [BUG] VertexHandler.currentAlpha is not calculated correctly #590 and [BUG] In Handles and Stencils stories, the rotation handle is always located on the right of the vertex #482
You have discussed this issue with the maintainers of maxGraph, and you are assigned to the issue.
The scope of the PR is sufficiently narrow to be examined in a single session. A PR covering several issues must be split into separate PRs. Do not create a large PR, otherwise it cannot be reviewed and you will be asked to split it later or the PR will be closed.
I have added tests to prove my fix is effective or my feature works. This can be done in the form of automatic tests in packages/core/_tests_ or a new or altered Storybook story in packages/html/stories (an existing story may also demonstrate the change).
I have provided screenshot/videos to demonstrate the change. If no releavant, explain why.
~~I have added or edited necessary documentation,~~ or no docs changes are needed.
The PR title follows the "Conventional Commits" guidelines.

Overview

After initial PR and suggestion to try to get the behaviour like mxGraph did I figured out the problem. Issue was:

Incorrect value of currentAlpha on initialization ( was 100 instead of null)
No call to set currentAlpha to null inside reset function
Using currentAlpha directly inside redrawHandles function without checking if it is not null.

Notes

I will close previous PR since this code better resembles mxGraph initial functionality.
Videos were not provided since functionality is the same as previous PR, not point in recording again. If needed, I can provide videos.

Closes #482
Closes #590

Screenshots

Both stencils and handles stories now properly work while rotating:

handles.mov

stencils.mov

Summary by CodeRabbit

New Features
- Enhanced management of the currentAlpha property, allowing it to represent an uninitialized state.
Bug Fixes
- Improved handling of currentAlpha to ensure calculations accommodate potential null values, enhancing robustness.

…redrawHandles

coderabbitai · 2024-11-30T13:29:25Z

Walkthrough

The changes in this pull request modify the currentAlpha property in the VertexHandler class from a number with a default value of 100 to a type that can be either null or a number, initializing it to null. This adjustment allows for a more flexible representation of the currentAlpha state, which is reflected in updates to the constructor and methods that utilize this property, particularly in the redrawHandles method.

Changes

File Path	Change Summary
`packages/core/src/view/handler/VertexHandler.ts`	Updated `currentAlpha` property type from `number` with default `100` to `null

Assessment against linked issues

Objective	Addressed	Explanation
Fix calculation of `currentAlpha` in `VertexHandler` (#590)	✅
Ensure rotation handle updates correctly in Handles and Stencils stories (#482)	❓	The changes may address the issue, but it's unclear if all scenarios are covered.

Possibly related PRs

fix(VertexHandle): add missing setPosition call in processEvent #583: The changes in the VertexHandle class's processEvent method may relate to the VertexHandler class's handling of vertex positions and interactions, particularly since both classes are involved in managing vertex-related functionalities.

📜 Recent review details

Configuration used: CodeRabbit UI
Review profile: CHILL

📥 Commits

Reviewing files that changed from the base of the PR and between 7e708fd and 5bb3460.

📒 Files selected for processing (1)

packages/core/src/view/handler/VertexHandler.ts (3 hunks)

🚧 Files skipped from review as they are similar to previous changes (1)

packages/core/src/view/handler/VertexHandler.ts

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>, please review it.
- 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 gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
- @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.
- @coderabbitai help me debug CodeRabbit configuration file.

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 using PR comments)

@coderabbitai pause to pause the reviews on a PR.
@coderabbitai resume to resume the paused reviews.
@coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
@coderabbitai full review to do a full review from scratch and review all the files again.
@coderabbitai summary to regenerate the summary of the PR.
@coderabbitai resolve resolve all the CodeRabbit review comments.
@coderabbitai configuration to show the current CodeRabbit configuration for the repository.
@coderabbitai help to get help.

Other keywords and placeholders

Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration 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/schema.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.

tbouffard

LGTM, good job !

tbouffard · 2024-12-09T09:49:33Z

packages/core/src/view/handler/VertexHandler.ts

+      const alpha = toRadians(
+        this.currentAlpha !== null ? this.currentAlpha : this.state.style.rotation || 0
+      );


suggestion: We could use the nullish coalescing operator (??) to provide a more concise and readable way to handle null and undefined values as suggested in #590

const alpha = toRadians(this.currentAlpha ?? (this.state.style.rotation ?? 0));

tbouffard · 2024-12-09T09:53:11Z

packages/core/src/view/handler/VertexHandler.ts

    }

    this.index = null;
+    this.currentAlpha = null;


praise: Nice, mimic https://github.com/jgraph/mxgraph/blob/v4.2.2/javascript/src/js/handler/mxVertexHandler.js#L1445

fix(vertex-handler): corrected currentAlpha logic in constructor and …

7e708fd

…redrawHandles

HalilFocic changed the title ~~fix(vertex-handler): corrected currentAlpha logic in constructor and …~~ fix: corrected currentAlpha logic in constructor and … Nov 30, 2024

HalilFocic mentioned this pull request Nov 30, 2024

fix: correct rotation handle positioning during vertex rotation #581

Closed

7 tasks

tbouffard changed the title ~~fix: corrected currentAlpha logic in constructor and …~~ fix: correct rotation handle positioning during vertex rotation Dec 9, 2024

tbouffard added the bug Something isn't working label Dec 9, 2024

simplify syntax

5bb3460

tbouffard approved these changes Dec 9, 2024

View reviewed changes

tbouffard merged commit 1c11620 into maxGraph:main Dec 10, 2024
6 checks passed

tbouffard mentioned this pull request Dec 10, 2025

fix(VertexHandler): fix top-left resize handle behavior #968

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

fix: correct rotation handle positioning during vertex rotation #592

fix: correct rotation handle positioning during vertex rotation #592

Uh oh!

HalilFocic commented Nov 30, 2024 •

edited by coderabbitai bot

Loading

Uh oh!

coderabbitai bot commented Nov 30, 2024 •

edited

Loading

Chat

CodeRabbit Commands (Invoked using PR comments)

Other keywords and placeholders

CodeRabbit Configuration File (`.coderabbit.yaml`)

Documentation and Community

Uh oh!

tbouffard left a comment

Uh oh!

tbouffard Dec 9, 2024

Uh oh!

tbouffard Dec 9, 2024

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

fix: correct rotation handle positioning during vertex rotation #592

fix: correct rotation handle positioning during vertex rotation #592

Uh oh!

Conversation

HalilFocic commented Nov 30, 2024 • edited by coderabbitai bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

PR Checklist

Overview

Notes

Screenshots

Summary by CodeRabbit

Summary by CodeRabbit

Uh oh!

coderabbitai bot commented Nov 30, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Assessment against linked issues

Possibly related PRs

Chat

CodeRabbit Commands (Invoked using PR comments)

Other keywords and placeholders

CodeRabbit Configuration File (.coderabbit.yaml)

Documentation and Community

Uh oh!

tbouffard left a comment

Choose a reason for hiding this comment

Uh oh!

tbouffard Dec 9, 2024

Choose a reason for hiding this comment

Uh oh!

tbouffard Dec 9, 2024

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

HalilFocic commented Nov 30, 2024 •

edited by coderabbitai bot

Loading

coderabbitai bot commented Nov 30, 2024 •

edited

Loading

CodeRabbit Configuration File (`.coderabbit.yaml`)