Fix some styling issue and add TS types

woocommerce · Aug 27, 2021 · 42e4bec · 42e4bec
1 parent 7aae799
commit 42e4bec
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 3 deletions.
diff --git a/client/wp-admin-scripts/wc-pay-payments-promotion/wc-payments-row.scss b/client/wp-admin-scripts/wc-pay-payments-promotion/wc-payments-row.scss
@@ -16,7 +16,7 @@
 	}
 
 	> .name {
-		.pre-install-wcpay_name {
+		.wc-payment-gateway-method-name {
 			display: inline-flex;
 			img {
 				height: 24px;

diff --git a/client/wp-admin-scripts/wc-pay-payments-promotion/wc-payments-row.tsx b/client/wp-admin-scripts/wc-pay-payments-promotion/wc-payments-row.tsx
@@ -7,6 +7,8 @@ import { useState, useEffect } from '@wordpress/element';
 import {
 	PLUGINS_STORE_NAME,
 	PAYMENT_GATEWAYS_STORE_NAME,
+	WCDataSelector,
+	PluginsStoreActions,
 } from '@woocommerce/data';
 import { recordEvent } from '@woocommerce/tracks';
 import { useDispatch, useSelect } from '@wordpress/data';
@@ -31,9 +33,11 @@ export const WCPaymentsRow: React.FC< WCPaymentsRowProps > = ( {
 	subTitleContent,
 } ) => {
 	const [ installing, setInstalling ] = useState( false );
-	const { installAndActivatePlugins } = useDispatch( PLUGINS_STORE_NAME );
+	const { installAndActivatePlugins }: PluginsStoreActions = useDispatch(
+		PLUGINS_STORE_NAME
+	);
 	const { createNotice } = useDispatch( 'core/notices' );
-	const wcPayInstallationInfo = useSelect( ( select ) => {
+	const wcPayInstallationInfo = useSelect( ( select: WCDataSelector ) => {
 		const { getPaymentGateway } = select( PAYMENT_GATEWAYS_STORE_NAME );
 		const activePlugins: string[] = select(
 			PLUGINS_STORE_NAME

diff --git a/packages/data/src/index.ts b/packages/data/src/index.ts
@@ -27,6 +27,7 @@ export { useSettings } from './settings/use-settings';
 
 export { PLUGINS_STORE_NAME } from './plugins';
 export type { Plugin } from './plugins/types';
+export { ActionDispatchers as PluginsStoreActions } from './plugins/actions';
 export { pluginNames } from './plugins/constants';
 export { withPluginsHydration } from './plugins/with-plugins-hydration';
 

diff --git a/packages/data/src/plugins/actions.ts b/packages/data/src/plugins/actions.ts
@@ -357,3 +357,9 @@ export type Actions =
 	| ReturnType< typeof updateJetpackConnectUrl >
 	| ReturnType< typeof setPaypalOnboardingStatus >
 	| ReturnType< typeof setRecommendedPlugins >;
+
+// Types
+export type ActionDispatchers = {
+	installJetpackAndConnect: typeof installJetpackAndConnect;
+	installAndActivatePlugins: typeof installAndActivatePlugins;
+};