mirrors/signal-desktop
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages 2 Wiki Activity Actions 1

Revert "When you send a message, scroll it into view"

Browse source 
This reverts commit a3525c16ef.
This commit is contained in:
Fedor Indutny 2021-11-23 14:09:07 +01:00 • committed by GitHub
parent 3601279287
commit a52530262f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
14 changed files with 438 additions and 387 deletions
Download patch file Download diff file Expand all files Collapse all files

1
ts/components/CompositionArea.stories.tsx
View file

@ -68,6 +68,7 @@ const useProps = (overrideProps: Partial<Props> = {}): Props => ({
clearQuotedMessage: action('clearQuotedMessage'),
getPreferredBadge: () => undefined,
getQuotedMessage: action('getQuotedMessage'),
scrollToBottom: action('scrollToBottom'),
sortedGroupMembers: [],
// EmojiButton
onPickEmoji: action('onPickEmoji'),

6
ts/components/CompositionArea.tsx
View file

@ -123,6 +123,7 @@ export type OwnProps = Readonly<{
setQuotedMessage(message: undefined): unknown;
shouldSendHighQualityAttachments: boolean;
startRecording: () => unknown;
scrollToBottom: (converstionId: string) => unknown;
theme: ThemeType;
}>;
@ -202,6 +203,7 @@ export const CompositionArea = ({
clearQuotedMessage,
getPreferredBadge,
getQuotedMessage,
scrollToBottom,
sortedGroupMembers,
// EmojiButton
onPickEmoji,
@ -628,13 +630,14 @@ export const CompositionArea = ({
{!large ? leftHandSideButtonsFragment : null}
<div className="CompositionArea__input">
<CompositionInput
i18n={i18n}
conversationId={conversationId}
clearQuotedMessage={clearQuotedMessage}
disabled={disabled}
draftBodyRanges={draftBodyRanges}
draftText={draftText}
getPreferredBadge={getPreferredBadge}
getQuotedMessage={getQuotedMessage}
i18n={i18n}
inputApi={inputApiRef}
large={large}
onDirtyChange={setDirty}
@ -642,6 +645,7 @@ export const CompositionArea = ({
onPickEmoji={onPickEmoji}
onSubmit={handleSubmit}
onTextTooLong={onTextTooLong}
scrollToBottom={scrollToBottom}
skinTone={skinTone}
sortedGroupMembers={sortedGroupMembers}
theme={theme}

2
ts/components/CompositionInput.stories.tsx
View file

@ -21,6 +21,7 @@ const story = storiesOf('Components/CompositionInput', module);
const useProps = (overrideProps: Partial<Props> = {}): Props => ({
i18n,
conversationId: 'conversation-id',
disabled: boolean('disabled', overrideProps.disabled || false),
onSubmit: action('onSubmit'),
onEditorStateChange: action('onEditorStateChange'),
@ -32,6 +33,7 @@ const useProps = (overrideProps: Partial<Props> = {}): Props => ({
getQuotedMessage: action('getQuotedMessage'),
onPickEmoji: action('onPickEmoji'),
large: boolean('large', overrideProps.large || false),
scrollToBottom: action('scrollToBottom'),
sortedGroupMembers: overrideProps.sortedGroupMembers || [],
skinTone: select(
'skinTone',

5
ts/components/CompositionInput.tsx
View file

@ -62,6 +62,7 @@ export type InputApi = {
export type Props = {
readonly i18n: LocalizerType;
readonly conversationId: string;
readonly disabled?: boolean;
readonly getPreferredBadge: PreferredBadgeSelectorType;
readonly large?: boolean;
@ -87,6 +88,7 @@ export type Props = {
): unknown;
getQuotedMessage(): unknown;
clearQuotedMessage(): unknown;
scrollToBottom: (converstionId: string) => unknown;
};
const MAX_LENGTH = 64 * 1024;
@ -95,6 +97,7 @@ const BASE_CLASS_NAME = 'module-composition-input';
export function CompositionInput(props: Props): React.ReactElement {
const {
i18n,
conversationId,
disabled,
large,
inputApi,
@ -107,6 +110,7 @@ export function CompositionInput(props: Props): React.ReactElement {
getPreferredBadge,
getQuotedMessage,
clearQuotedMessage,
scrollToBottom,
sortedGroupMembers,
theme,
} = props;
@ -237,6 +241,7 @@ export function CompositionInput(props: Props): React.ReactElement {
`CompositionInput: Submitting message ${timestamp} with ${mentions.length} mentions`
);
onSubmit(text, mentions, timestamp);
scrollToBottom(conversationId);
};
if (inputApi) {

1
ts/components/ForwardMessageModal.stories.tsx
View file

@ -44,6 +44,7 @@ const candidateConversations = Array.from(Array(100), () =>
const useProps = (overrideProps: Partial<PropsType> = {}): PropsType => ({
attachments: overrideProps.attachments,
conversationId: 'conversation-id',
candidateConversations,
doForwardMessage: action('doForwardMessage'),
getPreferredBadge: () => undefined,

16
ts/components/ForwardMessageModal.tsx
View file

@ -41,6 +41,7 @@ import { useAnimated } from '../hooks/useAnimated';
export type DataPropsType = {
attachments?: Array<AttachmentDraftType>;
candidateConversations: ReadonlyArray<ConversationType>;
conversationId: string;
doForwardMessage: (
selectedContacts: Array<string>,
messageBody?: string,
@ -76,6 +77,7 @@ const MAX_FORWARD = 5;
export const ForwardMessageModal: FunctionComponent<PropsType> = ({
attachments,
candidateConversations,
conversationId,
doForwardMessage,
getPreferredBadge,
i18n,
@ -186,10 +188,10 @@ export const ForwardMessageModal: FunctionComponent<PropsType> = ({
}, [candidateConversations]);
const toggleSelectedConversation = useCallback(
(conversationId: string) => {
(selectedConversationId: string) => {
let removeContact = false;
const nextSelectedContacts = selectedContacts.filter(contact => {
if (contact.id === conversationId) {
if (contact.id === selectedConversationId) {
removeContact = true;
return false;
}
@ -199,7 +201,7 @@ export const ForwardMessageModal: FunctionComponent<PropsType> = ({
setSelectedContacts(nextSelectedContacts);
return;
}
const selectedContact = contactLookup.get(conversationId);
const selectedContact = contactLookup.get(selectedConversationId);
if (selectedContact) {
if (selectedContact.announcementsOnly && !selectedContact.areWeAdmin) {
setCannotMessage(true);
@ -335,6 +337,7 @@ export const ForwardMessageModal: FunctionComponent<PropsType> = ({
) : null}
<div className="module-ForwardMessageModal__text-edit-area">
<CompositionInput
conversationId={conversationId}
clearQuotedMessage={shouldNeverBeCalled}
draftText={messageBodyText}
getPreferredBadge={getPreferredBadge}
@ -343,6 +346,7 @@ export const ForwardMessageModal: FunctionComponent<PropsType> = ({
inputApi={inputApiRef}
large
moduleClassName="module-ForwardMessageModal__input"
scrollToBottom={noop}
onEditorStateChange={(
messageText,
bodyRanges,
@ -399,7 +403,7 @@ export const ForwardMessageModal: FunctionComponent<PropsType> = ({
i18n={i18n}
onClickArchiveButton={shouldNeverBeCalled}
onClickContactCheckbox={(
conversationId: string,
selectedConversationId: string,
disabledReason:
| undefined
| ContactCheckboxDisabledReason
@ -408,7 +412,9 @@ export const ForwardMessageModal: FunctionComponent<PropsType> = ({
disabledReason !==
ContactCheckboxDisabledReason.MaximumContactsSelected
) {
toggleSelectedConversation(conversationId);
toggleSelectedConversation(
selectedConversationId
);
}
}}
onSelectConversation={shouldNeverBeCalled}

4
ts/components/conversation/Timeline.stories.tsx
View file

@ -473,7 +473,10 @@ const useProps = (overrideProps: Partial<PropsType> = {}): PropsType => ({
overrideProps.isLoadingMessages === false
),
items: overrideProps.items || Object.keys(items),
loadCountdownStart: undefined,
messageHeightChangeIndex: undefined,
resetCounter: 0,
scrollToBottomCounter: 0,
scrollToIndex: overrideProps.scrollToIndex,
scrollToIndexCounter: 0,
totalUnread: number('totalUnread', overrideProps.totalUnread || 0),
@ -485,6 +488,7 @@ const useProps = (overrideProps: Partial<PropsType> = {}): PropsType => ({
warning: overrideProps.warning,
id: uuid(),
isNearBottom: false,
renderItem,
renderLastSeenIndicator,
renderHeroRow,

20
ts/components/conversation/Timeline.tsx
View file

@ -78,13 +78,14 @@ export type PropsDataType = {
haveNewest: boolean;
haveOldest: boolean;
isLoadingMessages: boolean;
isNearBottom?: boolean;
isNearBottom: boolean;
items: ReadonlyArray<string>;
loadCountdownStart?: number;
messageHeightChangeIndex?: number;
oldestUnreadIndex?: number;
loadCountdownStart: number | undefined;
messageHeightChangeIndex: number | undefined;
oldestUnreadIndex: number | undefined;
resetCounter: number;
scrollToIndex?: number;
scrollToBottomCounter: number;
scrollToIndex: number | undefined;
scrollToIndexCounter: number;
totalUnread: number;
};
@ -959,7 +960,7 @@ export class Timeline extends React.PureComponent<PropsType, StateType> {
this.scrollDown(false);
};
public scrollDown = (setFocus?: boolean): void => {
public scrollDown = (setFocus?: boolean, forceScrollDown?: boolean): void => {
const {
haveNewest,
id,
@ -976,7 +977,7 @@ export class Timeline extends React.PureComponent<PropsType, StateType> {
const lastId = items[items.length - 1];
const lastSeenIndicatorRow = this.getLastSeenIndicatorRow();
if (!this.visibleRows) {
if (!this.visibleRows || forceScrollDown) {
if (haveNewest) {
this.scrollToBottom(setFocus);
} else if (!isLoadingMessages) {
@ -1033,6 +1034,7 @@ export class Timeline extends React.PureComponent<PropsType, StateType> {
messageHeightChangeIndex,
oldestUnreadIndex,
resetCounter,
scrollToBottomCounter,
scrollToIndex,
typingContactId,
} = this.props;
@ -1050,6 +1052,10 @@ export class Timeline extends React.PureComponent<PropsType, StateType> {
this.resizeHeroRow();
}
if (scrollToBottomCounter !== prevProps.scrollToBottomCounter) {
this.scrollDown(false, true);
}
// There are a number of situations which can necessitate that we forget about row
// heights previously calculated. We reset the minimum number of rows to minimize
// unexpected changes to the scroll position. Those changes happen because