From bbbeaf6684c7550feb351b18227b692167832e4e Mon Sep 17 00:00:00 2001 From: Akansha Sakhre Date: Mon, 9 Sep 2024 12:29:07 +0530 Subject: [PATCH 1/4] added the api --- src/containers/Chat/ChatMessages/StatusBar/StatusBar.tsx | 4 ++++ src/graphql/queries/WaGroups.ts | 9 +++++++++ 2 files changed, 13 insertions(+) diff --git a/src/containers/Chat/ChatMessages/StatusBar/StatusBar.tsx b/src/containers/Chat/ChatMessages/StatusBar/StatusBar.tsx index e9c0d6101..d2fb0b6c9 100644 --- a/src/containers/Chat/ChatMessages/StatusBar/StatusBar.tsx +++ b/src/containers/Chat/ChatMessages/StatusBar/StatusBar.tsx @@ -3,6 +3,7 @@ import { useQuery } from '@apollo/client'; import { getUserSession } from 'services/AuthService'; import { BSPBALANCE, GET_ORGANIZATION_STATUS } from 'graphql/queries/Organization'; import styles from './StatusBar.module.css'; +import { GET_WA_MANAGED_PHONES, GET_WA_MANAGED_PHONES_STATUS } from 'graphql/queries/WaGroups'; const StatusBar = () => { const variables = { organizationId: getUserSession('organizationId') }; @@ -15,6 +16,9 @@ const StatusBar = () => { fetchPolicy: 'cache-only', }); + const { data } = useQuery(GET_WA_MANAGED_PHONES_STATUS); + console.log(data); + if (!balanceData && !orgStatus) { return null; } diff --git a/src/graphql/queries/WaGroups.ts b/src/graphql/queries/WaGroups.ts index 3d4b82bba..bce6e7051 100644 --- a/src/graphql/queries/WaGroups.ts +++ b/src/graphql/queries/WaGroups.ts @@ -181,3 +181,12 @@ export const GET_WA_GROUP = gql` } } `; + +export const GET_WA_MANAGED_PHONES_STATUS = gql` + query WaManagedPhones { + waManagedPhones { + status + phone + } + } +`; From 3c524af00049b302ffa0226e9e6c5de8a76165ca Mon Sep 17 00:00:00 2001 From: Akansha Sakhre Date: Tue, 10 Sep 2024 15:59:19 +0530 Subject: [PATCH 2/4] added notification if phone is inactive --- src/containers/Chat/ChatMessages/StatusBar/StatusBar.tsx | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/src/containers/Chat/ChatMessages/StatusBar/StatusBar.tsx b/src/containers/Chat/ChatMessages/StatusBar/StatusBar.tsx index d2fb0b6c9..c73b0e401 100644 --- a/src/containers/Chat/ChatMessages/StatusBar/StatusBar.tsx +++ b/src/containers/Chat/ChatMessages/StatusBar/StatusBar.tsx @@ -3,9 +3,11 @@ import { useQuery } from '@apollo/client'; import { getUserSession } from 'services/AuthService'; import { BSPBALANCE, GET_ORGANIZATION_STATUS } from 'graphql/queries/Organization'; import styles from './StatusBar.module.css'; -import { GET_WA_MANAGED_PHONES, GET_WA_MANAGED_PHONES_STATUS } from 'graphql/queries/WaGroups'; +import { GET_WA_MANAGED_PHONES_STATUS } from 'graphql/queries/WaGroups'; +import { useLocation } from 'react-router'; const StatusBar = () => { + const location = useLocation(); const variables = { organizationId: getUserSession('organizationId') }; // get gupshup balance @@ -17,7 +19,7 @@ const StatusBar = () => { }); const { data } = useQuery(GET_WA_MANAGED_PHONES_STATUS); - console.log(data); + const hasInactivePhone = data?.waManagedPhones?.some((phone: any) => phone.status !== 'active'); if (!balanceData && !orgStatus) { return null; @@ -36,6 +38,9 @@ const StatusBar = () => { } else if (balance <= 0) { statusMessage = 'All the outgoing messages have been suspended. Please note: on recharging, the messages that were stuck will not be sent.'; + } else if (hasInactivePhone && location.pathname.includes('group')) { + statusMessage = + 'One or more of your phones are not active. Please check the status of your phones to ensure smooth message delivery.'; } } From e6cf854707ceefe832555ce6b6669e45583ea4dd Mon Sep 17 00:00:00 2001 From: Akansha Sakhre Date: Tue, 10 Sep 2024 16:27:47 +0530 Subject: [PATCH 3/4] added test cases --- .../ChatMessages/StatusBar/StatusBar.test.tsx | 80 +++++++++++++++++++ .../Chat/ChatMessages/StatusBar/StatusBar.tsx | 2 +- src/mocks/StatusBar.ts | 50 ++++++++++++ 3 files changed, 131 insertions(+), 1 deletion(-) create mode 100644 src/containers/Chat/ChatMessages/StatusBar/StatusBar.test.tsx create mode 100644 src/mocks/StatusBar.ts diff --git a/src/containers/Chat/ChatMessages/StatusBar/StatusBar.test.tsx b/src/containers/Chat/ChatMessages/StatusBar/StatusBar.test.tsx new file mode 100644 index 000000000..79d6590f0 --- /dev/null +++ b/src/containers/Chat/ChatMessages/StatusBar/StatusBar.test.tsx @@ -0,0 +1,80 @@ +import { MemoryRouter } from 'react-router'; +import { render, screen, waitFor } from '@testing-library/react'; +import { InMemoryCache } from '@apollo/client'; +import { MockedProvider } from '@apollo/client/testing'; +import { BSPBALANCE } from 'graphql/queries/Organization'; +import { + getInactiveStatusMock, + getWhatsAppManagedPhonesStatusMock, + orgSuspendedMock, +} from 'mocks/StatusBar'; +import StatusBar from './StatusBar'; + +const cache = new InMemoryCache({ + addTypename: false, +}); + +const wrapper = (bspbalance: string, mock?: any) => { + cache.writeQuery({ + query: BSPBALANCE, + variables: { orgId: '1' }, + data: { + bspbalance, + }, + }); + + let MOCKS = [orgSuspendedMock]; + if (mock) { + MOCKS = [...MOCKS, mock]; + } + return ( + + + + + + ); +}; + +beforeEach(() => { + cache.reset(); +}); + +test('it should show error message if balance is below 1', async () => { + render(wrapper('{"balance":0.5}', getWhatsAppManagedPhonesStatusMock)); + + await waitFor(() => { + expect(screen.getByTestId('status-bar')).toBeInTheDocument(); + expect( + screen.getByText( + 'Please recharge your Gupshup wallet immediately to continue sending messages. Users will not receive the messages that get stuck during this time.' + ) + ).toBeInTheDocument(); + }); +}); + +test('it should show suspended message if balance is negative', async () => { + render(wrapper('{"balance":-1.4}', getWhatsAppManagedPhonesStatusMock)); + + await waitFor(() => { + expect(screen.getByTestId('status-bar')).toBeInTheDocument(); + expect( + screen.getByText( + 'All the outgoing messages have been suspended. Please note: on recharging, the messages that were stuck will not be sent.' + ) + ).toBeInTheDocument(); + }); +}); + +test('it should show suspended message if balance is negative', async () => { + render(wrapper('{"balance":14.17}', getInactiveStatusMock)); + + await waitFor(() => { + expect(screen.getByTestId('status-bar')).toBeInTheDocument(); + expect( + screen.getByText( + 'One or more of your phones are not active. Please check the status of your phones to ensure smooth message delivery.' + ) + ).toBeInTheDocument(); + }); +}); diff --git a/src/containers/Chat/ChatMessages/StatusBar/StatusBar.tsx b/src/containers/Chat/ChatMessages/StatusBar/StatusBar.tsx index c73b0e401..2eb860dcc 100644 --- a/src/containers/Chat/ChatMessages/StatusBar/StatusBar.tsx +++ b/src/containers/Chat/ChatMessages/StatusBar/StatusBar.tsx @@ -46,7 +46,7 @@ const StatusBar = () => { if (statusMessage) { return ( -
+
Attention! {statusMessage}
diff --git a/src/mocks/StatusBar.ts b/src/mocks/StatusBar.ts new file mode 100644 index 000000000..3769349b2 --- /dev/null +++ b/src/mocks/StatusBar.ts @@ -0,0 +1,50 @@ +import { GET_ORGANIZATION_STATUS } from 'graphql/queries/Organization'; +import { GET_WA_MANAGED_PHONES_STATUS } from 'graphql/queries/WaGroups'; + +export const orgSuspendedMock = { + request: { + query: GET_ORGANIZATION_STATUS, + }, + result: { + data: { + organization: { + organization: { + isSuspended: false, + }, + }, + }, + }, +}; + +export const getWhatsAppManagedPhonesStatusMock = { + request: { + query: GET_WA_MANAGED_PHONES_STATUS, + }, + result: { + data: { + waManagedPhones: [ + { + phone: '918658048983', + status: 'active', + }, + ], + }, + }, +}; + +export const getInactiveStatusMock = { + request: { + query: GET_WA_MANAGED_PHONES_STATUS, + variables: {}, + }, + result: { + data: { + waManagedPhones: [ + { + phone: '918658048983', + status: 'inactive', + }, + ], + }, + }, +}; From 468df7bee6773c1d8d7528d2b7c5be207e1936b0 Mon Sep 17 00:00:00 2001 From: Akansha Sakhre Date: Tue, 10 Sep 2024 16:43:20 +0530 Subject: [PATCH 4/4] added mock and updated message --- src/containers/Chat/ChatMessages/ChatMessages.test.tsx | 2 ++ src/containers/Chat/ChatMessages/StatusBar/StatusBar.test.tsx | 2 +- src/containers/Chat/ChatMessages/StatusBar/StatusBar.tsx | 2 +- 3 files changed, 4 insertions(+), 2 deletions(-) diff --git a/src/containers/Chat/ChatMessages/ChatMessages.test.tsx b/src/containers/Chat/ChatMessages/ChatMessages.test.tsx index 1a032a6ed..e5f8e119b 100644 --- a/src/containers/Chat/ChatMessages/ChatMessages.test.tsx +++ b/src/containers/Chat/ChatMessages/ChatMessages.test.tsx @@ -24,6 +24,7 @@ import { userEvent } from '@testing-library/user-event'; import { setNotification } from 'common/notification'; import { waGroup, waGroupcollection } from 'mocks/Groups'; import { getContactSearchQuery } from 'mocks/Search'; +import { getWhatsAppManagedPhonesStatusMock } from 'mocks/StatusBar'; vi.mock('common/notification', async (importOriginal) => { const mod = await importOriginal(); @@ -258,6 +259,7 @@ const mocks = [ loadMoreQuery(0, 40, { id: '2', searchGroup: true }), markAsReadMock('2'), markAsReadMock('3'), + getWhatsAppManagedPhonesStatusMock, ]; export const chatMocks = mocks; diff --git a/src/containers/Chat/ChatMessages/StatusBar/StatusBar.test.tsx b/src/containers/Chat/ChatMessages/StatusBar/StatusBar.test.tsx index 79d6590f0..8bb34b2a9 100644 --- a/src/containers/Chat/ChatMessages/StatusBar/StatusBar.test.tsx +++ b/src/containers/Chat/ChatMessages/StatusBar/StatusBar.test.tsx @@ -73,7 +73,7 @@ test('it should show suspended message if balance is negative', async () => { expect(screen.getByTestId('status-bar')).toBeInTheDocument(); expect( screen.getByText( - 'One or more of your phones are not active. Please check the status of your phones to ensure smooth message delivery.' + 'One or more of your phones are not active. Please check the Maytapi console to ensure smooth message delivery.' ) ).toBeInTheDocument(); }); diff --git a/src/containers/Chat/ChatMessages/StatusBar/StatusBar.tsx b/src/containers/Chat/ChatMessages/StatusBar/StatusBar.tsx index 2eb860dcc..f11dc37f4 100644 --- a/src/containers/Chat/ChatMessages/StatusBar/StatusBar.tsx +++ b/src/containers/Chat/ChatMessages/StatusBar/StatusBar.tsx @@ -40,7 +40,7 @@ const StatusBar = () => { 'All the outgoing messages have been suspended. Please note: on recharging, the messages that were stuck will not be sent.'; } else if (hasInactivePhone && location.pathname.includes('group')) { statusMessage = - 'One or more of your phones are not active. Please check the status of your phones to ensure smooth message delivery.'; + 'One or more of your phones are not active. Please check the Maytapi console to ensure smooth message delivery.'; } }