danog/telegram-tt
1
0
Fork 0
mirror of https://github.com/danog/telegram-tt.git synced 2025-01-22 05:11:55 +01:00
Code Issues Packages Projects Releases Wiki Activity

Message List: Fix notch appearance

Browse Source
This commit is contained in:
Alexander Zinchuk 2021-11-27 17:41:30 +01:00
parent ea6c28a5de
commit 37437e2100
1 changed files with 5 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -12,7 +12,8 @@ import resetScroll from '../../../util/resetScroll';
import useOnChange from '../../../hooks/useOnChange';
const FAB_THRESHOLD = 50;
const TOOLS_FREEZE_TIMEOUT = 100;
const NOTCH_THRESHOLD = 1; // Notch has zero height so we at least need a 1px margin to intersect
const TOOLS_FREEZE_TIMEOUT = 250; // Approximate message sending animation duration
export default function useScrollHooks(
type: MessageListType,
@ -60,7 +61,7 @@ export default function useScrollHooks(
const { offsetHeight, scrollHeight, scrollTop } = containerRef.current!;
const scrollBottom = Math.round(scrollHeight - scrollTop - offsetHeight);
const isNearBottom = scrollBottom <= FAB_THRESHOLD;
const isAtBottom = scrollBottom <= 0;
const isAtBottom = scrollBottom <= NOTCH_THRESHOLD;
onFabToggle(isUnread ? !isAtBottom : !isNearBottom);
onNotchToggle(!isAtBottom);
@ -107,7 +108,7 @@ export default function useScrollHooks(
unfreeze: unfreezeForFab,
} = useIntersectionObserver({
rootRef: containerRef,
margin: FAB_THRESHOLD,
margin: FAB_THRESHOLD * 2,
}, toggleScrollTools);
useOnIntersect(fabTriggerRef, observeIntersectionForFab);
@ -118,6 +119,7 @@ export default function useScrollHooks(
unfreeze: unfreezeForNotch,
} = useIntersectionObserver({
rootRef: containerRef,
margin: NOTCH_THRESHOLD,
}, toggleScrollTools);
useOnIntersect(fabTriggerRef, observeIntersectionForNotch);