parsa/parsaaghayi-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

pagination added to filterd-posts

Browse Source
This commit is contained in:
parsa aghaei 2024-10-14 16:01:15 +03:30
parent 53547cf9cd
commit 931b72bceb
4 changed files with 28 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/(routes)/blog/categories/[categorySlug]/page.tsx
View File

@ -65,7 +65,7 @@ export default async function SingleCategory({
</li>
</ul>
<div className="flex w-full flex-wrap justify-center gap-10">
<div className="flex w-full flex-wrap justify-center gap-10 mb-10">
{categoryData.posts.length > 0 ? (
categoryData.posts.map((post) => (
<div

4
src/app/(routes)/blog/categories/page.tsx
View File

@ -48,14 +48,14 @@ export default async function Categories({
<li className="flex items-center gap-2">
<p className="relative text-[12px] font-[600] capitalize text-blog-text-default">
categories
<span className="absolute -end-5 -top-2 flex h-5 w-5 items-center justify-center rounded-full bg-blog-red">
<span className="absolute -end-6 -top-2 flex h-5 w-5 items-center justify-center rounded-full bg-blog-red">
{CategoriesData.meta.total}
</span>
</p>
</li>
</ul>
<div className="mb-10 flex w-full flex-wrap justify-center gap-10">
<div className="mb-10 flex w-full flex-wrap justify-center gap-10 mb-10">
{CategoriesData.data.length > 0 ? (
CategoriesData.data.map((category: CategoryType) => (
<div

31
src/app/(routes)/blog/filtered-posts/[filter]/page.tsx
View File

@ -1,9 +1,12 @@
import { FilteredPostsPagepropsType, PostType } from "@/app/types/types";
import Image from "next/image";
import Link from "next/link";
import NoDataFounded from "../../components/no-data-founded/noDataFounded";
import Pagination from "../../components/pagination/pagination";
export default async function FilteredPosts({
params,
searchParams,
}: FilteredPostsPagepropsType) {
let filteredPostApiUrl: string;
@ -20,17 +23,17 @@ export default async function FilteredPosts({
filteredPostApiUrl = "";
}
let FilteredPostsData: { data: PostType[] };
let FilteredPostsData: { data: PostType[]; link: any; meta: any };
if (filteredPostApiUrl !== "") {
FilteredPostsData = await fetch(
`${process.env.NEXT_PUBLIC_API_URL}${filteredPostApiUrl}`,
`${process.env.NEXT_PUBLIC_API_URL}${filteredPostApiUrl}&per_page=${searchParams.per_page ? searchParams.per_page : process.env.NEXT_PUBLIC_POSTS_PER_FILTERED_POSTS_PAGE}${searchParams.page ? `&page=${searchParams.page}` : ""}`,
{
cache: "no-store",
},
).then((res) => res.json());
} else {
FilteredPostsData = { data: [] };
FilteredPostsData = { data: [], meta: null, link: null };
}
return (
@ -62,14 +65,18 @@ export default async function FilteredPosts({
</span>
</li>
<li className="flex items-center gap-2">
<p className="text-[12px] font-[600] capitalize text-blog-text-default">
<p className="relative text-[12px] font-[600] capitalize text-blog-text-default">
{params.filter.replaceAll(/%20|-|_/g, " ").toLowerCase()}
<span className="absolute -end-6 -top-2 flex h-5 w-5 items-center justify-center rounded-full bg-blog-red">
{FilteredPostsData.meta.total}
</span>
</p>
</li>
</ul>
<div className="flex w-full max-w-[90%] flex-wrap justify-center gap-10">
{FilteredPostsData.data.length > 0 &&
<div className="mb-10 flex w-full max-w-[90%] flex-wrap justify-center gap-10">
{FilteredPostsData.data.length > 0 ? (
FilteredPostsData.data.map((post: PostType) => (
<div
key={post.id}
@ -117,8 +124,18 @@ export default async function FilteredPosts({
{post.excerpt}
</p>
</div>
))}
))
) : (
<NoDataFounded />
)}
</div>
{FilteredPostsData.data.length > 0 &&
FilteredPostsData.meta.last_page > 1 && (
<Pagination
meta={FilteredPostsData.meta}
baseUrl={`/blog/filtered-posts/${params.filter.replaceAll(/%20|-|_/g, " ").toLowerCase()}`}
/>
)}
</div>
</div>
);

1
src/app/types/types.ts
View File

@ -80,6 +80,7 @@ export type CategoryDataType = {
export type FilteredPostsPagepropsType = {
params: { filter: string };
searchParams: any;
};
export type PostSlugPagepropsType = {