Skip to content

Conversation

@tbouffard
Copy link
Member

@tbouffard tbouffard commented Feb 8, 2025

BREAKING CHANGES: Some utility functions formerly used to retrieve default value of CellStateStyle and CellStyle properties,
mainly intended to only be used internally, have been removed.
Use the nullish coalescing operator (??) and the optional chaining (?.) instead.
Removed functions:

  • utils.getValue
  • stringUtils.getColor
  • stringUtils.getNumber
  • stringUtils.getStringValue

Notes

No real impact on the size of applications

  • ts-example: 445.20 kB to 444.85 kB
  • ts-example no default: 441.17 kB to 440.82 kB

Summary by CodeRabbit

  • Documentation
    • Updated migration guide to assist users transitioning from mxGraph to maxGraph, featuring improved setup instructions, API renaming, and removal of outdated browser support.
  • Style
    • Revised default shadow color for a more modern, consistent appearance.
  • Refactor
    • Streamlined handling of style properties and default configurations, enhancing overall consistency and reliability.
  • Chores
    • Minor build configuration tweaks to optimize bundling warnings and performance.
  • Breaking Changes
    • Removed several internal utility functions; users are advised to use nullish coalescing and optional chaining for default value handling.

BREAKING CHANGES: Some utility functions formerly used to retrieve default value of `CellStateStyle` and `CellStyle` properties,
mainly intended to only be used internally, have been removed.
Use the nullish coalescing operator (??) and the optional chaining (?.) instead.
Removed functions:
  - `utils.getValue`
  - `stringUtils.getColor`
  - `stringUtils.getNumber`
  - `stringUtils.getStringValue`
@tbouffard tbouffard added the refactor Code refactoring label Feb 8, 2025
@coderabbitai
Copy link

coderabbitai bot commented Feb 8, 2025

Warning

Rate limit exceeded

@tbouffard has exceeded the limit for the number of commits or files that can be reviewed per hour. Please wait 0 minutes and 53 seconds before requesting another review.

⌛ How to resolve this issue?

After the wait time has elapsed, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout.

Please see our FAQ for further information.

📥 Commits

Reviewing files that changed from the base of the PR and between c4099ab and 68ab06d.

📒 Files selected for processing (3)
  • CHANGELOG.md (1 hunks)
  • packages/core/src/util/StringUtils.ts (1 hunks)
  • packages/html/stories/Handles.stories.ts (4 hunks)

Walkthrough

The changes remove several legacy utility functions used for default value retrieval and update various modules to utilize optional chaining and nullish coalescing. A new test suite for cell foldability has been added, and several documentation comments and type annotations have been updated. Build configuration thresholds have been slightly adjusted. Additionally, the migration guide has been revised to reflect breaking changes such as renamed classes, methods, and API signatures.

Changes

File(s) Change Summary
CHANGELOG.md
packages/core/src/util/StringUtils.ts
packages/core/src/util/Utils.ts
packages/core/src/util/mathUtils.ts
Removed utility functions (getValue, getStringValue, getNumber, getColor) and updated property accesses to use optional chaining (?.) and nullish coalescing (??); documented as breaking changes in the changelog.
packages/core/tests/view/mixins/FoldingMixin.test.ts Added a new test suite for the isCellFoldable function with multiple test cases for different cell conditions.
packages/core/src/types.ts
packages/core/src/view/cell/Cell.ts
packages/website/docs/usage/migrate-from-mxgraph.md
Updated documentation comments for properties and methods; revised migration documentation with renamed classes and updated API signatures.
packages/core/src/view/geometry/edge/ArrowConnectorShape.ts
packages/core/src/view/geometry/node/StencilShape.ts
packages/core/src/view/handler/CellEditorHandler.ts
packages/core/src/view/layout/StackLayout.ts
packages/core/src/view/mixins/FoldingMixin.ts
packages/core/src/view/style/EdgeStyle.ts
packages/core/src/view/style/edge/Loop.ts
packages/html/stories/FixedIcons.stories.js
packages/html/stories/Handles.stories.ts
Simplified assignments and property accesses by replacing utility function calls with direct optional chaining and nullish coalescing; adjusted parameter naming and inline documentation for clarity.
packages/ts-example-without-defaults/vite.config.js
packages/ts-example/vite.config.js
Decreased the chunkSizeWarningLimit values in the build configuration.

Sequence Diagram(s)

sequenceDiagram
    participant TestSuite as Test Suite
    participant FoldingMixin
    participant Cell
    TestSuite->>FoldingMixin: call isCellFoldable(Cell, _collapse?)
    FoldingMixin->>Cell: getCurrentCellStyle()
    Cell-->>FoldingMixin: return cell style (including foldable flag)
    FoldingMixin-->>TestSuite: return foldability result
Loading

Possibly related PRs

  • refactor: improve StencilShapeRegistry method signatures #660: The changes in the main PR, which involve the removal of utility functions for retrieving default values, are related to the retrieved PR as both involve modifications to how values are accessed and handled in the code, particularly in relation to the getValue function.
  • refactor: simplify the reset config functions #582: The changes in the main PR, which involve the removal of utility functions for retrieving default values, are related to the retrieved PR as both involve modifications to how default values are handled in the code, specifically replacing utility function calls with direct property access.
  • refactor!: mark isNullish and isNotNullish as private #661: The changes in the main PR are directly related to the modifications made to the utils.isNullish and utils.isNotNullish functions, as both PRs involve marking these functions as private and correcting their visibility status.

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 generate docstrings to generate docstrings for this PR. (Beta)
  • @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.

Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 0

🧹 Nitpick comments (3)
packages/core/__tests__/view/mixins/FoldingMixin.test.ts (2)

21-21: Consider renaming the parameter for clarity.

The constant ignoredFoldableParameter could be renamed to better reflect its purpose in the test cases.

-const ignoredFoldableParameter = false;
+const collapseFoldableParameter = false;  // Parameter for isCellFoldable's collapse argument

29-60: Test suite provides good coverage but could be enhanced.

The test suite covers essential scenarios but could benefit from additional edge cases.

Consider adding these test cases:

test('Using Cell with undefined style', () => {
  expect(
    createGraphWithoutPlugins().isCellFoldable(
      createCellWithChildren(undefined),
      ignoredFoldableParameter
    )
  ).toBeTruthy();
});

test('Using Cell with null style', () => {
  expect(
    createGraphWithoutPlugins().isCellFoldable(
      createCellWithChildren(null),
      ignoredFoldableParameter
    )
  ).toBeTruthy();
});
packages/html/stories/FixedIcons.stories.js (1)

65-65: Consider using a constant for the shadow color.

The hardcoded color value could be moved to a constants file for better maintainability.

-StyleDefaultsConfig.shadowColor = '#C0C0C0';
+StyleDefaultsConfig.shadowColor = STYLE_CONSTANTS.SHADOW_COLOR;
📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 22d8a34 and 3c98c30.

📒 Files selected for processing (19)
  • CHANGELOG.md (1 hunks)
  • packages/core/__tests__/view/mixins/FoldingMixin.test.ts (1 hunks)
  • packages/core/src/types.ts (1 hunks)
  • packages/core/src/util/StringUtils.ts (0 hunks)
  • packages/core/src/util/Utils.ts (1 hunks)
  • packages/core/src/util/mathUtils.ts (5 hunks)
  • packages/core/src/view/cell/Cell.ts (1 hunks)
  • packages/core/src/view/geometry/edge/ArrowConnectorShape.ts (1 hunks)
  • packages/core/src/view/geometry/node/StencilShape.ts (3 hunks)
  • packages/core/src/view/handler/CellEditorHandler.ts (4 hunks)
  • packages/core/src/view/layout/StackLayout.ts (2 hunks)
  • packages/core/src/view/mixins/FoldingMixin.ts (3 hunks)
  • packages/core/src/view/style/EdgeStyle.ts (1 hunks)
  • packages/core/src/view/style/edge/Loop.ts (1 hunks)
  • packages/html/stories/FixedIcons.stories.js (1 hunks)
  • packages/html/stories/Handles.stories.ts (6 hunks)
  • packages/ts-example-without-defaults/vite.config.js (1 hunks)
  • packages/ts-example/vite.config.js (1 hunks)
  • packages/website/docs/usage/migrate-from-mxgraph.md (1 hunks)
💤 Files with no reviewable changes (1)
  • packages/core/src/util/StringUtils.ts
✅ Files skipped from review due to trivial changes (3)
  • packages/ts-example/vite.config.js
  • packages/ts-example-without-defaults/vite.config.js
  • packages/core/src/view/cell/Cell.ts
🧰 Additional context used
🪛 LanguageTool
CHANGELOG.md

[formatting] ~15-~15: Did you mean “?”
Context: ...cing) and the [Optional chaining (?.)](https://developer.mozilla.org/en-US/d...

(MULTIPLE_PUNCTATION_MARKS_1)

packages/website/docs/usage/migrate-from-mxgraph.md

[formatting] ~196-~196: Did you mean “?”
Context: ...coalescing) and the [Optional chaining (?.)](https://developer.mozilla.org/en-US/d...

(MULTIPLE_PUNCTATION_MARKS_1)

🪛 markdownlint-cli2 (0.17.2)
CHANGELOG.md

14-14: Unordered list indentation
Expected: 2; Actual: 4

(MD007, ul-indent)


16-16: Unordered list indentation
Expected: 2; Actual: 4

(MD007, ul-indent)


17-17: Unordered list indentation
Expected: 4; Actual: 8

(MD007, ul-indent)


18-18: Unordered list indentation
Expected: 4; Actual: 8

(MD007, ul-indent)


19-19: Unordered list indentation
Expected: 4; Actual: 8

(MD007, ul-indent)


20-20: Unordered list indentation
Expected: 4; Actual: 8

(MD007, ul-indent)

⏰ Context from checks skipped due to timeout of 90000ms (2)
  • GitHub Check: build (windows-2022)
  • GitHub Check: build (ubuntu-22.04)
🔇 Additional comments (24)
packages/core/__tests__/view/mixins/FoldingMixin.test.ts (1)

23-27: LGTM! Well-structured helper function.

The helper function is well-implemented with proper type annotations and default value handling.

packages/html/stories/FixedIcons.stories.js (1)

54-55: LGTM! Good use of nullish coalescing operator.

The replacement of utils.getValue with the nullish coalescing operator improves code readability and aligns with modern JavaScript practices.

packages/core/src/view/style/edge/Loop.ts (1)

67-68: LGTM! Good use of nullish coalescing and optional chaining.

The replacement of utils.getValue with nullish coalescing and optional chaining operators improves code readability. The optional chaining on direction is particularly appropriate as it safely handles potential undefined style objects.

packages/core/src/util/Utils.ts (1)

57-60: LGTM! Type expansion improves function versatility.

Adding boolean to the union type for isNullish and isNotNullish functions enhances their utility while maintaining type safety.

Let's verify if there are any existing usages of these functions with boolean values:

✅ Verification successful

🏁 Script executed:

#!/bin/bash
# Search for usages of isNullish/isNotNullish with boolean values
rg "is(Not)?Nullish\((true|false)" -A 2

Length of output: 41


No explicit boolean literal invocations found for isNullish/isNotNullish

  • The current search for literal boolean values (i.e. true or false) in calls to these functions returned no matches.
  • This indicates that, while the union type now accepts booleans, there are no existing usages in the codebase that explicitly pass boolean literals.
  • The change maintains type safety and expands versatility without introducing any conflicts.
packages/core/src/view/mixins/FoldingMixin.ts (2)

81-82: LGTM! Clean and concise implementation.

The changes improve code clarity by:

  1. Indicating unused parameter with _ prefix
  2. Using nullish coalescing for cleaner default value handling

169-169: LGTM! Improved property access pattern.

The changes enhance code readability by:

  1. Marking unused parameter with _ prefix
  2. Using nullish coalescing for default value handling

Also applies to: 182-182

packages/html/stories/Handles.stories.ts (2)

72-74: LGTM! Enhanced type safety and consistent default handling.

The changes improve code quality by:

  1. Adding proper type assertions for better type safety
  2. Using nullish coalescing with prototype defaults consistently

Also applies to: 91-93


132-133: LGTM! Consistent implementation of property access.

The changes maintain a consistent pattern of:

  1. Type assertion for style object
  2. Nullish coalescing for default values

Also applies to: 139-139, 148-149, 170-171, 186-187

packages/core/src/view/geometry/edge/ArrowConnectorShape.ts (1)

89-90: LGTM! Removed redundant type assertions.

The changes improve code cleanliness by removing unnecessary type assertions while maintaining type safety through TypeScript's type inference.

packages/core/src/view/layout/StackLayout.ts (1)

299-300: LGTM! Consistent use of nullish coalescing.

The changes improve code readability by:

  1. Using nullish coalescing for default values consistently
  2. Removing dependency on utility functions

Also applies to: 360-360

packages/core/src/view/geometry/node/StencilShape.ts (3)

23-23: LGTM! Import changes align with PR objectives.

The removal of utility function imports and addition of isNotNullish aligns with the PR's goal to remove extra utility functions.


223-224: LGTM! Property access updated to use optional chaining.

The changes correctly use optional chaining and nullish coalescing for accessing style properties:

  • direction from shape.style?.direction
  • strokeWidth from shape.style?.strokeWidth ?? 1

Also applies to: 228-229


529-530: LGTM! Property access updated to use optional chaining.

The changes correctly use optional chaining and nullish coalescing for accessing style properties:

  • flipH from shape.style?.flipH ?? false
  • flipV from shape.style?.flipV ?? false
packages/core/src/view/handler/CellEditorHandler.ts (3)

41-41: LGTM! Import changes align with PR objectives.

The removal of utility function imports and keeping only the required functions aligns with the PR's goal.


533-534: LGTM! Property access updated to use optional chaining.

The changes correctly use optional chaining and nullish coalescing for accessing style properties:

const lw = state.style.labelWidth ?? null;
this.align ?? state.style.align ?? ALIGN.CENTER,
state.style.verticalAlign ?? ALIGN.MIDDLE

Also applies to: 538-539


558-559: LGTM! Property access updated to use optional chaining.

The changes correctly use optional chaining and nullish coalescing for accessing style properties:

let hpos = state.style.labelPosition ?? ALIGN.CENTER;
let vpos = state.style.verticalLabelPosition ?? ALIGN.MIDDLE;
const horizontal = state.style.labelPosition ?? ALIGN.CENTER;

Also applies to: 1005-1005

packages/core/src/types.ts (1)

172-174: LGTM! Documentation improvement for direction property.

The updated documentation clarifies that the direction style is used for both shapes (e.g., Swimlane) and edge styles (e.g., Loop), with their respective default values.

packages/core/src/view/style/EdgeStyle.ts (1)

251-273: LGTM! Clean refactor using nullish coalescing.

The changes effectively replace utility function calls with modern JavaScript syntax using the nullish coalescing operator (??), making the code more concise and maintainable while preserving the same functionality.

CHANGELOG.md (1)

12-20: LGTM! Clear documentation of breaking changes.

The changelog entry effectively communicates:

  1. The breaking changes being introduced
  2. The rationale behind the changes
  3. Clear migration guidance for users
🧰 Tools
🪛 LanguageTool

[formatting] ~15-~15: Did you mean “?”
Context: ...cing) and the [Optional chaining (?.)](https://developer.mozilla.org/en-US/d...

(MULTIPLE_PUNCTATION_MARKS_1)

🪛 markdownlint-cli2 (0.17.2)

14-14: Unordered list indentation
Expected: 2; Actual: 4

(MD007, ul-indent)


16-16: Unordered list indentation
Expected: 2; Actual: 4

(MD007, ul-indent)


17-17: Unordered list indentation
Expected: 4; Actual: 8

(MD007, ul-indent)


18-18: Unordered list indentation
Expected: 4; Actual: 8

(MD007, ul-indent)


19-19: Unordered list indentation
Expected: 4; Actual: 8

(MD007, ul-indent)


20-20: Unordered list indentation
Expected: 4; Actual: 8

(MD007, ul-indent)

packages/website/docs/usage/migrate-from-mxgraph.md (1)

195-199: LGTM! Clear migration guidance provided.

The documentation effectively guides users on migrating from the removed utility methods to modern JavaScript features, maintaining consistency with the changelog.

🧰 Tools
🪛 LanguageTool

[formatting] ~196-~196: Did you mean “?”
Context: ...coalescing) and the [Optional chaining (?.)](https://developer.mozilla.org/en-US/d...

(MULTIPLE_PUNCTATION_MARKS_1)

packages/core/src/util/mathUtils.ts (4)

24-24: LGTM! Import cleanup.

The removal of the getValue import aligns with the PR objectives to remove utility functions for default value retrieval.


222-225: LGTM! Modern syntax for property access.

The use of nullish coalescing operator (??) for property access is a cleaner and more idiomatic approach in modern TypeScript.


380-382: LGTM! Consistent use of modern syntax.

The nullish coalescing operator (??) is used consistently for property access and default values.


616-620: LGTM! Simplified property access.

The code has been modernized to use optional chaining and nullish coalescing operators, making it more concise and maintainable.

…nction

# Conflicts:
#	CHANGELOG.md
#	packages/core/src/util/Utils.ts
Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 2

🧹 Nitpick comments (1)
CHANGELOG.md (1)

15-15: Improve Clarity of the Removal Message

The message on line 15 explains that utility functions for default value retrieval have been removed. Consider rewording it for clarity and grammatical accuracy. For example, changing "retrieve default value" to "retrieve default values" and simplifying the phrasing could improve readability.

Proposed diff:

- Some utility functions formerly used to retrieve default value of `CellStateStyle` and `CellStyle` properties, mainly intended to only be used internally, have been removed.
+ Some utility functions formerly used to retrieve default values for `CellStateStyle` and `CellStyle` properties, which were intended only for internal use, have been removed.
📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 3c98c30 and c4099ab.

📒 Files selected for processing (4)
  • CHANGELOG.md (1 hunks)
  • packages/core/src/types.ts (1 hunks)
  • packages/core/src/util/Utils.ts (1 hunks)
  • packages/core/src/view/geometry/node/StencilShape.ts (3 hunks)
🚧 Files skipped from review as they are similar to previous changes (3)
  • packages/core/src/view/geometry/node/StencilShape.ts
  • packages/core/src/util/Utils.ts
  • packages/core/src/types.ts
🧰 Additional context used
🪛 LanguageTool
CHANGELOG.md

[formatting] ~17-~17: Did you mean “?”
Context: ...cing) and the [Optional chaining (?.)](https://developer.mozilla.org/en-US/d...

(MULTIPLE_PUNCTATION_MARKS_1)

🪛 markdownlint-cli2 (0.17.2)
CHANGELOG.md

16-16: Unordered list indentation
Expected: 2; Actual: 4

(MD007, ul-indent)


18-18: Unordered list indentation
Expected: 2; Actual: 4

(MD007, ul-indent)


19-19: Unordered list indentation
Expected: 4; Actual: 8

(MD007, ul-indent)


20-20: Unordered list indentation
Expected: 4; Actual: 8

(MD007, ul-indent)


21-21: Unordered list indentation
Expected: 4; Actual: 8

(MD007, ul-indent)


22-22: Unordered list indentation
Expected: 4; Actual: 8

(MD007, ul-indent)

⏰ Context from checks skipped due to timeout of 90000ms (1)
  • GitHub Check: build (windows-2022)

@sonarqubecloud
Copy link

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

refactor Code refactoring

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant