63 lines
3.2 KiB
TypeScript
63 lines
3.2 KiB
TypeScript
// Metro module 9967 (f9968).
|
|
import { View } from "react-native";
|
|
import { ACTION_SHEET_MAX_WIDTH } from "../ActionSheetConstants";
|
|
import { createStyles } from "../../../../design/components/Styles/native/createStyles";
|
|
import ActionSheetActionCreators from "../ActionSheetActionCreators";
|
|
import { triggerHapticFeedback, HapticFeedbackTypes } from "../../../haptics/HapticUtils.native";
|
|
import { addReaction, ReactionLocations } from "../../../reactions/ReactionActionCreators";
|
|
import { toReactionEmoji } from "../../../reactions/ReactionUtils";
|
|
import MessageActionCreators from "../../../../actions/MessageActionCreators";
|
|
import { maybeShowDoubleTapReminderToast } from "../../../double_tap_to_react/native/DoubleTapReminderToast";
|
|
import { useToken } from "../../../../design/tokens/native/useToken";
|
|
import Module712 from "../../../../_bundle/Module712";
|
|
import { useEmojisForReactionRow } from "../../../reactions/native/useEmojisForReactionRow";
|
|
import { EmojiReactionRowButton, getEmojiKey, EmojiPickerRowButton } from "../../../reactions/native/EmojiReactionRowButton";
|
|
import { handleAddNewReactions } from "../../../reactions/native/ReactionUtils";
|
|
import { DoubleTapEmojiEditNudge } from "../../../double_tap_to_react/native/DoubleTapEmojiEditNudge";
|
|
import AnalyticsLocation from "../../../app_analytics/AnalyticsLocation";
|
|
const useStyles = createStyles({
|
|
emojiRowContainer: {
|
|
flexDirection: "column",
|
|
justifyContent: "center",
|
|
alignItems: "center"
|
|
},
|
|
emojiRow: {
|
|
height: 52,
|
|
alignSelf: "stretch",
|
|
flexDirection: "row",
|
|
justifyContent: "space-between",
|
|
alignItems: "center",
|
|
marginTop: 0,
|
|
marginBottom: 0
|
|
}
|
|
});
|
|
export default function EmojiRow(props) {
|
|
const { message, channel } = props;
|
|
const token = useToken(Module712.modules.mobile.EMOJI_ROW_EMOJI_SIZE);
|
|
const token2 = useToken(Module712.modules.mobile.EMOJI_ROW_EMOJI_FONT_SIZE);
|
|
const token3 = useToken(Module712.modules.mobile.EMOJI_ROW_EMOJI_LINE_HEIGHT);
|
|
const token4 = useToken(Module712.modules.mobile.EMOJI_ROW_EMOJI_CONTAINER_SIZE);
|
|
const emojisForReactionRow = useEmojisForReactionRow(channel, ACTION_SHEET_MAX_WIDTH, token4 + useToken(Module712.modules.mobile.EMOJI_ROW_EMOJI_MIN_SPACING));
|
|
const styles = useStyles();
|
|
return <View style={styles.emojiRowContainer}>
|
|
<View style={styles.emojiRow}>
|
|
{emojisForReactionRow.map((item, index) => {
|
|
return <EmojiReactionRowButton key={getEmojiKey(item, index)} emoji={item} onPress={() => {
|
|
ActionSheetActionCreators.hideActionSheet();
|
|
if (item != null) {
|
|
triggerHapticFeedback(HapticFeedbackTypes.IMPACT_LIGHT);
|
|
addReaction(message.channel_id, message.id, toReactionEmoji(item));
|
|
MessageActionCreators.focusMessage({
|
|
channelId: message.channel_id,
|
|
messageId: message.id
|
|
});
|
|
maybeShowDoubleTapReminderToast(item);
|
|
}
|
|
}} emojiSize={token} emojiFontSize={token2} emojiLineHeight={token3} emojiContainerSize={token4} />;
|
|
})}
|
|
<EmojiPickerRowButton emojiContainerSize={token4} onPress={() => handleAddNewReactions(channel, message.id, ReactionLocations.MESSAGE)} />
|
|
</View>
|
|
<DoubleTapEmojiEditNudge location={AnalyticsLocation.MESSAGE_LONG_PRESS_MENU} />
|
|
</View>;
|
|
};
|