From b7aa133bef232952390360db17af4d8a4fe4fbb4 Mon Sep 17 00:00:00 2001 From: Adam Grzybowski Date: Mon, 17 Jul 2023 19:10:33 +0200 Subject: [PATCH 1/4] remove withNavigationFocus from the report screen --- src/pages/home/ReportScreen.js | 25 ++++++++++---------- src/pages/home/report/ReportActionCompose.js | 2 +- src/pages/home/report/ReportFooter.js | 1 + 3 files changed, 14 insertions(+), 14 deletions(-) diff --git a/src/pages/home/ReportScreen.js b/src/pages/home/ReportScreen.js index 1facc3e49b55..fe1e0f2cea56 100644 --- a/src/pages/home/ReportScreen.js +++ b/src/pages/home/ReportScreen.js @@ -31,12 +31,10 @@ import FullPageNotFoundView from '../../components/BlockingViews/FullPageNotFoun import withViewportOffsetTop, {viewportOffsetTopPropTypes} from '../../components/withViewportOffsetTop'; import * as ReportActionsUtils from '../../libs/ReportActionsUtils'; import personalDetailsPropType from '../personalDetailsPropType'; -import withNavigationFocus from '../../components/withNavigationFocus'; import getIsReportFullyVisible from '../../libs/getIsReportFullyVisible'; import * as EmojiPickerAction from '../../libs/actions/EmojiPickerAction'; import MoneyRequestHeader from '../../components/MoneyRequestHeader'; import MoneyReportHeader from '../../components/MoneyReportHeader'; -import withNavigation, {withNavigationPropTypes} from '../../components/withNavigation'; import * as ComposerActions from '../../libs/actions/Composer'; import ReportScreenContext from './ReportScreenContext'; import TaskHeaderActionButton from '../../components/TaskHeaderActionButton'; @@ -88,7 +86,6 @@ const propTypes = { ...windowDimensionsPropTypes, ...viewportOffsetTopPropTypes, - ...withNavigationPropTypes, }; const defaultProps = { @@ -140,13 +137,18 @@ class ReportScreen extends React.Component { this.flatListRef = React.createRef(); this.reactionListRef = React.createRef(); + + // We need unique ID for drag and drop to work properly with stack navigator. + this.dragAndDropId = CONST.REPORT.DROP_NATIVE_ID + ReportUtils.generateReportID(); } componentDidMount() { this.unsubscribeVisibilityListener = Visibility.onVisibilityChange(() => { + const isTopMostReportId = Navigation.getTopmostReportId() === getReportID(this.props.route) + // If the report is not fully visible (AKA on small screen devices and LHR is open) or the report is optimistic (AKA not yet created) // we don't need to call openReport - if (!getIsReportFullyVisible(this.props.isFocused) || this.props.report.isOptimisticReport) { + if (!getIsReportFullyVisible(isTopMostReportId) || this.props.report.isOptimisticReport) { return; } @@ -210,11 +212,6 @@ class ReportScreen extends React.Component { Report.addComment(getReportID(this.props.route), text); } - getNavigationKey() { - const navigation = this.props.navigation.getState(); - return lodashGet(navigation.routes, [navigation.index, 'key']); - } - /** * When false the ReportActionsView will completely unmount and we will show a loader until it returns true. * @@ -273,6 +270,8 @@ class ReportScreen extends React.Component { const policy = this.props.policies[`${ONYXKEYS.COLLECTION.POLICY}${this.props.report.policyID}`]; + const isTopMostReportId = Navigation.getTopmostReportId() === getReportID(this.props.route) + let headerView = ( )} { // Rounding this value for comparison because they can look like this: 411.9999694824219 @@ -396,6 +395,7 @@ class ReportScreen extends React.Component { isComposerFullSize={this.props.isComposerFullSize} onSubmitComment={this.onSubmitComment} policies={this.props.policies} + dragAndDropId={this.dragAndDropId} /> )} @@ -404,6 +404,7 @@ class ReportScreen extends React.Component { )} @@ -423,8 +424,6 @@ export default compose( withViewportOffsetTop, withLocalize, withWindowDimensions, - withNavigationFocus, - withNavigation, withNetwork(), withOnyx({ isSidebarLoaded: { diff --git a/src/pages/home/report/ReportActionCompose.js b/src/pages/home/report/ReportActionCompose.js index 1a96b2a6fac6..086d665e6038 100644 --- a/src/pages/home/report/ReportActionCompose.js +++ b/src/pages/home/report/ReportActionCompose.js @@ -1113,7 +1113,7 @@ class ReportActionCompose extends React.Component { { this.setState({isDraggingOver: true}); diff --git a/src/pages/home/report/ReportFooter.js b/src/pages/home/report/ReportFooter.js index c03e47dd531e..fa74357cb081 100644 --- a/src/pages/home/report/ReportFooter.js +++ b/src/pages/home/report/ReportFooter.js @@ -92,6 +92,7 @@ function ReportFooter(props) { pendingAction={props.pendingAction} isComposerFullSize={props.isComposerFullSize} disabled={props.shouldDisableCompose} + dragAndDropId={props.dragAndDropId} /> From 46627096249868b9e810d1e01cdc060ec96774d8 Mon Sep 17 00:00:00 2001 From: Adam Grzybowski Date: Tue, 18 Jul 2023 11:48:58 +0200 Subject: [PATCH 2/4] fix prettier errors --- src/pages/home/ReportScreen.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/home/ReportScreen.js b/src/pages/home/ReportScreen.js index fe1e0f2cea56..5d825a528bdf 100644 --- a/src/pages/home/ReportScreen.js +++ b/src/pages/home/ReportScreen.js @@ -144,7 +144,7 @@ class ReportScreen extends React.Component { componentDidMount() { this.unsubscribeVisibilityListener = Visibility.onVisibilityChange(() => { - const isTopMostReportId = Navigation.getTopmostReportId() === getReportID(this.props.route) + const isTopMostReportId = Navigation.getTopmostReportId() === getReportID(this.props.route); // If the report is not fully visible (AKA on small screen devices and LHR is open) or the report is optimistic (AKA not yet created) // we don't need to call openReport @@ -270,7 +270,7 @@ class ReportScreen extends React.Component { const policy = this.props.policies[`${ONYXKEYS.COLLECTION.POLICY}${this.props.report.policyID}`]; - const isTopMostReportId = Navigation.getTopmostReportId() === getReportID(this.props.route) + const isTopMostReportId = Navigation.getTopmostReportId() === getReportID(this.props.route); let headerView = ( Date: Tue, 18 Jul 2023 12:47:22 +0200 Subject: [PATCH 3/4] add prop types --- src/pages/home/report/ReportActionCompose.js | 3 +++ src/pages/home/report/ReportFooter.js | 3 +++ 2 files changed, 6 insertions(+) diff --git a/src/pages/home/report/ReportActionCompose.js b/src/pages/home/report/ReportActionCompose.js index 086d665e6038..405b7b7adc98 100644 --- a/src/pages/home/report/ReportActionCompose.js +++ b/src/pages/home/report/ReportActionCompose.js @@ -116,6 +116,9 @@ const propTypes = { /** The type of action that's pending */ pendingAction: PropTypes.oneOf(['add', 'update', 'delete']), + /** Unique id for nativeId in DragAndDrop */ + dragAndDropId: PropTypes.string.isRequired, + ...windowDimensionsPropTypes, ...withLocalizePropTypes, ...withCurrentUserPersonalDetailsPropTypes, diff --git a/src/pages/home/report/ReportFooter.js b/src/pages/home/report/ReportFooter.js index fa74357cb081..f37c0247fada 100644 --- a/src/pages/home/report/ReportFooter.js +++ b/src/pages/home/report/ReportFooter.js @@ -44,6 +44,9 @@ const propTypes = { /** Whether user interactions should be disabled */ shouldDisableCompose: PropTypes.bool, + /** Unique id for nativeId in DragAndDrop */ + dragAndDropId: PropTypes.string.isRequired, + ...windowDimensionsPropTypes, }; From 3d548a5ce4a639e944b1ff4f1e2715b327bb0378 Mon Sep 17 00:00:00 2001 From: Adam Grzybowski Date: Tue, 18 Jul 2023 15:41:42 +0200 Subject: [PATCH 4/4] remove getNavigationKey from ReportActionCompose --- src/pages/home/report/ReportActionCompose.js | 5 ----- 1 file changed, 5 deletions(-) diff --git a/src/pages/home/report/ReportActionCompose.js b/src/pages/home/report/ReportActionCompose.js index 405b7b7adc98..9e0b931f22c6 100644 --- a/src/pages/home/report/ReportActionCompose.js +++ b/src/pages/home/report/ReportActionCompose.js @@ -506,11 +506,6 @@ class ReportActionCompose extends React.Component { return suggestions; } - getNavigationKey() { - const navigation = this.props.navigation.getState(); - return lodashGet(navigation.routes, [navigation.index, 'key']); - } - /** * Clean data related to EmojiSuggestions and MentionSuggestions */