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

Fix composer emoji picker hidden for RTL languages

Browse source
This commit is contained in:
ayumi-signal 2023-11-20 12:46:49 -08:00 committed by GitHub
parent 32e5ac128b
commit be5ac3a1e0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 7 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
ts/components/emoji/EmojiButton.tsx
View file

@ -55,6 +55,8 @@ export const EmojiButton = React.memo(function EmojiButtonInner({
recentEmojis,
variant = EmojiButtonVariant.Normal,
}: Props) {
const isRTL = i18n.getLocaleDirection() === 'rtl';
const [open, setOpen] = React.useState(false);
const buttonRef = React.useRef<HTMLButtonElement | null>(null);
const popperRef = React.useRef<HTMLDivElement | null>(null);
@ -164,7 +166,7 @@ export const EmojiButton = React.memo(function EmojiButtonInner({
</Reference>
{open ? (
<div ref={popperRef}>
<Popper placement="top-start" strategy="fixed">
<Popper placement={isRTL ? 'top-end' : 'top-start'} strategy="fixed">
{({ ref, style }) => (
<EmojiPicker
ref={ref}

4
ts/components/emoji/EmojiPicker.tsx
View file

@ -82,6 +82,8 @@ export const EmojiPicker = React.memo(
}: Props,
ref
) => {
const isRTL = i18n.getLocaleDirection() === 'rtl';
const [firstRecent] = React.useState(recentEmojis);
const [selectedCategory, setSelectedCategory] = React.useState<Category>(
categories[0]
@ -445,6 +447,8 @@ export const EmojiPicker = React.memo(
height={height}
columnCount={COL_COUNT}
columnWidth={38}
// react-virtualized Grid default style has direction: 'ltr'
style={{ direction: isRTL ? 'rtl' : 'ltr' }}
rowHeight={getRowHeight}
rowCount={rowCount}
cellRenderer={cellRenderer}