diff --git a/packages/components/src/components/contract-card/contract-card-items/contract-card-sell.tsx b/packages/components/src/components/contract-card/contract-card-items/contract-card-sell.tsx
index cb6c8778190c..a7f663e99434 100644
--- a/packages/components/src/components/contract-card/contract-card-items/contract-card-sell.tsx
+++ b/packages/components/src/components/contract-card/contract-card-items/contract-card-sell.tsx
@@ -32,6 +32,7 @@ const ContractCardSell = ({ contract_info, getCardLabels, is_sell_requested, onC
className={classNames('dc-btn--sell', {
'dc-btn--loading': is_sell_requested,
})}
+ data-testid='dt_contract_card_sell'
is_disabled={is_sell_requested}
text={getCardLabels().SELL}
onClick={onClick}
diff --git a/packages/reports/src/Components/__tests__/empty-trade-history-message.spec.tsx b/packages/reports/src/Components/__tests__/empty-trade-history-message.spec.tsx
new file mode 100644
index 000000000000..8a9c5f3d7017
--- /dev/null
+++ b/packages/reports/src/Components/__tests__/empty-trade-history-message.spec.tsx
@@ -0,0 +1,30 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import EmptyTradeHistoryMessage from '../empty-trade-history-message';
+
+const mockProps = {
+ component_icon: 'calendar',
+ has_selected_date: false,
+ localized_message: 'No trades in your history yet.',
+ localized_period_message: 'No trades for the selected period.',
+};
+
+describe('EmptyTradeHistoryMessage component', () => {
+ it('should render the message without a selected date', () => {
+ render();
+
+ const icon = screen.getByTestId('dt_empty_trade_history_icon');
+ const text = screen.getByText(mockProps.localized_message);
+
+ expect(icon).toBeInTheDocument();
+ expect(text).toBeInTheDocument();
+ });
+
+ it('should render the message for a selected date', () => {
+ render();
+
+ const text = screen.getByText(mockProps.localized_period_message);
+
+ expect(text).toBeInTheDocument();
+ });
+});
diff --git a/packages/reports/src/Components/__tests__/indicative-cell.spec.tsx b/packages/reports/src/Components/__tests__/indicative-cell.spec.tsx
new file mode 100644
index 000000000000..9c47d0377f37
--- /dev/null
+++ b/packages/reports/src/Components/__tests__/indicative-cell.spec.tsx
@@ -0,0 +1,72 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import { mockStore } from '@deriv/stores';
+import ReportsProviders from '../../reports-providers';
+import IndicativeCell from '../indicative-cell';
+
+const customStore = mockStore({
+ portfolio: {
+ onClickSell: jest.fn(),
+ },
+});
+
+const mockProps = {
+ amount: 100.01,
+ contract_info: { id: '123' },
+ currency: 'USD',
+ is_footer: false,
+ is_sell_requested: false,
+ profit: '5.23',
+};
+
+describe('IndicativeCell component', () => {
+ it('should render the amount and arrow indicator', () => {
+ render(
+
+
+
+ );
+
+ const amountElement = screen.getByText(Math.abs(mockProps.amount).toString());
+ const arrow = screen.getByTestId('dt_arrow_indicator');
+
+ expect(amountElement).toBeInTheDocument();
+ expect(arrow).toBeInTheDocument();
+ });
+
+ it('should render the profit amount with a profit class', () => {
+ render(
+
+
+
+ );
+
+ const amountContainer = screen.getByTestId('dt_amount_container');
+
+ expect(amountContainer).toHaveClass('dc-contract-card--profit');
+ });
+
+ it('should render the loss amount with a loss class', () => {
+ render(
+
+
+
+ );
+
+ const amountContainer = screen.getByTestId('dt_amount_container');
+
+ expect(amountContainer).toHaveClass('dc-contract-card--loss');
+ });
+
+ it('should not render the ContractCard.Sell component for footer cells', () => {
+ render(
+
+
+
+ );
+
+ const sellButton = screen.queryByTestId('dt_contract_card_sell');
+
+ expect(sellButton).not.toBeInTheDocument();
+ });
+});
diff --git a/packages/reports/src/Components/indicative-cell.tsx b/packages/reports/src/Components/indicative-cell.tsx
index c0d196f377bd..7c16bdf7da72 100644
--- a/packages/reports/src/Components/indicative-cell.tsx
+++ b/packages/reports/src/Components/indicative-cell.tsx
@@ -27,10 +27,11 @@ const IndicativeCell = observer((props: TIndicativeCell) => {
'dc-contract-card--profit': Number(profit) > 0,
'dc-contract-card--loss': Number(profit) < 0,
})}
+ data-testid='dt_amount_container'
>
-
+
{!is_footer && (