Only poll while test step is active

Author: kalafut

packages/ui/src/components/ConfigureDirectorySync/ConfigureDirectorySyncContext.tsx

@@ -1,30 +1,13 @@
 import {
   __internal_useOrganizationDirectorySync,
-  __internal_useOrganizationDirectorySyncUsers,
   __internal_useOrganizationEnterpriseConnections,
 } from '@clerk/shared/react';
-import type {
-  DirectorySyncProvider,
-  DirectorySyncResource,
-  DirectorySyncUserResource,
-  EnterpriseConnectionResource,
-} from '@clerk/shared/types';
+import type { DirectorySyncProvider, DirectorySyncResource, EnterpriseConnectionResource } from '@clerk/shared/types';
 import React, { type PropsWithChildren } from 'react';
 
 import type { DirectorySyncProviderMeta } from './providerMeta';
 import { DIRECTORY_SYNC_PROVIDERS, directorySyncProviderForConnection } from './providerMeta';
 
-export interface DirectorySyncUsersView {
-  data: DirectorySyncUserResource[] | undefined;
-  totalCount: number | undefined;
-  error: Error | null;
-  isLoading: boolean;
-  isPolling: boolean;
-  startPolling: () => void;
-  stopPolling: () => void;
-  revalidate: () => Promise<void>;
-}
-
 /**
  * Shared state for the ConfigureDirectorySync wizard, persisted across steps.
  *
@@ -46,7 +29,6 @@ export interface ConfigureDirectorySyncData {
   createDirectory: () => Promise<DirectorySyncResource | undefined>;
   rotateToken: () => Promise<DirectorySyncResource | undefined>;
   setDirectoryEnabled: (enabled: boolean) => Promise<DirectorySyncResource | undefined>;
-  users: DirectorySyncUsersView;
   onExit?: () => void;
 }
 
@@ -80,8 +62,6 @@ export const ConfigureDirectorySyncProvider = ({
     rotateDirectorySyncToken,
   } = __internal_useOrganizationDirectorySync({ enterpriseConnectionId });
 
-  const users = __internal_useOrganizationDirectorySyncUsers({ directory });
-
   // The token is stored with the connection it was issued for, so a response
   // that lands after the connection changed is never shown for the new one.
   const [revealed, setRevealed] = React.useState<RevealedToken | null>(null);
@@ -123,7 +103,6 @@ export const ConfigureDirectorySyncProvider = ({
     createDirectory,
     rotateToken,
     setDirectoryEnabled,
-    users,
     onExit,
   };
 

packages/ui/src/components/ConfigureDirectorySync/steps/TestSyncStep.tsx

@@ -1,3 +1,4 @@
+import { __internal_useOrganizationDirectorySyncUsers } from '@clerk/shared/react';
 import type { DirectorySyncUserResource } from '@clerk/shared/types';
 import React from 'react';
 
@@ -85,19 +86,19 @@ const ProvisionedUserRow = ({ user }: { user: DirectorySyncUserResource }): JSX.
 
 export const TestSyncStep = (): JSX.Element => {
   const { goPrev } = useWizard();
-  const { providerMeta, users, onExit } = useConfigureDirectorySync();
+  const { providerMeta, directory, onExit } = useConfigureDirectorySync();
   const { t } = useLocalizations();
+  const users = __internal_useOrganizationDirectorySyncUsers({ directory });
 
   const rows = users.data ?? [];
   const providerName = t((providerMeta ?? DIRECTORY_SYNC_PROVIDERS.custom).name);
 
-  // The users hook lives in the wizard provider, which stays mounted across
-  // steps, so polling is armed and released by this step's own lifecycle.
-  const { startPolling, stopPolling } = users;
+  // Poll while this step is visible; the list doubles as a live feed while the
+  // admin pushes test users from the IdP. Unmounting the step ends the poll.
+  const { startPolling } = users;
   React.useEffect(() => {
     startPolling();
-    return () => stopPolling();
-  }, [startPolling, stopPolling]);
+  }, [startPolling]);
 
   return (
     <>