ztr/TelegramPWA
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Follow-up

Browse Source
This commit is contained in:
Alexander Zinchuk 2023-06-18 16:22:32 +02:00
parent 0e8b0df843
commit 7d1b9a7f18
2 changed files with 14 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
src/components/middle/hooks/useScrollHooks.ts
View File

@ -83,7 +83,7 @@ export default function useScrollHooks(
}); });
const { const {
observe: observeIntersection, observe: observeIntersectionForHistory,
} = useIntersectionObserver({ } = useIntersectionObserver({
rootRef: containerRef, rootRef: containerRef,
margin: MESSAGE_LIST_SENSITIVE_AREA, margin: MESSAGE_LIST_SENSITIVE_AREA,
@ -98,24 +98,23 @@ export default function useScrollHooks(
return; return;
} }
const triggerEntry = entries.find(({ isIntersecting }) => isIntersecting); entries.forEach(({ isIntersecting, target }) => {
if (!triggerEntry) { if (!isIntersecting) return;
return;
}
const { target } = triggerEntry; if (target.className === 'backwards-trigger') {
loadMoreBackwards();
}
if (target.className === 'backwards-trigger') { if (target.className === 'forwards-trigger') {
loadMoreBackwards(); loadMoreForwards();
} else if (target.className === 'forwards-trigger') { }
loadMoreForwards(); });
}
}); });
const withHistoryTriggers = messageIds && messageIds.length > 1; const withHistoryTriggers = messageIds && messageIds.length > 1;
useOnIntersect(backwardsTriggerRef, withHistoryTriggers ? observeIntersection : undefined); useOnIntersect(backwardsTriggerRef, withHistoryTriggers ? observeIntersectionForHistory : undefined);
useOnIntersect(forwardsTriggerRef, withHistoryTriggers ? observeIntersection : undefined); useOnIntersect(forwardsTriggerRef, withHistoryTriggers ? observeIntersectionForHistory : undefined);
const { const {
observe: observeIntersectionForFab, observe: observeIntersectionForFab,

6
src/hooks/useIntersectionObserver.ts
View File

@ -6,7 +6,6 @@ import type { Scheduler } from '../util/schedulers';
import { import {
throttle, debounce, throttleWith, throttle, debounce, throttleWith,
} from '../util/schedulers'; } from '../util/schedulers';
import useEffectOnce from './useEffectOnce';
import useHeavyAnimationCheck from './useHeavyAnimationCheck'; import useHeavyAnimationCheck from './useHeavyAnimationCheck';
import useLastCallback from './useLastCallback'; import useLastCallback from './useLastCallback';
@ -171,10 +170,9 @@ export function useIntersectionObserver({
export function useOnIntersect( export function useOnIntersect(
targetRef: RefObject<HTMLDivElement>, observe?: ObserveFn, callback?: TargetCallback, targetRef: RefObject<HTMLDivElement>, observe?: ObserveFn, callback?: TargetCallback,
) { ) {
useEffectOnce(() => { useEffect(() => {
return observe ? observe(targetRef.current!, callback) : undefined; return observe ? observe(targetRef.current!, callback) : undefined;
// Arguments should never change }, [callback, observe, targetRef]);
});
} }
export function useIsIntersecting( export function useIsIntersecting(