Merge pull request #23777 from dukenv0307/fix/23424

Parent Message of thread chat on LHN doesn't updated when the parent message is updated
Expensify · Jul 31, 2023 · 3324ea7 · 3324ea7
2 parents d7bcaf8 + a0df9fe
commit 3324ea7
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 2 deletions.
diff --git a/src/components/LHNOptionsList/OptionRowLHNData.js b/src/components/LHNOptionsList/OptionRowLHNData.js
@@ -14,6 +14,7 @@ import * as Report from '../../libs/actions/Report';
 import * as UserUtils from '../../libs/UserUtils';
 import participantPropTypes from '../participantPropTypes';
 import CONST from '../../CONST';
+import reportActionPropTypes from '../../pages/home/report/reportActionPropTypes';
 
 const propTypes = {
     /** If true will disable ever setting the OptionRowLHN to focused */
@@ -41,6 +42,9 @@ const propTypes = {
         }),
     ),
 
+    /** The actions from the parent report */
+    parentReportActions: PropTypes.objectOf(PropTypes.shape(reportActionPropTypes)),
+
     ...withCurrentReportIDPropTypes,
     ...basePropTypes,
 };
@@ -50,6 +54,7 @@ const defaultProps = {
     personalDetails: {},
     fullReport: {},
     policies: {},
+    parentReportActions: {},
     preferredLocale: CONST.LOCALES.DEFAULT,
     ...withCurrentReportIDDefaultProps,
     ...baseDefaultProps,
@@ -61,14 +66,16 @@ const defaultProps = {
  * The OptionRowLHN component is memoized, so it will only
  * re-render if the data really changed.
  */
-function OptionRowLHNData({shouldDisableFocusOptions, currentReportID, fullReport, personalDetails, preferredLocale, comment, policies, ...propsToForward}) {
+function OptionRowLHNData({shouldDisableFocusOptions, currentReportID, fullReport, personalDetails, preferredLocale, comment, policies, parentReportActions, ...propsToForward}) {
     const reportID = propsToForward.reportID;
     // We only want to pass a boolean to the memoized component,
     // instead of a changing number (so we prevent unnecessary re-renders).
     const isFocused = !shouldDisableFocusOptions && currentReportID === reportID;
 
     const policy = lodashGet(policies, [`${ONYXKEYS.COLLECTION.POLICY}${fullReport.policyID}`], '');
 
+    const parentReportAction = parentReportActions[fullReport.parentReportActionID];
+
     const optionItemRef = useRef();
     const optionItem = useMemo(() => {
         // Note: ideally we'd have this as a dependent selector in onyx!
@@ -78,7 +85,9 @@ function OptionRowLHNData({shouldDisableFocusOptions, currentReportID, fullRepor
         }
         optionItemRef.current = item;
         return item;
-    }, [fullReport, personalDetails, preferredLocale, policy]);
+        // Listen parentReportAction to update title of thread report when parentReportAction changed
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [fullReport, personalDetails, preferredLocale, policy, parentReportAction]);
 
     useEffect(() => {
         if (!optionItem || optionItem.hasDraftComment || !comment || comment.length <= 0 || isFocused) {
@@ -156,5 +165,11 @@ export default React.memo(
                 key: ONYXKEYS.COLLECTION.POLICY,
             },
         }),
+        withOnyx({
+            parentReportActions: {
+                key: ({fullReport}) => `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${fullReport.parentReportID}`,
+                canEvict: false,
+            },
+        }),
     )(OptionRowLHNData),
 );
diff --git a/tests/unit/SidebarFilterTest.js b/tests/unit/SidebarFilterTest.js
@@ -29,6 +29,7 @@ describe('Sidebar', () => {
         Onyx.init({
             keys: ONYXKEYS,
             registerStorageEventListener: () => {},
+            safeEvictionKeys: [ONYXKEYS.COLLECTION.REPORT_ACTIONS],
         }),
     );
 

diff --git a/tests/unit/SidebarOrderTest.js b/tests/unit/SidebarOrderTest.js
@@ -29,6 +29,7 @@ describe('Sidebar', () => {
         Onyx.init({
             keys: ONYXKEYS,
             registerStorageEventListener: () => {},
+            safeEvictionKeys: [ONYXKEYS.COLLECTION.REPORT_ACTIONS],
         }),
     );
 

diff --git a/tests/unit/SidebarTest.js b/tests/unit/SidebarTest.js
@@ -28,6 +28,7 @@ describe('Sidebar', () => {
         Onyx.init({
             keys: ONYXKEYS,
             registerStorageEventListener: () => {},
+            safeEvictionKeys: [ONYXKEYS.COLLECTION.REPORT_ACTIONS],
         }),
     );