Set `lazy` prop for initial active tab
What does this MR do and why?
Related to #23466 (closed)
The lazy
prop on GlTab
determines if the child components should be hidden when the tab is not active. For the group overview tabs an API call is made when the child component is rendered so we want to set the lazy
prop to true
for all non-active tabs. Previously this prop was hardcoded so that the first tab was set to false
and other tabs were set to true
. In !97316 (merged) we add Vue router to the tabs but didn't update the lazy
prop. This MR makes it so the lazy
prop is dynamically set depending on which tab is loaded first (determined by the route).
Screenshots or screen recordings
Notice how the first tab is already loaded in the Before
when it shouldn't be
Before | After |
---|---|
Screen_Recording_2022-10-05_at_2.21.31_PM | Screen_Recording_2022-10-05_at_2.21.03_PM |
How to set up and validate locally
- Enable
group_overview_tabs_vue
feature flagbin/rails console
Feature.enable(:group_overview_tabs_vue)
- Go to a group overview. e.g http://gdk.test:3000/flightjs
MR acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
-
I have evaluated the MR acceptance checklist for this MR.