Add pagination for comment search results and render results table based on view

components/home/searches/searchesResults/CommentPermlinkSearchResults.tsx

@@ -3,6 +3,10 @@ import CommentPermlinkResultTable from "../CommentPermlinkResultTable";
 import { useSearchesContext } from "@/contexts/SearchesContext";
 import { getCommentPageLink } from "../utils/commentSearchHelpers";
 import PostTypeSelector from "../PostTypeSelector";
+import CustomPagination from "@/components/CustomPagination";
+import { config } from "@/Config";
+import { useRouter } from "next/router";
+import AccountCommentPermlinkResultTable from "@/components/account/tabs/posts/AccountCommentPermlinkResultTable";
 
 const CommentPermlinkSearchResults = () => {
   const {
@@ -11,7 +15,11 @@ const CommentPermlinkSearchResults = () => {
     setCommentType,
     setPermlinkSearchProps,
     searchRanges,
+    permlinkPaginationPage,
+    setPermlinkPaginationPage,
   } = useSearchesContext();
+  const router = useRouter();
+  const isAccountPage = Boolean(router.query.accountName) || false;
 
   const { permlinkSearchData } = usePermlinkSearch(permlinkSearchProps);
 
@@ -42,10 +50,27 @@ const CommentPermlinkSearchResults = () => {
 
   if (!permlinkSearchData) return;
 
+  const changePermlinkSearchPagination = (newPageNum: number) => {
+    const newSearchProps: any = {
+      ...permlinkSearchProps,
+      pageNumber: newPageNum,
+    };
+    setPermlinkSearchProps(newSearchProps);
+    setPermlinkPaginationPage(newPageNum);
+  };
+
   return (
     <>
       {permlinkSearchData.total_permlinks ? (
         <div>
+          <div className="flex justify-center items-center text-text">
+            <CustomPagination
+              currentPage={permlinkPaginationPage}
+              totalCount={permlinkSearchData.total_permlinks}
+              pageSize={config.standardPaginationSize}
+              onPageChange={changePermlinkSearchPagination}
+            />
+          </div>
           <div className="flex justify-end my-4">
             <PostTypeSelector
               handleChange={handleChangeCommentType}
@@ -54,11 +79,18 @@ const CommentPermlinkSearchResults = () => {
           </div>
 
           <div className="flex flex-wrap">
-            <CommentPermlinkResultTable
-              buildLink={buildLink}
-              data={permlinkSearchData.permlinks_result}
-              accountName={accountName}
-            />
+            {isAccountPage ? (
+              <AccountCommentPermlinkResultTable
+                data={permlinkSearchData.permlinks_result}
+                accountName={accountName}
+              />
+            ) : (
+              <CommentPermlinkResultTable
+                buildLink={buildLink}
+                data={permlinkSearchData.permlinks_result}
+                accountName={accountName}
+              />
+            )}
           </div>
         </div>
       ) : (