From 9bc0018282ec3ba9a4cdd0c973a07c4958a8704a Mon Sep 17 00:00:00 2001 From: Victor Nyagudi Date: Wed, 25 Oct 2023 09:49:05 +0300 Subject: [PATCH 1/6] Change error text color to red if the message type is 'error' --- src/components/DotIndicatorMessage.js | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/components/DotIndicatorMessage.js b/src/components/DotIndicatorMessage.js index fc4d74339d6e..cb72a22d065c 100644 --- a/src/components/DotIndicatorMessage.js +++ b/src/components/DotIndicatorMessage.js @@ -57,19 +57,21 @@ function DotIndicatorMessage(props) { .map((message) => Localize.translateIfPhraseKey(message)) .value(); + const isErrorMessageType = props.type === 'error'; + return ( {_.map(sortedMessages, (message, i) => ( {message} From 39472e668950c79180686265e914a410fbd2dc82 Mon Sep 17 00:00:00 2001 From: Victor Nyagudi Date: Wed, 25 Oct 2023 10:08:52 +0300 Subject: [PATCH 2/6] Rename isErrorMessageType to isErrorMessage --- src/components/DotIndicatorMessage.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/DotIndicatorMessage.js b/src/components/DotIndicatorMessage.js index cb72a22d065c..762ff5ddcad2 100644 --- a/src/components/DotIndicatorMessage.js +++ b/src/components/DotIndicatorMessage.js @@ -57,21 +57,21 @@ function DotIndicatorMessage(props) { .map((message) => Localize.translateIfPhraseKey(message)) .value(); - const isErrorMessageType = props.type === 'error'; + const isErrorMessage = props.type === 'error'; return ( {_.map(sortedMessages, (message, i) => ( {message} From a48b5ce52e5d5cd5c8b477fffe24e6f7ebbf047a Mon Sep 17 00:00:00 2001 From: Victor Nyagudi Date: Sat, 28 Oct 2023 13:54:22 +0300 Subject: [PATCH 3/6] Create helper method to style red dot error text --- src/components/DotIndicatorMessage.js | 3 ++- .../LocationErrorMessage/BaseLocationErrorMessage.js | 5 +++-- src/styles/StyleUtils.ts | 8 ++++++++ 3 files changed, 13 insertions(+), 3 deletions(-) diff --git a/src/components/DotIndicatorMessage.js b/src/components/DotIndicatorMessage.js index 762ff5ddcad2..05006e05686b 100644 --- a/src/components/DotIndicatorMessage.js +++ b/src/components/DotIndicatorMessage.js @@ -4,6 +4,7 @@ import PropTypes from 'prop-types'; import {View} from 'react-native'; import styles from '../styles/styles'; import stylePropTypes from '../styles/stylePropTypes'; +import * as StyleUtils from '../styles/StyleUtils'; import Icon from './Icon'; import * as Expensicons from './Icon/Expensicons'; import themeColors from '../styles/themes/default'; @@ -71,7 +72,7 @@ function DotIndicatorMessage(props) { {_.map(sortedMessages, (message, i) => ( {message} diff --git a/src/components/LocationErrorMessage/BaseLocationErrorMessage.js b/src/components/LocationErrorMessage/BaseLocationErrorMessage.js index 3a638f3e999e..03dc1fe3913a 100644 --- a/src/components/LocationErrorMessage/BaseLocationErrorMessage.js +++ b/src/components/LocationErrorMessage/BaseLocationErrorMessage.js @@ -4,6 +4,7 @@ import {View} from 'react-native'; import CONST from '../../CONST'; import colors from '../../styles/colors'; import styles from '../../styles/styles'; +import * as StyleUtils from '../../styles/StyleUtils'; import Icon from '../Icon'; import * as Expensicons from '../Icon/Expensicons'; import PressableWithoutFeedback from '../Pressable/PressableWithoutFeedback'; @@ -42,14 +43,14 @@ function BaseLocationErrorMessage({onClose, onAllowLocationLinkPress, locationEr {isPermissionDenied ? ( - {`${translate('location.permissionDenied')} ${translate('location.please')}`} + {`${translate('location.permissionDenied')} ${translate('location.please')}`} {` ${translate('location.allowPermission')} `} - {translate('location.tryAgain')} + {translate('location.tryAgain')} ) : ( {translate('location.notFound')} diff --git a/src/styles/StyleUtils.ts b/src/styles/StyleUtils.ts index 48100b2efb60..c0988875b994 100644 --- a/src/styles/StyleUtils.ts +++ b/src/styles/StyleUtils.ts @@ -1316,6 +1316,13 @@ function getTransparentColor(color: string) { return `${color}00`; } +/** + * Get the styles of the text next to dot indicators + */ +function getDotIndicatorTextStyles(isErrorText: boolean = true): TextStyle { + return isErrorText ? {...styles.offlineFeedback.text, color: styles.formError.color} : {...styles.offlineFeedback.text}; +} + export { combineStyles, displayIfTrue, @@ -1361,6 +1368,7 @@ export { getDirectionStyle, getDisabledLinkStyles, getDropDownButtonHeight, + getDotIndicatorTextStyles, getEmojiPickerListHeight, getEmojiPickerStyle, getEmojiReactionBubbleStyle, From 8cfc2d5b20f3183778dec2ac44b397080a36fb66 Mon Sep 17 00:00:00 2001 From: Victor Nyagudi Date: Sat, 28 Oct 2023 14:07:54 +0300 Subject: [PATCH 4/6] Remove unnecessary type annotation --- src/styles/StyleUtils.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/styles/StyleUtils.ts b/src/styles/StyleUtils.ts index c0988875b994..540db0a04cd1 100644 --- a/src/styles/StyleUtils.ts +++ b/src/styles/StyleUtils.ts @@ -1319,7 +1319,7 @@ function getTransparentColor(color: string) { /** * Get the styles of the text next to dot indicators */ -function getDotIndicatorTextStyles(isErrorText: boolean = true): TextStyle { +function getDotIndicatorTextStyles(isErrorText = true): TextStyle { return isErrorText ? {...styles.offlineFeedback.text, color: styles.formError.color} : {...styles.offlineFeedback.text}; } From b992aed61ea0170b1bd6ad784c673546caa40fea Mon Sep 17 00:00:00 2001 From: Victor Nyagudi Date: Sat, 28 Oct 2023 14:20:12 +0300 Subject: [PATCH 5/6] Run prettier for prettier diff --- src/styles/StyleUtils.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/styles/StyleUtils.ts b/src/styles/StyleUtils.ts index 540db0a04cd1..fa3c3571ebc1 100644 --- a/src/styles/StyleUtils.ts +++ b/src/styles/StyleUtils.ts @@ -1317,7 +1317,7 @@ function getTransparentColor(color: string) { } /** - * Get the styles of the text next to dot indicators + * Get the styles of the text next to dot indicators */ function getDotIndicatorTextStyles(isErrorText = true): TextStyle { return isErrorText ? {...styles.offlineFeedback.text, color: styles.formError.color} : {...styles.offlineFeedback.text}; From f497b162945fbe9e37b130b923192f758a9ab401 Mon Sep 17 00:00:00 2001 From: Victor Nyagudi Date: Sun, 29 Oct 2023 00:21:15 +0300 Subject: [PATCH 6/6] Run prettier to fix diffs --- src/components/DotIndicatorMessage.js | 2 +- src/components/LocationErrorMessage/BaseLocationErrorMessage.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/DotIndicatorMessage.js b/src/components/DotIndicatorMessage.js index afeaf68c35cc..26e01f0eee8a 100644 --- a/src/components/DotIndicatorMessage.js +++ b/src/components/DotIndicatorMessage.js @@ -1,11 +1,11 @@ import PropTypes from 'prop-types'; import React from 'react'; import {View} from 'react-native'; -import * as StyleUtils from '@styles/StyleUtils'; import _ from 'underscore'; import * as Localize from '@libs/Localize'; import stylePropTypes from '@styles/stylePropTypes'; import styles from '@styles/styles'; +import * as StyleUtils from '@styles/StyleUtils'; import themeColors from '@styles/themes/default'; import Icon from './Icon'; import * as Expensicons from './Icon/Expensicons'; diff --git a/src/components/LocationErrorMessage/BaseLocationErrorMessage.js b/src/components/LocationErrorMessage/BaseLocationErrorMessage.js index 7c812d1864a4..b5114acaa36b 100644 --- a/src/components/LocationErrorMessage/BaseLocationErrorMessage.js +++ b/src/components/LocationErrorMessage/BaseLocationErrorMessage.js @@ -1,7 +1,6 @@ import PropTypes from 'prop-types'; import React from 'react'; import {View} from 'react-native'; -import * as StyleUtils from '@styles/StyleUtils'; import Icon from '@components/Icon'; import * as Expensicons from '@components/Icon/Expensicons'; import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeedback'; @@ -11,6 +10,7 @@ import Tooltip from '@components/Tooltip'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import colors from '@styles/colors'; import styles from '@styles/styles'; +import * as StyleUtils from '@styles/StyleUtils'; import CONST from '@src/CONST'; import * as locationErrorMessagePropTypes from './locationErrorMessagePropTypes';