regression: Stale phone numbers being available for outbound message (#37053)

Author: aleksandernsilva

.changeset/few-flowers-bow.md

@@ -0,0 +1,5 @@
+---
+"@rocket.chat/meteor": patch
+---
+
+Fixes stale phone numbers being available for outbound message

apps/meteor/client/components/Omnichannel/OutboundMessage/components/OutboundMessageWizard/OutboundMessageWizard.tsx

@@ -3,6 +3,7 @@ import { useEffectEvent } from '@rocket.chat/fuselage-hooks';
 import { useToastBarDispatch } from '@rocket.chat/fuselage-toastbar';
 import { Wizard, useWizard, WizardContent, WizardTabs } from '@rocket.chat/ui-client';
 import { usePermission } from '@rocket.chat/ui-contexts';
+import { useQueryClient } from '@tanstack/react-query';
 import { useEffect, useState } from 'react';
 import { ErrorBoundary } from 'react-error-boundary';
 import { useTranslation } from 'react-i18next';
@@ -12,6 +13,7 @@ import type { SubmitPayload } from './forms';
 import { ReviewStep, MessageStep, RecipientStep, RepliesStep } from './steps';
 import { useHasLicenseModule } from '../../../../../hooks/useHasLicenseModule';
 import { formatPhoneNumber } from '../../../../../lib/formatPhoneNumber';
+import { omnichannelQueryKeys } from '../../../../../lib/queryKeys';
 import GenericError from '../../../../GenericError';
 import useOutboundProvidersList from '../../hooks/useOutboundProvidersList';
 import { useOutboundMessageUpsellModal } from '../../modals';
@@ -27,6 +29,7 @@ type OutboundMessageWizardProps = {
 
 const OutboundMessageWizard = ({ defaultValues = {}, onSuccess, onError }: OutboundMessageWizardProps) => {
 	const { t } = useTranslation();
+	const queryClient = useQueryClient();
 	const dispatchToastMessage = useToastBarDispatch();
 	const [state, setState] = useState<Partial<SubmitPayload>>(defaultValues);
 	const { contact, sender, provider, department, agent, template, templateParameters, recipient } = state;
@@ -63,6 +66,14 @@ const OutboundMessageWizard = ({ defaultValues = {}, onSuccess, onError }: Outbo
 		],
 	});
 
+	useEffect(
+		() => () => {
+			// Clear cached providers and metadata on unmount to avoid stale data
+			void queryClient.removeQueries({ queryKey: omnichannelQueryKeys.outboundProviders() });
+		},
+		[queryClient],
+	);
+
 	useEffect(() => {
 		if (!isLoadingProviders && !isLoadingModule && (!hasOutboundModule || !hasProviders)) {
 			upsellModal.open();

apps/meteor/client/components/Omnichannel/OutboundMessage/hooks/useOutboundProvidersList.ts

@@ -14,7 +14,7 @@ type UseOutboundProvidersListProps<TData> = Omit<UseQueryOptions<OutboundProvide
 };
 
 const useOutboundProvidersList = <TData = OutboundProvidersResponse>(options?: UseOutboundProvidersListProps<TData>) => {
-	const { type = 'phone', enabled = true, staleTime = 0, gcTime = 0, ...queryOptions } = options || {};
+	const { type = 'phone', enabled = true, staleTime = 5 * 60 * 1000, ...queryOptions } = options || {};
 	const getProviders = useEndpoint('GET', '/v1/omnichannel/outbound/providers');
 	const hasModule = useHasLicenseModule('outbound-messaging');
 
@@ -24,7 +24,6 @@ const useOutboundProvidersList = <TData = OutboundProvidersResponse>(options?: U
 		retry: 3,
 		enabled: hasModule && enabled,
 		staleTime,
-		gcTime,
 		...queryOptions,
 	});
 };

apps/meteor/client/lib/queryKeys.ts

@@ -76,9 +76,11 @@ export const omnichannelQueryKeys = {
 	contacts: (query?: { filter: string; limit?: number }) =>
 		!query ? [...omnichannelQueryKeys.all, 'contacts'] : ([...omnichannelQueryKeys.all, 'contacts', query] as const),
 	contact: (contactId?: string) => [...omnichannelQueryKeys.contacts(), contactId] as const,
-	outboundProviders: ({ type }: { type: IOutboundProvider['providerType'] }) =>
-		[...omnichannelQueryKeys.all, 'outbound', 'providers', { type }] as const,
-	outboundProviderMetadata: (providerId: string) => [...omnichannelQueryKeys.all, 'outbound', 'provider', 'metadata', providerId] as const,
+	outboundProviders: (filter?: { type: IOutboundProvider['providerType'] }) =>
+		!filter
+			? ([...omnichannelQueryKeys.all, 'outbound-messaging', 'providers'] as const)
+			: ([...omnichannelQueryKeys.all, 'outbound-messaging', 'providers', filter] as const),
+	outboundProviderMetadata: (providerId: string) => [...omnichannelQueryKeys.outboundProviders(), providerId] as const,
 };
 
 export const deviceManagementQueryKeys = {