Commit Review Workspace ?

- import { Mail, MapPin, MessageCircle, Phone } from "lucide-react";
- import { Badge } from "@/components/ui/badge";
- import { Button } from "@/components/ui/button";
- import InnerBanner from "@/components/inner-banner";
- 
- export default function ContactPage() {
- return (
- <div>
- <InnerBanner title="Contact Us" />
- </div>
- 
- <Card className="p-6">
-           <h2 className="text-2xl font-semibold font-serif">We'd love to hear from you.
-           </h2>
-           <p className="mt-[10px] text-sm leading-7 text-[#6f6f6f] sm:text-base">Got a question? Need help choosing the right product or service? Just want to say hi?
- We're here - and we actually read and respond to every message.
- </p>
- <div className="mt-6 grid gap-4">

+ // import { Mail, MapPin, MessageCircle, Phone } from "lucide-react";
+ // import { Badge } from "@/components/ui/badge";
+ // import { Button } from "@/components/ui/button";
+ // import { Card } from "@/components/ui/card";
+ // import { Input } from "@/components/ui/input";
+ // import InnerBanner from "@/components/inner-banner";
+ 
+ // export default function ContactPage() {
+ //   return (
+ //     <div>
+ //       <InnerBanner title="Contact Us" />
+ 
+ //       <section className="mx-auto grid max-w-7xl gap-8 px-4 py-14 sm:px-6 lg:grid-cols-[0.8fr_1.2fr] lg:px-8">
+ //         <div className="space-y-4">
+ //           {[
+ //             { icon: MessageCircle, label: "WhatsApp", value: "+91 00000 00000" },
+ //             { icon: Mail, label: "Email", value: "hello@avriti.com" },
+ //             { icon: Phone, label: "Consultation support", value: "Mon-Sat, 10 AM - 7 PM IST" },

- 
- import { useEffect, useState } from "react";
- import Image from "next/image";
- import { ProductCard } from "@/components/product-card";
- import Link from "next/link";
- import { PdfBrowserFrame } from "@/components/pdf-browser-frame";
- import { Button } from "@/components/ui/button";
- import { ServiceSlider } from "@/components/service-slider";
- import { FAQ } from "@/components/faq";
- import { TestimonialSlider } from "@/components/testimonial-slider";
- 
- <div className="my-[50px] md:my-[80px] mx-auto max-w-7xl">
- <h2 className="leading-normal text-center text-[var(--color-primary-700)] font-serif text-[32px] md:text-[50px] mb-[30px]">Shop</h2>
- 
-         <div className="grid grid-cols-1 md:grid-cols-3 gap-6">
-           {featuredProducts.map((product) => (
-             <ProductCard key={product.slug} product={product} />
-           ))}

+ 
+ import { useEffect, useState } from "react";
+ import Image from "next/image";
+ import Link from "next/link";
+ import { PdfBrowserFrame } from "@/components/pdf-browser-frame";
+ import { Button } from "@/components/ui/button";
+ import { ServiceSlider } from "@/components/service-slider";
+ import { ProductSlider } from "@/components/product-slider";
+ import { FAQ } from "@/components/faq";
+ import { TestimonialSlider } from "@/components/testimonial-slider";
+ 
+ <div className="my-[50px] md:my-[80px] mx-auto max-w-7xl">
+ <h2 className="leading-normal text-center text-[var(--color-primary-700)] font-serif text-[32px] md:text-[50px] mb-[30px]">Shop</h2>
+ 
+         <ProductSlider products={featuredProducts} />
+         
+ </div>

- import Image from "next/image";
- import Link from "next/link";
- import { Eye, Hash, Home, MoonStar } from "lucide-react";
- import { PdfBrowserFrame } from "@/components/pdf-browser-frame";
- 
- const serviceCards = [
-   {
-     href: "/services/numerology",
-     title: "Avriti Numerology",
-     body: "Your name and birth date hold a blueprint. Let's decode it.",
-     icon: Hash,
-   },
-   {
-     href: "/services/tarot",
-     title: "Avriti Drishti",
-     body: "Tarot decks, oracle cards, altar cloth. Tools for those who trust the unseen.",
-     icon: Eye,
-   },

+ "use client";
+ 
+ import { useEffect, useState } from "react";
+ import Image from "next/image";
+ import { PdfBrowserFrame } from "@/components/pdf-browser-frame";
+ 
+ type ServiceCard = {
+   s_card_name: string;
+   s_card_description: string;
+   s_card_icon: string | null;
+ };
+ 
+ type ServiceData = {
+   s_heading: string;
+   s_sub_heading: string;
+   s_description: string;
+   s_image: string | null;
+   cards: ServiceCard[];

- <h3 className="mt-2 text-lg mb-[20px] text-[var(--textcolor)] font-normal">
- {product.name}{product.attrName ? ` - ${product.attrName}` : ""}
- </h3>
-         <div className={`relative ${product.tone}`}>
- 
- <img
- src={product.image}
- alt={product.name}
-             sizes="(min-width: 1024px) 25vw, 90vw"
-             className="w-[60%] object-contain  mix-blend-multiply ml-auto mr-auto"
- />
- 
- </div>
- 
- <div className="mt-[20px]">

+ <h3 className="mt-2 text-lg mb-[20px] text-[var(--textcolor)] font-normal">
+ {product.name}{product.attrName ? ` - ${product.attrName}` : ""}
+ </h3>
+         <div className={`relative h-[400px] ${product.tone}`}>
+ <img
+ src={product.image}
+ alt={product.name}
+             className="w-full h-full object-contain mix-blend-multiply"
+ />
+ </div>
+ 
+ <div className="mt-[20px]">

+ "use client";
+ 
+ import { ChevronLeft, ChevronRight } from "lucide-react";
+ import { useCallback, useEffect, useRef, useState } from "react";
+ import { ProductCard } from "@/components/product-card";
+ import { cn } from "@/lib/utils";
+ 
+ type FeaturedProduct = {
+   slug: string;
+   name: string;
+   attrName: string;
+   price: string;
+   image: string;
+   tone: string;
+   category: string;
+   badge: string;
+   description: string;
+ };

- };
- }, [updateSliderState]);
- 
- const goToSlide = (index: number) => {
- const track = trackRef.current;
- const slide = track?.children[index] as HTMLElement | undefined;
- key={`${testimonial.name}-${testimonial.quote}`}
- className="min-w-0 shrink-0 basis-full snap-start md:basis-[calc((100%-24px)/2)] lg:basis-[calc((100%-48px)/3)]"
- >
-             <div className="flex min-h-[280px] flex-col justify-between rounded-[20px] bg-white px-6 py-7 shadow-[var(--shadow-soft)] md:py-8">
- <div>
- <Quote
- size={25}

+ };
+ }, [updateSliderState]);
+ 
+   useEffect(() => {
+     const interval = setInterval(() => {
+       const track = trackRef.current;
+       if (!track) return;
+ 
+       const maxScrollLeft = track.scrollWidth - track.clientWidth;
+       if (track.scrollLeft >= maxScrollLeft - 1) {
+         track.scrollTo({ left: 0, behavior: "smooth" });
+       } else {
+         const firstSlide = track.children[0] as HTMLElement | undefined;
+         const gap = Number.parseFloat(window.getComputedStyle(track).gap) || 0;
+         const distance = (firstSlide?.getBoundingClientRect().width ?? 0) + gap;
+         track.scrollBy({ left: distance, behavior: "smooth" });
+       }
+     }, 3000);

- "I came in unsure of what I needed and left with simple steps I could actually follow.",
- name: "Consultation client",
- },
- ];

+ "I came in unsure of what I needed and left with simple steps I could actually follow.",
+ name: "Consultation client",
+ },
+   {
+     quote:
+       " fake I came in unsure of what I needed and left with simple steps I could actually follow.",
+     name: " fake Consultation client",
+   },
+   {
+     quote:
+       " fakeI came in unsure of what I needed and left with simple steps I could actually follow.",
+     name: " fake Consultation client",
+   },
+   {
+     quote:
+       "fake I came in unsure of what I needed and left with simple steps I could actually follow.",
+     name: "fake  Consultation client",
+   },