OrganizationInvite.test.tsx 7.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249
  1. import { screen, waitFor } from '@testing-library/react'
  2. import userEvent from '@testing-library/user-event'
  3. import { beforeEach, describe, expect, test, vi } from 'vitest'
  4. import { OrganizationInvite } from '@/components/interfaces/OrganizationInvite/OrganizationInvite'
  5. import type { OrganizationInviteByToken } from '@/data/organization-members/organization-invitation-token-query'
  6. import type { ProfileContextType } from '@/lib/profile'
  7. import { render } from '@/tests/helpers'
  8. import type { ResponseError } from '@/types'
  9. const mocks = vi.hoisted(() => ({
  10. isLoggedIn: vi.fn(),
  11. useParams: vi.fn(),
  12. useProfile: vi.fn(),
  13. useProfileNameAndPicture: vi.fn(),
  14. useIsFeatureEnabled: vi.fn(),
  15. useInvitationQuery: vi.fn(),
  16. useAcceptInvitationMutation: vi.fn(),
  17. acceptInvitation: vi.fn(),
  18. signOut: vi.fn(),
  19. routerPush: vi.fn(),
  20. routerReload: vi.fn(),
  21. }))
  22. vi.mock('common', async (importOriginal) => {
  23. const actual = (await importOriginal()) as typeof import('common')
  24. return {
  25. ...actual,
  26. useIsLoggedIn: mocks.isLoggedIn,
  27. useParams: mocks.useParams,
  28. }
  29. })
  30. vi.mock('next/router', () => ({
  31. useRouter: () => ({
  32. isReady: true,
  33. push: mocks.routerPush,
  34. reload: mocks.routerReload,
  35. }),
  36. }))
  37. vi.mock('@/lib/profile', () => ({
  38. useProfile: mocks.useProfile,
  39. useProfileNameAndPicture: mocks.useProfileNameAndPicture,
  40. }))
  41. vi.mock('@/lib/auth', () => ({
  42. useSignOut: () => mocks.signOut,
  43. }))
  44. vi.mock('@/hooks/misc/useIsFeatureEnabled', () => ({
  45. useIsFeatureEnabled: mocks.useIsFeatureEnabled,
  46. }))
  47. vi.mock('@/data/organization-members/organization-invitation-token-query', () => ({
  48. useOrganizationInvitationTokenQuery: mocks.useInvitationQuery,
  49. }))
  50. vi.mock('@/data/organization-members/organization-invitation-accept-mutation', () => ({
  51. useOrganizationAcceptInvitationMutation: mocks.useAcceptInvitationMutation,
  52. }))
  53. const READY_INVITE: OrganizationInviteByToken = {
  54. authorized_user: true,
  55. email_match: true,
  56. expired_token: false,
  57. invite_id: 42,
  58. organization_name: 'Acme Corp',
  59. sso_mismatch: false,
  60. token_does_not_exist: false,
  61. }
  62. const PROFILE: ProfileContextType['profile'] = {
  63. id: 1,
  64. auth0_id: 'auth0|test',
  65. gotrue_id: 'gotrue-test',
  66. username: 'jane',
  67. primary_email: 'jane@acmecorp.io',
  68. first_name: null,
  69. last_name: null,
  70. mobile: null,
  71. is_alpha_user: false,
  72. is_sso_user: false,
  73. disabled_features: [],
  74. free_project_limit: null,
  75. }
  76. const responseError = (message: string, code = 500) => ({ message, code }) as ResponseError
  77. function setSignedInDefaults() {
  78. mocks.isLoggedIn.mockReturnValue(true)
  79. mocks.useParams.mockReturnValue({ slug: 'acme-corp', token: 'invite-token' })
  80. mocks.useProfile.mockReturnValue({
  81. profile: PROFILE,
  82. isLoading: false,
  83. })
  84. mocks.useProfileNameAndPicture.mockReturnValue({
  85. username: 'jane',
  86. primaryEmail: 'jane@acmecorp.io',
  87. avatarUrl: undefined,
  88. isLoading: false,
  89. })
  90. mocks.useIsFeatureEnabled.mockReturnValue(true)
  91. mocks.useInvitationQuery.mockReturnValue({
  92. data: READY_INVITE,
  93. error: null,
  94. isSuccess: true,
  95. isError: false,
  96. isPending: false,
  97. })
  98. mocks.useAcceptInvitationMutation.mockReturnValue({
  99. mutate: mocks.acceptInvitation,
  100. isPending: false,
  101. })
  102. }
  103. describe('OrganizationInvite', () => {
  104. beforeEach(() => {
  105. vi.clearAllMocks()
  106. setSignedInDefaults()
  107. })
  108. test('renders sign-in actions for signed-out users', () => {
  109. mocks.isLoggedIn.mockReturnValue(false)
  110. mocks.useProfile.mockReturnValue({ profile: null, isLoading: true })
  111. mocks.useProfileNameAndPicture.mockReturnValue({
  112. username: undefined,
  113. primaryEmail: undefined,
  114. avatarUrl: undefined,
  115. isLoading: false,
  116. })
  117. render(<OrganizationInvite />)
  118. expect(screen.getByText('View invitation')).toBeInTheDocument()
  119. expect(
  120. screen.getByText('Sign in or create an account to view this invitation')
  121. ).toBeInTheDocument()
  122. expect(screen.getByRole('link', { name: 'Sign in' })).toHaveAttribute(
  123. 'href',
  124. '/sign-in?returnTo=%2Fjoin%3Ftoken%3Dinvite-token%26slug%3Dacme-corp'
  125. )
  126. expect(screen.getByRole('link', { name: 'Create an account' })).toHaveAttribute(
  127. 'href',
  128. '/sign-up?returnTo=%2Fjoin%3Ftoken%3Dinvite-token%26slug%3Dacme-corp'
  129. )
  130. })
  131. test('renders a ready invite for the signed-in account', () => {
  132. render(<OrganizationInvite />)
  133. expect(screen.getByText('Join Acme Corp')).toBeInTheDocument()
  134. expect(
  135. screen.getByText('You have been invited to join this Briven organization')
  136. ).toBeInTheDocument()
  137. expect(screen.getByText('Signed in as')).toBeInTheDocument()
  138. expect(screen.getByText('jane@acmecorp.io')).toBeInTheDocument()
  139. expect(screen.getByRole('button', { name: 'Accept invite' })).toBeInTheDocument()
  140. expect(screen.getByRole('link', { name: 'Decline' })).toHaveAttribute('href', '/projects')
  141. })
  142. test('accepts an invite with the current slug and token', async () => {
  143. const user = userEvent.setup()
  144. render(<OrganizationInvite />)
  145. await user.click(screen.getByRole('button', { name: 'Accept invite' }))
  146. expect(mocks.acceptInvitation).toHaveBeenCalledWith({
  147. slug: 'acme-corp',
  148. token: 'invite-token',
  149. })
  150. })
  151. test('renders a wrong-account warning and signs out', async () => {
  152. const user = userEvent.setup()
  153. mocks.useInvitationQuery.mockReturnValue({
  154. data: { ...READY_INVITE, email_match: false },
  155. error: null,
  156. isSuccess: true,
  157. isError: false,
  158. isPending: false,
  159. })
  160. mocks.signOut.mockResolvedValue(undefined)
  161. render(<OrganizationInvite />)
  162. expect(screen.getByText('Wrong account')).toBeInTheDocument()
  163. expect(screen.queryByText('Join Acme Corp')).not.toBeInTheDocument()
  164. expect(
  165. screen.queryByText('You have been invited to join this Briven organization')
  166. ).not.toBeInTheDocument()
  167. expect(screen.getByText(/jane@acmecorp\.io/)).toBeInTheDocument()
  168. await user.click(screen.getByRole('button', { name: 'Sign out' }))
  169. await waitFor(() => expect(mocks.signOut).toHaveBeenCalled())
  170. expect(mocks.routerReload).toHaveBeenCalled()
  171. })
  172. test('renders no-longer-valid, invalid lookup, and generic error states', () => {
  173. mocks.useInvitationQuery.mockReturnValueOnce({
  174. data: undefined,
  175. error: responseError('Failed to retrieve organization', 401),
  176. isSuccess: false,
  177. isError: true,
  178. isPending: false,
  179. })
  180. const { rerender } = render(<OrganizationInvite />)
  181. expect(screen.getByText('Invite no longer available')).toBeInTheDocument()
  182. expect(
  183. screen.getByText('This invite has already been accepted or declined.')
  184. ).toBeInTheDocument()
  185. expect(screen.getByRole('link', { name: 'Back to dashboard' })).toHaveAttribute('href', '/')
  186. mocks.useInvitationQuery.mockReturnValueOnce({
  187. data: undefined,
  188. error: responseError('Not Found', 404),
  189. isSuccess: false,
  190. isError: true,
  191. isPending: false,
  192. })
  193. rerender(<OrganizationInvite />)
  194. expect(screen.getByText('Invite invalid')).toBeInTheDocument()
  195. expect(
  196. screen.getByText(
  197. 'Open the full invite link again, or ask the organization owner for a new invite.'
  198. )
  199. ).toBeInTheDocument()
  200. expect(screen.queryByText('Not Found')).not.toBeInTheDocument()
  201. mocks.useInvitationQuery.mockReturnValueOnce({
  202. data: undefined,
  203. error: responseError('Failed to retrieve token', 500),
  204. isSuccess: false,
  205. isError: true,
  206. isPending: false,
  207. })
  208. rerender(<OrganizationInvite />)
  209. expect(screen.getByText('Unable to load invitation')).toBeInTheDocument()
  210. expect(screen.getByText('Failed to retrieve token')).toBeInTheDocument()
  211. })
  212. })