import React, { useState, useEffect, useCallback } from "react"; import { Link } from "react-router-dom"; import { connect } from "react-redux"; import Search from "../../components/Search"; import Select from "../../components/Select"; import Sidebar from "./layouts/Sidebar"; import Main from "./layouts/Main"; import { book, publicApi } from "../../redux/actions"; //assets import searchLight from "../../assets/icons/search-light.svg"; export const Products = ({ isDark, isMobile, books, getList, grades, gradeFilter, selectedGrade, gradeFilterBooks, setHeaderOptions, headerOptions, desktopContentTransform, }) => { const [filter, setFilter] = useState({ search: "", grade: "", productsType: "کتاب", }); const onChange = (name, value) => { setFilter({ ...filter, [name]: value }); }; useEffect(() => { getList(); setHeaderOptions(headerOptions); }, []); useEffect(() => { gradeFilter(filter.grade); }, [filter]); const Product = ({ productsType, product, index }) => { return ( <> {productsType === "کتاب" && ( {product?.name} {"پایه" + " " + grades[product?.gradeId]}
{1399 + " " + "تومان"}
)} {productsType === "ویديو" && ( {product?.name} {"پایه" + " " + grades[product?.gradeId]}
{1399 + " " + "تومان"}
)} ); }; return ( <> {/* Portrait */}
{isMobile ? ( <>
{selectedGrade ? gradeFilterBooks?.map((product, index) => ( )) : books?.map((product, index) => ( ))}
) : (
)}
); }; const mapStateToProps = (state) => ({ isDark: state.publicApi.isDark, isMobile: state.publicApi.isMobile, books: state.book.list, grades: state.publicApi.grades, gradeFilterBooks: state.book.gradeFilterBooks, selectedGrade: state.book.selectedGrade, desktopContentTransform: state.publicApi.desktopContentTransform, }); const mapDispatchToProps = { getList: book.list, gradeFilter: book.gradeFilter, setHeaderOptions: publicApi.setHeaderOptions, }; export default connect(mapStateToProps, mapDispatchToProps)(Products);