diff --git a/src/ROUTES.ts b/src/ROUTES.ts
index b98717b51f5d..761386c32960 100644
--- a/src/ROUTES.ts
+++ b/src/ROUTES.ts
@@ -2131,7 +2131,12 @@ const ROUTES = {
},
DEBUG_REPORT_ACTION: {
route: 'debug/report/:reportID/actions/:reportActionID',
- getRoute: (reportID: string, reportActionID: string) => `debug/report/${reportID}/actions/${reportActionID}` as const,
+ getRoute: (reportID: string | undefined, reportActionID: string) => {
+ if (!reportID) {
+ Log.warn('Invalid reportID is used to build the DEBUG_REPORT_ACTION route');
+ }
+ return `debug/report/${reportID}/actions/${reportActionID}` as const;
+ },
},
DEBUG_REPORT_ACTION_CREATE: {
route: 'debug/report/:reportID/actions/create',
diff --git a/src/pages/Debug/Report/DebugReportActions.tsx b/src/pages/Debug/Report/DebugReportActions.tsx
index fdc2aa8b1ca8..e86befd81217 100644
--- a/src/pages/Debug/Report/DebugReportActions.tsx
+++ b/src/pages/Debug/Report/DebugReportActions.tsx
@@ -1,14 +1,17 @@
-import React from 'react';
+import React, {useCallback, useMemo} from 'react';
import {useOnyx} from 'react-native-onyx';
import Button from '@components/Button';
-import {PressableWithFeedback} from '@components/Pressable';
import ScrollView from '@components/ScrollView';
-import Text from '@components/Text';
+import SelectionList from '@components/SelectionList';
+import RadioListItem from '@components/SelectionList/RadioListItem';
+import useDebouncedState from '@hooks/useDebouncedState';
import useLocalize from '@hooks/useLocalize';
import useThemeStyles from '@hooks/useThemeStyles';
import Navigation from '@libs/Navigation/Navigation';
-import * as ReportActionsUtils from '@libs/ReportActionsUtils';
-import * as ReportUtils from '@libs/ReportUtils';
+import Parser from '@libs/Parser';
+import {getOriginalMessage, getReportActionMessage, getReportActionMessageText, getSortedReportActionsForDisplay, isCreatedAction} from '@libs/ReportActionsUtils';
+import {canUserPerformWriteAction, formatReportLastMessageText} from '@libs/ReportUtils';
+import SidebarUtils from '@libs/SidebarUtils';
import ONYXKEYS from '@src/ONYXKEYS';
import ROUTES from '@src/ROUTES';
import type {ReportAction} from '@src/types/onyx';
@@ -20,38 +23,72 @@ type DebugReportActionsProps = {
function DebugReportActions({reportID}: DebugReportActionsProps) {
const {translate, datetimeToCalendarTime} = useLocalize();
const styles = useThemeStyles();
+ const [searchValue, debouncedSearchValue, setSearchValue] = useDebouncedState('');
const [report] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${reportID}`);
- const canUserPerformWriteAction = ReportUtils.canUserPerformWriteAction(report);
+ const [policy] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY}${report?.policyID}`);
+ const ifUserCanPerformWriteAction = canUserPerformWriteAction(report);
const [sortedAllReportActions] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`, {
canEvict: false,
- selector: (allReportActions) => ReportActionsUtils.getSortedReportActionsForDisplay(allReportActions, canUserPerformWriteAction, true),
+ selector: (allReportActions) => getSortedReportActionsForDisplay(allReportActions, ifUserCanPerformWriteAction, true),
});
- const renderItem = (item: ReportAction, index: number) => (
- Navigation.navigate(ROUTES.DEBUG_REPORT_ACTION.getRoute(reportID, item.reportActionID))}
- style={({pressed}) => [styles.flexRow, styles.justifyContentBetween, pressed && styles.hoveredComponentBG, styles.p4]}
- hoverStyle={styles.hoveredComponentBG}
- key={index}
- >
- {item.reportActionID}
- {datetimeToCalendarTime(item.created, false, false)}
-
+ const getReportActionDebugText = useCallback(
+ (reportAction: ReportAction) => {
+ const reportActionMessage = getReportActionMessage(reportAction);
+ const originalMessage = getOriginalMessage(reportAction);
+
+ if (!reportActionMessage) {
+ return '';
+ }
+
+ if (!!reportActionMessage.deleted || (originalMessage && 'deleted' in originalMessage && originalMessage.deleted)) {
+ return `[${translate('parentReportAction.deletedMessage')}]`;
+ }
+
+ if (isCreatedAction(reportAction)) {
+ return formatReportLastMessageText(SidebarUtils.getWelcomeMessage(report, policy).messageText ?? translate('report.noActivityYet'));
+ }
+
+ if (reportActionMessage.html) {
+ return Parser.htmlToText(reportActionMessage.html.replace(/\s*<\/mention-user>/gi, ''));
+ }
+
+ return getReportActionMessageText(reportAction);
+ },
+ [translate, policy, report],
);
+ const searchedReportActions = useMemo(() => {
+ return (sortedAllReportActions ?? [])
+ .filter(
+ (reportAction) =>
+ reportAction.reportActionID.includes(debouncedSearchValue) || getReportActionMessageText(reportAction).toLowerCase().includes(debouncedSearchValue.toLowerCase()),
+ )
+ .map((reportAction) => ({
+ reportActionID: reportAction.reportActionID,
+ text: getReportActionDebugText(reportAction),
+ alternateText: `${reportAction.reportActionID} | ${datetimeToCalendarTime(reportAction.created, false, false)}`,
+ }));
+ }, [sortedAllReportActions, debouncedSearchValue, getReportActionDebugText, datetimeToCalendarTime]);
+
return (
-
+
);
}
diff --git a/src/pages/home/report/ContextMenu/ContextMenuActions.tsx b/src/pages/home/report/ContextMenu/ContextMenuActions.tsx
index c71bcf45e828..bfe766db3ee1 100644
--- a/src/pages/home/report/ContextMenu/ContextMenuActions.tsx
+++ b/src/pages/home/report/ContextMenu/ContextMenuActions.tsx
@@ -739,9 +739,13 @@ const ContextMenuActions: ContextMenuAction[] = [
isAnonymousAction: true,
textTranslateKey: 'debug.debug',
icon: Expensicons.Bug,
- shouldShow: ({type, user}) => type === CONST.CONTEXT_MENU_TYPES.REPORT && !!user?.isDebugModeEnabled,
- onPress: (closePopover, {reportID}) => {
- Navigation.navigate(ROUTES.DEBUG_REPORT.getRoute(reportID));
+ shouldShow: ({type, user}) => [CONST.CONTEXT_MENU_TYPES.REPORT_ACTION, CONST.CONTEXT_MENU_TYPES.REPORT].some((value) => value === type) && !!user?.isDebugModeEnabled,
+ onPress: (closePopover, {reportID, reportAction}) => {
+ if (reportAction) {
+ Navigation.navigate(ROUTES.DEBUG_REPORT_ACTION.getRoute(reportID, reportAction.reportActionID));
+ } else {
+ Navigation.navigate(ROUTES.DEBUG_REPORT.getRoute(reportID));
+ }
hideContextMenu(false, ReportActionComposeFocusManager.focus);
},
getDescription: () => {},