fix(perps): rerender tabs when the amount of tabs changes cp-7.59.0

[michalconsensys]

Description

This PR fixes an issue in the Perps Market Tabs component where the TabsList wasn't properly re-rendering when the number of visible tabs changed.

Changelog

CHANGELOG entry: Fixed an issue where perps market tabs would not update correctly when the number of visible tabs changed

Related issues

Fixes: https://consensyssoftware.atlassian.net/browse/TAT-1982

Manual testing steps

Feature: Perps Market Tabs Rendering

  Scenario: user switches between market states that affect tab visibility
    Given user is on the perps market details view with active position
    
    When user closes their position or opens new positions
    Then the tabs should correctly update to reflect the current state (position tab should appear/disappear)
    And the active tab selection should remain consistent

Screenshots/Recordings

Before

No visible change

After

No visible change

Pre-merge author checklist

• I’ve followed MetaMask Contributor Docs and MetaMask Mobile Coding Standards.
• I've completed the PR template to the best of my ability
• I’ve included tests if applicable
• I’ve documented my code using JSDoc format if applicable
• I’ve applied the right labels on the PR (see labeling guidelines). Not required for external contributors.

Pre-merge reviewer checklist

• I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
• I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.

---

Note

Ensure TabsList remounts when the number of visible tabs changes by incorporating tabsToRender.length into the component key.

• Perps UI:
  • Tabs re-rendering: Update tabsKey in PerpsMarketTabs.tsx to tabs-${tabs.length}-${tabsToRender.length} so TabsList remounts when the visible tab count changes.

^{Written by Cursor Bugbot for commit e03f2b2. This will update automatically on new commits. Configure here.}

[github-actions]

CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes.

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
1 Accepted issue

Measures
0 Security Hotspots
100.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud