[WEB-4981] fix: analytics portal modal#7858
Conversation
WalkthroughAdjusts layout classes for the analytics WorkItems modal container and the shared modal portal wrapper: removes conditional margin in full-screen mode and switches portal content positioning from fixed to absolute. No API, state, or event logic changes. Changes
Sequence Diagram(s)Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Possibly related PRs
Suggested labels
Suggested reviewers
Poem
Pre-merge checks and finishing touches❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✨ Finishing touches
🧪 Generate unit tests
Tip 👮 Agentic pre-merge checks are now available in preview!Pro plan users can now enable pre-merge checks in their settings to enforce checklists before merging PRs.
Please see the documentation for more information. Example: reviews:
pre_merge_checks:
custom_checks:
- name: "Undocumented Breaking Changes"
mode: "warning"
instructions: |
Pass/fail criteria: All breaking changes to public APIs, CLI flags, environment variables, configuration keys, database schemas, or HTTP/GraphQL endpoints must be documented in the "Breaking Change" section of the PR description and in CHANGELOG.md. Exclude purely internal or private changes (e.g., code not exported from package entry points or explicitly marked as internal).Please share your feedback with us on this Discord post. 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. Comment |
There was a problem hiding this comment.
Pull Request Overview
This PR fixes CSS positioning and spacing issues in the analytics portal modal to resolve layout problems.
- Changed modal positioning from
fixedtoabsolutefor proper containment - Removed margin spacing from fullscreen modal to prevent layout issues
Reviewed Changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated no comments.
| File | Description |
|---|---|
| packages/propel/src/portal/modal-portal.tsx | Changed modal container positioning from fixed to absolute |
| apps/web/core/components/analytics/work-items/modal/index.tsx | Removed margin from fullscreen modal styling |
Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.
|
Linked to Plane Work Item(s) This comment was auto-generated by Plane |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
apps/web/core/components/analytics/work-items/modal/index.tsx(1 hunks)packages/propel/src/portal/modal-portal.tsx(1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
- GitHub Check: Build and lint web apps
- GitHub Check: Build and lint web apps
🔇 Additional comments (1)
apps/web/core/components/analytics/work-items/modal/index.tsx (1)
44-45: LGTMDropping the fullscreen margin aligns the content flush with the viewport, which matches the modal layout update. No further action needed.
| const content = ( | ||
| <div | ||
| className={cn("fixed inset-0 h-full w-full overflow-y-auto", className)} | ||
| className={cn("absolute inset-0 h-full w-full overflow-y-auto", className)} |
There was a problem hiding this comment.
Restore fixed positioning on the portal container
Switching the wrapper from fixed to absolute means the overlay and dialog now scroll with the document. On long pages the modal slides off-screen as soon as the user scrolls, defeating the purpose of a modal overlay. We still need it anchored to the viewport. Please keep this element position: fixed.
- className={cn("absolute inset-0 h-full w-full overflow-y-auto", className)}
+ className={cn("fixed inset-0 h-full w-full overflow-y-auto", className)}🤖 Prompt for AI Agents
In packages/propel/src/portal/modal-portal.tsx around line 92 the wrapper is
using absolute positioning (className includes "absolute"), which causes the
overlay and dialog to scroll with the document; change the positioning back to
fixed by replacing the "absolute" class with "fixed" so the portal is anchored
to the viewport and the modal overlay/dialog stay visible when the page scrolls.
Description
This PR includes fixes for analytics portal modal
Type of Change
Summary by CodeRabbit