Merge version_4 into main

Merge version_4 into main

src/app/dashboard/page.tsx

@@ -0,0 +1,69 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
+import { LayoutDashboard, ShoppingBag, Heart, Settings, User } from "lucide-react";
+
+export default function DashboardPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="hover-magnetic"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="pill"
+        contentWidth="small"
+        sizing="large"
+        background="blurBottom"
+        cardStyle="solid"
+        primaryButtonStyle="diagonal-gradient"
+        secondaryButtonStyle="radial-glow"
+        headingFontWeight="extrabold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleCentered
+            navItems={[
+              { name: "Home", id: "/" },
+              { name: "Dashboard", id: "#" }
+            ]}
+            brandName="ServiceConnect"
+          />
+        </div>
+
+        <main className="container mx-auto py-20 px-4">
+          <h1 className="text-4xl font-extrabold mb-10">Customer Dashboard</h1>
+          <div className="grid grid-cols-1 md:grid-cols-2 gap-8">
+            <div className="p-6 border rounded-3xl bg-card shadow-sm">
+              <div className="flex items-center gap-3 mb-4"><User /> <h2 className="text-xl font-bold">Profile</h2></div>
+              <p>View and edit your personal information and preferences.</p>
+            </div>
+            <div className="p-6 border rounded-3xl bg-card shadow-sm">
+              <div className="flex items-center gap-3 mb-4"><ShoppingBag /> <h2 className="text-xl font-bold">Order History</h2></div>
+              <p>Track your current and past service bookings.</p>
+            </div>
+            <div className="p-6 border rounded-3xl bg-card shadow-sm">
+              <div className="flex items-center gap-3 mb-4"><Heart /> <h2 className="text-xl font-bold">Saved Items</h2></div>
+              <p>Manage your favorite services and companies.</p>
+            </div>
+            <div className="p-6 border rounded-3xl bg-card shadow-sm">
+              <div className="flex items-center gap-3 mb-4"><Settings /> <h2 className="text-xl font-bold">Settings</h2></div>
+              <p>Configure account security, notifications, and WhatsApp integration.</p>
+            </div>
+          </div>
+        </main>
+
+        <div id="footer" data-section="footer">
+          <FooterBaseReveal
+            logoText="ServiceConnect"
+            columns={[
+              { title: "Marketplace", items: [{ label: "Home", href: "/" }] },
+              { title: "Account", items: [{ label: "Dashboard", href: "/dashboard" }] },
+              { title: "Legal", items: [{ label: "Privacy", href: "#" }] },
+            ]}
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -9,7 +9,6 @@ import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
 import HeroOverlay from '@/components/sections/hero/HeroOverlay';
 import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
-import ProductCardThree from '@/components/sections/product/ProductCardThree';
 import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
 import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
 import { Calendar } from "lucide-react";
@@ -33,25 +32,15 @@ export default function LandingPage() {
       <NavbarStyleCentered
       navItems={[
         {
-          name: "Home",
-          id: "hero",
-        },
+          name: "Home",          id: "hero"},
         {
-          name: "Services",
-          id: "features",
-        },
+          name: "Services",          id: "features"},
         {
-          name: "Vendors",
-          id: "products",
-        },
+          name: "Reviews",          id: "testimonials"},
         {
-          name: "Reviews",
-          id: "testimonials",
-        },
+          name: "Contact",          id: "contact"},
         {
-          name: "Contact",
-          id: "contact",
-        },
+          name: "Dashboard",          id: "/dashboard"},
       ]}
       brandName="ServiceConnect"
     />
@@ -63,37 +52,21 @@ export default function LandingPage() {
       description="Connecting you with verified professional companies for home, health, and more in the US and UK. Seamless booking, real reviews, and guaranteed satisfaction."
       buttons={[
         {
-          text: "Browse Vendors",
-          href: "#products",
-        },
-        {
-          text: "Sign In",
-          href: "/signin",
-        },
+          text: "Sign In",          href: "/signin"},
       ]}
       imageSrc="http://img.b2bpic.net/free-vector/furniture-shopping-app-set_23-2148663606.jpg"
       imageAlt="Service marketplace interface"
       avatars={[
         {
-          src: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-using-laptop-sofa_268835-1519.jpg",
-          alt: "Happy Customer 1",
-        },
+          src: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-using-laptop-sofa_268835-1519.jpg",          alt: "Happy Customer 1"},
         {
-          src: "http://img.b2bpic.net/free-photo/successful-hispanic-woman-smiling-using-laptop-cafe_197531-22840.jpg",
-          alt: "Happy Customer 2",
-        },
+          src: "http://img.b2bpic.net/free-photo/successful-hispanic-woman-smiling-using-laptop-cafe_197531-22840.jpg",          alt: "Happy Customer 2"},
         {
-          src: "http://img.b2bpic.net/free-photo/woman-smiling-while-using-laptop-minimalist-workspace_24972-2913.jpg",
-          alt: "Happy Customer 3",
-        },
+          src: "http://img.b2bpic.net/free-photo/woman-smiling-while-using-laptop-minimalist-workspace_24972-2913.jpg",          alt: "Happy Customer 3"},
         {
-          src: "http://img.b2bpic.net/free-photo/horizontal-shot-pretty-female-freelancer-sits-front-opened-laptop-computer_273609-28713.jpg",
-          alt: "Happy Customer 4",
-        },
+          src: "http://img.b2bpic.net/free-photo/horizontal-shot-pretty-female-freelancer-sits-front-opened-laptop-computer_273609-28713.jpg",          alt: "Happy Customer 4"},
         {
-          src: "http://img.b2bpic.net/free-photo/portrait-busy-cheerful-man_329181-14520.jpg",
-          alt: "Happy Customer 5",
-        },
+          src: "http://img.b2bpic.net/free-photo/portrait-busy-cheerful-man_329181-14520.jpg",          alt: "Happy Customer 5"},
       ]}
       avatarText="Join 10,000+ satisfied customers"
     />
@@ -105,23 +78,11 @@ export default function LandingPage() {
       useInvertedBackground={false}
       features={[
         {
-          title: "Verified Vendors",
-          description: "Only top-tier companies, fully vetted for your security.",
-          imageSrc: "http://img.b2bpic.net/free-photo/happy-coworkers-holding-tablets-showing-thumbs-up-stairs_1262-20218.jpg",
-          imageAlt: "Verified",
-        },
+          title: "Verified Vendors",          description: "Only top-tier companies, fully vetted for your security.",          imageSrc: "http://img.b2bpic.net/free-photo/happy-coworkers-holding-tablets-showing-thumbs-up-stairs_1262-20218.jpg",          imageAlt: "Verified"},
         {
-          title: "Easy Booking",
-          description: "WhatsApp and email reminders included automatically.",
-          imageSrc: "http://img.b2bpic.net/free-photo/calendar-appointment-meeting-date-concept_53876-120967.jpg",
-          imageAlt: "Booking",
-        },
+          title: "Easy Booking",          description: "WhatsApp and email reminders included automatically.",          imageSrc: "http://img.b2bpic.net/free-photo/calendar-appointment-meeting-date-concept_53876-120967.jpg",          imageAlt: "Booking"},
         {
-          title: "Transparent Reviews",
-          description: "Authentic ratings based on real service history.",
-          imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-different-expressions_23-2148860265.jpg",
-          imageAlt: "Reviews",
-        },
+          title: "Transparent Reviews",          description: "Authentic ratings based on real service history.",          imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-different-expressions_23-2148860265.jpg",          imageAlt: "Reviews"},
       ]}
       title="Why Choose ServiceConnect?"
       description="Everything you need for a premium, hassle-free booking experience."
@@ -135,34 +96,16 @@ export default function LandingPage() {
       useInvertedBackground={false}
       metrics={[
         {
-          id: "m1",
-          value: "150+",
-          title: "Dentists",
-          items: [
-            "Teeth Whitening",
-            "General Care",
-            "Orthodontics",
-          ],
+          id: "m1",          value: "150+",          title: "Dentists",          items: [
+            "Teeth Whitening",            "General Care",            "Orthodontics"],
         },
         {
-          id: "m2",
-          value: "300+",
-          title: "Plumbers",
-          items: [
-            "Pipe Repairs",
-            "Drainage",
-            "Installations",
-          ],
+          id: "m2",          value: "300+",          title: "Plumbers",          items: [
+            "Pipe Repairs",            "Drainage",            "Installations"],
         },
         {
-          id: "m3",
-          value: "200+",
-          title: "Roofers",
-          items: [
-            "Repairs",
-            "New Installs",
-            "Inspections",
-          ],
+          id: "m3",          value: "200+",          title: "Roofers",          items: [
+            "Repairs",            "New Installs",            "Inspections"],
         },
       ]}
       title="Popular Categories"
@@ -184,55 +127,6 @@ export default function LandingPage() {
     />
   </div>
 
-  <div id="products" data-section="products">
-      <ProductCardThree
-      animationType="slide-up"
-      textboxLayout="default"
-      gridVariant="uniform-all-items-equal"
-      useInvertedBackground={false}
-      products={[
-        {
-          id: "v1",
-          name: "London Dental Care",
-          price: "TBD",
-          imageSrc: "http://img.b2bpic.net/free-photo/giant-glass-bulding_1203-811.jpg",
-        },
-        {
-          id: "v2",
-          name: "Pro Plumbers UK",
-          price: "$80/hr",
-          imageSrc: "http://img.b2bpic.net/free-photo/carpentry-concept-with-windows_23-2147773331.jpg",
-        },
-        {
-          id: "v3",
-          name: "Green Thumb Landscaping",
-          price: "$120/job",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-strong-man-gloves-cutting-leaves-his-garden-farmer-spending-summer-morning-working-garden-near-countryside-house_176420-19902.jpg",
-        },
-        {
-          id: "v4",
-          name: "Family Dental Group",
-          price: "TBD",
-          imageSrc: "http://img.b2bpic.net/free-photo/lady-receptionist-working-hospital-reception-desk-help-patients-with-medical-appointment-healthcare-employee-waiting-room-lobby-checkup-visit-report-with-medication_482257-47699.jpg",
-        },
-        {
-          id: "v5",
-          name: "Premier Roofing",
-          price: "$250/quote",
-          imageSrc: "http://img.b2bpic.net/free-photo/skateboard-rink-view_23-2148937901.jpg",
-        },
-        {
-          id: "v6",
-          name: "Apex Electrical",
-          price: "$90/hr",
-          imageSrc: "http://img.b2bpic.net/free-photo/male-electrician-uniform-working-switchboard-electricity_169016-67983.jpg",
-        },
-      ]}
-      title="Top-Rated Service Providers"
-      description="Book a top-rated company in your area today."
-    />
-  </div>
-
   <div id="testimonials" data-section="testimonials">
       <TestimonialCardFifteen
       useInvertedBackground={false}
@@ -241,25 +135,15 @@ export default function LandingPage() {
       author="Sarah Jenkins"
       avatars={[
         {
-          src: "http://img.b2bpic.net/free-photo/happy-joyful-redhead-student-with-hair-knot-enjoying-online-communication-indoors_273609-9097.jpg",
-          alt: "Customer",
-        },
+          src: "http://img.b2bpic.net/free-photo/happy-joyful-redhead-student-with-hair-knot-enjoying-online-communication-indoors_273609-9097.jpg",          alt: "Customer"},
         {
-          src: "http://img.b2bpic.net/free-photo/photo-young-smiling-redhead-bearded-man-holding-coffee-cup-cafeteria_171337-10003.jpg",
-          alt: "Customer",
-        },
+          src: "http://img.b2bpic.net/free-photo/photo-young-smiling-redhead-bearded-man-holding-coffee-cup-cafeteria_171337-10003.jpg",          alt: "Customer"},
         {
-          src: "http://img.b2bpic.net/free-photo/handsome-middle-age-man-holding-screwdriver-new-home-mouth-lips-shut-as-zip-with-fingers-secret-silent-taboo-talking_839833-5351.jpg",
-          alt: "Customer",
-        },
+          src: "http://img.b2bpic.net/free-photo/handsome-middle-age-man-holding-screwdriver-new-home-mouth-lips-shut-as-zip-with-fingers-secret-silent-taboo-talking_839833-5351.jpg",          alt: "Customer"},
         {
-          src: "http://img.b2bpic.net/free-photo/customer-experience-creative-collage_23-2149346506.jpg",
-          alt: "Customer",
-        },
+          src: "http://img.b2bpic.net/free-photo/customer-experience-creative-collage_23-2149346506.jpg",          alt: "Customer"},
         {
-          src: "http://img.b2bpic.net/free-photo/closeup-smiling-beautiful-adult-businesswoman_1262-1760.jpg",
-          alt: "Customer",
-        },
+          src: "http://img.b2bpic.net/free-photo/closeup-smiling-beautiful-adult-businesswoman_1262-1760.jpg",          alt: "Customer"},
       ]}
       ratingAnimation="slide-up"
       avatarsAnimation="slide-up"
@@ -272,20 +156,11 @@ export default function LandingPage() {
       useInvertedBackground={false}
       faqs={[
         {
-          id: "f1",
-          title: "How does WhatsApp integration work?",
-          content: "During account setup, you can link your WhatsApp number to receive automated booking confirmations and appointment reminders.",
-        },
+          id: "f1",          title: "How does WhatsApp integration work?",          content: "During account setup, you can link your WhatsApp number to receive automated booking confirmations and appointment reminders."},
         {
-          id: "f2",
-          title: "Are all vendors vetted?",
-          content: "Yes, all service companies on our platform undergo a rigorous verification process to ensure quality and reliability.",
-        },
+          id: "f2",          title: "Are all vendors vetted?",          content: "Yes, all service companies on our platform undergo a rigorous verification process to ensure quality and reliability."},
         {
-          id: "f3",
-          title: "Can I filter vendors by location?",
-          content: "Absolutely, our search interface includes advanced location-based filtering and categorization.",
-        },
+          id: "f3",          title: "Can I filter vendors by location?",          content: "Absolutely, our search interface includes advanced location-based filtering and categorization."},
       ]}
       title="Frequently Asked Questions"
       description="Clear answers for our users."
@@ -297,10 +172,9 @@ export default function LandingPage() {
       <ContactCenter
       useInvertedBackground={false}
       background={{
-        variant: "gradient-bars",
-      }}
+        variant: "gradient-bars"}}
       title="Get Started with ServiceConnect"
-      description="Ready to list your company or book your first service? Join us today."
+      description="Book your first service in seconds—join our community of satisfied users today."
       tag="Contact Us"
     />
   </div>
@@ -310,50 +184,29 @@ export default function LandingPage() {
       logoText="ServiceConnect"
       columns={[
         {
-          title: "Marketplace",
-          items: [
+          title: "Marketplace",          items: [
             {
-              label: "About",
-              href: "#",
-            },
+              label: "About",              href: "#"},
             {
-              label: "Vendors",
-              href: "#products",
-            },
-            {
-              label: "Categories",
-              href: "#categories",
-            },
+              label: "Categories",              href: "#categories"},
           ],
         },
         {
-          title: "Support",
-          items: [
+          title: "Support",          items: [
             {
-              label: "FAQ",
-              href: "#faq",
-            },
+              label: "FAQ",              href: "#faq"},
             {
-              label: "Contact",
-              href: "#contact",
-            },
+              label: "Contact",              href: "#contact"},
             {
-              label: "WhatsApp Help",
-              href: "#",
-            },
+              label: "WhatsApp Help",              href: "#"},
           ],
         },
         {
-          title: "Legal",
-          items: [
+          title: "Legal",          items: [
             {
-              label: "Privacy Policy",
-              href: "#",
-            },
+              label: "Privacy Policy",              href: "#"},
             {
-              label: "Terms of Service",
-              href: "#",
-            },
+              label: "Terms of Service",              href: "#"},
           ],
         },
       ]}
@@ -362,4 +215,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/signin/page.tsx

@@ -0,0 +1,67 @@
+"use client";
+
+import { useState } from "react";
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
+import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
+
+export default function SignInPage() {
+  const [isLogin, setIsLogin] = useState(true);
+
+  return (
+    <ThemeProvider
+        defaultButtonVariant="hover-magnetic"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="pill"
+        contentWidth="small"
+        sizing="large"
+        background="blurBottom"
+        cardStyle="solid"
+        primaryButtonStyle="diagonal-gradient"
+        secondaryButtonStyle="radial-glow"
+        headingFontWeight="extrabold"
+    >
+      <NavbarStyleCentered
+        navItems={[
+          { name: "Home", id: "/" },
+          { name: "Services", id: "/services" },
+          { name: "Reviews", id: "/reviews" },
+          { name: "Contact", id: "/contact" },
+        ]}
+        brandName="ServiceConnect"
+      />
+
+      <div className="pt-32 pb-20">
+        <ContactSplitForm
+          useInvertedBackground={false}
+          title={isLogin ? "Sign In" : "Create Account"}
+          description={isLogin ? "Welcome back to ServiceConnect." : "Join our community to start booking services today."}
+          inputs={[
+            { name: "email", type: "email", placeholder: "Email Address", required: true },
+            { name: "password", type: "password", placeholder: "Password", required: true },
+          ]}
+          buttonText={isLogin ? "Sign In" : "Sign Up"}
+          onSubmit={(data) => console.log(data)}
+        />
+        
+        <div className="text-center mt-6">
+          <button onClick={() => setIsLogin(!isLogin)} className="text-sm text-gray-500 hover:underline">
+            {isLogin ? "Need an account? Sign Up" : "Already have an account? Sign In"}
+          </button>
+          <div className="mt-2">
+            <a href="#" className="text-sm text-gray-500 hover:underline">Forgot Password?</a>
+          </div>
+        </div>
+      </div>
+
+      <FooterBaseReveal
+        logoText="ServiceConnect"
+        columns={[
+          { title: "Marketplace", items: [{ label: "About", href: "#" }, { label: "Categories", href: "#" }] },
+          { title: "Support", items: [{ label: "FAQ", href: "#" }, { label: "Contact", href: "#" }] },
+        ]}
+      />
+    </ThemeProvider>
+  );
+}

src/app/vendor-dashboard/page.tsx

@@ -0,0 +1,79 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
+import FeatureCardSix from '@/components/sections/feature/FeatureCardSix';
+import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
+
+export default function VendorDashboardPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="hover-magnetic"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="medium"
+      background="circleGradient"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="glass"
+      headingFontWeight="normal"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleCentered
+            navItems={[
+              { name: "Home", id: "/" },
+              { name: "Inventory", id: "#inventory" },
+              { name: "Sales", id: "#sales" },
+              { name: "Orders", id: "#orders" },
+            ]}
+            brandName="Vendor Dashboard"
+          />
+        </div>
+        
+        <div id="metrics" data-section="metrics">
+          <MetricCardSeven
+            title="Vendor Performance"
+            description="An overview of your current performance metrics."
+            tag="Analytics"
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={false}
+            metrics={[
+              { id: "1", value: "$12,450", title: "Total Revenue", items: ["Monthly average"] },
+              { id: "2", value: "48", title: "Active Orders", items: ["Pending shipment"] },
+              { id: "3", value: "98%", title: "Satisfaction Rate", items: ["Customer feedback"] }
+            ]}
+          />
+        </div>
+
+        <div id="inventory" data-section="inventory">
+          <FeatureCardSix
+            title="Inventory Management"
+            description="Manage your product stock levels effectively."
+            textboxLayout="default"
+            useInvertedBackground={false}
+            features={[
+              {
+                title: "Product A",                description: "Stock levels are healthy.",                imageSrc: "https://images.unsplash.com/photo-1523275335684-37898b6baf30?q=80&w=600&auto=format&fit=crop"
+              },
+              {
+                title: "Product B",                description: "Stock running low.",                imageSrc: "https://images.unsplash.com/photo-1505740420928-5e560c06d30e?q=80&w=600&auto=format&fit=crop"
+              }
+            ]}
+          />
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterBaseReveal
+            logoText="ServiceConnect"
+            columns={[]}
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}