Skip to content

Commit

Permalink
fix tabs cut after API data is loaded
Browse files Browse the repository at this point in the history
  • Loading branch information
tom2drum committed Apr 24, 2024
1 parent d5925ba commit 05b0c04
Showing 1 changed file with 5 additions and 3 deletions.
8 changes: 5 additions & 3 deletions ui/shared/Tabs/TabsWithScroll.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -91,10 +91,12 @@ const TabsWithScroll = ({
lazyBehavior={ lazyBehavior }
>
<AdaptiveTabsList
// the easiest and most readable way to achieve correct tab's cut recalculation when screen is resized
// the easiest and most readable way to achieve correct tab's cut recalculation when
// - screen is resized or
// - tabs list is changed when API data is loaded
// is to do full re-render of the tabs list
// so we use screenWidth as a key for the TabsList component
key={ screenWidth }
// so we use screenWidth + tabIds as a key for the TabsList component
key={ screenWidth + '_' + tabsList.map((tab) => tab.id).join(':') }
tabs={ tabs }
tabListProps={ tabListProps }
rightSlot={ rightSlot }
Expand Down

0 comments on commit 05b0c04

Please sign in to comment.