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;