Skip to content

Commit

Permalink
Merge pull request #18537 from mollfpr/mollfpr-18475
Browse files Browse the repository at this point in the history 
Display iou or expense in LHN
  • Loading branch information
@Julesssss
Julesssss authored May 11, 2023
2 parents 4ba62c6 + 6f1c13f commit 5df596f
Show file tree
Hide file tree
Showing 6 changed files with 66 additions and 17 deletions.
2 changes: 1 addition & 1 deletion src/components/LHNOptionsList/OptionRowLHN.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -147,7 +147,7 @@ const OptionRowLHN = (props) => {
tooltipEnabled
numberOfLines={1}
textStyles={displayNameStyle}
shouldUseFullTitle={optionItem.isChatRoom || optionItem.isPolicyExpenseChat || optionItem.isTaskReport}
shouldUseFullTitle={optionItem.isChatRoom || optionItem.isPolicyExpenseChat || optionItem.isTaskReport || optionItem.isMoneyRequestReport}
/>
{optionItem.isChatRoom && (
<TextPill
Expand Down
1 change: 1 addition & 0 deletions src/languages/en.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -325,6 +325,7 @@ export default {
settlePaypalMe: 'Pay with PayPal.me',
requestAmount: ({amount}) => `request ${amount}`,
splitAmount: ({amount}) => `split ${amount}`,
payerOwesAmount: ({payer, amount}) => `${payer} owes ${amount}`,
noReimbursableExpenses: 'This report has an invalid amount',
pendingConversionMessage: "Total will update when you're back online",
error: {
Expand Down
1 change: 1 addition & 0 deletions src/languages/es.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -324,6 +324,7 @@ export default {
settlePaypalMe: 'Pagar con PayPal.me',
requestAmount: ({amount}) => `solicitar ${amount}`,
splitAmount: ({amount}) => `dividir ${amount}`,
payerOwesAmount: ({payer, amount}) => `${payer} debe ${amount}`,
noReimbursableExpenses: 'El monto de este informe es inválido',
pendingConversionMessage: 'El total se actualizará cuando estés online',
error: {
Expand Down
39 changes: 37 additions & 2 deletions src/libs/ReportUtils.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -727,7 +727,7 @@ function getIcons(report, personalDetails, defaultIcon = null) {
result.source = Expensicons.ActiveRoomAvatar;
return [result];
}
if (isPolicyExpenseChat(report)) {
if (isPolicyExpenseChat(report) || isExpenseReport(report)) {
const workspaceName = lodashGet(allPolicies, [`${ONYXKEYS.COLLECTION.POLICY}${report.policyID}`, 'name']);

const policyExpenseChatAvatarSource = lodashGet(allPolicies, [`${ONYXKEYS.COLLECTION.POLICY}${report.policyID}`, 'avatar']) || getDefaultWorkspaceAvatar(workspaceName);
Expand Down Expand Up @@ -885,6 +885,19 @@ function getPolicyExpenseChatName(report) {
return reportOwnerDisplayName;
}

/**
* Get the title for a IOU or expense chat which will be showing the payer and the amount
*
* @param {Object} report
* @returns {String}
*/
function getMoneyRequestReportName(report) {
const formattedAmount = CurrencyUtils.convertToDisplayString(report.total || 0, report.currency);
const payerName = isExpenseReport(report) ? getPolicyName(report) : getDisplayNameForParticipant(report.managerEmail);

return Localize.translateLocal('iou.payerOwesAmount', {payer: payerName, amount: formattedAmount});
}

/**
* Get the title for a report.
*
Expand All @@ -901,6 +914,10 @@ function getReportName(report) {
formattedName = getPolicyExpenseChatName(report);
}

if (isMoneyRequestReport(report)) {
formattedName = getMoneyRequestReportName(report);
}

if (isArchivedRoom(report)) {
formattedName += ` (${Localize.translateLocal('common.archived')})`;
}
Expand Down Expand Up @@ -1596,7 +1613,7 @@ function shouldReportBeInOptionList(report, reportIDFromRoute, isInGSDMode, curr
// Exclude reports that have no data because there wouldn't be anything to show in the option item.
// This can happen if data is currently loading from the server or a report is in various stages of being created.
// This can also happen for anyone accessing a public room or archived room for which they don't have access to the underlying policy.
if (!report || !report.reportID || !report.participants || (_.isEmpty(report.participants) && !isPublicRoom(report) && !isArchivedRoom(report)) || isIOUReport(report)) {
if (!report || !report.reportID || (_.isEmpty(report.participants) && !isPublicRoom(report) && !isArchivedRoom(report) && !isMoneyRequestReport(report))) {
return false;
}

Expand Down Expand Up @@ -1877,6 +1894,23 @@ function getWhisperDisplayNames(participants) {
return _.map(participants, (login) => getDisplayNameForParticipant(login, !isWhisperOnlyVisibleToCurrentUSer)).join(', ');
}

/**
* Show subscript on IOU or expense report
* @param {Object} report
* @returns {Boolean}
*/
function shouldReportShowSubscript(report) {
if (isArchivedRoom(report)) {
return false;
}

if (isPolicyExpenseChat(report) && !report.isOwnPolicyExpenseChat) {
return true;
}

return isExpenseReport(report);
}

export {
getReportParticipantsTitle,
isReportMessageAttachment,
Expand Down Expand Up @@ -1956,4 +1990,5 @@ export {
canRequestMoney,
getWhisperDisplayNames,
getWorkspaceAvatar,
shouldReportShowSubscript,
};
27 changes: 16 additions & 11 deletions src/libs/SidebarUtils.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,15 +21,15 @@ import * as LocalePhoneNumber from './LocalePhoneNumber';
// data anyway and cause SidebarLinks to rerender.

const chatReports = {};
const iouReports = {};
const moneyRequestReports = {};
Onyx.connect({
key: ONYXKEYS.COLLECTION.REPORT,
callback: (report, key) => {
if (!report) {
delete iouReports[key];
delete moneyRequestReports[key];
delete chatReports[key];
} else if (ReportUtils.isIOUReport(report)) {
iouReports[key] = report;
} else if (ReportUtils.isMoneyRequestReport(report)) {
moneyRequestReports[key] = report;
} else {
chatReports[key] = report;
}
Expand Down Expand Up @@ -108,7 +108,9 @@ function getOrderedReportIDs(reportIDFromRoute) {
const isInDefaultMode = !isInGSDMode;

// Filter out all the reports that shouldn't be displayed
const reportsToDisplay = _.filter(chatReports, (report) => ReportUtils.shouldReportBeInOptionList(report, reportIDFromRoute, isInGSDMode, currentUserLogin, iouReports, betas, policies));
const reportsToDisplay = _.filter({...chatReports, ...moneyRequestReports}, (report) =>
ReportUtils.shouldReportBeInOptionList(report, reportIDFromRoute, isInGSDMode, currentUserLogin, moneyRequestReports, betas, policies),
);

// There are a few properties that need to be calculated for the report which are used when sorting reports.
_.each(reportsToDisplay, (report) => {
Expand All @@ -119,7 +121,7 @@ function getOrderedReportIDs(reportIDFromRoute) {
report.displayName = ReportUtils.getReportName(report);

// eslint-disable-next-line no-param-reassign
report.iouReportAmount = ReportUtils.getIOUTotal(report, iouReports);
report.iouReportAmount = ReportUtils.getIOUTotal(report, moneyRequestReports);
});

// The LHN is split into five distinct groups, and each group is sorted a little differently. The groups will ALWAYS be in this order:
Expand All @@ -144,7 +146,7 @@ function getOrderedReportIDs(reportIDFromRoute) {
return;
}

if (report.hasOutstandingIOU && !ReportUtils.isIOUOwnedByCurrentUser(report, iouReports)) {
if (report.hasOutstandingIOU && !ReportUtils.isIOUOwnedByCurrentUser(report, moneyRequestReports)) {
outstandingIOUReports.push(report);
return;
}
Expand Down Expand Up @@ -192,7 +194,8 @@ function getOrderedReportIDs(reportIDFromRoute) {
* @returns {Object}
*/
function getOptionData(reportID) {
const report = chatReports[`${ONYXKEYS.COLLECTION.REPORT}${reportID}`];
const reportKey = `${ONYXKEYS.COLLECTION.REPORT}${reportID}`;
const report = chatReports[reportKey] || moneyRequestReports[reportKey];

// When a user signs out, Onyx is cleared. Due to the lazy rendering with a virtual list, it's possible for
// this method to be called after the Onyx data has been cleared out. In that case, it's fine to do
Expand Down Expand Up @@ -229,6 +232,7 @@ function getOptionData(reportID) {
isArchivedRoom: false,
shouldShowSubscript: false,
isPolicyExpenseChat: false,
isMoneyRequestReport: false,
};

const participantPersonalDetailList = _.values(OptionsListUtils.getPersonalDetailsForLogins(report.participants, personalDetails));
Expand All @@ -238,7 +242,8 @@ function getOptionData(reportID) {
result.isTaskReport = ReportUtils.isTaskReport(report);
result.isArchivedRoom = ReportUtils.isArchivedRoom(report);
result.isPolicyExpenseChat = ReportUtils.isPolicyExpenseChat(report);
result.shouldShowSubscript = result.isPolicyExpenseChat && !report.isOwnPolicyExpenseChat && !result.isArchivedRoom;
result.isMoneyRequestReport = ReportUtils.isMoneyRequestReport(report);
result.shouldShowSubscript = ReportUtils.shouldReportShowSubscript(report);
result.pendingAction = report.pendingFields ? report.pendingFields.addWorkspaceRoom || report.pendingFields.createChat : null;
result.allReportErrors = OptionsListUtils.getAllReportErrors(report, reportActions);
result.brickRoadIndicator = !_.isEmpty(result.allReportErrors) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : '';
Expand Down Expand Up @@ -325,8 +330,8 @@ function getOptionData(reportID) {
result.alternateText = lastMessageText || formattedLogin;
}

result.isIOUReportOwner = ReportUtils.isIOUOwnedByCurrentUser(result, iouReports);
result.iouReportAmount = ReportUtils.getIOUTotal(result, iouReports);
result.isIOUReportOwner = ReportUtils.isIOUOwnedByCurrentUser(result, moneyRequestReports);
result.iouReportAmount = ReportUtils.getIOUTotal(result, moneyRequestReports);

if (!hasMultipleParticipants) {
result.login = personalDetail.login;
Expand Down
13 changes: 10 additions & 3 deletions tests/unit/SidebarOrderTest.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -360,6 +360,7 @@ describe('Sidebar', () => {
...LHNTestUtils.getFakeReport(['[email protected]', '[email protected]']),
type: CONST.REPORT.TYPE.IOU,
ownerEmail: '[email protected]',
managerEmail: '[email protected]',
hasOutstandingIOU: true,
total: 10000,
currency: 'USD',
Expand Down Expand Up @@ -391,12 +392,13 @@ describe('Sidebar', () => {
.then(() => {
const hintText = Localize.translateLocal('accessibilityHints.chatUserDisplayNames');
const displayNames = screen.queryAllByLabelText(hintText);
expect(displayNames).toHaveLength(3);
expect(displayNames).toHaveLength(4);
expect(screen.queryAllByTestId('Pin Icon')).toHaveLength(1);
expect(screen.queryAllByTestId('Pencil Icon')).toHaveLength(1);
expect(lodashGet(displayNames, [0, 'props', 'children'])).toBe('One, Two');
expect(lodashGet(displayNames, [1, 'props', 'children'])).toBe('Five, Six');
expect(lodashGet(displayNames, [2, 'props', 'children'])).toBe('Three, Four');
expect(lodashGet(displayNames, [2, 'props', 'children'])).toBe('Email Two owes $100.00');
expect(lodashGet(displayNames, [3, 'props', 'children'])).toBe('Three, Four');
})
);
});
Expand Down Expand Up @@ -676,6 +678,7 @@ describe('Sidebar', () => {
...LHNTestUtils.getFakeReport(['[email protected]', '[email protected]']),
type: CONST.REPORT.TYPE.IOU,
ownerEmail: '[email protected]',
managerEmail: '[email protected]',
hasOutstandingIOU: true,
total: 10000,
currency: 'USD',
Expand All @@ -685,6 +688,7 @@ describe('Sidebar', () => {
...LHNTestUtils.getFakeReport(['[email protected]', '[email protected]']),
type: CONST.REPORT.TYPE.IOU,
ownerEmail: '[email protected]',
managerEmail: '[email protected]',
hasOutstandingIOU: true,
total: 10000,
currency: 'USD',
Expand All @@ -694,6 +698,7 @@ describe('Sidebar', () => {
...LHNTestUtils.getFakeReport(['[email protected]', '[email protected]']),
type: CONST.REPORT.TYPE.IOU,
ownerEmail: '[email protected]',
managerEmail: '[email protected]',
hasOutstandingIOU: true,
total: 10000,
currency: 'USD',
Expand Down Expand Up @@ -727,10 +732,12 @@ describe('Sidebar', () => {
.then(() => {
const hintText = Localize.translateLocal('accessibilityHints.chatUserDisplayNames');
const displayNames = screen.queryAllByLabelText(hintText);
expect(displayNames).toHaveLength(3);
expect(displayNames).toHaveLength(5);
expect(lodashGet(displayNames, [0, 'props', 'children'])).toBe('Five, Six');
expect(lodashGet(displayNames, [1, 'props', 'children'])).toBe('One, Two');
expect(lodashGet(displayNames, [2, 'props', 'children'])).toBe('Three, Four');
expect(lodashGet(displayNames, [3, 'props', 'children'])).toBe('Email Two owes $100.00');
expect(lodashGet(displayNames, [4, 'props', 'children'])).toBe('Email Two owes $100.00');
})
);
});
Expand Down

0 comments on commit 5df596f

Please sign in to comment.