From 819337bb53174867aa81654325bc6eb507b98f40 Mon Sep 17 00:00:00 2001 From: Pkpedram Date: Sat, 29 Jan 2022 13:30:04 +0330 Subject: [PATCH] Home Page Desktop Separated From Mobile --- src/views/Home/Desktop/index.js | 42 +++++++++++++++++++++++++++++++++ src/views/Home/index.js | 18 ++++++++++---- 2 files changed, 55 insertions(+), 5 deletions(-) create mode 100644 src/views/Home/Desktop/index.js diff --git a/src/views/Home/Desktop/index.js b/src/views/Home/Desktop/index.js new file mode 100644 index 0000000..883bfd0 --- /dev/null +++ b/src/views/Home/Desktop/index.js @@ -0,0 +1,42 @@ +import React, { useState, useEffect, useCallback } from "react"; +import ScrollContainer from "react-indiana-drag-scroll"; +import { connect } from 'react-redux'; +import { Link } from "react-router-dom"; +import filterIcon from '../../../assets/images/vuesax-linear-filter-tick.svg'; +import Banners from "../../../components/Banners"; + +import { book, publicApi } from "../../../redux/actions"; + +const DesktopHome = ( + + +) =>{ + + +return ( + +
+ +
+ +) + +} + +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, + }); + + const mapDispatchToProps = { + getList: book.list, + gradeFilter: book.gradeFilter, + setHeaderOptions: publicApi.setHeaderOptions, + }; + + export default connect(mapStateToProps, mapDispatchToProps)(DesktopHome); + \ No newline at end of file diff --git a/src/views/Home/index.js b/src/views/Home/index.js index 621dc0f..fcace41 100644 --- a/src/views/Home/index.js +++ b/src/views/Home/index.js @@ -1,25 +1,33 @@ import React, { useEffect } from "react"; import { connect } from "react-redux"; -import Landscape from "./Landscape"; +// import Landscape from "./Landscape"; +import DesktopHome from './Desktop'; import Portrait from "./Portrait"; import { publicApi } from "../../redux/actions"; -function Home({ setHeaderOptions, headerOptions }) { +function Home({ setHeaderOptions, headerOptions, isMobile }) { useEffect(() => { setHeaderOptions(headerOptions); }, []); return ( <> - - + + { + isMobile ? :
+ } + + {/* */} ); } -const mapStateToProps = (state) => ({}); +const mapStateToProps = (state) => ({ + isMobile: state.publicApi.isMobile, +}); const mapDispatchToProps = { setHeaderOptions: publicApi.setHeaderOptions, + }; export default connect(mapStateToProps, mapDispatchToProps)(Home);