Page MenuHomePhabricator

D8284.id28068.diff
No OneTemporary

D8284.id28068.diff

diff --git a/native/avatars/emoji-avatar-creation.react.js b/native/avatars/emoji-avatar-creation.react.js
--- a/native/avatars/emoji-avatar-creation.react.js
+++ b/native/avatars/emoji-avatar-creation.react.js
@@ -90,6 +90,11 @@
);
}, [saveAvatarCallLoading, styles.loadingContainer]);
+ const alreadySelectedEmojis = React.useMemo(
+ () => [pendingEmoji],
+ [pendingEmoji],
+ );
+
return (
<View style={styles.container}>
<View style={styles.emojiAvatarCreationContainer}>
@@ -132,6 +137,8 @@
onEmojiSelected={onEmojiSelected}
emojiKeyboardOpen={emojiKeyboardOpen}
onEmojiKeyboardClose={onEmojiKeyboardClose}
+ selectMultipleEmojis={false}
+ alreadySelectedEmojis={alreadySelectedEmojis}
/>
</View>
);
diff --git a/native/chat/multimedia-message-tooltip-button.react.js b/native/chat/multimedia-message-tooltip-button.react.js
--- a/native/chat/multimedia-message-tooltip-button.react.js
+++ b/native/chat/multimedia-message-tooltip-button.react.js
@@ -152,6 +152,8 @@
[sendReaction, dismissTooltip],
);
+ const alreadySelectedEmojis = React.useMemo(() => [], []);
+
return (
<>
<Animated.View style={messageContainerStyle}>
@@ -171,6 +173,7 @@
onEmojiSelected={onEmojiSelected}
emojiKeyboardOpen={emojiPickerOpen}
onEmojiKeyboardClose={dismissTooltip}
+ alreadySelectedEmojis={alreadySelectedEmojis}
/>
</>
);
diff --git a/native/chat/robotext-message-tooltip-button.react.js b/native/chat/robotext-message-tooltip-button.react.js
--- a/native/chat/robotext-message-tooltip-button.react.js
+++ b/native/chat/robotext-message-tooltip-button.react.js
@@ -135,6 +135,8 @@
[sendReaction, dismissTooltip],
);
+ const alreadySelectedEmojis = React.useMemo(() => [], []);
+
return (
<>
<Animated.View style={messageContainerStyle}>
@@ -153,6 +155,7 @@
onEmojiSelected={onEmojiSelected}
emojiKeyboardOpen={emojiPickerOpen}
onEmojiKeyboardClose={dismissTooltip}
+ alreadySelectedEmojis={alreadySelectedEmojis}
/>
</>
);
diff --git a/native/chat/text-message-tooltip-button.react.js b/native/chat/text-message-tooltip-button.react.js
--- a/native/chat/text-message-tooltip-button.react.js
+++ b/native/chat/text-message-tooltip-button.react.js
@@ -149,6 +149,8 @@
[sendReaction, dismissTooltip],
);
+ const alreadySelectedEmojis = React.useMemo(() => [], []);
+
return (
<MessageListContextProvider threadInfo={threadInfo}>
<SidebarInputBarHeightMeasurer
@@ -177,6 +179,7 @@
onEmojiSelected={onEmojiSelected}
emojiKeyboardOpen={emojiPickerOpen}
onEmojiKeyboardClose={dismissTooltip}
+ alreadySelectedEmojis={alreadySelectedEmojis}
/>
</MessageListContextProvider>
);
diff --git a/native/components/emoji-keyboard.react.js b/native/components/emoji-keyboard.react.js
--- a/native/components/emoji-keyboard.react.js
+++ b/native/components/emoji-keyboard.react.js
@@ -1,8 +1,12 @@
// @flow
import AsyncStorage from '@react-native-async-storage/async-storage';
+import _flatMap from 'lodash/fp/flatMap.js';
+import _flow from 'lodash/fp/flow.js';
+import _keyBy from 'lodash/fp/keyBy.js';
import * as React from 'react';
import EmojiPicker, { useRecentPicksPersistence } from 'rn-emoji-keyboard';
+import emojisData from 'rn-emoji-keyboard/src/assets/emojis.json';
const STORAGE_KEY = 'EMOJI_KEYBOARD_RECENT';
@@ -36,6 +40,7 @@
initialization: initializationCallback,
onStateChange: onStateChangeCallback,
};
+const keyedEmojiData = _flow(_flatMap('data'), _keyBy('emoji'))(emojisData);
export type EmojiSelection = {
+emoji: string,
@@ -50,22 +55,45 @@
+onEmojiSelected: (emoji: EmojiSelection) => mixed,
+emojiKeyboardOpen: boolean,
+onEmojiKeyboardClose: () => mixed,
+ +selectMultipleEmojis?: boolean,
+ +alreadySelectedEmojis: $ReadOnlyArray<string>,
};
function EmojiKeyboard(props: Props): React.Node {
- const { onEmojiSelected, emojiKeyboardOpen, onEmojiKeyboardClose } = props;
+ const {
+ onEmojiSelected,
+ emojiKeyboardOpen,
+ onEmojiKeyboardClose,
+ selectMultipleEmojis,
+ alreadySelectedEmojis,
+ } = props;
+
+ const [currentlySelected, setCurrentlySelected] = React.useState<
+ $ReadOnlyArray<string>,
+ >(() => alreadySelectedEmojis.map(emoji => keyedEmojiData[emoji].name));
+
+ const handleOnEmojiSelected = React.useCallback(
+ (emoji: EmojiSelection) => {
+ if (!selectMultipleEmojis) {
+ setCurrentlySelected([emoji.name]);
+ }
+ onEmojiSelected(emoji);
+ },
+ [onEmojiSelected, setCurrentlySelected, selectMultipleEmojis],
+ );
useRecentPicksPersistence(useRecentPicksPersistenceArgs);
return (
<EmojiPicker
- onEmojiSelected={onEmojiSelected}
+ onEmojiSelected={handleOnEmojiSelected}
open={emojiKeyboardOpen}
onClose={onEmojiKeyboardClose}
enableSearchBar
enableSearchAnimation={false}
enableRecentlyUsed
categoryOrder={categoryOrder}
+ selectedEmojis={currentlySelected}
/>
);
}

File Metadata

Mime Type
text/plain
Expires
Tue, Dec 3, 1:23 PM (21 h, 46 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2611429
Default Alt Text
D8284.id28068.diff (5 KB)

Event Timeline