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 FAB and notch when going back in history stack

Browse Source
This commit is contained in:
Alexander Zinchuk 2021-12-13 15:37:21 +01:00
parent 9a66de1a05
commit 5621d4dc9d
4 changed files with 13 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/middle/MessageList.tsx
View File

@ -61,7 +61,6 @@ type OwnProps = {
type: MessageListType; type: MessageListType;
canPost: boolean; canPost: boolean;
isReady: boolean; isReady: boolean;
isActive: boolean;
onFabToggle: (shouldShow: boolean) => void; onFabToggle: (shouldShow: boolean) => void;
onNotchToggle: (shouldShow: boolean) => void; onNotchToggle: (shouldShow: boolean) => void;
hasTools?: boolean; hasTools?: boolean;
@ -117,7 +116,6 @@ const MessageList: FC<OwnProps & StateProps & DispatchProps> = ({
isGroupChat, isGroupChat,
canPost, canPost,
isReady, isReady,
isActive,
isChatWithSelf, isChatWithSelf,
isRepliesChat, isRepliesChat,
isCreator, isCreator,
@ -516,7 +514,7 @@ const MessageList: FC<OwnProps & StateProps & DispatchProps> = ({
memoFirstUnreadIdRef={memoFirstUnreadIdRef} memoFirstUnreadIdRef={memoFirstUnreadIdRef}
threadId={threadId} threadId={threadId}
type={type} type={type}
isActive={isActive} isReady={isReady}
threadTopMessageId={threadTopMessageId} threadTopMessageId={threadTopMessageId}
hasLinkedChat={hasLinkedChat} hasLinkedChat={hasLinkedChat}
isSchedule={messageGroups ? type === 'scheduled' : false} isSchedule={messageGroups ? type === 'scheduled' : false}

6
src/components/middle/MessageListContent.tsx
View File

@ -30,7 +30,7 @@ interface OwnProps {
memoFirstUnreadIdRef: { current: number | undefined }; memoFirstUnreadIdRef: { current: number | undefined };
threadId: number; threadId: number;
type: MessageListType; type: MessageListType;
isActive: boolean; isReady: boolean;
threadTopMessageId: number | undefined; threadTopMessageId: number | undefined;
hasLinkedChat: boolean | undefined; hasLinkedChat: boolean | undefined;
isSchedule: boolean; isSchedule: boolean;
@ -55,7 +55,7 @@ const MessageListContent: FC<OwnProps> = ({
memoFirstUnreadIdRef, memoFirstUnreadIdRef,
threadId, threadId,
type, type,
isActive, isReady,
threadTopMessageId, threadTopMessageId,
hasLinkedChat, hasLinkedChat,
isSchedule, isSchedule,
@ -82,7 +82,7 @@ const MessageListContent: FC<OwnProps> = ({
isUnread, isUnread,
onFabToggle, onFabToggle,
onNotchToggle, onNotchToggle,
isActive, isReady,
); );
const lang = useLang(); const lang = useLang();

3
src/components/middle/MiddleColumn.tsx
View File

@ -396,7 +396,7 @@ const MiddleColumn: FC<StateProps & DispatchProps> = ({
cleanupExceptionKey={cleanupExceptionKey} cleanupExceptionKey={cleanupExceptionKey}
onStop={() => setIsReady(true)} onStop={() => setIsReady(true)}
> >
{(isActive) => ( {() => (
<> <>
<MessageList <MessageList
key={`${renderingChatId}-${renderingThreadId}-${renderingMessageListType}`} key={`${renderingChatId}-${renderingThreadId}-${renderingMessageListType}`}
@ -408,7 +408,6 @@ const MiddleColumn: FC<StateProps & DispatchProps> = ({
onFabToggle={setIsFabShown} onFabToggle={setIsFabShown}
onNotchToggle={setIsNotchShown} onNotchToggle={setIsNotchShown}
isReady={isReady && !willSwitchMessageList} isReady={isReady && !willSwitchMessageList}
isActive={isActive}
withBottomShift={withMessageListBottomShift} withBottomShift={withMessageListBottomShift}
/> />
<div className={footerClassName}> <div className={footerClassName}>

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

@ -23,7 +23,7 @@ export default function useScrollHooks(
isUnread: boolean, isUnread: boolean,
onFabToggle: AnyToVoidFunction, onFabToggle: AnyToVoidFunction,
onNotchToggle: AnyToVoidFunction, onNotchToggle: AnyToVoidFunction,
isActive: boolean, isReady: boolean,
) { ) {
const { loadViewportMessages } = getDispatch(); const { loadViewportMessages } = getDispatch();
@ -44,7 +44,7 @@ export default function useScrollHooks(
const fabTriggerRef = useRef<HTMLDivElement>(null); const fabTriggerRef = useRef<HTMLDivElement>(null);
function toggleScrollTools() { function toggleScrollTools() {
if (!isActive) return; if (!isReady) return;
if (!messageIds || !messageIds.length) { if (!messageIds || !messageIds.length) {
onFabToggle(false); onFabToggle(false);
@ -124,6 +124,12 @@ export default function useScrollHooks(
useOnIntersect(fabTriggerRef, observeIntersectionForNotch); useOnIntersect(fabTriggerRef, observeIntersectionForNotch);
useOnChange(() => {
if (isReady) {
toggleScrollTools();
}
}, [isReady]);
// Workaround for FAB and notch flickering with tall incoming message // Workaround for FAB and notch flickering with tall incoming message
useOnChange(() => { useOnChange(() => {
freezeForFab(); freezeForFab();