Merge pull request #17 from lassiecoder/staging

minor fixes for ref

Author: lassiecoder

src/components/ui/timeline.tsx

@@ -15,7 +15,12 @@ interface TimelineEntry {
 
 export const Timeline = ({ data }: { data: TimelineEntry[] }) => {
   const ref = useRef<HTMLDivElement>(null);
+  // const containerRef = useRef<HTMLDivElement>(null);
+  // const containerRef = useRef<HTMLDivElement>(
+  //   null!
+  // ) as React.RefObject<HTMLElement>;
   const containerRef = useRef<HTMLDivElement>(null);
+
   const [height, setHeight] = useState(0);
   const [isSmallScreen, setIsSmallScreen] = useState(false);
 
@@ -37,8 +42,12 @@ export const Timeline = ({ data }: { data: TimelineEntry[] }) => {
     }
   }, [ref]);
 
+  // const { scrollYProgress } = useScroll({
+  //   target: containerRef,
+  //   offset: ["start 10%", "end 50%"]
+  // });
   const { scrollYProgress } = useScroll({
-    target: containerRef,
+    target: containerRef as React.RefObject<HTMLElement>, // Ensure compatibility
     offset: ["start 10%", "end 50%"]
   });
 

src/components/ui/tracing-beam.tsx

@@ -16,7 +16,8 @@ export const TracingBeam = ({
   children: React.ReactNode;
   className?: string;
 }) => {
-  const ref = useRef<HTMLDivElement>(null);
+  // const ref = useRef<HTMLDivElement>(null);
+  const ref = useRef<HTMLDivElement>(null!) as React.RefObject<HTMLElement>;
   const { scrollYProgress } = useScroll({
     target: ref,
     offset: ["start start", "end start"]