From af96e3ade8ff32d29dfbda1a63b2d031ee75252e Mon Sep 17 00:00:00 2001 From: Huilensolis Date: Fri, 15 Mar 2024 12:28:56 -0300 Subject: [PATCH] refactor(app): 95 posts grid --- src/app/(site)/app/components/feed/index.tsx | 6 +++--- .../recent-posts/recent-pots.component.tsx | 8 ++++---- .../components/user-posts/user-posts.component.tsx | 7 +++---- .../searched-posts-grid.component.tsx | 6 +++--- .../feature/posts-grid/posts-grid.component.tsx | 12 ++++++------ 5 files changed, 19 insertions(+), 20 deletions(-) diff --git a/src/app/(site)/app/components/feed/index.tsx b/src/app/(site)/app/components/feed/index.tsx index ef1b113..f65b5d3 100644 --- a/src/app/(site)/app/components/feed/index.tsx +++ b/src/app/(site)/app/components/feed/index.tsx @@ -8,16 +8,16 @@ export function Feed() { async function fetchNewPosts({ currentPage, signal, - postsCuantity, + pageSize, }: { currentPage: number; signal: AbortSignal; - postsCuantity: number; + pageSize: number; }) { return await supabase .from("posts") .select("*") - .range(currentPage, currentPage + postsCuantity) + .range(currentPage, currentPage + pageSize) .abortSignal(signal); } diff --git a/src/app/(site)/app/post/[postid]/components/recent-posts/recent-pots.component.tsx b/src/app/(site)/app/post/[postid]/components/recent-posts/recent-pots.component.tsx index 4c4ed44..cf4adec 100644 --- a/src/app/(site)/app/post/[postid]/components/recent-posts/recent-pots.component.tsx +++ b/src/app/(site)/app/post/[postid]/components/recent-posts/recent-pots.component.tsx @@ -14,18 +14,18 @@ export function RecentPosts({ async function fetchNewPosts({ currentPage, signal, - postsCuantity, + pageSize, }: { currentPage: number; signal: AbortSignal; - postsCuantity: number; + pageSize: number; }) { return supabase .from("posts") .select("*") - .neq("id", excludedPostId) + .neq("id", excludedPostId) // exclude the posts that has the id equal to excludedPostId .order("title", { ascending: false }) - .range(currentPage, currentPage + postsCuantity) + .range(currentPage, currentPage + pageSize) .abortSignal(signal); } diff --git a/src/app/(site)/app/profile/[username]/components/user-posts/user-posts.component.tsx b/src/app/(site)/app/profile/[username]/components/user-posts/user-posts.component.tsx index 40577b1..1498b18 100644 --- a/src/app/(site)/app/profile/[username]/components/user-posts/user-posts.component.tsx +++ b/src/app/(site)/app/profile/[username]/components/user-posts/user-posts.component.tsx @@ -9,19 +9,18 @@ export function UserPosts({ profileId }: { profileId: string }) { async function fetchNewPosts({ currentPage, signal, - postsCuantity, + pageSize, }: { currentPage: number; signal: AbortSignal; - postsCuantity: number; + pageSize: number; }) { return await supabase .from("posts") .select("*") .eq("profile_id", profileId) .order("created_at", { ascending: false }) - .limit(32) - .range(currentPage, currentPage + postsCuantity) + .range(currentPage, currentPage + pageSize) .abortSignal(signal); } diff --git a/src/app/(site)/app/search/components/searched-posts-grid/searched-posts-grid.component.tsx b/src/app/(site)/app/search/components/searched-posts-grid/searched-posts-grid.component.tsx index 256da6c..83c8aae 100644 --- a/src/app/(site)/app/search/components/searched-posts-grid/searched-posts-grid.component.tsx +++ b/src/app/(site)/app/search/components/searched-posts-grid/searched-posts-grid.component.tsx @@ -11,18 +11,18 @@ export function SearchedPostsGrid({ searchValue }: { searchValue: string }) { async function fetchNewPosts({ signal, currentPage, - postsCuantity, + pageSize, }: { currentPage: number; signal: AbortSignal; - postsCuantity: number; + pageSize: number; }) { return await supabase .from("posts") .select("*") .ilike("title", `%${searchValue}%`) .order("created_at", { ascending: false }) - .range(currentPage, currentPage + postsCuantity) + .range(currentPage, currentPage + pageSize) .abortSignal(signal); } diff --git a/src/components/feature/posts-grid/posts-grid.component.tsx b/src/components/feature/posts-grid/posts-grid.component.tsx index b4576f8..ce17e76 100644 --- a/src/components/feature/posts-grid/posts-grid.component.tsx +++ b/src/components/feature/posts-grid/posts-grid.component.tsx @@ -2,7 +2,6 @@ import { useCallback, useEffect, useRef, useState } from "react"; import { PostsGridRow } from "./components/posts-grid-row"; import { PostsGridContainer } from "./components/posts-grid-container"; import { type Database } from "@/supabase/types"; -import { PostsGridSkeleton } from "./components/posts-grid-skeleton"; import { type PostgrestSingleResponse } from "@supabase/supabase-js"; type TPost = Database["public"]["Tables"]["posts"]["Row"]; @@ -10,11 +9,13 @@ type TPost = Database["public"]["Tables"]["posts"]["Row"]; type TOnFetchNewPostsProps = { currentPage: number; signal: AbortSignal; - postsCuantity: number; + pageSize: number; }; +const PAGE_SIZE = 30; + type TOnFetchNewPosts = ({ - postsCuantity, + pageSize, signal, currentPage, }: TOnFetchNewPostsProps) => Promise>; @@ -110,18 +111,17 @@ export function PostsGrid({ const { data: newPosts, error } = await onFetchNewPosts({ signal: controller.signal, currentPage: page, - postsCuantity: 32, + pageSize: PAGE_SIZE, }); if (error) { if (error instanceof Error && error.message === "AbortError") { - console.log("error is sinstance of error"); + // error is caused by an abortcontroller abort signal return; } if (error.code === "20") { return; // this means there is been throwed an error because the request has been aborted } - console.log({ error }); throw new Error("eror fetching new posts"); }