Open OnBoardingModal for modals requiring a membership (#4859)

* fix: replace modal * add case with wallet
Joystream · Aug 10, 2024 · ba71f51 · ba71f51
1 parent 0a8ee99
commit ba71f51
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 24 deletions.
diff --git a/packages/ui/src/app/GlobalModals.tsx b/packages/ui/src/app/GlobalModals.tsx
@@ -3,6 +3,7 @@ import React, { memo, ReactElement, useEffect, useMemo, useState } from 'react'
 import ReactDOM from 'react-dom'
 import styled from 'styled-components'
 
+import { useMyAccounts } from '@/accounts/hooks/useMyAccounts'
 import { ClaimVestingModalCall } from '@/accounts/modals/ClaimVestingModal'
 import { ClaimVestingModal } from '@/accounts/modals/ClaimVestingModal/ClaimVestingModal'
 import { MoveFundsModal, MoveFundsModalCall } from '@/accounts/modals/MoveFundsModal'
@@ -225,6 +226,7 @@ export const GlobalModals = () => {
   const { active: activeMember } = useMyMemberships()
   const { status } = useTransactionStatus()
   const Modal = useMemo(() => (modal && modal in modals ? memo(() => modals[modal as ModalNames]) : null), [modal])
+  const { wallet } = useMyAccounts()
 
   const [container, setContainer] = useState(document.body)
   useEffect(() => {
@@ -235,13 +237,19 @@ export const GlobalModals = () => {
   const potentialFallback = useGlobalModalHandler(currentModalMachine, hideModal)
 
   if (modal && !GUEST_ACCESSIBLE_MODALS.includes(modal as ModalNames) && !activeMember) {
-    showModal<SwitchMemberModalCall>({
-      modal: 'SwitchMember',
-      data: {
-        originalModalName: modal as ModalNames,
-        originalModalData: modalData,
-      },
-    })
+    if (wallet) {
+      showModal<SwitchMemberModalCall>({
+        modal: 'SwitchMember',
+        data: {
+          originalModalName: modal as ModalNames,
+          originalModalData: modalData,
+        },
+      })
+    } else {
+      showModal({
+        modal: 'OnBoardingModal',
+      })
+    }
     return null
   }
 

diff --git a/packages/ui/test/council/modals/AnnounceCandidacyModal.test.tsx b/packages/ui/test/council/modals/AnnounceCandidacyModal.test.tsx
@@ -109,16 +109,12 @@ describe('UI: Announce Candidacy Modal', () => {
 
       renderModal()
 
-      const switchMemberModalCall = {
-        modal: 'SwitchMember',
-        data: {
-          originalModalName: 'AnnounceCandidateModal',
-          originalModalData: null,
-        },
+      const onBoardingModalCall = {
+        modal: 'OnBoardingModal',
       }
 
       expect(showModal).toBeCalledTimes(1)
-      expect(showModal).toBeCalledWith({ ...switchMemberModalCall })
+      expect(showModal).toBeCalledWith({ ...onBoardingModalCall })
     })
 
     it('Transaction fee', async () => {

diff --git a/packages/ui/test/forum/modals/CreateThreadModal.test.tsx b/packages/ui/test/forum/modals/CreateThreadModal.test.tsx
@@ -80,11 +80,7 @@ describe('CreateThreadModal', () => {
       useMyMemberships.active = undefined
       renderModal()
       expect(useModal.showModal).toBeCalledWith({
-        modal: 'SwitchMember',
-        data: {
-          originalModalName: 'CreateThreadModal',
-          originalModalData: useModal.modalData,
-        },
+        modal: 'OnBoardingModal',
       })
     })
 

diff --git a/packages/ui/test/working-groups/modals/ApplyForRoleModal.test.tsx b/packages/ui/test/working-groups/modals/ApplyForRoleModal.test.tsx
@@ -135,11 +135,7 @@ describe('UI: ApplyForRoleModal', () => {
       await renderModal()
 
       expect(showModal).toBeCalledWith({
-        modal: 'SwitchMember',
-        data: {
-          originalModalData: modalData,
-          originalModalName: 'ApplyForRoleModal',
-        },
+        modal: 'OnBoardingModal',
       })
       showModal.mockClear()
     })