fix(sdk): polish views-new empty states, menus and add member flow by rohanchkrabrty · Pull Request #1626 · raystack/frontier

rohanchkrabrty · 2026-05-19T10:55:51Z

Summary

Standardized row action menus in views-new to use DotsHorizontalIcon + IconButton size={2}, visible only on row hover.
Reworked top-level empty states (projects, teams, plans, service accounts, pat, billing, subscribe) to the empty2 design with SVG icons and accent CTA; CTA is omitted (not just disabled) when the user lacks permission.
Added top-level "no teams yet" empty state to teams-view, mirroring projects-view, and a my/all filter Select in projects-view with isFetched-based initial-skeleton handling.
Added an "Add a member" submenu to the projects row action menu by extracting AddMemberMenuContent and rendering it as a Menu.Submenu (no handle indirection).
Dropped privacy column and the privacy field in the edit-project dialog (no longer supported by the backend); painted destructive menu items danger-colored with the right SVG icons.

vercel · 2026-05-19T10:55:57Z

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
frontier	Ready	Preview, Comment	May 20, 2026 7:13am

coderabbitai · 2026-05-19T10:56:06Z

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: af4d9a33-875c-4555-b77a-4cf560b6f156

📥 Commits

Reviewing files that changed from the base of the PR and between b9e8edc and 5c2c39a.

📒 Files selected for processing (1)

web/sdk/react/views-new/billing/billing-view.tsx

📝 Walkthrough

Summary by CodeRabbit

New Features
- Organization-level project visibility toggle ("My Projects" / "All Projects")
- "Add a member" submenu in projects dropdown
Bug Fixes
- Improved initial-loading handling with skeletons for smoother UI
Improvements
- Consistent hover-reveal for table action buttons and standardized table padding
- Updated action/menu icons and empty-state visuals
- Removed privacy controls from project editor

Walkthrough

Adds hook-level isFetched flags; projects: org-level filter, AddMember submenu, and privacy removal in edit dialog; teams: initial-skeleton vs loaded UI; standardizes action icons to horizontal dots and hover-revealed action cells; replaces several empty-state Radix icons with local SVG Image assets.

Changes

Hook Infrastructure for Load State Tracking

Layer / File(s)	Summary
useOrganizationProjects isFetched support `web/sdk/react/hooks/useOrganizationProjects.ts`	Return type updated to include `isFetched`; both organization and user project queries destructure and OR their `isFetched` flags.
useOrganizationTeams isFetched support `web/sdk/react/hooks/useOrganizationTeams.ts`	Return type updated to include `isFetched`; both organization and user team queries destructure and OR their `isFetched` flags.

Projects Feature Expansion

Layer / File(s)	Summary
AddMemberMenuContent extraction `web/sdk/react/views-new/projects/components/add-member-menu.tsx`	New exported `AddMemberMenuContent` encapsulates menu body rendering for users/teams, supports submenu mode, skeletons, empty states, and footer toggle.
Project dialog privacy removal `web/sdk/react/views-new/projects/components/edit-project-dialog.tsx`, `edit-project-dialog.module.css`	Removes privacy from form schema/state and UI; form now only manages `title`.
Projects view filtering and member menu `web/sdk/react/views-new/projects/projects-view.tsx`, `projects-view.module.css`	Adds org-level project visibility filter wired to `useOrganizationProjects(allProjects)`, uses `isFetched` for initial skeleton, updates empty-state/CTA behavior, and adds an “Add a member” submenu in row actions when permitted.
Project columns actions and styling `web/sdk/react/views-new/projects/components/project-columns.tsx`, `project-columns.module.css`, `member-columns.module.css`	Switches action triggers to `DotsHorizontalIcon`, adjusts IconButton sizing, and adds CSS modules to hide action cells by default and reveal on row hover.
Project details table styling `web/sdk/react/views-new/projects/project-details-view.tsx`, `project-details-view.module.css`	Applies consistent per-row cell padding and row classNames for member tables.

Teams View Load State and Polish

Layer / File(s)	Summary
Teams view initial skeleton and empty state `web/sdk/react/views-new/teams/teams-view.tsx`	Consumes `isFetched` from hook to compute `showInitialSkeleton`, distinguishes initial skeleton from subsequent loading, adds early-return EmptyState when no teams, and uses a controlled Select filter.
Team/member columns actions and styling `web/sdk/react/views-new/teams/components/team-columns.tsx`, `member-columns.tsx`, `team-columns.module.css`, `member-columns.module.css`	Adopts horizontal dots icon and smaller IconButton, adds CSS modules for hover-revealed action cells, and tweaks name-cell spacing.
Team details table and member actions `web/sdk/react/views-new/teams/team-details-view.tsx`, `team-details-view.module.css`	Adds `user-minus` SVG for remove action and expands DataTable classNames with root/row styles; adds row cell padding rule.

Members UI, Empty-state Icons, and Table UX Polish

Layer / File(s)	Summary
Members table icon and styling updates `web/sdk/react/views-new/members/components/member-columns.tsx`, `web/sdk/react/views-new/members/members-view.tsx`, `member-columns.module.css`, `members-view.module.css`	Members tables use `DotsHorizontalIcon` for actions, action cells are hidden until row hover, delete action renders via local SVG Image with danger color, and table row padding is applied.
Empty-state icon standardization via SVG assets `web/sdk/react/views-new/billing/billing-view.tsx`, `web/sdk/react/views-new/pat/pat-view.tsx`, `web/sdk/react/views-new/service-accounts/service-accounts-view.tsx`	Billing, PAT, and service-accounts empty states now render local SVGs via `Image` and update primary CTA presentation.

Service Accounts Actions

Layer / File(s)	Summary
Service accounts actions icon update `web/sdk/react/views-new/service-accounts/components/service-account-columns.tsx`	Service-account action triggers switch to `DotsHorizontalIcon` and reduce IconButton size.

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~60 minutes

Possibly related PRs

raystack/frontier#1533: Related to PAT UI changes touching pat-view.tsx.
raystack/frontier#1566: Related projects page refactors and CTA/permission gating.
raystack/frontier#1510: Related teams view changes and exposing isFetched for initial load handling.

Suggested reviewers

rsbh
paanSinghCoder
Shreyag02

🚥 Pre-merge checks | ✅ 2

✅ Passed checks (2 passed)

Check name	Status	Explanation
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

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

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

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

coderabbitai

Actionable comments posted: 6

🧹 Nitpick comments (1)

web/sdk/react/views-new/plans/plans-view.tsx (1)

153-158: ⚡ Quick win

Inconsistent icon migration compared to other empty states.

This EmptyState updates to variant="empty2" but still uses the Radix ExclamationTriangleIcon component, while other views (billing, PAT, service-accounts) migrated to local SVG assets via the Image component. Per the PR objectives, the standardization effort aims to systematically replace Radix icons with local SVG assets in empty states. The exclamation-triangle.svg asset is already available and used in billing-view, so this can be a quick migration to align with the pattern.

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: e46f3d90-cdec-4c38-b3f8-b6781089121e

📥 Commits

Reviewing files that changed from the base of the PR and between adb9deb and b9e8edc.

⛔ Files ignored due to path filters (2)

web/sdk/react/assets/inbox-stack.svg is excluded by !**/*.svg
web/sdk/react/assets/user-minus.svg is excluded by !**/*.svg

📒 Files selected for processing (28)

web/sdk/react/hooks/useOrganizationProjects.ts
web/sdk/react/hooks/useOrganizationTeams.ts
web/sdk/react/views-new/billing/billing-view.tsx
web/sdk/react/views-new/members/components/member-columns.tsx
web/sdk/react/views-new/members/members-view.module.css
web/sdk/react/views-new/members/members-view.tsx
web/sdk/react/views-new/pat/pat-view.tsx
web/sdk/react/views-new/plans/plans-view.tsx
web/sdk/react/views-new/projects/components/add-member-menu.tsx
web/sdk/react/views-new/projects/components/edit-project-dialog.module.css
web/sdk/react/views-new/projects/components/edit-project-dialog.tsx
web/sdk/react/views-new/projects/components/member-columns.module.css
web/sdk/react/views-new/projects/components/member-columns.tsx
web/sdk/react/views-new/projects/components/project-columns.module.css
web/sdk/react/views-new/projects/components/project-columns.tsx
web/sdk/react/views-new/projects/project-details-view.module.css
web/sdk/react/views-new/projects/project-details-view.tsx
web/sdk/react/views-new/projects/projects-view.module.css
web/sdk/react/views-new/projects/projects-view.tsx
web/sdk/react/views-new/service-accounts/components/service-account-columns.tsx
web/sdk/react/views-new/service-accounts/service-accounts-view.tsx
web/sdk/react/views-new/teams/components/member-columns.module.css
web/sdk/react/views-new/teams/components/member-columns.tsx
web/sdk/react/views-new/teams/components/team-columns.module.css
web/sdk/react/views-new/teams/components/team-columns.tsx
web/sdk/react/views-new/teams/team-details-view.module.css
web/sdk/react/views-new/teams/team-details-view.tsx
web/sdk/react/views-new/teams/teams-view.tsx

💤 Files with no reviewable changes (1)

web/sdk/react/views-new/projects/components/edit-project-dialog.module.css

coveralls · 2026-05-19T11:02:17Z

Coverage Report for CI Build 26147373899

Warning

Build has drifted: This PR's base is out of sync with its target branch, so coverage data may include unrelated changes.
Quick fix: rebase this PR. Learn more →

Coverage increased (+0.1%) to 42.592%

Details

Coverage increased (+0.1%) from the base build.
Patch coverage: No coverable lines changed in this PR.
220 coverage regressions across 3 files.

Uncovered Changes

No uncovered changes found.

Coverage Regressions

220 previously-covered lines in 3 files lost coverage.

File	Lines Losing Coverage	Coverage
pkg/server/connect_interceptors/authorization.go	126	0.0%
core/serviceuser/service.go	76	12.36%
core/policy/service.go	18	79.33%

Coverage Stats


Relevant Lines:	37953
Covered Lines:	16165
Line Coverage:	42.59%
Coverage Strength:	11.91 hits per line

💛 - Coveralls

rohanchkrabrty added 3 commits May 19, 2026 14:18

fix: sdk action menu behaviour

4a01a21

feat: add project member support

ec9dbbb

fix: update emptystate

b9e8edc

rohanchkrabrty self-assigned this May 19, 2026

rohanchkrabrty requested review from Shreyag02, paanSinghCoder and rsbh May 19, 2026 10:55

vercel Bot deployed to Preview May 19, 2026 10:56 View deployment

Merge branch 'main' into fix-frontier-bugs

5ac7102

vercel Bot deployed to Preview May 19, 2026 10:59 View deployment

coderabbitai Bot reviewed May 19, 2026

View reviewed changes

Shreyag02 reviewed May 19, 2026

View reviewed changes

Comment thread web/sdk/react/views-new/members/members-view.tsx

Shreyag02 self-requested a review May 20, 2026 06:17

fix: use consitent warning icon

5c2c39a

vercel Bot deployed to Preview May 20, 2026 07:13 View deployment

Shreyag02 approved these changes May 20, 2026

View reviewed changes

rohanchkrabrty merged commit 3fd24ce into main May 20, 2026
8 checks passed

rohanchkrabrty deleted the fix-frontier-bugs branch May 20, 2026 07:19

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

fix(sdk): polish views-new empty states, menus and add member flow#1626

fix(sdk): polish views-new empty states, menus and add member flow#1626
rohanchkrabrty merged 5 commits into
mainfrom
fix-frontier-bugs

rohanchkrabrty commented May 19, 2026

Uh oh!

vercel Bot commented May 19, 2026 •

edited

Loading

Uh oh!

coderabbitai Bot commented May 19, 2026 •

edited

Loading

Summary by CodeRabbit

Walkthrough

Changes

Estimated code review effort

Possibly related PRs

Suggested reviewers

Uh oh!

coderabbitai Bot left a comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

coveralls commented May 19, 2026 •

edited

Loading

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Conversation

rohanchkrabrty commented May 19, 2026

Summary

Uh oh!

vercel Bot commented May 19, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

coderabbitai Bot commented May 19, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by CodeRabbit

Walkthrough

Changes

Estimated code review effort

Possibly related PRs

Suggested reviewers

Uh oh!

coderabbitai Bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

coveralls commented May 19, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Coverage Report for CI Build 26147373899

Coverage increased (+0.1%) to 42.592%

Details

Uncovered Changes

Coverage Regressions

Coverage Stats

💛 - Coveralls

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

vercel Bot commented May 19, 2026 •

edited

Loading

coderabbitai Bot commented May 19, 2026 •

edited

Loading

coveralls commented May 19, 2026 •

edited

Loading