|
|
|
@ -1,4 +1,6 @@ |
|
|
|
|
import React, { useEffect, useState } from "react"; |
|
|
|
|
import axios from "axios"; |
|
|
|
|
|
|
|
|
|
import { connect } from "react-redux"; |
|
|
|
|
import { Link } from "react-router-dom"; |
|
|
|
|
import { ScrollingCarousel, Carousel } from "@trendyol-js/react-carousel"; |
|
|
|
@ -10,6 +12,7 @@ import { book, publicApi } from "../../../../redux/actions"; |
|
|
|
|
import moment from "jalali-moment"; |
|
|
|
|
|
|
|
|
|
import dropdownIcon from "../../../../assets/icons/dropdown-blue.svg"; |
|
|
|
|
import Posts from "./Posts"; |
|
|
|
|
|
|
|
|
|
export const Main = ({ |
|
|
|
|
books, |
|
|
|
@ -124,11 +127,32 @@ export const Main = ({ |
|
|
|
|
)); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
// pagination
|
|
|
|
|
const [posts, setPosts] = useState([]); |
|
|
|
|
const [loading, setLoading] = useState(false); |
|
|
|
|
const [currentPage, setCurrentPage] = useState(1); |
|
|
|
|
const [postsPerPage, setPostsPerPage] = useState(10); |
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
|
const fetchPosts = async () => { |
|
|
|
|
setLoading(true); |
|
|
|
|
const res = await axios.get("https://jsonplaceholder.typicode.com/posts"); |
|
|
|
|
setPosts(res.data); |
|
|
|
|
setLoading(false); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
fetchPosts(); |
|
|
|
|
}, []); |
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
|
<div |
|
|
|
|
className="flex flex-col w-3/4 pb-20 min-h-screen" |
|
|
|
|
style={{ minWidth: "calc(100% * 3 / 4)" }} |
|
|
|
|
> |
|
|
|
|
<div className="bg-red-400 "> |
|
|
|
|
<h1 className="mb-5">My Blog</h1> |
|
|
|
|
<Posts posts={posts} loading={loading} /> |
|
|
|
|
</div> |
|
|
|
|
<div className="flex w-full bg-blue rounded-lg border border-solid border-gray-200 p-2 items-center my-1.5 justify-center text-blue52"> |
|
|
|
|
<div className="flex text-sm items-center mr-2 ml-4"> |
|
|
|
|
<svg |
|
|
|
@ -285,36 +309,3 @@ const mapDispatchToProps = { |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
export default connect(mapStateToProps, mapDispatchToProps)(Main); |
|
|
|
|
|
|
|
|
|
{ |
|
|
|
|
/* <div className=""> |
|
|
|
|
{(filterOptions?.productType |
|
|
|
|
? filterOptions.productType === "دوره ویدئویی" |
|
|
|
|
: true) && ( |
|
|
|
|
<Carousel |
|
|
|
|
show={Math.round(window.innerWidth / 400)} |
|
|
|
|
slide={2} |
|
|
|
|
swiping={true} |
|
|
|
|
useArrowKeys={true} |
|
|
|
|
className="" |
|
|
|
|
transition={0.5} |
|
|
|
|
rightArrow={ |
|
|
|
|
<img |
|
|
|
|
className="absolute top-1/2 transform -translate-y-1/2 cursor-pointer p-2 -rotate-90" |
|
|
|
|
src={dropdownIcon} |
|
|
|
|
alt="" |
|
|
|
|
/> |
|
|
|
|
} |
|
|
|
|
leftArrow={ |
|
|
|
|
<img |
|
|
|
|
className="absolute top-1/2 transform -translate-y-1/2 -translate-x-5 cursor-pointer rotate-90 p-2 -left-3" |
|
|
|
|
src={dropdownIcon} |
|
|
|
|
alt="" |
|
|
|
|
/> |
|
|
|
|
} |
|
|
|
|
> |
|
|
|
|
{Items(4)} |
|
|
|
|
</Carousel> |
|
|
|
|
)} |
|
|
|
|
</div> */ |
|
|
|
|
} |
|
|
|
|