From bb69546ae8d8d58ca18e826c4f4d0b1d0b1f53dc Mon Sep 17 00:00:00 2001
From: lubega-deriv <142860499+lubega-deriv@users.noreply.github.com>
Date: Thu, 25 Jan 2024 13:34:00 +0800
Subject: [PATCH] [WALL] Lubega / WALL-2987 / TransactionStatusError unit test
 (#13061)

* chore: transaction status error unit test

* fix: applied comments

* Merge branch 'master' of github.com:binary-com/deriv-app into WALL-2987/transaction-status-error-unit-test

* fix: cleaned up code

* fix: rerun workflow
---
 .../__tests__/CryptoTransaction.spec.tsx      | 38 +++++++++----------
 .../__tests__/TransactionStatusError.spec.tsx | 28 ++++++++++++++
 2 files changed, 46 insertions(+), 20 deletions(-)
 create mode 100644 packages/wallets/src/features/cashier/modules/TransactionStatus/components/TransactionStatusError/__tests__/TransactionStatusError.spec.tsx

diff --git a/packages/wallets/src/features/cashier/modules/TransactionStatus/components/CryptoTransaction/__tests__/CryptoTransaction.spec.tsx b/packages/wallets/src/features/cashier/modules/TransactionStatus/components/CryptoTransaction/__tests__/CryptoTransaction.spec.tsx
index 147edb6e0d1d..24b8e5694b30 100644
--- a/packages/wallets/src/features/cashier/modules/TransactionStatus/components/CryptoTransaction/__tests__/CryptoTransaction.spec.tsx
+++ b/packages/wallets/src/features/cashier/modules/TransactionStatus/components/CryptoTransaction/__tests__/CryptoTransaction.spec.tsx
@@ -19,23 +19,22 @@ jest.mock('../../../../../../../components/ModalProvider', () => ({
 }));
 
 const mockTransaction = {
-    address_hash: '1234567890',
-    address_url: 'https://example.com/address',
+    address_hash: '',
+    address_url: '',
     amount: 0.0002,
-    description: 'Transaction description',
-    formatted_address_hash: 'abc123',
-    formatted_amount: '0.0002 BTC',
+    description: '',
+    formatted_address_hash: '',
+    formatted_amount: '',
     formatted_confirmations: 'Pending',
     formatted_transaction_hash: 'Pending',
-    id: '123',
+    id: '',
     is_deposit: false,
     is_valid_to_cancel: 1 as const,
     is_withdrawal: true,
     status_code: 'LOCKED' as const,
-    status_message:
-        "We're reviewing your withdrawal request. You may still cancel this transaction if you wish. Once we start processing, you won't be able to cancel.",
-    status_name: 'In review',
-    submit_date: 1705399737,
+    status_message: '',
+    status_name: '',
+    submit_date: 123456,
     transaction_type: 'withdrawal' as const,
 };
 
@@ -60,23 +59,22 @@ describe('CryptoTransaction', () => {
 
     it('should render component with correct properties for deposit type transaction', () => {
         const mockDepositTransaction = {
-            address_hash: '1234567890',
-            address_url: 'https://example.com/address',
+            address_hash: '',
+            address_url: '',
             amount: 0.0002,
-            description: 'Transaction description',
-            formatted_address_hash: 'abc123',
-            formatted_amount: '0.0002 BTC',
+            description: '',
+            formatted_address_hash: '',
+            formatted_amount: '',
             formatted_confirmations: 'Pending',
             formatted_transaction_hash: 'Pending',
-            id: '123',
+            id: '',
             is_deposit: true,
             is_valid_to_cancel: 1 as const,
             is_withdrawal: false,
             status_code: 'LOCKED' as const,
-            status_message:
-                "We're reviewing your deposit request. You may still cancel this transaction if you wish. Once we start processing, you won't be able to cancel.",
-            status_name: 'In review',
-            submit_date: 1705399737,
+            status_message: '',
+            status_name: '',
+            submit_date: 123456,
             transaction_type: 'withdrawal' as const,
         };
         (useCancelCryptoTransaction as jest.Mock).mockReturnValue({ mutate: jest.fn() });
diff --git a/packages/wallets/src/features/cashier/modules/TransactionStatus/components/TransactionStatusError/__tests__/TransactionStatusError.spec.tsx b/packages/wallets/src/features/cashier/modules/TransactionStatus/components/TransactionStatusError/__tests__/TransactionStatusError.spec.tsx
new file mode 100644
index 000000000000..a8c801884050
--- /dev/null
+++ b/packages/wallets/src/features/cashier/modules/TransactionStatus/components/TransactionStatusError/__tests__/TransactionStatusError.spec.tsx
@@ -0,0 +1,28 @@
+import React from 'react';
+import { fireEvent, render, screen } from '@testing-library/react';
+import TransactionStatusError from '../TransactionStatusError';
+
+describe('TransactionStatusError', () => {
+    it('should render component correctly', () => {
+        const mockRefresh = jest.fn();
+
+        render(<TransactionStatusError refresh={mockRefresh} />);
+
+        expect(screen.getByText('Unfortunately, we cannot retrieve the information at this time.')).toBeInTheDocument();
+        expect(screen.getByText('Refresh')).toBeInTheDocument();
+    });
+
+    it('should render refresh function on click of refresh button', () => {
+        const mockRefresh = jest.fn();
+
+        render(<TransactionStatusError refresh={mockRefresh} />);
+
+        expect(screen.getByText('Unfortunately, we cannot retrieve the information at this time.')).toBeInTheDocument();
+
+        const refreshButton = screen.getByText('Refresh');
+        expect(refreshButton).toBeInTheDocument();
+
+        fireEvent.click(refreshButton);
+        expect(mockRefresh).toHaveBeenCalledTimes(1);
+    });
+});