fix(FR-2817): unclip folder-status invitation badge and add /data invitation entry point#7261
Merged
Conversation
Contributor
Author
How to use the Graphite Merge QueueAdd either label to this PR to merge it via the merge queue:
You must have a Graphite account in order to use the merge queue. Sign up using this link. An organization admin has required the Graphite Merge Queue in this repository. Please do not merge from GitHub as this will restart CI on PRs being processed by the merge queue. This stack of pull requests is managed by Graphite. Learn more about stacking. |
github-actions
Bot
added
area:ux
Contributor
Coverage Report for react-coverage (./react)
File Coverage
|
||||||||||||||||||||||||||||||||||||||||||||
Contributor
There was a problem hiding this comment.
Pull request overview
This PR improves the visibility and discoverability of vfolder invitation status in the WebUI by (1) adjusting invitation badge positioning to avoid clipping and (2) adding a “Pending invitations” entry point in the /data (VFolder list) page that opens the existing invitation response modal via a query param.
Changes:
- Add a pending-invitations button (with count badge) to
VFolderNodeListPagethat sets?invitation=trueto open the invitation modal. - Adjust invitation badge
offsetinStorageStatusPanelCardto prevent the badge from being clipped. - Add the new i18n string key
data.invitation.PendingInvitationsacross supported locales.
Reviewed changes
Copilot reviewed 23 out of 23 changed files in this pull request and generated 1 comment.
Show a summary per file
| File | Description |
|---|---|
| resources/i18n/de.json | Adds data.invitation.PendingInvitations translation. |
| resources/i18n/el.json | Adds data.invitation.PendingInvitations translation. |
| resources/i18n/en.json | Adds data.invitation.PendingInvitations translation. |
| resources/i18n/es.json | Adds data.invitation.PendingInvitations translation. |
| resources/i18n/fi.json | Adds data.invitation.PendingInvitations translation. |
| resources/i18n/fr.json | Adds data.invitation.PendingInvitations translation. |
| resources/i18n/id.json | Adds data.invitation.PendingInvitations translation. |
| resources/i18n/it.json | Adds data.invitation.PendingInvitations translation. |
| resources/i18n/ja.json | Adds data.invitation.PendingInvitations translation. |
| resources/i18n/ko.json | Adds data.invitation.PendingInvitations translation (Korean wording may need adjustment). |
| resources/i18n/mn.json | Adds data.invitation.PendingInvitations translation. |
| resources/i18n/ms.json | Adds data.invitation.PendingInvitations translation. |
| resources/i18n/pl.json | Adds data.invitation.PendingInvitations translation. |
| resources/i18n/pt-BR.json | Adds data.invitation.PendingInvitations translation. |
| resources/i18n/pt.json | Adds data.invitation.PendingInvitations translation. |
| resources/i18n/ru.json | Adds data.invitation.PendingInvitations translation. |
| resources/i18n/th.json | Adds data.invitation.PendingInvitations translation. |
| resources/i18n/tr.json | Adds data.invitation.PendingInvitations translation. |
| resources/i18n/vi.json | Adds data.invitation.PendingInvitations translation. |
| resources/i18n/zh-CN.json | Adds data.invitation.PendingInvitations translation. |
| resources/i18n/zh-TW.json | Adds data.invitation.PendingInvitations translation. |
| react/src/pages/VFolderNodeListPage.tsx | Adds the pending-invitations button with badge and query-param entry point (invitation=true). |
| react/src/components/StorageStatusPanelCard.tsx | Updates badge offset to avoid clipping. |
ironAiken2
force-pushed
the
05-06-fix_fr-2817_unclip_folder-status_invitation_badge_and_add__data_invitation_entry_point
branch
from
4e81cde to
a3f77c1
Compare
ironAiken2
force-pushed
the
05-06-fix_fr-2817_unclip_folder-status_invitation_badge_and_add__data_invitation_entry_point
branch
from
a3f77c1 to
3416562
Compare
Merge activity
|
…itation entry point (#7261) Resolves #7251(FR-2817) ## Summary Two regressions surfaced after the storage-status widget moved to the dashboard: 1. The red `+N` badge over `초대된 폴더` was placed with a negative Y-offset (`-token.sizeXS`) that pushed it above the dashboard card body, where it was clipped by the card's overflow. 2. The `/data` page offered no in-page entry point to view / accept / reject pending invitations — users could only reach the existing invitation modal via the (clipped) badge from the dashboard. ## Changes - **`StorageStatusPanelCard`**: drop the negative Y offset on the invitation `Badge` (now `offset={[-token.sizeXS, 0]}`) so it overlays the title's top-right corner inside the card body bounds. - **`VFolderNodeListPage`** (`/data`): surface pending invitations via the `BAITabs` `tabBarExtraContent` slot as a `BAILink` labeled `Pending invitations (N)`, rendered only when `useVFolderInvitations()` reports any pending invitation. Clicking it sets `?invitation=true`, which the existing global `FolderInvitationResponseModalOpener` already binds to to open the accept/reject modal — no new modal/component needed. The card header `extra` now only carries `Create Folder`. - **i18n**: correct the Korean translation of `data.invitation.PendingInvitations` from `받은 초대장` (Received invitations) to `응답 대기 중인 초대` (Awaiting-response invitations) so it matches the English `Pending invitations`. Other locales were already semantically correct and left unchanged. ## Verification - Relay: PASS - Lint: PASS - Format: PASS - TypeScript: pre-existing failures only on `main` (unrelated to this change; tracked separately under FR-2816). ## Test environment You can use the test server at `10.122.10.107` for review/QA. ## Manual smoke test - Have at least one pending vfolder invitation. - Open the dashboard → the `+N` badge over `초대된 폴더` is no longer clipped at the top of the card. - Open `/data` → a `Pending invitations (N)` link appears in the tab bar's right-side extra area (next to the `Active` / `Trash bin` tabs), shown only when there are pending invitations. Click → the invitation modal opens with accept / reject actions.
graphite-app
Bot
force-pushed
the
05-06-fix_fr-2817_unclip_folder-status_invitation_badge_and_add__data_invitation_entry_point
branch
from
3416562 to
82d550b
Compare
graphite-app
Bot
deleted the
05-06-fix_fr-2817_unclip_folder-status_invitation_badge_and_add__data_invitation_entry_point
branch
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Resolves #7251(FR-2817)
Summary
Two regressions surfaced after the storage-status widget moved to the dashboard:
+Nbadge over초대된 폴더was placed with a negative Y-offset (-token.sizeXS) that pushed it above the dashboard card body, where it was clipped by the card's overflow./datapage offered no in-page entry point to view / accept / reject pending invitations — users could only reach the existing invitation modal via the (clipped) badge from the dashboard.Changes
StorageStatusPanelCard: drop the negative Y offset on the invitationBadge(nowoffset={[-token.sizeXS, 0]}) so it overlays the title's top-right corner inside the card body bounds.VFolderNodeListPage(/data): surface pending invitations via theBAITabstabBarExtraContentslot as aBAILinklabeledPending invitations (N), rendered only whenuseVFolderInvitations()reports any pending invitation. Clicking it sets?invitation=true, which the existing globalFolderInvitationResponseModalOpeneralready binds to to open the accept/reject modal — no new modal/component needed. The card headerextranow only carriesCreate Folder.data.invitation.PendingInvitationsfrom받은 초대장(Received invitations) to응답 대기 중인 초대(Awaiting-response invitations) so it matches the EnglishPending invitations. Other locales were already semantically correct and left unchanged.Verification
main(unrelated to this change; tracked separately under FR-2816).Test environment
You can use the test server at
10.122.10.107for review/QA.Manual smoke test
+Nbadge over초대된 폴더is no longer clipped at the top of the card./data→ aPending invitations (N)link appears in the tab bar's right-side extra area (next to theActive/Trash bintabs), shown only when there are pending invitations. Click → the invitation modal opens with accept / reject actions.