Skip to content

Commit

Permalink
Merge pull request #50135 from software-mansion-labs/@zfurtak/search-…
Browse files Browse the repository at this point in the history 
…chat-header

Add room name to the top of searched chats
  • Loading branch information
@luacmartins
luacmartins authored Feb 4, 2025
2 parents 386ea3e + 1d86468 commit 1e4ff8a
Show file tree
Hide file tree
Showing 45 changed files with 605 additions and 297 deletions.
2 changes: 1 addition & 1 deletion src/components/ArchivedReportFooter.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ function ArchivedReportFooter({report}: ArchivedReportFooterProps) {

const shouldRenderHTML = archiveReason !== CONST.REPORT.ARCHIVE_REASON.DEFAULT && archiveReason !== CONST.REPORT.ARCHIVE_REASON.BOOKING_END_DATE_HAS_PASSED;

let policyName = ReportUtils.getPolicyName(report);
let policyName = ReportUtils.getPolicyName({report});

if (archiveReason === CONST.REPORT.ARCHIVE_REASON.INVOICE_RECEIVER_POLICY_DELETED) {
policyName = originalMessage?.receiverPolicyName ?? '';
Expand Down
2 changes: 1 addition & 1 deletion src/components/AvatarWithDisplayName.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -71,7 +71,7 @@ function AvatarWithDisplayName({
const [invoiceReceiverPolicy] = useOnyx(
`${ONYXKEYS.COLLECTION.POLICY}${parentReport?.invoiceReceiver && 'policyID' in parentReport.invoiceReceiver ? parentReport.invoiceReceiver.policyID : -1}`,
);
const title = ReportUtils.getReportName(report, undefined, undefined, undefined, invoiceReceiverPolicy);
const title = ReportUtils.getReportName(report, invoiceReceiverPolicy);
const subtitle = ReportUtils.getChatRoomSubtitle(report);
const parentNavigationSubtitleData = ReportUtils.getParentNavigationSubtitle(report);
const isMoneyRequestOrReport =
Expand Down
2 changes: 1 addition & 1 deletion src/components/BrokenConnectionDescription.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,7 @@ function BrokenConnectionDescription({transactionID, policy, report}: BrokenConn
);
}

if (isReportApproved(report) || isReportManuallyReimbursed(report) || (isProcessingReport(report) && !isInstantSubmitEnabled(policy))) {
if (isReportApproved({report}) || isReportManuallyReimbursed(report) || (isProcessingReport(report) && !isInstantSubmitEnabled(policy))) {
return translate('violations.memberBrokenConnectionError');
}

Expand Down
5 changes: 4 additions & 1 deletion src/components/Reactions/ReactionTooltipContent.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,10 @@ type ReactionTooltipContentProps = Pick<WithCurrentUserPersonalDetailsProps, 'cu
function ReactionTooltipContent({accountIDs, currentUserPersonalDetails, emojiCodes, emojiName}: ReactionTooltipContentProps) {
const styles = useThemeStyles();
const {translate} = useLocalize();
const users = useMemo(() => PersonalDetailsUtils.getPersonalDetailsByIDs(accountIDs, currentUserPersonalDetails.accountID, true), [currentUserPersonalDetails.accountID, accountIDs]);
const users = useMemo(
() => PersonalDetailsUtils.getPersonalDetailsByIDs({accountIDs, currentUserAccountID: currentUserPersonalDetails.accountID, shouldChangeUserDisplayName: true}),
[currentUserPersonalDetails.accountID, accountIDs],
);

const namesString = users
.map((user) => user?.displayName)
Expand Down
4 changes: 3 additions & 1 deletion src/components/ReportActionItem/IssueCardMessage.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,9 @@ function IssueCardMessage({action, policyID}: IssueCardMessageProps) {

return (
<>
<RenderHTML html={`<muted-text>${ReportActionsUtils.getCardIssuedMessage(action, true, policyID, !!card)}</muted-text>`} />
<RenderHTML
html={`<muted-text>${ReportActionsUtils.getCardIssuedMessage({reportAction: action, shouldRenderHTML: true, policyID, shouldDisplayLinkToCard: !!card})}</muted-text>`}
/>
{shouldShowAddMissingDetailsButton && (
<Button
onPress={() => Navigation.navigate(ROUTES.MISSING_PERSONAL_DETAILS)}
Expand Down
8 changes: 4 additions & 4 deletions src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -155,7 +155,7 @@ function MoneyRequestPreviewContent({
const isFetchingWaypointsFromServer = isFetchingWaypointsFromServerTransactionUtils(transaction);
const isCardTransaction = isCardTransactionTransactionUtils(transaction);
const isSettled = isSettledReportUtils(iouReport?.reportID);
const isApproved = isReportApproved(iouReport);
const isApproved = isReportApproved({report: iouReport});
const isDeleted = action?.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE;
const isReviewDuplicateTransactionPage = route.name === SCREENS.TRANSACTION_DUPLICATE.REVIEW;

Expand Down Expand Up @@ -262,9 +262,9 @@ function MoneyRequestPreviewContent({
}
return message;
}
} else if (hasNoticeTypeViolations && transaction && !isReportApproved(iouReport) && !isSettledReportUtils(iouReport?.reportID)) {
} else if (hasNoticeTypeViolations && transaction && !isReportApproved({report: iouReport}) && !isSettledReportUtils(iouReport?.reportID)) {
message += ` ${CONST.DOT_SEPARATOR} ${translate('violations.reviewRequired')}`;
} else if (isPaidGroupPolicyExpenseReport(iouReport) && isReportApproved(iouReport) && !isSettledReportUtils(iouReport?.reportID) && !isPartialHold) {
} else if (isPaidGroupPolicyExpenseReport(iouReport) && isReportApproved({report: iouReport}) && !isSettledReportUtils(iouReport?.reportID) && !isPartialHold) {
message += ` ${CONST.DOT_SEPARATOR} ${translate('iou.approved')}`;
} else if (iouReport?.isCancelledIOU) {
message += ` ${CONST.DOT_SEPARATOR} ${translate('iou.canceled')}`;
Expand Down Expand Up @@ -533,7 +533,7 @@ function MoneyRequestPreviewContent({
styles.moneyRequestPreviewBox,
containerStyles,
shouldDisableOnPress && styles.cursorDefault,
(isSettled || isReportApproved(iouReport)) && isSettlementOrApprovalPartial && styles.offlineFeedback.pending,
(isSettled || isReportApproved({report: iouReport})) && isSettlementOrApprovalPartial && styles.offlineFeedback.pending,
]}
>
{childContainer}
Expand Down
2 changes: 1 addition & 1 deletion src/components/ReportActionItem/MoneyRequestView.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -160,7 +160,7 @@ function MoneyRequestView({report, shouldShowAnimatedBackground, readonly = fals
const isCardTransaction = isCardTransactionTransactionUtils(transaction);
const cardProgramName = getCardName(transaction);
const shouldShowCard = isCardTransaction && cardProgramName;
const isApproved = isReportApproved(moneyRequestReport);
const isApproved = isReportApproved({report: moneyRequestReport});
const isInvoice = isInvoiceReport(moneyRequestReport);
const isPaidReport = isPayAction(parentReportAction);
const taxRates = policy?.taxRates;
Expand Down
8 changes: 4 additions & 4 deletions src/components/ReportActionItem/ReportPreview.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -206,7 +206,7 @@ function ReportPreview({
}));
const checkMarkScale = useSharedValue(iouSettled ? 1 : 0);

const isApproved = isReportApproved(iouReport, action);
const isApproved = isReportApproved({report: iouReport, parentReportAction: action});
const thumbsUpScale = useSharedValue(isApproved ? 1 : 0);
const thumbsUpStyle = useAnimatedStyle(() => ({
...styles.defaultCheckmarkWrapper,
Expand Down Expand Up @@ -372,11 +372,11 @@ function ReportPreview({

let payerOrApproverName;
if (isPolicyExpenseChat || isTripRoom) {
payerOrApproverName = getPolicyName(chatReport, undefined, policy);
payerOrApproverName = getPolicyName({report: chatReport, policy});
} else if (isInvoiceRoom) {
payerOrApproverName = getInvoicePayerName(chatReport, invoiceReceiverPolicy, invoiceReceiverPersonalDetail);
} else {
payerOrApproverName = getDisplayNameForParticipant(managerID, true);
payerOrApproverName = getDisplayNameForParticipant({accountID: managerID, shouldUseShortForm: true});
}

if (isApproved) {
Expand All @@ -387,7 +387,7 @@ function ReportPreview({
paymentVerb = 'iou.payerPaid';
} else if (hasNonReimbursableTransactions) {
paymentVerb = 'iou.payerSpent';
payerOrApproverName = getDisplayNameForParticipant(chatReport?.ownerAccountID, true);
payerOrApproverName = getDisplayNameForParticipant({accountID: chatReport?.ownerAccountID, shouldUseShortForm: true});
}
return translate(paymentVerb, {payer: payerOrApproverName});
}, [
Expand Down
2 changes: 1 addition & 1 deletion src/components/ReportActionItem/TaskView.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -148,7 +148,7 @@ function TaskView({report}: TaskViewProps) {
{report?.managerID ? (
<MenuItem
label={translate('task.assignee')}
title={getDisplayNameForParticipant(report?.managerID)}
title={getDisplayNameForParticipant({accountID: report.managerID})}
icon={getAvatarsForAccountIDs([report?.managerID ?? CONST.DEFAULT_NUMBER_ID], personalDetails)}
iconType={CONST.ICON_TYPE_AVATAR}
avatarSize={CONST.AVATAR_SIZE.SMALLER}
Expand Down
8 changes: 4 additions & 4 deletions src/components/ReportWelcomeText.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -122,9 +122,9 @@ function ReportWelcomeText({report, policy}: ReportWelcomeTextProps) {
) : (
<Text>
<Text>{welcomeMessage.phrase1}</Text>
<Text style={[styles.textStrong]}>{getDisplayNameForParticipant(report?.ownerAccountID)}</Text>
<Text style={[styles.textStrong]}>{getDisplayNameForParticipant({accountID: report?.ownerAccountID})}</Text>
<Text>{welcomeMessage.phrase2}</Text>
<Text style={[styles.textStrong]}>{getPolicyName(report)}</Text>
<Text style={[styles.textStrong]}>{getPolicyName({report})}</Text>
<Text>{welcomeMessage.phrase3}</Text>
</Text>
))}
Expand All @@ -139,13 +139,13 @@ function ReportWelcomeText({report, policy}: ReportWelcomeTextProps) {
<Text>{welcomeMessage.phrase1}</Text>
<Text>
{report?.invoiceReceiver?.type === CONST.REPORT.INVOICE_RECEIVER_TYPE.INDIVIDUAL ? (
<Text style={[styles.textStrong]}>{getDisplayNameForParticipant(report?.invoiceReceiver?.accountID)}</Text>
<Text style={[styles.textStrong]}>{getDisplayNameForParticipant({accountID: report?.invoiceReceiver?.accountID})}</Text>
) : (
<Text style={[styles.textStrong]}>{getPolicy(report?.invoiceReceiver?.policyID)?.name}</Text>
)}
</Text>
<Text>{` ${translate('common.and')} `}</Text>
<Text style={[styles.textStrong]}>{getPolicyName(report)}</Text>
<Text style={[styles.textStrong]}>{getPolicyName({report})}</Text>
<Text>{welcomeMessage.phrase2}</Text>
</Text>
))}
Expand Down
6 changes: 5 additions & 1 deletion src/components/Search/SearchFiltersParticipantsSelector.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,11 @@ function SearchFiltersParticipantsSelector({initialAccountIDs, onFiltersUpdate}:
const selectedCurrentUser = formattedResults.section.data.find((option) => option.accountID === chatOptions.currentUserOption?.accountID);

if (chatOptions.currentUserOption) {
const formattedName = ReportUtils.getDisplayNameForParticipant(chatOptions.currentUserOption.accountID, false, true, true, personalDetails);
const formattedName = ReportUtils.getDisplayNameForParticipant({
accountID: chatOptions.currentUserOption.accountID,
shouldAddCurrentUserPostfix: true,
personalDetailsData: personalDetails,
});
if (selectedCurrentUser) {
selectedCurrentUser.text = formattedName;
} else {
Expand Down
88 changes: 51 additions & 37 deletions src/components/SelectionList/ChatListItem.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,8 @@ import {AttachmentContext} from '@components/AttachmentContext';
import MentionReportContext from '@components/HTMLEngineProvider/HTMLRenderers/MentionReportRenderer/MentionReportContext';
import MultipleAvatars from '@components/MultipleAvatars';
import {ShowContextMenuContext} from '@components/ShowContextMenuContext';
import Text from '@components/Text';
import TextLink from '@components/TextLink';
import TextWithTooltip from '@components/TextWithTooltip';
import useAnimatedHighlightStyle from '@hooks/useAnimatedHighlightStyle';
import useStyleUtils from '@hooks/useStyleUtils';
Expand Down Expand Up @@ -56,7 +58,6 @@ function ChatListItem<TItem extends ListItem>({

const focusedBackgroundColor = styles.sidebarLinkActive.backgroundColor;
const hoveredBackgroundColor = styles.sidebarLinkHover?.backgroundColor ? styles.sidebarLinkHover.backgroundColor : theme.sidebar;

const mentionReportContextValue = useMemo(() => ({currentReportID: item?.reportID ?? '-1'}), [item.reportID]);
const animatedHighlightStyle = useAnimatedHighlightStyle({
borderRadius: variables.componentBorderRadius,
Expand Down Expand Up @@ -99,43 +100,56 @@ function ChatListItem<TItem extends ListItem>({
<MentionReportContext.Provider value={mentionReportContextValue}>
<ShowContextMenuContext.Provider value={contextValue}>
<AttachmentContext.Provider value={attachmentContextValue}>
<MultipleAvatars
icons={icons}
shouldShowTooltip={showTooltip}
secondAvatarStyle={[
StyleUtils.getBackgroundAndBorderStyle(theme.sidebar),
isFocused ? StyleUtils.getBackgroundAndBorderStyle(focusedBackgroundColor) : undefined,
hovered && !isFocused ? StyleUtils.getBackgroundAndBorderStyle(hoveredBackgroundColor) : undefined,
]}
/>
<View style={[styles.chatItemRight]}>
<View style={[styles.chatItemMessageHeader]}>
<View style={[styles.flexShrink1, styles.mr1]}>
<TextWithTooltip
shouldShowTooltip={showTooltip}
text={reportActionItem.formattedFrom}
style={[
styles.chatItemMessageHeaderSender,
isFocused ? styles.sidebarLinkActiveText : styles.sidebarLinkText,
styles.sidebarLinkTextBold,
styles.pre,
]}
/>
</View>
<ReportActionItemDate created={reportActionItem.created ?? ''} />
<View style={styles.webViewStyles.tagStyles.ol}>
<View style={[styles.flexRow, styles.alignItemsCenter, styles.mb3]}>
<Text style={styles.chatItemMessageHeaderPolicy}>In </Text>
<TextLink
fontSize={variables.fontSizeSmall}
onPress={() => onSelectRow(item)}
>
{reportActionItem.reportName}
</TextLink>
</View>
<View style={styles.chatItemMessage}>
{reportActionItem.message.map((fragment, index) => (
<ReportActionItemFragment
// eslint-disable-next-line react/no-array-index-key
key={`actionFragment-${reportActionItem.reportActionID}-${index}`}
fragment={fragment}
actionName={reportActionItem.actionName}
source=""
accountID={from.accountID}
isFragmentContainingDisplayName={index === 0}
/>
))}
<View style={styles.flexRow}>
<MultipleAvatars
icons={icons}
shouldShowTooltip={showTooltip}
secondAvatarStyle={[
StyleUtils.getBackgroundAndBorderStyle(theme.sidebar),
isFocused ? StyleUtils.getBackgroundAndBorderStyle(focusedBackgroundColor) : undefined,
hovered && !isFocused ? StyleUtils.getBackgroundAndBorderStyle(hoveredBackgroundColor) : undefined,
]}
/>
<View style={[styles.chatItemRight]}>
<View style={[styles.chatItemMessageHeader]}>
<View style={[styles.flexShrink1, styles.mr1]}>
<TextWithTooltip
shouldShowTooltip={showTooltip}
text={reportActionItem.formattedFrom}
style={[
styles.chatItemMessageHeaderSender,
isFocused ? styles.sidebarLinkActiveText : styles.sidebarLinkText,
styles.sidebarLinkTextBold,
styles.pre,
]}
/>
</View>
<ReportActionItemDate created={reportActionItem.created ?? ''} />
</View>
<View style={styles.chatItemMessage}>
{reportActionItem.message.map((fragment, index) => (
<ReportActionItemFragment
// eslint-disable-next-line react/no-array-index-key
key={`actionFragment-${reportActionItem.reportActionID}-${index}`}
fragment={fragment}
actionName={reportActionItem.actionName}
source=""
accountID={from.accountID}
isFragmentContainingDisplayName={index === 0}
/>
))}
</View>
</View>
</View>
</View>
</AttachmentContext.Provider>
Expand Down
2 changes: 1 addition & 1 deletion src/hooks/useBasePopoverReactionList/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ export default function useBasePopoverReactionList({emojiName, emojiReactions, a

const {emojiCodes, reactionCount, hasUserReacted, userAccountIDs} = EmojiUtils.getEmojiReactionDetails(emojiName, selectedReaction, accountID);

const users = PersonalDetailsUtils.getPersonalDetailsByIDs(userAccountIDs, accountID, true);
const users = PersonalDetailsUtils.getPersonalDetailsByIDs({accountIDs: userAccountIDs, currentUserAccountID: accountID, shouldChangeUserDisplayName: true});
return {
emojiName,
emojiCodes,
Expand Down
Loading

0 comments on commit 1e4ff8a

Please sign in to comment.