feat(ui): implement new invitations menu, view, dialogs and management system

[luizhf42]

This PR introduces a complete invitations management system for team collaboration, separating invitation logic from the members module and providing a comprehensive UI for both managing and responding to namespace invitations.

🎯 Overview

• Created dedicated invitations store and API layer
• Built invitations menu for users to view and respond to pending invitations
• Implemented full-featured invitations management view for namespace administrators
• Added comprehensive test coverage for all new components

✨ New Features

1. Invitations Store & API Layer

• New Store: store/modules/invitations.ts - Centralized state management for invitations
• New API Layer: store/api/invitations.ts - Separated invitation-related API calls
• Interface: interfaces/IInvitation.ts - Type definitions for invitation entities
• Actions:
  • fetchUserPendingInvitationList - Get user's pending invitations
  • fetchNamespaceInvitationList - Get namespace's sent invitations
  • acceptInvitation / declineInvitation - Respond to invitations
  • editInvitation / cancelInvitation - Manage sent invitations
  • sendInvitationEmail / generateInvitationLink - Create invitations

2. User-Facing Invitations Menu

• Component: InvitationsMenu.vue - Dropdown menu in AppBar for pending invitations

• Features:

  • Badge indicator showing pending invitation count
  • Side drawer with list of pending invitations
  • Quick accept/decline actions from the menu
  • Auto-refresh on drawer open
  • Empty state when no pending invitations

• Sub-Components:

  • InvitationsMenuItem.vue - Individual invitation item with expandable details
  • InvitationAccept.vue - Accept invitation dialog with confirmation
  • InvitationDecline.vue - Decline invitation dialog with warning

3. Admin Invitations Management View

• View: TeamInvitations.vue - Full invitations management page

• Features:

  • Status filter (Pending, Cancelled, Accepted, Rejected) in header
  • Integrated "Invite Member" button
  • Comprehensive invitations table with sorting and pagination

• Component: InvitationList.vue - DataTable for displaying invitations

  • Displays: email, role, status, created_at, expires_at
  • Color-coded status chips
  • Conditional actions menu based on invitation status
  • Tooltips for non-actionable invitations

• Action Components:

  • InvitationEdit.vue - Edit invitation role (pending only)
  • InvitationCancel.vue - Cancel invitation (pending only)
  • InvitationResend.vue - Resend invitation (expired pending or cancelled)
    • Smart enable/disable: only enabled for cancelled invitations or expired pending invitations

4. Utilities

• utils/invitations.ts - Helper functions:
  • isInvitationExpired - Check if invitation has expired
  • getInvitationStatusFilter - Generate filter for API calls
  • orderInvitationsByCreatedAt - Sort invitations by creation date

🔄 Refactoring

Member Module

• Removed status field from INamespaceMember interface
• Removed status column from MemberList.vue table
• Updated MemberInvite.vue to use invitationsStore instead of namespacesStore

Namespaces Module

• Removed invitation-related actions from namespacesStore (sendEmailInvitation, generateInvitationLink, acceptInvite)
• Removed invitation-related interfaces (INamespaceAddMember, INamespaceAcceptInvite)
• Cleaned up API layer to focus purely on namespace management

NamespaceInviteCard

• Updated to use the new invitationsStore for accept/decline actions
• Improved UX with a separate decline button and confirmation

🧪 Testing

Comprehensive test suite following existing patterns:

• InvitationsMenu.spec.ts - Menu drawer toggle, badge display, fetching
• InvitationsMenuItem.spec.ts - Individual item display and events
• InvitationList.spec.ts - List rendering, loading, actions visibility
• InvitationEdit.spec.ts - Edit functionality, success/error scenarios
• InvitationCancel.spec.ts - Cancel with proper API mocking
• InvitationResend.spec.ts - Resend for expired/cancelled invitations

🎨 UX Improvements

1. Clear Status Indication: Color-coded chips for invitation statuses
2. Smart Action Availability: Actions only shown when applicable
3. Helpful Tooltips: Explain why certain actions are disabled
4. Permission Guards: UI respects user authorization levels
5. Responsive Design: Works on different screen sizes with Vuetify's responsive utilities
6. Loading States: Proper loading indicators during async operations
7. Error Handling: User-friendly error messages for all failure scenarios