From 162ef4e119654b1722819e3feaf7d758fde78b2e Mon Sep 17 00:00:00 2001 From: neil-marcellini Date: Wed, 3 Aug 2022 13:32:47 -0700 Subject: [PATCH 01/33] Create updatePolicyRoomName for api refactor --- src/libs/actions/Report.js | 46 ++++++++++++++++++++++++++++++++++++++ 1 file changed, 46 insertions(+) diff --git a/src/libs/actions/Report.js b/src/libs/actions/Report.js index 31384254d8a..a8780ae91dd 100644 --- a/src/libs/actions/Report.js +++ b/src/libs/actions/Report.js @@ -1466,6 +1466,52 @@ function renameReport(reportID, reportName) { .finally(() => Onyx.set(ONYXKEYS.IS_LOADING_RENAME_POLICY_ROOM, false)); } +/** + * Update the policy room name. + * + * @param {Object} policyRoomReport + * @param {*} name The updated name + */ +function updatePolicyRoomName(policyRoomReport, name) { + const reportID = policyRoomReport.reportID; + const previousName = policyRoomReport.name; + const optimisticData = [ + { + onyxMethod: CONST.ONYX.METHOD.MERGE, + key: `${ONYXKEYS.COLLECTION.REPORT}${reportID}`, + value: { + name, + pendingFields: { + name: 'update', + }, + }, + }, + ]; + const successData = [ + { + + onyxMethod: CONST.ONYX.METHOD.MERGE, + key: `${ONYXKEYS.COLLECTION.REPORT}${reportID}`, + value: { + pendingFields: { + name: null, + }, + }, + }, + ]; + const failureData = [ + { + + onyxMethod: CONST.ONYX.METHOD.MERGE, + key: `${ONYXKEYS.COLLECTION.REPORT}${reportID}`, + value: { + name: previousName, + }, + }, + ]; + API.write('UpdatePolicyRoomName', {reportID, name}, {optimisticData, successData, failureData}); +} + /** * @param {Number} reportID * @param {Boolean} isComposerFullSize From 0e38b5aaa2415efdab9404eedb9e70c3a7c8db5e Mon Sep 17 00:00:00 2001 From: neil-marcellini Date: Mon, 8 Aug 2022 11:25:04 -0700 Subject: [PATCH 02/33] Use reportName param for WAF --- src/libs/actions/Report.js | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/src/libs/actions/Report.js b/src/libs/actions/Report.js index a8780ae91dd..677fe7432a8 100644 --- a/src/libs/actions/Report.js +++ b/src/libs/actions/Report.js @@ -1470,19 +1470,19 @@ function renameReport(reportID, reportName) { * Update the policy room name. * * @param {Object} policyRoomReport - * @param {*} name The updated name + * @param {*} reportName The updated reportName */ -function updatePolicyRoomName(policyRoomReport, name) { +function updatePolicyRoomName(policyRoomReport, reportName) { const reportID = policyRoomReport.reportID; - const previousName = policyRoomReport.name; + const previousName = policyRoomReport.reportName; const optimisticData = [ { onyxMethod: CONST.ONYX.METHOD.MERGE, key: `${ONYXKEYS.COLLECTION.REPORT}${reportID}`, value: { - name, + reportName, pendingFields: { - name: 'update', + reportName: 'update', }, }, }, @@ -1494,7 +1494,7 @@ function updatePolicyRoomName(policyRoomReport, name) { key: `${ONYXKEYS.COLLECTION.REPORT}${reportID}`, value: { pendingFields: { - name: null, + reportName: null, }, }, }, @@ -1505,11 +1505,11 @@ function updatePolicyRoomName(policyRoomReport, name) { onyxMethod: CONST.ONYX.METHOD.MERGE, key: `${ONYXKEYS.COLLECTION.REPORT}${reportID}`, value: { - name: previousName, + reportName: previousName, }, }, ]; - API.write('UpdatePolicyRoomName', {reportID, name}, {optimisticData, successData, failureData}); + API.write('UpdatePolicyRoomName', {reportID, reportName}, {optimisticData, successData, failureData}); } /** From 303a0a36c48cf22d8840eb40412012ab3f5b790e Mon Sep 17 00:00:00 2001 From: neil-marcellini Date: Mon, 8 Aug 2022 11:32:46 -0700 Subject: [PATCH 03/33] Use new updatePolicyRoomName command --- src/libs/actions/Report.js | 1 + src/pages/ReportSettingsPage.js | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/src/libs/actions/Report.js b/src/libs/actions/Report.js index 677fe7432a8..8f6f0a11a74 100644 --- a/src/libs/actions/Report.js +++ b/src/libs/actions/Report.js @@ -1664,4 +1664,5 @@ export { openReport, openPaymentDetailsPage, createOptimisticReport, + updatePolicyRoomName, }; diff --git a/src/pages/ReportSettingsPage.js b/src/pages/ReportSettingsPage.js index d011fc7e838..bd32c9155d7 100644 --- a/src/pages/ReportSettingsPage.js +++ b/src/pages/ReportSettingsPage.js @@ -123,7 +123,7 @@ class ReportSettingsPage extends Component { Growl.success(this.props.translate('newRoomPage.policyRoomRenamed')); return; } - Report.renameReport(this.props.report.reportID, this.state.newRoomName); + Report.updatePolicyRoomName(this.props.report, this.state.newRoomName); } validate() { From f265e7e9dcfe2c502f26d25c7f0b496bcdf25731 Mon Sep 17 00:00:00 2001 From: neil-marcellini Date: Mon, 8 Aug 2022 17:00:34 -0700 Subject: [PATCH 04/33] Add offline feedback / errors for policy room name --- src/components/RoomNameInput.js | 10 ++++++- src/libs/actions/Report.js | 17 +++++++++++ src/pages/ReportSettingsPage.js | 50 ++++++++++++++++++++++++++++----- 3 files changed, 69 insertions(+), 8 deletions(-) diff --git a/src/components/RoomNameInput.js b/src/components/RoomNameInput.js index 178ad3d24b5..8bd14fe9408 100644 --- a/src/components/RoomNameInput.js +++ b/src/components/RoomNameInput.js @@ -43,6 +43,9 @@ const propTypes = { /** ID of the policy */ id: PropTypes.string, }).isRequired, + + /** A ref forwarded to the TextInput */ + forwardedRef: PropTypes.func, }; const defaultProps = { @@ -51,6 +54,7 @@ const defaultProps = { disabled: false, errorText: '', ...fullPolicyDefaultProps, + forwardedRef: () => {}, }; class RoomNameInput extends Component { @@ -91,6 +95,7 @@ class RoomNameInput extends Component { render() { return ( ( + // eslint-disable-next-line react/jsx-props-no-spreading + +))); diff --git a/src/libs/actions/Report.js b/src/libs/actions/Report.js index 8f6f0a11a74..cfe14e8a94f 100644 --- a/src/libs/actions/Report.js +++ b/src/libs/actions/Report.js @@ -1512,6 +1512,22 @@ function updatePolicyRoomName(policyRoomReport, reportName) { API.write('UpdatePolicyRoomName', {reportID, reportName}, {optimisticData, successData, failureData}); } +/** + * Clear policy room name errors. + * + * @param {Number} reportID The reportID of the policy room. + */ +function clearPolicyRoomNameErrors(reportID) { + Onyx.merge(`${ONYXKEYS.COLLECTION.REPORT}${reportID}`, { + errorFields: { + reportName: null, + }, + pendingFields: { + reportName: null, + }, + }); +} + /** * @param {Number} reportID * @param {Boolean} isComposerFullSize @@ -1665,4 +1681,5 @@ export { openPaymentDetailsPage, createOptimisticReport, updatePolicyRoomName, + clearPolicyRoomNameErrors, }; diff --git a/src/pages/ReportSettingsPage.js b/src/pages/ReportSettingsPage.js index bd32c9155d7..abf13381e45 100644 --- a/src/pages/ReportSettingsPage.js +++ b/src/pages/ReportSettingsPage.js @@ -3,6 +3,7 @@ import PropTypes from 'prop-types'; import {View, ScrollView} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; +import lodashGet from 'lodash/get'; import CONST from '../CONST'; import ONYXKEYS from '../ONYXKEYS'; import styles from '../styles/styles'; @@ -20,6 +21,7 @@ import Picker from '../components/Picker'; import withFullPolicy, {fullPolicyDefaultProps, fullPolicyPropTypes} from './workspace/withFullPolicy'; import * as ValidationUtils from '../libs/ValidationUtils'; import Growl from '../libs/Growl'; +import OfflineWithFeedback from '../components/OfflineWithFeedback'; const propTypes = { /** Route params */ @@ -107,14 +109,41 @@ class ReportSettingsPage extends Component { }, }; + this.roomNameInputRef = null; + this.state = { newRoomName: this.props.report.reportName, errors: {}, }; + this.setRoomNameInputRef = this.setRoomNameInputRef.bind(this); + this.onDismissRoomNameError = this.onDismissRoomNameError.bind(this); this.validateAndRenameReport = this.validateAndRenameReport.bind(this); } + /** + * When the user dismisses the error updating the policy room name, + * reset the report name to the previously saved name and clear errors. + */ + onDismissRoomNameError() { + this.setState({newRoomName: this.props.report.reportName}); + + // Reset the input's value back to the previously saved report name + if (this.roomNameInputRef) { + this.roomNameInputRef.value = this.props.report.reportName.replace(CONST.POLICY.ROOM_PREFIX, ''); + } + Report.clearPolicyRoomNameErrors(this.props.report.reportID); + } + + /** + * Set the room name input ref + * + * @param {Element} el + */ + setRoomNameInputRef(el) { + this.roomNameInputRef = el; + } + validateAndRenameReport() { if (!this.validate()) { return; @@ -208,13 +237,20 @@ class ReportSettingsPage extends Component { ) : ( - this.clearErrorAndSetValue('newRoomName', newRoomName)} - disabled={shouldDisableRename} - /> + + this.clearErrorAndSetValue('newRoomName', newRoomName)} + disabled={shouldDisableRename} + /> + )} {!shouldDisableRename && ( From 15fbbf84737b90822d1f4a11ac5d531d0801dd83 Mon Sep 17 00:00:00 2001 From: neil-marcellini Date: Mon, 8 Aug 2022 17:05:16 -0700 Subject: [PATCH 05/33] Use rbr pending action update constant --- src/libs/actions/Report.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/libs/actions/Report.js b/src/libs/actions/Report.js index cfe14e8a94f..4801170fc33 100644 --- a/src/libs/actions/Report.js +++ b/src/libs/actions/Report.js @@ -1482,7 +1482,7 @@ function updatePolicyRoomName(policyRoomReport, reportName) { value: { reportName, pendingFields: { - reportName: 'update', + reportName: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE, }, }, }, From e657bd8497b67eb7e1b324a5765f2e692293e6b5 Mon Sep 17 00:00:00 2001 From: neil-marcellini Date: Mon, 8 Aug 2022 17:06:59 -0700 Subject: [PATCH 06/33] Fix JSDoc param type --- src/libs/actions/Report.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/libs/actions/Report.js b/src/libs/actions/Report.js index 4801170fc33..7aad088144f 100644 --- a/src/libs/actions/Report.js +++ b/src/libs/actions/Report.js @@ -1470,7 +1470,7 @@ function renameReport(reportID, reportName) { * Update the policy room name. * * @param {Object} policyRoomReport - * @param {*} reportName The updated reportName + * @param {String} reportName The updated reportName */ function updatePolicyRoomName(policyRoomReport, reportName) { const reportID = policyRoomReport.reportID; From 2fd2a55b599e81149eee1eec1ed9c0ee8bd402ba Mon Sep 17 00:00:00 2001 From: neil-marcellini Date: Tue, 9 Aug 2022 16:44:42 -0700 Subject: [PATCH 07/33] Pass policyRoomName to UpdatePolicyRoomName --- src/libs/actions/Report.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/libs/actions/Report.js b/src/libs/actions/Report.js index 7aad088144f..7a6641c9f86 100644 --- a/src/libs/actions/Report.js +++ b/src/libs/actions/Report.js @@ -1470,9 +1470,9 @@ function renameReport(reportID, reportName) { * Update the policy room name. * * @param {Object} policyRoomReport - * @param {String} reportName The updated reportName + * @param {String} policyRoomName The updated name for the policy room */ -function updatePolicyRoomName(policyRoomReport, reportName) { +function updatePolicyRoomName(policyRoomReport, policyRoomName) { const reportID = policyRoomReport.reportID; const previousName = policyRoomReport.reportName; const optimisticData = [ @@ -1480,7 +1480,7 @@ function updatePolicyRoomName(policyRoomReport, reportName) { onyxMethod: CONST.ONYX.METHOD.MERGE, key: `${ONYXKEYS.COLLECTION.REPORT}${reportID}`, value: { - reportName, + reportName: policyRoomName, pendingFields: { reportName: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE, }, @@ -1509,7 +1509,7 @@ function updatePolicyRoomName(policyRoomReport, reportName) { }, }, ]; - API.write('UpdatePolicyRoomName', {reportID, reportName}, {optimisticData, successData, failureData}); + API.write('UpdatePolicyRoomName', {reportID, policyRoomName}, {optimisticData, successData, failureData}); } /** From 1847e5a72cc20a769987ffc500a37368a01f3730 Mon Sep 17 00:00:00 2001 From: neil-marcellini Date: Wed, 10 Aug 2022 20:20:23 -0700 Subject: [PATCH 08/33] Check report errors and errorFields also --- src/libs/OptionsListUtils.js | 14 +++++++++++--- 1 file changed, 11 insertions(+), 3 deletions(-) diff --git a/src/libs/OptionsListUtils.js b/src/libs/OptionsListUtils.js index d793bfaaef2..421b72cefed 100644 --- a/src/libs/OptionsListUtils.js +++ b/src/libs/OptionsListUtils.js @@ -191,18 +191,26 @@ function hasReportDraftComment(report, reportsWithDraft = {}) { } /** + * If the report or the report actions have errors, return + * CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR, otherwise an empty string. + * * @param {Object} report * @param {Object} reportActions * @returns {String} */ function getBrickRoadIndicatorStatusForReport(report, reportActions) { + const errors = lodashGet(report, 'errors', {}); + const errorFields = lodashGet(report, 'errorFields', {}); const reportID = lodashGet(report, 'reportID'); const reportsActions = lodashGet(reportActions, `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`, {}); - if (_.isEmpty(reportsActions)) { + + const hasFieldErrors = _.some(errorFields, fieldErrors => !_.isEmpty(fieldErrors)); + const hasReportActionErrors = _.some(reportsActions, action => !_.isEmpty(action.errors)); + + if (_.isEmpty(errors) && !hasFieldErrors && !hasReportActionErrors) { return ''; } - - return _.find(reportsActions, action => !_.isEmpty(action.errors)) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : ''; + return CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR; } /** From f4a7b450b5daa1d532ee17ddda07951b0f65f4f9 Mon Sep 17 00:00:00 2001 From: neil-marcellini Date: Wed, 10 Aug 2022 20:41:02 -0700 Subject: [PATCH 09/33] Add brick road indicator to header view --- src/pages/home/HeaderView.js | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/src/pages/home/HeaderView.js b/src/pages/home/HeaderView.js index 9ad36b43b38..b280aeb7015 100644 --- a/src/pages/home/HeaderView.js +++ b/src/pages/home/HeaderView.js @@ -24,6 +24,8 @@ import CONST from '../../CONST'; import * as ReportUtils from '../../libs/ReportUtils'; import Text from '../../components/Text'; import Tooltip from '../../components/Tooltip'; +import variables from '../../styles/variables'; +import colors from '../../styles/colors'; const propTypes = { /** Toggles the navigationMenu open and closed */ @@ -85,6 +87,7 @@ const HeaderView = (props) => { const avatarTooltip = isChatRoom ? undefined : _.pluck(displayNamesWithTooltips, 'tooltip'); const shouldShowSubscript = isPolicyExpenseChat && !props.report.isOwnPolicyExpenseChat && !ReportUtils.isArchivedRoom(props.report); const icons = ReportUtils.getIcons(props.report, props.personalDetails, props.policies); + const brickRoadIndicator = _.isEmpty(lodashGet(props.report, 'errorFields.reportName', {})) ? '' : CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR; return ( @@ -146,6 +149,16 @@ const HeaderView = (props) => { )} + {brickRoadIndicator === CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR && ( + + + + )} {props.report.hasOutstandingIOU && ( From f952838ac31a7cb185af9f0bfd6ba15746ff4bbd Mon Sep 17 00:00:00 2001 From: neil-marcellini Date: Wed, 10 Aug 2022 20:49:39 -0700 Subject: [PATCH 10/33] Create hasReportNameError --- src/libs/ReportUtils.js | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/src/libs/ReportUtils.js b/src/libs/ReportUtils.js index 515101b5665..e5c6cea8c0c 100644 --- a/src/libs/ReportUtils.js +++ b/src/libs/ReportUtils.js @@ -523,6 +523,14 @@ function generateReportID() { return Math.floor(Math.random() * (Number.MAX_SAFE_INTEGER - 98000000)) + 98000000; } +/** + * @param {Object} report + * @returns {Boolean} + */ +function hasReportNameError(report) { + return _.isEmpty(lodashGet(report, 'errorFields.reportName', {})) ? '' : CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR; +} + export { getReportParticipantsTitle, isReportMessageAttachment, @@ -552,4 +560,5 @@ export { getReportName, navigateToDetailsPage, generateReportID, + hasReportNameError, }; From a77f5039be0d2d3d5ed9f3a866f4df08a2171178 Mon Sep 17 00:00:00 2001 From: neil-marcellini Date: Wed, 10 Aug 2022 20:50:28 -0700 Subject: [PATCH 11/33] Use hasReportNameError in HeaderView --- src/pages/home/HeaderView.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/home/HeaderView.js b/src/pages/home/HeaderView.js index b280aeb7015..dc79a570e4f 100644 --- a/src/pages/home/HeaderView.js +++ b/src/pages/home/HeaderView.js @@ -87,7 +87,7 @@ const HeaderView = (props) => { const avatarTooltip = isChatRoom ? undefined : _.pluck(displayNamesWithTooltips, 'tooltip'); const shouldShowSubscript = isPolicyExpenseChat && !props.report.isOwnPolicyExpenseChat && !ReportUtils.isArchivedRoom(props.report); const icons = ReportUtils.getIcons(props.report, props.personalDetails, props.policies); - const brickRoadIndicator = _.isEmpty(lodashGet(props.report, 'errorFields.reportName', {})) ? '' : CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR; + const brickRoadIndicator = ReportUtils.hasReportNameError(props.report); return ( From b7ad9f84169a438c48f24da716e77d1c3ce5a587 Mon Sep 17 00:00:00 2001 From: neil-marcellini Date: Wed, 10 Aug 2022 20:56:28 -0700 Subject: [PATCH 12/33] Fix hasReportNameError --- src/libs/ReportUtils.js | 2 +- src/pages/home/HeaderView.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/libs/ReportUtils.js b/src/libs/ReportUtils.js index e5c6cea8c0c..2fc0e3b2215 100644 --- a/src/libs/ReportUtils.js +++ b/src/libs/ReportUtils.js @@ -528,7 +528,7 @@ function generateReportID() { * @returns {Boolean} */ function hasReportNameError(report) { - return _.isEmpty(lodashGet(report, 'errorFields.reportName', {})) ? '' : CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR; + return !_.isEmpty(lodashGet(report, 'errorFields.reportName', {})); } export { diff --git a/src/pages/home/HeaderView.js b/src/pages/home/HeaderView.js index dc79a570e4f..93cd78ea63c 100644 --- a/src/pages/home/HeaderView.js +++ b/src/pages/home/HeaderView.js @@ -87,7 +87,7 @@ const HeaderView = (props) => { const avatarTooltip = isChatRoom ? undefined : _.pluck(displayNamesWithTooltips, 'tooltip'); const shouldShowSubscript = isPolicyExpenseChat && !props.report.isOwnPolicyExpenseChat && !ReportUtils.isArchivedRoom(props.report); const icons = ReportUtils.getIcons(props.report, props.personalDetails, props.policies); - const brickRoadIndicator = ReportUtils.hasReportNameError(props.report); + const brickRoadIndicator = ReportUtils.hasReportNameError(props.report) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR : ''; return ( From 5070cbd8a8e221fce6f854f6f33847a3f379f232 Mon Sep 17 00:00:00 2001 From: neil-marcellini Date: Wed, 10 Aug 2022 21:13:53 -0700 Subject: [PATCH 13/33] Allow empty string brickRoadIndicator --- src/components/MenuItem.js | 6 +++--- src/components/menuItemPropTypes.js | 6 +++--- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/src/components/MenuItem.js b/src/components/MenuItem.js index e4cfd785dac..2cf6a227a1e 100644 --- a/src/components/MenuItem.js +++ b/src/components/MenuItem.js @@ -42,7 +42,7 @@ const defaultProps = { onPress: () => {}, interactive: true, fallbackIcon: Expensicons.FallbackAvatar, - brickRoadIndicator: undefined, + brickRoadIndicator: null, }; const MenuItem = props => ( @@ -132,11 +132,11 @@ const MenuItem = props => ( )} - {props.brickRoadIndicator && ( + {Boolean(props.brickRoadIndicator) && ( diff --git a/src/components/menuItemPropTypes.js b/src/components/menuItemPropTypes.js index 27452b4175e..bf54df9ccfc 100644 --- a/src/components/menuItemPropTypes.js +++ b/src/components/menuItemPropTypes.js @@ -67,9 +67,9 @@ const propTypes = { /** A fallback avatar icon to display when there is an error on loading avatar from remote URL. */ fallbackIcon: PropTypes.func, - /** If we need to show a brick road indicator or not. For now only value allowed is `error`, - * but we will add `success` later for manual requests */ - brickRoadIndicator: PropTypes.oneOf(['error']), + /** If we need to show a brick road indicator or not. For now only value allowed is 'error' or '', + * but we will add 'success' later for manual requests */ + brickRoadIndicator: PropTypes.oneOf([CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR, '']), }; export default propTypes; From 20fdbdb7198e4eff3b91ecd9a1e0880a5e5b232b Mon Sep 17 00:00:00 2001 From: neil-marcellini Date: Wed, 10 Aug 2022 21:14:40 -0700 Subject: [PATCH 14/33] Brick road indicator on report details settings --- src/pages/ReportDetailsPage.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/src/pages/ReportDetailsPage.js b/src/pages/ReportDetailsPage.js index 6a1ca6f6089..5731c4908bb 100644 --- a/src/pages/ReportDetailsPage.js +++ b/src/pages/ReportDetailsPage.js @@ -20,6 +20,7 @@ import * as Expensicons from '../components/Icon/Expensicons'; import ROUTES from '../ROUTES'; import MenuItem from '../components/MenuItem'; import Text from '../components/Text'; +import CONST from '../CONST'; const propTypes = { ...withLocalizePropTypes, @@ -156,6 +157,12 @@ class ReportDetailsPage extends Component { {_.map(this.menuItems, (item) => { const keyTitle = item.translationKey ? this.props.translate(item.translationKey) : item.title; + const brickRoadIndicator = ( + ReportUtils.hasReportNameError(this.props.report) + && item.translationKey === 'common.settings' + ) + ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR + : null; return ( ); })} From b3883151471cc61ce38bc820fcd3e8dbbd472602 Mon Sep 17 00:00:00 2001 From: neil-marcellini Date: Thu, 11 Aug 2022 12:23:52 -0700 Subject: [PATCH 15/33] Use empty string for empty brickRoadIndicator --- src/pages/ReportDetailsPage.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/ReportDetailsPage.js b/src/pages/ReportDetailsPage.js index 5731c4908bb..8bfbdbe1a33 100644 --- a/src/pages/ReportDetailsPage.js +++ b/src/pages/ReportDetailsPage.js @@ -162,7 +162,7 @@ class ReportDetailsPage extends Component { && item.translationKey === 'common.settings' ) ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR - : null; + : ''; return ( Date: Thu, 11 Aug 2022 15:03:28 -0700 Subject: [PATCH 16/33] Allow the error message to use the full row --- src/pages/ReportSettingsPage.js | 68 ++++++++++++++++----------------- 1 file changed, 34 insertions(+), 34 deletions(-) diff --git a/src/pages/ReportSettingsPage.js b/src/pages/ReportSettingsPage.js index abf13381e45..a2ec36e62c9 100644 --- a/src/pages/ReportSettingsPage.js +++ b/src/pages/ReportSettingsPage.js @@ -224,24 +224,24 @@ class ReportSettingsPage extends Component { {shouldShowRoomName && ( - - - {shouldDisableRename ? ( - - - {this.props.translate('newRoomPage.roomName')} - - - {this.state.newRoomName} - - - ) - : ( - + + + + {shouldDisableRename ? ( + + + {this.props.translate('newRoomPage.roomName')} + + + {this.state.newRoomName} + + + ) + : ( this.clearErrorAndSetValue('newRoomName', newRoomName)} disabled={shouldDisableRename} /> - - )} + )} + + {!shouldDisableRename && ( +