From 52ff093865e5f7a3914da7d84cb2aa6615bf6752 Mon Sep 17 00:00:00 2001 From: Yauheni Pasiukevich Date: Fri, 27 Oct 2023 15:38:00 +0200 Subject: [PATCH 01/11] [TS migration] Migrate 'MentionSuggestions.js' component to TypeScript --- src/components/AvatarTypes.ts | 13 +++ ...nSuggestions.js => MentionSuggestions.tsx} | 103 ++++++++---------- src/styles/StyleUtils.ts | 4 +- 3 files changed, 61 insertions(+), 59 deletions(-) create mode 100644 src/components/AvatarTypes.ts rename src/components/{MentionSuggestions.js => MentionSuggestions.tsx} (56%) diff --git a/src/components/AvatarTypes.ts b/src/components/AvatarTypes.ts new file mode 100644 index 000000000000..2e94904b0d7c --- /dev/null +++ b/src/components/AvatarTypes.ts @@ -0,0 +1,13 @@ +import CONST from '@src/CONST'; + +type AvatarFunctionType = () => void; + +type AvatarType = { + source: string | AvatarFunctionType; + type: typeof CONST.ICON_TYPE_AVATAR | typeof CONST.ICON_TYPE_WORKSPACE; + name: string; + id: number | string; + fallbackIcon: string | AvatarFunctionType; +}; + +export default AvatarType; diff --git a/src/components/MentionSuggestions.js b/src/components/MentionSuggestions.tsx similarity index 56% rename from src/components/MentionSuggestions.js rename to src/components/MentionSuggestions.tsx index d18b8947e68d..fe7ce2896bfc 100644 --- a/src/components/MentionSuggestions.js +++ b/src/components/MentionSuggestions.tsx @@ -1,7 +1,5 @@ -import PropTypes from 'prop-types'; import React from 'react'; import {View} from 'react-native'; -import _ from 'underscore'; import getStyledTextArray from '@libs/GetStyledTextArray'; import styles from '@styles/styles'; import * as StyleUtils from '@styles/StyleUtils'; @@ -9,65 +7,58 @@ import themeColors from '@styles/themes/default'; import CONST from '@src/CONST'; import AutoCompleteSuggestions from './AutoCompleteSuggestions'; import Avatar from './Avatar'; -import avatarPropTypes from './avatarPropTypes'; +import AvatarTypes from './AvatarTypes'; import Text from './Text'; -const propTypes = { - /** The index of the highlighted mention */ - highlightedMentionIndex: PropTypes.number, +type Mention = { + /** Display name of the user */ + text: string; - /** Array of suggested mentions */ - mentions: PropTypes.arrayOf( - PropTypes.shape({ - /** Display name of the user */ - text: PropTypes.string, + /** Email/phone number of the user */ + alternateText: string; + + /** Array of icons of the user. We use the first element of this array */ + icons: AvatarTypes[]; +}; - /** Email/phone number of the user */ - alternateText: PropTypes.string, +type MentionSuggestionsProps = { + /** The index of the highlighted mention */ + highlightedMentionIndex?: number; - /** Array of icons of the user. We use the first element of this array */ - icons: PropTypes.arrayOf(avatarPropTypes), - }), - ).isRequired, + /** Array of suggested mentions */ + mentions: Mention[]; /** Fired when the user selects an mention */ - onSelect: PropTypes.func.isRequired, + onSelect: () => void; /** Mention prefix that follows the @ sign */ - prefix: PropTypes.string.isRequired, + prefix: string; /** Show that we can use large mention picker. * Depending on available space and whether the input is expanded, we can have a small or large mention suggester. * When this value is false, the suggester will have a height of 2.5 items. When this value is true, the height can be up to 5 items. */ - isMentionPickerLarge: PropTypes.bool.isRequired, + isMentionPickerLarge: boolean; /** Meaures the parent container's position and dimensions. */ - measureParentContainer: PropTypes.func, -}; - -const defaultProps = { - highlightedMentionIndex: 0, - measureParentContainer: () => {}, + measureParentContainer: () => void; }; /** * Create unique keys for each mention item - * @param {Object} item - * @param {Number} index - * @returns {String} + * @param item + * @param index */ -const keyExtractor = (item) => item.alternateText; +const keyExtractor = (item: Mention) => item.alternateText; -function MentionSuggestions(props) { +function MentionSuggestions({prefix, mentions, highlightedMentionIndex = 0, onSelect, isMentionPickerLarge, measureParentContainer = () => {}}: MentionSuggestionsProps) { /** * Render a suggestion menu item component. - * @param {Object} item - * @returns {JSX.Element} + * @param item */ - const renderSuggestionMenuItem = (item) => { + const renderSuggestionMenuItem = (item: Mention) => { const isIcon = item.text === CONST.AUTO_COMPLETE_SUGGESTER.HERE_TEXT; - const styledDisplayName = getStyledTextArray(item.text, props.prefix); - const styledHandle = item.text === item.alternateText ? '' : getStyledTextArray(item.alternateText, props.prefix); + const styledDisplayName = getStyledTextArray(item.text, prefix); + const styledHandle = item.text === item.alternateText ? '' : getStyledTextArray(item.alternateText, prefix); return ( @@ -85,9 +76,9 @@ function MentionSuggestions(props) { style={[styles.mentionSuggestionsText, styles.flexShrink1]} numberOfLines={1} > - {_.map(styledDisplayName, ({text, isColored}, i) => ( + {styledDisplayName.map(({text, isColored}) => ( {text} @@ -98,18 +89,18 @@ function MentionSuggestions(props) { style={[styles.mentionSuggestionsText, styles.flex1]} numberOfLines={1} > - {_.map( - styledHandle, - ({text, isColored}, i) => - text !== '' && ( - - {text} - - ), - )} + {styledHandle && + styledHandle.map( + ({text, isColored}) => + text !== '' && ( + + {text} + + ), + )} ); @@ -117,20 +108,18 @@ function MentionSuggestions(props) { return ( ); } -MentionSuggestions.propTypes = propTypes; -MentionSuggestions.defaultProps = defaultProps; MentionSuggestions.displayName = 'MentionSuggestions'; export default MentionSuggestions; diff --git a/src/styles/StyleUtils.ts b/src/styles/StyleUtils.ts index f58d2c9a236d..77fe3dea9faa 100644 --- a/src/styles/StyleUtils.ts +++ b/src/styles/StyleUtils.ts @@ -1,5 +1,5 @@ import {CSSProperties} from 'react'; -import {Animated, DimensionValue, ImageStyle, PressableStateCallbackType, TextStyle, ViewStyle} from 'react-native'; +import {Animated, DimensionValue, ImageStyle, PressableStateCallbackType, StyleProp, TextStyle, ViewStyle} from 'react-native'; import {EdgeInsets} from 'react-native-safe-area-context'; import {ValueOf} from 'type-fest'; import * as Browser from '@libs/Browser'; @@ -1012,7 +1012,7 @@ function getAutoCompleteSuggestionContainerStyle(itemsHeight: number): ViewStyle /** * Select the correct color for text. */ -function getColoredBackgroundStyle(isColored: boolean): ViewStyle { +function getColoredBackgroundStyle(isColored: boolean): StyleProp | undefined { return {backgroundColor: isColored ? themeColors.link : undefined}; } From 7ce4f40b9c50b373cc335abff22b647a879ce4fe Mon Sep 17 00:00:00 2001 From: Yauheni Pasiukevich Date: Tue, 31 Oct 2023 12:54:17 +0100 Subject: [PATCH 02/11] remove redundant styles --- src/styles/styles.ts | 21 --------------------- 1 file changed, 21 deletions(-) diff --git a/src/styles/styles.ts b/src/styles/styles.ts index 589c3756042f..51dd70e70f2e 100644 --- a/src/styles/styles.ts +++ b/src/styles/styles.ts @@ -326,10 +326,6 @@ const styles = (theme: ThemeDefault) => textAlign: 'left', }, - textUnderline: { - textDecorationLine: 'underline', - }, - label: { fontSize: variables.fontSizeLabel, lineHeight: variables.lineHeightLarge, @@ -382,10 +378,6 @@ const styles = (theme: ThemeDefault) => fontSize: variables.fontSizeLarge, }, - textXLarge: { - fontSize: variables.fontSizeXLarge, - }, - textXXLarge: { fontSize: variables.fontSizeXXLarge, }, @@ -405,11 +397,6 @@ const styles = (theme: ThemeDefault) => fontWeight: fontWeightBold, }, - textItalic: { - fontFamily: fontFamily.EXP_NEUE_ITALIC, - fontStyle: 'italic', - }, - textHeadline: { ...headlineFont, ...whiteSpace.preWrap, @@ -426,10 +413,6 @@ const styles = (theme: ThemeDefault) => lineHeight: variables.lineHeightSizeh1, }, - textDecorationNoLine: { - textDecorationLine: 'none', - }, - textWhite: { color: theme.textLight, }, @@ -438,10 +421,6 @@ const styles = (theme: ThemeDefault) => color: theme.link, }, - textUppercase: { - textTransform: 'uppercase', - }, - textNoWrap: { ...whiteSpace.noWrap, }, From 578da12e82496e7936039146ec08dc9a5da5c0da Mon Sep 17 00:00:00 2001 From: Yauheni Pasiukevich Date: Thu, 2 Nov 2023 13:24:44 +0100 Subject: [PATCH 03/11] change namings, props --- src/components/AvatarType.ts | 14 ++++++++++++++ src/components/AvatarTypes.ts | 13 ------------- src/components/MentionSuggestions.tsx | 6 +++--- 3 files changed, 17 insertions(+), 16 deletions(-) create mode 100644 src/components/AvatarType.ts delete mode 100644 src/components/AvatarTypes.ts diff --git a/src/components/AvatarType.ts b/src/components/AvatarType.ts new file mode 100644 index 000000000000..dc07a638106d --- /dev/null +++ b/src/components/AvatarType.ts @@ -0,0 +1,14 @@ +import CONST from '@src/CONST'; + + +type AvatarFunction = () => void; + +type Avatar = { + source?: string | AvatarFunction; + type?: typeof CONST.ICON_TYPE_AVATAR | typeof CONST.ICON_TYPE_WORKSPACE; + name?: string; + id?: number | string; + fallbackIcon?: string | AvatarFunction; +}; + +export default Avatar; diff --git a/src/components/AvatarTypes.ts b/src/components/AvatarTypes.ts deleted file mode 100644 index 2e94904b0d7c..000000000000 --- a/src/components/AvatarTypes.ts +++ /dev/null @@ -1,13 +0,0 @@ -import CONST from '@src/CONST'; - -type AvatarFunctionType = () => void; - -type AvatarType = { - source: string | AvatarFunctionType; - type: typeof CONST.ICON_TYPE_AVATAR | typeof CONST.ICON_TYPE_WORKSPACE; - name: string; - id: number | string; - fallbackIcon: string | AvatarFunctionType; -}; - -export default AvatarType; diff --git a/src/components/MentionSuggestions.tsx b/src/components/MentionSuggestions.tsx index fe7ce2896bfc..fdff35638766 100644 --- a/src/components/MentionSuggestions.tsx +++ b/src/components/MentionSuggestions.tsx @@ -7,7 +7,7 @@ import themeColors from '@styles/themes/default'; import CONST from '@src/CONST'; import AutoCompleteSuggestions from './AutoCompleteSuggestions'; import Avatar from './Avatar'; -import AvatarTypes from './AvatarTypes'; +import AvatarType from './AvatarType'; import Text from './Text'; type Mention = { @@ -18,7 +18,7 @@ type Mention = { alternateText: string; /** Array of icons of the user. We use the first element of this array */ - icons: AvatarTypes[]; + icons: AvatarType[]; }; type MentionSuggestionsProps = { @@ -92,7 +92,7 @@ function MentionSuggestions({prefix, mentions, highlightedMentionIndex = 0, onSe {styledHandle && styledHandle.map( ({text, isColored}) => - text !== '' && ( + Boolean(text) && ( Date: Thu, 2 Nov 2023 14:18:16 +0100 Subject: [PATCH 04/11] revert to map with index key --- src/components/MentionSuggestions.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/MentionSuggestions.tsx b/src/components/MentionSuggestions.tsx index fdff35638766..74f8503881ab 100644 --- a/src/components/MentionSuggestions.tsx +++ b/src/components/MentionSuggestions.tsx @@ -76,9 +76,9 @@ function MentionSuggestions({prefix, mentions, highlightedMentionIndex = 0, onSe style={[styles.mentionSuggestionsText, styles.flexShrink1]} numberOfLines={1} > - {styledDisplayName.map(({text, isColored}) => ( + {styledDisplayName.map(({text, isColored}, i) => ( {text} @@ -91,10 +91,10 @@ function MentionSuggestions({prefix, mentions, highlightedMentionIndex = 0, onSe > {styledHandle && styledHandle.map( - ({text, isColored}) => + ({text, isColored}, i) => Boolean(text) && ( {text} From 9c256ed3f41c2b76d9568cfc9359aee6cd857a42 Mon Sep 17 00:00:00 2001 From: Yauheni Pasiukevich Date: Thu, 2 Nov 2023 14:27:43 +0100 Subject: [PATCH 05/11] change type name --- src/components/{AvatarType.ts => AvatarIconType.ts} | 4 ++-- src/components/MentionSuggestions.tsx | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) rename src/components/{AvatarType.ts => AvatarIconType.ts} (85%) diff --git a/src/components/AvatarType.ts b/src/components/AvatarIconType.ts similarity index 85% rename from src/components/AvatarType.ts rename to src/components/AvatarIconType.ts index dc07a638106d..117fbd2b085a 100644 --- a/src/components/AvatarType.ts +++ b/src/components/AvatarIconType.ts @@ -3,7 +3,7 @@ import CONST from '@src/CONST'; type AvatarFunction = () => void; -type Avatar = { +type AvatarIcon = { source?: string | AvatarFunction; type?: typeof CONST.ICON_TYPE_AVATAR | typeof CONST.ICON_TYPE_WORKSPACE; name?: string; @@ -11,4 +11,4 @@ type Avatar = { fallbackIcon?: string | AvatarFunction; }; -export default Avatar; +export default AvatarIcon; diff --git a/src/components/MentionSuggestions.tsx b/src/components/MentionSuggestions.tsx index 74f8503881ab..23274fd8fa36 100644 --- a/src/components/MentionSuggestions.tsx +++ b/src/components/MentionSuggestions.tsx @@ -7,7 +7,7 @@ import themeColors from '@styles/themes/default'; import CONST from '@src/CONST'; import AutoCompleteSuggestions from './AutoCompleteSuggestions'; import Avatar from './Avatar'; -import AvatarType from './AvatarType'; +import AvatarIcon from './AvatarIconType'; import Text from './Text'; type Mention = { @@ -18,7 +18,7 @@ type Mention = { alternateText: string; /** Array of icons of the user. We use the first element of this array */ - icons: AvatarType[]; + icons: AvatarIcon[]; }; type MentionSuggestionsProps = { From 6ac09c50823b6b9de8f6f7b71b9ab1dea4b8e119 Mon Sep 17 00:00:00 2001 From: Yauheni Pasiukevich Date: Thu, 2 Nov 2023 14:29:25 +0100 Subject: [PATCH 06/11] remove optional for some props --- src/components/AvatarIconType.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/AvatarIconType.ts b/src/components/AvatarIconType.ts index 117fbd2b085a..5e05d357e2d3 100644 --- a/src/components/AvatarIconType.ts +++ b/src/components/AvatarIconType.ts @@ -4,10 +4,10 @@ import CONST from '@src/CONST'; type AvatarFunction = () => void; type AvatarIcon = { - source?: string | AvatarFunction; - type?: typeof CONST.ICON_TYPE_AVATAR | typeof CONST.ICON_TYPE_WORKSPACE; - name?: string; - id?: number | string; + source: string | AvatarFunction; + type: typeof CONST.ICON_TYPE_AVATAR | typeof CONST.ICON_TYPE_WORKSPACE; + name: string; + id: number | string; fallbackIcon?: string | AvatarFunction; }; From 4ed174463cb98a6252c241ade052d643d4c099db Mon Sep 17 00:00:00 2001 From: Yauheni Pasiukevich Date: Thu, 2 Nov 2023 15:32:11 +0100 Subject: [PATCH 07/11] fix lint --- src/components/AvatarIconType.ts | 1 - src/components/MentionSuggestions.tsx | 2 ++ 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/AvatarIconType.ts b/src/components/AvatarIconType.ts index 5e05d357e2d3..192acabb2399 100644 --- a/src/components/AvatarIconType.ts +++ b/src/components/AvatarIconType.ts @@ -1,6 +1,5 @@ import CONST from '@src/CONST'; - type AvatarFunction = () => void; type AvatarIcon = { diff --git a/src/components/MentionSuggestions.tsx b/src/components/MentionSuggestions.tsx index 23274fd8fa36..a7a67edafff0 100644 --- a/src/components/MentionSuggestions.tsx +++ b/src/components/MentionSuggestions.tsx @@ -78,6 +78,7 @@ function MentionSuggestions({prefix, mentions, highlightedMentionIndex = 0, onSe > {styledDisplayName.map(({text, isColored}, i) => ( @@ -94,6 +95,7 @@ function MentionSuggestions({prefix, mentions, highlightedMentionIndex = 0, onSe ({text, isColored}, i) => Boolean(text) && ( From 0138d943fc97c4576e41cb0fd937bb8b7d7bf2d0 Mon Sep 17 00:00:00 2001 From: Yauheni Pasiukevich Date: Fri, 3 Nov 2023 11:50:13 +0100 Subject: [PATCH 08/11] change types, mapping --- src/components/AvatarIconType.ts | 13 --------- src/components/MentionSuggestions.tsx | 42 +++++++++++++++------------ src/styles/StyleUtils.ts | 2 +- 3 files changed, 25 insertions(+), 32 deletions(-) delete mode 100644 src/components/AvatarIconType.ts diff --git a/src/components/AvatarIconType.ts b/src/components/AvatarIconType.ts deleted file mode 100644 index 192acabb2399..000000000000 --- a/src/components/AvatarIconType.ts +++ /dev/null @@ -1,13 +0,0 @@ -import CONST from '@src/CONST'; - -type AvatarFunction = () => void; - -type AvatarIcon = { - source: string | AvatarFunction; - type: typeof CONST.ICON_TYPE_AVATAR | typeof CONST.ICON_TYPE_WORKSPACE; - name: string; - id: number | string; - fallbackIcon?: string | AvatarFunction; -}; - -export default AvatarIcon; diff --git a/src/components/MentionSuggestions.tsx b/src/components/MentionSuggestions.tsx index a7a67edafff0..c9f7e93d173e 100644 --- a/src/components/MentionSuggestions.tsx +++ b/src/components/MentionSuggestions.tsx @@ -7,9 +7,19 @@ import themeColors from '@styles/themes/default'; import CONST from '@src/CONST'; import AutoCompleteSuggestions from './AutoCompleteSuggestions'; import Avatar from './Avatar'; -import AvatarIcon from './AvatarIconType'; import Text from './Text'; +// TODO: remove when avatarPropTypes will be migrated to TS +type AvatarFunction = () => void; + +type AvatarIcon = { + source: string | AvatarFunction; + type: typeof CONST.ICON_TYPE_AVATAR | typeof CONST.ICON_TYPE_WORKSPACE; + name: string; + id: number | string; + fallbackIcon?: string | AvatarFunction; +}; + type Mention = { /** Display name of the user */ text: string; @@ -45,20 +55,17 @@ type MentionSuggestionsProps = { /** * Create unique keys for each mention item - * @param item - * @param index */ const keyExtractor = (item: Mention) => item.alternateText; function MentionSuggestions({prefix, mentions, highlightedMentionIndex = 0, onSelect, isMentionPickerLarge, measureParentContainer = () => {}}: MentionSuggestionsProps) { /** * Render a suggestion menu item component. - * @param item */ const renderSuggestionMenuItem = (item: Mention) => { const isIcon = item.text === CONST.AUTO_COMPLETE_SUGGESTER.HERE_TEXT; const styledDisplayName = getStyledTextArray(item.text, prefix); - const styledHandle = item.text === item.alternateText ? '' : getStyledTextArray(item.alternateText, prefix); + const styledHandle = item.text === item.alternateText ? undefined : getStyledTextArray(item.alternateText, prefix); return ( @@ -90,19 +97,18 @@ function MentionSuggestions({prefix, mentions, highlightedMentionIndex = 0, onSe style={[styles.mentionSuggestionsText, styles.flex1]} numberOfLines={1} > - {styledHandle && - styledHandle.map( - ({text, isColored}, i) => - Boolean(text) && ( - - {text} - - ), - )} + {styledHandle?.map( + ({text, isColored}, i) => + Boolean(text) && ( + + {text} + + ), + )} ); diff --git a/src/styles/StyleUtils.ts b/src/styles/StyleUtils.ts index 77fe3dea9faa..393940070895 100644 --- a/src/styles/StyleUtils.ts +++ b/src/styles/StyleUtils.ts @@ -1012,7 +1012,7 @@ function getAutoCompleteSuggestionContainerStyle(itemsHeight: number): ViewStyle /** * Select the correct color for text. */ -function getColoredBackgroundStyle(isColored: boolean): StyleProp | undefined { +function getColoredBackgroundStyle(isColored: boolean): StyleProp { return {backgroundColor: isColored ? themeColors.link : undefined}; } From dab085cfab08cd6e8ccfe2d13448979064f8cf5e Mon Sep 17 00:00:00 2001 From: Yauheni Pasiukevich Date: Fri, 3 Nov 2023 14:49:26 +0100 Subject: [PATCH 09/11] reuse existed Icon type --- src/components/MentionSuggestions.tsx | 14 ++------------ src/types/onyx/OnyxCommon.ts | 7 +++++-- 2 files changed, 7 insertions(+), 14 deletions(-) diff --git a/src/components/MentionSuggestions.tsx b/src/components/MentionSuggestions.tsx index c9f7e93d173e..a009364c2223 100644 --- a/src/components/MentionSuggestions.tsx +++ b/src/components/MentionSuggestions.tsx @@ -5,21 +5,11 @@ import styles from '@styles/styles'; import * as StyleUtils from '@styles/StyleUtils'; import themeColors from '@styles/themes/default'; import CONST from '@src/CONST'; +import {Icon} from '@src/types/onyx/OnyxCommon'; import AutoCompleteSuggestions from './AutoCompleteSuggestions'; import Avatar from './Avatar'; import Text from './Text'; -// TODO: remove when avatarPropTypes will be migrated to TS -type AvatarFunction = () => void; - -type AvatarIcon = { - source: string | AvatarFunction; - type: typeof CONST.ICON_TYPE_AVATAR | typeof CONST.ICON_TYPE_WORKSPACE; - name: string; - id: number | string; - fallbackIcon?: string | AvatarFunction; -}; - type Mention = { /** Display name of the user */ text: string; @@ -28,7 +18,7 @@ type Mention = { alternateText: string; /** Array of icons of the user. We use the first element of this array */ - icons: AvatarIcon[]; + icons: Icon[]; }; type MentionSuggestionsProps = { diff --git a/src/types/onyx/OnyxCommon.ts b/src/types/onyx/OnyxCommon.ts index bafd5e8cbbf0..0ab6cee0fe15 100644 --- a/src/types/onyx/OnyxCommon.ts +++ b/src/types/onyx/OnyxCommon.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import {SvgProps} from 'react-native-svg'; import {ValueOf} from 'type-fest'; import CONST from '@src/CONST'; @@ -9,9 +10,11 @@ type ErrorFields = Record | null>; type Errors = Record; type Icon = { - source: React.ReactNode | string; - type: 'avatar' | 'workspace'; + source: string | React.FC; + type: typeof CONST.ICON_TYPE_AVATAR | typeof CONST.ICON_TYPE_WORKSPACE; name: string; + id: number | string; + fallbackIcon?: string | React.FC; }; export type {Icon, PendingAction, ErrorFields, Errors}; From eb58d70d9d7fdd51f5a45008d4e7542528093232 Mon Sep 17 00:00:00 2001 From: Yauheni Pasiukevich Date: Tue, 7 Nov 2023 16:19:59 +0100 Subject: [PATCH 10/11] remove redundant style --- src/styles/styles.ts | 4 ---- 1 file changed, 4 deletions(-) diff --git a/src/styles/styles.ts b/src/styles/styles.ts index e591eb4176a2..46a7bde0dd7b 100644 --- a/src/styles/styles.ts +++ b/src/styles/styles.ts @@ -327,10 +327,6 @@ const styles = (theme: ThemeColors) => textAlign: 'left', }, - textUnderline: { - textDecorationLine: 'underline', - }, - verticalAlignMiddle: { verticalAlign: 'middle', }, From 93e29f4a04fe6efbcc361f93ca5c73afca33919f Mon Sep 17 00:00:00 2001 From: Yauheni Pasiukevich Date: Mon, 13 Nov 2023 14:26:27 +0100 Subject: [PATCH 11/11] update for undefined state Co-authored-by: Monil Bhavsar --- src/components/MentionSuggestions.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/MentionSuggestions.tsx b/src/components/MentionSuggestions.tsx index a009364c2223..2d0f3bf32b41 100644 --- a/src/components/MentionSuggestions.tsx +++ b/src/components/MentionSuggestions.tsx @@ -73,7 +73,7 @@ function MentionSuggestions({prefix, mentions, highlightedMentionIndex = 0, onSe style={[styles.mentionSuggestionsText, styles.flexShrink1]} numberOfLines={1} > - {styledDisplayName.map(({text, isColored}, i) => ( + {styledDisplayName?.map(({text, isColored}, i) => (