AdminCategoriesPageContainer.js 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. import { connect } from "react-redux";
  2. import { useEffect } from "react";
  3. import { useSearchParams } from "react-router-dom";
  4. import { actionCategoriesPage } from "../../../../actions/actionCategoriesPage";
  5. import { actionFeedCats } from "../../../../reducers";
  6. import { AdminCategoriesPage } from "../../AdminCategoriesPage";
  7. import { InfScroll } from "../../../common/InfScroll";
  8. const AdminCategoriesPageContainer = ({ feed, cats, promiseStatus, onLoad, onUnmount, onScroll }) => {
  9. const [searchParams] = useSearchParams();
  10. const orderBy = searchParams.get("orderBy") || "_id";
  11. useEffect(() => {
  12. onLoad({ orderBy });
  13. return () => {
  14. onUnmount();
  15. };
  16. }, [orderBy]);
  17. return (
  18. <InfScroll
  19. items={cats}
  20. component={AdminCategoriesPage}
  21. promiseStatus={promiseStatus}
  22. onScroll={() => onScroll({ feed, orderBy })}
  23. orderBy={orderBy}
  24. />
  25. );
  26. };
  27. export const CAdminCategoriesPageContainer = connect(
  28. (state) => ({
  29. cats: state.promise?.feedCatAll?.payload || [],
  30. feed: state.feed?.payload || [],
  31. promiseStatus: state.promise?.feedCatAll?.status || null,
  32. }),
  33. {
  34. onUnmount: () => ({ type: "CATEGORIES_PAGE_CLEAR" }),
  35. onLoad: ({ orderBy }) => actionCategoriesPage({ orderBy }),
  36. onScroll: ({ feed, orderBy }) => actionFeedCats({ skip: feed?.length || 0, orderBy }),
  37. }
  38. )(AdminCategoriesPageContainer);