Jul 8, 2025 · Jul 2, 2025 · Jul 3, 2025 · Jul 8, 2025 · Jul 8, 2025 · Jul 8, 2025
diff --git a/site/src/pages/WorkspacesPage/WorkspacesPage.tsx b/site/src/pages/WorkspacesPage/WorkspacesPage.tsx
 import { workspacePermissionsByOrganization } from "api/queries/organizations";
 import { templates } from "api/queries/templates";
 import { workspaces } from "api/queries/workspaces";
 import type { Workspace } from "api/typesGenerated";
 import type { Workspace, WorkspaceStatus } from "api/typesGenerated";
 import { useFilter } from "components/Filter/Filter";
 import { useUserFilterMenu } from "components/Filter/UserFilter";
 import { displayError } from "components/GlobalSnackbar/utils";
 import { useBatchActions } from "./batchActions";
 import { useStatusFilterMenu, useTemplateFilterMenu } from "./filter/menus";

 // To reduce the number of fetches, we reduce the fetch interval if there are no
 // active workspace builds.
 const ACTIVE_BUILD_STATUSES: WorkspaceStatus[] = [
 "canceling",
 "deleting",
 "pending",
 "starting",
 "stopping",
 ];
 const ACTIVE_BUILDS_REFRESH_INTERVAL = 5_000;
 const NO_ACTIVE_BUILDS_REFRESH_INTERVAL = 30_000;

 function useSafeSearchParams() {
 // Have to wrap setSearchParams because React Router doesn't make sure that
 // the function's memory reference stays stable on each render, even though
 const { data, error, refetch } = useQuery({
 ...workspacesQueryOptions,
 refetchInterval: ({ state }) => {
 return state.error ? false : 5_000;
 if (state.error) return false;

 // Default to 5s interval until first fetch completes
 if (!state.data) return ACTIVE_BUILDS_REFRESH_INTERVAL;

 // Check if any workspace has an active build
 const hasActiveBuilds = state.data.workspaces?.some((workspace) => {
 const status = workspace.latest_build.status;
 return ACTIVE_BUILD_STATUSES.includes(status);
 });

 // Poll every 5s if there are active builds, otherwise every 30s
 return hasActiveBuilds
 ? ACTIVE_BUILDS_REFRESH_INTERVAL
 : NO_ACTIVE_BUILDS_REFRESH_INTERVAL;
 },
 refetchOnWindowFocus: "always",
 });

 const [checkedWorkspaces, setCheckedWorkspaces] = useState<
Original file line number	Diff line number	Diff line change
Expand Up		@@ -2,7 +2,7 @@ import { getErrorDetail, getErrorMessage } from "api/errors";
		import { workspacePermissionsByOrganization } from "api/queries/organizations";
		import { templates } from "api/queries/templates";
		import { workspaces } from "api/queries/workspaces";
		import type { Workspace } from "api/typesGenerated";
		import type { Workspace, WorkspaceStatus } from "api/typesGenerated";
		import { useFilter } from "components/Filter/Filter";
		import { useUserFilterMenu } from "components/Filter/UserFilter";
		import { displayError } from "components/GlobalSnackbar/utils";
Expand All		@@ -22,6 +22,18 @@ import { WorkspacesPageView } from "./WorkspacesPageView";
		import { useBatchActions } from "./batchActions";
		import { useStatusFilterMenu, useTemplateFilterMenu } from "./filter/menus";

		// To reduce the number of fetches, we reduce the fetch interval if there are no
		// active workspace builds.
		const ACTIVE_BUILD_STATUSES: WorkspaceStatus[] = [
		"canceling",
		"deleting",
		"pending",
		"starting",
		"stopping",
		];
		const ACTIVE_BUILDS_REFRESH_INTERVAL = 5_000;
		const NO_ACTIVE_BUILDS_REFRESH_INTERVAL = 30_000;

		function useSafeSearchParams() {
		// Have to wrap setSearchParams because React Router doesn't make sure that
		// the function's memory reference stays stable on each render, even though
Expand DownExpand Up		@@ -78,8 +90,23 @@ const WorkspacesPage: FC = () => {
		const { data, error, refetch } = useQuery({
		...workspacesQueryOptions,
		refetchInterval: ({ state }) => {
		return state.error ? false : 5_000;
		if (state.error) return false;

		// Default to 5s interval until first fetch completes
		if (!state.data) return ACTIVE_BUILDS_REFRESH_INTERVAL;

		// Check if any workspace has an active build
johnstcn marked this conversation as resolved. Show resolvedHide resolved
		const hasActiveBuilds = state.data.workspaces?.some((workspace) => {
		const status = workspace.latest_build.status;
		return ACTIVE_BUILD_STATUSES.includes(status);
		});

		// Poll every 5s if there are active builds, otherwise every 30s
		return hasActiveBuilds
		? ACTIVE_BUILDS_REFRESH_INTERVAL
		: NO_ACTIVE_BUILDS_REFRESH_INTERVAL;
		},
		refetchOnWindowFocus: "always",
Copy link MemberAuthor johnstcnJul 8, 2025• edited Loading Choose a reason for hiding this comment The reason will be displayed to describe this comment to others.Learn more. review:`refetchInterval` does not execute while the tab is in the background, so the reduced refresh interval is more noticeable if you switch to a different tab and then switch back. Adding`refetchOnWindowFocus` here seems like a good way to ensure that a user sees fresh data sooner. Alternatively, we could set`refetchIntervalInBackground` but we then have to reason about two separate refresh loops. It also means that background Coder tabs will poll continuously, which does not seem desirable.
		});

		const [checkedWorkspaces, setCheckedWorkspaces] = useState<
Expand Down