Merge pull request #324 from apsinghdev/chore/rem-img

[feat] integrate the testimonial page

Author: apsinghdev

apps/web/src/app/(main)/(landing)/pitch/page.tsx

@@ -545,15 +545,23 @@ const Pitch = () => {
                   <p>
                     check out{" "}
                     <Link
-                      href="/pricing#testimonials"
-                      target="_blank"
-                      rel="noopener noreferrer"
+                      href="/testimonials"
                       className="text-link hover:text-link-hover underline"
                     >
-                      reviews
+                      testimonials
                     </Link>{" "}
                     from investors who&apos;ve invested.
                   </p>
+                  <p className="text-text-tertiary italic text-base">
+                    (you can also see more detailed reviews on the{" "}
+                    <Link
+                      href="/pricing#testimonials"
+                      className="text-link hover:text-link-hover underline"
+                    >
+                      pricing page
+                    </Link>
+                    )
+                  </p>
                 </div>
               </motion.div>
             </div>
@@ -718,12 +726,10 @@ const Pitch = () => {
                       </Link>{" "}
                       i have done so far. and check the{" "}
                       <Link
-                        href="/pricing#testimonials"
-                        target="_blank"
-                        rel="noopener noreferrer"
+                        href="/testimonials"
                         className="text-link hover:text-link-hover underline"
                       >
-                        reviews
+                        testimonials
                       </Link>{" "}
                       of investors who&apos;ve invested.
                     </p>

apps/web/src/app/(main)/(landing)/pricing/page.tsx

@@ -369,6 +369,16 @@ const Pricing = () => {
             </div>
           </div>
           <TestimonialsSection />
+          <div className="border-b border-border text-center py-8 px-4">
+            <p className="text-lg mb-4 text-text-secondary">
+              <Link
+                href="/testimonials"
+                className="text-brand-purple-light hover:text-brand-purple transition-colors underline"
+              >
+                See what our Pro customers said about us.
+              </Link>
+            </p>
+          </div>
           <div className=" border-b border-[#252525] text-center py-4 font-bold px-4">
             For any doubts or queries, feel free to ping us at{" "}
             <Link
@@ -534,7 +544,7 @@ const SecondaryPricingCard = ({
                 callbackUrl={callbackUrl}
                 buttonLocation="pricing_page"
               />
-              <div className="flex justify-center mt-3">
+              <div className="flex flex-col items-center gap-2 mt-3">
                 <Link
                   href="/pitch"
                   className="text-sm text-text-tertiary hover:text-brand-purple-light transition-colors lowercase"

apps/web/src/app/(main)/testimonials/page.tsx

@@ -2,7 +2,8 @@
 import React, { useMemo } from "react";
 import Navbar from "@/components/landing-sections/navbar";
 import Footer from "@/components/landing-sections/footer";
-import { Twitter, Linkedin, Instagram, Youtube } from "lucide-react";
+import { Twitter, Linkedin, Instagram, Youtube, Home } from "lucide-react";
+import Link from "next/link";
 
 import { trpc } from "@/lib/trpc";
 import { imageTestimonials } from "@/data/testimonials";
@@ -156,6 +157,16 @@ const TestimonialsPage = () => {
       <Navbar />
 
       <div className="min-h-screen w-full max-w-[2000px] mx-auto border-x border-border overflow-hidden pt-24 pb-20 px-4 md:px-6 lg:px-10">
+        <div className="mb-8 max-w-7xl mx-auto">
+          <Link
+            href="/"
+            className="inline-flex items-center gap-2 text-text-tertiary hover:text-brand-purple transition-colors group"
+          >
+            <Home className="w-5 h-5 group-hover:scale-110 transition-transform" />
+            <span className="text-sm font-medium">Home</span>
+          </Link>
+        </div>
+
         {/* Header */}
         <div className="max-w-3xl mx-auto text-center mb-12 space-y-6">
           <h1 className="text-4xl md:text-5xl lg:text-6xl font-semibold tracking-tighter text-text-primary">

apps/web/src/components/landing-sections/CTA.tsx

@@ -8,12 +8,16 @@ import Link from "next/link";
 import { useAnalytics } from "@/hooks/useAnalytics";
 
 const CTA = () => {
-  const { trackButtonClick } = useAnalytics();
+  const { trackButtonClick, trackLinkClick } = useAnalytics();
 
   const handleGetStartedClick = () => {
     trackButtonClick("Get Started", "cta_section");
   };
 
+  const handleTestimonialsClick = () => {
+    trackLinkClick("/testimonials", "See what our investors say", "cta_section", false);
+  };
+
   return (
     <div className="w-[94%] h-[420px] mt-2 mx-auto relative bg-transparent lg:bg-gradient-to-r from-white via-[#101010] to-white z-10 flex flex-col gap-6 items-center justify-center lg:p-[60px] rounded-3xl overflow-hidden">
       <Image
@@ -41,6 +45,13 @@ const CTA = () => {
           Get Started
         </PrimaryButtom>
       </Link>
+      <Link
+        href="/testimonials"
+        className="text-text-tertiary hover:text-brand-purple-light transition-colors text-sm lg:text-base underline z-30"
+        onClick={handleTestimonialsClick}
+      >
+        See what our investors say →
+      </Link>
     </div>
   );
 };

apps/web/src/components/landing-sections/footer.tsx

@@ -73,6 +73,12 @@ const Footer = () => {
                 >
                   Pricing
                 </Link>
+                <Link
+                  href="/testimonials"
+                  className="text-[#b1b1b1] hover:text-white transition-colors text-xs"
+                >
+                  Testimonials
+                </Link>
                 <Link
                   href="/pitch"
                   className="text-[#b1b1b1] hover:text-white transition-colors text-xs"

apps/web/src/components/landing-sections/navbar.tsx

@@ -50,12 +50,11 @@ const Navbar = () => {
 
   const links = [
     { name: "Pricing", href: "/pricing" },
+    { name: "Testimonials", href: "/testimonials" },
     { name: "Features", href: "/#features" },
     { name: "Demo", href: "/#demo" },
     { name: "How it works", href: "/#HIW" },
     { name: "Stats", href: "/#Stats" },
-    { name: "Contact", href: "/#Contact" },
-    { name: "FAQ", href: "/#faq" },
   ];
 
   return (