snapshot of https://github.com/jitsi/jitsi-meet.git @ fd1749dd28f4138aa80234fc7f311b19aaffa0e7 (2026-09-15)

react/features/reactions/components/native/ReactionButton.tsx

@@ -0,0 +1,105 @@
+import React, { useCallback } from 'react';
+import { WithTranslation } from 'react-i18next';
+import { ColorValue, GestureResponderEvent, Text, TouchableHighlight, ViewStyle } from 'react-native';
+import { useDispatch } from 'react-redux';
+
+import { createReactionMenuEvent } from '../../../analytics/AnalyticsEvents';
+import { sendAnalytics } from '../../../analytics/functions';
+import { translate } from '../../../base/i18n/functions';
+import { StyleType } from '../../../base/styles/functions.native';
+import { addReactionToBuffer } from '../../actions.any';
+import { REACTIONS } from '../../constants';
+
+interface IReactionStyles {
+
+    /**
+     * Style for text container. Used on raise hand button.
+     */
+    container?: StyleType;
+
+    /**
+     * Style for the emoji text on the button.
+     */
+    emoji: StyleType;
+
+    /**
+     * Style for the gif button.
+     */
+    gifButton: StyleType;
+
+    /**
+     * Style for the button.
+     */
+    style: StyleType;
+
+    /**
+     * Style for the label text on the button.
+     */
+    text?: StyleType;
+
+    /**
+     * Underlay color for the button.
+     */
+    underlayColor: ColorValue;
+
+}
+
+/**
+ * The type of the React {@code Component} props of {@link ReactionButton}.
+ */
+interface IProps extends WithTranslation {
+
+    /**
+     * Component children.
+     */
+    children?: React.ReactNode;
+
+    /**
+     * External click handler.
+     */
+    onClick?: (e?: GestureResponderEvent) => void;
+
+    /**
+     * The reaction to be sent.
+     */
+    reaction?: string;
+
+    /**
+     * Collection of styles for the button.
+     */
+    styles: IReactionStyles;
+}
+
+/**
+ * An implementation of a button to send a reaction.
+ *
+ * @returns {ReactElement}
+ */
+function ReactionButton({
+    children,
+    onClick,
+    styles,
+    reaction,
+    t
+}: IProps) {
+    const dispatch = useDispatch();
+    const _onClick = useCallback(() => {
+        if (reaction) {
+            dispatch(addReactionToBuffer(reaction));
+            sendAnalytics(createReactionMenuEvent(reaction));
+        }
+    }, [ reaction ]);
+
+    return (
+        <TouchableHighlight
+            accessibilityLabel = { t(`toolbar.accessibilityLabel.${reaction}`) }
+            accessibilityRole = 'button'
+            onPress = { onClick || _onClick }
+            style = { [ styles.style, children && styles?.gifButton ] as ViewStyle[] }
+            underlayColor = { styles.underlayColor }>
+            {children ?? <Text style = { styles.emoji }>{REACTIONS[reaction ?? ''].emoji}</Text>}
+        </TouchableHighlight>
+    );
+}
+
+export default translate(ReactionButton);