Add image source and alt to HeroSection

Added image source and alt to HeroSection so that images can be
passed to it. Right now it is hardcoded in HeroSection. This will improve
reusability of HeroSection by theme users.

src/components/sections/landing/HeroSection.astro

@@ -1,7 +1,6 @@
 ---
 // Import the necessary dependencies
 import { Image } from "astro:assets";
-import heroImage from "../../../images/hero-image.avif";
 import PrimaryCTA from "../../ui/buttons/PrimaryCTA.astro";
 import SecondaryCTA from "../../ui/buttons/SecondaryCTA.astro";
 import ReviewComponent from "../../ui/blocks/ReviewComponent.astro";
@@ -18,7 +17,9 @@ const {
   avatars,
   starCount,
   rating,
-  reviews
+  reviews,
+  src,
+  alt
 } = Astro.props;
 
 // Define TypeScript interface for props
@@ -34,6 +35,8 @@ interface Props {
   starCount?: number;
   rating?: string;
   reviews?: string;
+  src?: any;
+  alt?: string;
 }
 ---
 
@@ -75,15 +78,17 @@ interface Props {
   </div>
   <!-- Hero Image Section -->
   <div class="flex w-full">
-    <div class="top-12 overflow-hidden">
-      <Image
-        src={heroImage}
-        alt="Stack of ScrewFast product boxes containing assorted hardware tools"
+      <div class="top-12 overflow-hidden">
+	{src && alt &&
+	<Image
+        src={src}
+        alt={alt}
         class="h-full w-full scale-110 object-cover object-center"
         draggable={"false"}
         loading={"eager"}
         format={"avif"}
-      />
+	 />
+	}
     </div>
   </div>
 </section>

src/pages/index.astro

@@ -10,6 +10,7 @@ import TestimonialsSection from "../components/sections/testimonials/Testimonial
 import PricingSection from "../components/sections/pricing/PricingSection.astro";
 import FAQ from "../components/sections/FAQ.astro";
 import AnnouncementBanner from "../components/ui/banners/AnnouncementBanner.astro";
+import heroImage from "../images/hero-image.avif";
 
 const avatarSrcs: Array<string> = [
   "https://images.unsplash.com/photo-1568602471122-7832951cc4c5?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=facearea&facepad=2&w=300&h=300&q=80",
@@ -39,6 +40,8 @@ const avatarSrcs: Array<string> = [
     rating=`<span class="font-bold">4.8</span> / 5`
     starCount={4}
     reviews=`From Over <span class="font-bold">12.8k</span> Reviews`
+    src={heroImage}
+    alt="Stack of ScrewFast product boxes containing assorted hardware tools"
   />
 
   <ClientsSection