Context menu goes behind the top panel

[404-html]

New Issue Checklist

• [x] I am not disclosing a vulnerability.
• [x] I am not just asking a question.
• [x] I have searched through existing issues.
• [x] I can reproduce the issue with the latest versions of Parse Server and Parse Dashboard.

Issue Description

Context menu goes behind the top panel.

https://github.com/user-attachments/assets/318a48d8-97e2-49c0-8f65-a9c09f118870

Steps to reproduce

1. Open a collection that other collections points to
2. Right click on the objectId in the first row
3. Hover "Get related records from..." option

Adjust browser size if necessary. It might be reproducible only when reaching high number of items in the sub-menu, like in my case.

Actual Outcome

First few items in of the sub-menu are not accessible, as they are hidden below the top panel.

Expected Outcome

All sub-menu options should be accessible.

Environment

Dashboard

• Parse Dashboard version: 7.2.1-alpha.1
• Browser (Safari, Chrome, Firefox, Edge, etc.): Chrome Version
• Browser version: 134.0.6998.89 (Official Build) (arm64)

Server n/a

Database n/a

Logs

n/a

I believe it was introduced with: https://github.com/parse-community/parse-dashboard/pull/2726 https://github.com/parse-community/parse-dashboard/issues/2635 might be related.

[parse-github-assistant[bot]]

🚀 Thanks for opening this issue!

ℹ️ You can help us to fix this issue faster by opening a pull request with a failing test. See our Contribution Guide for how to make a pull request, or read our New Contributor's Guide if this is your first time contributing.

[404-html]

Looks like setting z-index on the sub-menu should do the job. @dblythy do you agree?

[mtrezza]

@404-html could you provide a scree recording to better describe what the issue is? Please use the latest alpha release to make sure we get the latest picture of this.

[404-html]

@mtrezza added to the description

[mtrezza]

What is the expected behavior? It looks strange to me if the context menu goes over the menu bar. Maybe the borders should be as follows and what doesn't fit should be scrollable:

• top: menu bar bottom edge
• bottom: pagination bar top edge
• left: side bar right edge
• right: info panel left edge

Which of these edges, aside from "top", are currently not acting as boundaries for the context menu?

[404-html]

Which of these edges, aside from "top", are currently not acting as boundaries for the context menu?

I believe currently the problem is only with the top edge.

What is the expected behavior? It looks strange to me if the context menu goes over the menu bar.

Indeed. I believe the problem was introduced with: https://github.com/parse-community/parse-dashboard/pull/2726 E.g. on 7.2.0-alpha.3 the menu is sized properly when it comes to the top edge (which I would call an expected behavior). But it goes behind bottom pagination panel (which was introduced a while before).

https://github.com/user-attachments/assets/2c1cb4ad-6542-4162-bed7-a1f11a5bc6e7