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
@@ -7,7 +7,6 @@
TouchableWithoutFeedback,
ActivityIndicator,
} from 'react-native';
-import EmojiPicker from 'rn-emoji-keyboard';
import type {
UpdateUserAvatarRequest,
@@ -17,6 +16,7 @@
import Avatar from './avatar.react.js';
import Button from '../components/button.react.js';
import ColorRows from '../components/color-rows.react.js';
+import EmojiKeyboard from '../components/emoji-keyboard.react.js';
import { useStyles } from '../themes/colors.js';
type Props = {
@@ -128,10 +128,10 @@
Reset
-
);
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
@@ -2,7 +2,6 @@
import * as React from 'react';
import Animated from 'react-native-reanimated';
-import EmojiPicker from 'rn-emoji-keyboard';
import { localIDPrefix } from 'lib/shared/message-utils.js';
import { useCanCreateReactionFromMessage } from 'lib/shared/reaction-utils.js';
@@ -15,6 +14,7 @@
import ReactionSelectionPopover from './reaction-selection-popover.react.js';
import SidebarInputBarHeightMeasurer from './sidebar-input-bar-height-measurer.react.js';
import { useAnimatedMessageTooltipButton } from './utils.js';
+import EmojiKeyboard from '../components/emoji-keyboard.react.js';
import type { AppNavigationProp } from '../navigation/app-navigator.react.js';
import { useSelector } from '../redux/redux-utils.js';
import { useTooltipActions } from '../tooltip/tooltip-hooks.js';
@@ -167,10 +167,10 @@
{innerMultimediaMessage}
{inlineEngagement}
-
>
);
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
@@ -2,7 +2,6 @@
import * as React from 'react';
import Animated from 'react-native-reanimated';
-import EmojiPicker from 'rn-emoji-keyboard';
import { localIDPrefix } from 'lib/shared/message-utils.js';
import { useCanCreateReactionFromMessage } from 'lib/shared/reaction-utils.js';
@@ -14,6 +13,7 @@
import SidebarInputBarHeightMeasurer from './sidebar-input-bar-height-measurer.react.js';
import { Timestamp } from './timestamp.react.js';
import { useAnimatedMessageTooltipButton } from './utils.js';
+import EmojiKeyboard from '../components/emoji-keyboard.react.js';
import type { AppNavigationProp } from '../navigation/app-navigator.react.js';
import { useSelector } from '../redux/redux-utils.js';
import { useTooltipActions } from '../tooltip/tooltip-hooks.js';
@@ -149,10 +149,10 @@
{inlineEngagement}
-
>
);
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
@@ -2,7 +2,6 @@
import * as React from 'react';
import Animated from 'react-native-reanimated';
-import EmojiPicker from 'rn-emoji-keyboard';
import { localIDPrefix } from 'lib/shared/message-utils.js';
import { useCanCreateReactionFromMessage } from 'lib/shared/reaction-utils.js';
@@ -17,6 +16,7 @@
import ReactionSelectionPopover from './reaction-selection-popover.react.js';
import SidebarInputBarHeightMeasurer from './sidebar-input-bar-height-measurer.react.js';
import { useAnimatedMessageTooltipButton } from './utils.js';
+import EmojiKeyboard from '../components/emoji-keyboard.react.js';
import type { AppNavigationProp } from '../navigation/app-navigator.react.js';
import { useSelector } from '../redux/redux-utils.js';
import { useTooltipActions } from '../tooltip/tooltip-hooks.js';
@@ -173,10 +173,10 @@
{inlineEngagement}
-
);
diff --git a/native/components/emoji-keyboard.react.js b/native/components/emoji-keyboard.react.js
new file mode 100644
--- /dev/null
+++ b/native/components/emoji-keyboard.react.js
@@ -0,0 +1,24 @@
+// @flow
+
+import * as React from 'react';
+import EmojiPicker from 'rn-emoji-keyboard';
+
+type Props = {
+ +onEmojiSelected: (emoji: { emoji: string, ... }) => mixed,
+ +emojiKeyboardOpen: boolean,
+ +onEmojiKeyboardClose: () => mixed,
+};
+
+function EmojiKeyboard(props: Props): React.Node {
+ const { onEmojiSelected, emojiKeyboardOpen, onEmojiKeyboardClose } = props;
+
+ return (
+
+ );
+}
+
+export default EmojiKeyboard;