chore: remove max ticks from contract card in open positions and contract details page

Author: nijil-deriv

packages/components/src/components/contract-card/contract-card-items/__tests__/tick-counter-bar.spec.tsx

@@ -6,12 +6,11 @@ describe('TickCounterBar', () => {
     const mock_props = {
         current_tick: 12345,
         label: 'Ticks',
-        max_ticks_duration: 67890,
     };
     it('should render properly', () => {
         render(<TickCounterBar {...mock_props} />);
 
-        const ticks_info_el = screen.getByText('12345/67890 Ticks');
+        const ticks_info_el = screen.getByText('12345 Ticks');
         expect(ticks_info_el).toHaveClass('dc-tick-counter-bar__text');
     });
 });

packages/components/src/components/contract-card/contract-card-items/contract-card-header.tsx

@@ -173,13 +173,7 @@ const ContractCardHeader = ({
                     ) : null}
                 </MobileWrapper>
             </div>
-            {!is_sold && is_accumulator && (
-                <TickCounterBar
-                    current_tick={tick_passed}
-                    max_ticks_duration={tick_count}
-                    label={getCardLabels().TICKS}
-                />
-            )}
+            {!is_sold && is_accumulator && <TickCounterBar current_tick={tick_passed} label={getCardLabels().TICKS} />}
             <MobileWrapper>
                 <div className='dc-progress-slider--completed' />
             </MobileWrapper>

packages/components/src/components/contract-card/contract-card-items/tick-counter-bar.tsx

@@ -4,13 +4,12 @@ import Text from '../../text';
 type TTickCounterBar = {
     current_tick?: number;
     label: string;
-    max_ticks_duration?: number;
 };
-const TickCounterBar = ({ current_tick, label, max_ticks_duration }: TTickCounterBar) => (
+const TickCounterBar = ({ current_tick, label }: TTickCounterBar) => (
     <div className='dc-tick-counter-bar__container'>
         <div className='dc-tick-counter-bar__track'>
             <Text size='xxs' weight='bold' align='center' color='profit-success' className='dc-tick-counter-bar__text'>
-                {`${current_tick}/${max_ticks_duration} ${label}`}
+                {`${current_tick} ${label}`}
             </Text>
         </div>
     </div>

packages/trader/src/AppV2/Components/ContractCard/__tests__/contract-card-status-timer.spec.tsx

@@ -23,9 +23,9 @@ describe('ContractCardStatusTimer', () => {
         expect(screen.getByText('00:16:40')).toBeInTheDocument();
     });
     it('should render ticks progress if currentTick and tick_count are passed', () => {
-        render(<ContractCardStatusTimer {...mockProps} currentTick={2} tick_count={10} />);
+        render(<ContractCardStatusTimer {...mockProps} currentTick={2} />);
 
-        expect(screen.getByText('2/10 ticks')).toBeInTheDocument();
+        expect(screen.getByText('2 ticks')).toBeInTheDocument();
     });
     it('should render Closed status if isSold === true', () => {
         render(<ContractCardStatusTimer {...mockProps} isSold />);

packages/trader/src/AppV2/Components/ContractCard/__tests__/contract-card.spec.tsx

@@ -389,12 +389,12 @@ describe('ContractCard', () => {
         expect(screen.getByText('Accumulators')).toBeInTheDocument();
         expect(screen.getByText(symbolName)).toBeInTheDocument();
         expect(screen.getByText('9.00 USD')).toBeInTheDocument();
-        expect(screen.getByText('9/230 ticks')).toBeInTheDocument();
+        expect(screen.getByText('9 ticks')).toBeInTheDocument();
         expect(screen.getByText('0.84 USD')).toBeInTheDocument();
         expect(screen.getByRole('button', { name: CLOSE })).toBeEnabled();
         expect(screen.queryByRole('button', { name: CANCEL })).not.toBeInTheDocument();
     });
-    it('should show loader when a Close button is clicked and isSellRequested === true', () => {
+    it('should show loader when a Close button is clicked and isSellRequested === true', async () => {
         const mockedOnClose = jest.fn();
         const { rerender } = render(
             mockedContractCard({
@@ -404,7 +404,7 @@ describe('ContractCard', () => {
             })
         );
         const closeButton = screen.getByRole('button', { name: getCardLabels().CLOSE });
-        userEvent.click(closeButton);
+        await userEvent.click(closeButton);
         expect(mockedOnClose).toHaveBeenCalledTimes(1);
 
         rerender(
@@ -417,7 +417,7 @@ describe('ContractCard', () => {
         expect(screen.getByTestId(buttonLoaderId)).toBeInTheDocument();
         expect(closeButton).toBeDisabled();
     });
-    it('should show loader when a Cancel button is clicked and isSellRequested === true', () => {
+    it('should show loader when a Cancel button is clicked and isSellRequested === true', async () => {
         const mockedOnCancel = jest.fn();
         const { rerender } = render(
             mockedContractCard({
@@ -427,7 +427,7 @@ describe('ContractCard', () => {
             })
         );
         const cancelButton = screen.getByRole('button', { name: CANCEL });
-        userEvent.click(cancelButton);
+        await userEvent.click(cancelButton);
         expect(mockedOnCancel).toHaveBeenCalledTimes(1);
 
         rerender(
@@ -452,7 +452,7 @@ describe('ContractCard', () => {
         expect(screen.queryByRole('button', { name: CLOSE })).not.toBeInTheDocument();
         expect(screen.queryByRole('button', { name: CANCEL })).not.toBeInTheDocument();
     });
-    it('should call onClick when a card is clicked, and should redirect to a correct route if redirectTo is passed', () => {
+    it('should call onClick when a card is clicked, and should redirect to a correct route if redirectTo is passed', async () => {
         const mockedOnClick = jest.fn();
         const redirectTo = getContractPath(Number(closedPositions[0].contract_info.contract_id));
         render(
@@ -464,11 +464,11 @@ describe('ContractCard', () => {
             })
         );
         const card = screen.getByText('Turbos Up');
-        userEvent.click(card);
+        await userEvent.click(card);
         expect(mockedOnClick).toHaveBeenCalledTimes(1);
         expect(history.location.pathname).toBe(redirectTo);
     });
-    it('should call onClick when a card is clicked, but should not redirect anywhere if redirectTo prop is missing', () => {
+    it('should call onClick when a card is clicked, but should not redirect anywhere if redirectTo prop is missing', async () => {
         const mockedOnClick = jest.fn();
         const redirectTo = getContractPath(Number(closedPositions[0].contract_info.contract_id));
         render(
@@ -479,7 +479,7 @@ describe('ContractCard', () => {
             })
         );
         const card = screen.getByText('Turbos Up');
-        userEvent.click(card);
+        await userEvent.click(card);
         expect(mockedOnClick).toHaveBeenCalledTimes(1);
         expect(history.location.pathname).not.toBe(redirectTo);
     });

packages/trader/src/AppV2/Components/ContractCard/contract-card-status-timer.tsx

@@ -17,11 +17,10 @@ export const ContractCardStatusTimer = ({
     date_expiry,
     isSold,
     serverTime,
-    tick_count,
 }: TContractCardStatusTimerProps) => {
     const getDisplayedDuration = () => {
-        if (tick_count) {
-            return `${currentTick ?? 0}/${tick_count} ${getCardLabels().TICKS.toLowerCase()}`;
+        if (currentTick) {
+            return `${currentTick ?? 0} ${getCardLabels().TICKS.toLowerCase()}`;
         }
         if (date_expiry && serverTime) {
             return (