Message List: Fix FAB and notch when going back in history stack

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

View File

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

View File

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

View File

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

View File

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