Merge pull request #109 from SpaceyaTech/add-related-blogs-header

Related blogs header
SpaceyaTech · Jan 15, 2024 · 39da8ad · 39da8ad
2 parents a2f91d3 + 65e563d
commit 39da8ad
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 20 deletions.
diff --git a/src/APP/pages/blog/sections/RelatedBlogs.jsx b/src/APP/pages/blog/sections/RelatedBlogs.jsx
@@ -29,22 +29,27 @@ function RelatedBlogs({ blogId, categoryId }) {
       {isError && <p>Error loading blogs!</p>}
       {isLoading && <p>Loading blogs...</p>}
 
-      {isSuccess && (
-        <div className="grid sm:grid-cols-2 gap-16 grid-cols-1 py-16">
-          {Array.isArray(filteredRelatedBlogs) &&
-          filteredRelatedBlogs.length > 0 ? (
-            filteredRelatedBlogs.filter(function(blog){
-              if(blog.id === blogId ) {
-                return false;
-              }
-              return true;
-            }).map((blog) => (
-              <BlogCard key={blog.id} blog={blog} />
-            ))
-          ) : (
-            <p>No related blogs found!</p>
-          )}
-        </div>
+      {isSuccess && filteredRelatedBlogs.length > 0 && (
+        <>
+          <h2 className="text-2xl text-gray-500 font-semibold underline decoration-green-600 underline-offset-2">
+            Related Blogs
+          </h2>
+          <div className="grid sm:grid-cols-2 gap-16 grid-cols-1 py-16">
+            {Array.isArray(filteredRelatedBlogs) &&
+            filteredRelatedBlogs.length > 0 ? (
+              filteredRelatedBlogs
+                .filter(function (blog) {
+                  if (blog.id === blogId) {
+                    return false;
+                  }
+                  return true;
+                })
+                .map((blog) => <BlogCard key={blog.id} blog={blog} />)
+            ) : (
+              <p className="text-lg italic">No related blogs found!</p>
+            )}
+          </div>
+        </>
       )}
     </>
   );

diff --git a/src/APP/pages/blogs/sections/BlogsWrapper.jsx b/src/APP/pages/blogs/sections/BlogsWrapper.jsx
@@ -19,7 +19,9 @@ function SearchResults({ searchText }) {
   return (
     <h3 className="text-black text-xl md:text-3xl font-semibold leading-8 md:leading-loose text-center">
       Showing results for
-      <span className="text-primary">"{searchText}"</span>
+
+      <span className="text-primary"> "{searchText}"</span>
+
     </h3>
   );
 }
@@ -30,8 +32,6 @@ function BlogsWrapper() {
   const [selectedCat, setSelectedCat] = useState("");
   const [page, setPage] = useState(1);
 
-  const navigate = useNavigate();
-
   const {
     data: blogsData,
     refetch: refetchBlogsData,
@@ -66,7 +66,7 @@ function BlogsWrapper() {
 
   return (
     <div className="flex flex-col items-start md:items-center gap-6 px-4 pt-4 xl:px-14 w-full mb-10">
-      {isError && navigate("/error-500")}
+      {isError && <Error500 />}
       {isLoading && (
         <div className="w-full flex flex-col items-center justify-center gap-5 py-10">
           <Loader />