feat(organizations): Complete Organization Management UI #19
Conversation
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
- Organization switcher with instant tenant context updates - Account settings: general, members, danger zone - Admin organization management dashboard - Invitation acceptance flow with email verification - Member management (invite, role change, remove) - Organization transfer and deletion - Navigation system with mobile support - Comprehensive UI components and utilities This implements the full organizations UI as specified in 009-organizations-ui, providing enterprise-grade multi-tenancy management for the SSO platform. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
There was a problem hiding this comment.
Pull request overview
This PR implements a comprehensive organization management UI for the SSO platform, adding multi-tenant workspace capabilities with member management, invitations, RBAC, and admin tools. The implementation builds on existing Better Auth organization infrastructure to provide user-facing features.
Summary
- Complete organization lifecycle management (create, switch, settings, delete)
- Member management with role-based permissions (owner/admin/member)
- Email-based invitation system with acceptance flow
- Admin dashboard for platform-wide organization oversight
- Navigation system with mobile support and theme toggle
- Full TypeScript support with comprehensive utility functions
Key Changes
- New routes:
/account/organizations/*,/admin/organizations,/accept-invitation/* - UI components: Navigation, organization cards, dialogs, forms
- Utility functions for validation, organization operations, toast notifications
- Test coverage for utilities (validation, organization helpers)
Reviewed changes
Copilot reviewed 70 out of 72 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
sso-platform/src/types/organization.ts |
TypeScript interfaces for organizations, members, invitations |
sso-platform/src/lib/utils/validation.ts |
Input validation utilities (email, slug, image files) |
sso-platform/src/lib/utils/organization.ts |
Organization helper functions (slugify, role display, permissions) |
sso-platform/src/lib/utils/toast.ts |
Toast notification utility with success/error helpers |
sso-platform/src/lib/utils/__tests__/* |
Unit tests for validation and organization utilities |
sso-platform/src/components/ui/* |
UI primitives (textarea, tabs, skeleton, sheet, select, etc.) |
sso-platform/src/components/theme-* |
Theme provider and toggle components |
sso-platform/src/components/organizations/* |
Organization-specific components (logo, badge, slug input) |
sso-platform/src/components/layout/* |
Navigation components (navbar, user menu, mobile nav, org switcher) |
sso-platform/src/app/admin/organizations/* |
Admin dashboard with bulk operations |
sso-platform/src/app/account/organizations/* |
Organization listing, creation, and settings |
sso-platform/src/app/accept-invitation/* |
Invitation acceptance flow |
sso-platform/src/app/account/layout.tsx |
Updated layout with new navbar |
sso-platform/package.json |
New dependencies (react-hook-form, zod resolver, radix components) |
Files not reviewed (1)
- sso-platform/pnpm-lock.yaml: Language not supported
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| import { useState } from "react"; | ||
| import { Organization, OrgRole } from "@/types/organization"; | ||
| import { OrgLogo } from "@/components/organizations/OrgLogo"; | ||
| import { OrgBadge } from "@/components/organizations/OrgBadge"; |
There was a problem hiding this comment.
Unused import OrgBadge.
|
|
||
| const params = await searchParams; | ||
| const page = parseInt(params.page || "1"); | ||
| const search = params.search || ""; |
There was a problem hiding this comment.
Unused variable search.
| const params = await searchParams; | ||
| const page = parseInt(params.page || "1"); | ||
| const search = params.search || ""; | ||
| const status = params.status || "all"; |
There was a problem hiding this comment.
Unused variable status.
| "use client"; | ||
|
|
||
| import { useState } from "react"; | ||
| import { Menu, X, Building2, User, Shield, LogOut } from "lucide-react"; |
There was a problem hiding this comment.
Unused import X.
…metadata Improves UX by showing organization names instead of long random IDs. Implements efficient architecture: org names included in JWT at login, zero extra API calls during org switching. Changes: - SSO: Include organization_names array in JWT claims (auth.ts) - Taskflow: Pass organization_names through session API - OrgSwitcher: Display names in button and dropdown (fallback to short ID) - Types: Add organization_names to JWTClaims interface Also fixes SSR error in CreateOrgDialog (FileList validation). Architecture follows enterprise pattern (Slack/Notion): - One DB query at login (fetch org names) - Names embedded in JWT - No runtime API calls for org metadata Performance: ~200-500ms total org switch (unchanged) UX: Shows "Test" instead of "FzttZNBpsgfBah67HWypQVZwjay7BKfi" 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
18 tasks
Resolved conflicts by keeping our organization names implementation: - OrgSwitcher.tsx: Uses organization_names from JWT (better UX) - auth-client.ts: Better documentation - ORG-SWITCHING-GUIDE.md: Comprehensive guide Incorporated changes from main: - Kubernetes/Helm skills and learning materials - Minikube addons guide 🤖 Generated with [Claude Code](https://claude.com/claude-code)
Regenerate lockfile to match current package.json dependencies. Removed next-themes from lockfile as it was removed from package.json. Fixes security audit CI failure: - ERR_PNPM_OUTDATED_LOCKFILE resolved 🤖 Generated with [Claude Code](https://claude.com/claude-code)
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
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.
Summary
Implements comprehensive organization management UI for the SSO platform, including user-facing organization settings and admin management tools.
Features
User Features
Admin Features
Technical Implementation
Files Changed
/account/organizations/*,/admin/organizationsRelated
specs/009-organizations-ui/spec.mdspecs/009-organizations-ui/plan.mdspecs/009-organizations-ui/tasks.md🤖 Generated with Claude Code
Co-Authored-By: Claude Sonnet 4.5 noreply@anthropic.com