-
Notifications
You must be signed in to change notification settings - Fork 14.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[dashboard] trigger query for chart in nested tab only after chart becomes visible #7700
[dashboard] trigger query for chart in nested tab only after chart becomes visible #7700
Conversation
{tabIds.map((tabId, tabIndex) => { | ||
const isTabContentVisible = | ||
selectedTabIndex === tabIndex && | ||
(renderTabContent ? isComponentVisible : true); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
this simplifies to !renderTabContent || isComponentVisible
I think. What does renderTabContent
actually signify here? I'm having a bit of trouble understanding the logic.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I updated the logic be more clear.
40f53e0
to
041ce63
Compare
@etr2460 tab logic is a little confusing here.
|
041ce63
to
072ba2c
Compare
Codecov Report
@@ Coverage Diff @@
## master #7700 +/- ##
==========================================
+ Coverage 65.76% 65.76% +<.01%
==========================================
Files 459 459
Lines 21909 21910 +1
Branches 2408 2409 +1
==========================================
+ Hits 14409 14410 +1
Misses 7379 7379
Partials 121 121
Continue to review full report at Codecov.
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
lgtm!
@@ -238,7 +239,9 @@ class Tabs extends React.PureComponent { | |||
onResize={onResize} | |||
onResizeStop={onResizeStop} | |||
onDropOnTab={this.handleDropOnTab} | |||
isComponentVisible={selectedTabIndex === tabIndex} | |||
isComponentVisible={ | |||
selectedTabIndex === tabIndex && isCurrentTabVisible |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
much more understandable, thanks!
CATEGORY
Choose one
SUMMARY
In #7233 I added a feature that only trigger query when chart is visible to user. If user apply filter in 1 tab, all the charts in another tab (not visible right now) should delay query update until user click to see the tab.
I found there is a bug for nested tab case: when chart in the nested tab, update filter (in another tab) will trigger new query right away. Please see before/after gif. Also updated integration test to cover this case.
Note: charts outside nested tab behaves good, and is covered in the existed unit tests.
BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF
Before:
After:
TEST PLAN
CI and manual test.
REVIEWERS
@etr2460 @williaster