diff --git a/app/containers/MessageActions/Header.tsx b/app/containers/MessageActions/Header.tsx
index 26d35d4c..f9c809e5 100644
--- a/app/containers/MessageActions/Header.tsx
+++ b/app/containers/MessageActions/Header.tsx
@@ -14,12 +14,12 @@ import { IEmoji, TAnyMessageModel } from '../../definitions';
import Touch from '../Touch';
export interface IHeader {
- handleReaction: (emoji: IEmoji, message: TAnyMessageModel) => void;
+ handleReaction: (emoji: IEmoji | null, message: TAnyMessageModel) => void;
message: TAnyMessageModel;
isMasterDetail: boolean;
}
-type TOnReaction = ({ emoji }: { emoji: IEmoji }) => void;
+type TOnReaction = ({ emoji }: { emoji?: IEmoji }) => void;
interface THeaderItem {
item: IEmoji;
@@ -94,8 +94,10 @@ const Header = React.memo(({ handleReaction, message, isMasterDetail }: IHeader)
const quantity = Math.trunc(size / (ITEM_SIZE + ITEM_MARGIN * 2) - 1);
const onReaction: TOnReaction = ({ emoji }) => {
- handleReaction(emoji, message);
- addFrequentlyUsed(emoji);
+ handleReaction(emoji || null, message);
+ if (emoji) {
+ addFrequentlyUsed(emoji);
+ }
};
const renderItem = ({ item }: { item: IEmoji }) => ;
diff --git a/app/containers/MessageActions/index.tsx b/app/containers/MessageActions/index.tsx
index 925d1461..38d77c14 100644
--- a/app/containers/MessageActions/index.tsx
+++ b/app/containers/MessageActions/index.tsx
@@ -285,10 +285,10 @@ const MessageActions = React.memo(
}
};
- const handleReaction: IHeader['handleReaction'] = (shortname, message) => {
+ const handleReaction: IHeader['handleReaction'] = (emoji, message) => {
logEvent(events.ROOM_MSG_ACTION_REACTION);
- if (shortname) {
- onReactionPress(shortname, message.id);
+ if (emoji) {
+ onReactionPress(emoji, message.id);
} else {
setTimeout(() => reactionInit(message), ACTION_SHEET_ANIMATION_DURATION);
}
diff --git a/app/views/RoomView/index.tsx b/app/views/RoomView/index.tsx
index 978372aa..96f55667 100644
--- a/app/views/RoomView/index.tsx
+++ b/app/views/RoomView/index.tsx
@@ -833,13 +833,15 @@ class RoomView extends React.Component {
showReactionPicker = () => {
const { showActionSheet } = this.props;
const { selectedMessage } = this.state;
- showActionSheet({
- children: (
-
- ),
- snaps: [400],
- enableContentPanningGesture: false
- });
+ setTimeout(() => {
+ showActionSheet({
+ children: (
+
+ ),
+ snaps: [400],
+ enableContentPanningGesture: false
+ });
+ }, 100);
};
onReactionInit = (message: TAnyMessageModel) => {