diff --git a/src/components/middle/ActionMessage.tsx b/src/components/middle/ActionMessage.tsx index b462be1a..2a142188 100644 --- a/src/components/middle/ActionMessage.tsx +++ b/src/components/middle/ActionMessage.tsx @@ -31,6 +31,7 @@ type OwnProps = { observeIntersection?: ObserveFn; isEmbedded?: boolean; appearanceOrder?: number; + isLastInList?: boolean; }; type StateProps = { @@ -50,6 +51,7 @@ const ActionMessage: FC = ({ observeIntersection, isEmbedded, appearanceOrder = 0, + isLastInList, sender, targetUser, targetMessage, @@ -98,16 +100,19 @@ const ActionMessage: FC = ({ return {renderText(content as string)}; } + const className = buildClassName( + 'ActionMessage message-list-item', + isFocused && !noFocusHighlight && 'focused', + isContextMenuShown && 'has-menu-open', + isLastInList && 'last-in-list', + transitionClassNames, + ); + return (
{ if (senderGroup.length === 1 && !isAlbum(senderGroup[0]) && isActionMessage(senderGroup[0])) { const message = senderGroup[0]; + const isLastInList = ( + senderGroupIndex === senderGroupsArray.length - 1 + && dateGroupIndex === dateGroupsArray.length - 1 + ); return compact([ message.id === memoFirstUnreadIdRef.current && unreadDivider, @@ -617,6 +621,7 @@ function renderMessages( message={message} observeIntersection={observeIntersectionForReading} appearanceOrder={messageCountToAnimate - ++appearanceIndex} + isLastInList={isLastInList} />, ]); } diff --git a/src/components/middle/MessageScroll.tsx b/src/components/middle/MessageScroll.tsx index ebe34d5d..666e99d1 100644 --- a/src/components/middle/MessageScroll.tsx +++ b/src/components/middle/MessageScroll.tsx @@ -4,7 +4,6 @@ import React, { } from '../../lib/teact/teact'; import { MESSAGE_LIST_SENSITIVE_AREA } from '../../config'; -import { IS_SAFARI } from '../../util/environment'; import resetScroll from '../../util/resetScroll'; import { useIntersectionObserver, useOnIntersect } from '../../hooks/useIntersectionObserver'; import useOnChange from '../../hooks/useOnChange'; @@ -69,7 +68,7 @@ const MessageScroll: FC = ({ const { offsetHeight, scrollHeight, scrollTop } = containerRef.current!; const scrollBottom = scrollHeight - scrollTop - offsetHeight; const isNearBottom = scrollBottom <= FAB_THRESHOLD; - const isAtBottom = scrollBottom <= 0 || (IS_SAFARI && scrollBottom <= 1); + const isAtBottom = scrollBottom <= 0; onFabToggle(firstUnreadId ? !isAtBottom : !isNearBottom); onNotchToggle(!isAtBottom); diff --git a/src/components/middle/MiddleColumn.tsx b/src/components/middle/MiddleColumn.tsx index 9a68e57e..db7fd541 100644 --- a/src/components/middle/MiddleColumn.tsx +++ b/src/components/middle/MiddleColumn.tsx @@ -203,7 +203,7 @@ const MiddleColumn: FC = ({ const footerClassName = buildClassName( 'middle-column-footer', !renderingCanPost && 'no-composer', - renderingCanPost && isNotchShown && 'with-notch', + renderingCanPost && isNotchShown && !isSelectModeActive && 'with-notch', ); return ( diff --git a/src/components/middle/composer/Composer.scss b/src/components/middle/composer/Composer.scss index 35ab81a2..3dcec5c9 100644 --- a/src/components/middle/composer/Composer.scss +++ b/src/components/middle/composer/Composer.scss @@ -2,11 +2,9 @@ align-items: flex-end; .select-mode-active + .middle-column-footer & { - @media (min-width: 601px) { - position: absolute; - padding-right: 2rem; - bottom: 0; - } + position: absolute; + padding-right: 2rem; + bottom: 0; @media (max-width: 600px) { padding-right: 1rem; diff --git a/src/components/middle/message/Message.scss b/src/components/middle/message/Message.scss index 6f0bacf6..b68df7e9 100644 --- a/src/components/middle/message/Message.scss +++ b/src/components/middle/message/Message.scss @@ -46,7 +46,8 @@ } &.last-in-list { - margin-bottom: 0rem; + // Forcing extra space which is taken by the appendix and causes incorrect container height calculation + margin-bottom: 0.425rem; } &.is-in-selection-mode {