diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx index e1515f8..4bf4498 100644 --- a/src/components/Layout.tsx +++ b/src/components/Layout.tsx @@ -2,7 +2,6 @@ import FooterMinimal from '@/components/sections/footer/FooterMinimal'; import NavbarFloatingLogo from '@/components/ui/NavbarFloatingLogo'; import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary"; import SiteBackgroundSlot from "@/components/ui/SiteBackgroundSlot"; -import { Facebook, Instagram } from "lucide-react"; import { Outlet } from 'react-router-dom'; import { StyleProvider } from "@/components/ui/StyleProvider"; diff --git a/src/components/sections/hero/HeroVideoExpand.tsx b/src/components/sections/hero/HeroVideoExpand.tsx index e0e7f08..4279828 100644 --- a/src/components/sections/hero/HeroVideoExpand.tsx +++ b/src/components/sections/hero/HeroVideoExpand.tsx @@ -1,146 +1,26 @@ -import { useEffect, useRef, useState } from "react"; -import { AnimatePresence, motion, useScroll, useTransform } from "motion/react"; -import ImageOrVideo from "@/components/ui/ImageOrVideo"; -import AutoFillText from "@/components/ui/AutoFillText"; -import { useButtonClick } from "@/hooks/useButtonClick"; +import { useState, useEffect } from 'react'; -const StaggerText = ({ text }: { text: string }) => ( - - {[...text].map((char, index) => ( - - {char} - - ))} - -); - -type HeroVideoExpandProps = { +interface HeroVideoExpandProps { title: string; - primaryButton: { text: string; href: string }; - secondaryButton: { text: string; href: string }; + videoSrc: string; onComplete?: () => void; -} & ({ imageSrc: string; videoSrc?: never } | { videoSrc: string; imageSrc?: never }); +} -const HeroVideoExpand = ({ - title, - videoSrc, - imageSrc, - primaryButton, - secondaryButton, - onComplete, -}: HeroVideoExpandProps) => { - const [showLoader, setShowLoader] = useState(true); - const [expanded, setExpanded] = useState(false); - const handlePrimaryClick = useButtonClick(primaryButton.href); - const handleSecondaryClick = useButtonClick(secondaryButton.href); - - const sectionRef = useRef(null); - const { scrollYProgress } = useScroll({ - target: sectionRef, - offset: ["start start", "end start"], - }); - const videoY = useTransform(scrollYProgress, [0, 1], ["0px", "150px"]); - const videoScale = useTransform(scrollYProgress, [0, 1], [1, 1.1]); +export default function HeroVideoExpand({ title, videoSrc, onComplete }: HeroVideoExpandProps) { + const [isExpanded, setIsExpanded] = useState(false); useEffect(() => { - const expandTimer = setTimeout(() => setExpanded(true), 600); - const hideTimer = setTimeout(() => { - setShowLoader(false); - onComplete?.(); - }, 1500); - return () => { - clearTimeout(expandTimer); - clearTimeout(hideTimer); - }; - }, []); + const timer = setTimeout(() => { + setIsExpanded(true); + if (onComplete) onComplete(); + }, 1000); + return () => clearTimeout(timer); + }, [onComplete]); return ( - <> - - {showLoader && ( - - - - - - )} - - -
- - - - -
- -
-
- - {title} - - -
- - - - - - - - - - -
-
-
-
- +
+

{title}

+
); -}; - -export default HeroVideoExpand; +} \ No newline at end of file