Introduce React Toolkit. (#113)

* Add Redux Toolkit.

* Migrate Redux store setup to RTK.

* Use React Toolkit imports (almost) everywhere.

package.json

@@ -36,6 +36,7 @@
   },
   "dependencies": {
     "@nypl/dgx-svg-icons": "0.3.4",
+    "@reduxjs/toolkit": "^2.2.5",
     "@tanstack/react-query": "^4.36.1",
     "@thepalaceproject/web-opds-client": "^1.0.1",
     "bootstrap": "^3.3.6",
@@ -57,7 +58,7 @@
     "react-dnd": "^14.0.5",
     "react-dnd-html5-backend": "^14.0.5",
     "react-dom": "^16.8.6",
-    "react-redux": "^7.1.0",
+    "react-redux": "^7.2.9",
     "react-router": "^3.2.0",
     "recharts": "^1.8.6",
     "redux": "^4.0.1",
@@ -80,7 +81,8 @@
     "@types/prop-types": "^15.7.3",
     "@types/react": "^16.14.6",
     "@types/react-dom": "^16.9.8",
-    "@types/react-redux": "^7.1.16",
+    "@types/react-redux": "^7.1.33",
+    "@types/react-router": "^3.0.28",
     "@types/recharts": "^1.8.28",
     "@types/redux-mock-store": "^1.0.3",
     "@typescript-eslint/eslint-plugin": "^5.46.0",

src/components/AccountPage.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import * as PropTypes from "prop-types";
 import ChangePasswordForm from "./ChangePasswordForm";
 import { RootState } from "../store";

src/components/BookCoverEditor.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import { connect } from "react-redux";
 import editorAdapter from "../editorAdapter";
 import DataFetcher from "@thepalaceproject/web-opds-client/lib/DataFetcher";

src/components/BookDetailsContainer.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import * as PropTypes from "prop-types";
 
 import BookDetailsTabContainer from "./BookDetailsTabContainer";

src/components/BookDetailsEditor.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import { connect } from "react-redux";
 import DataFetcher from "@thepalaceproject/web-opds-client/lib/DataFetcher";
 import ActionCreator from "../actions";

src/components/ChangePasswordForm.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import { FetchErrorData } from "@thepalaceproject/web-opds-client/lib/interfaces";
 import { RootState } from "../store";
 import { connect } from "react-redux";

src/components/CirculationEvents.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import { connect } from "react-redux";
 import ActionCreator from "../actions";
 import ErrorMessage from "./ErrorMessage";

src/components/Classifications.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import { connect } from "react-redux";
 import editorAdapter from "../editorAdapter";
 import DataFetcher from "@thepalaceproject/web-opds-client/lib/DataFetcher";

src/components/Complaints.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import { connect } from "react-redux";
 import DataFetcher from "@thepalaceproject/web-opds-client/lib/DataFetcher";
 import ActionCreator from "../actions";

src/components/ConfigPage.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import * as PropTypes from "prop-types";
 import Header from "./Header";
 import Footer from "./Footer";

src/components/ContextProvider.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import * as PropTypes from "prop-types";
 import buildStore, { RootState } from "../store";
 import { FeatureFlags, PathFor } from "../interfaces";

src/components/CustomListPage.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import * as PropTypes from "prop-types";
 import Header from "./Header";
 import Footer from "./Footer";

src/components/CustomLists.tsx

@@ -1,6 +1,6 @@
 /* eslint-disable react/no-deprecated */
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import { connect } from "react-redux";
 import * as PropTypes from "prop-types";
 import { RootState } from "../store";

src/components/CustomListsForBook.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import { connect } from "react-redux";
 import DataFetcher from "@thepalaceproject/web-opds-client/lib/DataFetcher";
 import ActionCreator from "../actions";

src/components/DashboardPage.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import { RootState } from "../store";
 import * as PropTypes from "prop-types";
 import Header from "./Header";

src/components/DiagnosticsTabContainer.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import { connect } from "react-redux";
 import ActionCreator from "../actions";
 import { DiagnosticsData } from "../interfaces";

src/components/EditableConfigList.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import { FetchErrorData } from "@thepalaceproject/web-opds-client/lib/interfaces";
 import { SettingData } from "../interfaces";
 import { Alert } from "react-bootstrap";

src/components/Header.tsx

@@ -1,7 +1,7 @@
 /* eslint-disable */
 import * as React from "react";
 import { connect } from "react-redux";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import * as PropTypes from "prop-types";
 import { RootState } from "../store";
 import ActionCreator from "../actions";

src/components/LanePage.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import * as PropTypes from "prop-types";
 import Header from "./Header";
 import Footer from "./Footer";

src/components/Lanes.tsx

@@ -1,7 +1,7 @@
 /* eslint-disable react/no-deprecated */
 import * as React from "react";
 import { Link } from "react-router";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import { connect } from "react-redux";
 import { RootState } from "../store";
 import ActionCreator from "../actions";

src/components/ManagePatrons.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import { connect } from "react-redux";
 import * as PropTypes from "prop-types";
 import { RootState } from "../store";

src/components/ManagePatronsForm.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import { connect } from "react-redux";
 import { RootState } from "../store";
 import ActionCreator from "../actions";

src/components/ManagePatronsTabContainer.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import { connect } from "react-redux";
 import * as PropTypes from "prop-types";
 import { RootState } from "../store";

src/components/QuicksightDashboard.tsx

@@ -4,7 +4,7 @@ import {
   LibrariesData,
   LibraryData,
 } from "../interfaces";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import { RootState } from "../store";
 import { connect } from "react-redux";
 import ActionCreator from "../actions";

src/components/QuicksightDashboardPage.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import { RootState } from "../store";
 import * as PropTypes from "prop-types";
 import Header from "./Header";

src/components/ResetAdobeId.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import { connect } from "react-redux";
 import { RootState } from "../store";
 import ActionCreator from "../actions";

src/components/SelfTests.tsx

@@ -1,6 +1,6 @@
 /* eslint-disable react/no-deprecated */
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import { connect } from "react-redux";
 import { RootState } from "../store";
 import ActionCreator from "../actions";

src/components/SelfTestsCategory.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import { RootState } from "../store";
 import SelfTests from "./SelfTests";
 import {

src/components/SelfTestsTabContainer.tsx

@@ -1,7 +1,7 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
 /* eslint-disable @typescript-eslint/no-empty-interface */
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import { connect } from "react-redux";
 import ActionCreator from "../actions";
 import { CollectionsData, PatronAuthServicesData } from "../interfaces";

src/components/SetupPage.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import * as PropTypes from "prop-types";
 import IndividualAdmins from "./IndividualAdmins";
 import { RootState } from "../store";

src/components/TabContainer.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import * as PropTypes from "prop-types";
 import { Navigate, PathFor } from "../interfaces";
 import { RootState } from "../store";

src/components/TroubleshootingCategoryPage.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import * as PropTypes from "prop-types";
 import { RootState } from "../store";
 import DiagnosticsTabContainer from "./DiagnosticsTabContainer";

src/components/TroubleshootingPage.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import * as PropTypes from "prop-types";
 import Header from "./Header";
 import Footer from "./Footer";

src/components/TroubleshootingTabContainer.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { Store } from "redux";
+import { Store } from "@reduxjs/toolkit";
 import * as PropTypes from "prop-types";
 import { State } from "../reducers/index";
 import {