Merge pull request #108 from tgxn/add-redux-slices

Added the reducers and moved the store

package.json

@@ -45,6 +45,7 @@
     "react-redux": "^8.1.1",
     "react-router-dom": "^6.18.0",
     "redux": "^4.2.1",
+    "redux-persist": "^6.0.0",
     "sass": "^1.69.5",
     "sass-loader": "^13.3.2",
     "sonner": "^1.1.0",

src/App.jsx

@@ -23,9 +23,9 @@ import Approvals from "./pages/Approvals";
 import Reports from "./pages/Reports";
 import Login from "./pages/Login";
 
-import AppStore from "./store";
-import { selectIsInElectron } from "./reducers/configReducer";
-import { selectCurrentUser } from "./reducers/accountReducer";
+import { store } from "./redux/store";
+import { selectIsInElectron } from "./redux/reducer/configReducer";
+import { selectCurrentUser } from "./redux/reducer/accountReducer";
 
 function PageRouter() {
   const theme = useTheme();
@@ -195,7 +195,7 @@ export default function App() {
     <QueryClientProvider client={queryClient}>
       <ReactQueryDevtools initialIsOpen={false} buttonPosition="bottom-left" />
 
-      <Provider store={AppStore}>
+      <Provider store={store}>
         <PageRouter />
       </Provider>
     </QueryClientProvider>

src/components/Actions/CommentButtons.jsx

@@ -9,7 +9,7 @@ import { useLemmyHttpAction } from "../../hooks/useLemmyHttp.js";
 
 import { BaseActionButton, ActionConfirmButton, InputElement, ConfirmDialog } from "./BaseElements.jsx";
 import { getSiteData } from "../../hooks/getSiteData";
-import { selectShowResolved, selectMandatoryModComment } from "../../reducers/configReducer.js";
+import { selectShowResolved, selectMandatoryModComment } from "../../redux/reducer/configReducer.js";
 
 export const ResolveCommentReportButton = ({ report, ...props }) => {
   const queryClient = useQueryClient();

src/components/Actions/GenButtons.jsx

@@ -16,7 +16,7 @@ import {
   ConfirmDialog,
 } from "./BaseElements.jsx";
 
-import { selectMandatoryModComment } from "../../reducers/configReducer";
+import { selectMandatoryModComment } from "../../redux/reducer/configReducer";
 
 // banFromCommunity
 export const BanUserCommunityButton = ({ person, community, isBanned, ...props }) => {

src/components/Actions/PMButtons.jsx

@@ -11,7 +11,7 @@ import { useLemmyHttpAction } from "../../hooks/useLemmyHttp.js";
 
 import { BaseActionButton, ActionConfirmButton, InputElement, ConfirmDialog } from "./BaseElements.jsx";
 import { getSiteData } from "../../hooks/getSiteData";
-import { selectShowResolved, selectMandatoryModComment } from "../../reducers/configReducer.js";
+import { selectShowResolved, selectMandatoryModComment } from "../../redux/reducer/configReducer.js";
 
 // allow resolving / unresolving a post report
 // resolvePrivateMessageReport

src/components/Actions/PostButtons.jsx

@@ -11,9 +11,9 @@ import { useLemmyHttpAction } from "../../hooks/useLemmyHttp.js";
 
 import { BaseActionButton, ActionConfirmButton, InputElement, ConfirmDialog } from "./BaseElements.jsx";
 import { getSiteData } from "../../hooks/getSiteData";
-import { selectShowResolved } from "../../reducers/configReducer.js";
+import { selectShowResolved } from "../../redux/reducer/configReducer.js";
 
-import { selectMandatoryModComment } from "../../reducers/configReducer";
+import { selectMandatoryModComment } from "../../redux/reducer/configReducer";
 
 // allow resolving / unresolving a post report
 export const ResolvePostReportButton = ({ report, ...props }) => {

src/components/Actions/RegistrationButtons.jsx

@@ -13,7 +13,7 @@ import { useLemmyHttpAction } from "../../hooks/useLemmyHttp.js";
 import { getSiteData } from "../../hooks/getSiteData";
 
 import { BaseActionButton, ActionConfirmButton, InputElement, ConfirmDialog } from "./BaseElements.jsx";
-import { selectHideReadApprovals } from "../../reducers/configReducer.js";
+import { selectHideReadApprovals } from "../../redux/reducer/configReducer.js";
 
 export const ApproveButton = ({ registration, ...props }) => {
   const queryClient = useQueryClient();

src/components/Content/PostThumb.jsx

@@ -12,7 +12,7 @@ import LaunchIcon from "@mui/icons-material/Launch";
 import { SanitizedLink } from "../Display.jsx";
 import { Image, Video } from "./Image.jsx";
 
-import { selectBlurNsfw, selectNsfwWords } from "../../reducers/configReducer";
+import { selectBlurNsfw, selectNsfwWords } from "../../redux/reducer/configReducer";
 
 function ThumbWrapper({ width = 200, tooltip, modal = null, children }) {
   return (

src/components/Filters.jsx

@@ -10,7 +10,7 @@ import Checkbox from "@mui/joy/Checkbox";
 
 import Chip from "@mui/joy/Chip";
 
-import { selectFilterCommunity, selectFilterType, selectHideReadApprovals, selectModLogType, selectShowRemoved, selectShowResolved, setConfigItem } from "../reducers/configReducer";
+import { selectFilterCommunity, selectFilterType, selectHideReadApprovals, selectModLogType, selectShowRemoved, selectShowResolved, setConfigItem } from "../redux/reducer/configReducer";
 
 import { getSiteData } from "../hooks/getSiteData";
 import { getModLogTypeNames } from "../utils";

src/components/Header/AccountMenu.jsx

@@ -22,7 +22,7 @@ import SupervisedUserCircleIcon from "@mui/icons-material/SupervisedUserCircle";
 import AccountBoxIcon from "@mui/icons-material/AccountBox";
 import ArrowDropDown from "@mui/icons-material/ArrowDropDown";
 
-import { logoutCurrent, selectUsers } from "../../reducers/accountReducer";
+import { logoutCurrent, selectUsers } from "../../redux/reducer/accountReducer";
 
 import { getSiteData } from "../../hooks/getSiteData";
 
@@ -31,7 +31,7 @@ import { BasicInfoTooltip } from "../Tooltip.jsx";
 
 import { parseActorId, getUserRole } from "../../utils.js";
 
-import { setAccountIsLoading, setCurrentUser } from "../../reducers/accountReducer";
+import { setAccountIsLoading, setCurrentUser } from "../../redux/reducer/accountReducer";
 
 import { RoleIcons } from "../Shared/Icons.jsx";
 import { Typography } from "@mui/material";
@@ -78,7 +78,7 @@ function UserListItem({ user }) {
           }
 
           // TODO we need to update the user's details in the saved accounts array too, if this is a saved session
-          dispatch(setCurrentUser(user.base, user.jwt, getSite));
+          dispatch(setCurrentUser({base: user.base, jwt: user.jwt, site: getSite}));
         } catch (e) {
           toast(typeof e == "string" ? e : e.message);
         } finally {

src/components/Header/ConfigModal.jsx

@@ -21,7 +21,7 @@ import {
   selectBlurNsfw,
   selectShowAvatars,
   selectNsfwWords,
-} from "../../reducers/configReducer";
+} from "../../redux/reducer/configReducer";
 
 function BooleanSetting({ label, subtext, value, onChange }) {
   return (

src/components/Header/UserMenu.jsx

@@ -17,7 +17,7 @@ import VerifiedUserIcon from "@mui/icons-material/VerifiedUser";
 import SupervisedUserCircleIcon from "@mui/icons-material/SupervisedUserCircle";
 import AccountBoxIcon from "@mui/icons-material/AccountBox";
 
-import { logoutCurrent, selectUsers } from "../../reducers/accountReducer";
+import { logoutCurrent, selectUsers } from "../../redux/reducer/accountReducer";
 
 import { useLemmyHttp, refreshAllData } from "../../hooks/useLemmyHttp";
 import { getSiteData } from "../../hooks/getSiteData";
@@ -27,7 +27,7 @@ import { BasicInfoTooltip } from "../Tooltip.jsx";
 import { parseActorId } from "../../utils.js";
 import AccountMenu from "./AccountMenu.jsx";
 
-import { selectAccountIsLoading } from "../../reducers/accountReducer";
+import { selectAccountIsLoading } from "../../redux/reducer/accountReducer";
 
 export default function UserMenu() {
   const dispatch = useDispatch();

src/components/Shared/ActorMeta.jsx

@@ -27,7 +27,7 @@ import {
   selectBlurNsfw,
   selectShowAvatars,
   selectNsfwWords,
-} from "../../reducers/configReducer";
+} from "../../redux/reducer/configReducer";
 
 export function PersonMetaLine({ creator, by = false, sx }) {
   const { baseUrl, siteData, localPerson, userRole } = getSiteData();

src/components/Tooltip.jsx

@@ -28,7 +28,7 @@ import {
   selectBlurNsfw,
   selectShowAvatars,
   selectNsfwWords,
-} from "../reducers/configReducer";
+} from "../redux/reducer/configReducer";
 
 export const UserTooltip = ({ user, ...props }) => {
   console.log("user", user);

src/hooks/getSiteData.js

@@ -1,7 +1,7 @@
 import { useMemo } from "react";
 
 import { useSelector } from "react-redux";
-import { selectCurrentUser } from "../reducers/accountReducer";
+import { selectCurrentUser } from "../redux/reducer/accountReducer";
 
 // accessor for the site data returned at the time of login
 export function getSiteData() {

src/hooks/useLemmyHttp.js

@@ -7,7 +7,7 @@ import { getSiteData } from "../hooks/getSiteData";
 
 import { LemmyHttp } from "lemmy-js-client";
 
-import { selectCurrentUser, updateCurrentUserData, setAccountIsLoading } from "../reducers/accountReducer";
+import { selectCurrentUser, updateCurrentUserData, setAccountIsLoading } from "../redux/reducer/accountReducer";
 
 export function useLemmyHttp(callLemmyMethod, formData = {}) {
   const currentUser = useSelector(selectCurrentUser);

src/hooks/useLemmyInfinite.js

@@ -7,7 +7,7 @@ import { getSiteData } from "../hooks/getSiteData";
 import { useSelector } from "react-redux";
 
 import { LemmyHttp } from "lemmy-js-client";
-import { selectCurrentUser } from "../reducers/accountReducer";
+import { selectCurrentUser } from "../redux/reducer/accountReducer";
 
 export default function useLemmyInfinite({
   callLemmyMethod,

src/hooks/useLemmyModLog.js

@@ -10,7 +10,7 @@ import { LemmyHttp } from "lemmy-js-client";
 
 import useLemmyInfinite from "./useLemmyInfinite";
 import { getModLogTypeNames } from "../utils";
-import { selectModLogCommunityId, selectModLogType } from "../reducers/configReducer";
+import { selectModLogCommunityId, selectModLogType } from "../redux/reducer/configReducer";
 
 // gets paginated / infinite list of reports from lemmy
 export default function useLemmyModLog() {

src/hooks/useLemmyReports.js

@@ -15,7 +15,7 @@ import {
   selectOrderBy,
   selectShowRemoved,
   selectShowResolved,
-} from "../reducers/configReducer";
+} from "../redux/reducer/configReducer";
 
 // gets paginated / infinite list of reports from lemmy
 export default function useLemmyReports() {

src/pages/Actions.jsx

@@ -19,7 +19,7 @@ import { getSiteData } from "../hooks/getSiteData";
 import { parseActorId } from "../utils";
 
 import ModLogAccordians from "../components/Activity/ModLogAccordians";
-import { selectModLogType } from "../reducers/configReducer";
+import { selectModLogType } from "../redux/reducer/configReducer";
 
 export default function Actions() {
   const { baseUrl, siteData, localPerson, userRole } = getSiteData();

src/pages/Approvals.jsx

@@ -19,7 +19,7 @@ import useLemmyInfinite from "../hooks/useLemmyInfinite";
 import ApprovalsList from "../components/ApprovalsList.jsx";
 
 import { getSiteData } from "../hooks/getSiteData";
-import { selectHideReadApprovals } from "../reducers/configReducer";
+import { selectHideReadApprovals } from "../redux/reducer/configReducer";
 
 export default function Approvals() {
   const hideReadApprovals = useSelector(selectHideReadApprovals);

src/pages/Login.jsx

@@ -29,10 +29,10 @@ import {
   setCurrentUser,
   selectAccountIsLoading,
   selectUsers,
-} from "../reducers/accountReducer";
+} from "../redux/reducer/accountReducer";
 
 import { BasicInfoTooltip } from "../components/Tooltip.jsx";
-import { selectIsInElectron } from "../reducers/configReducer";
+import { selectIsInElectron } from "../redux/reducer/configReducer";
 
 export default function LoginForm() {
   const domainLock = window?.RuntimeConfig?.DomainLock != "" ? window?.RuntimeConfig?.DomainLock : false;
@@ -99,9 +99,9 @@ export default function LoginForm() {
         });
 
         if (saveSession) {
-          dispatch(addUser(instanceBase, auth.jwt, getSite));
+          dispatch(addUser({instance: instanceBase, jwt: auth.jwt, site: getSite}));
         } else {
-          dispatch(setCurrentUser(instanceBase, auth.jwt, getSite));
+          dispatch(setCurrentUser({base: instanceBase, jwt: auth.jwt, site: getSite}));
         }
       } else {
         setLoginError(auth);
@@ -334,7 +334,7 @@ export default function LoginForm() {
                           //   dispatch(addUser(user.base, auth.jwt, getSite));
                           // } else {
                           // dispatch(setCurrentUser(user.base, auth.jwt, getSite));
-                          dispatch(setCurrentUser(user.base, user.jwt, getSite));
+                          dispatch(setCurrentUser({base: instanceBase, jwt: user.jwt, site: getSite}));
                           // }
                         } catch (e) {
                           setLoginError(typeof e == "string" ? e : e.message);