From ba4faf30578863d803e38d78428faa7ec886390b Mon Sep 17 00:00:00 2001
From: kudinDmitriyUp <kudin.dmitriy.up@gmail.com>
Date: Wed, 25 Mar 2026 13:20:53 +0000
Subject: [PATCH] Bob AI: Replace the current hero section with a different
 hero compo

---
 src/app/page.tsx                              |  77 +++---------
 .../sections/hero/HeroSplitImage.tsx          | 115 ++++++++++++++++++
 2 files changed, 131 insertions(+), 61 deletions(-)
 create mode 100644 src/components/sections/hero/HeroSplitImage.tsx

diff --git a/src/app/page.tsx b/src/app/page.tsx
index eff983e..a2620e9 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -6,7 +6,7 @@ import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
 import FaqSplitText from '@/components/sections/faq/FaqSplitText';
 import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
 import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
-import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
+import HeroSplitImage from '@/components/sections/hero/HeroSplitImage';
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
 import ProductCardOne from '@/components/sections/product/ProductCardOne';
 import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
@@ -61,66 +61,21 @@ export default function LandingPage() {
   </div>
 
   <div id="hero" data-section="hero">
-      <HeroBillboardTestimonial
-      useInvertedBackground={false}
-      background={{
-        variant: "radial-gradient",
-      }}
-      title="Unleash Precision. Own Reliability."
-      description="Discover the unparalleled performance and legendary dependability of Glock firearms. Your ultimate destination for excellence in shooting."
-      testimonials={[
-        {
-          name: "John Doe",
-          handle: "@johndoe",
-          testimonial: "The Glock 19 I purchased here is incredible. Flawless performance and excellent service. Highly recommend!",
-          rating: 5,
-          imageSrc: "https://pixabay.com/get/ga246336a6e5ec58d4e8c3c027a7f25971e45be4018ff981a1c3f61a2339f713f93452d7ae21ae16c616773e7119a947ac30091e42dcce851652347d4a962c0a3_1280.jpg?_wi=1",
-        },
-        {
-          name: "Jane Smith",
-          handle: "@janesmith",
-          testimonial: "Fantastic selection and knowledgeable staff. My new Glock 17 is exactly what I needed for competition.",
-          rating: 5,
-          imageSrc: "https://pixabay.com/get/g89b4d25c100bd1771f9b2df000dbf745306dfe1b9fd2f4beba2cacbcde3e165314c60628236b18ceb4869992eb85c8d88a8d1a30a807acddb79e0331c0f8672d_1280.jpg?_wi=1",
-        },
-        {
-          name: "Mike Johnson",
-          handle: "@mikej",
-          testimonial: "Glock Pro Shop made my first firearm purchase smooth and informative. Love my Glock 26!",
-          rating: 5,
-          imageSrc: "https://pixabay.com/get/g77478b1b75e0c9fc72406a30cf67d4c0fac63ace24de1e54f2a94a7f0e0c82b6fcccb2e89a1cf59573848b6aec85b079b54a99dfdbedbe827e914cb225183070_1280.jpg?_wi=1",
-        },
-        {
-          name: "Sarah Lee",
-          handle: "@sarah_l",
-          testimonial: "Exceptional quality and genuine products. The Glock accessories are top-notch. I'm a loyal customer now.",
-          rating: 5,
-          imageSrc: "https://pixabay.com/get/g4871cf89965a7545dced31542d665cf16cd497aefbb0d2e4523ada5b1634e0c80e9a83116bc499a5fe84aa9ada545662876b8ccfc7d5417762869fc97841a80c_1280.jpg?_wi=1",
-        },
-      ]}
-      avatars={[
-        {
-          src: "https://pixabay.com/get/g8c1f547fdca58996583f178e8673afe2fea40b9a10c99d0231ca50bdf172491a4978726a875aff2f9cd3999989a3770d5f1b02bed3e7263bd976d282da464d53_1280.jpg",
-          alt: "Customer John Doe",
-        },
-        {
-          src: "https://pixabay.com/get/g91f4327ed385ec27991168a314d0b4973d537aaf4f396f6b9bab45c57c3bd9f6c859d9823cb6bc25bda2c704dd8c626de39416e8b245437ca0bf18827d1b1381_1280.jpg",
-          alt: "Customer Jane Smith",
-        },
-        {
-          src: "https://pixabay.com/get/g010c5e6c852d3d425d524dcaef4858d6475b50554deff421311f9b41315b63e730857758f427f2c3c46369189d22d03fd8c5cdb11a65185cd0199a2b2fa162e2_1280.jpg",
-          alt: "Customer Mike Johnson",
-        },
-        {
-          src: "https://pixabay.com/get/gded5d43305effa9df5e7b77dee969d2cfcd604017cf8f2be99efaef7f6a816fe1d550bfbaf58b1bf7af6608b06f187f4a97b35387789eb8bc72ea181650c7778_1280.jpg",
-          alt: "Customer Sarah Lee",
-        },
-      ]}
-      avatarText="Join thousands of satisfied owners"
-      imageSrc="https://pixabay.com/get/g3386982b1cbf2d5b26133baeb04cd8c7a6bd2dbbcf1cf358f3380dcaf29ccb92573d0aac6e0ce7cdbf9120f09f0b80f2fe655ae3360e11b5a0747d7b52b0cc96_1280.jpg"
-      imageAlt="Glock pistol on a tactical background"
-      mediaAnimation="opacity"
-    />
+      <HeroSplitImage
+        useInvertedBackground={false}
+        background={{
+          variant: "radial-gradient",
+        }}
+        title="Unleash Precision. Own Reliability."
+        description="Discover the unparalleled performance and legendary dependability of Glock firearms. Your ultimate destination for excellence in shooting."
+        buttons={[
+          { text: "Explore Models", href: "#products" },
+          { text: "Contact Us", href: "#contact" },
+        ]}
+        imageSrc="https://pixabay.com/get/g3386982b1cbf2d5b26133baeb04cd8c7a6bd2dbbcf1cf358f3380dcaf29ccb92573d0aac6e0ce7cdbf9120f09f0b80f2fe655ae3360e11b5a0747d7b52b0cc96_1280.jpg"
+        imageAlt="Glock pistol on a tactical background"
+        imageOnLeft={false}
+      />
   </div>
 
   <div id="features" data-section="features">
diff --git a/src/components/sections/hero/HeroSplitImage.tsx b/src/components/sections/hero/HeroSplitImage.tsx
new file mode 100644
index 0000000..57b6c2d
--- /dev/null
+++ b/src/components/sections/hero/HeroSplitImage.tsx
@@ -0,0 +1,115 @@
+"use client";
+
+import TextBox from "@/components/Textbox";
+import MediaContent from "@/components/shared/MediaContent";
+import HeroBackgrounds, { type HeroBackgroundVariantProps } from "@/components/background/HeroBackgrounds";
+import { cls } from "@/lib/utils";
+import type { ButtonConfig, ButtonAnimationType } from "@/types/button";
+import type { LucideIcon } from "lucide-react";
+
+// A simplified background prop type for this hero variant
+type HeroSplitImageBackgroundProps = Extract<
+  HeroBackgroundVariantProps,
+  | { variant: "plain" }
+  | { variant: "animated-grid" }
+  | { variant: "radial-gradient" }
+  | { variant: "sparkles-gradient" }
+>;
+
+interface HeroSplitImageProps {
+  title: string;
+  description: string;
+  background: HeroSplitImageBackgroundProps;
+  useInvertedBackground?: boolean;
+  tag?: string;
+  tagIcon?: LucideIcon;
+  buttons?: ButtonConfig[];
+  buttonAnimation?: ButtonAnimationType;
+  imageSrc?: string;
+  videoSrc?: string;
+  imageAlt?: string;
+  videoAriaLabel?: string;
+  imageOnLeft?: boolean;
+  ariaLabel?: string;
+  className?: string;
+  containerClassName?: string;
+  textBoxClassName?: string;
+  titleClassName?: string;
+  descriptionClassName?: string;
+  tagClassName?: string;
+  buttonContainerClassName?: string;
+  buttonClassName?: string;
+  buttonTextClassName?: string;
+  mediaWrapperClassName?: string;
+  imageClassName?: string;
+}
+
+const HeroSplitImage = ({
+  title,
+  description,
+  background = { variant: "plain" },
+  useInvertedBackground = false,
+  tag,
+  tagIcon,
+  buttons = [],
+  buttonAnimation = "slide-up",
+  imageSrc,
+  videoSrc,
+  imageAlt = "",
+  videoAriaLabel = "Hero video",
+  imageOnLeft = false,
+  ariaLabel = "Hero section",
+  className = "",
+  containerClassName = "",
+  textBoxClassName = "",
+  titleClassName = "",
+  descriptionClassName = "",
+  tagClassName = "",
+  buttonContainerClassName = "",
+  buttonClassName = "",
+  buttonTextClassName = "",
+  mediaWrapperClassName = "",
+  imageClassName = "",
+}: HeroSplitImageProps) => {
+  return (
+    <section
+      aria-label={ariaLabel}
+      className={cls("relative w-full py-hero-page-padding overflow-hidden", className)}
+    >
+      <HeroBackgrounds {...background} />
+      <div className={cls("w-content-width mx-auto grid md:grid-cols-2 gap-6 md:gap-8 items-center relative z-10", containerClassName)}>
+        <div className={cls("flex flex-col gap-4", imageOnLeft ? "md:order-2" : "")}>
+          <TextBox
+            title={title}
+            description={description}
+            tag={tag}
+            tagIcon={tagIcon}
+            buttons={buttons}
+            buttonAnimation={buttonAnimation}
+            className={cls("flex flex-col gap-3 md:gap-3", textBoxClassName)}
+            titleClassName={cls("text-6xl font-medium text-balance", titleClassName)}
+            descriptionClassName={cls("text-base md:text-lg leading-tight", descriptionClassName)}
+            tagClassName={cls("px-3 py-1 text-sm rounded-theme card text-foreground inline-flex items-center gap-2 mb-1 w-fit", tagClassName)}
+            buttonContainerClassName={cls("flex flex-wrap gap-4 mt-2", buttonContainerClassName)}
+            buttonClassName={buttonClassName}
+            buttonTextClassName={buttonTextClassName}
+            center={false}
+          />
+        </div>
+        <div className={cls("relative w-full overflow-hidden rounded-theme-capped card p-2", mediaWrapperClassName)}>
+          <MediaContent
+            imageSrc={imageSrc}
+            videoSrc={videoSrc}
+            imageAlt={imageAlt}
+            videoAriaLabel={videoAriaLabel}
+            imageClassName={cls("z-1 aspect-square md:aspect-[4/3] object-cover w-full h-full rounded-theme", imageClassName)}
+          />
+        </div>
+      </div>
+    </section>
+  );
+};
+
+HeroSplitImage.displayName = "HeroSplitImage";
+
+export default HeroSplitImage;
\ No newline at end of file
-- 
2.49.1