improvement(invite): aligned styling

[emir-karabeg]

Summary

Aligned invite page styling and added better error handling.

Type of Change

• Bug fix
• New feature
• Breaking change
• Documentation
• Other: ___________

Testing

Solo.

Checklist

• Code follows project style guidelines
• Self-reviewed my changes
• Tests added/updated and passing
• No new warnings introduced
• I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

[vercel]

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

1 Skipped Deployment

Project	Deployment	Review	Updated (UTC)
docs	Skipped		Jan 3, 2026 3:42am

[greptile-apps]

Greptile Summary

Aligned invite page styling with the rest of the auth flow by adopting AuthBackground component and matching button styles from the navigation component. Significantly improved error handling by introducing structured error types (InviteError interface), comprehensive error code mapping, and an parseApiError function that intelligently matches error messages and HTTP status codes. Enhanced user experience with contextual error states that provide appropriate actions (sign-in prompts for auth errors, retry buttons for network issues, organization management for membership conflicts).

Confidence Score: 4/5

• Safe to merge with minor observational notes about unused properties
• The code demonstrates good architectural improvements with structured error handling and consistent styling. The main issue is the unused requiresSignup property which reduces the score slightly, but this doesn't affect functionality. The error parsing logic is well-ordered (specific patterns before general ones), addressing previous concerns about the 'already a member' check order.
• No files require special attention

Important Files Changed

Filename	Overview
apps/sim/app/invite/[id]/invite.tsx	Major refactor adding structured error handling with error codes, types, and parsing logic; improved auth-related error flows
apps/sim/app/invite/components/layout.tsx	Updated to use AuthBackground component and aligned styling with auth pages; added hideAuthButtons prop to Nav
apps/sim/app/invite/components/status-card.tsx	Removed complex icon mapping logic, simplified button styling with inline gradient classes, improved hover states with ArrowRight/ChevronRight

Sequence Diagram

sequenceDiagram
    participant User
    participant InvitePage
    participant API
    participant ErrorHandler
    participant StatusCard

    User->>InvitePage: Visit /invite/[id]
    
    alt Error in URL params
        InvitePage->>ErrorHandler: Parse error reason
        ErrorHandler->>StatusCard: Display error state
        StatusCard->>User: Show error with actions
    else Valid invite ID
        InvitePage->>API: Fetch workspace invitation
        
        alt Workspace invite found
            API-->>InvitePage: Workspace invite data
            InvitePage->>StatusCard: Display workspace invite
        else Workspace 404
            InvitePage->>API: Fetch organization invitation
            
            alt Organization invite found
                API-->>InvitePage: Organization invite data
                InvitePage->>API: Check active organization
                
                alt Already in organization
                    InvitePage->>ErrorHandler: already-in-organization
                    ErrorHandler->>StatusCard: Show "leave org first" error
                else Not in organization
                    InvitePage->>StatusCard: Display org invite details
                    User->>InvitePage: Accept invitation
                    InvitePage->>API: POST /accept-invite
                    
                    alt Success
                        API-->>InvitePage: Success response
                        InvitePage->>StatusCard: Show success state
                    else API Error
                        API-->>InvitePage: Error response
                        InvitePage->>ErrorHandler: Parse API error
                        ErrorHandler->>StatusCard: Show contextual error
                    end
                end
            else Organization invite error
                API-->>InvitePage: Error response
                InvitePage->>ErrorHandler: Parse error (status + message)
                ErrorHandler->>StatusCard: Show error with retry/auth options
            end
        else Workspace invite error (non-404)
            API-->>InvitePage: Error response
            InvitePage->>ErrorHandler: Parse error with status code
            ErrorHandler->>StatusCard: Show error with actions
        end
    end
    
    Note over ErrorHandler: parseApiError checks:<br/>1. Message patterns (specific first)<br/>2. HTTP status codes<br/>3. Returns error code
    
    Note over StatusCard: Renders based on error.code:<br/>- requiresAuth → show sign-in<br/>- canRetry → show retry button<br/>- already-in-org → show leave org action

Loading

[greptile-apps]

_{4 files reviewed, 2 comments}

_{Edit Code Review Agent Settings | Greptile}

[greptile-apps]

style: requiresSignup is defined but never used in the error handling logic

Suggested change

	requiresSignup?: boolean
	requiresAuth?: boolean

Prompt To Fix With AI

This is a comment left during a code review.
Path: apps/sim/app/invite/[id]/invite.tsx
Line: 34:34

Comment:
**style:** `requiresSignup` is defined but never used in the error handling logic

```suggestion
  requiresAuth?: boolean
```

How can I resolve this? If you propose a fix, please make it concise.

[greptile-apps]

logic: check for 'already a member of an organization' will never execute because 'already a member' on line 154 matches first

Suggested change

	if (errorMessage.includes('already a member')) return 'already-member'
	if (errorMessage.includes('already a member of an organization')) return 'already-in-organization'
	if (errorMessage.includes('already a member of an organization')) return 'already-in-organization'
	if (errorMessage.includes('already a member')) return 'already-member'

Prompt To Fix With AI

This is a comment left during a code review.
Path: apps/sim/app/invite/[id]/invite.tsx
Line: 154:155

Comment:
**logic:** check for `'already a member of an organization'` will never execute because `'already a member'` on line 154 matches first

```suggestion
  if (errorMessage.includes('already a member of an organization')) return 'already-in-organization'
  if (errorMessage.includes('already a member')) return 'already-member'
```

How can I resolve this? If you propose a fix, please make it concise.

[emir-karabeg]

@greptile