Refetch "Installed extensions" card data after installing recommended channels (#37300)

This commit is contained in:
Gan Eng Chin 2023-03-23 15:06:08 +08:00 committed by GitHub
commit 5953362485
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 24 additions and 19 deletions

View File

@ -7,11 +7,7 @@ import userEvent from '@testing-library/user-event';
/**
* Internal dependencies
*/
import {
useCampaignTypes,
useRecommendedChannels,
useRegisteredChannels,
} from '~/marketing/hooks';
import { useCampaignTypes, useRecommendedChannels } from '~/marketing/hooks';
import { CreateNewCampaignModal } from './CreateNewCampaignModal';
jest.mock( '@woocommerce/components', () => {
@ -27,7 +23,8 @@ jest.mock( '@woocommerce/components', () => {
jest.mock( '~/marketing/hooks', () => ( {
useCampaignTypes: jest.fn(),
useRecommendedChannels: jest.fn(),
useRegisteredChannels: jest.fn(),
useRegisteredChannels: jest.fn( () => ( {} ) ),
useInstalledPluginsWithoutChannels: jest.fn( () => ( {} ) ),
} ) );
const google = {
@ -84,9 +81,6 @@ describe( 'CreateNewCampaignModal component', () => {
( useRecommendedChannels as jest.Mock ).mockReturnValue( {
data: [ pinterest, amazon ],
} );
( useRegisteredChannels as jest.Mock ).mockReturnValue( {
refetch: jest.fn(),
} );
render( <CreateNewCampaignModal onRequestClose={ () => {} } /> );
expect( screen.getByText( 'Google Ads' ) ).toBeInTheDocument();
@ -121,9 +115,6 @@ describe( 'CreateNewCampaignModal component', () => {
( useRecommendedChannels as jest.Mock ).mockReturnValue( {
data: [],
} );
( useRegisteredChannels as jest.Mock ).mockReturnValue( {
refetch: jest.fn(),
} );
render( <CreateNewCampaignModal onRequestClose={ () => {} } /> );
// The expand button should not be there.

View File

@ -21,6 +21,7 @@ import {
useRecommendedChannels,
useCampaignTypes,
useRegisteredChannels,
useInstalledPluginsWithoutChannels,
} from '~/marketing/hooks';
import { SmartPluginCardBody } from '~/marketing/components';
import './CreateNewCampaignModal.scss';
@ -43,10 +44,13 @@ export const CreateNewCampaignModal = ( props: CreateCampaignModalProps ) => {
useCampaignTypes();
const { refetch: refetchRegisteredChannels } = useRegisteredChannels();
const { data: recommendedChannels } = useRecommendedChannels();
const { loadInstalledPluginsAfterActivation } =
useInstalledPluginsWithoutChannels();
const refetch = () => {
const onInstalledAndActivated = ( pluginSlug: string ) => {
refetchCampaignTypes();
refetchRegisteredChannels();
loadInstalledPluginsAfterActivation( pluginSlug );
};
return (
@ -143,7 +147,9 @@ export const CreateNewCampaignModal = ( props: CreateCampaignModalProps ) => {
<SmartPluginCardBody
key={ el.plugin }
plugin={ el }
onInstalledAndActivated={ refetch }
onInstalledAndActivated={
onInstalledAndActivated
}
/>
) ) }
</FlexItem>

View File

@ -21,7 +21,7 @@ import './PluginCardBody.scss';
type SmartPluginCardBodyProps = {
plugin: RecommendedPlugin;
onInstalledAndActivated?: () => void;
onInstalledAndActivated?: ( pluginSlug: string ) => void;
};
/**
@ -62,7 +62,7 @@ export const SmartPluginCardBody = ( {
plugin.product,
] );
onInstalledAndActivated();
onInstalledAndActivated( plugin.product );
createNoticesFromResponse( response );
} catch ( error ) {
createNoticesFromResponse( error );

View File

@ -35,7 +35,7 @@ import './Channels.scss';
type ChannelsProps = {
registeredChannels: Array< RegisteredChannel >;
recommendedChannels: Array< RecommendedChannel >;
onInstalledAndActivated?: () => void;
onInstalledAndActivated?: ( pluginSlug: string ) => void;
};
export type ChannelsRef = {

View File

@ -16,6 +16,7 @@ import {
useRegisteredChannels,
useRecommendedChannels,
useCampaignTypes,
useInstalledPluginsWithoutChannels,
} from '~/marketing/hooks';
import { getAdminSetting } from '~/utils/admin-settings';
import { IntroductionBanner } from './IntroductionBanner';
@ -45,6 +46,8 @@ export const MarketingOverviewMultichannel: React.FC = () => {
} = useRegisteredChannels();
const { loading: loadingRecommended, data: dataRecommended } =
useRecommendedChannels();
const { loadInstalledPluginsAfterActivation } =
useInstalledPluginsWithoutChannels();
const { currentUserCan } = useUser();
const channelsRef = useRef< ChannelsRef >( null );
@ -67,9 +70,10 @@ export const MarketingOverviewMultichannel: React.FC = () => {
getAdminSetting( 'allowMarketplaceSuggestions', false ) &&
currentUserCan( 'install_plugins' );
const refetch = () => {
const onInstalledAndActivated = ( pluginSlug: string ) => {
refetchCampaignTypes();
refetchRegisteredChannels();
loadInstalledPluginsAfterActivation( pluginSlug );
};
return (
@ -89,7 +93,7 @@ export const MarketingOverviewMultichannel: React.FC = () => {
ref={ channelsRef }
registeredChannels={ dataRegistered }
recommendedChannels={ dataRecommended }
onInstalledAndActivated={ refetch }
onInstalledAndActivated={ onInstalledAndActivated }
/>
) }
<InstalledExtensions />

View File

@ -0,0 +1,4 @@
Significance: patch
Type: fix
Refetch data for "Installed extensions" card after installing a recommended marketing channel.