fix(deps): update redux-related packages (major) (#96403)

apps/blaze-dashboard/package.json

@@ -41,9 +41,9 @@
 		"prop-types": "^15.8.1",
 		"react": "^18.3.1",
 		"react-dom": "^18.3.1",
-		"react-redux": "^8.1.3",
-		"redux": "^4.2.1",
-		"redux-thunk": "^2.4.2",
+		"react-redux": "^9.1.2",
+		"redux": "^5.0.1",
+		"redux-thunk": "^3.1.0",
 		"wpcom": "workspace:^",
 		"wpcom-proxy-request": "workspace:^"
 	},

apps/blaze-dashboard/src/app.jsx

@@ -7,7 +7,7 @@ import page from '@automattic/calypso-router';
 import { QueryClient } from '@tanstack/react-query';
 import '@automattic/calypso-polyfills';
 import { createStore, applyMiddleware, compose } from 'redux';
-import thunkMiddleware from 'redux-thunk';
+import { thunk as thunkMiddleware } from 'redux-thunk';
 import { initializeAnalytics } from 'calypso/lib/analytics/init';
 import getSuperProps from 'calypso/lib/analytics/super-props';
 import analyticsMiddleware from 'calypso/state/analytics/middleware';

apps/command-palette-wp-admin/package.json

@@ -35,7 +35,7 @@
 		"i18n-calypso": "workspace:^",
 		"react": "^18.3.1",
 		"react-dom": "^18.3.1",
-		"redux": "^4.2.1"
+		"redux": "^5.0.1"
 	},
 	"devDependencies": {
 		"@automattic/calypso-apps-builder": "workspace:^",

apps/help-center/package.json

@@ -62,7 +62,7 @@
 		"postcss": "*",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",
-		"redux": "^4.2.1"
+		"redux": "^5.0.1"
 	},
 	"private": true
 }

apps/notifications/package.json

@@ -40,9 +40,9 @@
 		"prop-types": "^15.7.2",
 		"react": "^18.3.1",
 		"react-dom": "^18.3.1",
-		"react-redux": "^8.1.3",
-		"redux": "^4.2.1",
-		"redux-thunk": "^2.4.2",
+		"react-redux": "^9.1.2",
+		"redux": "^5.0.1",
+		"redux-thunk": "^3.1.0",
 		"webpack-bundle-analyzer": "^4.10.2",
 		"wpcom": "workspace:^",
 		"wpcom-proxy-request": "workspace:^"

apps/notifications/src/panel/state/index.js

@@ -1,5 +1,5 @@
 import { applyMiddleware, combineReducers, compose, createStore } from 'redux'; // eslint-disable-line no-restricted-imports
-import thunkMiddleware from 'redux-thunk';
+import { thunk as thunkMiddleware } from 'redux-thunk';
 import actionMiddleware from './action-middleware';
 import { createListenerMiddleware } from './create-listener-middleware';
 import notes from './notes/reducer';

apps/o2-blocks/package.json

@@ -42,7 +42,7 @@
 		"new-github-issue-url": "^0.2.1",
 		"react": "^18.3.1",
 		"react-dom": "^18.3.1",
-		"redux": "^4.2.1"
+		"redux": "^5.0.1"
 	},
 	"devDependencies": {
 		"@automattic/calypso-apps-builder": "workspace:^",

apps/odyssey-stats/package.json

@@ -45,9 +45,9 @@
 		"prop-types": "^15.8.1",
 		"react": "^18.3.1",
 		"react-dom": "^18.3.1",
-		"react-redux": "^8.1.3",
-		"redux": "^4.2.1",
-		"redux-thunk": "^2.4.2",
+		"react-redux": "^9.1.2",
+		"redux": "^5.0.1",
+		"redux-thunk": "^3.1.0",
 		"wpcom": "workspace:^"
 	},
 	"devDependencies": {

apps/odyssey-stats/src/app.tsx

@@ -8,7 +8,7 @@ import page from '@automattic/calypso-router';
 import { QueryClient } from '@tanstack/react-query';
 import '@automattic/calypso-polyfills';
 import { createStore, applyMiddleware, compose, Store, Middleware } from 'redux';
-import thunkMiddleware from 'redux-thunk';
+import { thunk as thunkMiddleware } from 'redux-thunk';
 import { getPathWithUpdatedQueryString } from 'calypso/my-sites/stats/utils';
 import { WithAddReducer } from 'calypso/state/add-reducer';
 import analyticsMiddleware from 'calypso/state/analytics/middleware';

apps/whats-new/package.json

@@ -38,7 +38,7 @@
 		"i18n-calypso": "workspace:^",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",
-		"redux": "^4.2.1"
+		"redux": "^5.0.1"
 	},
 	"devDependencies": {
 		"@automattic/calypso-apps-builder": "workspace:^",

apps/wpcom-block-editor/package.json

@@ -50,7 +50,7 @@
 		"lodash": "^4.17.21",
 		"react": "^18.3.1",
 		"react-dom": "^18.3.1",
-		"redux": "^4.2.1",
+		"redux": "^5.0.1",
 		"tinymce": "^5.0.0"
 	},
 	"devDependencies": {

client/components/data/query-jetpack-modules/test/query-jetpack-modules.jsx

@@ -5,7 +5,7 @@
 import { render } from '@testing-library/react';
 import { Provider } from 'react-redux';
 import configureStore from 'redux-mock-store';
-import thunk from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 import QueryJetpackModules from 'calypso/components/data/query-jetpack-modules';
 const middlewares = [ thunk ];
 

client/hosting/server-settings/test/index.js

@@ -25,7 +25,7 @@ import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { render, screen, waitFor } from '@testing-library/react';
 import { Provider } from 'react-redux';
 import configureStore from 'redux-mock-store';
-import thunk from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 import wp from 'calypso/lib/wp';
 import { transferStates } from 'calypso/state/automated-transfer/constants';
 import Hosting from '../main';

client/jetpack-cloud/sections/agency-dashboard/sites-overview/test/sites-overview.tsx

@@ -8,7 +8,7 @@ import { render, act } from '@testing-library/react';
 import React from 'react';
 import { Provider } from 'react-redux';
 import configureStore from 'redux-mock-store';
-import thunk from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 import SitesOverviewContext from '../context';
 import SitesOverview from '../index';
 

client/landing/login/store.js

@@ -1,5 +1,5 @@
 import { createStore, applyMiddleware, compose } from 'redux';
-import thunkMiddleware from 'redux-thunk';
+import { thunk as thunkMiddleware } from 'redux-thunk';
 import analyticsMiddleware from 'calypso/state/analytics/middleware';
 import currentUser from 'calypso/state/current-user/reducer';
 import wpcomApiMiddleware from 'calypso/state/data-layer/wpcom-api-middleware';

client/landing/stepper/declarative-flow/internals/steps-repository/design-setup/test/unified-design-picker.tsx

@@ -8,7 +8,7 @@ import React from 'react';
 import { Provider } from 'react-redux';
 import { MemoryRouter } from 'react-router-dom';
 import configureStore from 'redux-mock-store';
-import thunk from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 import * as wpcomProxyRequest from 'wpcom-proxy-request';
 import wpcomXhrRequest from 'wpcom-xhr-request';
 import {

client/lib/signup/test/flow-controller.js

@@ -4,7 +4,7 @@
 
 import { size } from 'lodash';
 import { createStore, applyMiddleware } from 'redux';
-import thunk from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 import { saveSignupStep, submitSignupStep } from 'calypso/state/signup/progress/actions';
 import { getSignupProgress } from 'calypso/state/signup/progress/selectors';
 import signupReducer from 'calypso/state/signup/reducer';

client/my-sites/checkout/src/components/test/secondary-cart-promotions.tsx

@@ -13,7 +13,7 @@ import userEvent from '@testing-library/user-event';
 import { useState } from 'react';
 import { Provider as ReduxProvider } from 'react-redux';
 import { createStore, applyMiddleware } from 'redux';
-import thunk from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 import { WpcomRequestParams } from 'wpcom-proxy-request';
 import {
 	mockGetCartEndpointWith,

client/my-sites/checkout/src/payment-methods/credit-card/store.ts

@@ -184,12 +184,15 @@ export function createCreditCardPaymentMethodStore( {
 				action: AnyAction
 			) {
 				return {
-					fields: fieldReducer( state.fields, action ),
-					cardDataErrors: cardDataErrorsReducer( state.cardDataErrors, action ),
-					cardDataComplete: cardDataCompleteReducer( state.cardDataComplete, action ),
-					brand: brandReducer( state.brand, action ),
+					fields: fieldReducer( state.fields, action as CardStoreAction ),
+					cardDataErrors: cardDataErrorsReducer( state.cardDataErrors, action as CardStoreAction ),
+					cardDataComplete: cardDataCompleteReducer(
+						state.cardDataComplete,
+						action as CardStoreAction
+					),
+					brand: brandReducer( state.brand, action as CardStoreAction ),
 					useForAllSubscriptions: allowUseForAllSubscriptions
-						? allSubscriptionsReducer( state.useForAllSubscriptions, action )
+						? allSubscriptionsReducer( state.useForAllSubscriptions, action as CardStoreAction )
 						: false,
 				};
 			},

client/my-sites/checkout/src/test/util/index.ts

@@ -8,7 +8,7 @@ import {
 import { prettyDOM } from '@testing-library/react';
 import nock from 'nock';
 import { createStore, applyMiddleware } from 'redux';
-import thunk from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 import { useExperiment } from 'calypso/lib/explat';
 import domainManagementReducer from 'calypso/state/domains/management/reducer';
 import noticesReducer from 'calypso/state/notices/reducer';

client/my-sites/customer-home/cards/features/domain-upsell/test/index.jsx

@@ -7,7 +7,7 @@ import userEvent from '@testing-library/user-event';
 import nock from 'nock';
 import { Provider } from 'react-redux';
 import configureStore from 'redux-mock-store';
-import thunk from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 import DomainUpsell from '../';
 
 const initialState = {

client/my-sites/customer-home/cards/tasks/domain-upsell/test/index.jsx

@@ -8,7 +8,7 @@ import userEvent from '@testing-library/user-event';
 import nock from 'nock';
 import { Provider } from 'react-redux';
 import configureStore from 'redux-mock-store';
-import thunk from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 import DomainUpsell from '../';
 
 const initialState = {

client/my-sites/plugins/plugin-management-v2/test/remove-plugin.test.tsx

@@ -9,7 +9,7 @@ import { unmountComponentAtNode } from 'react-dom';
 import Modal from 'react-modal';
 import { Provider } from 'react-redux';
 import configureStore from 'redux-mock-store';
-import thunk from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 import { ACTIVATE_PLUGIN } from 'calypso/lib/plugins/constants';
 import { getSite } from 'calypso/state/sites/selectors';
 import RemovePlugin from '../remove-plugin';

client/my-sites/test/controller.js

@@ -4,7 +4,7 @@
 
 import page from '@automattic/calypso-router';
 import configureStore from 'redux-mock-store';
-import thunk from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 import * as pageView from 'calypso/lib/analytics/page-view';
 import { PREFERENCES_SET } from 'calypso/state/action-types';
 import {

client/package.json

@@ -191,12 +191,12 @@
 		"react-live": "^4.1.1",
 		"react-markdown": "^8.0.7",
 		"react-modal": "^3.16.1",
-		"react-redux": "^8.1.3",
+		"react-redux": "^9.1.2",
 		"react-router-dom": "^6.23.1",
 		"react-transition-group": "^4.3.0",
-		"redux": "^4.2.1",
+		"redux": "^5.0.1",
 		"redux-dynamic-middlewares": "^2.2.0",
-		"redux-thunk": "^2.4.2",
+		"redux-thunk": "^3.1.0",
 		"regenerator-runtime": "^0.13.9",
 		"social-logos": "^2.5.9",
 		"source-map-support": "^0.5.19",

client/signup/steps/emails/test/index.tsx

@@ -6,7 +6,7 @@ import { render } from '@testing-library/react';
 import React from 'react';
 import { Provider } from 'react-redux';
 import configureStore from 'redux-mock-store';
-import thunk from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 import * as queryProductsList from 'calypso/components/data/query-products-list';
 import EmailStep from '../index';
 

client/sites/tools/staging-site/components/staging-site-card/test/index.js

@@ -4,7 +4,7 @@
 import { render, screen, fireEvent, waitFor } from '@testing-library/react';
 import { Provider } from 'react-redux';
 import configureStore from 'redux-mock-store';
-import thunk from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 import { recordTracksEvent } from 'calypso/state/analytics/actions';
 import { StagingSiteCard } from '..';
 import { useAddStagingSiteMutation } from '../../../hooks/use-add-staging-site';

client/sites/tools/staging-site/test/index.js

@@ -20,7 +20,7 @@ import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { render, screen } from '@testing-library/react';
 import { Provider } from 'react-redux';
 import configureStore from 'redux-mock-store';
-import thunk from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 import StagingSite from '../components/staging-site';
 
 const getTestConfig = ( {

client/state/imports/test/api-interaction.js

@@ -1,6 +1,6 @@
 import nock from 'nock';
 import { createStore, combineReducers, applyMiddleware } from 'redux'; // eslint-disable-line no-restricted-imports
-import thunk from 'redux-thunk';
+import { thunk } from 'redux-thunk';
 import { fetchImporterState, lockImport } from 'calypso/state/imports/actions';
 import { appStates } from 'calypso/state/imports/constants';
 import imports from 'calypso/state/imports/reducer';

client/state/index.ts

@@ -6,7 +6,7 @@ import {
 } from 'react-redux';
 import { AnyAction, createStore, applyMiddleware, compose, Store, StoreEnhancer } from 'redux';
 import dynamicMiddlewares from 'redux-dynamic-middlewares';
-import thunkMiddleware from 'redux-thunk';
+import { thunk as thunkMiddleware } from 'redux-thunk';
 import { WithAddReducer } from 'calypso/state/add-reducer';
 import wpcomApiMiddleware from 'calypso/state/data-layer/wpcom-api-middleware';
 import { addReducerEnhancer } from 'calypso/state/utils/add-reducer-enhancer';
@@ -65,5 +65,5 @@ export function useSelector< State = IAppState, Selected = unknown >(
 }
 
 export function useStore(): Store< IAppState, AnyAction > {
-	return reduxUseStore();
+	return reduxUseStore< IAppState >();
 }