Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix workspace avatar it not updated #19750

Merged
merged 10 commits into from
Jun 5, 2023
2 changes: 2 additions & 0 deletions src/pages/home/ReportScreen.js
Original file line number Diff line number Diff line change
Expand Up @@ -246,6 +246,7 @@ class ReportScreen extends React.Component {
const shouldAnimate = !shouldFreeze;
const parentReportAction = ReportActionsUtils.getParentReportAction(this.props.report);
const isSingleTransactionView = ReportActionsUtils.isTransactionThread(parentReportAction);

return (
<ScreenWrapper style={screenWrapperStyle}>
<Freeze
Expand Down Expand Up @@ -340,6 +341,7 @@ class ReportScreen extends React.Component {
isComposerFullSize={this.props.isComposerFullSize}
isDrawerOpen={this.props.isDrawerOpen}
parentViewHeight={this.state.skeletonViewContainerHeight}
policies={this.props.policies}
/>
)}

Expand Down
14 changes: 14 additions & 0 deletions src/pages/home/report/ReportActionsView.js
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ import reportPropTypes from '../../reportPropTypes';
import * as ReactionList from './ReactionList/ReactionList';
import PopoverReactionList from './ReactionList/PopoverReactionList';
import getIsReportFullyVisible from '../../../libs/getIsReportFullyVisible';
import ONYXKEYS from '../../../ONYXKEYS';

const propTypes = {
/** The report currently being looked at */
Expand All @@ -38,6 +39,12 @@ const propTypes = {
/** Information about the network */
network: networkPropTypes.isRequired,

/** The policies which the user has access to and which the report could be tied to */
policies: PropTypes.shape({
/** avatar of the policy */
avatar: PropTypes.string,
}).isRequired,

...windowDimensionsPropTypes,
...withDrawerPropTypes,
...withLocalizePropTypes,
Expand Down Expand Up @@ -120,6 +127,13 @@ class ReportActionsView extends React.Component {
}

shouldComponentUpdate(nextProps, nextState) {
const policy = this.props.policies[`${ONYXKEYS.COLLECTION.POLICY}${this.props.report.policyID}`];
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@hungvu193 One change. This should be checked only before the icons equality check.
https://github.com/Expensify/App/blob/main/src/pages/home/report/ReportActionsView.js#L171

I don't think this is of high priority to be checked for equality first. Can we move this check just before the icons equality check?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice catch. Thank you @abdulrahuman5196 . I've updated the PR!

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think there is use in fetching the policy before and checking its equality on lower part. This policy is not used anywhere else.
can we move the policy and nextPolicy lines before the equality check?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copy link
Contributor Author

@hungvu193 hungvu193 May 31, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

// other condition
const policy = this.props.policies[`${ONYXKEYS.COLLECTION.POLICY}${this.props.report.policyID}`];
const nextPolicy = nextProps.policies[`${ONYXKEYS.COLLECTION.POLICY}${nextProps.report.policyID}`];
        if (lodashGet(policy, 'avatar') !== lodashGet(nextPolicy, 'avatar')) {
            return true;
        }

Somethings like this right? So we can avoid to calculate policy every time.
@abdulrahuman5196

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

const nextPolicy = nextProps.policies[`${ONYXKEYS.COLLECTION.POLICY}${nextProps.report.policyID}`];

if (lodashGet(policy, 'avatar') !== lodashGet(nextPolicy, 'avatar')) {
return true;
}

if (!_.isEqual(nextProps.reportActions, this.props.reportActions)) {
this.mostRecentIOUReportActionID = ReportActionsUtils.getMostRecentIOURequestActionID(nextProps.reportActions);
return true;
Expand Down