-
-
Notifications
You must be signed in to change notification settings - Fork 4.2k
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
feat(issue-views): add query counts back to tabs #82990
base: master
Are you sure you want to change the base?
Conversation
❌ 10 Tests Failed:
View the top 3 failed tests by shortest run time
To view more test analytics, go to the Test Analytics Dashboard |
5469cbb
to
5fd797d
Compare
5fd797d
to
fcf22f7
Compare
@@ -144,6 +144,7 @@ const UnselectedTabTitle = styled('div')<{isSelected: boolean}>` | |||
text-overflow: ellipsis; | |||
padding-right: 1px; | |||
cursor: pointer; | |||
line-height: 1.45; |
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.
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.
@@ -31,6 +31,7 @@ export const useFetchIssueCounts = ( | |||
) => { | |||
return useApiQuery<QueryCounts>(makeFetchIssueCounts(params), { | |||
staleTime: 0, | |||
placeholderData: keepPreviousData, |
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.
We want to keep previous data while new data loads so that the query count bubble doesn't change size while the new count loads. If this were not here, the previous data would be scrubbed, and the query count bubble would lose its content and shrink to its min width before growing again.
@malwilley both of those were unintentional bugs and are fixed now! |
@MichaelSun48 some failing tests! Also noticed that the loading state looks too white in dark mode: And it may make sense to increase the stale time for the hook that fetches these counts. If you go to another page and come back it refetches everything and shows the loading state, which can be very long for some of my views |
expect(await screen.findByRole('tab', {name: /High Priority/})).toBeInTheDocument(); | ||
expect(screen.getByRole('tab', {name: /Medium Priority/})).toBeInTheDocument(); | ||
expect(screen.getByRole('tab', {name: /Low Priority/})).toBeInTheDocument(); | ||
expect(screen.getByRole('tab', {name: /High Priority/})).toHaveAttribute( |
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.
Somewhat jank way to fix the test failures - because the queryCount and tab title were adjacent components, RTL concatenated the strings, so the name of the "High Priority" tab with 12 counts would register "High Priority 12" instead of just "High Priority". I tried a bunch of things in the component themselves to make it work, but it ended up getting more complex than it should be to just make tests work, and I'd rather have the jank live in tests rather than in the components.
animate={{ | ||
backgroundColor: queryCountFetching | ||
? [theme.surface400, theme.surface100, theme.surface400] | ||
: `#00000000`, |
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 think there are some issues with just using 'transparent'
here - there are some consloe warnings about not being able to interpolate the hex values with the transparent keyword, hence why we're using #000000
here
Pending this PR to be merged.Adds the query count back to issue view tabs, this time with a hard max of 99 (counts will not go above 99 even after clicking into the tab, unlike before).
Temp view also works: