diff --git a/src/views/Products/layouts/Desktop/Main.js b/src/views/Products/layouts/Desktop/Main.js index 717bd66..e41bb9a 100644 --- a/src/views/Products/layouts/Desktop/Main.js +++ b/src/views/Products/layouts/Desktop/Main.js @@ -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 (
+
+

My Blog

+ +
-{(filterOptions?.productType - ? filterOptions.productType === "دوره ویدئویی" - : true) && ( - - } - leftArrow={ - - } - > - {Items(4)} - -)} -
*/ -} diff --git a/src/views/Products/layouts/Desktop/Posts.js b/src/views/Products/layouts/Desktop/Posts.js new file mode 100644 index 0000000..7e5ace7 --- /dev/null +++ b/src/views/Products/layouts/Desktop/Posts.js @@ -0,0 +1,18 @@ +import React from "react"; + +const Posts = ({ posts, loading }) => { + if (loading) { + return

loading...

; + } + return ( + + ); +}; + +export default Posts;