diff --git a/package-lock.json b/package-lock.json index 3275ee64d44fe..cc97c31ecc309 100644 --- a/package-lock.json +++ b/package-lock.json @@ -73,7 +73,6 @@ "mapbox-gl": "^2.15.0", "onfido-sdk-ui": "14.15.0", "process": "^0.11.10", - "prop-types": "^15.7.2", "pusher-js": "8.3.0", "react": "18.2.0", "react-beautiful-dnd": "^13.1.1", diff --git a/package.json b/package.json index b3c7267abe736..22a8ed0c07970 100644 --- a/package.json +++ b/package.json @@ -125,7 +125,6 @@ "mapbox-gl": "^2.15.0", "onfido-sdk-ui": "14.15.0", "process": "^0.11.10", - "prop-types": "^15.7.2", "pusher-js": "8.3.0", "react": "18.2.0", "react-beautiful-dnd": "^13.1.1", diff --git a/src/components/Image/sourcePropTypes/index.js b/src/components/Image/sourcePropTypes/index.js deleted file mode 100644 index c5102b240cb1e..0000000000000 --- a/src/components/Image/sourcePropTypes/index.js +++ /dev/null @@ -1,13 +0,0 @@ -import PropTypes from 'prop-types'; - -export default PropTypes.oneOfType([ - PropTypes.func, - PropTypes.elementType, - PropTypes.number, - PropTypes.shape({ - uri: PropTypes.string, - // eslint-disable-next-line react/forbid-prop-types - headers: PropTypes.object, - }), - PropTypes.string, -]); diff --git a/src/components/Image/sourcePropTypes/index.native.js b/src/components/Image/sourcePropTypes/index.native.js deleted file mode 100644 index ade2547188796..0000000000000 --- a/src/components/Image/sourcePropTypes/index.native.js +++ /dev/null @@ -1,12 +0,0 @@ -import PropTypes from 'prop-types'; - -export default PropTypes.oneOfType([ - PropTypes.func, - PropTypes.elementType, - PropTypes.number, - PropTypes.shape({ - uri: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired, - // eslint-disable-next-line react/forbid-prop-types - headers: PropTypes.object, - }), -]); diff --git a/src/components/Tooltip/BaseTooltip/index.tsx b/src/components/Tooltip/BaseTooltip/index.tsx index 5f6c38d19bff6..ca0315f68aa1d 100644 --- a/src/components/Tooltip/BaseTooltip/index.tsx +++ b/src/components/Tooltip/BaseTooltip/index.tsx @@ -20,8 +20,6 @@ const hasHoverSupport = DeviceCapabilities.hasHoverSupport(); /** * A component used to wrap an element intended for displaying a tooltip. The term "tooltip's target" refers to the * wrapped element, which, upon hover, triggers the tooltip to be shown. - * @param {propTypes} props - * @returns {ReactNodeLike} */ /** @@ -30,10 +28,10 @@ const hasHoverSupport = DeviceCapabilities.hasHoverSupport(); * so we need to find the correct part (the one that the user is hovering * over) and show the tooltip there. * - * @param {Element} target The DOM element being hovered over. - * @param {number} clientX The X position from the MouseEvent. - * @param {number} clientY The Y position from the MouseEvent. - * @return {DOMRect} The chosen bounding box. + * @param target The DOM element being hovered over. + * @param clientX The X position from the MouseEvent. + * @param clientY The Y position from the MouseEvent. + * @return The chosen bounding box. */ function chooseBoundingBox(target: HTMLElement, clientX: number, clientY: number): DOMRect { diff --git a/src/components/avatarPropTypes.js b/src/components/avatarPropTypes.js deleted file mode 100644 index 2fcf34aaa8bd1..0000000000000 --- a/src/components/avatarPropTypes.js +++ /dev/null @@ -1,11 +0,0 @@ -import PropTypes from 'prop-types'; -import CONST from '@src/CONST'; -import sourcePropTypes from './Image/sourcePropTypes'; - -export default PropTypes.shape({ - source: PropTypes.oneOfType([PropTypes.string, sourcePropTypes]), - type: PropTypes.oneOf([CONST.ICON_TYPE_AVATAR, CONST.ICON_TYPE_WORKSPACE]), - name: PropTypes.string, - id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), - fallbackIcon: PropTypes.oneOfType([PropTypes.string, sourcePropTypes]), -}); diff --git a/src/components/categoryPropTypes.js b/src/components/categoryPropTypes.js deleted file mode 100644 index 90c3ac368d1c1..0000000000000 --- a/src/components/categoryPropTypes.js +++ /dev/null @@ -1,9 +0,0 @@ -import PropTypes from 'prop-types'; - -export default PropTypes.shape({ - /** Name of a category */ - name: PropTypes.string.isRequired, - - /** Flag that determines if a category is active and able to be selected */ - enabled: PropTypes.bool.isRequired, -}); diff --git a/src/components/optionPropTypes.js b/src/components/optionPropTypes.js deleted file mode 100644 index 53d8e86b02d6d..0000000000000 --- a/src/components/optionPropTypes.js +++ /dev/null @@ -1,65 +0,0 @@ -import PropTypes from 'prop-types'; -import CONST from '@src/CONST'; -import avatarPropTypes from './avatarPropTypes'; -import participantPropTypes from './participantPropTypes'; - -export default PropTypes.shape({ - // Text to display - text: PropTypes.string, - - /** Display the text of the option in bold font style */ - boldStyle: PropTypes.bool, - - // Alternate text to display - alternateText: PropTypes.string, - - // Alternate text number of lines - alternateTextMaxLines: PropTypes.number, - - // Array of icon information - icons: PropTypes.arrayOf(avatarPropTypes), - - // Login (only present when there is a single participant) - login: PropTypes.string, - - // reportID (only present when there is a matching report) - reportID: PropTypes.string, - - // Key used internally by React - keyForList: PropTypes.string, - - // Search text we use to filter options - searchText: PropTypes.string, - - // Whether the report is pinned or not - isPinned: PropTypes.bool, - - // Whether the report corresponds to a chat room - isChatRoom: PropTypes.bool, - - // Custom icon to render on the right side of the option - customIcon: PropTypes.shape({ - // The icon source - src: PropTypes.func, - - // The color of the icon - color: PropTypes.string, - }), - - // List of participants of the report - participantsList: PropTypes.arrayOf(participantPropTypes), - - // Descriptive text to be displayed besides selection element - descriptiveText: PropTypes.string, - - // The type of option we have e.g. user or report - type: PropTypes.string, - - // Text to show for tooltip - tooltipText: PropTypes.string, - - /** If we need to show a brick road indicator or not */ - brickRoadIndicator: PropTypes.oneOf([CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR, '']), - - phoneNumber: PropTypes.string, -}); diff --git a/src/components/participantPropTypes.js b/src/components/participantPropTypes.js deleted file mode 100644 index d09eb5c783324..0000000000000 --- a/src/components/participantPropTypes.js +++ /dev/null @@ -1,28 +0,0 @@ -import PropTypes from 'prop-types'; -import sourcePropTypes from './Image/sourcePropTypes'; - -export default PropTypes.shape({ - // Primary login of participant - login: PropTypes.string, - - // Account ID of participant - accountID: PropTypes.number, - - // Display Name of participant - displayName: PropTypes.string, - - // Avatar url of participant - avatar: PropTypes.oneOfType([PropTypes.string, sourcePropTypes]), - - /** First Name of the participant */ - firstName: PropTypes.string, - - /** True if the report is a Policy Expense chat */ - isPolicyExpenseChat: PropTypes.bool, - - /** True if the policy expense chat is owned by this user */ - isOwnPolicyExpenseChat: PropTypes.bool, - - /** Whether the participant is selected */ - selected: PropTypes.bool, -}); diff --git a/src/components/tagPropTypes.js b/src/components/tagPropTypes.js deleted file mode 100644 index bb85dc31b9389..0000000000000 --- a/src/components/tagPropTypes.js +++ /dev/null @@ -1,21 +0,0 @@ -import PropTypes from 'prop-types'; - -const tagListPropTypes = PropTypes.shape({ - /** Name of a tag */ - name: PropTypes.string.isRequired, - - /** Flag that determines if a tag is active and able to be selected */ - enabled: PropTypes.bool.isRequired, - - /** "General Ledger code" that corresponds to this tag in an accounting system. Similar to an ID. */ - // eslint-disable-next-line @typescript-eslint/naming-convention - 'GL Code': PropTypes.string, -}); - -export default PropTypes.objectOf( - PropTypes.shape({ - name: PropTypes.string, - required: PropTypes.bool, - tags: PropTypes.objectOf(tagListPropTypes), - }), -); diff --git a/src/components/withCurrentReportID.tsx b/src/components/withCurrentReportID.tsx index a720639132830..1d62d92fc8f9a 100644 --- a/src/components/withCurrentReportID.tsx +++ b/src/components/withCurrentReportID.tsx @@ -1,5 +1,4 @@ import type {NavigationState} from '@react-navigation/native'; -import PropTypes from 'prop-types'; import type {ComponentType, ForwardedRef, RefAttributes} from 'react'; import React, {createContext, forwardRef, useCallback, useMemo, useState} from 'react'; import getComponentDisplayName from '@libs/getComponentDisplayName'; @@ -17,15 +16,6 @@ type CurrentReportIDContextProviderProps = { const CurrentReportIDContext = createContext(null); -// TODO: Remove when depended components are migrated to TypeScript. -const withCurrentReportIDPropTypes = { - /** Function to update the state */ - updateCurrentReportID: PropTypes.func.isRequired, - - /** The top most report id */ - currentReportID: PropTypes.string, -}; - const withCurrentReportIDDefaultProps = { currentReportID: '', }; @@ -95,5 +85,5 @@ export default function withCurrentReportID({ isKeyboardShown: false, keyboardHeight: 0, @@ -76,4 +66,5 @@ export default function withKeyboardState( @@ -57,5 +29,4 @@ export default function withLocalize( return forwardRef(WithLocalize); } -export {withLocalizePropTypes}; export type {WithLocalizeProps}; diff --git a/src/components/withStyleUtils.tsx b/src/components/withStyleUtils.tsx index 881aa9cbe4aec..82511d0f66ded 100644 --- a/src/components/withStyleUtils.tsx +++ b/src/components/withStyleUtils.tsx @@ -1,13 +1,9 @@ -import PropTypes from 'prop-types'; import type {ComponentType, ForwardedRef, ReactElement, RefAttributes} from 'react'; import React, {forwardRef} from 'react'; import useStyleUtils from '@hooks/useStyleUtils'; import getComponentDisplayName from '@libs/getComponentDisplayName'; import type {StyleUtilsType} from '@styles/utils'; -const withStyleUtilsPropTypes = { - StyleUtils: PropTypes.object.isRequired, -}; type WithStyleUtilsProps = {StyleUtils: StyleUtilsType}; export default function withStyleUtils( @@ -30,4 +26,4 @@ export default function withStyleUtils return forwardRef(WithStyleUtils); } -export {withStyleUtilsPropTypes, type WithStyleUtilsProps}; +export type {WithStyleUtilsProps}; diff --git a/src/components/withTheme.tsx b/src/components/withTheme.tsx index b9b81d6daac27..21aaa96fd1c14 100644 --- a/src/components/withTheme.tsx +++ b/src/components/withTheme.tsx @@ -1,13 +1,9 @@ -import PropTypes from 'prop-types'; import type {ComponentType, ForwardedRef, ReactElement, RefAttributes} from 'react'; import React, {forwardRef} from 'react'; import useTheme from '@hooks/useTheme'; import getComponentDisplayName from '@libs/getComponentDisplayName'; import type {ThemeColors} from '@styles/theme/types'; -const withThemePropTypes = { - theme: PropTypes.object.isRequired, -}; type WithThemeProps = {theme: ThemeColors}; export default function withTheme( @@ -30,5 +26,4 @@ export default function withTheme( return forwardRef(WithTheme); } -export {withThemePropTypes}; export type {WithThemeProps}; diff --git a/src/components/withThemeStyles.tsx b/src/components/withThemeStyles.tsx index be1f26fd966c5..8391a58eaffd4 100644 --- a/src/components/withThemeStyles.tsx +++ b/src/components/withThemeStyles.tsx @@ -1,13 +1,9 @@ -import PropTypes from 'prop-types'; import type {ComponentType, ForwardedRef, ReactElement, RefAttributes} from 'react'; import React, {forwardRef} from 'react'; import useThemeStyles from '@hooks/useThemeStyles'; import getComponentDisplayName from '@libs/getComponentDisplayName'; import type {ThemeStyles} from '@styles/index'; -const withThemeStylesPropTypes = { - themeStyles: PropTypes.object.isRequired, -}; type WithThemeStylesProps = {themeStyles: ThemeStyles}; export default function withThemeStyles( @@ -30,5 +26,4 @@ export default function withThemeStyles(null); -const windowDimensionsPropTypes = { - // Width of the window - windowWidth: PropTypes.number.isRequired, - - // Height of the window - windowHeight: PropTypes.number.isRequired, - - // Is the window width extra narrow, like on a Fold mobile device? - isExtraSmallScreenWidth: PropTypes.bool.isRequired, - - // Is the window width narrow, like on a mobile device? - isSmallScreenWidth: PropTypes.bool.isRequired, - - // Is the window width medium sized, like on a tablet device? - isMediumScreenWidth: PropTypes.bool.isRequired, - - // Is the window width wide, like on a browser or desktop? - isLargeScreenWidth: PropTypes.bool.isRequired, -}; function WindowDimensionsProvider(props: ChildrenProps) { const [windowDimension, setWindowDimension] = useState(() => { @@ -98,4 +78,4 @@ export default function withWindowDimensions(null); -const windowDimensionsPropTypes = { - // Width of the window - windowWidth: PropTypes.number.isRequired, - - // Height of the window - windowHeight: PropTypes.number.isRequired, - - // Is the window width extra narrow, like on a Fold mobile device? - isExtraSmallScreenWidth: PropTypes.bool.isRequired, - - // Is the window width narrow, like on a mobile device? - isSmallScreenWidth: PropTypes.bool.isRequired, - - // Is the window width medium sized, like on a tablet device? - isMediumScreenWidth: PropTypes.bool.isRequired, - - // Is the window width wide, like on a browser or desktop? - isLargeScreenWidth: PropTypes.bool.isRequired, -}; function WindowDimensionsProvider(props: ChildrenProps) { const [windowDimension, setWindowDimension] = useState(() => { @@ -104,4 +84,4 @@ export default function withWindowDimensions(phrase: TKey, ...variable return translate(BaseLocaleListener.getPreferredLocale(), phrase, ...variables); } -/** - * Traslatable text with phrase key and/or variables - * Use MaybePhraseKey for Typescript - * - * E.g. ['common.error.characterLimitExceedCounter', {length: 5, limit: 20}] - */ -const translatableTextPropTypes = PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.object]))]); - type MaybePhraseKey = string | null | [string, Record & {isTranslated?: boolean}] | []; /** @@ -263,5 +254,5 @@ function getDevicePreferredLocale(): Locale { return RNLocalize.findBestAvailableLanguage([CONST.LOCALES.EN, CONST.LOCALES.ES])?.languageTag ?? CONST.LOCALES.DEFAULT; } -export {translatableTextPropTypes, translate, translateLocal, translateIfPhraseKey, formatList, formatMessageElementList, getDevicePreferredLocale}; +export {translate, translateLocal, translateIfPhraseKey, formatList, formatMessageElementList, getDevicePreferredLocale}; export type {PhraseParameters, Phrase, MaybePhraseKey}; diff --git a/src/libs/Violations/propTypes.ts b/src/libs/Violations/propTypes.ts deleted file mode 100644 index 4b5e84405cba4..0000000000000 --- a/src/libs/Violations/propTypes.ts +++ /dev/null @@ -1,32 +0,0 @@ -import PropTypes from 'prop-types'; -import CONST from '@src/CONST'; - -const violationNames = Object.values(CONST.VIOLATIONS); - -const transactionViolationPropType = PropTypes.shape({ - type: PropTypes.string.isRequired, - name: PropTypes.oneOf(violationNames).isRequired, - data: PropTypes.shape({ - rejectedBy: PropTypes.string, - rejectReason: PropTypes.string, - amount: PropTypes.string, - surcharge: PropTypes.number, - invoiceMarkup: PropTypes.number, - maxAge: PropTypes.number, - tagName: PropTypes.string, - formattedLimitAmount: PropTypes.string, - categoryLimit: PropTypes.string, - limit: PropTypes.string, - category: PropTypes.string, - brokenBankConnection: PropTypes.bool, - isAdmin: PropTypes.bool, - email: PropTypes.string, - isTransactionOlderThan7Days: PropTypes.bool, - member: PropTypes.string, - taxName: PropTypes.string, - }), -}); - -const transactionViolationsPropType = PropTypes.objectOf(PropTypes.arrayOf(transactionViolationPropType)); - -export {transactionViolationsPropType, transactionViolationPropType}; diff --git a/src/pages/home/report/reportActionFragmentPropTypes.js b/src/pages/home/report/reportActionFragmentPropTypes.js deleted file mode 100644 index 5d2e3b951a1de..0000000000000 --- a/src/pages/home/report/reportActionFragmentPropTypes.js +++ /dev/null @@ -1,32 +0,0 @@ -import PropTypes from 'prop-types'; - -export default PropTypes.shape({ - /** The type of the action item fragment. Used to render a corresponding component */ - type: PropTypes.string.isRequired, - - /** The text content of the fragment. */ - text: PropTypes.string.isRequired, - - /** Used to apply additional styling. Style refers to a predetermined constant and not a class name. e.g. 'normal' - * or 'strong' - */ - style: PropTypes.string, - - /** ID of a report */ - reportID: PropTypes.string, - - /** ID of a policy */ - policyID: PropTypes.string, - - /** The target of a link fragment e.g. '_blank' */ - target: PropTypes.string, - - /** The destination of a link fragment e.g. 'https://www.expensify.com' */ - href: PropTypes.string, - - /** An additional avatar url - not the main avatar url but used within a message. */ - iconUrl: PropTypes.string, - - /** Fragment edited flag */ - isEdited: PropTypes.bool, -}); diff --git a/src/pages/home/report/reportActionPropTypes.js b/src/pages/home/report/reportActionPropTypes.js deleted file mode 100644 index 5f9643571e540..0000000000000 --- a/src/pages/home/report/reportActionPropTypes.js +++ /dev/null @@ -1,31 +0,0 @@ -import PropTypes from 'prop-types'; -import reportActionFragmentPropTypes from './reportActionFragmentPropTypes'; - -export default { - /** The ID of the reportAction. It is the string representation of the a 64-bit integer. */ - reportActionID: PropTypes.string, - - /** Name of the action e.g. ADD_COMMENT */ - actionName: PropTypes.string, - - /** Person who created the action */ - person: PropTypes.arrayOf(reportActionFragmentPropTypes), - - /** ISO-formatted datetime */ - created: PropTypes.string, - - /** report action message */ - message: PropTypes.arrayOf(reportActionFragmentPropTypes), - - /** Original message associated with this action */ - originalMessage: PropTypes.shape({ - // The ID of the iou transaction - IOUTransactionID: PropTypes.string, - - /** accountIDs of the people to which the whisper was sent to (if any). Returns empty array if it is not a whisper */ - whisperedTo: PropTypes.arrayOf(PropTypes.number), - }), - - /** Error message that's come back from the server. */ - error: PropTypes.string, -}; diff --git a/src/pages/workspace/withPolicy.tsx b/src/pages/workspace/withPolicy.tsx index 94ba6ee610006..56ad756194a0d 100644 --- a/src/pages/workspace/withPolicy.tsx +++ b/src/pages/workspace/withPolicy.tsx @@ -1,11 +1,9 @@ import type {RouteProp} from '@react-navigation/native'; import {useNavigationState} from '@react-navigation/native'; -import PropTypes from 'prop-types'; import type {ComponentType, ForwardedRef, RefAttributes} from 'react'; import React, {forwardRef} from 'react'; import type {OnyxEntry} from 'react-native-onyx'; import {withOnyx} from 'react-native-onyx'; -import {translatableTextPropTypes} from '@libs/Localize'; import type { BottomTabNavigatorParamList, CentralPaneNavigatorParamList, @@ -14,7 +12,6 @@ import type { SettingsNavigatorParamList, } from '@navigation/types'; import * as Policy from '@userActions/Policy/Policy'; -import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import type SCREENS from '@src/SCREENS'; import type * as OnyxTypes from '@src/types/onyx'; @@ -48,98 +45,6 @@ function getPolicyIDFromRoute(route: PolicyRoute): string { return route?.params?.policyID ?? ''; } -const taxPropTypes = PropTypes.shape({ - /** Name of a tax */ - name: PropTypes.string, - - /** The value of a tax */ - value: PropTypes.string, - - /** Whether the tax is disabled */ - isDisabled: PropTypes.bool, -}); - -const taxRatesPropTypes = PropTypes.shape({ - /** Name of the tax */ - name: PropTypes.string, - - /** Default policy tax ID */ - defaultExternalID: PropTypes.string, - - /** Default value of taxes */ - defaultValue: PropTypes.string, - - /** Default foreign policy tax ID */ - foreignTaxDefault: PropTypes.string, - - /** List of tax names and values */ - taxes: PropTypes.objectOf(taxPropTypes), -}); - -const policyPropTypes = { - /** The policy object for the current route */ - policy: PropTypes.shape({ - /** The ID of the policy */ - id: PropTypes.string, - - /** The name of the policy */ - name: PropTypes.string, - - /** The current user's role in the policy */ - role: PropTypes.oneOf(Object.values(CONST.POLICY.ROLE)), - - /** The policy type */ - type: PropTypes.oneOf(Object.values(CONST.POLICY.TYPE)), - - /** The email of the policy owner */ - owner: PropTypes.string, - - /** The output currency for the policy */ - outputCurrency: PropTypes.string, - - /** The URL for the policy avatar */ - avatar: PropTypes.string, - - /** Errors on the policy keyed by microtime */ - errors: PropTypes.objectOf(PropTypes.string), - - /** - * Error objects keyed by field name containing errors keyed by microtime - * E.x - * { - * name: { - * [DateUtils.getMicroseconds()]: 'Sorry, there was an unexpected problem updating your workspace name.', - * } - * } - */ - errorFields: PropTypes.objectOf(PropTypes.objectOf(translatableTextPropTypes)), - - /** Whether or not the policy requires tags */ - requiresTag: PropTypes.bool, - - /** Whether or not the policy requires categories */ - requiresCategory: PropTypes.bool, - - /** Whether or not the policy has multiple tag lists */ - hasMultipleTagLists: PropTypes.bool, - - /** - * Whether or not the policy has tax tracking enabled - * - * @deprecated - use tax.trackingEnabled instead - */ - isTaxTrackingEnabled: PropTypes.bool, - - /** Whether or not the policy has tax tracking enabled */ - tax: PropTypes.shape({ - trackingEnabled: PropTypes.bool, - }), - - /** Collection of tax rates attached to a policy */ - taxRates: taxRatesPropTypes, - }), -}; - type WithPolicyOnyxProps = { policy: OnyxEntry; policyDraft: OnyxEntry; @@ -188,5 +93,5 @@ export default function (WrappedComponent: })(forwardRef(WithPolicy)); } -export {policyDefaultProps, policyPropTypes}; +export {policyDefaultProps}; export type {PolicyRoute, WithPolicyOnyxProps, WithPolicyProps}; diff --git a/src/styles/stylePropTypes.js b/src/styles/stylePropTypes.js deleted file mode 100644 index b82db94140eed..0000000000000 --- a/src/styles/stylePropTypes.js +++ /dev/null @@ -1,5 +0,0 @@ -import PropTypes from 'prop-types'; - -const stylePropTypes = PropTypes.oneOfType([PropTypes.object, PropTypes.bool, PropTypes.arrayOf(PropTypes.object), PropTypes.func]); - -export default stylePropTypes;