Skip to content

Commit dfca25a

Browse files
LukasModclaude
andcommitted
refactor: ReportActionItemEmojiReactions, self-subscribe to emojiReactions
Replace the emojiReactions prop with a direct useOnyx subscription on REPORT_ACTIONS_REACTIONS. Use the shared getEmptyObject<ReportActionReactions>() helper for the stable empty default (matches BaseQuickEmojiReactions / MiniQuickEmojiReactions). Clean up the full prop chain: - PureReportActionItem no longer takes/forwards emojiReactions; its memo loses the deepEqual(emojiReactions) entry. - The isOnSearch ? {} override is replaced with an !isOnSearch mount gate in the parent, so on search we skip the mount (and the subscription) entirely. - ReportActionItem, ReportActionsListItemRenderer, DuplicateTransactionItem and ReportActionItemParentAction drop the prop and the now-unused useOnyx calls / selectors that only existed to source it. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
1 parent 8c85120 commit dfca25a

6 files changed

Lines changed: 6 additions & 43 deletions

File tree

src/components/Reactions/ReportActionItemEmojiReactions.tsx

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import sortBy from 'lodash/sortBy';
22
import React, {useContext, useRef} from 'react';
33
import {InteractionManager, View} from 'react-native';
4-
import type {OnyxEntry} from 'react-native-onyx';
54
import type {Emoji} from '@assets/emojis/types';
65
import OfflineWithFeedback from '@components/OfflineWithFeedback';
76
import Tooltip from '@components/Tooltip/PopoverAnchorTooltip';
@@ -19,14 +18,12 @@ import CONST from '@src/CONST';
1918
import ONYXKEYS from '@src/ONYXKEYS';
2019
import type {ReportAction, ReportActionReactions} from '@src/types/onyx';
2120
import type {PendingAction} from '@src/types/onyx/OnyxCommon';
21+
import {getEmptyObject} from '@src/types/utils/EmptyObject';
2222
import AddReactionBubble from './AddReactionBubble';
2323
import EmojiReactionBubble from './EmojiReactionBubble';
2424
import ReactionTooltipContent from './ReactionTooltipContent';
2525

2626
type ReportActionItemEmojiReactionsProps = {
27-
/** All the emoji reactions for the report action. */
28-
emojiReactions: OnyxEntry<ReportActionReactions>;
29-
3027
/** The report action that these reactions are for */
3128
reportAction: ReportAction;
3229

@@ -73,7 +70,7 @@ type FormattedReaction = {
7370
setIsEmojiPickerActive?: (state: boolean) => void;
7471
};
7572

76-
function ReportActionItemEmojiReactions({reportAction, reportID, emojiReactions = {}, shouldBlockReactions = false, setIsEmojiPickerActive}: ReportActionItemEmojiReactionsProps) {
73+
function ReportActionItemEmojiReactions({reportAction, reportID, shouldBlockReactions = false, setIsEmojiPickerActive}: ReportActionItemEmojiReactionsProps) {
7774
const styles = useThemeStyles();
7875
const {preferredLocale} = useLocalize();
7976
const currentUserPersonalDetails = useCurrentUserPersonalDetails();
@@ -82,6 +79,7 @@ function ReportActionItemEmojiReactions({reportAction, reportID, emojiReactions
8279
const [preferredSkinTone = CONST.EMOJI_DEFAULT_SKIN_TONE] = useOnyx(ONYXKEYS.PREFERRED_EMOJI_SKIN_TONE);
8380

8481
const reportActionID = reportAction.reportActionID;
82+
const [emojiReactions = getEmptyObject<ReportActionReactions>()] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS_REACTIONS}${reportActionID}`);
8583

8684
const toggleReaction = (emoji: Emoji, skinTone: number, ignoreSkinToneOnCompare?: boolean) => {
8785
if (isAnonymousUser()) {

src/pages/TransactionDuplicate/DuplicateTransactionItem.tsx

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -45,8 +45,6 @@ function DuplicateTransactionItem({transaction, index, onPreviewPressed}: Duplic
4545

4646
const [draftMessage] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS_DRAFTS}${originalReportID}`);
4747

48-
const [emojiReactions] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS_REACTIONS}${action?.reportActionID}`);
49-
5048
const [linkedTransactionRouteError] = useOnyx(
5149
`${ONYXKEYS.COLLECTION.TRANSACTION}${getNonEmptyStringOnyxID(isMoneyRequestAction(action) ? getOriginalMessage(action)?.IOUTransactionID : undefined)}`,
5250
{
@@ -81,7 +79,6 @@ function DuplicateTransactionItem({transaction, index, onPreviewPressed}: Duplic
8179
isUserValidated={isUserValidated}
8280
personalDetails={personalDetails}
8381
draftMessage={matchingDraftMessage}
84-
emojiReactions={emojiReactions}
8582
linkedTransactionRouteError={linkedTransactionRouteError}
8683
userBillingFundID={userBillingFundID}
8784
isTryNewDotNVPDismissed={isTryNewDotNVPDismissed}

src/pages/inbox/report/PureReportActionItem.tsx

Lines changed: 1 addition & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -239,9 +239,6 @@ type PureReportActionItemProps = {
239239
/** The iou report associated with the linked report, if any */
240240
iouReportOfLinkedReport: OnyxEntry<OnyxTypes.Report>;
241241

242-
/** All the emoji reactions for the report action. */
243-
emojiReactions?: OnyxTypes.ReportActionReactions;
244-
245242
/** Linked transaction route error */
246243
linkedTransactionRouteError?: Errors;
247244

@@ -368,7 +365,6 @@ function PureReportActionItem({
368365
taskReport,
369366
linkedReport,
370367
iouReportOfLinkedReport,
371-
emojiReactions,
372368
linkedTransactionRouteError,
373369
cardList,
374370
isUserValidated,
@@ -1131,12 +1127,11 @@ function PureReportActionItem({
11311127
<LinkPreviewer linkMetadata={action.linkMetadata?.filter((item) => !isEmptyObject(item))} />
11321128
</View>
11331129
)}
1134-
{!isMessageDeleted(action) && (
1130+
{!isMessageDeleted(action) && !isOnSearch && (
11351131
<View style={draftMessageRightAlign}>
11361132
<ReportActionItemEmojiReactions
11371133
reportAction={action}
11381134
reportID={reportID}
1139-
emojiReactions={isOnSearch ? {} : emojiReactions}
11401135
shouldBlockReactions={hasErrors}
11411136
setIsEmojiPickerActive={setIsEmojiPickerActive}
11421137
/>
@@ -1453,7 +1448,6 @@ export default memo(PureReportActionItem, (prevProps, nextProps) => {
14531448
deepEqual(prevParentReportAction, nextParentReportAction) &&
14541449
prevProps.draftMessage === nextProps.draftMessage &&
14551450
prevProps.iouReport?.reportID === nextProps.iouReport?.reportID &&
1456-
deepEqual(prevProps.emojiReactions, nextProps.emojiReactions) &&
14571451
deepEqual(prevProps.linkedTransactionRouteError, nextProps.linkedTransactionRouteError) &&
14581452
prevProps.isUserValidated === nextProps.isUserValidated &&
14591453
prevProps.parentReport?.reportID === nextProps.parentReport?.reportID &&

src/pages/inbox/report/ReportActionItem.tsx

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ import {clearAllRelatedReportActionErrors} from '@userActions/ClearReportActionE
1919
import {deleteReportActionDraft, resolveActionableMentionWhisper, resolveActionableReportMentionWhisper} from '@userActions/Report';
2020
import {clearError} from '@userActions/Transaction';
2121
import ONYXKEYS from '@src/ONYXKEYS';
22-
import type {PersonalDetailsList, ReportActionReactions, Transaction} from '@src/types/onyx';
22+
import type {PersonalDetailsList, Transaction} from '@src/types/onyx';
2323
import type {PureReportActionItemProps} from './PureReportActionItem';
2424
import PureReportActionItem from './PureReportActionItem';
2525

@@ -30,9 +30,6 @@ type ReportActionItemProps = Omit<PureReportActionItemProps, 'taskReport' | 'lin
3030
/** Draft message for the report action */
3131
draftMessage?: string;
3232

33-
/** Emoji reactions for the report action */
34-
emojiReactions?: OnyxEntry<ReportActionReactions>;
35-
3633
/** User wallet tierName */
3734
userWalletTierName: string | undefined;
3835

@@ -53,7 +50,6 @@ function ReportActionItem({
5350
action,
5451
report,
5552
draftMessage,
56-
emojiReactions,
5753
userWalletTierName,
5854
isUserValidated,
5955
personalDetails,
@@ -115,7 +111,6 @@ function ReportActionItem({
115111
cardList={cardList}
116112
linkedReport={linkedReport}
117113
iouReportOfLinkedReport={iouReportOfLinkedReport}
118-
emojiReactions={emojiReactions}
119114
linkedTransactionRouteError={linkedTransactionRouteError}
120115
isUserValidated={isUserValidated}
121116
parentReport={parentReport}

src/pages/inbox/report/ReportActionItemParentAction.tsx

Lines changed: 1 addition & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ import {
2222
} from '@libs/ReportUtils';
2323
import {navigateToConciergeChatAndDeleteReport} from '@userActions/Report';
2424
import ONYXKEYS from '@src/ONYXKEYS';
25-
import type {PersonalDetailsList, Report, ReportAction, ReportActionReactions, ReportActions, ReportActionsDrafts, ReportNameValuePairs, Transaction} from '@src/types/onyx';
25+
import type {PersonalDetailsList, Report, ReportAction, ReportActions, ReportActionsDrafts, ReportNameValuePairs, Transaction} from '@src/types/onyx';
2626
import AnimatedEmptyStateBackground from './AnimatedEmptyStateBackground';
2727
import RepliesDivider from './RepliesDivider';
2828
import ReportActionItem from './ReportActionItem';
@@ -171,23 +171,6 @@ function ReportActionItemParentAction({
171171

172172
const [ancestorDraftMessages] = useOnyx(ONYXKEYS.COLLECTION.REPORT_ACTIONS_DRAFTS, {selector: ancestorDraftSelector}, [ancestors, ancestorsReportActions]);
173173

174-
const ancestorReactionSelector = useCallback(
175-
(allReactions: OnyxCollection<ReportActionReactions>) => {
176-
if (!allReactions) {
177-
return {};
178-
}
179-
const result: OnyxCollection<ReportActionReactions> = {};
180-
for (const ancestor of ancestors) {
181-
const key = `${ONYXKEYS.COLLECTION.REPORT_ACTIONS_REACTIONS}${ancestor.reportAction.reportActionID}`;
182-
result[key] = allReactions[key];
183-
}
184-
return result;
185-
},
186-
[ancestors],
187-
);
188-
189-
const [ancestorReactions] = useOnyx(ONYXKEYS.COLLECTION.REPORT_ACTIONS_REACTIONS, {selector: ancestorReactionSelector}, [ancestors]);
190-
191174
const [conciergeReportID] = useOnyx(ONYXKEYS.CONCIERGE_REPORT_ID);
192175
const [introSelected] = useOnyx(ONYXKEYS.NVP_INTRO_SELECTED);
193176
const [isSelfTourViewed] = useOnyx(ONYXKEYS.NVP_ONBOARDING, {selector: hasSeenTourSelector});
@@ -217,7 +200,6 @@ function ReportActionItemParentAction({
217200
const reportDraftMessages = originalReportID ? ancestorDraftMessages?.[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS_DRAFTS}${originalReportID}`] : undefined;
218201
const matchingDraftMessage = reportDraftMessages?.[ancestorReportAction.reportActionID];
219202
const matchingDraftMessageString = matchingDraftMessage?.message;
220-
const actionEmojiReactions = ancestorReactions?.[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS_REACTIONS}${ancestorReportAction.reportActionID}`];
221203

222204
return (
223205
<OfflineWithFeedback
@@ -256,7 +238,6 @@ function ReportActionItemParentAction({
256238
isUserValidated={isUserValidated}
257239
personalDetails={personalDetails}
258240
draftMessage={matchingDraftMessageString}
259-
emojiReactions={actionEmojiReactions}
260241
linkedTransactionRouteError={linkedTransactionRouteError}
261242
userBillingFundID={userBillingFundID}
262243
isTryNewDotNVPDismissed={isTryNewDotNVPDismissed}

src/pages/inbox/report/ReportActionsListItemRenderer.tsx

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -106,7 +106,6 @@ function ReportActionsListItemRenderer({
106106
}: ReportActionsListItemRendererProps) {
107107
const originalMessage = useMemo(() => getOriginalMessage(reportAction), [reportAction]);
108108

109-
const [emojiReactions] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS_REACTIONS}${reportAction.reportActionID}`);
110109
const [reportDraftMessages] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS_DRAFTS}${originalReportID}`);
111110
const draftMessage = reportDraftMessages?.[reportAction.reportActionID]?.message;
112111

@@ -225,7 +224,6 @@ function ReportActionsListItemRenderer({
225224
isUserValidated={isUserValidated}
226225
personalDetails={personalDetails}
227226
draftMessage={draftMessage}
228-
emojiReactions={emojiReactions}
229227
userBillingFundID={userBillingFundID}
230228
isTryNewDotNVPDismissed={isTryNewDotNVPDismissed}
231229
reportNameValuePairsOrigin={reportNameValuePairsOrigin}

0 commit comments

Comments
 (0)