Fix tables losing row selection on window focus (#48742)
<!-- Add the related story/sub-task/bug number, like Resolves #123, or remove if NA --> **Related issue:** Resolves #48542 ## Description The `QueryClient` was created with `new QueryClient()` and no default options, so every query inherited React Query's default `refetchOnWindowFocus: true`. On pages like `/policies` and `/users`, queries are refetched every time the browser window regains focus. Those focus refetches re-rendered the table with fresh data, tripping react-table's `autoResetSelectedRows` and `autoResetPage` (both default `true`), so the table appeared to "reload," clearing the user's row selection and jumping back to the first page when they clicked away and back. ## Screen recording demonstrating the fix https://github.com/user-attachments/assets/eabf30a5-65d3-420d-a8d3-5a529fa06089 # Checklist for submitter - [x] Changes file added for user-visible changes in `changes/`, `orbit/changes/` or `ee/fleetd-chrome/changes`. See [Changes files](https://github.com/fleetdm/fleet/blob/main/docs/Contributing/guides/committing-changes.md#changes-files) for more information. ## Testing - [x] QA'd all new/changed functionality manually <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Prevented users and policies tables from unexpectedly reloading when switching back to the browser window. * Preserved table state such as selected rows and current pagination instead of resetting to the first page. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
@@ -0,0 +1 @@
|
||||
- Fixed the policies and users tables intermittently reloading and clearing the current selection or resetting to the first page when the browser window regained focus.
|
||||
@@ -73,6 +73,7 @@ const UsersTable = ({ router }: IUsersTableProps): JSX.Element => {
|
||||
() => usersAPI.loadAll({ globalFilter: querySearchText }),
|
||||
{
|
||||
select: (data: IUser[]) => data,
|
||||
refetchOnWindowFocus: false,
|
||||
}
|
||||
);
|
||||
|
||||
@@ -88,6 +89,7 @@ const UsersTable = ({ router }: IUsersTableProps): JSX.Element => {
|
||||
select: (data: IInvite[]) => {
|
||||
return data;
|
||||
},
|
||||
refetchOnWindowFocus: false,
|
||||
}
|
||||
);
|
||||
|
||||
|
||||
@@ -284,6 +284,7 @@ const ManagePolicyPage = ({
|
||||
enabled: isRouteOk && isAllTeamsSelected,
|
||||
select: (data) => data.policies || [],
|
||||
staleTime: 5000,
|
||||
refetchOnWindowFocus: false,
|
||||
}
|
||||
);
|
||||
|
||||
@@ -344,6 +345,7 @@ const ManagePolicyPage = ({
|
||||
{
|
||||
enabled: isRouteOk && isPremiumTier && !isAllTeamsSelected,
|
||||
select: (data: ILoadTeamPoliciesResponse) => data.policies || [],
|
||||
refetchOnWindowFocus: false,
|
||||
}
|
||||
);
|
||||
|
||||
@@ -398,6 +400,7 @@ const ManagePolicyPage = ({
|
||||
setConfig(data);
|
||||
},
|
||||
staleTime: 5000,
|
||||
refetchOnWindowFocus: false,
|
||||
}
|
||||
);
|
||||
|
||||
@@ -408,6 +411,7 @@ const ManagePolicyPage = ({
|
||||
// Enable for all teams including "No team" (teamIdForApi === 0)
|
||||
enabled: isRouteOk && teamIdForApi !== undefined,
|
||||
staleTime: 5000,
|
||||
refetchOnWindowFocus: false,
|
||||
});
|
||||
const teamConfig = teamData?.team;
|
||||
|
||||
|
||||
Reference in New Issue
Block a user