2023-01-03 19:55:46 +00:00
|
|
|
// Copyright 2021 Signal Messenger, LLC
|
2021-10-20 20:46:42 +00:00
|
|
|
// SPDX-License-Identifier: AGPL-3.0-only
|
|
|
|
|
2022-03-03 20:23:10 +00:00
|
|
|
import React from 'react';
|
2021-10-20 20:46:42 +00:00
|
|
|
|
2021-10-26 19:15:33 +00:00
|
|
|
import type { Props as MessageBodyPropsType } from './MessageBody';
|
|
|
|
import { MessageBody } from './MessageBody';
|
2022-04-16 23:40:22 +00:00
|
|
|
import { graphemeAndLinkAwareSlice } from '../../util/graphemeAndLinkAwareSlice';
|
2023-08-16 23:06:40 +00:00
|
|
|
import { shouldLinkifyMessage } from '../../types/LinkPreview';
|
2021-10-20 20:46:42 +00:00
|
|
|
|
|
|
|
export type Props = Pick<
|
|
|
|
MessageBodyPropsType,
|
2022-12-14 19:05:32 +00:00
|
|
|
| 'bodyRanges'
|
2021-10-20 20:46:42 +00:00
|
|
|
| 'direction'
|
|
|
|
| 'disableLinks'
|
|
|
|
| 'i18n'
|
2023-04-10 16:31:45 +00:00
|
|
|
| 'isSpoilerExpanded'
|
|
|
|
| 'onExpandSpoiler'
|
2022-05-23 23:07:41 +00:00
|
|
|
| 'kickOffBodyDownload'
|
2023-04-10 16:31:45 +00:00
|
|
|
| 'renderLocation'
|
2022-12-14 19:05:32 +00:00
|
|
|
| 'showConversation'
|
|
|
|
| 'text'
|
|
|
|
| 'textAttachment'
|
2021-10-20 20:46:42 +00:00
|
|
|
> & {
|
2021-11-11 23:45:47 +00:00
|
|
|
id: string;
|
|
|
|
displayLimit?: number;
|
|
|
|
messageExpanded: (id: string, displayLimit: number) => unknown;
|
2021-10-20 20:46:42 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
const INITIAL_LENGTH = 800;
|
|
|
|
const INCREMENT_COUNT = 3000;
|
2021-11-29 15:42:26 +00:00
|
|
|
const BUFFER = 100;
|
2021-10-20 20:46:42 +00:00
|
|
|
|
2021-12-06 21:52:47 +00:00
|
|
|
export function doesMessageBodyOverflow(str: string): boolean {
|
|
|
|
return str.length > INITIAL_LENGTH + BUFFER;
|
|
|
|
}
|
|
|
|
|
2021-10-20 20:46:42 +00:00
|
|
|
export function MessageBodyReadMore({
|
|
|
|
bodyRanges,
|
|
|
|
direction,
|
|
|
|
disableLinks,
|
2021-11-11 23:45:47 +00:00
|
|
|
displayLimit,
|
2021-10-20 20:46:42 +00:00
|
|
|
i18n,
|
2021-11-11 23:45:47 +00:00
|
|
|
id,
|
2023-04-10 16:31:45 +00:00
|
|
|
isSpoilerExpanded,
|
2022-05-23 23:07:41 +00:00
|
|
|
kickOffBodyDownload,
|
2022-12-14 19:05:32 +00:00
|
|
|
messageExpanded,
|
2023-04-10 16:31:45 +00:00
|
|
|
onExpandSpoiler,
|
|
|
|
renderLocation,
|
2022-12-14 19:05:32 +00:00
|
|
|
showConversation,
|
2021-10-20 20:46:42 +00:00
|
|
|
text,
|
2022-05-23 23:07:41 +00:00
|
|
|
textAttachment,
|
2021-10-20 20:46:42 +00:00
|
|
|
}: Props): JSX.Element {
|
2021-11-11 23:45:47 +00:00
|
|
|
const maxLength = displayLimit || INITIAL_LENGTH;
|
2021-10-20 20:46:42 +00:00
|
|
|
|
2023-08-16 23:06:40 +00:00
|
|
|
const shouldDisableLinks = disableLinks || !shouldLinkifyMessage(text);
|
2022-04-16 23:40:22 +00:00
|
|
|
const { hasReadMore, text: slicedText } = graphemeAndLinkAwareSlice(
|
2022-04-14 17:02:12 +00:00
|
|
|
text,
|
|
|
|
maxLength,
|
|
|
|
BUFFER
|
|
|
|
);
|
2021-10-20 20:46:42 +00:00
|
|
|
|
2023-07-14 18:09:02 +00:00
|
|
|
const disableJumbomoji = bodyRanges?.length ? true : undefined;
|
|
|
|
|
2021-10-20 20:46:42 +00:00
|
|
|
const onIncreaseTextLength = hasReadMore
|
|
|
|
? () => {
|
2021-11-11 23:45:47 +00:00
|
|
|
messageExpanded(id, maxLength + INCREMENT_COUNT);
|
2021-10-20 20:46:42 +00:00
|
|
|
}
|
|
|
|
: undefined;
|
|
|
|
|
|
|
|
return (
|
|
|
|
<MessageBody
|
|
|
|
bodyRanges={bodyRanges}
|
|
|
|
direction={direction}
|
2023-07-14 18:09:02 +00:00
|
|
|
disableJumbomoji={disableJumbomoji}
|
2023-08-16 23:06:40 +00:00
|
|
|
disableLinks={shouldDisableLinks}
|
2021-10-20 20:46:42 +00:00
|
|
|
i18n={i18n}
|
2023-04-10 16:31:45 +00:00
|
|
|
isSpoilerExpanded={isSpoilerExpanded}
|
2022-05-23 23:07:41 +00:00
|
|
|
kickOffBodyDownload={kickOffBodyDownload}
|
2023-04-10 16:31:45 +00:00
|
|
|
onExpandSpoiler={onExpandSpoiler}
|
2022-12-14 19:05:32 +00:00
|
|
|
onIncreaseTextLength={onIncreaseTextLength}
|
2023-04-10 16:31:45 +00:00
|
|
|
renderLocation={renderLocation}
|
2022-12-14 19:05:32 +00:00
|
|
|
showConversation={showConversation}
|
2021-10-20 20:46:42 +00:00
|
|
|
text={slicedText}
|
2022-05-23 23:07:41 +00:00
|
|
|
textAttachment={textAttachment}
|
2021-10-20 20:46:42 +00:00
|
|
|
/>
|
|
|
|
);
|
|
|
|
}
|