😍Tích hợp các Middleware vào store dễ dàng Typescirpt (ok)

src\index.tsx

import React from 'react';
import ReactDOM from 'react-dom/client';
import "./index.css";
import App from './App';
import reportWebVitals from './reportWebVitals';
import { legacy_createStore as createStore, applyMiddleware, compose } from 'redux';
import { Provider } from 'react-redux';
import { thunk } from 'redux-thunk';
import MyReducers from './reducers';
declare global {
  interface Window {
    __REDUX_DEVTOOLS_EXTENSION_COMPOSE__?: typeof compose;
  }
}
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const middlewares:any[] = [
  thunk
];
var store = createStore(
  MyReducers, 
  composeEnhancers(applyMiddleware(...middlewares))
);
const root = ReactDOM.createRoot(
  document.getElementById('root') as HTMLElement
);
root.render(
  <React.StrictMode>
    <Provider store={store}>
      <App />
    </Provider>
  </React.StrictMode>
);
reportWebVitals();

src\reducers\index.tsx

import { combineReducers } from 'redux';
import products from './products';
var MyReducers = combineReducers({
  products
});
export default MyReducers;

src\reducers\products.tsx

var initialState = [
  {
    id: 1,
    name: "Iphone 5 Plus",
    price: 500,
    status: true,
  },
  {
    id: 2,
    name: "Iphone 5 Plus",
    price: 500,
    status: false,
  },
  {
    id: 3,
    name: "Iphone 6 Plus",
    price: 600,
    status: false,
  },
];
var products = (state = initialState, action: any) => {
  switch (action.type) {
    default:
      return [...state];
      break;
  }
};
export default products;

package.json

{
  "name": "test",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.14.1",
    "@testing-library/react": "^13.0.0",
    "@testing-library/user-event": "^13.2.1",
    "@types/jest": "^27.0.1",
    "@types/node": "^16.7.13",
    "@types/react": "^18.0.0",
    "@types/react-dom": "^18.0.0",
    "axios": "^1.7.9",
    "react": "^19.0.0",
    "react-dom": "^19.0.0",
    "react-redux": "^9.2.0",
    "react-router-dom": "^7.1.0",
    "react-scripts": "5.0.1",
    "redux": "^5.0.1",
    "redux-devtools": "^3.7.0",
    "redux-devtools-extension": "^2.13.9",
    "redux-thunk": "^3.1.0",
    "typescript": "^4.4.2",
    "web-vitals": "^2.1.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}