Dev resolve conflicts

.vs/ProjectSettings.json

@@ -0,0 +1,3 @@
+{
+  "CurrentProjectSetting": null
+}

.vs/VSWorkspaceState.json

@@ -0,0 +1,6 @@
+{
+  "ExpandedNodes": [
+    ""
+  ],
+  "PreviewInSolutionExplorer": false
+}

package.json

@@ -57,7 +57,7 @@
     "postcss": "^8.4.23",
     "prettier": "^2.8.8",
     "tailwindcss": "^3.3.2",
-    "vite": "^4.3.2"
+    "vite": "^4.5.1"
   },
   "lint-staged": {
     "**/*.{js,jsx}": [

src/APP/components/Footer2.jsx

@@ -128,7 +128,6 @@ function Footer2() {
                     Gallery
                   </a>
                 </li>
-
               </ul>
             </div>
 
@@ -160,7 +159,6 @@ function Footer2() {
                   special offers
                 </p>
 
-
                 <form className="flex items-center">
                   <input
                     type="email"
@@ -170,15 +168,13 @@ function Footer2() {
                   <button
                     type="submit"
                     className="rounded-r-lg px-2 md:px-4 py-3 flex-auto font-semibold text-white transition-all duration-200 bg-primary border border-transparent hover:bg-gray-700 focus:ring-2 focus:ring-offset-2 focus:ring-gray-900"
-
                   >
                     Subscribe
                   </button>
                 </form>
               </div>
             </div>
           </div>
-
         </div>
 
         <div className="sm:mt-14 mt-10">

src/APP/pages/blog/sections/BlogWrapper.jsx

@@ -8,7 +8,6 @@ import logo from "../../../../assets/images/sytLogo.png";
 import "./blogWrapper.css";
 
 const BlogWrapper = ({ blog }) => {
-
   const timeAgo = formatDistanceToNow(new Date(blog?.created_at), {
     addSuffix: true,
   });

src/APP/pages/blog/sections/RelatedBlogs.jsx

@@ -4,7 +4,6 @@ import { useRelatedBlogsData } from "../../../../hooks/Queries/blog/useBlogData"
 import BlogCard from "../../blogs/sections/BlogCard";
 import { filterRelatedBlogs } from "../../../../utilities/FilterBlogs";
 
-
 function RelatedBlogs({ blogId, categoryId }) {
   const { title_slug } = useParams();
 
@@ -25,7 +24,6 @@ function RelatedBlogs({ blogId, categoryId }) {
     title_slug
   );
 
-
   return (
     <>
       {isError && <p>Error loading blogs!</p>}
@@ -34,7 +32,6 @@ function RelatedBlogs({ blogId, categoryId }) {
       {isSuccess && filteredRelatedBlogs.length > 0 && (
         <>
           <h2 className="text-2xl text-gray-500 font-semibold underline decoration-green-600 underline-offset-2">
-
             {filteredRelatedBlogs.length > 1
               ? "Related Articles"
               : "Related Article"}

src/APP/pages/blogs/sections/BlogCard.jsx

@@ -1,74 +1,75 @@
-import React from "react";
-import { useNavigate, Link } from "react-router-dom";
-import { formatDistanceToNow } from "date-fns";
-
-import { arrowRight } from "../../../../assets/images/blogs-page";
-import logo from "../../../../assets/images/sytLogo.png";
-import BlogStats from "./BlogStats";
-
-function BlogCard({ blog }) {
-  const navigate = useNavigate();
-  const timeAgo =
-    blog?.created_at &&
-    formatDistanceToNow(new Date(blog?.created_at), {
-      addSuffix: true,
-    });
-
-  return (
-    <Link
-      to={`/blogs/${blog.title_slug}`}
-
-      className="flex flex-col items-start w-full mb-5"
-    >
-      <img
-        src={blog.image}
-        alt="blog"
-        className="w-full h-60 object-cover rounded-lg"
-      />
-
-      <div className="py-[6px] flex flex-col gap-[10px] w-full mt-2">
-        <div className="flex flex-col lg:flex-row justify-between items-start gap-2">
-          <h3 className="text-xl text-[#323433] font-semibold">{blog.title}</h3>
-
-          <BlogStats likes={blog.likes <= 1 ? "" : blog.likes} />
-        </div>
-
-        <p className="text-base font-normal leading-6 text-[#4C4D4D] line-clamp-3">
-          {blog.description}
-        </p>
-
-        <div className="flex flex-row items-start justify-between">
-          <div className="flex gap-[10px]">
-            <img
-              src={logo}
-              alt="icon"
-              className="w-10 h-10 object-cover bg-gray-200 flex items-center justify-center p-1 rounded-full"
-            />
-
-            <div className="flex flex-col gap-1 text-sm">
-              <h4 className="capitalize font-medium text-[#323433]">
-                {blog.author}
-              </h4>
-
-              <span className="text-[#656767]">{timeAgo}</span>
-            </div>
-          </div>
-
-          <button
-            className="flex gap-2 items-center justify-between"
-            onClick={() => {
-              navigate(`/blogs/${blog.title_slug}`);
-            }}
-          >
-            <span className="uppercase text-primary text-sm font-medium m-0">
-              read more
-            </span>
-            <img src={arrowRight} alt="arrow-right" className="w-5 h-5" />
-          </button>
-        </div>
-      </div>
-    </Link>
-  );
-}
-
-export default BlogCard;
+/* eslint-disable react/prop-types */
+import React from "react";
+import { useNavigate, Link } from "react-router-dom";
+import { formatDistanceToNow } from "date-fns";
+
+import { arrowRight } from "../../../../assets/images/blogs-page";
+import logo from "../../../../assets/images/sytLogo.png";
+import BlogStats from "./BlogStats";
+
+function BlogCard({ blog }) {
+  const navigate = useNavigate();
+
+  const timeAgo =
+    blog?.created_at &&
+    formatDistanceToNow(new Date(blog?.created_at), {
+      addSuffix: true,
+    });
+
+  return (
+    <Link
+      to={`/blogs/${blog.title_slug}`}
+      className="flex flex-col items-start w-full mb-5"
+    >
+      <img
+        src={blog.image}
+        alt="blog"
+        className="w-full h-60 object-cover rounded-lg"
+      />
+
+      <div className="py-[6px] flex flex-col gap-[10px] w-full mt-2">
+        <div className="flex flex-col lg:flex-row justify-between items-start gap-2">
+          <h3 className="text-xl text-[#323433] font-semibold">{blog.title}</h3>
+
+          <BlogStats likes={blog.likes <= 1 ? "" : blog.likes} />
+        </div>
+
+        <p className="text-base font-normal leading-6 text-[#4C4D4D] line-clamp-3">
+          {blog.description}
+        </p>
+
+        <div className="flex flex-row items-start justify-between">
+          <div className="flex gap-[10px]">
+            <img
+              src={logo}
+              alt="icon"
+              className="w-10 h-10 object-cover bg-gray-200 flex items-center justify-center p-1 rounded-full"
+            />
+
+            <div className="flex flex-col gap-1 text-sm">
+              <h4 className="capitalize font-medium text-[#323433]">
+                {blog.author}
+              </h4>
+              <span className="text-[#656767]">{timeAgo}</span>
+            </div>
+          </div>
+
+          <button
+            type="button"
+            className="flex gap-2 items-center justify-between"
+            onClick={() => {
+              navigate(`/blogs/${blog.title_slug}`);
+            }}
+          >
+            <span className="uppercase text-primary text-sm font-medium m-0">
+              read more
+            </span>
+            <img src={arrowRight} alt="arrow-right" className="w-5 h-5" />
+          </button>
+        </div>
+      </div>
+    </Link>
+  );
+}
+
+export default BlogCard;

src/APP/pages/blogs/sections/BlogsWrapper.jsx

@@ -1,7 +1,7 @@
 /* eslint-disable operator-linebreak */
 /* eslint-disable react/jsx-indent */
 import React, { useState, useEffect, useContext } from "react";
-import { useNavigate } from "react-router-dom";
+// import { useNavigate } from "react-router-dom";
 
 import BlogCard from "./BlogCard";
 import BlogPagination from "./BlogPagination";
@@ -13,20 +13,18 @@ import {
 } from "../../../../hooks/Queries/blogs/useAllBlogsData";
 
 import { filterBlogsByCat } from "../../../../utilities/FilterBlogs";
+
 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>
-
     </h3>
   );
 }
 
 function BlogsWrapper() {
   const { searchText, searchBlog } = useContext(SearchBlogContext);
-
   const [selectedCat, setSelectedCat] = useState("");
   const [page, setPage] = useState(1);
 
@@ -74,7 +72,6 @@ function BlogsWrapper() {
       {isSuccess && (
         <>
           <div className="w-full md:w-fit overflow-x-auto md:overflow-auto flex flex-row items-center gap-4 md:px-3 md:gap-3 md:mb-2">
-
             {statusBlogCategories === "error" && (
               <p>Error loading blog categories!</p>
             )}

src/hooks/Queries/blog/useBlogData.jsx

@@ -1,7 +1,6 @@
 import axios from "axios";
 import { useQuery } from "@tanstack/react-query";
 
-
 const fetchBlogData = async (title_slug) => {
   try {
     const response = await axios.get(