From 38c1ea4ea66172e7da0f9aad4dc6e5a3d03e6426 Mon Sep 17 00:00:00 2001 From: tienifr Date: Fri, 11 Aug 2023 10:22:58 +0700 Subject: [PATCH 1/6] fix: 22929 forwardref console error --- src/components/AmountTextInput.js | 3 ++- src/components/Checkbox.js | 3 ++- src/components/CountryPicker/index.js | 3 ++- src/components/Picker/BasePicker.js | 3 ++- src/components/StatePicker/index.js | 3 ++- src/components/TextInputWithCurrencySymbol.js | 3 ++- src/components/TextLink.js | 3 ++- src/components/withAnimatedRef.js | 3 ++- src/components/withCurrentUserPersonalDetails.js | 3 ++- src/components/withNavigation.js | 3 ++- src/components/withToggleVisibilityView.js | 3 ++- src/pages/iou/steps/MoneyRequestAmountForm.js | 3 ++- 12 files changed, 24 insertions(+), 12 deletions(-) diff --git a/src/components/AmountTextInput.js b/src/components/AmountTextInput.js index 8472ef271be0..ec5330772cf3 100644 --- a/src/components/AmountTextInput.js +++ b/src/components/AmountTextInput.js @@ -9,7 +9,8 @@ const propTypes = { formattedAmount: PropTypes.string.isRequired, /** A ref to forward to amount text input */ - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.instanceOf(React.Component)})]), + // eslint-disable-next-line react/forbid-prop-types + forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), /** Function to call when amount in text input is changed */ onChangeAmount: PropTypes.func.isRequired, diff --git a/src/components/Checkbox.js b/src/components/Checkbox.js index 86b6e05d5ed7..97fec1b2618c 100644 --- a/src/components/Checkbox.js +++ b/src/components/Checkbox.js @@ -45,7 +45,8 @@ const propTypes = { caretSize: PropTypes.number, /** A ref to forward to the Pressable */ - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.instanceOf(React.Component)})]), + // eslint-disable-next-line react/forbid-prop-types + forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), /** An accessibility label for the checkbox */ accessibilityLabel: PropTypes.string.isRequired, diff --git a/src/components/CountryPicker/index.js b/src/components/CountryPicker/index.js index 6d1435dca796..417cd79eb4eb 100644 --- a/src/components/CountryPicker/index.js +++ b/src/components/CountryPicker/index.js @@ -19,7 +19,8 @@ const propTypes = { onInputChange: PropTypes.func, /** A ref to forward to MenuItemWithTopDescription */ - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.instanceOf(React.Component)})]), + // eslint-disable-next-line react/forbid-prop-types + forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), }; const defaultProps = { diff --git a/src/components/Picker/BasePicker.js b/src/components/Picker/BasePicker.js index 173b863edfcc..9fe5e3540194 100644 --- a/src/components/Picker/BasePicker.js +++ b/src/components/Picker/BasePicker.js @@ -13,7 +13,8 @@ import {ScrollContext} from '../ScrollViewWithContext'; const propTypes = { /** A forwarded ref */ - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.instanceOf(React.Component)})]), + // eslint-disable-next-line react/forbid-prop-types + forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), /** BasePicker label */ label: PropTypes.string, diff --git a/src/components/StatePicker/index.js b/src/components/StatePicker/index.js index c934790f54e5..2e41f85c32a2 100644 --- a/src/components/StatePicker/index.js +++ b/src/components/StatePicker/index.js @@ -19,7 +19,8 @@ const propTypes = { onInputChange: PropTypes.func, /** A ref to forward to MenuItemWithTopDescription */ - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.instanceOf(React.Component)})]), + // eslint-disable-next-line react/forbid-prop-types + forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), /** Label to display on field */ label: PropTypes.string, diff --git a/src/components/TextInputWithCurrencySymbol.js b/src/components/TextInputWithCurrencySymbol.js index ef3fc3a1464a..e7538d4dac6a 100644 --- a/src/components/TextInputWithCurrencySymbol.js +++ b/src/components/TextInputWithCurrencySymbol.js @@ -6,7 +6,8 @@ import * as CurrencyUtils from '../libs/CurrencyUtils'; const propTypes = { /** A ref to forward to amount text input */ - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.instanceOf(React.Component)})]), + // eslint-disable-next-line react/forbid-prop-types + forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), /** Formatted amount in local currency */ formattedAmount: PropTypes.string.isRequired, diff --git a/src/components/TextLink.js b/src/components/TextLink.js index a1b1cb4d1e8a..995b5c89db2d 100644 --- a/src/components/TextLink.js +++ b/src/components/TextLink.js @@ -24,7 +24,8 @@ const propTypes = { onMouseDown: PropTypes.func, /** A ref to forward to text */ - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.instanceOf(React.Component)})]), + // eslint-disable-next-line react/forbid-prop-types + forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), }; const defaultProps = { diff --git a/src/components/withAnimatedRef.js b/src/components/withAnimatedRef.js index 60cfd98e65e4..a84806d2cc46 100644 --- a/src/components/withAnimatedRef.js +++ b/src/components/withAnimatedRef.js @@ -17,7 +17,8 @@ export default function withAnimatedRef(WrappedComponent) { } WithAnimatedRef.displayName = `withAnimatedRef(${getComponentDisplayName(WrappedComponent)})`; WithAnimatedRef.propTypes = { - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.instanceOf(React.Component)})]), + // eslint-disable-next-line react/forbid-prop-types + forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), }; WithAnimatedRef.defaultProps = { forwardedRef: undefined, diff --git a/src/components/withCurrentUserPersonalDetails.js b/src/components/withCurrentUserPersonalDetails.js index 75336c747210..dea89fb9a320 100644 --- a/src/components/withCurrentUserPersonalDetails.js +++ b/src/components/withCurrentUserPersonalDetails.js @@ -15,7 +15,8 @@ const withCurrentUserPersonalDetailsDefaultProps = { export default function (WrappedComponent) { const propTypes = { - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.instanceOf(React.Component)})]), + // eslint-disable-next-line react/forbid-prop-types + forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), /** Personal details of all the users, including current user */ personalDetails: PropTypes.objectOf(personalDetailsPropType), diff --git a/src/components/withNavigation.js b/src/components/withNavigation.js index 4047cab72e1d..3ff96b64fef9 100644 --- a/src/components/withNavigation.js +++ b/src/components/withNavigation.js @@ -22,7 +22,8 @@ export default function withNavigation(WrappedComponent) { WithNavigation.displayName = `withNavigation(${getComponentDisplayName(WrappedComponent)})`; WithNavigation.propTypes = { - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.instanceOf(React.Component)})]), + // eslint-disable-next-line react/forbid-prop-types + forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), }; WithNavigation.defaultProps = { forwardedRef: () => {}, diff --git a/src/components/withToggleVisibilityView.js b/src/components/withToggleVisibilityView.js index 4537db2b7777..a7861c44b599 100644 --- a/src/components/withToggleVisibilityView.js +++ b/src/components/withToggleVisibilityView.js @@ -25,7 +25,8 @@ export default function (WrappedComponent) { WithToggleVisibilityView.displayName = `WithToggleVisibilityView(${getComponentDisplayName(WrappedComponent)})`; WithToggleVisibilityView.propTypes = { - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.instanceOf(React.Component)})]), + // eslint-disable-next-line react/forbid-prop-types + forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), /** Whether the content is visible. */ isVisible: PropTypes.bool, diff --git a/src/pages/iou/steps/MoneyRequestAmountForm.js b/src/pages/iou/steps/MoneyRequestAmountForm.js index 7178ed0e0158..173ef4574d9c 100644 --- a/src/pages/iou/steps/MoneyRequestAmountForm.js +++ b/src/pages/iou/steps/MoneyRequestAmountForm.js @@ -24,7 +24,8 @@ const propTypes = { isEditing: PropTypes.bool, /** Refs forwarded to the TextInputWithCurrencySymbol */ - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.instanceOf(React.Component)})]), + // eslint-disable-next-line react/forbid-prop-types + forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), /** Fired when back button pressed, navigates to currency selection page */ onCurrencyButtonPress: PropTypes.func.isRequired, From 1444433d51b585ebe36a87d80cd7b41e9b237e8a Mon Sep 17 00:00:00 2001 From: tienifr Date: Fri, 11 Aug 2023 11:06:23 +0700 Subject: [PATCH 2/6] update react native onyx version --- package-lock.json | 16 +++++++--------- package.json | 2 +- 2 files changed, 8 insertions(+), 10 deletions(-) diff --git a/package-lock.json b/package-lock.json index 8f23fe160a6b..75736f2c68ac 100644 --- a/package-lock.json +++ b/package-lock.json @@ -80,7 +80,7 @@ "react-native-key-command": "^1.0.1", "react-native-localize": "^2.2.6", "react-native-modal": "^13.0.0", - "react-native-onyx": "1.0.52", + "react-native-onyx": "1.0.59", "react-native-pager-view": "^6.2.0", "react-native-pdf": "^6.6.2", "react-native-performance": "^4.0.0", @@ -42646,13 +42646,12 @@ } }, "node_modules/react-native-onyx": { - "version": "1.0.52", - "resolved": "https://registry.npmjs.org/react-native-onyx/-/react-native-onyx-1.0.52.tgz", - "integrity": "sha512-lfIg+tSd+HZF00pr2oFoLY3iTdGYGC6Dd44/YktTsVKB/yIcUq61wBMOitX54Z54ac2/eHKFPicEr2xvBhE2VQ==", + "version": "1.0.59", + "resolved": "https://registry.npmjs.org/react-native-onyx/-/react-native-onyx-1.0.59.tgz", + "integrity": "sha512-eDFRT3lGol651gjGmS7HMZVPJf/wrnLa3lQUWOeK5oD0D93I+e71brrHuUu0WoSiQVT6icp+0Wx3kEdds3+spw==", "dependencies": { "ascii-table": "0.0.9", "fast-equals": "^4.0.3", - "lodash": "^4.17.21", "underscore": "^1.13.1" }, "engines": { @@ -79121,13 +79120,12 @@ } }, "react-native-onyx": { - "version": "1.0.52", - "resolved": "https://registry.npmjs.org/react-native-onyx/-/react-native-onyx-1.0.52.tgz", - "integrity": "sha512-lfIg+tSd+HZF00pr2oFoLY3iTdGYGC6Dd44/YktTsVKB/yIcUq61wBMOitX54Z54ac2/eHKFPicEr2xvBhE2VQ==", + "version": "1.0.59", + "resolved": "https://registry.npmjs.org/react-native-onyx/-/react-native-onyx-1.0.59.tgz", + "integrity": "sha512-eDFRT3lGol651gjGmS7HMZVPJf/wrnLa3lQUWOeK5oD0D93I+e71brrHuUu0WoSiQVT6icp+0Wx3kEdds3+spw==", "requires": { "ascii-table": "0.0.9", "fast-equals": "^4.0.3", - "lodash": "^4.17.21", "underscore": "^1.13.1" } }, diff --git a/package.json b/package.json index ac69af4c760b..4f45b9d18310 100644 --- a/package.json +++ b/package.json @@ -119,7 +119,7 @@ "react-native-key-command": "^1.0.1", "react-native-localize": "^2.2.6", "react-native-modal": "^13.0.0", - "react-native-onyx": "1.0.52", + "react-native-onyx": "1.0.59", "react-native-pager-view": "^6.2.0", "react-native-pdf": "^6.6.2", "react-native-performance": "^4.0.0", From f0e98e3145f8208b483203b748175e5c909ffeef Mon Sep 17 00:00:00 2001 From: tienifr Date: Fri, 25 Aug 2023 14:48:11 +0700 Subject: [PATCH 3/6] fix: change to use refPropTypes --- ios/Podfile.lock | 2 +- src/components/AmountTextInput.js | 4 ++-- src/components/Attachments/AttachmentCarousel/Pager/index.js | 3 ++- src/components/Button/index.js | 4 ++-- src/components/Checkbox.js | 4 ++-- src/components/CountryPicker/index.js | 4 ++-- src/components/Picker/BasePicker.js | 4 ++-- src/components/StatePicker/index.js | 4 ++-- src/components/TextInputWithCurrencySymbol.js | 4 ++-- src/components/TextLink.js | 4 ++-- src/components/menuItemPropTypes.js | 3 ++- src/components/withAnimatedRef.js | 4 ++-- src/components/withCurrentUserPersonalDetails.js | 4 ++-- src/components/withNavigation.js | 4 ++-- src/components/withNavigationFallback.js | 4 ++-- src/components/withNavigationFocus.js | 4 ++-- src/components/withToggleVisibilityView.js | 4 ++-- src/components/withViewportOffsetTop.js | 4 ++-- src/pages/iou/steps/MoneyRequestAmountForm.js | 4 ++-- 19 files changed, 37 insertions(+), 35 deletions(-) diff --git a/ios/Podfile.lock b/ios/Podfile.lock index 16ed1e05dc64..c37e234781ef 100644 --- a/ios/Podfile.lock +++ b/ios/Podfile.lock @@ -1311,4 +1311,4 @@ SPEC CHECKSUMS: PODFILE CHECKSUM: 845537d35601574adcd0794e17003ba7dbccdbfd -COCOAPODS: 1.12.1 +COCOAPODS: 1.11.3 diff --git a/src/components/AmountTextInput.js b/src/components/AmountTextInput.js index ec5330772cf3..98166cabd944 100644 --- a/src/components/AmountTextInput.js +++ b/src/components/AmountTextInput.js @@ -3,14 +3,14 @@ import PropTypes from 'prop-types'; import TextInput from './TextInput'; import styles from '../styles/styles'; import CONST from '../CONST'; +import refPropTypes from './refPropTypes'; const propTypes = { /** Formatted amount in local currency */ formattedAmount: PropTypes.string.isRequired, /** A ref to forward to amount text input */ - // eslint-disable-next-line react/forbid-prop-types - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), + forwardedRef: refPropTypes, /** Function to call when amount in text input is changed */ onChangeAmount: PropTypes.func.isRequired, diff --git a/src/components/Attachments/AttachmentCarousel/Pager/index.js b/src/components/Attachments/AttachmentCarousel/Pager/index.js index 636a041cbb83..9779963dfc4a 100644 --- a/src/components/Attachments/AttachmentCarousel/Pager/index.js +++ b/src/components/Attachments/AttachmentCarousel/Pager/index.js @@ -8,6 +8,7 @@ import PagerView from 'react-native-pager-view'; import _ from 'underscore'; import styles from '../../../../styles/styles'; import AttachmentCarouselPagerContext from './AttachmentCarouselPagerContext'; +import refPropTypes from '../../../refPropTypes'; const AnimatedPagerView = Animated.createAnimatedComponent(createNativeWrapper(PagerView)); @@ -50,7 +51,7 @@ const pagerPropTypes = { onSwipeSuccess: PropTypes.func, onSwipeDown: PropTypes.func, onPinchGestureChange: PropTypes.func, - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]), + forwardedRef: refPropTypes, containerWidth: PropTypes.number.isRequired, containerHeight: PropTypes.number.isRequired, }; diff --git a/src/components/Button/index.js b/src/components/Button/index.js index a850a43d2fb0..bfde528a4750 100644 --- a/src/components/Button/index.js +++ b/src/components/Button/index.js @@ -15,6 +15,7 @@ import * as Expensicons from '../Icon/Expensicons'; import withNavigationFocus from '../withNavigationFocus'; import validateSubmitShortcut from './validateSubmitShortcut'; import PressableWithFeedback from '../Pressable/PressableWithFeedback'; +import refPropTypes from '../refPropTypes'; const propTypes = { /** The text for the button label */ @@ -118,8 +119,7 @@ const propTypes = { accessibilityLabel: PropTypes.string, /** A ref to forward the button */ - // eslint-disable-next-line react/forbid-prop-types - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), + forwardedRef: refPropTypes, }; const defaultProps = { diff --git a/src/components/Checkbox.js b/src/components/Checkbox.js index 97fec1b2618c..1bb5824f612a 100644 --- a/src/components/Checkbox.js +++ b/src/components/Checkbox.js @@ -9,6 +9,7 @@ import * as Expensicons from './Icon/Expensicons'; import * as StyleUtils from '../styles/StyleUtils'; import CONST from '../CONST'; import PressableWithFeedback from './Pressable/PressableWithFeedback'; +import refPropTypes from './refPropTypes'; const propTypes = { /** Whether checkbox is checked */ @@ -45,8 +46,7 @@ const propTypes = { caretSize: PropTypes.number, /** A ref to forward to the Pressable */ - // eslint-disable-next-line react/forbid-prop-types - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), + forwardedRef: refPropTypes, /** An accessibility label for the checkbox */ accessibilityLabel: PropTypes.string.isRequired, diff --git a/src/components/CountryPicker/index.js b/src/components/CountryPicker/index.js index 417cd79eb4eb..684296d20b11 100644 --- a/src/components/CountryPicker/index.js +++ b/src/components/CountryPicker/index.js @@ -7,6 +7,7 @@ import MenuItemWithTopDescription from '../MenuItemWithTopDescription'; import useLocalize from '../../hooks/useLocalize'; import CountrySelectorModal from './CountrySelectorModal'; import FormHelpMessage from '../FormHelpMessage'; +import refPropTypes from '../refPropTypes'; const propTypes = { /** Form Error description */ @@ -19,8 +20,7 @@ const propTypes = { onInputChange: PropTypes.func, /** A ref to forward to MenuItemWithTopDescription */ - // eslint-disable-next-line react/forbid-prop-types - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), + forwardedRef: refPropTypes, }; const defaultProps = { diff --git a/src/components/Picker/BasePicker.js b/src/components/Picker/BasePicker.js index 9fe5e3540194..550b8a386aa1 100644 --- a/src/components/Picker/BasePicker.js +++ b/src/components/Picker/BasePicker.js @@ -10,11 +10,11 @@ import Text from '../Text'; import styles from '../../styles/styles'; import themeColors from '../../styles/themes/default'; import {ScrollContext} from '../ScrollViewWithContext'; +import refPropTypes from '../refPropTypes'; const propTypes = { /** A forwarded ref */ - // eslint-disable-next-line react/forbid-prop-types - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), + forwardedRef: refPropTypes, /** BasePicker label */ label: PropTypes.string, diff --git a/src/components/StatePicker/index.js b/src/components/StatePicker/index.js index 2e41f85c32a2..5f3241181ee0 100644 --- a/src/components/StatePicker/index.js +++ b/src/components/StatePicker/index.js @@ -7,6 +7,7 @@ import MenuItemWithTopDescription from '../MenuItemWithTopDescription'; import useLocalize from '../../hooks/useLocalize'; import FormHelpMessage from '../FormHelpMessage'; import StateSelectorModal from './StateSelectorModal'; +import refPropTypes from '../refPropTypes'; const propTypes = { /** Error text to display */ @@ -19,8 +20,7 @@ const propTypes = { onInputChange: PropTypes.func, /** A ref to forward to MenuItemWithTopDescription */ - // eslint-disable-next-line react/forbid-prop-types - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), + forwardedRef: refPropTypes, /** Label to display on field */ label: PropTypes.string, diff --git a/src/components/TextInputWithCurrencySymbol.js b/src/components/TextInputWithCurrencySymbol.js index f3931a541cfa..72ae373539f0 100644 --- a/src/components/TextInputWithCurrencySymbol.js +++ b/src/components/TextInputWithCurrencySymbol.js @@ -5,11 +5,11 @@ import CurrencySymbolButton from './CurrencySymbolButton'; import * as CurrencyUtils from '../libs/CurrencyUtils'; import useLocalize from '../hooks/useLocalize'; import * as MoneyRequestUtils from '../libs/MoneyRequestUtils'; +import refPropTypes from './refPropTypes'; const propTypes = { /** A ref to forward to amount text input */ - // eslint-disable-next-line react/forbid-prop-types - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), + forwardedRef: refPropTypes, /** Formatted amount in local currency */ formattedAmount: PropTypes.string.isRequired, diff --git a/src/components/TextLink.js b/src/components/TextLink.js index 71b5995255d9..233aaf50644e 100644 --- a/src/components/TextLink.js +++ b/src/components/TextLink.js @@ -6,6 +6,7 @@ import styles from '../styles/styles'; import stylePropTypes from '../styles/stylePropTypes'; import CONST from '../CONST'; import * as Link from '../libs/actions/Link'; +import refPropTypes from './refPropTypes'; const propTypes = { /** Link to open in new tab */ @@ -24,8 +25,7 @@ const propTypes = { onMouseDown: PropTypes.func, /** A ref to forward to text */ - // eslint-disable-next-line react/forbid-prop-types - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), + forwardedRef: refPropTypes, }; const defaultProps = { diff --git a/src/components/menuItemPropTypes.js b/src/components/menuItemPropTypes.js index a6424518478c..11d85bcec187 100644 --- a/src/components/menuItemPropTypes.js +++ b/src/components/menuItemPropTypes.js @@ -3,6 +3,7 @@ import _ from 'underscore'; import CONST from '../CONST'; import stylePropTypes from '../styles/stylePropTypes'; import avatarPropTypes from './avatarPropTypes'; +import refPropTypes from './refPropTypes'; const propTypes = { /** Text to be shown as badge near the right end. */ @@ -118,7 +119,7 @@ const propTypes = { shouldBlockSelection: PropTypes.bool, /** The ref to the menu item */ - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]), + forwardedRef: refPropTypes, /** Any adjustments to style when menu item is hovered or pressed */ hoverAndPressStyle: PropTypes.arrayOf(PropTypes.object), diff --git a/src/components/withAnimatedRef.js b/src/components/withAnimatedRef.js index a84806d2cc46..e96fd160dd34 100644 --- a/src/components/withAnimatedRef.js +++ b/src/components/withAnimatedRef.js @@ -2,6 +2,7 @@ import React from 'react'; import {useAnimatedRef} from 'react-native-reanimated'; import PropTypes from 'prop-types'; import getComponentDisplayName from '../libs/getComponentDisplayName'; +import refPropTypes from './refPropTypes'; export default function withAnimatedRef(WrappedComponent) { function WithAnimatedRef(props) { @@ -17,8 +18,7 @@ export default function withAnimatedRef(WrappedComponent) { } WithAnimatedRef.displayName = `withAnimatedRef(${getComponentDisplayName(WrappedComponent)})`; WithAnimatedRef.propTypes = { - // eslint-disable-next-line react/forbid-prop-types - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), + forwardedRef: refPropTypes, }; WithAnimatedRef.defaultProps = { forwardedRef: undefined, diff --git a/src/components/withCurrentUserPersonalDetails.js b/src/components/withCurrentUserPersonalDetails.js index dea89fb9a320..87a046e66983 100644 --- a/src/components/withCurrentUserPersonalDetails.js +++ b/src/components/withCurrentUserPersonalDetails.js @@ -4,6 +4,7 @@ import {withOnyx} from 'react-native-onyx'; import getComponentDisplayName from '../libs/getComponentDisplayName'; import ONYXKEYS from '../ONYXKEYS'; import personalDetailsPropType from '../pages/personalDetailsPropType'; +import refPropTypes from './refPropTypes'; const withCurrentUserPersonalDetailsPropTypes = { currentUserPersonalDetails: personalDetailsPropType, @@ -15,8 +16,7 @@ const withCurrentUserPersonalDetailsDefaultProps = { export default function (WrappedComponent) { const propTypes = { - // eslint-disable-next-line react/forbid-prop-types - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), + forwardedRef: refPropTypes, /** Personal details of all the users, including current user */ personalDetails: PropTypes.objectOf(personalDetailsPropType), diff --git a/src/components/withNavigation.js b/src/components/withNavigation.js index 3ff96b64fef9..ef0f599dc982 100644 --- a/src/components/withNavigation.js +++ b/src/components/withNavigation.js @@ -2,6 +2,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import {useNavigation} from '@react-navigation/native'; import getComponentDisplayName from '../libs/getComponentDisplayName'; +import refPropTypes from './refPropTypes'; const withNavigationPropTypes = { navigation: PropTypes.object.isRequired, @@ -22,8 +23,7 @@ export default function withNavigation(WrappedComponent) { WithNavigation.displayName = `withNavigation(${getComponentDisplayName(WrappedComponent)})`; WithNavigation.propTypes = { - // eslint-disable-next-line react/forbid-prop-types - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), + forwardedRef: refPropTypes, }; WithNavigation.defaultProps = { forwardedRef: () => {}, diff --git a/src/components/withNavigationFallback.js b/src/components/withNavigationFallback.js index 3980ebe01e64..4de9d8f8e43e 100644 --- a/src/components/withNavigationFallback.js +++ b/src/components/withNavigationFallback.js @@ -2,6 +2,7 @@ import React, {Component} from 'react'; import PropTypes from 'prop-types'; import {NavigationContext} from '@react-navigation/core'; import getComponentDisplayName from '../libs/getComponentDisplayName'; +import refPropTypes from './refPropTypes'; export default function (WrappedComponent) { class WithNavigationFallback extends Component { @@ -36,8 +37,7 @@ export default function (WrappedComponent) { WithNavigationFallback.contextType = NavigationContext; WithNavigationFallback.displayName = `WithNavigationFocusWithFallback(${getComponentDisplayName(WrappedComponent)})`; WithNavigationFallback.propTypes = { - // eslint-disable-next-line react/forbid-prop-types - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), + forwardedRef: refPropTypes, }; WithNavigationFallback.defaultProps = { forwardedRef: undefined, diff --git a/src/components/withNavigationFocus.js b/src/components/withNavigationFocus.js index e15f795832c6..f934f038e311 100644 --- a/src/components/withNavigationFocus.js +++ b/src/components/withNavigationFocus.js @@ -2,6 +2,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import {useIsFocused} from '@react-navigation/native'; import getComponentDisplayName from '../libs/getComponentDisplayName'; +import refPropTypes from './refPropTypes'; const withNavigationFocusPropTypes = { isFocused: PropTypes.bool.isRequired, @@ -22,8 +23,7 @@ export default function withNavigationFocus(WrappedComponent) { WithNavigationFocus.displayName = `withNavigationFocus(${getComponentDisplayName(WrappedComponent)})`; WithNavigationFocus.propTypes = { - // eslint-disable-next-line react/forbid-prop-types - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), + forwardedRef: refPropTypes, }; WithNavigationFocus.defaultProps = { forwardedRef: undefined, diff --git a/src/components/withToggleVisibilityView.js b/src/components/withToggleVisibilityView.js index a7861c44b599..eef5135d02b6 100644 --- a/src/components/withToggleVisibilityView.js +++ b/src/components/withToggleVisibilityView.js @@ -3,6 +3,7 @@ import {View} from 'react-native'; import PropTypes from 'prop-types'; import styles from '../styles/styles'; import getComponentDisplayName from '../libs/getComponentDisplayName'; +import refPropTypes from './refPropTypes'; const toggleVisibilityViewPropTypes = { /** Whether the content is visible. */ @@ -25,8 +26,7 @@ export default function (WrappedComponent) { WithToggleVisibilityView.displayName = `WithToggleVisibilityView(${getComponentDisplayName(WrappedComponent)})`; WithToggleVisibilityView.propTypes = { - // eslint-disable-next-line react/forbid-prop-types - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), + forwardedRef: refPropTypes, /** Whether the content is visible. */ isVisible: PropTypes.bool, diff --git a/src/components/withViewportOffsetTop.js b/src/components/withViewportOffsetTop.js index 538071a948fa..113c72ed1e1a 100644 --- a/src/components/withViewportOffsetTop.js +++ b/src/components/withViewportOffsetTop.js @@ -3,6 +3,7 @@ import PropTypes from 'prop-types'; import lodashGet from 'lodash/get'; import getComponentDisplayName from '../libs/getComponentDisplayName'; import addViewportResizeListener from '../libs/VisualViewport'; +import refPropTypes from './refPropTypes'; const viewportOffsetTopPropTypes = { // viewportOffsetTop returns the offset of the top edge of the visual viewport from the @@ -53,8 +54,7 @@ export default function (WrappedComponent) { WithViewportOffsetTop.displayName = `WithViewportOffsetTop(${getComponentDisplayName(WrappedComponent)})`; WithViewportOffsetTop.propTypes = { - // eslint-disable-next-line react/forbid-prop-types - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.any})]), + forwardedRef: refPropTypes, }; WithViewportOffsetTop.defaultProps = { forwardedRef: undefined, diff --git a/src/pages/iou/steps/MoneyRequestAmountForm.js b/src/pages/iou/steps/MoneyRequestAmountForm.js index 3fc7b986583d..8aece1c11d7d 100644 --- a/src/pages/iou/steps/MoneyRequestAmountForm.js +++ b/src/pages/iou/steps/MoneyRequestAmountForm.js @@ -12,6 +12,7 @@ import * as DeviceCapabilities from '../../../libs/DeviceCapabilities'; import TextInputWithCurrencySymbol from '../../../components/TextInputWithCurrencySymbol'; import useLocalize from '../../../hooks/useLocalize'; import CONST from '../../../CONST'; +import refPropTypes from '../../../components/refPropTypes'; const propTypes = { /** IOU amount saved in Onyx */ @@ -24,8 +25,7 @@ const propTypes = { isEditing: PropTypes.bool, /** Refs forwarded to the TextInputWithCurrencySymbol */ - // eslint-disable-next-line react/forbid-prop-types - forwardedRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.object})]), + forwardedRef: refPropTypes, /** Fired when back button pressed, navigates to currency selection page */ onCurrencyButtonPress: PropTypes.func.isRequired, From 5481d73c7050ace10721f4fd0c01b5f9ebae4780 Mon Sep 17 00:00:00 2001 From: tienifr Date: Fri, 25 Aug 2023 14:54:13 +0700 Subject: [PATCH 4/6] fix: unsued vars --- src/components/withAnimatedRef.js | 1 - src/components/withNavigationFallback.js | 1 - 2 files changed, 2 deletions(-) diff --git a/src/components/withAnimatedRef.js b/src/components/withAnimatedRef.js index e96fd160dd34..71ef130b9ce7 100644 --- a/src/components/withAnimatedRef.js +++ b/src/components/withAnimatedRef.js @@ -1,6 +1,5 @@ import React from 'react'; import {useAnimatedRef} from 'react-native-reanimated'; -import PropTypes from 'prop-types'; import getComponentDisplayName from '../libs/getComponentDisplayName'; import refPropTypes from './refPropTypes'; diff --git a/src/components/withNavigationFallback.js b/src/components/withNavigationFallback.js index 4de9d8f8e43e..bc4ea5dd3fad 100644 --- a/src/components/withNavigationFallback.js +++ b/src/components/withNavigationFallback.js @@ -1,5 +1,4 @@ import React, {Component} from 'react'; -import PropTypes from 'prop-types'; import {NavigationContext} from '@react-navigation/core'; import getComponentDisplayName from '../libs/getComponentDisplayName'; import refPropTypes from './refPropTypes'; From b3ebb7add6a22d10102208eab4323fd348778d5b Mon Sep 17 00:00:00 2001 From: tienifr Date: Fri, 25 Aug 2023 15:27:54 +0700 Subject: [PATCH 5/6] remove unnecessary change --- ios/Podfile.lock | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ios/Podfile.lock b/ios/Podfile.lock index c37e234781ef..16ed1e05dc64 100644 --- a/ios/Podfile.lock +++ b/ios/Podfile.lock @@ -1311,4 +1311,4 @@ SPEC CHECKSUMS: PODFILE CHECKSUM: 845537d35601574adcd0794e17003ba7dbccdbfd -COCOAPODS: 1.11.3 +COCOAPODS: 1.12.1 From 8c932626694b9c52b6f996d9696a504abd4cee99 Mon Sep 17 00:00:00 2001 From: tienifr Date: Fri, 25 Aug 2023 16:22:03 +0700 Subject: [PATCH 6/6] change to use refPropTypes --- src/components/Pressable/PressableWithDelayToggle.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/Pressable/PressableWithDelayToggle.js b/src/components/Pressable/PressableWithDelayToggle.js index 8775957987e7..a07b5b6d1ab6 100644 --- a/src/components/Pressable/PressableWithDelayToggle.js +++ b/src/components/Pressable/PressableWithDelayToggle.js @@ -10,10 +10,11 @@ import getButtonState from '../../libs/getButtonState'; import * as StyleUtils from '../../styles/StyleUtils'; import PressableWithoutFeedback from './PressableWithoutFeedback'; import useThrottledButtonState from '../../hooks/useThrottledButtonState'; +import refPropTypes from '../refPropTypes'; const propTypes = { /** Ref passed to the component by React.forwardRef (do not pass from parent) */ - innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({current: PropTypes.instanceOf(React.Component)})]), + innerRef: refPropTypes, /** The text to display */ text: PropTypes.string,