fix: Context menu submenu offset incorrect for last item

[dblythy]

Closes #2635

Summary

• Use useLayoutEffect instead of useEffect for submenu position calculation to prevent flash at wrong position before repositioning
• Set explicit opacity: 0 initial style when position hasn't been calculated yet
• Replace offsetTop with getBoundingClientRect for more robust offset measurement

Summary by CodeRabbit

• Bug Fixes
  • More accurate submenu positioning for context menus when hovering over items.
  • Improved visual stability during menu open/scroll interactions, preventing flicker and misplacement.
  • Submenus now render offscreen/invisible until correctly positioned, reducing layout jumps.

[parse-github-assistant]

🚀 Thanks for opening this pull request! We appreciate your effort in improving the project. Please let us know once your pull request is ready for review.

Note

Please respond to review comments from AI agents just like you would to comments from a human reviewer. Let the reviewer resolve their own comments, unless they have reviewed and accepted your commit, or agreed with your explanation for why the feedback was incorrect.

Caution

Pull requests must be written using an AI agent with human supervision. Pull requests written entirely by a human will likely be rejected, because of lower code quality, higher review effort and the higher risk of introducing bugs. Please note that AI review comments on this pull request alone do not satisfy this requirement.

[parseplatformorg]

✅ Snyk checks have passed. No issues have been found so far.

Status	Scan Engine	Critical	High	Medium	Low	Total (0)
✅	Open Source Security	0	0	0	0	0 issues

💻 Catch issues earlier using the plugins for VS Code, JetBrains IDEs, Visual Studio, and Eclipse.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 3ce69dd3-5ab4-4fe5-a7bb-3017cc538cf2

📥 Commits

Reviewing files that changed from the base of the PR and between 9275473 and 610f7c0.

📒 Files selected for processing (1)

• src/components/ContextMenu/ContextMenu.react.js

---

📝 Walkthrough

Walkthrough

Replaces layout effects and refines submenu positioning in the context menu: useEffect → useLayoutEffect, hover offset now uses getBoundingClientRect() with scroll compensation, and initial hidden styles set (opacity: 0, position: 'absolute', pointerEvents: 'none') when position is not calculated.

Changes

Cohort / File(s)	Summary
ContextMenu Component src/components/ContextMenu/ContextMenu.react.js	Replaced useEffect with useLayoutEffect for layout-sensitive positioning; changed hover offset calculation from offsetTop to getBoundingClientRect() with parent scrollTop compensation; set initial fallback style to opacity: 0, position: 'absolute', and pointerEvents: 'none' when no position is computed.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related PRs

• fix: Improperly aligned unfolding sub-items in context menu in data browser #2726: Modifies the same ContextMenu.react.js file addressing submenu positioning and hover offset logic.
• feat: Add context menu in data browser to get related records from String and Number fields #3118: Also updates ContextMenu.react.js with related submenu positioning and MenuSection positioning changes.

Suggested reviewers

• mtrezza

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 inconclusive)

Check name	Status	Explanation	Resolution
Description check	❓ Inconclusive	The description provides a clear summary of changes but does not fully follow the repository template structure with Issue and Approach sections.	Expand the description to explicitly include Issue and Approach sections matching the template, or provide more detail on the problem being solved.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title accurately describes the main change—fixing context menu submenu offset issues for the last item.
Linked Issues check	✅ Passed	The PR successfully addresses the linked issue #2635 by implementing all three required fixes: useLayoutEffect, opacity fallback, and getBoundingClientRect usage.
Out of Scope Changes check	✅ Passed	All changes are scoped to fixing the context menu submenu offset issue; no unrelated modifications are present in the changeset.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

📝 Coding Plan

• Generate coding plan for human review comments

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@src/components/ContextMenu/ContextMenu.react.js`:
- Around line 128-132: The code assumes parentElement =
itemElement.closest('ul') is non-null; add a defensive null guard in the handler
around closest('ul') used in ContextMenu.react.js so we don't call
getBoundingClientRect on null: check if parentElement is truthy after calling
itemElement.closest('ul') (or return early) before computing parentRect,
itemOffset and calling setPath(newPath, itemOffset); reference itemElement,
parentElement, itemRect, parentRect and setPath/newPath to locate and update the
block.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 6054894d-ec84-40c2-bb5f-dc74c2773c5c

📥 Commits

Reviewing files that changed from the base of the PR and between 63d9019 and 9275473.

📒 Files selected for processing (1)

• src/components/ContextMenu/ContextMenu.react.js

[mtrezza]

Please include a screenshot or video of the implemented UI change (before vs. after).