-
Notifications
You must be signed in to change notification settings - Fork 2.8k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #7831 from Expensify/Rory-ArchiveUI
Implement Archived Workspace Chat UI
- Loading branch information
Showing
21 changed files
with
312 additions
and
70 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,93 @@ | ||
| import lodashGet from 'lodash/get'; | ||
| import React from 'react'; | ||
| import PropTypes from 'prop-types'; | ||
| import {withOnyx} from 'react-native-onyx'; | ||
| import CONST from '../CONST'; | ||
| import Banner from './Banner'; | ||
| import withLocalize, {withLocalizePropTypes} from './withLocalize'; | ||
| import compose from '../libs/compose'; | ||
| import personalDetailsPropType from '../pages/personalDetailsPropType'; | ||
| import ONYXKEYS from '../ONYXKEYS'; | ||
|
|
||
| const propTypes = { | ||
| /** The reason this report was archived */ | ||
| reportClosedAction: PropTypes.shape({ | ||
| /** Message attached to the report closed action */ | ||
| originalMessage: PropTypes.shape({ | ||
| /** The reason the report was closed */ | ||
| reason: PropTypes.string.isRequired, | ||
|
|
||
| /** (For accountMerged reason only), the email of the previous owner of this report. */ | ||
| oldLogin: PropTypes.string, | ||
|
|
||
| /** (For accountMerged reason only), the email of the account the previous owner was merged into */ | ||
| newLogin: PropTypes.string, | ||
| }).isRequired, | ||
| }), | ||
|
|
||
| /** The archived report */ | ||
| report: PropTypes.shape({ | ||
| /** The policy this report is attached to */ | ||
| policyID: PropTypes.string, | ||
| }).isRequired, | ||
|
|
||
| /** Personal details of all users */ | ||
| personalDetails: PropTypes.objectOf(personalDetailsPropType).isRequired, | ||
|
|
||
| /** The list of policies the user has access to. */ | ||
| policies: PropTypes.objectOf(PropTypes.shape({ | ||
| /** The name of the policy */ | ||
| name: PropTypes.string, | ||
| })).isRequired, | ||
|
|
||
| ...withLocalizePropTypes, | ||
| }; | ||
|
|
||
| const defaultProps = { | ||
| reportClosedAction: { | ||
| originalMessage: { | ||
| reason: CONST.REPORT.ARCHIVE_REASON.DEFAULT, | ||
| }, | ||
| }, | ||
| }; | ||
|
|
||
| const ArchivedReportFooter = (props) => { | ||
| const archiveReason = lodashGet(props.reportClosedAction, 'originalMessage.reason', CONST.REPORT.ARCHIVE_REASON.DEFAULT); | ||
| const policyName = lodashGet(props.policies, `${ONYXKEYS.COLLECTION.POLICY}${props.report.policyID}.name`); | ||
| let displayName = lodashGet(props.personalDetails, `${props.report.ownerEmail}.displayName`, props.report.ownerEmail); | ||
|
|
||
| let oldDisplayName; | ||
| if (archiveReason === CONST.REPORT.ARCHIVE_REASON.ACCOUNT_MERGED) { | ||
| const newLogin = props.reportClosedAction.originalMessage.newLogin; | ||
| const oldLogin = props.reportClosedAction.originalMessage.oldLogin; | ||
| displayName = lodashGet(props.personalDetails, `${newLogin}.displayName`, newLogin); | ||
| oldDisplayName = lodashGet(props.personalDetails, `${oldLogin}.displayName`, oldLogin); | ||
| } | ||
|
|
||
| return ( | ||
| <Banner | ||
| text={props.translate(`reportArchiveReasons.${archiveReason}`, { | ||
| displayName: `<strong>${displayName}</strong>`, | ||
| oldDisplayName: `<strong>${oldDisplayName}</strong>`, | ||
| policyName: `<strong>${policyName}</strong>`, | ||
| })} | ||
| shouldRenderHTML={archiveReason !== CONST.REPORT.ARCHIVE_REASON.DEFAULT} | ||
| /> | ||
| ); | ||
| }; | ||
|
|
||
| ArchivedReportFooter.propTypes = propTypes; | ||
| ArchivedReportFooter.defaultProps = defaultProps; | ||
| ArchivedReportFooter.displayName = 'ArchivedReportFooter'; | ||
|
|
||
| export default compose( | ||
| withLocalize, | ||
| withOnyx({ | ||
| personalDetails: { | ||
| key: ONYXKEYS.PERSONAL_DETAILS, | ||
| }, | ||
| policies: { | ||
| key: ONYXKEYS.COLLECTION.POLICY, | ||
| }, | ||
| }), | ||
| )(ArchivedReportFooter); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,56 @@ | ||
| import React, {memo} from 'react'; | ||
| import PropTypes from 'prop-types'; | ||
| import {View} from 'react-native'; | ||
| import Hoverable from './Hoverable'; | ||
| import Icon from './Icon'; | ||
| import * as Expensicons from './Icon/Expensicons'; | ||
| import RenderHTML from './RenderHTML'; | ||
| import Text from './Text'; | ||
| import styles from '../styles/styles'; | ||
| import * as StyleUtils from '../styles/StyleUtils'; | ||
| import getButtonState from '../libs/getButtonState'; | ||
|
|
||
| const propTypes = { | ||
| /** Text to display in the banner. */ | ||
| text: PropTypes.string.isRequired, | ||
|
|
||
| /** Should this component render the text as HTML? */ | ||
| shouldRenderHTML: PropTypes.bool, | ||
| }; | ||
|
|
||
| const defaultProps = { | ||
| shouldRenderHTML: false, | ||
| }; | ||
|
|
||
| const Banner = props => ( | ||
| <Hoverable> | ||
| {isHovered => ( | ||
| <View style={[ | ||
| styles.flexRow, | ||
| styles.alignItemsCenter, | ||
| styles.p5, | ||
| styles.borderRadiusNormal, | ||
| isHovered ? styles.activeComponentBG : styles.hoveredComponentBG, | ||
| ]} | ||
| > | ||
| <View style={[styles.mr3]}> | ||
| <Icon | ||
| src={Expensicons.Exclamation} | ||
| fill={StyleUtils.getIconFillColor(getButtonState(isHovered))} | ||
| /> | ||
| </View> | ||
| { | ||
| props.shouldRenderHTML | ||
| ? <RenderHTML html={props.text} /> | ||
| : <Text>{props.text}</Text> | ||
| } | ||
| </View> | ||
| )} | ||
| </Hoverable> | ||
| ); | ||
|
|
||
| Banner.propTypes = propTypes; | ||
| Banner.defaultProps = defaultProps; | ||
| Banner.displayName = 'Banner'; | ||
|
|
||
| export default memo(Banner); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.