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

Fix scrolling of long group story reply

Browse source
This commit is contained in:
Fedor Indutny 2022-10-20 17:16:25 -07:00 • committed by GitHub
parent d26c5b7db8
commit 203cc995a3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 20 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

9
stylesheets/components/StoryViewsNRepliesModal.scss
View file

@ -45,7 +45,7 @@
&__emoji-button { &__emoji-button {
height: 24px; height: 24px;
margin-right: 8px; margin-left: 10px;
width: 24px; width: 24px;
&::after { &::after {
@ -78,9 +78,12 @@
color: $color-gray-25; color: $color-gray-25;
} }
display: flex;
align-items: center;
min-height: 36px;
&--with-children { &--with-children {
align-items: center; flex: 1;
display: flex;
} }
.quill { .quill {

28
ts/components/CompositionInput.tsx
View file

@ -62,19 +62,19 @@ export type InputApi = {
submit: () => void; submit: () => void;
}; };
export type Props = { export type Props = Readonly<{
children?: React.ReactNode; children?: React.ReactNode;
readonly i18n: LocalizerType; i18n: LocalizerType;
readonly disabled?: boolean; disabled?: boolean;
readonly getPreferredBadge: PreferredBadgeSelectorType; getPreferredBadge: PreferredBadgeSelectorType;
readonly large?: boolean; large?: boolean;
readonly inputApi?: React.MutableRefObject<InputApi | undefined>; inputApi?: React.MutableRefObject<InputApi | undefined>;
readonly skinTone?: EmojiPickDataType['skinTone']; skinTone?: EmojiPickDataType['skinTone'];
readonly draftText?: string; draftText?: string;
readonly draftBodyRanges?: Array<BodyRangeType>; draftBodyRanges?: Array<BodyRangeType>;
readonly moduleClassName?: string; moduleClassName?: string;
readonly theme: ThemeType; theme: ThemeType;
readonly placeholder?: string; placeholder?: string;
sortedGroupMembers?: Array<ConversationType>; sortedGroupMembers?: Array<ConversationType>;
scrollerRef?: React.RefObject<HTMLDivElement>; scrollerRef?: React.RefObject<HTMLDivElement>;
onDirtyChange?(dirty: boolean): unknown; onDirtyChange?(dirty: boolean): unknown;
@ -93,7 +93,7 @@ export type Props = {
onScroll?: (ev: React.UIEvent<HTMLElement>) => void; onScroll?: (ev: React.UIEvent<HTMLElement>) => void;
getQuotedMessage?(): unknown; getQuotedMessage?(): unknown;
clearQuotedMessage?(): unknown; clearQuotedMessage?(): unknown;
}; }>;
const MAX_LENGTH = 64 * 1024; const MAX_LENGTH = 64 * 1024;
const BASE_CLASS_NAME = 'module-composition-input'; const BASE_CLASS_NAME = 'module-composition-input';
@ -671,6 +671,7 @@ export function CompositionInput(props: Props): React.ReactElement {
<Reference> <Reference>
{({ ref }) => ( {({ ref }) => (
<div className={getClassName('__input')} ref={ref}> <div className={getClassName('__input')} ref={ref}>
{children}
<div <div
ref={ ref={
props.scrollerRef props.scrollerRef
@ -685,7 +686,6 @@ export function CompositionInput(props: Props): React.ReactElement {
children ? getClassName('__input--with-children') : null children ? getClassName('__input--with-children') : null
)} )}
> >
{children}
{reactQuill} {reactQuill}
{emojiCompletionElement} {emojiCompletionElement}
{mentionCompletionElement} {mentionCompletionElement}