Merge branch 'dev' into fix/password-visibility

package.json

@@ -68,6 +68,7 @@
     "react-email": "2.1.5",
     "react-hook-form": "^7.52.2",
     "react-paginate": "^8.2.0",
+    "react-toastify": "^10.0.5",
     "recharts": "^2.12.7",
     "sharp": "^0.33.4",
     "swiper": "^11.1.9",

public/messages/en.json

@@ -46,7 +46,7 @@
     "otpExpiresIn": "OTP expires in: {timeLeft}",
     "resendCode": "Didn't receive the code? resend",
     "dataProcessing": "We would process your data as set forth in our Terms of Use, Privacy Policy and Data Processing Agreement",
-    "alreadyHaveAccount": "Already Have An Account? Login"
+    "alreadyHaveAccount": "Already Have An Account?"
   },
   "HomePage": {
     "title": "Hello world!"
@@ -153,6 +153,7 @@
   },
   "noJobs": {
     "noJobsTitle": "No available Jobs at the moment",
+
     "noJobsContent": "Sign up for our newsletter to get updates on job postings",
     "modalTitle": "Newsletter",
     "button": "Sign up for newsletter",

src/app/(landing-routes)/blog/page.tsx

@@ -1,14 +1,62 @@
 "use client";
 
+import axios from "axios";
+import { useSession } from "next-auth/react";
 import { useRouter } from "next/navigation";
+import { useEffect, useState } from "react";
 
+import { getApiUrl } from "~/actions/getApiUrl";
 import CustomButton from "~/components/common/common-button/common-button";
 import HeroSection from "~/components/extDynamicPages/blogCollection/BlogPageHero";
 import BlogCard from "~/components/layouts/BlogCards";
+import { useToast } from "~/components/ui/use-toast";
 import { blogPosts } from "./data/mock";
 
 const BlogHome = () => {
   const router = useRouter();
+  const { toast } = useToast();
+  const { data: session } = useSession();
+  const [, setBlogPost] = useState("");
+
+  useEffect(() => {
+    async function fetchBlog() {
+      try {
+        const apiUrl = await getApiUrl();
+        const token = session?.access_token;
+        const response = await axios.get(`${apiUrl}/api/v1/blogs`, {
+          headers: {
+            Authorization: `Bearer: ${token}`,
+          },
+        });
+        const data = response.data;
+        setBlogPost(data);
+        toast({
+          title:
+            Array.isArray(data.data) && data.data.length === 0
+              ? "No Blog Post Available"
+              : "Blog Posts Retrieved",
+          description:
+            Array.isArray(data.data) && data.data.length === 0
+              ? "Blog posts are empty"
+              : "Blog posts retrieved successfully",
+          variant:
+            Array.isArray(data.data) && data.data.length === 0
+              ? "destructive"
+              : "default",
+        });
+      } catch (error) {
+        toast({
+          title: "Error occured",
+          description:
+            error instanceof Error
+              ? error.message
+              : "An unknown error occurred",
+          variant: "destructive",
+        });
+      }
+    }
+    fetchBlog();
+  }, [session?.access_token, toast]);
 
   return (
     <div>

src/app/dashboard/(admin)/admin/(settings)/settings/data-and-privacy/page.tsx

@@ -2,6 +2,8 @@
 
 import { useState } from "react";
 
+import CustomButton from "~/components/common/common-button/common-button";
+
 interface ToggleSwitchProperties {
   label: string;
   description: string;
@@ -21,7 +23,7 @@ const ToggleSwitch: React.FC<ToggleSwitchProperties> = ({
   return (
     <div className="mb-4 rounded-md border p-6 shadow">
       <div className="mb-2 flex items-center justify-between">
-        <label className="text-2xl text-lg font-semibold">{label}</label>
+        <label className="text-2xl font-semibold">{label}</label>
         <label className="relative inline-block h-8 w-14">
           <input
             type="checkbox"
@@ -94,6 +96,14 @@ const Page = () => {
         description="Allow us to show you personalized ads based on your interests and browsing behavior. By enabling this feature, you consent to the use of data collected from your interactions within the app and across other platforms to deliver ads that are more relevant to you."
         apiEndpoint="/api/toggle-ads"
       />
+      <div className="mt-6 flex items-center justify-between gap-3 sm:justify-end">
+        <CustomButton variant="outline" className="font-[500] max-sm:w-full">
+          Cancel
+        </CustomButton>
+        <CustomButton variant="primary" className="font-[500] max-sm:w-full">
+          Save Changes
+        </CustomButton>
+      </div>
     </div>
   );
 };

src/app/dashboard/(admin)/admin/(settings)/settings/notification/page.tsx

@@ -77,7 +77,7 @@ const NotificationPage = () => {
   };
 
   return (
-    <main className="text-neutral-dark-2">
+    <main className="px-4 text-neutral-dark-2">
       <div className="mx-[24px] mb-[30px] flex w-fit items-center gap-1 md:hidden">
         <ChevronLeft size="18" className="text-muted-foreground" />
         <span className="font-[600] text-muted-foreground">Notification</span>
@@ -178,7 +178,7 @@ const NotificationPage = () => {
           />
         </section>
       </section>
-      <section className="text-center md:text-end">
+      <section className="text-end">
         <CustomButton
           variant="primary"
           icon={<Check />}

src/app/dashboard/(user-dashboard)/products/_components/new-product-modal.tsx

@@ -1,4 +1,5 @@
 // components/admin/NewProductModal.tsx
+
 import { zodResolver } from "@hookform/resolvers/zod";
 import { AnimatePresence, motion } from "framer-motion";
 import { Loader, X } from "lucide-react";

src/app/dashboard/(user-dashboard)/products/_components/product-detail-modal.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import { AnimatePresence, motion } from "framer-motion";
 import { Loader2, X } from "lucide-react";
 import { useSession } from "next-auth/react";

src/app/dashboard/(user-dashboard)/products/_components/productcadrcomponent.tsx

@@ -0,0 +1,67 @@
+"use client";
+
+import Image, { StaticImageData } from "next/image";
+
+interface ProductCardProperties {
+  title: string;
+  price: string;
+  description: string;
+  inStock: boolean;
+  imageUrl: string | StaticImageData;
+}
+
+const Delete = () => {
+  alert("Are you sure you want to delete");
+};
+
+const Edit = () => {
+  alert("Proceed to edit");
+};
+
+const ProductCard: React.FC<ProductCardProperties> = ({
+  title,
+  price,
+  description,
+  inStock,
+  imageUrl,
+}) => {
+  return (
+    <div className="max-w-sm overflow-hidden rounded-md border-[1px] border-[#D9D9D9] bg-white p-3 shadow-md">
+      <Image
+        src={imageUrl}
+        alt={title}
+        width={400}
+        height={300}
+        className="h-48 w-full rounded-md object-cover"
+      />
+      <div className="p-4">
+        <div className="flex items-center justify-between">
+          <h2 className="text-xl font-bold">{title}</h2>
+          <p className="mt-1 text-[20px] font-bold text-gray-900">{price}</p>
+        </div>
+        <p className="mb-4 text-base text-gray-700">{description}</p>
+        <span
+          className={`mt-3 px-5 py-2 text-sm ${inStock ? "rounded-full bg-[#E7F7E9] text-green-500" : "bg-[#FDE7E7] text-red-500"}`}
+        >
+          {inStock ? "In stock" : "Out of stock"}
+        </span>
+        <div className="mt-6 flex justify-between space-x-2">
+          <button
+            onClick={Edit}
+            className="w-[130px] rounded-md border-[1px] px-4 py-2 text-black"
+          >
+            Edit
+          </button>
+          <button
+            onClick={Delete}
+            className="w-[130px] rounded-md border-[1px] bg-white px-4 py-2 text-[#DC2626]"
+          >
+            Delete
+          </button>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default ProductCard;