Skip to content

Fix IOU Options bug #8839

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.

Sign up for GitHub

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

Merged
iwiznia merged 8 commits into from
May 5, 2022
Merged

Fix IOU Options bug #8839

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
3677e33
Fix IOU Options bug
sobitneupane Apr 30, 2022
2a601ad
Move Report Action Compose Logic
sobitneupane May 2, 2022
03a88f4
Move variable calculations to specific function
sobitneupane May 2, 2022
4819a4b
Use if/else statements instead of ternary operators
sobitneupane May 3, 2022
657693b
Solve the issue of the logged in user occuring twice in splitbills
sobitneupane May 3, 2022
9e3952a
Refactor getIOUOptions code
sobitneupane May 4, 2022
189ec6b
Merge branch 'main' into sn_bug-iou-options
sobitneupane May 4, 2022
980ba2e
Add propType for myPersonalDetails
sobitneupane May 4, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
93 changes: 52 additions & 41 deletions src/pages/home/report/ReportActionCompose.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -95,6 +95,13 @@ const propTypes = {
// The date that the user will be unblocked
expiresAt: PropTypes.string,
}),

/** The personal details of the person who is logged in */
myPersonalDetails: PropTypes.shape({
/** Primary login of the user */
login: PropTypes.string,
}),

...windowDimensionsPropTypes,
...withLocalizePropTypes,
};
Expand All @@ -106,6 +113,7 @@ const defaultProps = {
reportActions: {},
blockedFromConcierge: {},
personalDetails: {},
myPersonalDetails: {},
};

class ReportActionCompose extends React.Component {
Expand All @@ -125,6 +133,7 @@ class ReportActionCompose extends React.Component {
this.onSelectionChange = this.onSelectionChange.bind(this);
this.setTextInputRef = this.setTextInputRef.bind(this);
this.getInputPlaceholder = this.getInputPlaceholder.bind(this);
this.getIOUOptions = this.getIOUOptions.bind(this);

this.state = {
isFocused: this.shouldFocusInputOnScreenFocus,
Expand Down Expand Up @@ -230,6 +239,45 @@ class ReportActionCompose extends React.Component {
return this.props.translate('reportActionCompose.writeSomething');
}

/**
* Returns the list of IOU Options
*
* @param {Array} reportParticipants
* @returns {Array<object>}
*/
getIOUOptions(reportParticipants) {
const participants = _.filter(reportParticipants, email => this.props.myPersonalDetails.login !== email);
const hasExcludedIOUEmails = lodashIntersection(reportParticipants, CONST.EXPENSIFY_EMAILS).length > 0;
const hasMultipleParticipants = participants.length > 1;
const iouOptions = [];

if (hasExcludedIOUEmails || participants.length === 0 || !Permissions.canUseIOU(this.props.betas)) {
return [];
}

if (hasMultipleParticipants) {
return [{
icon: Expensicons.Receipt,
text: this.props.translate('iou.splitBill'),
onSelected: () => Navigation.navigate(ROUTES.getIouSplitRoute(this.props.reportID)),
}];
}

iouOptions.push({
icon: Expensicons.MoneyCircle,
text: this.props.translate('iou.requestMoney'),
onSelected: () => Navigation.navigate(ROUTES.getIouRequestRoute(this.props.reportID)),
});
if (Permissions.canUseIOUSend(this.props.betas)) {
iouOptions.push({

@iwiznia iwiznia May 3, 2022

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Suggested change
iouOptions.push({
const iouOptions = [];
iouOptions.push({

@sobitneupane sobitneupane May 4, 2022 •
edited
Loading

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

else statement is removed as it is no longer needed and variable is declared at the top of the function.

icon: Expensicons.Send,
text: this.props.translate('iou.sendMoney'),
onSelected: () => Navigation.navigate(ROUTES.getIOUSendRoute(this.props.reportID)),
});
}
return iouOptions;
}

/**
* Callback for the emoji picker to add whatever emoji is chosen into the main input
*
Expand Down Expand Up @@ -389,8 +437,6 @@ class ReportActionCompose extends React.Component {
}

const reportParticipants = lodashGet(this.props.report, 'participants', []);
const hasMultipleParticipants = reportParticipants.length > 1;
const hasExcludedIOUEmails = lodashIntersection(reportParticipants, CONST.EXPENSIFY_EMAILS).length > 0;
const reportRecipient = this.props.personalDetails[reportParticipants[0]];
const shouldShowReportRecipientLocalTime = ReportUtils.canShowReportRecipientLocalTime(this.props.personalDetails, this.props.report);

Expand Down Expand Up @@ -446,45 +492,7 @@ class ReportActionCompose extends React.Component {
onClose={() => this.setMenuVisibility(false)}
onItemSelected={() => this.setMenuVisibility(false)}
anchorPosition={styles.createMenuPositionReportActionCompose}
menuItems={[
...(!hasExcludedIOUEmails
&& Permissions.canUseIOU(this.props.betas) ? [
hasMultipleParticipants
? {
icon: Expensicons.Receipt,
text: this.props.translate('iou.splitBill'),
onSelected: () => {
Navigation.navigate(
ROUTES.getIouSplitRoute(
this.props.reportID,
),
);
},
} : {
icon: Expensicons.MoneyCircle,
text: this.props.translate('iou.requestMoney'),
onSelected: () => {
Navigation.navigate(
ROUTES.getIouRequestRoute(
this.props.reportID,
),
);
},
},
] : []),
...(!hasExcludedIOUEmails && Permissions.canUseIOUSend(this.props.betas) && !hasMultipleParticipants ? [
{
icon: Expensicons.Send,
text: this.props.translate('iou.sendMoney'),
onSelected: () => {
Navigation.navigate(
ROUTES.getIOUSendRoute(
this.props.reportID,
),
);
},
},
] : []),
menuItems={[...this.getIOUOptions(reportParticipants),
{
icon: Expensicons.Paperclip,
text: this.props.translate('reportActionCompose.addAttachment'),
Expand Down Expand Up @@ -634,5 +642,8 @@ export default compose(
blockedFromConcierge: {
key: ONYXKEYS.NVP_BLOCKED_FROM_CONCIERGE,
},
myPersonalDetails: {
key: ONYXKEYS.MY_PERSONAL_DETAILS,
},
Comment on lines +645 to +647

@Santhosh-Sellavel Santhosh-Sellavel May 4, 2022

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

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

prop type is defined for myPersonalDetails can you add that, thanks!

}),
)(ReportActionCompose);
2 changes: 1 addition & 1 deletion src/pages/iou/IOUModal.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -429,7 +429,7 @@ class IOUModal extends Component {
onConfirm={this.createTransaction}
onSendMoney={this.sendMoney}
hasMultipleParticipants={this.props.hasMultipleParticipants}
participants={this.state.participants}
participants={_.filter(this.state.participants, email => this.props.myPersonalDetails.login !== email.login)}
iouAmount={this.state.amount}
comment={this.state.comment}
onUpdateComment={this.updateComment}
Expand Down