-
Notifications
You must be signed in to change notification settings - Fork 3k
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
Add Rest of UI for Workspace Chats #7957
Changes from 31 commits
f759195
b7e1989
33562ec
25db051
a63a86c
b9685a6
364ca06
d6ebc16
9c3eb78
88cadd5
9f27699
7aab36f
2068333
8dcf8b3
d73bb90
fed389b
9af0796
7a7cf3c
5030078
5c0b09b
983b3d2
f4e9f9a
765aac2
77b2c7b
af6d506
75a255e
3916197
4489e89
95143d4
beea726
ed45672
7352c5b
6d54630
6d7befc
e399654
69ea420
2c56b09
c95f4b7
3e08a89
b00430c
a512f7a
a792b8a
9420c26
2176ddf
8b713fe
84a02ed
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -8,6 +8,7 @@ import styles from '../styles/styles'; | |
import Text from './Text'; | ||
import withLocalize, {withLocalizePropTypes} from './withLocalize'; | ||
import compose from '../libs/compose'; | ||
import * as ReportUtils from '../libs/reportUtils'; | ||
import * as OptionsListUtils from '../libs/OptionsListUtils'; | ||
import ONYXKEYS from '../ONYXKEYS'; | ||
import CONST from '../CONST'; | ||
|
@@ -26,24 +27,34 @@ const personalDetailsPropTypes = PropTypes.shape({ | |
}); | ||
|
||
const propTypes = { | ||
/** Whether it is a default Chat Room */ | ||
shouldIncludeParticipants: PropTypes.bool, | ||
|
||
/** The report currently being looked at */ | ||
report: PropTypes.oneOfType([PropTypes.object]), | ||
|
||
/** All of the personal details for everyone */ | ||
personalDetails: PropTypes.objectOf(personalDetailsPropTypes).isRequired, | ||
|
||
/* Onyx Props */ | ||
TomatoToaster marked this conversation as resolved.
Show resolved
Hide resolved
|
||
|
||
/** The policies which the user has access to and which the report could be tied to */ | ||
policies: PropTypes.shape({ | ||
/** The policy name */ | ||
name: PropTypes.string, | ||
|
||
/** ID of the policy */ | ||
id: PropTypes.string, | ||
TomatoToaster marked this conversation as resolved.
Show resolved
Hide resolved
|
||
}).isRequired, | ||
|
||
...withLocalizePropTypes, | ||
}; | ||
|
||
const defaultProps = { | ||
report: {}, | ||
shouldIncludeParticipants: true, | ||
}; | ||
|
||
const ReportWelcomeText = (props) => { | ||
const isPolicyExpenseChat = ReportUtils.isPolicyExpenseChat(props.report); | ||
const isChatRoom = ReportUtils.isChatRoom(props.report); | ||
const isDefault = !(isChatRoom || isPolicyExpenseChat); | ||
const participants = lodashGet(props.report, 'participants', []); | ||
const isMultipleParticipant = participants.length > 1; | ||
const displayNamesWithTooltips = _.map( | ||
|
@@ -66,46 +77,66 @@ const ReportWelcomeText = (props) => { | |
}; | ||
}, | ||
); | ||
const chatUsers = props.shouldIncludeParticipants ? displayNamesWithTooltips : [{displayName: props.report.reportName}]; | ||
const chatUsers = isChatRoom ? [{displayName: props.report.reportName}] : displayNamesWithTooltips; | ||
const isResctrictedRoom = lodashGet(props, 'report.visibility', '') === CONST.REPORT.VISIBILITY.RESTRICTED; | ||
|
||
return ( | ||
<Text style={[styles.mt3, styles.mw100, styles.textAlignCenter]}> | ||
{!props.shouldIncludeParticipants | ||
? ( | ||
<> | ||
<Text> | ||
{isResctrictedRoom | ||
? `${props.translate('reportActionsView.beginningOfChatHistoryRestrictedPartOne')}` | ||
: `${props.translate('reportActionsView.beginningOfChatHistoryPrivatePartOne')}`} | ||
</Text> | ||
<Text style={[styles.textStrong]}> | ||
{lodashGet(chatUsers, '[0].displayName', '')} | ||
</Text> | ||
<Text> | ||
{isResctrictedRoom | ||
? `${props.translate('reportActionsView.beginningOfChatHistoryRestrictedPartTwo')}` | ||
: `${props.translate('reportActionsView.beginningOfChatHistoryPrivatePartTwo')}`} | ||
</Text> | ||
</> | ||
) : ( | ||
<> | ||
<Text> | ||
{props.translate('reportActionsView.beginningOfChatHistory')} | ||
</Text> | ||
{_.map(chatUsers, ({displayName, pronouns}, index) => ( | ||
<Text key={displayName}> | ||
<Text style={[styles.textStrong]}> | ||
{displayName} | ||
</Text> | ||
{!_.isEmpty(pronouns) && <Text>{` (${pronouns})`}</Text>} | ||
{(index === chatUsers.length - 1) && <Text>.</Text>} | ||
{(index === chatUsers.length - 2) && <Text>{` ${props.translate('common.and')} `}</Text>} | ||
{(index < chatUsers.length - 2) && <Text>, </Text>} | ||
{isPolicyExpenseChat && ( | ||
<> | ||
<Text> | ||
{props.translate('reportActionsView.beginningOfChatHistoryPolicyExpenseChatPartOne')} | ||
</Text> | ||
<Text style={[styles.textStrong]}> | ||
{/* Use the policyExpenseChat owner's first name or their email if it's undefined or an empty string */} | ||
{lodashGet(props.personalDetails, [props.report.ownerEmail, 'firstName']) || props.report.ownerEmail} | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Where's the empty string come from (mentioned in the comment)? Should we at least have the There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Ah yes I mean to say that if the firstName isn't set we should fall back to ownerEmail. I should be saying "Use the policyExpenseChat owner's first name or fall back to their email if it's unavailable". Could be a bit of a self-explanatory comment though, do you think I should just delete it? There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. I feel an overwhelming almost painful impulse to delete comments if they don't explain something the code doesn't explain itself. But meditation is helping a lot with that. |
||
</Text> | ||
<Text> | ||
{props.translate('reportActionsView.beginningOfChatHistoryPolicyExpenseChatPartTwo')} | ||
</Text> | ||
<Text style={[styles.textStrong]}> | ||
{lodashGet(props.policies, [`${ONYXKEYS.COLLECTION.POLICY}${props.report.policyID}`, 'name'], 'Unknown Policy')} | ||
TomatoToaster marked this conversation as resolved.
Show resolved
Hide resolved
|
||
</Text> | ||
<Text> | ||
{props.translate('reportActionsView.beginningOfChatHistoryPolicyExpenseChatPartThree')} | ||
</Text> | ||
</> | ||
)} | ||
{isChatRoom && ( | ||
<> | ||
<Text> | ||
{isResctrictedRoom | ||
? `${props.translate('reportActionsView.beginningOfChatHistoryRestrictedPartOne')}` | ||
: `${props.translate('reportActionsView.beginningOfChatHistoryPrivatePartOne')}`} | ||
</Text> | ||
<Text style={[styles.textStrong]}> | ||
{lodashGet(chatUsers, '[0].displayName', '')} | ||
TomatoToaster marked this conversation as resolved.
Show resolved
Hide resolved
|
||
</Text> | ||
<Text> | ||
{isResctrictedRoom | ||
? `${props.translate('reportActionsView.beginningOfChatHistoryRestrictedPartTwo')}` | ||
: `${props.translate('reportActionsView.beginningOfChatHistoryPrivatePartTwo')}`} | ||
</Text> | ||
</> | ||
)} | ||
{isDefault && ( | ||
<> | ||
<Text> | ||
{props.translate('reportActionsView.beginningOfChatHistory')} | ||
</Text> | ||
{_.map(chatUsers, ({displayName, pronouns}, index) => ( | ||
<Text key={displayName}> | ||
<Text style={[styles.textStrong]}> | ||
{displayName} | ||
</Text> | ||
))} | ||
</> | ||
)} | ||
{!_.isEmpty(pronouns) && <Text>{` (${pronouns})`}</Text>} | ||
{(index === chatUsers.length - 1) && <Text>.</Text>} | ||
{(index === chatUsers.length - 2) && <Text>{` ${props.translate('common.and')} `}</Text>} | ||
{(index < chatUsers.length - 2) && <Text>, </Text>} | ||
</Text> | ||
))} | ||
</> | ||
)} | ||
</Text> | ||
); | ||
}; | ||
|
@@ -120,5 +151,8 @@ export default compose( | |
personalDetails: { | ||
key: ONYXKEYS.PERSONAL_DETAILS, | ||
}, | ||
policies: { | ||
key: ONYXKEYS.COLLECTION.POLICY, | ||
}, | ||
}), | ||
)(ReportWelcomeText); |
Original file line number | Diff line number | Diff line change | ||
---|---|---|---|---|
|
@@ -210,11 +210,7 @@ function hasReportDraftComment(report) { | |||
* @returns {Array<String>} | ||||
*/ | ||||
function getParticipants(report) { | ||||
const participants = [...lodashGet(report, ['participants'], [])]; | ||||
if (ReportUtils.isPolicyExpenseChat(report) && !_.contains(participants, report.ownerEmail)) { | ||||
participants.push(report.ownerEmail); | ||||
} | ||||
return participants; | ||||
return [...lodashGet(report, ['participants'], [])]; | ||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. OK, now that we are not pushing anything into the participants the spread is not necessary? Probably this whole method can go and the one usage can be updated App/src/libs/OptionsListUtils.js Line 436 in 47b4541
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Oh yeah this is a good point, now I'm not sure why the spread was there in the first place 😅 |
||||
} | ||||
|
||||
/** | ||||
|
Original file line number | Diff line number | Diff line change | ||||
---|---|---|---|---|---|---|
|
@@ -121,9 +121,16 @@ function getUnreadActionCount(report) { | |||||
* @param {Object} report | ||||||
* @return {String[]} | ||||||
*/ | ||||||
function getParticipantEmailsFromReport({sharedReportList, reportNameValuePairs}) { | ||||||
function getParticipantEmailsFromReport({sharedReportList, reportNameValuePairs, ownerEmail}) { | ||||||
const emailArray = _.map(sharedReportList, participant => participant.email); | ||||||
return (ReportUtils.isChatRoom(reportNameValuePairs) || ReportUtils.isPolicyExpenseChat(reportNameValuePairs)) ? emailArray : _.without(emailArray, currentUserEmail); | ||||||
if (ReportUtils.isChatRoom(reportNameValuePairs)) { | ||||||
return emailArray; | ||||||
} | ||||||
if (ReportUtils.isPolicyExpenseChat(reportNameValuePairs)) { | ||||||
// The owner of the policyExpenseChat isn't in the sharedReportsList so they need to be explicitely included. | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more.
Suggested change
|
||||||
return [ownerEmail, ...emailArray]; | ||||||
} | ||||||
return _.without(emailArray, currentUserEmail); | ||||||
TomatoToaster marked this conversation as resolved.
Show resolved
Hide resolved
|
||||||
} | ||||||
|
||||||
/** | ||||||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nice one, that comment didn't really match the prop name.