@planningcenter/chat-react-native 3.20.2-rc.0 → 3.21.0-rc.0

package/build/components/conversation/message_reaction.d.ts

@@ -1,7 +1,6 @@
 import React from 'react';
 import { ReactionCountResource } from '../../types/resources/reaction';
 import { MessageResource } from '../../types';
-export declare const REACTION_EMOJIS: Record<ReactionCountResource['value'], string>;
 export declare function MessageReaction({ reaction, onLongPress, message, conversationId, }: {
     reaction: ReactionCountResource;
     onLongPress: (_reaction: ReactionCountResource) => void;

package/build/components/conversation/message_reaction.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"message_reaction.d.ts","sourceRoot":"","sources":["../../../src/components/conversation/message_reaction.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkB,MAAM,OAAO,CAAA;AAKtC,OAAO,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAA;AACtE,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AAI7C,eAAO,MAAM,eAAe,EAAE,MAAM,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,MAAM,CAM1E,CAAA;AAED,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,WAAW,EACX,OAAO,EACP,cAAc,GACf,EAAE;IACD,QAAQ,EAAE,qBAAqB,CAAA;IAC/B,WAAW,EAAE,CAAC,SAAS,EAAE,qBAAqB,KAAK,IAAI,CAAA;IACvD,OAAO,EAAE,eAAe,CAAA;IACxB,cAAc,EAAE,MAAM,CAAA;CACvB,4BA+BA;AAED,eAAO,MAAM,iBAAiB,aAAc;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE;;;;;;;;;;;;;;;;;;;;;CA0B3D,CAAA"}
+{"version":3,"file":"message_reaction.d.ts","sourceRoot":"","sources":["../../../src/components/conversation/message_reaction.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkB,MAAM,OAAO,CAAA;AAKtC,OAAO,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAA;AACtE,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AAK7C,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,WAAW,EACX,OAAO,EACP,cAAc,GACf,EAAE;IACD,QAAQ,EAAE,qBAAqB,CAAA;IAC/B,WAAW,EAAE,CAAC,SAAS,EAAE,qBAAqB,KAAK,IAAI,CAAA;IACvD,OAAO,EAAE,eAAe,CAAA;IACxB,cAAc,EAAE,MAAM,CAAA;CACvB,4BA+BA;AAED,eAAO,MAAM,iBAAiB,aAAc;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE;;;;;;;;;;;;;;;;;;;;;CA0B3D,CAAA"}

package/build/components/conversation/message_reaction.js

@@ -7,13 +7,7 @@ import { useInteractionGhostBackgroundColor, useTheme } from '../../hooks';
 import { useMessageReactionToggle } from '../../hooks/use_message_reaction_toggle';
 import { useCreateAndroidRippleColor } from '../../hooks/use_create_android_ripple_color';
 import { Haptic } from '../../utils/native_adapters';
-export const REACTION_EMOJIS = {
-    thumbs_up: '👍',
-    thumbs_down: '👎',
-    pray: '🙏',
-    laugh: '😂',
-    heart: '❤️',
-};
+import { REACTION_EMOJIS } from '../../utils';
 export function MessageReaction({ reaction, onLongPress, message, conversationId, }) {
     const styles = useReactionStyles(reaction);
     const { handleReactionToggle } = useMessageReactionToggle({

package/build/components/conversation/message_reaction.js.map

@@ -1 +1 @@
-{"version":3,"file":"message_reaction.js","sourceRoot":"","sources":["../../../src/components/conversation/message_reaction.tsx"],"names":[],"mappings":"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","sourcesContent":["import { PlatformPressable } from '@react-navigation/elements'\nimport colorFunction from 'color'\nimport React, { useMemo } from 'react'\nimport { StyleSheet } from 'react-native'\nimport { Text } from '../../components/display'\nimport { useInteractionGhostBackgroundColor, useTheme } from '../../hooks'\nimport { useMessageReactionToggle } from '../../hooks/use_message_reaction_toggle'\nimport { ReactionCountResource } from '../../types/resources/reaction'\nimport { MessageResource } from '../../types'\nimport { useCreateAndroidRippleColor } from '../../hooks/use_create_android_ripple_color'\nimport { Haptic } from '../../utils/native_adapters'\n\nexport const REACTION_EMOJIS: Record<ReactionCountResource['value'], string> = {\n  thumbs_up: '👍',\n  thumbs_down: '👎',\n  pray: '🙏',\n  laugh: '😂',\n  heart: '❤️',\n}\n\nexport function MessageReaction({\n  reaction,\n  onLongPress,\n  message,\n  conversationId,\n}: {\n  reaction: ReactionCountResource\n  onLongPress: (_reaction: ReactionCountResource) => void\n  message: MessageResource\n  conversationId: number\n}) {\n  const styles = useReactionStyles(reaction)\n  const { handleReactionToggle } = useMessageReactionToggle({\n    conversation_id: conversationId,\n    message,\n  })\n\n  const { colors } = useTheme()\n  const baseRippleColor = reaction.mine ? colors.interaction : colors.fillColorNeutral060\n  const androidRippleColor = useCreateAndroidRippleColor({ color: baseRippleColor })\n\n  if (!reaction.count) return null\n  if (!REACTION_EMOJIS[reaction.value]) return null\n\n  const handlePress = () => {\n    Haptic.impactLight()\n    handleReactionToggle({ value: reaction.value, mine: !!reaction.mine })\n  }\n\n  return (\n    <PlatformPressable\n      key={reaction.value}\n      style={styles.reaction}\n      onLongPress={() => onLongPress(reaction)}\n      onPress={handlePress}\n      android_ripple={{ color: androidRippleColor, borderless: false, foreground: true }}\n    >\n      <Text style={styles.reactionEmoji}>{REACTION_EMOJIS[reaction.value]}</Text>\n      <Text style={styles.reactionText}>{reaction.count}</Text>\n    </PlatformPressable>\n  )\n}\n\nexport const useReactionStyles = ({ mine }: { mine: number }) => {\n  const { colors } = useTheme()\n  const activeBorderColor = useMemo(() => {\n    return colorFunction(colors.interaction)\n      .hsl()\n      .lightness(colors.name === 'dark' ? 20 : 80)\n      .string()\n  }, [colors.interaction, colors.name])\n  const activeBackgroundColor = useInteractionGhostBackgroundColor()\n\n  return StyleSheet.create({\n    reaction: {\n      borderWidth: 1,\n      borderColor: mine ? activeBorderColor : 'transparent',\n      backgroundColor: mine ? activeBackgroundColor : colors.fillColorNeutral060,\n      borderRadius: 16,\n      overflow: 'hidden',\n      paddingVertical: 4,\n      paddingHorizontal: 8,\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 2,\n    },\n    reactionEmoji: { fontSize: 12, paddingTop: 0 },\n    reactionText: { fontSize: 12, color: colors.textColorDefaultPrimary },\n  })\n}\n"]}
+{"version":3,"file":"message_reaction.js","sourceRoot":"","sources":["../../../src/components/conversation/message_reaction.tsx"],"names":[],"mappings":"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","sourcesContent":["import { PlatformPressable } from '@react-navigation/elements'\nimport colorFunction from 'color'\nimport React, { useMemo } from 'react'\nimport { StyleSheet } from 'react-native'\nimport { Text } from '../../components/display'\nimport { useInteractionGhostBackgroundColor, useTheme } from '../../hooks'\nimport { useMessageReactionToggle } from '../../hooks/use_message_reaction_toggle'\nimport { ReactionCountResource } from '../../types/resources/reaction'\nimport { MessageResource } from '../../types'\nimport { useCreateAndroidRippleColor } from '../../hooks/use_create_android_ripple_color'\nimport { Haptic } from '../../utils/native_adapters'\nimport { REACTION_EMOJIS } from '../../utils'\n\nexport function MessageReaction({\n  reaction,\n  onLongPress,\n  message,\n  conversationId,\n}: {\n  reaction: ReactionCountResource\n  onLongPress: (_reaction: ReactionCountResource) => void\n  message: MessageResource\n  conversationId: number\n}) {\n  const styles = useReactionStyles(reaction)\n  const { handleReactionToggle } = useMessageReactionToggle({\n    conversation_id: conversationId,\n    message,\n  })\n\n  const { colors } = useTheme()\n  const baseRippleColor = reaction.mine ? colors.interaction : colors.fillColorNeutral060\n  const androidRippleColor = useCreateAndroidRippleColor({ color: baseRippleColor })\n\n  if (!reaction.count) return null\n  if (!REACTION_EMOJIS[reaction.value]) return null\n\n  const handlePress = () => {\n    Haptic.impactLight()\n    handleReactionToggle({ value: reaction.value, mine: !!reaction.mine })\n  }\n\n  return (\n    <PlatformPressable\n      key={reaction.value}\n      style={styles.reaction}\n      onLongPress={() => onLongPress(reaction)}\n      onPress={handlePress}\n      android_ripple={{ color: androidRippleColor, borderless: false, foreground: true }}\n    >\n      <Text style={styles.reactionEmoji}>{REACTION_EMOJIS[reaction.value]}</Text>\n      <Text style={styles.reactionText}>{reaction.count}</Text>\n    </PlatformPressable>\n  )\n}\n\nexport const useReactionStyles = ({ mine }: { mine: number }) => {\n  const { colors } = useTheme()\n  const activeBorderColor = useMemo(() => {\n    return colorFunction(colors.interaction)\n      .hsl()\n      .lightness(colors.name === 'dark' ? 20 : 80)\n      .string()\n  }, [colors.interaction, colors.name])\n  const activeBackgroundColor = useInteractionGhostBackgroundColor()\n\n  return StyleSheet.create({\n    reaction: {\n      borderWidth: 1,\n      borderColor: mine ? activeBorderColor : 'transparent',\n      backgroundColor: mine ? activeBackgroundColor : colors.fillColorNeutral060,\n      borderRadius: 16,\n      overflow: 'hidden',\n      paddingVertical: 4,\n      paddingHorizontal: 8,\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 2,\n    },\n    reactionEmoji: { fontSize: 12, paddingTop: 0 },\n    reactionText: { fontSize: 12, color: colors.textColorDefaultPrimary },\n  })\n}\n"]}

package/build/hooks/use_message_reaction_toggle.d.ts

@@ -8,7 +8,7 @@ type UseMessageReactionToggleProps = {
 };
 type ToggleReactionParams = {
     value: ReactionCountResource['value'];
-    mine?: boolean;
+    mine: boolean;
 };
 type QueryData = InfiniteData<ApiCollection<MessageResource>>;
 export declare function useMessageReactionToggle({ conversation_id, message, onSuccess, }: UseMessageReactionToggleProps): {

package/build/hooks/use_message_reaction_toggle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use_message_reaction_toggle.d.ts","sourceRoot":"","sources":["../../src/hooks/use_message_reaction_toggle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAA+B,MAAM,uBAAuB,CAAA;AAKjF,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AACtE,OAAO,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAA;AAGnE,KAAK,6BAA6B,GAAG;IACnC,eAAe,EAAE,MAAM,CAAA;IACvB,OAAO,EAAE,eAAe,CAAA;IACxB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;CACvB,CAAA;AAED,KAAK,oBAAoB,GAAG;IAC1B,KAAK,EAAE,qBAAqB,CAAC,OAAO,CAAC,CAAA;IACrC,IAAI,CAAC,EAAE,OAAO,CAAA;CACf,CAAA;AAED,KAAK,SAAS,GAAG,YAAY,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC,CAAA;AAE7D,wBAAgB,wBAAwB,CAAC,EACvC,eAAe,EACf,OAAO,EACP,SAAS,GACV,EAAE,6BAA6B;;;;;EA0E/B"}
+{"version":3,"file":"use_message_reaction_toggle.d.ts","sourceRoot":"","sources":["../../src/hooks/use_message_reaction_toggle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAA+B,MAAM,uBAAuB,CAAA;AAKjF,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AACtE,OAAO,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAA;AAMnE,KAAK,6BAA6B,GAAG;IACnC,eAAe,EAAE,MAAM,CAAA;IACvB,OAAO,EAAE,eAAe,CAAA;IACxB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;CACvB,CAAA;AAED,KAAK,oBAAoB,GAAG;IAC1B,KAAK,EAAE,qBAAqB,CAAC,OAAO,CAAC,CAAA;IACrC,IAAI,EAAE,OAAO,CAAA;CACd,CAAA;AAED,KAAK,SAAS,GAAG,YAAY,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC,CAAA;AAE7D,wBAAgB,wBAAwB,CAAC,EACvC,eAAe,EACf,OAAO,EACP,SAAS,GACV,EAAE,6BAA6B;;;;;EA0E/B"}

package/build/hooks/use_message_reaction_toggle.js

@@ -3,7 +3,9 @@ import { useCallback } from 'react';
 import { Alert } from 'react-native';
 import { useApiClient } from './use_api_client';
 import { getMessagesQueryKey, getMessagesRequestArgs } from '../utils/request/get_messages';
-import { updateRecordInPagesData } from '../utils';
+import { updateRecordInPagesData, REACTION_EMOJIS } from '../utils';
+const REACT = 1;
+const UNREACT = -1;
 export function useMessageReactionToggle({ conversation_id, message, onSuccess, }) {
     const apiClient = useApiClient();
     const queryClient = useQueryClient();
@@ -12,7 +14,7 @@ export function useMessageReactionToggle({ conversation_id, message, onSuccess,
     const toggleReaction = useCallback(({ value, mine }) => {
         const requestParams = getMessagesRequestArgs({ conversation_id });
         // If already reacted, unreact; otherwise react
-        const endpoint = !mine ? 'react' : 'unreact';
+        const endpoint = mine ? 'unreact' : 'react';
         const url = `/me/conversations/${conversation_id}/messages/${message_id}/${endpoint}`;
         const fieldsWithValueJoined = Object.fromEntries(Object.entries(requestParams.data.fields).map(([k, v]) => [k, v.join(',')]));
         return apiClient.chat.post({
@@ -36,7 +38,7 @@ export function useMessageReactionToggle({ conversation_id, message, onSuccess,
                     message,
                     data,
                     value: variables.value,
-                    state: !variables.mine,
+                    mine: variables.mine,
                 }));
             }
             return { previousData };
@@ -63,19 +65,18 @@ export function useMessageReactionToggle({ conversation_id, message, onSuccess,
         isPending,
     };
 }
-const optimisticUpdate = ({ message, data, value, state, }) => {
+const optimisticUpdate = ({ message, data, value, mine, }) => {
     if (!data)
         return data;
-    const updatedReactionCounts = message.reactionCounts.map(reaction => {
-        if (reaction.value === value) {
-            return {
-                ...reaction,
-                mine: state ? 1 : 0,
-                count: state ? reaction.count + 1 : reaction.count - 1,
-            };
-        }
-        return reaction;
-    });
+    const hasExistingReaction = message.reactionCounts.some(r => r.value === value);
+    let updatedReactionCounts;
+    if (hasExistingReaction) {
+        const delta = mine ? UNREACT : REACT;
+        updatedReactionCounts = updateCount(message.reactionCounts, value, delta);
+    }
+    else {
+        updatedReactionCounts = createCount(message.reactionCounts, value, message.id);
+    }
     const updatedMessage = {
         ...message,
         reactionCounts: updatedReactionCounts,
@@ -85,4 +86,33 @@ const optimisticUpdate = ({ message, data, value, state, }) => {
         record: updatedMessage,
     });
 };
+const updateCount = (reactionCounts, value, delta) => {
+    return reactionCounts.map(reaction => {
+        if (reaction.value === value) {
+            return {
+                ...reaction,
+                mine: delta > 0 ? 1 : 0,
+                count: reaction.count + delta,
+            };
+        }
+        return reaction;
+    });
+};
+const createCount = (reactionCounts, value, messageId) => {
+    const reactionOrder = Object.keys(REACTION_EMOJIS);
+    const newReactionIndex = reactionOrder.indexOf(value);
+    const insertIndex = reactionCounts.findIndex(r => reactionOrder.indexOf(r.value) > newReactionIndex);
+    const newReaction = {
+        type: 'ReactionCount',
+        id: `${messageId}/${value}`,
+        value,
+        count: 1,
+        mine: 1,
+        messageId,
+        authorIds: [],
+    };
+    return insertIndex === -1
+        ? [...reactionCounts, newReaction]
+        : [...reactionCounts.slice(0, insertIndex), newReaction, ...reactionCounts.slice(insertIndex)];
+};
 //# sourceMappingURL=use_message_reaction_toggle.js.map

package/build/hooks/use_message_reaction_toggle.js.map

@@ -1 +1 @@
-{"version":3,"file":"use_message_reaction_toggle.js","sourceRoot":"","sources":["../../src/hooks/use_message_reaction_toggle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAgB,WAAW,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAA;AACjF,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AACnC,OAAO,EAAE,KAAK,EAAE,MAAM,cAAc,CAAA;AACpC,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAA;AAC/C,OAAO,EAAE,mBAAmB,EAAE,sBAAsB,EAAE,MAAM,+BAA+B,CAAA;AAG3F,OAAO,EAAE,uBAAuB,EAAE,MAAM,UAAU,CAAA;AAelD,MAAM,UAAU,wBAAwB,CAAC,EACvC,eAAe,EACf,OAAO,EACP,SAAS,GACqB;IAC9B,MAAM,SAAS,GAAG,YAAY,EAAE,CAAA;IAChC,MAAM,WAAW,GAAG,cAAc,EAAE,CAAA;IACpC,MAAM,QAAQ,GAAG,mBAAmB,CAAC,EAAE,eAAe,EAAE,CAAC,CAAA;IACzD,MAAM,UAAU,GAAG,OAAO,CAAC,EAAE,CAAA;IAE7B,MAAM,cAAc,GAAG,WAAW,CAChC,CAAC,EAAE,KAAK,EAAE,IAAI,EAAwB,EAAE,EAAE;QACxC,MAAM,aAAa,GAAG,sBAAsB,CAAC,EAAE,eAAe,EAAE,CAAC,CAAA;QAEjE,+CAA+C;QAC/C,MAAM,QAAQ,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAA;QAC5C,MAAM,GAAG,GAAG,qBAAqB,eAAe,aAAa,UAAU,IAAI,QAAQ,EAAE,CAAA;QACrF,MAAM,qBAAqB,GAAG,MAAM,CAAC,WAAW,CAC9C,MAAM,CAAC,OAAO,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAC5E,CAAA;QAED,OAAO,SAAS,CAAC,IAAI,CAAC,IAAI,CAA+B;YACvD,GAAG;YACH,IAAI,EAAE;gBACJ,GAAG,aAAa,CAAC,IAAI;gBACrB,IAAI,EAAE;oBACJ,IAAI,EAAE,SAAS;oBACf,UAAU,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE;iBAC7B;gBACD,MAAM,EAAE,qBAAqB;aAC9B;SACF,CAAC,CAAA;IACJ,CAAC,EACD,CAAC,SAAS,EAAE,eAAe,EAAE,UAAU,CAAC,CACzC,CAAA;IAED,MAAM,EAAE,MAAM,EAAE,oBAAoB,EAAE,SAAS,EAAE,GAAG,WAAW,CAAC;QAC9D,UAAU,EAAE,cAAc;QAC1B,QAAQ,EAAE,SAAS,CAAC,EAAE;YACpB,MAAM,YAAY,GAAG,WAAW,CAAC,YAAY,CAAY,QAAQ,CAAC,CAAA;YAClE,IAAI,YAAY,EAAE,CAAC;gBACjB,WAAW,CAAC,YAAY,CAAY,QAAQ,EAAE,IAAI,CAAC,EAAE,CACnD,gBAAgB,CAAC;oBACf,OAAO;oBACP,IAAI;oBACJ,KAAK,EAAE,SAAS,CAAC,KAAK;oBACtB,KAAK,EAAE,CAAC,SAAS,CAAC,IAAI;iBACvB,CAAC,CACH,CAAA;YACH,CAAC;YACD,OAAO,EAAE,YAAY,EAAE,CAAA;QACzB,CAAC;QACD,SAAS,EAAE,MAAM,CAAC,EAAE;YAClB,MAAM,cAAc,GAAG,MAAM,CAAC,IAAI,CAAA;YAElC,WAAW,CAAC,YAAY,CAAY,QAAQ,EAAE,IAAI,CAAC,EAAE,CACnD,uBAAuB,CAAC;gBACtB,IAAI;gBACJ,MAAM,EAAE,cAAc;aACvB,CAAC,CACH,CAAA;YAED,IAAI,SAAS,EAAE,CAAC;gBACd,SAAS,EAAE,CAAA;YACb,CAAC;QACH,CAAC;QACD,OAAO,EAAE,CAAC,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,EAAE;YACtC,IAAI,OAAO,EAAE,YAAY,EAAE,CAAC;gBAC1B,WAAW,CAAC,YAAY,CAAY,QAAQ,EAAE,OAAO,CAAC,YAAY,CAAC,CAAA;YACrE,CAAC;YACD,KAAK,CAAC,KAAK,CAAC,MAAM,EAAE,4DAA4D,CAAC,CAAA;QACnF,CAAC;KACF,CAAC,CAAA;IAEF,OAAO;QACL,oBAAoB;QACpB,SAAS;KACV,CAAA;AACH,CAAC;AAED,MAAM,gBAAgB,GAAG,CAAC,EACxB,OAAO,EACP,IAAI,EACJ,KAAK,EACL,KAAK,GAMN,EAAE,EAAE;IACH,IAAI,CAAC,IAAI;QAAE,OAAO,IAAI,CAAA;IAEtB,MAAM,qBAAqB,GAA4B,OAAO,CAAC,cAAc,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE;QAC3F,IAAI,QAAQ,CAAC,KAAK,KAAK,KAAK,EAAE,CAAC;YAC7B,OAAO;gBACL,GAAG,QAAQ;gBACX,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;gBACnB,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,KAAK,GAAG,CAAC;aAC9B,CAAA;QAC5B,CAAC;QACD,OAAO,QAAQ,CAAA;IACjB,CAAC,CAAC,CAAA;IAEF,MAAM,cAAc,GAAoB;QACtC,GAAG,OAAO;QACV,cAAc,EAAE,qBAAqB;KACtC,CAAA;IAED,OAAO,uBAAuB,CAAC;QAC7B,IAAI;QACJ,MAAM,EAAE,cAAc;KACvB,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import { InfiniteData, useMutation, useQueryClient } from '@tanstack/react-query'\nimport { useCallback } from 'react'\nimport { Alert } from 'react-native'\nimport { useApiClient } from './use_api_client'\nimport { getMessagesQueryKey, getMessagesRequestArgs } from '../utils/request/get_messages'\nimport { ApiCollection, ApiResource, MessageResource } from '../types'\nimport { ReactionCountResource } from '../types/resources/reaction'\nimport { updateRecordInPagesData } from '../utils'\n\ntype UseMessageReactionToggleProps = {\n  conversation_id: number\n  message: MessageResource\n  onSuccess?: () => void\n}\n\ntype ToggleReactionParams = {\n  value: ReactionCountResource['value']\n  mine?: boolean\n}\n\ntype QueryData = InfiniteData<ApiCollection<MessageResource>>\n\nexport function useMessageReactionToggle({\n  conversation_id,\n  message,\n  onSuccess,\n}: UseMessageReactionToggleProps) {\n  const apiClient = useApiClient()\n  const queryClient = useQueryClient()\n  const queryKey = getMessagesQueryKey({ conversation_id })\n  const message_id = message.id\n\n  const toggleReaction = useCallback(\n    ({ value, mine }: ToggleReactionParams) => {\n      const requestParams = getMessagesRequestArgs({ conversation_id })\n\n      // If already reacted, unreact; otherwise react\n      const endpoint = !mine ? 'react' : 'unreact'\n      const url = `/me/conversations/${conversation_id}/messages/${message_id}/${endpoint}`\n      const fieldsWithValueJoined = Object.fromEntries(\n        Object.entries(requestParams.data.fields).map(([k, v]) => [k, v.join(',')])\n      )\n\n      return apiClient.chat.post<ApiResource<MessageResource>>({\n        url,\n        data: {\n          ...requestParams.data,\n          data: {\n            type: 'Message',\n            attributes: { value: value },\n          },\n          fields: fieldsWithValueJoined,\n        },\n      })\n    },\n    [apiClient, conversation_id, message_id]\n  )\n\n  const { mutate: handleReactionToggle, isPending } = useMutation({\n    mutationFn: toggleReaction,\n    onMutate: variables => {\n      const previousData = queryClient.getQueryData<QueryData>(queryKey)\n      if (previousData) {\n        queryClient.setQueryData<QueryData>(queryKey, data =>\n          optimisticUpdate({\n            message,\n            data,\n            value: variables.value,\n            state: !variables.mine,\n          })\n        )\n      }\n      return { previousData }\n    },\n    onSuccess: result => {\n      const updatedMessage = result.data\n\n      queryClient.setQueryData<QueryData>(queryKey, data =>\n        updateRecordInPagesData({\n          data,\n          record: updatedMessage,\n        })\n      )\n\n      if (onSuccess) {\n        onSuccess()\n      }\n    },\n    onError: (_data, _variables, context) => {\n      if (context?.previousData) {\n        queryClient.setQueryData<QueryData>(queryKey, context.previousData)\n      }\n      Alert.alert('Oops', 'We were unable to react to this message. Please try again.')\n    },\n  })\n\n  return {\n    handleReactionToggle,\n    isPending,\n  }\n}\n\nconst optimisticUpdate = ({\n  message,\n  data,\n  value,\n  state,\n}: {\n  message: MessageResource\n  data: QueryData | undefined\n  value: ReactionCountResource['value']\n  state: boolean\n}) => {\n  if (!data) return data\n\n  const updatedReactionCounts: ReactionCountResource[] = message.reactionCounts.map(reaction => {\n    if (reaction.value === value) {\n      return {\n        ...reaction,\n        mine: state ? 1 : 0,\n        count: state ? reaction.count + 1 : reaction.count - 1,\n      } as ReactionCountResource\n    }\n    return reaction\n  })\n\n  const updatedMessage: MessageResource = {\n    ...message,\n    reactionCounts: updatedReactionCounts,\n  }\n\n  return updateRecordInPagesData({\n    data,\n    record: updatedMessage,\n  })\n}\n"]}
+{"version":3,"file":"use_message_reaction_toggle.js","sourceRoot":"","sources":["../../src/hooks/use_message_reaction_toggle.ts"],"names":[],"mappings":"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","sourcesContent":["import { InfiniteData, useMutation, useQueryClient } from '@tanstack/react-query'\nimport { useCallback } from 'react'\nimport { Alert } from 'react-native'\nimport { useApiClient } from './use_api_client'\nimport { getMessagesQueryKey, getMessagesRequestArgs } from '../utils/request/get_messages'\nimport { ApiCollection, ApiResource, MessageResource } from '../types'\nimport { ReactionCountResource } from '../types/resources/reaction'\nimport { updateRecordInPagesData, REACTION_EMOJIS } from '../utils'\n\nconst REACT = 1\nconst UNREACT = -1\n\ntype UseMessageReactionToggleProps = {\n  conversation_id: number\n  message: MessageResource\n  onSuccess?: () => void\n}\n\ntype ToggleReactionParams = {\n  value: ReactionCountResource['value']\n  mine: boolean\n}\n\ntype QueryData = InfiniteData<ApiCollection<MessageResource>>\n\nexport function useMessageReactionToggle({\n  conversation_id,\n  message,\n  onSuccess,\n}: UseMessageReactionToggleProps) {\n  const apiClient = useApiClient()\n  const queryClient = useQueryClient()\n  const queryKey = getMessagesQueryKey({ conversation_id })\n  const message_id = message.id\n\n  const toggleReaction = useCallback(\n    ({ value, mine }: ToggleReactionParams) => {\n      const requestParams = getMessagesRequestArgs({ conversation_id })\n\n      // If already reacted, unreact; otherwise react\n      const endpoint = mine ? 'unreact' : 'react'\n      const url = `/me/conversations/${conversation_id}/messages/${message_id}/${endpoint}`\n      const fieldsWithValueJoined = Object.fromEntries(\n        Object.entries(requestParams.data.fields).map(([k, v]) => [k, v.join(',')])\n      )\n\n      return apiClient.chat.post<ApiResource<MessageResource>>({\n        url,\n        data: {\n          ...requestParams.data,\n          data: {\n            type: 'Message',\n            attributes: { value: value },\n          },\n          fields: fieldsWithValueJoined,\n        },\n      })\n    },\n    [apiClient, conversation_id, message_id]\n  )\n\n  const { mutate: handleReactionToggle, isPending } = useMutation({\n    mutationFn: toggleReaction,\n    onMutate: variables => {\n      const previousData = queryClient.getQueryData<QueryData>(queryKey)\n      if (previousData) {\n        queryClient.setQueryData<QueryData>(queryKey, data =>\n          optimisticUpdate({\n            message,\n            data,\n            value: variables.value,\n            mine: variables.mine,\n          })\n        )\n      }\n      return { previousData }\n    },\n    onSuccess: result => {\n      const updatedMessage = result.data\n\n      queryClient.setQueryData<QueryData>(queryKey, data =>\n        updateRecordInPagesData({\n          data,\n          record: updatedMessage,\n        })\n      )\n\n      if (onSuccess) {\n        onSuccess()\n      }\n    },\n    onError: (_data, _variables, context) => {\n      if (context?.previousData) {\n        queryClient.setQueryData<QueryData>(queryKey, context.previousData)\n      }\n      Alert.alert('Oops', 'We were unable to react to this message. Please try again.')\n    },\n  })\n\n  return {\n    handleReactionToggle,\n    isPending,\n  }\n}\n\nconst optimisticUpdate = ({\n  message,\n  data,\n  value,\n  mine,\n}: {\n  message: MessageResource\n  data: QueryData | undefined\n  value: ReactionCountResource['value']\n  mine: boolean\n}) => {\n  if (!data) return data\n\n  const hasExistingReaction = message.reactionCounts.some(r => r.value === value)\n\n  let updatedReactionCounts: ReactionCountResource[]\n\n  if (hasExistingReaction) {\n    const delta = mine ? UNREACT : REACT\n    updatedReactionCounts = updateCount(message.reactionCounts, value, delta)\n  } else {\n    updatedReactionCounts = createCount(message.reactionCounts, value, message.id)\n  }\n\n  const updatedMessage: MessageResource = {\n    ...message,\n    reactionCounts: updatedReactionCounts,\n  }\n\n  return updateRecordInPagesData({\n    data,\n    record: updatedMessage,\n  })\n}\n\nconst updateCount = (\n  reactionCounts: ReactionCountResource[],\n  value: ReactionCountResource['value'],\n  delta: typeof REACT | typeof UNREACT\n): ReactionCountResource[] => {\n  return reactionCounts.map(reaction => {\n    if (reaction.value === value) {\n      return {\n        ...reaction,\n        mine: delta > 0 ? 1 : 0,\n        count: reaction.count + delta,\n      } as ReactionCountResource\n    }\n    return reaction\n  })\n}\n\nconst createCount = (\n  reactionCounts: ReactionCountResource[],\n  value: ReactionCountResource['value'],\n  messageId: string\n): ReactionCountResource[] => {\n  const reactionOrder = Object.keys(REACTION_EMOJIS) as ReactionCountResource['value'][]\n  const newReactionIndex = reactionOrder.indexOf(value)\n  const insertIndex = reactionCounts.findIndex(\n    r => reactionOrder.indexOf(r.value) > newReactionIndex\n  )\n\n  const newReaction: ReactionCountResource = {\n    type: 'ReactionCount',\n    id: `${messageId}/${value}`,\n    value,\n    count: 1,\n    mine: 1,\n    messageId,\n    authorIds: [],\n  }\n\n  return insertIndex === -1\n    ? [...reactionCounts, newReaction]\n    : [...reactionCounts.slice(0, insertIndex), newReaction, ...reactionCounts.slice(insertIndex)]\n}\n"]}

package/build/screens/message_actions_screen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"message_actions_screen.d.ts","sourceRoot":"","sources":["../../src/screens/message_actions_screen.tsx"],"names":[],"mappings":"AACA,OAAO,EAAgB,iBAAiB,EAAiB,MAAM,0BAA0B,CAAA;AAGzF,OAAO,KAAsB,MAAM,OAAO,CAAA;AAc1C,eAAO,MAAM,2BAA2B,uEAGtC,CAAA;AAEF,MAAM,MAAM,yBAAyB,GAAG,iBAAiB,CAAC;IACxD,UAAU,EAAE,MAAM,CAAA;IAClB,sBAAsB,CAAC,EAAE,MAAM,CAAA;IAC/B,eAAe,EAAE,MAAM,CAAA;IACvB,4BAA4B,CAAC,EAAE,OAAO,CAAA;IACtC,aAAa,CAAC,EAAE,OAAO,CAAA;CACxB,CAAC,CAAA;AAEF,wBAAgB,oBAAoB,CAAC,EAAE,KAAK,EAAE,EAAE,yBAAyB,4BA2BxE"}
+{"version":3,"file":"message_actions_screen.d.ts","sourceRoot":"","sources":["../../src/screens/message_actions_screen.tsx"],"names":[],"mappings":"AACA,OAAO,EAAgB,iBAAiB,EAAiB,MAAM,0BAA0B,CAAA;AAGzF,OAAO,KAAsB,MAAM,OAAO,CAAA;AAe1C,eAAO,MAAM,2BAA2B,uEAGtC,CAAA;AAEF,MAAM,MAAM,yBAAyB,GAAG,iBAAiB,CAAC;IACxD,UAAU,EAAE,MAAM,CAAA;IAClB,sBAAsB,CAAC,EAAE,MAAM,CAAA;IAC/B,eAAe,EAAE,MAAM,CAAA;IACvB,4BAA4B,CAAC,EAAE,OAAO,CAAA;IACtC,aAAa,CAAC,EAAE,OAAO,CAAA;CACxB,CAAC,CAAA;AAEF,wBAAgB,oBAAoB,CAAC,EAAE,KAAK,EAAE,EAAE,yBAAyB,4BA2BxE"}

package/build/screens/message_actions_screen.js

@@ -5,7 +5,8 @@ import { isNil, omitBy } from 'lodash';
 import React, { useCallback } from 'react';
 import { Alert, Platform, StyleSheet, View } from 'react-native';
 import { Text } from '../components';
-import { REACTION_EMOJIS, useReactionStyles } from '../components/conversation/message_reaction';
+import { useReactionStyles } from '../components/conversation/message_reaction';
+import { REACTION_EMOJIS } from '../utils';
 import FormSheet, { getFormSheetScreenOptions } from '../components/primitive/form_sheet';
 import { useCreateAndroidRippleColor, useFontScale, useTheme } from '../hooks';
 import { useApiClient } from '../hooks/use_api_client';
@@ -67,7 +68,6 @@ function MessageActionsScreenContent({ message, conversation_id, canDeleteNonAut
     const { handleReactionToggle, isPending } = useMessageReactionToggle({
         conversation_id,
         message,
-        onSuccess: () => navigation.goBack(),
     });
     const deleteMessage = useCallback(() => {
         const url = `/me/conversations/${conversation_id}/messages/${message.id}/`;
@@ -141,6 +141,7 @@ function MessageActionsScreenContent({ message, conversation_id, canDeleteNonAut
                     value: reaction.value,
                     mine: reaction.mine,
                 });
+                navigation.goBack();
             }}/>))}
       </View>
       <View style={styles.actions}>

package/build/screens/message_actions_screen.js.map

@@ -1 +1 @@
-{"version":3,"file":"message_actions_screen.js","sourceRoot":"","sources":["../../src/screens/message_actions_screen.tsx"],"names":[],"mappings":"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","sourcesContent":["import { PlatformPressable } from '@react-navigation/elements'\nimport { StackActions, StaticScreenProps, useNavigation } from '@react-navigation/native'\nimport { useMutation } from '@tanstack/react-query'\nimport { isNil, omitBy } from 'lodash'\nimport React, { useCallback } from 'react'\nimport { Alert, Platform, StyleSheet, View } from 'react-native'\nimport { Text } from '../components'\nimport { REACTION_EMOJIS, useReactionStyles } from '../components/conversation/message_reaction'\nimport FormSheet, { getFormSheetScreenOptions } from '../components/primitive/form_sheet'\nimport { useCreateAndroidRippleColor, useFontScale, useTheme } from '../hooks'\nimport { useApiClient } from '../hooks/use_api_client'\nimport { useConversationMessages } from '../hooks/use_conversation_messages'\nimport { useMessageReactionToggle } from '../hooks/use_message_reaction_toggle'\nimport { ReactionCountResource } from '../types/resources/reaction'\nimport { Clipboard, Haptic } from '../utils/native_adapters'\nimport { MessageResource } from '../types'\nimport { availableFeatures, useFeatures } from '../hooks/use_features'\n\nexport const MessageActionsScreenOptions = getFormSheetScreenOptions({\n  sheetAllowedDetents: [0.5],\n  headerTitle: 'Message actions',\n})\n\nexport type MessageActionsScreenProps = StaticScreenProps<{\n  message_id: string\n  reply_root_author_name?: string\n  conversation_id: number\n  canDeleteNonAuthoredMessages?: boolean\n  inReplyScreen?: boolean\n}>\n\nexport function MessageActionsScreen({ route }: MessageActionsScreenProps) {\n  const {\n    conversation_id,\n    message_id,\n    canDeleteNonAuthoredMessages,\n    inReplyScreen,\n    reply_root_author_name,\n  } = route.params\n\n  const { messages, refetch } = useConversationMessages(\n    { conversation_id },\n    { refetchOnMount: false }\n  )\n  const message = messages.find(m => m.id === message_id)\n\n  if (!message) return null\n\n  return (\n    <MessageActionsScreenContent\n      message={message}\n      conversation_id={conversation_id}\n      canDeleteNonAuthoredMessages={canDeleteNonAuthoredMessages || false}\n      refetchMessages={refetch}\n      inReplyScreen={inReplyScreen}\n      replyRootAuthorName={reply_root_author_name}\n    />\n  )\n}\n\nfunction MessageActionsScreenContent({\n  message,\n  conversation_id,\n  canDeleteNonAuthoredMessages,\n  refetchMessages,\n  inReplyScreen,\n  replyRootAuthorName,\n}: {\n  message: MessageResource\n  conversation_id: number\n  canDeleteNonAuthoredMessages: boolean\n  refetchMessages: () => void\n  inReplyScreen?: boolean\n  replyRootAuthorName?: string\n}) {\n  const navigation = useNavigation()\n  const apiClient = useApiClient()\n  const styles = useStyles()\n  const { featureEnabled } = useFeatures()\n  const repliesEnabled = featureEnabled(availableFeatures.threaded_replies)\n  const expandedLink = message.attachments.find(attachment => attachment.type === 'ExpandedLink')\n  const hasExpandedLink = !!expandedLink\n\n  const myReactions = message?.reactionCounts\n    .filter(reaction => reaction.mine)\n    .map(reaction => reaction.value)\n\n  const availableReactions = Object.entries(REACTION_EMOJIS).map(([value, emoji]) => {\n    return {\n      value: value as ReactionCountResource['value'],\n      emoji,\n      mine: myReactions?.includes(value as ReactionCountResource['value']),\n    }\n  })\n\n  const attachmentForCopy = (): string => {\n    const giphyTitleLink = message?.attachments.find(\n      attachment => attachment.type === 'giphy'\n    )?.titleLink\n\n    if (giphyTitleLink) return giphyTitleLink\n    return ''\n  }\n\n  const handleReplyPress = useCallback(() => {\n    navigation.goBack()\n    // Waits for the modal to be dismissed before pushing the reply screen\n    requestAnimationFrame(() => {\n      navigation.navigate('ConversationReply', {\n        conversation_id,\n        reply_root_id: message.replyRootId || message.id,\n        reply_root_author_name: replyRootAuthorName,\n      })\n    })\n  }, [navigation, conversation_id, message.id, message.replyRootId, replyRootAuthorName])\n\n  const handleCopyPress = () => {\n    Clipboard.setStringAsync(message?.text || attachmentForCopy() || '')\n    navigation.goBack()\n  }\n\n  const { handleReactionToggle, isPending } = useMessageReactionToggle({\n    conversation_id,\n    message,\n    onSuccess: () => navigation.goBack(),\n  })\n\n  const deleteMessage = useCallback(() => {\n    const url = `/me/conversations/${conversation_id}/messages/${message.id}/`\n\n    return apiClient.chat.delete({ url })\n  }, [apiClient, conversation_id, message.id])\n\n  const { mutate: handleDeleteMessage } = useMutation({\n    mutationFn: deleteMessage,\n    onSuccess: () => {\n      refetchMessages()\n      Haptic.notificationSuccess()\n      navigation.goBack()\n    },\n    onError: () => {\n      Alert.alert('Oops', 'We were unable to delete this message. Please try again.')\n    },\n  })\n\n  const handleDeleteConfirm = useCallback(() => {\n    Alert.alert('Delete message', 'Are you sure you want to permanently delete this message?', [\n      { text: 'Cancel', style: 'cancel' },\n      { text: 'Delete', style: 'destructive', onPress: () => handleDeleteMessage() },\n    ])\n  }, [handleDeleteMessage])\n\n  const handleEditPress = useCallback(() => {\n    const state = navigation.getState?.()\n    const targetRouteName = inReplyScreen ? 'ConversationReply' : 'Conversation'\n    const targetRoute = state?.routes?.find(r => r.name === targetRouteName)\n    const params = omitBy(\n      {\n        ...(targetRoute?.params || {}),\n        conversation_id,\n        editing_message_id: message.id,\n      },\n      isNil\n    )\n    navigation.dispatch(StackActions.popTo(targetRouteName, params))\n  }, [navigation, conversation_id, message.id, inReplyScreen])\n\n  const handleViewReadReceiptsPress = useCallback(() => {\n    Haptic.impactLight()\n    const params = omitBy(\n      {\n        conversation_id,\n        message_id: message.id,\n      },\n      isNil\n    )\n    navigation.dispatch(StackActions.popTo('MessageReadReceipts', params))\n  }, [navigation, conversation_id, message.id])\n\n  const removeLinkPreview = useCallback(() => {\n    const url = `/me/conversations/${conversation_id}/messages/${message.id}/remove_expanded_link`\n    const data = {\n      data: { type: 'ExpandedLink', attributes: { expanded_link_id: expandedLink?.id } },\n    }\n\n    return apiClient.chat.post({ url, data })\n  }, [apiClient, conversation_id, message.id, expandedLink])\n\n  const { mutate: handleRemoveLinkPreview } = useMutation({\n    mutationFn: removeLinkPreview,\n    onSuccess: () => {\n      refetchMessages()\n      Haptic.notificationSuccess()\n      navigation.goBack()\n    },\n    onError: () => {\n      Alert.alert('Oops', 'We were unable to remove the preview. Please try again.')\n    },\n  })\n\n  const handleRemoveLinkPreviewConfirm = useCallback(() => {\n    Alert.alert('Remove link preview?', 'This will remove the image preview but retain the link', [\n      { text: 'Cancel', style: 'cancel' },\n      { text: 'Remove', style: 'destructive', onPress: () => handleRemoveLinkPreview() },\n    ])\n  }, [handleRemoveLinkPreview])\n\n  return (\n    <FormSheet.Root style={styles.formSheetContent}>\n      <View style={styles.reactionList}>\n        {availableReactions.map((reaction, index) => (\n          <Reaction\n            key={index}\n            reaction={reaction}\n            onPress={() => {\n              Haptic.impactLight()\n              handleReactionToggle({\n                value: reaction.value,\n                mine: reaction.mine,\n              })\n            }}\n          />\n        ))}\n      </View>\n      <View style={styles.actions}>\n        {repliesEnabled && !inReplyScreen && (\n          <FormSheet.Action\n            onPress={handleReplyPress}\n            title=\"Reply to message\"\n            iconName=\"registrations.undo\"\n            accessibilityHint=\"Navigates to the reply screen\"\n            accessibilityRole=\"link\"\n          />\n        )}\n        <FormSheet.Action\n          onPress={handleCopyPress}\n          title=\"Copy text\"\n          iconName=\"services.fileCopy\"\n          accessibilityHint=\"Copies text and links to clipboard\"\n        />\n        {message?.mine && (\n          <FormSheet.Action\n            onPress={() => handleEditPress()}\n            title=\"Edit message\"\n            iconName=\"accounts.editor\"\n            accessibilityHint=\"Opens existing text in the message form input.\"\n          />\n        )}\n        {message?.mine && (\n          <FormSheet.Action\n            onPress={() => handleViewReadReceiptsPress()}\n            title=\"View read receipts\"\n            iconName=\"general.checkPerson\"\n            accessibilityHint=\"Opens a modal with a list of people who read your message.\"\n          />\n        )}\n        {message?.mine && hasExpandedLink && (\n          <FormSheet.Action\n            onPress={() => handleRemoveLinkPreviewConfirm()}\n            title=\"Remove link preview\"\n            iconName=\"general.brokenLink\"\n            accessibilityHint=\"Removes an expanded link preview from the message.\"\n          />\n        )}\n        {(message?.mine || canDeleteNonAuthoredMessages) && (\n          <FormSheet.Action\n            onPress={() => handleDeleteConfirm()}\n            title=\"Delete message\"\n            iconName=\"publishing.trash\"\n            appearance=\"danger\"\n            disabled={isPending}\n            accessibilityHint=\"Opens a confirmation alert to delete this message permanently.\"\n          />\n        )}\n      </View>\n    </FormSheet.Root>\n  )\n}\n\nconst Reaction = ({\n  reaction,\n  onPress,\n}: {\n  reaction: { value: ReactionCountResource['value']; emoji: string; mine: boolean | undefined }\n  onPress: () => void\n}) => {\n  const styles = useStyles()\n  const reactionStyles = useReactionStyles({ mine: reaction.mine ? 1 : 0 })\n\n  const { colors } = useTheme()\n  const baseRippleColor = reaction.mine ? colors.interaction : colors.fillColorNeutral060\n  const androidRippleColor = useCreateAndroidRippleColor({ color: baseRippleColor })\n\n  return (\n    <PlatformPressable\n      key={reaction.value}\n      style={[reactionStyles.reaction, styles.reaction]}\n      android_ripple={{ color: androidRippleColor, borderless: false, foreground: true }}\n      onPress={onPress}\n    >\n      <Text style={styles.reactionEmoji}>{REACTION_EMOJIS[reaction.value]}</Text>\n    </PlatformPressable>\n  )\n}\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n  const fontScale = useFontScale({ maxFontSizeMultiplier: 1.3 })\n\n  const btnBorderWidth = 1\n  const baseSize = 46 * fontScale\n  const reactionBtnSize = Platform.select({\n    ios: baseSize,\n    android: baseSize + btnBorderWidth * 2,\n  })\n\n  return StyleSheet.create({\n    formSheetContent: {\n      paddingTop: 16,\n    },\n    reactionList: {\n      flexDirection: 'row',\n      justifyContent: 'center',\n      alignItems: 'center',\n      gap: 16,\n      paddingTop: 8,\n      paddingBottom: 16,\n      borderBottomColor: colors.borderColorDefaultBase,\n      borderBottomWidth: 1,\n    },\n    reaction: {\n      height: reactionBtnSize,\n      width: reactionBtnSize,\n      borderWidth: btnBorderWidth,\n      borderRadius: 32,\n      justifyContent: 'center',\n      overflow: 'hidden',\n    },\n    reactionEmoji: {\n      fontSize: 24,\n    },\n    actions: {\n      paddingTop: 4,\n    },\n  })\n}\n"]}
+{"version":3,"file":"message_actions_screen.js","sourceRoot":"","sources":["../../src/screens/message_actions_screen.tsx"],"names":[],"mappings":"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","sourcesContent":["import { PlatformPressable } from '@react-navigation/elements'\nimport { StackActions, StaticScreenProps, useNavigation } from '@react-navigation/native'\nimport { useMutation } from '@tanstack/react-query'\nimport { isNil, omitBy } from 'lodash'\nimport React, { useCallback } from 'react'\nimport { Alert, Platform, StyleSheet, View } from 'react-native'\nimport { Text } from '../components'\nimport { useReactionStyles } from '../components/conversation/message_reaction'\nimport { REACTION_EMOJIS } from '../utils'\nimport FormSheet, { getFormSheetScreenOptions } from '../components/primitive/form_sheet'\nimport { useCreateAndroidRippleColor, useFontScale, useTheme } from '../hooks'\nimport { useApiClient } from '../hooks/use_api_client'\nimport { useConversationMessages } from '../hooks/use_conversation_messages'\nimport { useMessageReactionToggle } from '../hooks/use_message_reaction_toggle'\nimport { ReactionCountResource } from '../types/resources/reaction'\nimport { Clipboard, Haptic } from '../utils/native_adapters'\nimport { MessageResource } from '../types'\nimport { availableFeatures, useFeatures } from '../hooks/use_features'\n\nexport const MessageActionsScreenOptions = getFormSheetScreenOptions({\n  sheetAllowedDetents: [0.5],\n  headerTitle: 'Message actions',\n})\n\nexport type MessageActionsScreenProps = StaticScreenProps<{\n  message_id: string\n  reply_root_author_name?: string\n  conversation_id: number\n  canDeleteNonAuthoredMessages?: boolean\n  inReplyScreen?: boolean\n}>\n\nexport function MessageActionsScreen({ route }: MessageActionsScreenProps) {\n  const {\n    conversation_id,\n    message_id,\n    canDeleteNonAuthoredMessages,\n    inReplyScreen,\n    reply_root_author_name,\n  } = route.params\n\n  const { messages, refetch } = useConversationMessages(\n    { conversation_id },\n    { refetchOnMount: false }\n  )\n  const message = messages.find(m => m.id === message_id)\n\n  if (!message) return null\n\n  return (\n    <MessageActionsScreenContent\n      message={message}\n      conversation_id={conversation_id}\n      canDeleteNonAuthoredMessages={canDeleteNonAuthoredMessages || false}\n      refetchMessages={refetch}\n      inReplyScreen={inReplyScreen}\n      replyRootAuthorName={reply_root_author_name}\n    />\n  )\n}\n\nfunction MessageActionsScreenContent({\n  message,\n  conversation_id,\n  canDeleteNonAuthoredMessages,\n  refetchMessages,\n  inReplyScreen,\n  replyRootAuthorName,\n}: {\n  message: MessageResource\n  conversation_id: number\n  canDeleteNonAuthoredMessages: boolean\n  refetchMessages: () => void\n  inReplyScreen?: boolean\n  replyRootAuthorName?: string\n}) {\n  const navigation = useNavigation()\n  const apiClient = useApiClient()\n  const styles = useStyles()\n  const { featureEnabled } = useFeatures()\n  const repliesEnabled = featureEnabled(availableFeatures.threaded_replies)\n  const expandedLink = message.attachments.find(attachment => attachment.type === 'ExpandedLink')\n  const hasExpandedLink = !!expandedLink\n\n  const myReactions = message?.reactionCounts\n    .filter(reaction => reaction.mine)\n    .map(reaction => reaction.value)\n\n  const availableReactions = Object.entries(REACTION_EMOJIS).map(([value, emoji]) => {\n    return {\n      value: value as ReactionCountResource['value'],\n      emoji,\n      mine: myReactions?.includes(value as ReactionCountResource['value']),\n    }\n  })\n\n  const attachmentForCopy = (): string => {\n    const giphyTitleLink = message?.attachments.find(\n      attachment => attachment.type === 'giphy'\n    )?.titleLink\n\n    if (giphyTitleLink) return giphyTitleLink\n    return ''\n  }\n\n  const handleReplyPress = useCallback(() => {\n    navigation.goBack()\n    // Waits for the modal to be dismissed before pushing the reply screen\n    requestAnimationFrame(() => {\n      navigation.navigate('ConversationReply', {\n        conversation_id,\n        reply_root_id: message.replyRootId || message.id,\n        reply_root_author_name: replyRootAuthorName,\n      })\n    })\n  }, [navigation, conversation_id, message.id, message.replyRootId, replyRootAuthorName])\n\n  const handleCopyPress = () => {\n    Clipboard.setStringAsync(message?.text || attachmentForCopy() || '')\n    navigation.goBack()\n  }\n\n  const { handleReactionToggle, isPending } = useMessageReactionToggle({\n    conversation_id,\n    message,\n  })\n\n  const deleteMessage = useCallback(() => {\n    const url = `/me/conversations/${conversation_id}/messages/${message.id}/`\n\n    return apiClient.chat.delete({ url })\n  }, [apiClient, conversation_id, message.id])\n\n  const { mutate: handleDeleteMessage } = useMutation({\n    mutationFn: deleteMessage,\n    onSuccess: () => {\n      refetchMessages()\n      Haptic.notificationSuccess()\n      navigation.goBack()\n    },\n    onError: () => {\n      Alert.alert('Oops', 'We were unable to delete this message. Please try again.')\n    },\n  })\n\n  const handleDeleteConfirm = useCallback(() => {\n    Alert.alert('Delete message', 'Are you sure you want to permanently delete this message?', [\n      { text: 'Cancel', style: 'cancel' },\n      { text: 'Delete', style: 'destructive', onPress: () => handleDeleteMessage() },\n    ])\n  }, [handleDeleteMessage])\n\n  const handleEditPress = useCallback(() => {\n    const state = navigation.getState?.()\n    const targetRouteName = inReplyScreen ? 'ConversationReply' : 'Conversation'\n    const targetRoute = state?.routes?.find(r => r.name === targetRouteName)\n    const params = omitBy(\n      {\n        ...(targetRoute?.params || {}),\n        conversation_id,\n        editing_message_id: message.id,\n      },\n      isNil\n    )\n    navigation.dispatch(StackActions.popTo(targetRouteName, params))\n  }, [navigation, conversation_id, message.id, inReplyScreen])\n\n  const handleViewReadReceiptsPress = useCallback(() => {\n    Haptic.impactLight()\n    const params = omitBy(\n      {\n        conversation_id,\n        message_id: message.id,\n      },\n      isNil\n    )\n    navigation.dispatch(StackActions.popTo('MessageReadReceipts', params))\n  }, [navigation, conversation_id, message.id])\n\n  const removeLinkPreview = useCallback(() => {\n    const url = `/me/conversations/${conversation_id}/messages/${message.id}/remove_expanded_link`\n    const data = {\n      data: { type: 'ExpandedLink', attributes: { expanded_link_id: expandedLink?.id } },\n    }\n\n    return apiClient.chat.post({ url, data })\n  }, [apiClient, conversation_id, message.id, expandedLink])\n\n  const { mutate: handleRemoveLinkPreview } = useMutation({\n    mutationFn: removeLinkPreview,\n    onSuccess: () => {\n      refetchMessages()\n      Haptic.notificationSuccess()\n      navigation.goBack()\n    },\n    onError: () => {\n      Alert.alert('Oops', 'We were unable to remove the preview. Please try again.')\n    },\n  })\n\n  const handleRemoveLinkPreviewConfirm = useCallback(() => {\n    Alert.alert('Remove link preview?', 'This will remove the image preview but retain the link', [\n      { text: 'Cancel', style: 'cancel' },\n      { text: 'Remove', style: 'destructive', onPress: () => handleRemoveLinkPreview() },\n    ])\n  }, [handleRemoveLinkPreview])\n\n  return (\n    <FormSheet.Root style={styles.formSheetContent}>\n      <View style={styles.reactionList}>\n        {availableReactions.map((reaction, index) => (\n          <Reaction\n            key={index}\n            reaction={reaction}\n            onPress={() => {\n              Haptic.impactLight()\n              handleReactionToggle({\n                value: reaction.value,\n                mine: reaction.mine,\n              })\n              navigation.goBack()\n            }}\n          />\n        ))}\n      </View>\n      <View style={styles.actions}>\n        {repliesEnabled && !inReplyScreen && (\n          <FormSheet.Action\n            onPress={handleReplyPress}\n            title=\"Reply to message\"\n            iconName=\"registrations.undo\"\n            accessibilityHint=\"Navigates to the reply screen\"\n            accessibilityRole=\"link\"\n          />\n        )}\n        <FormSheet.Action\n          onPress={handleCopyPress}\n          title=\"Copy text\"\n          iconName=\"services.fileCopy\"\n          accessibilityHint=\"Copies text and links to clipboard\"\n        />\n        {message?.mine && (\n          <FormSheet.Action\n            onPress={() => handleEditPress()}\n            title=\"Edit message\"\n            iconName=\"accounts.editor\"\n            accessibilityHint=\"Opens existing text in the message form input.\"\n          />\n        )}\n        {message?.mine && (\n          <FormSheet.Action\n            onPress={() => handleViewReadReceiptsPress()}\n            title=\"View read receipts\"\n            iconName=\"general.checkPerson\"\n            accessibilityHint=\"Opens a modal with a list of people who read your message.\"\n          />\n        )}\n        {message?.mine && hasExpandedLink && (\n          <FormSheet.Action\n            onPress={() => handleRemoveLinkPreviewConfirm()}\n            title=\"Remove link preview\"\n            iconName=\"general.brokenLink\"\n            accessibilityHint=\"Removes an expanded link preview from the message.\"\n          />\n        )}\n        {(message?.mine || canDeleteNonAuthoredMessages) && (\n          <FormSheet.Action\n            onPress={() => handleDeleteConfirm()}\n            title=\"Delete message\"\n            iconName=\"publishing.trash\"\n            appearance=\"danger\"\n            disabled={isPending}\n            accessibilityHint=\"Opens a confirmation alert to delete this message permanently.\"\n          />\n        )}\n      </View>\n    </FormSheet.Root>\n  )\n}\n\nconst Reaction = ({\n  reaction,\n  onPress,\n}: {\n  reaction: { value: ReactionCountResource['value']; emoji: string; mine: boolean | undefined }\n  onPress: () => void\n}) => {\n  const styles = useStyles()\n  const reactionStyles = useReactionStyles({ mine: reaction.mine ? 1 : 0 })\n\n  const { colors } = useTheme()\n  const baseRippleColor = reaction.mine ? colors.interaction : colors.fillColorNeutral060\n  const androidRippleColor = useCreateAndroidRippleColor({ color: baseRippleColor })\n\n  return (\n    <PlatformPressable\n      key={reaction.value}\n      style={[reactionStyles.reaction, styles.reaction]}\n      android_ripple={{ color: androidRippleColor, borderless: false, foreground: true }}\n      onPress={onPress}\n    >\n      <Text style={styles.reactionEmoji}>{REACTION_EMOJIS[reaction.value]}</Text>\n    </PlatformPressable>\n  )\n}\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n  const fontScale = useFontScale({ maxFontSizeMultiplier: 1.3 })\n\n  const btnBorderWidth = 1\n  const baseSize = 46 * fontScale\n  const reactionBtnSize = Platform.select({\n    ios: baseSize,\n    android: baseSize + btnBorderWidth * 2,\n  })\n\n  return StyleSheet.create({\n    formSheetContent: {\n      paddingTop: 16,\n    },\n    reactionList: {\n      flexDirection: 'row',\n      justifyContent: 'center',\n      alignItems: 'center',\n      gap: 16,\n      paddingTop: 8,\n      paddingBottom: 16,\n      borderBottomColor: colors.borderColorDefaultBase,\n      borderBottomWidth: 1,\n    },\n    reaction: {\n      height: reactionBtnSize,\n      width: reactionBtnSize,\n      borderWidth: btnBorderWidth,\n      borderRadius: 32,\n      justifyContent: 'center',\n      overflow: 'hidden',\n    },\n    reactionEmoji: {\n      fontSize: 24,\n    },\n    actions: {\n      paddingTop: 4,\n    },\n  })\n}\n"]}

package/build/screens/reactions_screen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"reactions_screen.d.ts","sourceRoot":"","sources":["../../src/screens/reactions_screen.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAA;AAC5D,OAAO,KAAe,MAAM,OAAO,CAAA;AAenC,eAAO,MAAM,sBAAsB,uEAMjC,CAAA;AAEF,MAAM,MAAM,mBAAmB,GAAG,iBAAiB,CAAC;IAClD,UAAU,EAAE,MAAM,CAAA;IAClB,eAAe,EAAE,MAAM,CAAA;IACvB,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB,CAAC,CAAA;AAEF,wBAAgB,eAAe,CAAC,EAAE,KAAK,EAAE,EAAE,mBAAmB,qBAkE7D"}
+{"version":3,"file":"reactions_screen.d.ts","sourceRoot":"","sources":["../../src/screens/reactions_screen.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAA;AAC5D,OAAO,KAAe,MAAM,OAAO,CAAA;AAcnC,eAAO,MAAM,sBAAsB,uEAMjC,CAAA;AAEF,MAAM,MAAM,mBAAmB,GAAG,iBAAiB,CAAC;IAClD,UAAU,EAAE,MAAM,CAAA;IAClB,eAAe,EAAE,MAAM,CAAA;IACvB,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB,CAAC,CAAA;AAEF,wBAAgB,eAAe,CAAC,EAAE,KAAK,EAAE,EAAE,mBAAmB,qBAkE7D"}

package/build/screens/reactions_screen.js

@@ -3,13 +3,12 @@ import { Platform, StyleSheet, View } from 'react-native';
 import { FlatList } from 'react-native-gesture-handler';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { Avatar, Text } from '../components';
-import { REACTION_EMOJIS } from '../components/conversation/message_reaction';
 import { Tabs } from '../components/display/tabs';
 import FormSheet, { getFormSheetScreenOptions } from '../components/primitive/form_sheet';
 import { useSuspenseGet, useTheme } from '../hooks';
 import { useConversationMessages } from '../hooks/use_conversation_messages';
 import { useFontScale } from '../hooks/use_font_scale';
-import { platformFontWeightMedium } from '../utils';
+import { platformFontWeightMedium, REACTION_EMOJIS } from '../utils';
 export const ReactionsScreenOptions = getFormSheetScreenOptions({
     sheetAllowedDetents: Platform.select({
         android: [0.5, 0.94], // Going straight to full 0.94 preserves height of screen on Android

package/build/screens/reactions_screen.js.map

@@ -1 +1 @@
-{"version":3,"file":"reactions_screen.js","sourceRoot":"","sources":["../../src/screens/reactions_screen.tsx"],"names":[],"mappings":"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","sourcesContent":["import { StaticScreenProps } from '@react-navigation/native'\nimport React, { memo } from 'react'\nimport { Platform, StyleSheet, View } from 'react-native'\nimport { FlatList } from 'react-native-gesture-handler'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { Avatar, Text } from '../components'\nimport { REACTION_EMOJIS } from '../components/conversation/message_reaction'\nimport { Tabs } from '../components/display/tabs'\nimport FormSheet, { getFormSheetScreenOptions } from '../components/primitive/form_sheet'\nimport { useSuspenseGet, useTheme } from '../hooks'\nimport { useConversationMessages } from '../hooks/use_conversation_messages'\nimport { useFontScale } from '../hooks/use_font_scale'\nimport { MemberResource } from '../types'\nimport { ReactionCountResource } from '../types/resources/reaction'\nimport { platformFontWeightMedium } from '../utils'\n\nexport const ReactionsScreenOptions = getFormSheetScreenOptions({\n  sheetAllowedDetents: Platform.select({\n    android: [0.5, 0.94], // Going straight to full 0.94 preserves height of screen on Android\n    default: [0.5, 1],\n  }),\n  headerTitle: 'Reactions',\n})\n\nexport type ReactionScreenProps = StaticScreenProps<{\n  message_id: string\n  conversation_id: number\n  reaction_value?: string\n}>\n\nexport function ReactionsScreen({ route }: ReactionScreenProps) {\n  const { conversation_id, message_id, reaction_value } = route.params\n  const styles = useStyles()\n\n  const { messages } = useConversationMessages({ conversation_id }, { refetchOnMount: false })\n\n  const message = messages.find(m => m.id === message_id)\n  const reactionCounts = message?.reactionCounts || []\n  const initialReactionCount =\n    reactionCounts.find(r => r.value === reaction_value) || reactionCounts[0]\n  const [reactionCountValue, setReactionCountValue] = React.useState<\n    ReactionCountResource['value']\n  >(initialReactionCount?.value)\n  const reactionCount = reactionCounts.find(r => r.value === reactionCountValue)\n\n  // Get author IDs for the API call, ensuring we have a valid array\n  const authorIds = reactionCount?.authorIds || []\n\n  const { data: members } = useSuspenseGet<MemberResource[]>({\n    url: `/me/conversations/${conversation_id}/members`,\n    data: {\n      fields: {\n        Member: ['id', 'name', 'avatar', 'badges', 'child', 'role'],\n      },\n      where: {\n        id: authorIds,\n      },\n      limit: authorIds.length,\n    },\n  })\n\n  if (!reactionCount) {\n    return (\n      <View style={styles.errorContainer}>\n        <Text>No reactions found for this message.</Text>\n      </View>\n    )\n  }\n\n  const authors = members.filter(member => authorIds.includes(member.id))\n\n  return (\n    <FormSheet.Root contentStyle={styles.formSheetContent}>\n      <Tabs\n        data={reactionCounts}\n        activeTab={reactionCount}\n        onTabPress={item => {\n          setReactionCountValue(item.value)\n        }}\n        renderItem={({ item }) => (\n          <Reaction\n            active={reactionCount.id === item.id}\n            reaction={item}\n            onPress={() => setReactionCountValue(item.value)}\n          />\n        )}\n        style={styles.actions}\n      />\n      <FlatList\n        data={authors}\n        contentContainerStyle={styles.contentContainer}\n        keyExtractor={item => item.id.toString()}\n        renderItem={({ item: author }) => <Author author={author} key={author.id} />}\n      />\n    </FormSheet.Root>\n  )\n}\n\nconst Reaction = ({\n  reaction,\n}: {\n  active: boolean\n  reaction: ReactionCountResource\n  onPress: () => void\n}) => {\n  const styles = useStyles()\n\n  return (\n    <View key={reaction.value} style={styles.reaction}>\n      <Text style={styles.reactionContent}>{REACTION_EMOJIS[reaction.value]}</Text>\n      <Text style={styles.reactionContent}>{reaction.count}</Text>\n    </View>\n  )\n}\n\ntype AuthorProps = Pick<MemberResource, 'id' | 'name' | 'avatar'>\n\nconst Author = memo(({ author }: { author: AuthorProps }) => {\n  const styles = useStyles()\n\n  return (\n    <View style={styles.authorRow}>\n      <Avatar sourceUri={author.avatar} size=\"sm\" />\n      <Text variant=\"tertiary\" numberOfLines={2} style={styles.authorName}>\n        {author.name}\n      </Text>\n    </View>\n  )\n})\n\nconst TABS_HEIGHT = 67\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n  const { bottom } = useSafeAreaInsets()\n  const fontScale = useFontScale({ maxFontSizeMultiplier: 1.3 })\n\n  return StyleSheet.create({\n    formSheetContent: {\n      paddingTop: 16,\n    },\n    contentContainer: {\n      paddingTop: 8,\n      paddingBottom: bottom + Platform.select({ android: 24, default: TABS_HEIGHT + 24 }),\n    },\n    authorRow: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 8,\n      paddingVertical: 8,\n      paddingHorizontal: 16,\n      flex: 1,\n    },\n    authorName: {\n      flex: 1,\n    },\n    reaction: {\n      paddingHorizontal: 8,\n      paddingVertical: 16,\n      flexDirection: 'row',\n      gap: 4,\n    },\n    reactionContent: {\n      fontSize: 18,\n      fontWeight: platformFontWeightMedium,\n    },\n    actions: {\n      minHeight: 68 * fontScale,\n      borderBottomColor: colors.borderColorDefaultBase,\n      borderBottomWidth: 1,\n    },\n    errorContainer: {\n      flex: 1,\n      justifyContent: 'center',\n      alignItems: 'center',\n      padding: 16,\n      marginTop: 30,\n    },\n  })\n}\n"]}
+{"version":3,"file":"reactions_screen.js","sourceRoot":"","sources":["../../src/screens/reactions_screen.tsx"],"names":[],"mappings":"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","sourcesContent":["import { StaticScreenProps } from '@react-navigation/native'\nimport React, { memo } from 'react'\nimport { Platform, StyleSheet, View } from 'react-native'\nimport { FlatList } from 'react-native-gesture-handler'\nimport { useSafeAreaInsets } from 'react-native-safe-area-context'\nimport { Avatar, Text } from '../components'\nimport { Tabs } from '../components/display/tabs'\nimport FormSheet, { getFormSheetScreenOptions } from '../components/primitive/form_sheet'\nimport { useSuspenseGet, useTheme } from '../hooks'\nimport { useConversationMessages } from '../hooks/use_conversation_messages'\nimport { useFontScale } from '../hooks/use_font_scale'\nimport { MemberResource } from '../types'\nimport { ReactionCountResource } from '../types/resources/reaction'\nimport { platformFontWeightMedium, REACTION_EMOJIS } from '../utils'\n\nexport const ReactionsScreenOptions = getFormSheetScreenOptions({\n  sheetAllowedDetents: Platform.select({\n    android: [0.5, 0.94], // Going straight to full 0.94 preserves height of screen on Android\n    default: [0.5, 1],\n  }),\n  headerTitle: 'Reactions',\n})\n\nexport type ReactionScreenProps = StaticScreenProps<{\n  message_id: string\n  conversation_id: number\n  reaction_value?: string\n}>\n\nexport function ReactionsScreen({ route }: ReactionScreenProps) {\n  const { conversation_id, message_id, reaction_value } = route.params\n  const styles = useStyles()\n\n  const { messages } = useConversationMessages({ conversation_id }, { refetchOnMount: false })\n\n  const message = messages.find(m => m.id === message_id)\n  const reactionCounts = message?.reactionCounts || []\n  const initialReactionCount =\n    reactionCounts.find(r => r.value === reaction_value) || reactionCounts[0]\n  const [reactionCountValue, setReactionCountValue] = React.useState<\n    ReactionCountResource['value']\n  >(initialReactionCount?.value)\n  const reactionCount = reactionCounts.find(r => r.value === reactionCountValue)\n\n  // Get author IDs for the API call, ensuring we have a valid array\n  const authorIds = reactionCount?.authorIds || []\n\n  const { data: members } = useSuspenseGet<MemberResource[]>({\n    url: `/me/conversations/${conversation_id}/members`,\n    data: {\n      fields: {\n        Member: ['id', 'name', 'avatar', 'badges', 'child', 'role'],\n      },\n      where: {\n        id: authorIds,\n      },\n      limit: authorIds.length,\n    },\n  })\n\n  if (!reactionCount) {\n    return (\n      <View style={styles.errorContainer}>\n        <Text>No reactions found for this message.</Text>\n      </View>\n    )\n  }\n\n  const authors = members.filter(member => authorIds.includes(member.id))\n\n  return (\n    <FormSheet.Root contentStyle={styles.formSheetContent}>\n      <Tabs\n        data={reactionCounts}\n        activeTab={reactionCount}\n        onTabPress={item => {\n          setReactionCountValue(item.value)\n        }}\n        renderItem={({ item }) => (\n          <Reaction\n            active={reactionCount.id === item.id}\n            reaction={item}\n            onPress={() => setReactionCountValue(item.value)}\n          />\n        )}\n        style={styles.actions}\n      />\n      <FlatList\n        data={authors}\n        contentContainerStyle={styles.contentContainer}\n        keyExtractor={item => item.id.toString()}\n        renderItem={({ item: author }) => <Author author={author} key={author.id} />}\n      />\n    </FormSheet.Root>\n  )\n}\n\nconst Reaction = ({\n  reaction,\n}: {\n  active: boolean\n  reaction: ReactionCountResource\n  onPress: () => void\n}) => {\n  const styles = useStyles()\n\n  return (\n    <View key={reaction.value} style={styles.reaction}>\n      <Text style={styles.reactionContent}>{REACTION_EMOJIS[reaction.value]}</Text>\n      <Text style={styles.reactionContent}>{reaction.count}</Text>\n    </View>\n  )\n}\n\ntype AuthorProps = Pick<MemberResource, 'id' | 'name' | 'avatar'>\n\nconst Author = memo(({ author }: { author: AuthorProps }) => {\n  const styles = useStyles()\n\n  return (\n    <View style={styles.authorRow}>\n      <Avatar sourceUri={author.avatar} size=\"sm\" />\n      <Text variant=\"tertiary\" numberOfLines={2} style={styles.authorName}>\n        {author.name}\n      </Text>\n    </View>\n  )\n})\n\nconst TABS_HEIGHT = 67\n\nconst useStyles = () => {\n  const { colors } = useTheme()\n  const { bottom } = useSafeAreaInsets()\n  const fontScale = useFontScale({ maxFontSizeMultiplier: 1.3 })\n\n  return StyleSheet.create({\n    formSheetContent: {\n      paddingTop: 16,\n    },\n    contentContainer: {\n      paddingTop: 8,\n      paddingBottom: bottom + Platform.select({ android: 24, default: TABS_HEIGHT + 24 }),\n    },\n    authorRow: {\n      flexDirection: 'row',\n      alignItems: 'center',\n      gap: 8,\n      paddingVertical: 8,\n      paddingHorizontal: 16,\n      flex: 1,\n    },\n    authorName: {\n      flex: 1,\n    },\n    reaction: {\n      paddingHorizontal: 8,\n      paddingVertical: 16,\n      flexDirection: 'row',\n      gap: 4,\n    },\n    reactionContent: {\n      fontSize: 18,\n      fontWeight: platformFontWeightMedium,\n    },\n    actions: {\n      minHeight: 68 * fontScale,\n      borderBottomColor: colors.borderColorDefaultBase,\n      borderBottomWidth: 1,\n    },\n    errorContainer: {\n      flex: 1,\n      justifyContent: 'center',\n      alignItems: 'center',\n      padding: 16,\n      marginTop: 30,\n    },\n  })\n}\n"]}

package/build/utils/index.d.ts

@@ -6,6 +6,7 @@ export * from './uri';
 export * from './cache';
 export * from './native_adapters';
 export * from './pluralize';
+export * from './reaction_constants';
 export * from './destructure_chat_group_graph_id';
 export * from './convert_attachments_for_create';
 export * from './assert_keys_are_numbers';

package/build/utils/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAA;AACzB,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,UAAU,CAAA;AACxB,cAAc,OAAO,CAAA;AACrB,cAAc,SAAS,CAAA;AACvB,cAAc,mBAAmB,CAAA;AACjC,cAAc,aAAa,CAAA;AAC3B,cAAc,mCAAmC,CAAA;AACjD,cAAc,kCAAkC,CAAA;AAChD,cAAc,2BAA2B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAA;AACzB,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,UAAU,CAAA;AACxB,cAAc,OAAO,CAAA;AACrB,cAAc,SAAS,CAAA;AACvB,cAAc,mBAAmB,CAAA;AACjC,cAAc,aAAa,CAAA;AAC3B,cAAc,sBAAsB,CAAA;AACpC,cAAc,mCAAmC,CAAA;AACjD,cAAc,kCAAkC,CAAA;AAChD,cAAc,2BAA2B,CAAA"}

package/build/utils/index.js

@@ -6,6 +6,7 @@ export * from './uri';
 export * from './cache';
 export * from './native_adapters';
 export * from './pluralize';
+export * from './reaction_constants';
 export * from './destructure_chat_group_graph_id';
 export * from './convert_attachments_for_create';
 export * from './assert_keys_are_numbers';

package/build/utils/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAA;AACzB,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,UAAU,CAAA;AACxB,cAAc,OAAO,CAAA;AACrB,cAAc,SAAS,CAAA;AACvB,cAAc,mBAAmB,CAAA;AACjC,cAAc,aAAa,CAAA;AAC3B,cAAc,mCAAmC,CAAA;AACjD,cAAc,kCAAkC,CAAA;AAChD,cAAc,2BAA2B,CAAA","sourcesContent":["export * from './session'\nexport * from './theme'\nexport * from './styles'\nexport * from './client'\nexport * from './uri'\nexport * from './cache'\nexport * from './native_adapters'\nexport * from './pluralize'\nexport * from './destructure_chat_group_graph_id'\nexport * from './convert_attachments_for_create'\nexport * from './assert_keys_are_numbers'\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAA;AACzB,cAAc,SAAS,CAAA;AACvB,cAAc,UAAU,CAAA;AACxB,cAAc,UAAU,CAAA;AACxB,cAAc,OAAO,CAAA;AACrB,cAAc,SAAS,CAAA;AACvB,cAAc,mBAAmB,CAAA;AACjC,cAAc,aAAa,CAAA;AAC3B,cAAc,sBAAsB,CAAA;AACpC,cAAc,mCAAmC,CAAA;AACjD,cAAc,kCAAkC,CAAA;AAChD,cAAc,2BAA2B,CAAA","sourcesContent":["export * from './session'\nexport * from './theme'\nexport * from './styles'\nexport * from './client'\nexport * from './uri'\nexport * from './cache'\nexport * from './native_adapters'\nexport * from './pluralize'\nexport * from './reaction_constants'\nexport * from './destructure_chat_group_graph_id'\nexport * from './convert_attachments_for_create'\nexport * from './assert_keys_are_numbers'\n"]}

package/build/utils/reaction_constants.d.ts

@@ -0,0 +1,3 @@
+import { ReactionCountResource } from '../types/resources/reaction';
+export declare const REACTION_EMOJIS: Record<ReactionCountResource['value'], string>;
+//# sourceMappingURL=reaction_constants.d.ts.map

package/build/utils/reaction_constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"reaction_constants.d.ts","sourceRoot":"","sources":["../../src/utils/reaction_constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAA;AAEnE,eAAO,MAAM,eAAe,EAAE,MAAM,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,MAAM,CAM1E,CAAA"}

package/build/utils/reaction_constants.js

@@ -0,0 +1,8 @@
+export const REACTION_EMOJIS = {
+    thumbs_up: '👍',
+    thumbs_down: '👎',
+    pray: '🙏',
+    laugh: '😂',
+    heart: '❤️',
+};
+//# sourceMappingURL=reaction_constants.js.map

package/build/utils/reaction_constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"reaction_constants.js","sourceRoot":"","sources":["../../src/utils/reaction_constants.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,eAAe,GAAmD;IAC7E,SAAS,EAAE,IAAI;IACf,WAAW,EAAE,IAAI;IACjB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,IAAI;IACX,KAAK,EAAE,IAAI;CACZ,CAAA","sourcesContent":["import { ReactionCountResource } from '../types/resources/reaction'\n\nexport const REACTION_EMOJIS: Record<ReactionCountResource['value'], string> = {\n  thumbs_up: '👍',\n  thumbs_down: '👎',\n  pray: '🙏',\n  laugh: '😂',\n  heart: '❤️',\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@planningcenter/chat-react-native",
-  "version": "3.20.2-rc.0",
+  "version": "3.21.0-rc.0",
   "description": "",
   "main": "build/index.js",
   "types": "build/index.d.ts",
@@ -58,5 +58,5 @@
     "react-native-url-polyfill": "^2.0.0",
     "typescript": "<5.6.0"
   },
-  "gitHead": "135ec414d226780bfe86298ef206fe5f8dce1bc2"
+  "gitHead": "78e8e4b690f9d4a95091569e22ea6c06a5c6efa1"
 }

package/src/components/conversation/message_reaction.tsx

@@ -9,14 +9,7 @@ import { ReactionCountResource } from '../../types/resources/reaction'
 import { MessageResource } from '../../types'
 import { useCreateAndroidRippleColor } from '../../hooks/use_create_android_ripple_color'
 import { Haptic } from '../../utils/native_adapters'
-
-export const REACTION_EMOJIS: Record<ReactionCountResource['value'], string> = {
-  thumbs_up: '👍',
-  thumbs_down: '👎',
-  pray: '🙏',
-  laugh: '😂',
-  heart: '❤️',
-}
+import { REACTION_EMOJIS } from '../../utils'
 
 export function MessageReaction({
   reaction,

package/src/hooks/use_message_reaction_toggle.ts

@@ -5,7 +5,10 @@ import { useApiClient } from './use_api_client'
 import { getMessagesQueryKey, getMessagesRequestArgs } from '../utils/request/get_messages'
 import { ApiCollection, ApiResource, MessageResource } from '../types'
 import { ReactionCountResource } from '../types/resources/reaction'
-import { updateRecordInPagesData } from '../utils'
+import { updateRecordInPagesData, REACTION_EMOJIS } from '../utils'
+
+const REACT = 1
+const UNREACT = -1
 
 type UseMessageReactionToggleProps = {
   conversation_id: number
@@ -15,7 +18,7 @@ type UseMessageReactionToggleProps = {
 
 type ToggleReactionParams = {
   value: ReactionCountResource['value']
-  mine?: boolean
+  mine: boolean
 }
 
 type QueryData = InfiniteData<ApiCollection<MessageResource>>
@@ -35,7 +38,7 @@ export function useMessageReactionToggle({
       const requestParams = getMessagesRequestArgs({ conversation_id })
 
       // If already reacted, unreact; otherwise react
-      const endpoint = !mine ? 'react' : 'unreact'
+      const endpoint = mine ? 'unreact' : 'react'
       const url = `/me/conversations/${conversation_id}/messages/${message_id}/${endpoint}`
       const fieldsWithValueJoined = Object.fromEntries(
         Object.entries(requestParams.data.fields).map(([k, v]) => [k, v.join(',')])
@@ -66,7 +69,7 @@ export function useMessageReactionToggle({
             message,
             data,
             value: variables.value,
-            state: !variables.mine,
+            mine: variables.mine,
           })
         )
       }
@@ -104,25 +107,25 @@ const optimisticUpdate = ({
   message,
   data,
   value,
-  state,
+  mine,
 }: {
   message: MessageResource
   data: QueryData | undefined
   value: ReactionCountResource['value']
-  state: boolean
+  mine: boolean
 }) => {
   if (!data) return data
 
-  const updatedReactionCounts: ReactionCountResource[] = message.reactionCounts.map(reaction => {
-    if (reaction.value === value) {
-      return {
-        ...reaction,
-        mine: state ? 1 : 0,
-        count: state ? reaction.count + 1 : reaction.count - 1,
-      } as ReactionCountResource
-    }
-    return reaction
-  })
+  const hasExistingReaction = message.reactionCounts.some(r => r.value === value)
+
+  let updatedReactionCounts: ReactionCountResource[]
+
+  if (hasExistingReaction) {
+    const delta = mine ? UNREACT : REACT
+    updatedReactionCounts = updateCount(message.reactionCounts, value, delta)
+  } else {
+    updatedReactionCounts = createCount(message.reactionCounts, value, message.id)
+  }
 
   const updatedMessage: MessageResource = {
     ...message,
@@ -134,3 +137,46 @@ const optimisticUpdate = ({
     record: updatedMessage,
   })
 }
+
+const updateCount = (
+  reactionCounts: ReactionCountResource[],
+  value: ReactionCountResource['value'],
+  delta: typeof REACT | typeof UNREACT
+): ReactionCountResource[] => {
+  return reactionCounts.map(reaction => {
+    if (reaction.value === value) {
+      return {
+        ...reaction,
+        mine: delta > 0 ? 1 : 0,
+        count: reaction.count + delta,
+      } as ReactionCountResource
+    }
+    return reaction
+  })
+}
+
+const createCount = (
+  reactionCounts: ReactionCountResource[],
+  value: ReactionCountResource['value'],
+  messageId: string
+): ReactionCountResource[] => {
+  const reactionOrder = Object.keys(REACTION_EMOJIS) as ReactionCountResource['value'][]
+  const newReactionIndex = reactionOrder.indexOf(value)
+  const insertIndex = reactionCounts.findIndex(
+    r => reactionOrder.indexOf(r.value) > newReactionIndex
+  )
+
+  const newReaction: ReactionCountResource = {
+    type: 'ReactionCount',
+    id: `${messageId}/${value}`,
+    value,
+    count: 1,
+    mine: 1,
+    messageId,
+    authorIds: [],
+  }
+
+  return insertIndex === -1
+    ? [...reactionCounts, newReaction]
+    : [...reactionCounts.slice(0, insertIndex), newReaction, ...reactionCounts.slice(insertIndex)]
+}

package/src/screens/message_actions_screen.tsx

@@ -5,7 +5,8 @@ import { isNil, omitBy } from 'lodash'
 import React, { useCallback } from 'react'
 import { Alert, Platform, StyleSheet, View } from 'react-native'
 import { Text } from '../components'
-import { REACTION_EMOJIS, useReactionStyles } from '../components/conversation/message_reaction'
+import { useReactionStyles } from '../components/conversation/message_reaction'
+import { REACTION_EMOJIS } from '../utils'
 import FormSheet, { getFormSheetScreenOptions } from '../components/primitive/form_sheet'
 import { useCreateAndroidRippleColor, useFontScale, useTheme } from '../hooks'
 import { useApiClient } from '../hooks/use_api_client'
@@ -122,7 +123,6 @@ function MessageActionsScreenContent({
   const { handleReactionToggle, isPending } = useMessageReactionToggle({
     conversation_id,
     message,
-    onSuccess: () => navigation.goBack(),
   })
 
   const deleteMessage = useCallback(() => {
@@ -218,6 +218,7 @@ function MessageActionsScreenContent({
                 value: reaction.value,
                 mine: reaction.mine,
               })
+              navigation.goBack()
             }}
           />
         ))}

package/src/screens/reactions_screen.tsx

@@ -4,7 +4,6 @@ import { Platform, StyleSheet, View } from 'react-native'
 import { FlatList } from 'react-native-gesture-handler'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
 import { Avatar, Text } from '../components'
-import { REACTION_EMOJIS } from '../components/conversation/message_reaction'
 import { Tabs } from '../components/display/tabs'
 import FormSheet, { getFormSheetScreenOptions } from '../components/primitive/form_sheet'
 import { useSuspenseGet, useTheme } from '../hooks'
@@ -12,7 +11,7 @@ import { useConversationMessages } from '../hooks/use_conversation_messages'
 import { useFontScale } from '../hooks/use_font_scale'
 import { MemberResource } from '../types'
 import { ReactionCountResource } from '../types/resources/reaction'
-import { platformFontWeightMedium } from '../utils'
+import { platformFontWeightMedium, REACTION_EMOJIS } from '../utils'
 
 export const ReactionsScreenOptions = getFormSheetScreenOptions({
   sheetAllowedDetents: Platform.select({

package/src/utils/index.ts

@@ -6,6 +6,7 @@ export * from './uri'
 export * from './cache'
 export * from './native_adapters'
 export * from './pluralize'
+export * from './reaction_constants'
 export * from './destructure_chat_group_graph_id'
 export * from './convert_attachments_for_create'
 export * from './assert_keys_are_numbers'

package/src/utils/reaction_constants.ts

@@ -0,0 +1,9 @@
+import { ReactionCountResource } from '../types/resources/reaction'
+
+export const REACTION_EMOJIS: Record<ReactionCountResource['value'], string> = {
+  thumbs_up: '👍',
+  thumbs_down: '👎',
+  pray: '🙏',
+  laugh: '😂',
+  heart: '❤️',
+}