🔥 Remove console logs

hsunpei · Jan 5, 2025 · 72dc996 · 72dc996
1 parent fb63782
commit 72dc996
Show file tree

Hide file tree

Showing 5 changed files with 9 additions and 22 deletions.
diff --git a/apps/docs/pages/react-spring.mdx b/apps/docs/pages/react-spring.mdx
@@ -53,6 +53,14 @@ export const Section = () => {
 
 ### Example
 
+You can simply the example in [track grouped sections](/track_grouped_sections) and use `useActiveSectionSpring()` to get the active section information and the updated `SpringValue` based on the scroll progress:
+
+```tsx
+import { useActiveSectionSpring } from '@react-scrollytelling/react-spring';
+
+const { trackingId, scrolledRatioSpring } = useActiveSectionSpring();
+```
+
 <div className="mx-2 my-12">
   <ScrollytellingProvider>
     <StickyContainerTailwind

diff --git a/apps/docs/pages/track_grouped_sections.mdx b/apps/docs/pages/track_grouped_sections.mdx
@@ -196,7 +196,7 @@ module.exports = {
   // ...
   content: [
     // path to the library
-    '../../node_modules/@react-scrollytelling/layout/**/*.{js,jsx,ts,tsx}',
+    './node_modules/@react-scrollytelling/layout/**/*.{js,jsx,ts,tsx}',
   ],
 };
 ```
diff --git a/packages/grouped/src/context/grouped/ScrollytellingProvider.tsx b/packages/grouped/src/context/grouped/ScrollytellingProvider.tsx
@@ -67,12 +67,6 @@ export const ScrollytellingProvider = ({ children }: ScrollytellingProviderProps
 
     const activeSection = trackedSectionsRef.current.getSection(activeSectionId || '');
 
-    console.log('handleScroll', {
-      activeSectionId,
-      activeSection,
-      trackedSection: trackedSectionsRef.current,
-    });
-
     // notify the active section about its scroll progress
     if (activeSection) {
       const { sectionTop, sectionBottom } = activeSection;
@@ -109,8 +103,6 @@ export const ScrollytellingProvider = ({ children }: ScrollytellingProviderProps
 
   const onObserve = useCallback(
     ({ isIntersecting }: IntersectionObserverEntry) => {
-      console.log('*** ScrollytellingProvider > onObserve', isIntersecting);
-
       // track scrolling only when the section is visible in viewport
       if (isIntersecting) {
         window.addEventListener('scroll', handleScrollThrottled);

diff --git a/packages/grouped/src/hooks/section/useTrackedSectionScroll.ts b/packages/grouped/src/hooks/section/useTrackedSectionScroll.ts
@@ -46,8 +46,6 @@ export function useTrackedSectionScroll(
 
   const onObserve = useCallback(
     ({ isIntersecting }: IntersectionObserverEntry) => {
-      console.log('onObserve', isIntersecting, sectionID);
-
       if (isIntersecting) {
         const { scrollTop } = getScrollPosition();
 
@@ -56,15 +54,7 @@ export function useTrackedSectionScroll(
           sectionBottom: (sectionRef.current?.getBoundingClientRect().bottom || 0) + scrollTop,
           onActiveScroll: onScroll,
         });
-
-        console.log('useTrackedSectionScroll > onObserve > added', sectionID, {
-          sectionTop: sectionRef.current?.getBoundingClientRect().top || 0,
-          sectionBottom: sectionRef.current?.getBoundingClientRect().bottom || 0,
-          onActiveScroll: onScroll,
-        });
       } else {
-        console.log('useTrackedSectionScroll > onObserve > removed', sectionID);
-
         // notify the scroll progress that isIntersecting = false
         const { scrolledRatio = 0, scrollBottom = 0, distance = 0 } = scrollInfoRef.current || {};
 

diff --git a/packages/video/src/components/Video.tsx b/packages/video/src/components/Video.tsx
@@ -78,7 +78,6 @@ export const VideoWithImperativeHandle = React.memo(
         if (!isNaN(duration)) {
           requestAnimationFrame(() => {
             videoElement.currentTime = Math.round(ratio * duration * 100) / 100;
-            console.log('setRatio', ratio, Math.round(ratio * duration * 100) / 100);
           });
         }
       }, []);
@@ -95,12 +94,10 @@ export const VideoWithImperativeHandle = React.memo(
       );
 
       const handleWaiting = useCallback(() => {
-        console.log('waiting');
         setIsLoading(true);
       }, []);
 
       const handleCanPlay = useCallback(() => {
-        console.log('can play');
         setIsLoading(false);
       }, []);