diff --git a/src/CONST.ts b/src/CONST.ts index d52185fa4b3d..42071a155e74 100755 --- a/src/CONST.ts +++ b/src/CONST.ts @@ -405,8 +405,8 @@ const CONST = { ANIMATION_GYROSCOPE_VALUE: 0.4, ANIMATION_PAID_DURATION: 200, ANIMATION_PAID_CHECKMARK_DELAY: 300, - ANIMATION_THUMBSUP_DURATION: 250, - ANIMATION_THUMBSUP_DELAY: 200, + ANIMATION_THUMBS_UP_DURATION: 250, + ANIMATION_THUMBS_UP_DELAY: 200, ANIMATION_PAID_BUTTON_HIDE_DELAY: 300, BACKGROUND_IMAGE_TRANSITION_DURATION: 1000, SCREEN_TRANSITION_END_TIMEOUT: 1000, @@ -1181,7 +1181,7 @@ const CONST = { }, MAX_COUNT_BEFORE_FOCUS_UPDATE: 30, MIN_INITIAL_REPORT_ACTION_COUNT: 15, - UNREPORTED_REPORTID: '0', + UNREPORTED_REPORT_ID: '0', SPLIT_REPORTID: '-2', SECONDARY_ACTIONS: { SUBMIT: 'submit', @@ -1525,7 +1525,7 @@ const CONST = { MODAL_TYPE: { CONFIRM: 'confirm', CENTERED: 'centered', - CENTERED_SWIPABLE_TO_RIGHT: 'centered_swipable_to_right', + CENTERED_SWIPEABLE_TO_RIGHT: 'centered_swipable_to_right', CENTERED_UNSWIPEABLE: 'centered_unswipeable', CENTERED_SMALL: 'centered_small', BOTTOM_DOCKED: 'bottom_docked', @@ -1777,7 +1777,7 @@ const CONST = { // More info https://github.com/Expensify/App/issues/8007 EMAIL_SEARCH_REGEX: /\.(?=[^\s@]*@)/g, - VALIDATE_FOR_LEADINGSPACES_HTML_TAG_REGEX: /<([\s]+.+[\s]*)>/g, + VALIDATE_FOR_LEADING_SPACES_HTML_TAG_REGEX: /<([\s]+.+[\s]*)>/g, WHITELISTED_TAGS: [/<>/, /< >/, /<->/, /<-->/, /
/, //], @@ -3140,7 +3140,7 @@ const CONST = { }, AVATAR_SIZE: { - XLARGE: 'xlarge', + X_LARGE: 'xlarge', LARGE: 'large', MEDIUM: 'medium', DEFAULT: 'default', @@ -5058,7 +5058,7 @@ const CONST = { SUBMITTER: 'submitter', }, }, - DELEGATE_ROLE_HELPDOT_ARTICLE_LINK: 'https://help.expensify.com/expensify-classic/hubs/copilots-and-delegates/', + DELEGATE_ROLE_HELP_DOT_ARTICLE_LINK: 'https://help.expensify.com/expensify-classic/hubs/copilots-and-delegates/', STRIPE_GBP_AUTH_STATUSES: { SUCCEEDED: 'succeeded', CARD_AUTHENTICATION_REQUIRED: 'authentication_required', @@ -6987,9 +6987,9 @@ const CONST = { BASE_LIST_ITEM_TEST_ID: 'base-list-item-', PRODUCT_TRAINING_TOOLTIP_NAMES: { - // TODO: CONCEIRGE_LHN_GBR tooltip will be replaced by a tooltip in the #admins room + // TODO: CONCIERGE_LHN_GBR tooltip will be replaced by a tooltip in the #admins room // https://github.com/Expensify/App/issues/57045#issuecomment-2701455668 - CONCEIRGE_LHN_GBR: 'conciergeLHNGBR', + CONCIERGE_LHN_GBR: 'conciergeLHNGBR', RENAME_SAVED_SEARCH: 'renameSavedSearch', BOTTOM_NAV_INBOX_TOOLTIP: 'bottomNavInboxTooltip', LHN_WORKSPACE_CHAT_TOOLTIP: 'workspaceChatLHNTooltip', diff --git a/src/ONYXKEYS.ts b/src/ONYXKEYS.ts index 07a9a53c8960..d7a7b824e2c9 100755 --- a/src/ONYXKEYS.ts +++ b/src/ONYXKEYS.ts @@ -131,7 +131,7 @@ const ONYXKEYS = { NVP_ONBOARDING: 'nvp_onboarding', /** This NVP contains data associated with HybridApp */ - NVP_TRYNEWDOT: 'nvp_tryNewDot', + NVP_TRY_NEW_DOT: 'NVP_TRY_NEW_DOT', /** Contains the platforms for which the user muted the sounds */ NVP_MUTED_PLATFORMS: 'nvp_mutedPlatforms', @@ -981,8 +981,8 @@ type OnyxValuesMapping = { [ONYXKEYS.NVP_ONBOARDING]: Onboarding; - // ONYXKEYS.NVP_TRYNEWDOT is HybridApp onboarding data - [ONYXKEYS.NVP_TRYNEWDOT]: OnyxTypes.TryNewDot; + // ONYXKEYS.NVP_TRY_NEW_DOT is HybridApp onboarding data + [ONYXKEYS.NVP_TRY_NEW_DOT]: OnyxTypes.TryNewDot; [ONYXKEYS.RECENT_SEARCHES]: Record; [ONYXKEYS.SAVED_SEARCHES]: OnyxTypes.SaveSearch; [ONYXKEYS.RECENTLY_USED_CURRENCIES]: string[]; diff --git a/src/components/AddressSearch/index.tsx b/src/components/AddressSearch/index.tsx index f6e8482f5058..1df709b51dfa 100644 --- a/src/components/AddressSearch/index.tsx +++ b/src/components/AddressSearch/index.tsx @@ -186,7 +186,7 @@ function AddressSearch( // When locality is not returned, many countries return the city as postalTown (e.g. 5 New Street // Square, London), otherwise as sublocality (e.g. 384 Court Street Brooklyn). If postalTown is // returned, the sublocality will be a city subdivision so shouldn't take precedence (e.g. - // Salagatan, Upssala, Sweden). + // Salagatan, Uppsala, Sweden). city: locality || postalTown || sublocality || cityAutocompleteFallback, zipCode, diff --git a/src/components/AmountForm.tsx b/src/components/AmountForm.tsx index 3e6ac7b2fac8..99f5812eb9fa 100644 --- a/src/components/AmountForm.tsx +++ b/src/components/AmountForm.tsx @@ -227,7 +227,7 @@ function AmountForm( const textInputKeyPress = (event: NativeSyntheticEvent) => { const key = event.nativeEvent.key.toLowerCase(); if (isMobileSafari() && key === CONST.PLATFORM_SPECIFIC_KEYS.CTRL.DEFAULT) { - // Optimistically anticipate forward-delete on iOS Safari (in cases where the Mac Accessiblity keyboard is being + // Optimistically anticipate forward-delete on iOS Safari (in cases where the Mac Accessibility keyboard is being // used for input). If the Control-D shortcut doesn't get sent, the ref will still be reset on the next key press. forwardDeletePressedRef.current = true; return; diff --git a/src/components/AttachmentModal.tsx b/src/components/AttachmentModal.tsx index 07dcfbb98b8a..ca230a1d9e67 100644 --- a/src/components/AttachmentModal.tsx +++ b/src/components/AttachmentModal.tsx @@ -245,7 +245,7 @@ function AttachmentModal({ ); /** - * If our attachment is a PDF, return the unswipeablge Modal type. + * If our attachment is a PDF, return the unswipeable Modal type. */ const getModalType = useCallback( (sourceURL: string, fileObject: FileObject) => diff --git a/src/components/AttachmentOfflineIndicator.tsx b/src/components/AttachmentOfflineIndicator.tsx index 0451cbd87ae3..4af97c0dd12c 100644 --- a/src/components/AttachmentOfflineIndicator.tsx +++ b/src/components/AttachmentOfflineIndicator.tsx @@ -45,7 +45,7 @@ function AttachmentOfflineIndicator({isPreview = false}: AttachmentOfflineIndica {!isPreview && ( {translate('common.youAppearToBeOffline')} - {translate('common.attachementWillBeAvailableOnceBackOnline')} + {translate('common.attachmentWillBeAvailableOnceBackOnline')} )} diff --git a/src/components/AttachmentPicker/index.native.tsx b/src/components/AttachmentPicker/index.native.tsx index ada6b2c110f7..7d4d707e6b79 100644 --- a/src/components/AttachmentPicker/index.native.tsx +++ b/src/components/AttachmentPicker/index.native.tsx @@ -168,8 +168,8 @@ function AttachmentPicker({ ImageManipulator.manipulate(targetAssetUri) .renderAsync() .then((manipulatedImage) => manipulatedImage.saveAsync({format: SaveFormat.JPEG})) - .then((manipResult) => { - const uri = manipResult.uri; + .then((manipulationResult) => { + const uri = manipulationResult.uri; const convertedAsset = { uri, name: uri @@ -177,8 +177,8 @@ function AttachmentPicker({ .split('?') .at(0), type: 'image/jpeg', - width: manipResult.width, - height: manipResult.height, + width: manipulationResult.width, + height: manipulationResult.height, }; return resolve([convertedAsset]); diff --git a/src/components/Attachments/AttachmentCarousel/CarouselButtons.tsx b/src/components/Attachments/AttachmentCarousel/CarouselButtons.tsx index e452cddb4128..04fd1163af44 100644 --- a/src/components/Attachments/AttachmentCarousel/CarouselButtons.tsx +++ b/src/components/Attachments/AttachmentCarousel/CarouselButtons.tsx @@ -25,10 +25,10 @@ type CarouselButtonsProps = { /** Callback to go one page forward */ onForward: () => void; - /** Callback for autohiding carousel button arrows */ + /** Callback for auto hiding carousel button arrows */ autoHideArrow?: () => void; - /** Callback for cancelling autohiding of carousel button arrows */ + /** Callback for cancelling auto hiding of carousel button arrows */ cancelAutoHideArrow?: () => void; }; diff --git a/src/components/Attachments/AttachmentView/AttachmentViewPdf/index.android.tsx b/src/components/Attachments/AttachmentView/AttachmentViewPdf/index.android.tsx index c756345664cc..c304187b8876 100644 --- a/src/components/Attachments/AttachmentView/AttachmentViewPdf/index.android.tsx +++ b/src/components/Attachments/AttachmentView/AttachmentViewPdf/index.android.tsx @@ -7,7 +7,7 @@ import useThemeStyles from '@hooks/useThemeStyles'; import BaseAttachmentViewPdf from './BaseAttachmentViewPdf'; import type AttachmentViewPdfProps from './types'; -// If the user pans less than this threshold, we'll not enable/disable the pager scroll, since the thouch will most probably be a tap. +// If the user pans less than this threshold, we'll not enable/disable the pager scroll, since the touch will most probably be a tap. // If the user moves their finger more than this threshold in the X direction, we'll enable the pager scroll. Otherwise if in the Y direction, we'll disable it. const SCROLL_THRESHOLD = 10; diff --git a/src/components/Attachments/AttachmentView/index.tsx b/src/components/Attachments/AttachmentView/index.tsx index e212e34b9595..bc90ba07681e 100644 --- a/src/components/Attachments/AttachmentView/index.tsx +++ b/src/components/Attachments/AttachmentView/index.tsx @@ -214,7 +214,7 @@ function AttachmentView({ // We need the following View component on android native // So that the event will propagate properly and - // the Password protected preview will be shown for pdf attachement we are about to send. + // the Password protected preview will be shown for pdf attachment we are about to send. return ( { + ImageSize.getSize(imageUri).then(({width, height, rotation: originalRotation}) => { // On Android devices ImageSize library returns also rotation parameter. - if (orginalRotation === 90 || orginalRotation === 270) { + if (originalRotation === 90 || originalRotation === 270) { originalImageHeight.set(width); originalImageWidth.set(height); } else { diff --git a/src/components/AvatarWithImagePicker.tsx b/src/components/AvatarWithImagePicker.tsx index ee88c7c403dc..f07afb9c4513 100644 --- a/src/components/AvatarWithImagePicker.tsx +++ b/src/components/AvatarWithImagePicker.tsx @@ -75,7 +75,7 @@ type AvatarWithImagePickerProps = { isUsingDefaultAvatar?: boolean; /** Size of Indicator */ - size?: typeof CONST.AVATAR_SIZE.XLARGE | typeof CONST.AVATAR_SIZE.LARGE | typeof CONST.AVATAR_SIZE.DEFAULT; + size?: typeof CONST.AVATAR_SIZE.X_LARGE | typeof CONST.AVATAR_SIZE.LARGE | typeof CONST.AVATAR_SIZE.DEFAULT; /** A fallback avatar icon to display when there is an error on loading avatar from remote URL. */ fallbackIcon?: AvatarSource; diff --git a/src/components/BigNumberPad.tsx b/src/components/BigNumberPad.tsx index 30d5c0f45d1d..6785387e274f 100644 --- a/src/components/BigNumberPad.tsx +++ b/src/components/BigNumberPad.tsx @@ -70,7 +70,7 @@ function BigNumberPad({numberPressed, longPressHandlerStateChanged = () => {}, i > {row.map((column, columnIndex) => { // Adding margin between buttons except first column to - // avoid unccessary space before the first column. + // avoid unnecessary space before the first column. const marginLeft = columnIndex > 0 ? styles.ml3 : {}; return ( diff --git a/src/components/BookTravelButton.tsx b/src/components/BookTravelButton.tsx index 2c5646e3c979..25a8c0f850cd 100644 --- a/src/components/BookTravelButton.tsx +++ b/src/components/BookTravelButton.tsx @@ -37,7 +37,7 @@ type BookTravelButtonProps = { }; const navigateToAcceptTerms = (domain: string, isUserValidated?: boolean) => { - // Remove the previous provision session infromation if any is cached. + // Remove the previous provision session information if any is cached. cleanupTravelProvisioningSession(); if (isUserValidated) { Navigation.navigate(ROUTES.TRAVEL_TCS.getRoute(domain)); diff --git a/src/components/Breadcrumbs.tsx b/src/components/Breadcrumbs.tsx index 3f1d78eae06b..874184ddabed 100644 --- a/src/components/Breadcrumbs.tsx +++ b/src/components/Breadcrumbs.tsx @@ -39,7 +39,7 @@ function Breadcrumbs({breadcrumbs, style}: BreadcrumbsProps) { const isRootBreadcrumb = primaryBreadcrumb.type === CONST.BREADCRUMB_TYPE.ROOT; const fontScale = PixelRatio.getFontScale() > CONST.LOGO_MAX_SCALE ? CONST.LOGO_MAX_SCALE : PixelRatio.getFontScale(); return ( - + {isRootBreadcrumb ? (
& { /** Function to check whether composer is covered up or not */ checkComposerVisibility?: () => boolean; - /** Whether the sull composer is open */ + /** Whether the full composer is open */ isComposerFullSize?: boolean; /** Should make the input only scroll inside the element avoid scroll out to parent */ diff --git a/src/components/ConfirmContent.tsx b/src/components/ConfirmContent.tsx index 22e7ec76c5b5..4ccd207a8a9e 100644 --- a/src/components/ConfirmContent.tsx +++ b/src/components/ConfirmContent.tsx @@ -97,7 +97,7 @@ type ConfirmContentProps = { /** Styles for the image */ imageStyles?: StyleProp; - /** Whether the modal is visibile */ + /** Whether the modal is visible */ isVisible: boolean; /** Whether the confirm button is loading */ diff --git a/src/components/ConfirmedRoute.tsx b/src/components/ConfirmedRoute.tsx index e1580dcae7d0..61474e66776e 100644 --- a/src/components/ConfirmedRoute.tsx +++ b/src/components/ConfirmedRoute.tsx @@ -38,7 +38,7 @@ type ConfirmedRouteProps = ConfirmedRoutePropsOnyxProps & { * it will display pending map icon */ requireRouteToDisplayMap?: boolean; - /** Whether the map is interactable or not */ + /** Whether the map is interactive or not */ interactive?: boolean; }; diff --git a/src/components/ConnectionLayout.tsx b/src/components/ConnectionLayout.tsx index 3fe5bef76033..b53f6ecfef5b 100644 --- a/src/components/ConnectionLayout.tsx +++ b/src/components/ConnectionLayout.tsx @@ -41,7 +41,7 @@ type ConnectionLayoutProps = { /** The current feature name that the user tries to get access to */ featureName?: PolicyFeatureName; - /** The content container style of Scrollview */ + /** The content container style of ScrollView */ contentContainerStyle?: StyleProp | undefined; /** Style of the title text */ diff --git a/src/components/ContextMenuItem.tsx b/src/components/ContextMenuItem.tsx index c57c10e2c2b9..f16b11bc6581 100644 --- a/src/components/ContextMenuItem.tsx +++ b/src/components/ContextMenuItem.tsx @@ -42,7 +42,7 @@ type ContextMenuItemProps = { /** Whether the width should be limited */ shouldLimitWidth?: boolean; - /** Styles to apply to ManuItem wrapper */ + /** Styles to apply to MenuItem wrapper */ wrapperStyle?: StyleProp; shouldPreventDefaultFocusOnPress?: boolean; diff --git a/src/components/CountrySelector.tsx b/src/components/CountrySelector.tsx index cff06e5768b6..094f529c66b2 100644 --- a/src/components/CountrySelector.tsx +++ b/src/components/CountrySelector.tsx @@ -37,12 +37,12 @@ function CountrySelector({errorText = '', value: countryCode, onInputChange = () const title = countryCode ? translate(`allCountries.${countryCode}`) : ''; const countryTitleDescStyle = title.length === 0 ? styles.textNormal : null; - const didOpenContrySelector = useRef(false); + const didOpenCountrySelector = useRef(false); const isFocused = useIsFocused(); useEffect(() => { // Check if the country selector was opened and no value was selected, triggering onBlur to display an error - if (isFocused && didOpenContrySelector.current) { - didOpenContrySelector.current = false; + if (isFocused && didOpenCountrySelector.current) { + didOpenCountrySelector.current = false; if (!countryFromUrl) { onBlur?.(); } @@ -76,7 +76,7 @@ function CountrySelector({errorText = '', value: countryCode, onInputChange = () errorText={errorText} onPress={() => { const activeRoute = Navigation.getActiveRoute(); - didOpenContrySelector.current = true; + didOpenCountrySelector.current = true; Navigation.navigate(ROUTES.SETTINGS_ADDRESS_COUNTRY.getRoute(countryCode ?? '', activeRoute)); }} /> diff --git a/src/components/CustomStatusBarAndBackground/index.tsx b/src/components/CustomStatusBarAndBackground/index.tsx index ac1fc77dff96..87b7b5208c41 100644 --- a/src/components/CustomStatusBarAndBackground/index.tsx +++ b/src/components/CustomStatusBarAndBackground/index.tsx @@ -38,7 +38,7 @@ function CustomStatusBarAndBackground({isNested = false}: CustomStatusBarAndBack const didForceUpdateStatusBarRef = useRef(false); const prevIsRootStatusBarEnabled = usePrevious(isRootStatusBarEnabled); - // The prev and current status bar background color refs are initialized with the splash screen background color so the status bar color is changed from the splash screen color to the expected color atleast once on first render - https://github.com/Expensify/App/issues/34154 + // The prev and current status bar background color refs are initialized with the splash screen background color so the status bar color is changed from the splash screen color to the expected color at least once on first render - https://github.com/Expensify/App/issues/34154 const prevStatusBarBackgroundColor = useSharedValue(theme.splashBG); const statusBarBackgroundColor = useSharedValue(theme.splashBG); const statusBarAnimation = useSharedValue(0); @@ -59,7 +59,7 @@ function CustomStatusBarAndBackground({isNested = false}: CustomStatusBarAndBack const listenerCount = useRef(0); // Updates the status bar style and background color depending on the current route and theme - // This callback is triggered everytime the route changes or the theme changes + // This callback is triggered every time the route changes or the theme changes const updateStatusBarStyle = useCallback( (listenerID?: number) => { // Check if this function is either called through the current navigation listener @@ -69,8 +69,8 @@ function CustomStatusBarAndBackground({isNested = false}: CustomStatusBarAndBack return; } - // Set the status bar colour depending on the current route. - // If we don't have any colour defined for a route, fall back to + // Set the status bar color depending on the current route. + // If we don't have any color defined for a route, fall back to // appBG color. let currentRoute: ReturnType | undefined; if (navigationRef.isReady()) { @@ -106,7 +106,7 @@ function CustomStatusBarAndBackground({isNested = false}: CustomStatusBarAndBack }; // Don't update the status bar style if it's the same as the current one, to prevent flashing. - // Force update if the root status bar is back on active or it won't overwirte the nested status bar style + // Force update if the root status bar is back on active or it won't overwrite the nested status bar style if (!didForceUpdateStatusBarRef.current && !prevIsRootStatusBarEnabled && isRootStatusBarEnabled) { callUpdateStatusBarAppearance(); callUpdateStatusBarBackgroundColor(); @@ -159,7 +159,7 @@ function CustomStatusBarAndBackground({isNested = false}: CustomStatusBarAndBack return () => navigationRef.removeListener('state', listener); }, [isDisabled, updateStatusBarStyle]); - // Update the global background and status bar style (on web) everytime the theme changes. + // Update the global background and status bar style (on web) every time the theme changes. // The background of the html element needs to be updated, otherwise you will see a big contrast when resizing the window or when the keyboard is open on iOS web. // The status bar style needs to be updated when the user changes the theme, otherwise, the status bar will not change its color (mWeb iOS). useEffect(() => { diff --git a/src/components/DatePicker/DatePickerModal.tsx b/src/components/DatePicker/DatePickerModal.tsx index f391ec0a80c2..3532ca08d314 100644 --- a/src/components/DatePicker/DatePickerModal.tsx +++ b/src/components/DatePicker/DatePickerModal.tsx @@ -70,7 +70,7 @@ function DatePickerModal({ innerContainerStyle={isSmallScreenWidth ? styles.w100 : {width: CONST.POPOVER_DATE_WIDTH}} anchorAlignment={DEFAULT_ANCHOR_ORIGIN} restoreFocusType={CONST.MODAL.RESTORE_FOCUS_TYPE.DELETE} - shoudSwitchPositionIfOverflow + shouldSwitchPositionIfOverflow shouldEnableNewFocusManagement shouldMeasureAnchorPositionFromTop={shouldPositionFromTop} shouldUseNewModal diff --git a/src/components/DelegateNoAccessModal.tsx b/src/components/DelegateNoAccessModal.tsx index 088e94041e49..ae5a98293407 100644 --- a/src/components/DelegateNoAccessModal.tsx +++ b/src/components/DelegateNoAccessModal.tsx @@ -20,7 +20,7 @@ export default function DelegateNoAccessModal({isNoDelegateAccessMenuVisible = f const delegateNoAccessPrompt = ( {noDelegateAccessPromptStart} - {noDelegateAccessHyperLinked} + {noDelegateAccessHyperLinked} {noDelegateAccessPromptEnd} ); diff --git a/src/components/EmojiPicker/CategoryShortcutBar.tsx b/src/components/EmojiPicker/CategoryShortcutBar.tsx index 25c1ff85f6a3..b2071a656df4 100644 --- a/src/components/EmojiPicker/CategoryShortcutBar.tsx +++ b/src/components/EmojiPicker/CategoryShortcutBar.tsx @@ -1,7 +1,7 @@ import React from 'react'; import {View} from 'react-native'; import useThemeStyles from '@hooks/useThemeStyles'; -import type {HeaderIndice} from '@libs/EmojiUtils'; +import type {HeaderIndices} from '@libs/EmojiUtils'; import CategoryShortcutButton from './CategoryShortcutButton'; type CategoryShortcutBarProps = { @@ -9,7 +9,7 @@ type CategoryShortcutBarProps = { onPress: (index: number) => void; /** The emojis consisting emoji code and indices that the icons should link to */ - headerEmojis: HeaderIndice[]; + headerEmojis: HeaderIndices[]; }; function CategoryShortcutBar({onPress, headerEmojis}: CategoryShortcutBarProps) { diff --git a/src/components/EmojiPicker/EmojiPicker.tsx b/src/components/EmojiPicker/EmojiPicker.tsx index 51ae120d80bf..74aba0b944cd 100644 --- a/src/components/EmojiPicker/EmojiPicker.tsx +++ b/src/components/EmojiPicker/EmojiPicker.tsx @@ -213,7 +213,7 @@ function EmojiPicker({viewportOffsetTop}: EmojiPickerProps, ref: ForwardedRef void; diff --git a/src/components/EnvironmentBadge.tsx b/src/components/EnvironmentBadge.tsx index 272aad734eec..3c0d834ce1f2 100644 --- a/src/components/EnvironmentBadge.tsx +++ b/src/components/EnvironmentBadge.tsx @@ -23,7 +23,7 @@ function EnvironmentBadge() { const success = environment === CONST.ENVIRONMENT.STAGING; const error = environment !== CONST.ENVIRONMENT.STAGING && environment !== CONST.ENVIRONMENT.ADHOC; - const badgeEnviromentStyle = StyleUtils.getEnvironmentBadgeStyle(success, error, adhoc); + const badgeEnvironmentStyle = StyleUtils.getEnvironmentBadgeStyle(success, error, adhoc); // If we are on production, don't show any badge if (isProduction) { @@ -37,7 +37,7 @@ function EnvironmentBadge() { success={success} error={error} text={text} - badgeStyles={[styles.alignSelfStart, styles.headerEnvBadge, styles.environmentBadge, badgeEnviromentStyle]} + badgeStyles={[styles.alignSelfStart, styles.headerEnvBadge, styles.environmentBadge, badgeEnvironmentStyle]} textStyles={styles.headerEnvBadgeText} environment={environment} pressable diff --git a/src/components/Form/FormProvider.tsx b/src/components/Form/FormProvider.tsx index 26e6c7307e6b..20eb548956ad 100644 --- a/src/components/Form/FormProvider.tsx +++ b/src/components/Form/FormProvider.tsx @@ -136,7 +136,7 @@ function FormProvider( return; } const foundHtmlTagIndex = inputValue.search(CONST.VALIDATE_FOR_HTML_TAG_REGEX); - const leadingSpaceIndex = inputValue.search(CONST.VALIDATE_FOR_LEADINGSPACES_HTML_TAG_REGEX); + const leadingSpaceIndex = inputValue.search(CONST.VALIDATE_FOR_LEADING_SPACES_HTML_TAG_REGEX); // Return early if there are no HTML characters if (leadingSpaceIndex === -1 && foundHtmlTagIndex === -1) { diff --git a/src/components/Form/FormWrapper.tsx b/src/components/Form/FormWrapper.tsx index aca6a0ef1a66..3120c5a3fffb 100644 --- a/src/components/Form/FormWrapper.tsx +++ b/src/components/Form/FormWrapper.tsx @@ -128,7 +128,7 @@ function FormWrapper({ // If either of `addBottomSafeAreaPadding` or `shouldSubmitButtonStickToBottom` is explicitly set, // we expect that the user wants to use the new edge-to-edge mode. - // In this case, we want to get and apply the padding unconditionnally. + // In this case, we want to get and apply the padding unconditionally. const isUsingEdgeToEdgeMode = addBottomSafeAreaPadding !== undefined || shouldSubmitButtonStickToBottomProp !== undefined; const shouldSubmitButtonStickToBottom = shouldSubmitButtonStickToBottomProp ?? false; const {paddingBottom} = useSafeAreaPaddings(isUsingEdgeToEdgeMode); diff --git a/src/components/HTMLEngineProvider/BaseHTMLEngineProvider.tsx b/src/components/HTMLEngineProvider/BaseHTMLEngineProvider.tsx index 27b9ec35308f..29f870c3a489 100755 --- a/src/components/HTMLEngineProvider/BaseHTMLEngineProvider.tsx +++ b/src/components/HTMLEngineProvider/BaseHTMLEngineProvider.tsx @@ -20,7 +20,7 @@ type BaseHTMLEngineProviderProps = ChildrenProps & { // We are using the explicit composite architecture for performance gains. // Configuration for RenderHTML is handled in a top-level component providing // context to RenderHTMLSource components. See https://git.io/JRcZb -// Beware that each prop should be referentialy stable between renders to avoid +// Beware that each prop should be referentially stable between renders to avoid // costly invalidations and commits. function BaseHTMLEngineProvider({textSelectable = false, children, enableExperimentalBRCollapsing = false}: BaseHTMLEngineProviderProps) { const styles = useThemeStyles(); diff --git a/src/components/HTMLEngineProvider/HTMLRenderers/PreRenderer.tsx b/src/components/HTMLEngineProvider/HTMLRenderers/PreRenderer.tsx index b6595ee48480..08b2868a9b88 100644 --- a/src/components/HTMLEngineProvider/HTMLRenderers/PreRenderer.tsx +++ b/src/components/HTMLEngineProvider/HTMLRenderers/PreRenderer.tsx @@ -65,7 +65,7 @@ function PreRenderer({TDefaultRenderer, onPressIn, onPressOut, onLongPress, ...d }} shouldUseHapticsOnLongPress role={CONST.ROLE.PRESENTATION} - accessibilityLabel={translate('accessibilityHints.prestyledText')} + accessibilityLabel={translate('accessibilityHints.preStyledText')} > diff --git a/src/components/HeaderPageLayout.tsx b/src/components/HeaderPageLayout.tsx index 1d3a290ccbff..0b8db435e36a 100644 --- a/src/components/HeaderPageLayout.tsx +++ b/src/components/HeaderPageLayout.tsx @@ -94,7 +94,7 @@ function HeaderPageLayout({ iconFill={iconFill} /> - {/** Safari on ios/mac has a bug where overscrolling the page scrollview shows green background color. This is a workaround to fix that. https://github.com/Expensify/App/issues/23422 */} + {/** Safari on ios/mac has a bug where over scrolling the page ScrollView shows green background color. This is a workaround to fix that. https://github.com/Expensify/App/issues/23422 */} {Browser.isSafari() && ( diff --git a/src/components/HeaderWithBackButton/index.tsx b/src/components/HeaderWithBackButton/index.tsx index 13a1c95b746c..cc52e4567084 100755 --- a/src/components/HeaderWithBackButton/index.tsx +++ b/src/components/HeaderWithBackButton/index.tsx @@ -148,7 +148,7 @@ function HeaderWithBackButton({ shouldUseHeadlineHeader && styles.headerBarDesktopHeight(canUseLeftHandBar), shouldShowBorderBottom && styles.borderBottom, // progressBarPercentage can be 0 which would - // be falsey, hence using !== undefined explicitly + // be falsy, hence using !== undefined explicitly progressBarPercentage !== undefined && styles.pl0, shouldShowBackButton && [styles.pl2], shouldOverlay && StyleSheet.absoluteFillObject, diff --git a/src/components/HeaderWithBackButton/types.ts b/src/components/HeaderWithBackButton/types.ts index da899b727d2b..e5750757b13d 100644 --- a/src/components/HeaderWithBackButton/types.ts +++ b/src/components/HeaderWithBackButton/types.ts @@ -73,10 +73,10 @@ type HeaderWithBackButtonProps = Partial & { /** Whether we should show a pin button */ shouldShowPinButton?: boolean; - /** Whether we should show a more options (threedots) button */ + /** Whether we should show a more options (three dots) button */ shouldShowThreeDotsButton?: boolean; - /** Whether we should disable threedots button */ + /** Whether we should disable three dots button */ shouldDisableThreeDotsButton?: boolean; /** Whether we should set modal visibility when three dot menu opens */ diff --git a/src/components/ImportColumn.tsx b/src/components/ImportColumn.tsx index 0e1ae935a2b7..b475ab8c2d3b 100644 --- a/src/components/ImportColumn.tsx +++ b/src/components/ImportColumn.tsx @@ -11,6 +11,7 @@ import ButtonWithDropdownMenu from './ButtonWithDropdownMenu'; import type {DropdownOption} from './ButtonWithDropdownMenu/types'; import Text from './Text'; +// cspell:disable function findColumnName(header: string): string { let attribute = ''; const formattedHeader = Str.removeSpaces(String(header).toLowerCase().trim()); @@ -117,6 +118,7 @@ function findColumnName(header: string): string { return attribute; } +// cspell:enable type ColumnRole = { /** Translated text to be displayed */ diff --git a/src/components/ImportSpreadsheet.tsx b/src/components/ImportSpreadsheet.tsx index b1c75f64c95d..7f2a9aa8e60b 100644 --- a/src/components/ImportSpreadsheet.tsx +++ b/src/components/ImportSpreadsheet.tsx @@ -25,7 +25,7 @@ import ImageSVG from './ImageSVG'; import ScreenWrapper from './ScreenWrapper'; import Text from './Text'; -type ImportSpreedsheetProps = { +type ImportSpreadsheetProps = { // The route to navigate to when the back button is pressed. backTo?: Routes; @@ -33,7 +33,7 @@ type ImportSpreedsheetProps = { goTo: Routes; }; -function ImportSpreadsheet({backTo, goTo}: ImportSpreedsheetProps) { +function ImportSpreadsheet({backTo, goTo}: ImportSpreadsheetProps) { const styles = useThemeStyles(); const {translate} = useLocalize(); const [isReadingFile, setIsReadingFIle] = useState(false); diff --git a/src/components/LHNOptionsList/LHNOptionsList.tsx b/src/components/LHNOptionsList/LHNOptionsList.tsx index 9aef35003e30..5cef5bfa36de 100644 --- a/src/components/LHNOptionsList/LHNOptionsList.tsx +++ b/src/components/LHNOptionsList/LHNOptionsList.tsx @@ -259,7 +259,7 @@ function LHNOptionsList({style, contentContainerStyles, data, onSelectRow, optio const onScroll = useCallback['onScroll']>>( (e) => { - // If the layout measurement is 0, it means the flashlist is not displayed but the onScroll may be triggered with offset value 0. + // If the layout measurement is 0, it means the FlashList is not displayed but the onScroll may be triggered with offset value 0. // We should ignore this case. if (e.nativeEvent.layoutMeasurement.height === 0) { return; diff --git a/src/components/LHNOptionsList/OptionRowLHN.tsx b/src/components/LHNOptionsList/OptionRowLHN.tsx index 48d0c72f0cf2..dc88d5528704 100644 --- a/src/components/LHNOptionsList/OptionRowLHN.tsx +++ b/src/components/LHNOptionsList/OptionRowLHN.tsx @@ -62,7 +62,7 @@ function OptionRowLHN({reportID, isFocused = false, onSelectRow = () => {}, opti const [introSelected] = useOnyx(ONYXKEYS.NVP_INTRO_SELECTED); const [isFullscreenVisible] = useOnyx(ONYXKEYS.FULLSCREEN_VISIBILITY); const session = useSession(); - const shouldShowWokspaceChatTooltip = isPolicyExpenseChat(report) && !isThread(report) && activePolicyID === report?.policyID && session?.accountID === report?.ownerAccountID; + const shouldShowWorkspaceChatTooltip = isPolicyExpenseChat(report) && !isThread(report) && activePolicyID === report?.policyID && session?.accountID === report?.ownerAccountID; const isOnboardingGuideAssigned = introSelected?.choice === CONST.ONBOARDING_CHOICES.MANAGE_TEAM && !session?.email?.includes('+'); const isChatUsedForOnboarding = isChatUsedForOnboardingReportUtils(report, introSelected?.choice); const shouldShowGetStartedTooltip = isOnboardingGuideAssigned ? isAdminRoom(report) && isChatUsedForOnboarding : isConciergeChatReport(report); @@ -70,15 +70,15 @@ function OptionRowLHN({reportID, isFocused = false, onSelectRow = () => {}, opti const isReportsSplitNavigatorLast = useRootNavigationState((state) => state?.routes?.at(-1)?.name === NAVIGATORS.REPORTS_SPLIT_NAVIGATOR); const {tooltipToRender, shouldShowTooltip} = useMemo(() => { - // TODO: CONCEIRGE_LHN_GBR tooltip will be replaced by a tooltip in the #admins room + // TODO: CONCIERGE_LHN_GBR tooltip will be replaced by a tooltip in the #admins room // https://github.com/Expensify/App/issues/57045#issuecomment-2701455668 - const tooltip = shouldShowGetStartedTooltip ? CONST.PRODUCT_TRAINING_TOOLTIP_NAMES.CONCEIRGE_LHN_GBR : CONST.PRODUCT_TRAINING_TOOLTIP_NAMES.LHN_WORKSPACE_CHAT_TOOLTIP; - const shouldShowTooltips = shouldShowWokspaceChatTooltip || shouldShowGetStartedTooltip; + const tooltip = shouldShowGetStartedTooltip ? CONST.PRODUCT_TRAINING_TOOLTIP_NAMES.CONCIERGE_LHN_GBR : CONST.PRODUCT_TRAINING_TOOLTIP_NAMES.LHN_WORKSPACE_CHAT_TOOLTIP; + const shouldShowTooltips = shouldShowWorkspaceChatTooltip || shouldShowGetStartedTooltip; const shouldTooltipBeVisible = shouldUseNarrowLayout ? isScreenFocused && isReportsSplitNavigatorLast : isReportsSplitNavigatorLast && !isFullscreenVisible; // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing return {tooltipToRender: tooltip, shouldShowTooltip: shouldShowTooltips && shouldTooltipBeVisible}; - }, [shouldShowGetStartedTooltip, shouldShowWokspaceChatTooltip, isScreenFocused, shouldUseNarrowLayout, isReportsSplitNavigatorLast, isFullscreenVisible]); + }, [shouldShowGetStartedTooltip, shouldShowWorkspaceChatTooltip, isScreenFocused, shouldUseNarrowLayout, isReportsSplitNavigatorLast, isFullscreenVisible]); const {shouldShowProductTrainingTooltip, renderProductTrainingTooltip, hideProductTrainingTooltip} = useProductTrainingContext(tooltipToRender, shouldShowTooltip); @@ -103,7 +103,7 @@ function OptionRowLHN({reportID, isFocused = false, onSelectRow = () => {}, opti if (!optionItem && !isFocused) { // rendering null as a render item causes the FlashList to render all - // its children and consume signficant memory on the first render. We can avoid this by + // its children and consume significant memory on the first render. We can avoid this by // rendering a placeholder view instead. This behaviour is only observed when we // first sign in to the App. // We can fix this by checking if the optionItem is null and the component is not focused. @@ -195,11 +195,11 @@ function OptionRowLHN({reportID, isFocused = false, onSelectRow = () => {}, opti shouldRender={shouldShowProductTrainingTooltip} renderTooltipContent={renderProductTrainingTooltip} anchorAlignment={{ - horizontal: shouldShowWokspaceChatTooltip ? CONST.MODAL.ANCHOR_ORIGIN_HORIZONTAL.LEFT : CONST.MODAL.ANCHOR_ORIGIN_HORIZONTAL.RIGHT, + horizontal: shouldShowWorkspaceChatTooltip ? CONST.MODAL.ANCHOR_ORIGIN_HORIZONTAL.LEFT : CONST.MODAL.ANCHOR_ORIGIN_HORIZONTAL.RIGHT, vertical: CONST.MODAL.ANCHOR_ORIGIN_VERTICAL.TOP, }} - shiftHorizontal={shouldShowWokspaceChatTooltip ? variables.workspaceLHNTooltipShiftHorizontal : variables.gbrTooltipShiftHorizontal} - shiftVertical={shouldShowWokspaceChatTooltip ? 0 : variables.gbrTooltipShiftVertical} + shiftHorizontal={shouldShowWorkspaceChatTooltip ? variables.workspaceLHNTooltipShiftHorizontal : variables.gbrTooltipShiftHorizontal} + shiftVertical={shouldShowWorkspaceChatTooltip ? 0 : variables.gbrTooltipShiftVertical} wrapperStyle={styles.productTrainingTooltipWrapper} onTooltipPress={onOptionPress} shouldHideOnScroll diff --git a/src/components/Lightbox/numberOfConcurrentLightboxes/types.ts b/src/components/Lightbox/numberOfConcurrentLightboxes/types.ts index 57aaa53cca8c..32738c1f2285 100644 --- a/src/components/Lightbox/numberOfConcurrentLightboxes/types.ts +++ b/src/components/Lightbox/numberOfConcurrentLightboxes/types.ts @@ -1,5 +1,5 @@ // Increase/decrease this number to change the number of concurrent lightboxes -// The more concurrent lighboxes, the worse performance gets (especially on low-end devices) +// The more concurrent lightboxes, the worse performance gets (especially on low-end devices) type LightboxConcurrencyLimit = number | 'UNLIMITED'; export default LightboxConcurrencyLimit; diff --git a/src/components/MapView/MapView.tsx b/src/components/MapView/MapView.tsx index 69efbb2efaca..df0e103d7430 100644 --- a/src/components/MapView/MapView.tsx +++ b/src/components/MapView/MapView.tsx @@ -227,7 +227,7 @@ const MapView = forwardRef( const initCenterCoordinate = useMemo(() => (interactive ? centerCoordinate : undefined), [interactive, centerCoordinate]); const initBounds = useMemo(() => (interactive ? undefined : waypointsBounds), [interactive, waypointsBounds]); - const distanceSymbolCoorinate = useMemo(() => { + const distanceSymbolCoordinate = useMemo(() => { if (!directionCoordinates?.length || !waypoints?.length) { return; } @@ -310,9 +310,9 @@ const MapView = forwardRef( })} {!!directionCoordinates && } - {!!distanceSymbolCoorinate && !!distanceInMeters && !!distanceUnit && ( + {!!distanceSymbolCoordinate && !!distanceInMeters && !!distanceUnit && ( diff --git a/src/components/MapView/MapViewImpl.website.tsx b/src/components/MapView/MapViewImpl.website.tsx index cf84152e4201..8ad475c74b97 100644 --- a/src/components/MapView/MapViewImpl.website.tsx +++ b/src/components/MapView/MapViewImpl.website.tsx @@ -250,7 +250,7 @@ const MapViewImpl = forwardRef( }; }, [waypoints, directionCoordinates, interactive, currentPosition, initialState.zoom]); - const distanceSymbolCoorinate = useMemo(() => { + const distanceSymbolCoordinate = useMemo(() => { if (!directionCoordinates?.length || !waypoints?.length) { return; } @@ -288,11 +288,11 @@ const MapViewImpl = forwardRef( )} - {!!distanceSymbolCoorinate && !!distanceInMeters && !!distanceUnit && ( + {!!distanceSymbolCoordinate && !!distanceInMeters && !!distanceUnit && ( void; - // Whether the map is interactable or not + // Whether the map is interactive or not interactive?: boolean; // Distance displayed on the map in meters. diff --git a/src/components/MapView/utils.ts b/src/components/MapView/utils.ts index bd663af6f978..8a1a98298cb2 100644 --- a/src/components/MapView/utils.ts +++ b/src/components/MapView/utils.ts @@ -2,16 +2,16 @@ import type {LngLat} from 'react-map-gl'; import type {Coordinate} from './MapViewTypes'; function getBounds(waypoints: Coordinate[], directionCoordinates: undefined | Coordinate[]): {southWest: Coordinate; northEast: Coordinate} { - const lngs = waypoints.map((waypoint) => waypoint[0]); - const lats = waypoints.map((waypoint) => waypoint[1]); + const longitudes = waypoints.map((waypoint) => waypoint[0]); + const latitudes = waypoints.map((waypoint) => waypoint[1]); if (directionCoordinates) { - lngs.push(...directionCoordinates.map((coordinate) => coordinate[0])); - lats.push(...directionCoordinates.map((coordinate) => coordinate[1])); + longitudes.push(...directionCoordinates.map((coordinate) => coordinate[0])); + latitudes.push(...directionCoordinates.map((coordinate) => coordinate[1])); } return { - southWest: [Math.min(...lngs), Math.min(...lats)], - northEast: [Math.max(...lngs), Math.max(...lats)], + southWest: [Math.min(...longitudes), Math.min(...latitudes)], + northEast: [Math.max(...longitudes), Math.max(...latitudes)], }; } diff --git a/src/components/MenuItem.tsx b/src/components/MenuItem.tsx index 66a7c2e86371..fd2e876a56a2 100644 --- a/src/components/MenuItem.tsx +++ b/src/components/MenuItem.tsx @@ -373,7 +373,7 @@ type MenuItemBaseProps = { type MenuItemProps = (IconProps | AvatarProps | NoIcon) & MenuItemBaseProps; -const getSubscriptpAvatarBackgroundColor = (isHovered: boolean, isPressed: boolean, hoveredBackgroundColor: string, pressedBackgroundColor: string) => { +const getSubscriptAvatarBackgroundColor = (isHovered: boolean, isPressed: boolean, hoveredBackgroundColor: string, pressedBackgroundColor: string) => { if (isPressed) { return pressedBackgroundColor; } @@ -698,7 +698,7 @@ function MenuItem( )} {shouldShowAvatar && shouldShowSubscriptAvatar && ( { - if (isLoadingOnyxValue(tryNewDotdMetadata, dismissedProductTrainingMetadata)) { + if (isLoadingOnyxValue(tryNewDotMetadata, dismissedProductTrainingMetadata)) { return; } const {hasBeenAddedToNudgeMigration} = tryNewDot ?? {}; @@ -62,7 +62,7 @@ function OnboardingWelcomeVideo() { setIsModalDisabled(false); const defaultCannedQuery = buildCannedSearchQuery(); Navigation.navigate(ROUTES.SEARCH_ROOT.getRoute({query: defaultCannedQuery})); - }, [dismissedProductTraining?.migratedUserWelcomeModal, setIsModalDisabled, tryNewDotdMetadata, dismissedProductTrainingMetadata, tryNewDot]); + }, [dismissedProductTraining?.migratedUserWelcomeModal, setIsModalDisabled, tryNewDotMetadata, dismissedProductTrainingMetadata, tryNewDot]); /** * Extracts values from the non-scraped attribute WEB_PROP_ATTR at build time diff --git a/src/components/Modal/BaseModal.tsx b/src/components/Modal/BaseModal.tsx index 66742bcfa926..fd44f593f189 100644 --- a/src/components/Modal/BaseModal.tsx +++ b/src/components/Modal/BaseModal.tsx @@ -253,7 +253,7 @@ function BaseModal( {}, type, onModalShow = ( type === CONST.MODAL.MODAL_TYPE.CENTERED || type === CONST.MODAL.MODAL_TYPE.CENTERED_UNSWIPEABLE || type === CONST.MODAL.MODAL_TYPE.RIGHT_DOCKED || - type === CONST.MODAL.MODAL_TYPE.CENTERED_SWIPABLE_TO_RIGHT; + type === CONST.MODAL.MODAL_TYPE.CENTERED_SWIPEABLE_TO_RIGHT; if (statusBarColor) { setPreviousStatusBarColor(statusBarColor); diff --git a/src/components/MoneyReportHeader.tsx b/src/components/MoneyReportHeader.tsx index 726e0ecbb8aa..c2ae2377dc72 100644 --- a/src/components/MoneyReportHeader.tsx +++ b/src/components/MoneyReportHeader.tsx @@ -217,7 +217,7 @@ function MoneyReportHeader({policy, report: moneyRequestReport, transactionThrea const shouldShowStatusBar = hasAllPendingRTERViolations || shouldShowBrokenConnectionViolation || hasOnlyHeldExpenses || hasScanningReceipt || isPayAtEndExpense || hasOnlyPendingTransactions || hasDuplicates; - // When prevent self-approval is enabled & the current user is submitter AND they're submitting to theirself, we need to show the optimistic next step + // When prevent self-approval is enabled & the current user is submitter AND they're submitting to themselves, we need to show the optimistic next step // We should always show this optimistic message for policies with preventSelfApproval // to avoid any flicker during transitions between online/offline states const nextApproverAccountID = getNextApproverAccountID(moneyRequestReport); diff --git a/src/components/MoneyRequestAmountInput.tsx b/src/components/MoneyRequestAmountInput.tsx index 36ce9dbf6260..0285bbf6aad1 100644 --- a/src/components/MoneyRequestAmountInput.tsx +++ b/src/components/MoneyRequestAmountInput.tsx @@ -85,7 +85,7 @@ type MoneyRequestAmountInputProps = { shouldKeepUserInput?: boolean; /** - * Autogrow input container length based on the entered text. + * Auto grow input container length based on the entered text. */ autoGrow?: boolean; @@ -252,7 +252,7 @@ function MoneyRequestAmountInput( const textInputKeyPress = ({nativeEvent}: NativeSyntheticEvent) => { const key = nativeEvent?.key.toLowerCase(); if (isMobileSafari() && key === CONST.PLATFORM_SPECIFIC_KEYS.CTRL.DEFAULT) { - // Optimistically anticipate forward-delete on iOS Safari (in cases where the Mac Accessiblity keyboard is being + // Optimistically anticipate forward-delete on iOS Safari (in cases where the Mac accessibility keyboard is being // used for input). If the Control-D shortcut doesn't get sent, the ref will still be reset on the next key press. forwardDeletePressedRef.current = true; return; diff --git a/src/components/MoneyRequestConfirmationList.tsx b/src/components/MoneyRequestConfirmationList.tsx index de53f5cae4c1..0bea31287f8f 100755 --- a/src/components/MoneyRequestConfirmationList.tsx +++ b/src/components/MoneyRequestConfirmationList.tsx @@ -302,7 +302,7 @@ function MoneyRequestConfirmationList({ const previousTransactionModifiedCurrency = usePrevious(transaction?.modifiedCurrency); const previousCustomUnitRateID = usePrevious(customUnitRateID); useEffect(() => { - // previousTransaction is in the condition because if it is falsey, it means this is the first time the useEffect is triggered after we load it, so we should calculate the default + // previousTransaction is in the condition because if it is falsy, it means this is the first time the useEffect is triggered after we load it, so we should calculate the default // tax even if the other parameters are the same against their previous values. if ( !shouldShowTax || @@ -790,7 +790,7 @@ function MoneyRequestConfirmationList({ return; } setMoneyRequestCategory(transactionID, enabledCategories.at(0)?.name ?? '', policy?.id); - // Keep 'transaction' out to ensure that we autoselect the option only once + // Keep 'transaction' out to ensure that we auto select the option only once // eslint-disable-next-line react-compiler/react-compiler, react-hooks/exhaustive-deps }, [shouldShowCategories, policyCategories, isCategoryRequired, policy?.id]); @@ -815,7 +815,7 @@ function MoneyRequestConfirmationList({ if (updatedTagsString !== getTag(transaction) && updatedTagsString) { setMoneyRequestTag(transactionID, updatedTagsString); } - // Keep 'transaction' out to ensure that we autoselect the option only once + // Keep 'transaction' out to ensure that we auto select the option only once // eslint-disable-next-line react-compiler/react-compiler, react-hooks/exhaustive-deps }, [transactionID, policyTagLists, policyTags]); diff --git a/src/components/MultiGestureCanvas/index.tsx b/src/components/MultiGestureCanvas/index.tsx index 7d48a8ef6462..22a336c822e8 100644 --- a/src/components/MultiGestureCanvas/index.tsx +++ b/src/components/MultiGestureCanvas/index.tsx @@ -19,7 +19,7 @@ import * as MultiGestureCanvasUtils from './utils'; type MultiGestureCanvasProps = ChildrenProps & { /** - * Wheter the canvas is currently active (in the screen) or not. + * Whether the canvas is currently active (in the screen) or not. * Disables certain gestures and functionality */ isActive?: boolean; diff --git a/src/components/MultiGestureCanvas/usePanGesture.ts b/src/components/MultiGestureCanvas/usePanGesture.ts index f2f33aa87e7e..9762294338c1 100644 --- a/src/components/MultiGestureCanvas/usePanGesture.ts +++ b/src/components/MultiGestureCanvas/usePanGesture.ts @@ -12,7 +12,7 @@ import * as MultiGestureCanvasUtils from './utils'; // This value determines how fast the pan animation should phase out // We're using a "withDecay" animation to smoothly phase out the pan animation // https://docs.swmansion.com/react-native-reanimated/docs/animations/withDecay/ -const PAN_DECAY_DECELARATION = 0.9915; +const PAN_DECAY_DECLARATION = 0.9915; const SCREEN_HEIGHT = Dimensions.get('screen').height; const SNAP_POINT = SCREEN_HEIGHT / 4; const SNAP_POINT_HIDDEN = SCREEN_HEIGHT / 1.2; @@ -126,7 +126,7 @@ const usePanGesture = ({ withDecay({ velocity: panVelocityX.get(), clamp: [horizontalBoundaries.min, horizontalBoundaries.max], - deceleration: PAN_DECAY_DECELARATION, + deceleration: PAN_DECAY_DECLARATION, rubberBandEffect: false, }), ); @@ -144,7 +144,7 @@ const usePanGesture = ({ withDecay({ velocity: panVelocityY.get(), clamp: [verticalBoundaries.min, verticalBoundaries.max], - deceleration: PAN_DECAY_DECELARATION, + deceleration: PAN_DECAY_DECLARATION, }), ); } diff --git a/src/components/MultiGestureCanvas/usePinchGesture.ts b/src/components/MultiGestureCanvas/usePinchGesture.ts index 755f4dfc8603..384c274d490b 100644 --- a/src/components/MultiGestureCanvas/usePinchGesture.ts +++ b/src/components/MultiGestureCanvas/usePinchGesture.ts @@ -49,7 +49,7 @@ const usePinchGesture = ({ const pinchTranslateX = useSharedValue(0); const pinchTranslateY = useSharedValue(0); - // In order to keep track of the "bounce" effect when "overzooming"/"underzooming", + // In order to keep track of the "bounce" effect when "over-zooming"/"under-zooming", // we need to have extra "bounce" translation variables const pinchBounceTranslateX = useSharedValue(0); const pinchBounceTranslateY = useSharedValue(0); @@ -149,7 +149,7 @@ const usePinchGesture = ({ const newPinchTranslateY = adjustedFocal.y + currentPinchScale.get() * pinchOrigin.y.get() * -1; // If the zoom scale is within the zoom range, we perform the regular pinch translation - // Otherwise it means that we are "overzoomed" or "underzoomed", so we need to bounce back + // Otherwise it means that we are "over-zoomed" or "under-zoomed", so we need to bounce back if (zoomScale.get() >= zoomRange.min && zoomScale.get() <= zoomRange.max) { pinchTranslateX.set(newPinchTranslateX); pinchTranslateY.set(newPinchTranslateY); @@ -168,7 +168,7 @@ const usePinchGesture = ({ pinchTranslateY.set(0); currentPinchScale.set(1); - // If the content was "overzoomed" or "underzoomed", we need to bounce back with an animation + // If the content was "over-zoomed" or "under-zoomed", we need to bounce back with an animation if (pinchBounceTranslateX.get() !== 0 || pinchBounceTranslateY.get() !== 0) { pinchBounceTranslateX.set(withSpring(0, SPRING_CONFIG)); pinchBounceTranslateY.set(withSpring(0, SPRING_CONFIG)); diff --git a/src/components/MultipleAvatars.tsx b/src/components/MultipleAvatars.tsx index 158970d1e9f3..10e399e5c09e 100644 --- a/src/components/MultipleAvatars.tsx +++ b/src/components/MultipleAvatars.tsx @@ -37,7 +37,7 @@ type MultipleAvatarsProps = { /** Whether the avatars are hovered */ isHovered?: boolean; - /** Whether the avatars are actived */ + /** Whether the avatars are active */ isActive?: boolean; /** Whether the avatars are in an element being pressed */ diff --git a/src/components/OfflineWithFeedback.tsx b/src/components/OfflineWithFeedback.tsx index b536b5b43c6c..04a0c12cd9c1 100644 --- a/src/components/OfflineWithFeedback.tsx +++ b/src/components/OfflineWithFeedback.tsx @@ -107,7 +107,7 @@ function OfflineWithFeedback({ */ const applyStrikeThrough = useCallback( (childrenProp: React.ReactNode): React.ReactNode => { - const strikedThroughChildren = mapChildrenFlat(childrenProp, (child) => { + const strikeThroughChildren = mapChildrenFlat(childrenProp, (child) => { if (!React.isValidElement(child)) { return child; } @@ -125,7 +125,7 @@ function OfflineWithFeedback({ return React.cloneElement(child, props); }); - return strikedThroughChildren; + return strikeThroughChildren; }, [StyleUtils, styles], ); diff --git a/src/components/Onfido/index.css b/src/components/Onfido/index.css index 66fe571af9cc..b013311e1509 100644 --- a/src/components/Onfido/index.css +++ b/src/components/Onfido/index.css @@ -27,7 +27,7 @@ box-shadow: inset 0px 0px 0px 1px #5AB0FF !important; } -/* This is needed to dsiable the blue outline that shows up once the payment page is opened through keyboard */ +/* This is needed to disable the blue outline that shows up once the payment page is opened through keyboard */ #onfido-mount [tabindex="-1"]:focus-visible, #onfido-mount [tabindex="-1"]:focus[data-focusvisible-polyfill] { box-shadow: none !important; @@ -35,6 +35,7 @@ .onfido-sdk-ui-NavigationBar-iconBack { /* Onfido's back icon with our theme colors. */ + /* cspell:disable-next-line */ --back-icon-svg: url("data:image/svg+xml,%3Csvg width='32' height='32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Ccircle fill='none' cx='16' cy='16' r='16'/%3E%3Cpath d='M16.668 11.811L11.738 16l4.93 4.189a1.014 1.014 0 0 1 0 1.5 1.191 1.191 0 0 1-1.604 0l-5.736-4.873A1.01 1.01 0 0 1 9.003 16a1.01 1.01 0 0 1 .325-.816l5.736-4.873a1.191 1.191 0 0 1 1.604 0 1.014 1.014 0 0 1 0 1.5z' fill='%238B9C8F' fill-rule='nonzero'/%3E%3Crect fill='%238B9C8F' fill-rule='nonzero' x='9' y='15' width='16' height='2' rx='1'/%3E%3C/g%3E%3C/svg%3E"); background-image: var(--back-icon-svg) !important; } diff --git a/src/components/OptionRow.tsx b/src/components/OptionRow.tsx index 1b6519f4fd44..f448763bac41 100644 --- a/src/components/OptionRow.tsx +++ b/src/components/OptionRow.tsx @@ -39,13 +39,13 @@ type OptionRowProps = { /** Whether we should show the selected state */ showSelectedState?: boolean; - /** Whether to show a button pill instead of a tickbox */ + /** Whether to show a button pill instead of a checkbox */ shouldShowSelectedStateAsButton?: boolean; /** Text for button pill */ selectedStateButtonText?: string; - /** Callback to fire when the multiple selector (tickbox or button) is clicked */ + /** Callback to fire when the multiple selector (checkbox or button) is clicked */ onSelectedStatePressed?: (option: OptionData) => void; /** Whether we highlight selected option */ diff --git a/src/components/ParentNavigationSubtitle.tsx b/src/components/ParentNavigationSubtitle.tsx index 85f22912297f..0c5e3b2f27fc 100644 --- a/src/components/ParentNavigationSubtitle.tsx +++ b/src/components/ParentNavigationSubtitle.tsx @@ -22,7 +22,7 @@ type ParentNavigationSubtitleProps = { /** parent Report Action ID */ parentReportActionID?: string; - /** PressableWithoutFeedack additional styles */ + /** PressableWithoutFeedback additional styles */ pressableStyles?: StyleProp; }; diff --git a/src/components/PopoverWithMeasuredContent.tsx b/src/components/PopoverWithMeasuredContent.tsx index 9f7ba690367b..e28660a5b434 100644 --- a/src/components/PopoverWithMeasuredContent.tsx +++ b/src/components/PopoverWithMeasuredContent.tsx @@ -21,7 +21,7 @@ type PopoverWithMeasuredContentProps = Omit & { anchorDimensions?: AnchorDimensions; /** Whether we should change the vertical position if the popover's position is overflow */ - shoudSwitchPositionIfOverflow?: boolean; + shouldSwitchPositionIfOverflow?: boolean; /** Whether handle navigation back when modal show. */ shouldHandleNavigationBack?: boolean; @@ -61,7 +61,7 @@ function PopoverWithMeasuredContent({ height: 0, width: 0, }, - shoudSwitchPositionIfOverflow = false, + shouldSwitchPositionIfOverflow = false, shouldHandleNavigationBack = false, shouldEnableNewFocusManagement, shouldMeasureAnchorPositionFromTop = false, @@ -136,7 +136,7 @@ function PopoverWithMeasuredContent({ popoverHeight, windowHeight, anchorDimensions.height, - shoudSwitchPositionIfOverflow, + shouldSwitchPositionIfOverflow, ); const shiftedAnchorPosition: PopoverAnchorPosition = { left: adjustedAnchorPosition.left + horizontalShift, diff --git a/src/components/PopoverWithoutOverlay/index.tsx b/src/components/PopoverWithoutOverlay/index.tsx index b4c65e221c38..d6b2808fc2d1 100644 --- a/src/components/PopoverWithoutOverlay/index.tsx +++ b/src/components/PopoverWithoutOverlay/index.tsx @@ -91,7 +91,7 @@ function PopoverWithoutOverlay( return ( e.stopPropagation()} diff --git a/src/components/Pressable/PressableWithFeedback.tsx b/src/components/Pressable/PressableWithFeedback.tsx index 9eeb0980d027..43996d845026 100644 --- a/src/components/Pressable/PressableWithFeedback.tsx +++ b/src/components/Pressable/PressableWithFeedback.tsx @@ -13,14 +13,14 @@ type PressableWithFeedbackProps = PressableProps & { wrapperStyle?: StyleProp>; /** - * Determines what opacity value should be applied to the underlaying view when Pressable is pressed. + * Determines what opacity value should be applied to the underlying view when Pressable is pressed. * To disable dimming, pass 1 as pressDimmingValue * @default variables.pressDimValue */ pressDimmingValue?: number; /** - * Determines what opacity value should be applied to the underlaying view when pressable is hovered. + * Determines what opacity value should be applied to the underlying view when pressable is hovered. * To disable dimming, pass 1 as hoverDimmingValue * @default variables.hoverDimValue */ diff --git a/src/components/ProductTrainingContext/TOOLTIPS.ts b/src/components/ProductTrainingContext/TOOLTIPS.ts index 0256c7f67988..717888c5ecef 100644 --- a/src/components/ProductTrainingContext/TOOLTIPS.ts +++ b/src/components/ProductTrainingContext/TOOLTIPS.ts @@ -4,7 +4,7 @@ import CONST from '@src/CONST'; import type {TranslationPaths} from '@src/languages/types'; const { - CONCEIRGE_LHN_GBR, + CONCIERGE_LHN_GBR, RENAME_SAVED_SEARCH, BOTTOM_NAV_INBOX_TOOLTIP, LHN_WORKSPACE_CHAT_TOOLTIP, @@ -30,15 +30,15 @@ type TooltipData = { }; const TOOLTIPS: Record = { - [CONCEIRGE_LHN_GBR]: { + [CONCIERGE_LHN_GBR]: { content: [ - {text: 'productTrainingTooltip.conciergeLHNGBR.part1', isBold: false}, - {text: 'productTrainingTooltip.conciergeLHNGBR.part2', isBold: true}, + {text: 'productTrainingTooltip.conciergeLHNGbr.part1', isBold: false}, + {text: 'productTrainingTooltip.conciergeLHNGbr.part2', isBold: true}, ], - onHideTooltip: (isDismissedUsingCloseButton = false) => dismissProductTraining(CONCEIRGE_LHN_GBR, isDismissedUsingCloseButton), - name: CONCEIRGE_LHN_GBR, + onHideTooltip: (isDismissedUsingCloseButton = false) => dismissProductTraining(CONCIERGE_LHN_GBR, isDismissedUsingCloseButton), + name: CONCIERGE_LHN_GBR, priority: 1300, - // TODO: CONCEIRGE_LHN_GBR tooltip will be replaced by a tooltip in the #admins room + // TODO: CONCIERGE_LHN_GBR tooltip will be replaced by a tooltip in the #admins room // https://github.com/Expensify/App/issues/57045#issuecomment-2701455668 shouldShow: () => false, }, diff --git a/src/components/ProductTrainingContext/index.tsx b/src/components/ProductTrainingContext/index.tsx index 9b44460a2a4f..ef900c4f4df2 100644 --- a/src/components/ProductTrainingContext/index.tsx +++ b/src/components/ProductTrainingContext/index.tsx @@ -49,7 +49,7 @@ const ProductTrainingContext = createContext({ function ProductTrainingContextProvider({children}: ChildrenProps) { const [isLoadingApp] = useOnyx(ONYXKEYS.IS_LOADING_APP, {initialValue: true}); - const [tryNewDot] = useOnyx(ONYXKEYS.NVP_TRYNEWDOT); + const [tryNewDot] = useOnyx(ONYXKEYS.NVP_TRY_NEW_DOT); const hasBeenAddedToNudgeMigration = !!tryNewDot?.nudgeMigration?.timestamp; const [isOnboardingCompleted = true, isOnboardingCompletedMetadata] = useOnyx(ONYXKEYS.NVP_ONBOARDING, { selector: hasCompletedGuidedSetupFlowSelector, diff --git a/src/components/ReportActionItem/ActionableItemButtons.tsx b/src/components/ReportActionItem/ActionableItemButtons.tsx index 1e4daa05e209..1a43b92ba4b8 100644 --- a/src/components/ReportActionItem/ActionableItemButtons.tsx +++ b/src/components/ReportActionItem/ActionableItemButtons.tsx @@ -42,7 +42,7 @@ function ActionableItemButtons(props: ActionableItemButtonsProps) { ); } -ActionableItemButtons.displayName = 'ActionableItemButtton'; +ActionableItemButtons.displayName = 'ActionableItemButtons'; export default ActionableItemButtons; export type {ActionableItem}; diff --git a/src/components/ReportActionItem/ExportWithDropdownMenu.tsx b/src/components/ReportActionItem/ExportWithDropdownMenu.tsx index 6b18c1c0b6bb..7858d58a6901 100644 --- a/src/components/ReportActionItem/ExportWithDropdownMenu.tsx +++ b/src/components/ReportActionItem/ExportWithDropdownMenu.tsx @@ -83,7 +83,7 @@ function ExportWithDropdownMenu({ options.sort((method) => (method.value === exportMethod ? -1 : 0)); } return options; - // We do not include exportMethods not to re-render the component when the preffered export method changes + // We do not include exportMethods not to re-render the component when the preferred export method changes // eslint-disable-next-line react-compiler/react-compiler, react-hooks/exhaustive-deps }, [canBeExported, iconToDisplay, connectionName, report?.policyID, translate]); diff --git a/src/components/ReportActionItem/MoneyReportView.tsx b/src/components/ReportActionItem/MoneyReportView.tsx index 2a102903fd2a..4b2039267f02 100644 --- a/src/components/ReportActionItem/MoneyReportView.tsx +++ b/src/components/ReportActionItem/MoneyReportView.tsx @@ -80,7 +80,7 @@ function MoneyReportView({report, policy, isCombinedReport = false, shouldShowTo const subAmountTextStyles: StyleProp = [ styles.taskTitleMenuItem, styles.alignSelfCenter, - StyleUtils.getFontSizeStyle(variables.fontSizeh1), + StyleUtils.getFontSizeStyle(variables.fontSizeH1), StyleUtils.getColorStyle(theme.textSupporting), ]; diff --git a/src/components/ReportActionItem/MoneyRequestAction.tsx b/src/components/ReportActionItem/MoneyRequestAction.tsx index 792d4df70560..560a537fdf63 100644 --- a/src/components/ReportActionItem/MoneyRequestAction.tsx +++ b/src/components/ReportActionItem/MoneyRequestAction.tsx @@ -39,7 +39,7 @@ type MoneyRequestActionProps = { /** The ID of the current report */ reportID: string | undefined; - /** Is this IOUACTION the most recent? */ + /** Is this IOU ACTION the most recent? */ isMostRecentIOUReportAction: boolean; /** Popover context menu anchor, used for showing context menu */ diff --git a/src/components/ReportActionItem/MoneyRequestReportPreview/MoneyRequestReportPreviewContent.tsx b/src/components/ReportActionItem/MoneyRequestReportPreview/MoneyRequestReportPreviewContent.tsx index 368faf9d8fab..26c65620c310 100644 --- a/src/components/ReportActionItem/MoneyRequestReportPreview/MoneyRequestReportPreviewContent.tsx +++ b/src/components/ReportActionItem/MoneyRequestReportPreview/MoneyRequestReportPreviewContent.tsx @@ -185,7 +185,7 @@ function MoneyRequestReportPreviewContent({ const filteredTransactions = transactions?.filter((transaction) => transaction) ?? []; - // The submit button should be success green colour only if the user is submitter and the policy does not have Scheduled Submit turned on + // The submit button should be success green color only if the user is submitter and the policy does not have Scheduled Submit turned on const isWaitingForSubmissionFromCurrentUser = useMemo(() => isWaitingForSubmissionFromCurrentUserReportUtils(chatReport, policy), [chatReport, policy]); const [isNoDelegateAccessMenuVisible, setIsNoDelegateAccessMenuVisible] = useState(false); @@ -331,7 +331,7 @@ function MoneyRequestReportPreviewContent({ return; } - thumbsUpScale.set(isApprovedAnimationRunning ? withDelay(CONST.ANIMATION_THUMBSUP_DELAY, withSpring(1, {duration: CONST.ANIMATION_THUMBSUP_DURATION})) : 1); + thumbsUpScale.set(isApprovedAnimationRunning ? withDelay(CONST.ANIMATION_THUMBS_UP_DELAY, withSpring(1, {duration: CONST.ANIMATION_THUMBS_UP_DURATION})) : 1); }, [isApproved, isApprovedAnimationRunning, thumbsUpScale]); const [currentIndex, setCurrentIndex] = useState(0); @@ -383,7 +383,7 @@ function MoneyRequestReportPreviewContent({ // The button should expand up to transaction width const buttonMaxWidth = !shouldUseNarrowLayout ? {maxWidth: reportPreviewStyles.transactionPreviewStyle.width} : {}; - const approvedOrSettledicon = (iouSettled || isApproved) && ( + const approvedOrSettledIcon = (iouSettled || isApproved) && ( {getPreviewName()} - {!doesReportNameOverflow && <> {approvedOrSettledicon}} + {!doesReportNameOverflow && <> {approvedOrSettledIcon}} {doesReportNameOverflow && ( - {approvedOrSettledicon} + {approvedOrSettledIcon} )} diff --git a/src/components/ReportActionItem/ReportPreview.tsx b/src/components/ReportActionItem/ReportPreview.tsx index 6df707f23571..76bb37453f1b 100644 --- a/src/components/ReportActionItem/ReportPreview.tsx +++ b/src/components/ReportActionItem/ReportPreview.tsx @@ -250,7 +250,7 @@ function ReportPreview({ const isArchived = isArchivedReportWithID(iouReport?.reportID); - // The submit button should be success green colour only if the user is submitter and the policy does not have Scheduled Submit turned on + // The submit button should be success green color only if the user is submitter and the policy does not have Scheduled Submit turned on const isWaitingForSubmissionFromCurrentUser = useMemo(() => isWaitingForSubmissionFromCurrentUserReportUtils(chatReport, policy), [chatReport, policy]); const {isDelegateAccessRestricted} = useDelegateUserDetails(); @@ -490,7 +490,7 @@ function ReportPreview({ return; } - thumbsUpScale.set(isApprovedAnimationRunning ? withDelay(CONST.ANIMATION_THUMBSUP_DELAY, withSpring(1, {duration: CONST.ANIMATION_THUMBSUP_DURATION})) : 1); + thumbsUpScale.set(isApprovedAnimationRunning ? withDelay(CONST.ANIMATION_THUMBS_UP_DELAY, withSpring(1, {duration: CONST.ANIMATION_THUMBS_UP_DURATION})) : 1); }, [isApproved, isApprovedAnimationRunning, thumbsUpScale]); const openReportFromPreview = useCallback(() => { if (!iouReportID || contextMenuRef.current?.isContextMenuOpening) { diff --git a/src/components/ReportActionItem/ReportPreviewOld.tsx b/src/components/ReportActionItem/ReportPreviewOld.tsx index 81c22456a3b7..deef6a1a99d3 100644 --- a/src/components/ReportActionItem/ReportPreviewOld.tsx +++ b/src/components/ReportActionItem/ReportPreviewOld.tsx @@ -494,7 +494,7 @@ function ReportPreviewOld({ return; } - thumbsUpScale.set(isApprovedAnimationRunning ? withDelay(CONST.ANIMATION_THUMBSUP_DELAY, withSpring(1, {duration: CONST.ANIMATION_THUMBSUP_DURATION})) : 1); + thumbsUpScale.set(isApprovedAnimationRunning ? withDelay(CONST.ANIMATION_THUMBS_UP_DELAY, withSpring(1, {duration: CONST.ANIMATION_THUMBS_UP_DURATION})) : 1); }, [isApproved, isApprovedAnimationRunning, thumbsUpScale]); const openReportFromPreview = useCallback(() => { diff --git a/src/components/RoomHeaderAvatars.tsx b/src/components/RoomHeaderAvatars.tsx index aaff5fc2e84b..3397894557b1 100644 --- a/src/components/RoomHeaderAvatars.tsx +++ b/src/components/RoomHeaderAvatars.tsx @@ -53,7 +53,7 @@ function RoomHeaderAvatars({icons, reportID}: RoomHeaderAvatarsProps) { , scrollOffset: number) => void; /** Get scroll offset value for given screen */ getScrollOffset: (route: PlatformStackRouteProp) => number | undefined; - /** Save scroll index of flashlist on given screen */ + /** Save scroll index of FlashList on given screen */ saveScrollIndex: (route: PlatformStackRouteProp, scrollIndex: number) => void; /** Get scroll index value for given screen */ @@ -79,9 +79,9 @@ function ScrollOffsetContextProvider({children}: ScrollOffsetContextProviderProp const cleanStaleScrollOffsets: ScrollOffsetContextValue['cleanStaleScrollOffsets'] = useCallback((state) => { const sidebarRoutes = state.routes.filter((route) => isSidebarScreenName(route.name)); - const scrollOffsetkeysOfExistingScreens = sidebarRoutes.map((route) => getKey(route)); + const scrollOffsetKeysOfExistingScreens = sidebarRoutes.map((route) => getKey(route)); for (const key of Object.keys(scrollOffsetsRef.current)) { - if (!scrollOffsetkeysOfExistingScreens.includes(key)) { + if (!scrollOffsetKeysOfExistingScreens.includes(key)) { delete scrollOffsetsRef.current[key]; } } diff --git a/src/components/ScrollView.tsx b/src/components/ScrollView.tsx index e4b2c6703c30..660f43114ca6 100644 --- a/src/components/ScrollView.tsx +++ b/src/components/ScrollView.tsx @@ -34,7 +34,7 @@ function ScrollView( , 'onScroll' /** Styles to apply to SelectionList container */ containerStyle?: StyleProp; - /** Whether to prevent default focusing of options and focus the textinput when selecting an option */ + /** Whether to prevent default focusing of options and focus the text input when selecting an option */ shouldPreventDefaultFocusOnSelectRow?: boolean; /** Whether to prevent long press of options */ diff --git a/src/components/Search/SearchRouter/SearchRouterModal.tsx b/src/components/Search/SearchRouter/SearchRouterModal.tsx index 482fac5acb3a..a14513c6731f 100644 --- a/src/components/Search/SearchRouter/SearchRouterModal.tsx +++ b/src/components/Search/SearchRouter/SearchRouterModal.tsx @@ -23,7 +23,7 @@ function SearchRouterModal() { // On mWeb Safari, the input caret stuck for a moment while the modal is animating. So, we hide the caret until the animation is done. const [shouldHideInputCaret, setShouldHideInputCaret] = useState(isMobileWebIOS); - const modalType = shouldUseNarrowLayout ? CONST.MODAL.MODAL_TYPE.CENTERED_SWIPABLE_TO_RIGHT : CONST.MODAL.MODAL_TYPE.POPOVER; + const modalType = shouldUseNarrowLayout ? CONST.MODAL.MODAL_TYPE.CENTERED_SWIPEABLE_TO_RIGHT : CONST.MODAL.MODAL_TYPE.POPOVER; return ( { - const isFromSelfDM = item.reportID === CONST.REPORT.UNREPORTED_REPORTID; + const isFromSelfDM = item.reportID === CONST.REPORT.UNREPORTED_REPORT_ID; const isTransactionItem = isTransactionListItemType(item); let reportID = - isTransactionItem && (!item.isFromOneTransactionReport || isFromSelfDM) && item.transactionThreadReportID !== CONST.REPORT.UNREPORTED_REPORTID + isTransactionItem && (!item.isFromOneTransactionReport || isFromSelfDM) && item.transactionThreadReportID !== CONST.REPORT.UNREPORTED_REPORT_ID ? item.transactionThreadReportID : item.reportID; @@ -351,7 +351,7 @@ function Search({queryJSON, currentSearchResults, lastNonEmptySearchResults, onS } // If we're trying to open a legacy transaction without a transaction thread, let's create the thread and navigate the user - if (isTransactionItem && reportID === CONST.REPORT.UNREPORTED_REPORTID) { + if (isTransactionItem && reportID === CONST.REPORT.UNREPORTED_REPORT_ID) { reportID = generateReportID(); updateSearchResultsWithTransactionThreadReportID(hash, item.transactionID, reportID); Navigation.navigate( @@ -441,7 +441,7 @@ function Search({queryJSON, currentSearchResults, lastNonEmptySearchResults, onS diff --git a/src/components/Search/types.ts b/src/components/Search/types.ts index d5cf94b134ae..335b8cf103b5 100644 --- a/src/components/Search/types.ts +++ b/src/components/Search/types.ts @@ -33,7 +33,7 @@ type SelectedTransactionInfo = { amount: number; }; -/** Model of selected transactons */ +/** Model of selected transactions */ type SelectedTransactions = Record; /** Model of selected reports */ diff --git a/src/components/SelectionList/BaseSelectionList.tsx b/src/components/SelectionList/BaseSelectionList.tsx index e9f4ab594c12..c516762fc044 100644 --- a/src/components/SelectionList/BaseSelectionList.tsx +++ b/src/components/SelectionList/BaseSelectionList.tsx @@ -182,7 +182,7 @@ function BaseSelectionList( * Iterates through the sections and items inside each section, and builds 4 arrays along the way: * - `allOptions`: Contains all the items in the list, flattened, regardless of section * - `disabledOptionsIndexes`: Contains the indexes of all the unselectable and disabled items in the list - * - `disabledArrowKeyOptionsIndexes`: Contains the indexes of item that is not navigatable by the arrow key. The list is separated from disabledOptionsIndexes because unselectable item is still navigatable by the arrow key. + * - `disabledArrowKeyOptionsIndexes`: Contains the indexes of item that is not navigable by the arrow key. The list is separated from disabledOptionsIndexes because unselectable item is still navigable by the arrow key. * - `itemLayouts`: Contains the layout information for each item, header and footer in the list, * so we can calculate the position of any given item when scrolling programmatically */ @@ -285,7 +285,7 @@ function BaseSelectionList( ) : null; return [processedSections, showMoreButton]; // we don't need to add styles here as they change - // we don't need to add flattendedSections here as they will change along with sections + // we don't need to add flattenedSections here as they will change along with sections // eslint-disable-next-line react-compiler/react-compiler, react-hooks/exhaustive-deps }, [sections, currentPage]); @@ -743,7 +743,7 @@ function BaseSelectionList( ? -1 : 0; - // reseting the currrent page to 1 when the user types something + // Reset the current page to 1 when the user types something setCurrentPage(1); updateAndScrollToFocusedIndex(newSelectedIndex); @@ -804,7 +804,7 @@ function BaseSelectionList( ); /** - * Handles isTextInputFocusedRef value when using external TextInput, so external TextInput is not defocused when typing in it. + * Handles isTextInputFocusedRef value when using external TextInput, so external TextInput does not lose focus when typing in it. * * @param isTextInputFocused - Is external TextInput focused. */ diff --git a/src/components/SelectionList/types.ts b/src/components/SelectionList/types.ts index 30e294e32ab7..49cc18d0218e 100644 --- a/src/components/SelectionList/types.ts +++ b/src/components/SelectionList/types.ts @@ -349,7 +349,7 @@ type ListItemProps = CommonListItemProps & { /** Styles applied for the title */ titleStyles?: StyleProp; - /** Styles applid for the title container of the list item */ + /** Styles applied for the title container of the list item */ titleContainerStyles?: StyleProp; }; @@ -567,7 +567,7 @@ type SelectionListProps = Partial & { /** Whether to call preventDefault() on pressing enter key or not */ shouldPreventDefault?: boolean; - /** Whether to prevent default focusing of options and focus the textinput when selecting an option */ + /** Whether to prevent default focusing of options and focus the text input when selecting an option */ shouldPreventDefaultFocusOnSelectRow?: boolean; /** Whether to subscribe to KeyboardShortcut arrow keys events */ @@ -639,10 +639,10 @@ type SelectionListProps = Partial & { /** Styles for the section title */ sectionTitleStyles?: StyleProp; - /** Styles applid for the title of the list item */ + /** Styles applied for the title of the list item */ listItemTitleStyles?: StyleProp; - /** Styles applid for the title container of the list item */ + /** Styles applied for the title container of the list item */ listItemTitleContainerStyles?: StyleProp; /** This may improve scroll performance for large lists */ diff --git a/src/components/SettlementButton/AnimatedSettlementButton.tsx b/src/components/SettlementButton/AnimatedSettlementButton.tsx index 388297075082..e8649587ed92 100644 --- a/src/components/SettlementButton/AnimatedSettlementButton.tsx +++ b/src/components/SettlementButton/AnimatedSettlementButton.tsx @@ -31,7 +31,7 @@ function AnimatedSettlementButton({ const {translate} = useLocalize(); const isAnimationRunning = isPaidAnimationRunning || isApprovedAnimationRunning; - const buttonDuration = isPaidAnimationRunning ? CONST.ANIMATION_PAID_DURATION : CONST.ANIMATION_THUMBSUP_DURATION; + const buttonDuration = isPaidAnimationRunning ? CONST.ANIMATION_PAID_DURATION : CONST.ANIMATION_THUMBS_UP_DURATION; const buttonDelay = CONST.ANIMATION_PAID_BUTTON_HIDE_DELAY; const gap = styles.expenseAndReportPreviewTextButtonContainer.gap; const buttonMarginTop = useSharedValue(gap); diff --git a/src/components/SettlementButton/index.tsx b/src/components/SettlementButton/index.tsx index dad07e459432..ba69591c0b26 100644 --- a/src/components/SettlementButton/index.tsx +++ b/src/components/SettlementButton/index.tsx @@ -109,7 +109,7 @@ function SettlementButton({ }, [isLoadingLastPaymentMethod]); const isInvoiceReport = (!isEmptyObject(iouReport) && isInvoiceReportUtil(iouReport)) || false; - const shouldShowPaywithExpensifyOption = !shouldHidePaymentOptions; + const shouldShowPayWithExpensifyOption = !shouldHidePaymentOptions; const shouldShowPayElsewhereOption = !shouldHidePaymentOptions && !isInvoiceReport; const paymentButtonOptions = useMemo(() => { const buttonOptions = []; @@ -152,7 +152,7 @@ function SettlementButton({ if (canUseWallet) { buttonOptions.push(paymentMethods[CONST.IOU.PAYMENT_TYPE.EXPENSIFY]); } - if (isExpenseReport && shouldShowPaywithExpensifyOption) { + if (isExpenseReport && shouldShowPayWithExpensifyOption) { buttonOptions.push(paymentMethods[CONST.IOU.PAYMENT_TYPE.VBBA]); } if (shouldShowPayElsewhereOption) { @@ -237,7 +237,7 @@ function SettlementButton({ currency, shouldHidePaymentOptions, shouldShowApproveButton, - shouldShowPaywithExpensifyOption, + shouldShowPayWithExpensifyOption, shouldShowPayElsewhereOption, chatReport, onPress, diff --git a/src/components/TestToolMenu.tsx b/src/components/TestToolMenu.tsx index 8d8c3bc4dc89..9d690e774608 100644 --- a/src/components/TestToolMenu.tsx +++ b/src/components/TestToolMenu.tsx @@ -119,7 +119,7 @@ function TestToolMenu() { {/* When toggled all network requests will fail. */} - + 0) { hasValueRef.current = true; - // When the componment is uncontrolled, we need to manually activate the label: + // When the component is uncontrolled, we need to manually activate the label: if (value === undefined) { activateLabel(); } @@ -282,8 +282,8 @@ function BaseTextInput( onPress={onPress} tabIndex={-1} accessibilityLabel={label} - // When autoGrowHeight is true we calculate the width for the textInput, so it will break lines properly - // or if multiline is not supplied we calculate the textinput height, using onLayout. + // When autoGrowHeight is true we calculate the width for the text input, so it will break lines properly + // or if multiline is not supplied we calculate the text input height, using onLayout. onLayout={onLayout} style={[ autoGrowHeight && diff --git a/src/components/TextInput/BaseTextInput/types.ts b/src/components/TextInput/BaseTextInput/types.ts index a9b6762ce39e..c70612c94b16 100644 --- a/src/components/TextInput/BaseTextInput/types.ts +++ b/src/components/TextInput/BaseTextInput/types.ts @@ -52,7 +52,7 @@ type CustomBaseTextInputProps = { disableKeyboard?: boolean; /** - * Autogrow input container length based on the entered text. + * input container length based on the entered text. */ autoGrow?: boolean; @@ -60,7 +60,7 @@ type CustomBaseTextInputProps = { autoGrowExtraSpace?: number; /** - * Autogrow input container height based on the entered text + * Auto grow input container height based on the entered text */ autoGrowHeight?: boolean; diff --git a/src/components/TimePicker/TimePicker.tsx b/src/components/TimePicker/TimePicker.tsx index 05210165f126..2c3aff898dbe 100644 --- a/src/components/TimePicker/TimePicker.tsx +++ b/src/components/TimePicker/TimePicker.tsx @@ -20,7 +20,7 @@ import {canUseTouchScreen as canUseTouchScreenDeviceCapabilities} from '@libs/De import CONST from '@src/CONST'; import setCursorPosition from './setCursorPosition'; -type TimePickerRefName = 'hourRef' | 'minuteRef' | 'secondRef' | 'milisecondRef'; +type TimePickerRefName = 'hourRef' | 'minuteRef' | 'secondRef' | 'millisecondRef'; type TimePickerRef = Record; @@ -137,7 +137,7 @@ function TimePicker( const [selectionHour, setSelectionHour] = useState({start: 0, end: 0}); const [selectionMinute, setSelectionMinute] = useState(showFullFormat ? {start: 0, end: 0} : {start: 2, end: 2}); // we focus it by default so need to have selection on the end const [selectionSecond, setSelectionSecond] = useState({start: 0, end: 0}); - const [selectionMilisecond, setSelectionMilisecond] = useState(showFullFormat ? {start: 6, end: 6} : {start: 0, end: 0}); + const [selectionMillisecond, setSelectionMillisecond] = useState(showFullFormat ? {start: 6, end: 6} : {start: 0, end: 0}); const [hours, setHours] = useState(() => DateUtils.get12HourTimeObjectFromDate(value, showFullFormat).hour); const [minutes, setMinutes] = useState(() => DateUtils.get12HourTimeObjectFromDate(value, showFullFormat).minute); const [seconds, setSeconds] = useState(() => DateUtils.get12HourTimeObjectFromDate(value, showFullFormat).seconds); @@ -148,11 +148,11 @@ function TimePicker( const hourInputRef = useRef(null); const minuteInputRef = useRef(null); const secondInputRef = useRef(null); - const milisecondInputRef = useRef(null); + const millisecondInputRef = useRef(null); const {inputCallbackRef} = useAutoFocusInput(); - const focusMilisecondInputOnFirstCharacter = useCallback(() => setCursorPosition(0, milisecondInputRef, setSelectionMilisecond), []); + const focusMillisecondInputOnFirstCharacter = useCallback(() => setCursorPosition(0, millisecondInputRef, setSelectionMillisecond), []); const focusSecondInputOnLastCharacter = useCallback(() => setCursorPosition(2, secondInputRef, setSelectionSecond), []); const focusSecondInputOnFirstCharacter = useCallback(() => setCursorPosition(0, secondInputRef, setSelectionSecond), []); const focusMinuteInputOnLastCharacter = useCallback(() => setCursorPosition(2, minuteInputRef, setSelectionMinute), []); @@ -200,7 +200,7 @@ function TimePicker( const resetMilliseconds = () => { setMinutes('000'); - setSelectionMilisecond({start: 0, end: 0}); + setSelectionMillisecond({start: 0, end: 0}); }; // This function receive value from hour input and validate it @@ -444,7 +444,7 @@ function TimePicker( setSeconds(newSecond); setSelectionSecond({start: newSelection, end: newSelection}); if (newSelection === 2) { - focusMilisecondInputOnFirstCharacter(); + focusMillisecondInputOnFirstCharacter(); } }; @@ -465,69 +465,69 @@ function TimePicker( return; } - let newMilisecond; + let newMillisecond; let newSelection; - if (selectionMilisecond.start === 0 && selectionMilisecond.end === 0) { + if (selectionMillisecond.start === 0 && selectionMillisecond.end === 0) { // The cursor is at the start of milliseconds const firstDigit = trimmedText[0]; const secondDigit = trimmedText[2] || '0'; const thirdDigit = trimmedText[3] || '0'; - newMilisecond = `${firstDigit}${secondDigit}${thirdDigit}`; + newMillisecond = `${firstDigit}${secondDigit}${thirdDigit}`; newSelection = 1; - } else if (selectionMilisecond.start === 1 && selectionMilisecond.end === 1) { + } else if (selectionMillisecond.start === 1 && selectionMillisecond.end === 1) { // The cursor is in-between the digits if (lastPressedKey.current === 'Backspace') { // We have removed the first digit. Replace it with 0 and move the cursor to the start. const secondDigit = trimmedText[0]; const thirdDigit = trimmedText[1] || '0'; - newMilisecond = `0${secondDigit}${thirdDigit}`; + newMillisecond = `0${secondDigit}${thirdDigit}`; newSelection = 0; } else { const firstDigit = trimmedText[0]; const secondDigit = trimmedText[1] || '0'; const thirdDigit = trimmedText[3] || '0'; - newMilisecond = `${firstDigit}${secondDigit}${thirdDigit}`; + newMillisecond = `${firstDigit}${secondDigit}${thirdDigit}`; newSelection = 2; } - } else if (selectionMilisecond.start === 2 && selectionMilisecond.end === 2) { + } else if (selectionMillisecond.start === 2 && selectionMillisecond.end === 2) { // The cursor is in-between the digits if (lastPressedKey.current === 'Backspace') { // We have removed the second digit. Replace it with 0 and move the cursor back. const firstDigit = trimmedText[0]; const thirdDigit = trimmedText[1] || '0'; - newMilisecond = `${firstDigit}0${thirdDigit}`; + newMillisecond = `${firstDigit}0${thirdDigit}`; newSelection = 1; } else { const firstDigit = trimmedText[0]; const secondDigit = trimmedText[1] || '0'; const thirdDigit = trimmedText[2] || '0'; - newMilisecond = `${firstDigit}${secondDigit}${thirdDigit}`; + newMillisecond = `${firstDigit}${secondDigit}${thirdDigit}`; newSelection = 3; } - } else if (selectionMilisecond.start === 0 && selectionMilisecond.end === 1) { + } else if (selectionMillisecond.start === 0 && selectionMillisecond.end === 1) { // There is an active selection of the first digit - newMilisecond = trimmedText.substring(0, 3).padStart(3, '0'); + newMillisecond = trimmedText.substring(0, 3).padStart(3, '0'); newSelection = trimmedText.length === 1 ? 0 : 1; - } else if (selectionMilisecond.start === 1 && selectionMilisecond.end === 2) { + } else if (selectionMillisecond.start === 1 && selectionMillisecond.end === 2) { // There is an active selection of the second digit - newMilisecond = trimmedText.substring(0, 3).padStart(3, '0'); + newMillisecond = trimmedText.substring(0, 3).padStart(3, '0'); newSelection = trimmedText.length === 1 ? 1 : 2; - } else if (selectionMilisecond.start === 2 && selectionMilisecond.end === 3) { + } else if (selectionMillisecond.start === 2 && selectionMillisecond.end === 3) { // There is an active selection of the third digit - newMilisecond = trimmedText.substring(0, 3).padEnd(3, '0'); + newMillisecond = trimmedText.substring(0, 3).padEnd(3, '0'); newSelection = trimmedText.length === 2 ? 2 : 3; } else { - newMilisecond = trimmedText.substring(0, 3).padEnd(3, '0'); + newMillisecond = trimmedText.substring(0, 3).padEnd(3, '0'); newSelection = trimmedText.length; } - if (Number(newMilisecond) > 999) { - newMilisecond = milliseconds; + if (Number(newMillisecond) > 999) { + newMillisecond = milliseconds; } - setMilliseconds(newMilisecond); - setSelectionMilisecond({start: newSelection, end: newSelection}); + setMilliseconds(newMillisecond); + setSelectionMillisecond({start: newSelection, end: newSelection}); }; /** @@ -539,9 +539,9 @@ function TimePicker( const isHourFocused = hourInputRef.current?.isFocused(); const isMinuteFocused = minuteInputRef.current?.isFocused(); const isSecondFocused = secondInputRef.current?.isFocused(); - const isMilisecondFocused = milisecondInputRef.current?.isFocused(); - if (showFullFormat && !isHourFocused && !isMinuteFocused && !isSecondFocused && !isMilisecondFocused) { - milisecondInputRef.current?.focus(); + const isMillisecondFocused = millisecondInputRef.current?.isFocused(); + if (showFullFormat && !isHourFocused && !isMinuteFocused && !isSecondFocused && !isMillisecondFocused) { + millisecondInputRef.current?.focus(); } else if (!showFullFormat && !isHourFocused && !isMinuteFocused) { minuteInputRef.current?.focus(); } @@ -566,13 +566,13 @@ function TimePicker( } clearSelectedValue(seconds, selectionSecond, setSeconds, setSelectionSecond); - } else if (isMilisecondFocused) { - if (selectionMilisecond.start === 0 && selectionMilisecond.end === 0) { + } else if (isMillisecondFocused) { + if (selectionMillisecond.start === 0 && selectionMillisecond.end === 0) { focusSecondInputOnLastCharacter(); return; } - clearSelectedValue(milliseconds, selectionMilisecond, setMilliseconds, setSelectionMilisecond, 3); + clearSelectedValue(milliseconds, selectionMillisecond, setMilliseconds, setSelectionMillisecond, 3); } return; } @@ -584,12 +584,12 @@ function TimePicker( handleMinutesChange(insertAtPosition(minutes, trimmedKey, selectionMinute.start, selectionMinute.end)); } else if (isSecondFocused) { handleSecondsChange(insertAtPosition(seconds, trimmedKey, selectionSecond.start, selectionSecond.end)); - } else if (isMilisecondFocused) { - handleMillisecondsChange(insertAtPosition(milliseconds, trimmedKey, selectionMilisecond.start, selectionMilisecond.end)); + } else if (isMillisecondFocused) { + handleMillisecondsChange(insertAtPosition(milliseconds, trimmedKey, selectionMillisecond.start, selectionMillisecond.end)); } }, // eslint-disable-next-line react-compiler/react-compiler, react-hooks/exhaustive-deps - [minutes, hours, seconds, milliseconds, selectionMinute, selectionHour, selectionSecond, selectionMilisecond], + [minutes, hours, seconds, milliseconds, selectionMinute, selectionHour, selectionSecond, selectionMillisecond], ); useEffect(() => { @@ -617,7 +617,7 @@ function TimePicker( e?.preventDefault(); focusMinuteInputOnLastCharacter(); } - if (milisecondInputRef.current?.isFocused() && selectionMilisecond.start === 0) { + if (millisecondInputRef.current?.isFocused() && selectionMillisecond.start === 0) { // Check e to be truthy to avoid crashing on Android (e is undefined there) e?.preventDefault(); focusSecondInputOnLastCharacter(); @@ -641,11 +641,11 @@ function TimePicker( if (secondInputRef.current?.isFocused() && selectionSecond.start === 2) { // Check e to be truthy to avoid crashing on Android (e is undefined there) e?.preventDefault(); - focusMilisecondInputOnFirstCharacter(); + focusMillisecondInputOnFirstCharacter(); } }, // eslint-disable-next-line react-compiler/react-compiler, react-hooks/exhaustive-deps - [selectionHour, selectionMinute, selectionSecond, selectionMilisecond], + [selectionHour, selectionMinute, selectionSecond, selectionMillisecond], ); useKeyboardShortcut(CONST.KEYBOARD_SHORTCUTS.ARROW_LEFT, arrowLeftCallback, arrowConfig); @@ -664,7 +664,7 @@ function TimePicker( e.preventDefault(); focusMinuteInputOnLastCharacter(); } - if (milisecondInputRef.current?.isFocused() && selectionMilisecond.start === 0 && selectionMilisecond.end === 0) { + if (millisecondInputRef.current?.isFocused() && selectionMillisecond.start === 0 && selectionMillisecond.end === 0) { e.preventDefault(); focusSecondInputOnLastCharacter(); } @@ -675,8 +675,8 @@ function TimePicker( selectionMinute.end, selectionSecond.start, selectionSecond.end, - selectionMilisecond.start, - selectionMilisecond.end, + selectionMillisecond.start, + selectionMillisecond.end, focusHourInputOnLastCharacter, focusMinuteInputOnLastCharacter, focusSecondInputOnLastCharacter, @@ -717,7 +717,7 @@ function TimePicker( hourRef: hourInputRef.current, minuteRef: minuteInputRef.current, secondRef: secondInputRef.current, - milisecondRef: milisecondInputRef.current, + millisecondRef: millisecondInputRef.current, [refName]: updatedRef, }; if (typeof ref === 'function') { @@ -844,19 +844,19 @@ function TimePicker( }} onChangeAmount={handleMillisecondsChange} ref={(textInputRef) => { - updateRefs('milisecondRef', textInputRef); - milisecondInputRef.current = textInputRef as TextInput | null; + updateRefs('millisecondRef', textInputRef); + millisecondInputRef.current = textInputRef as TextInput | null; if (showFullFormat) { inputCallbackRef(textInputRef as TextInput | null); } }} onSelectionChange={(e) => { - setSelectionMilisecond(e.nativeEvent.selection); + setSelectionMillisecond(e.nativeEvent.selection); }} style={[styles.iouAmountTextInput, styles.timePickerInput, showFullFormat && [styles.textXXLarge, styles.mnw0]]} containerStyle={[styles.iouAmountTextInputContainer]} touchableInputWrapperStyle={!showFullFormat && styles.timePickerHeight100} - selection={selectionMilisecond} + selection={selectionMillisecond} /> )} diff --git a/src/components/Tooltip/TooltipSense.tsx b/src/components/Tooltip/TooltipSense.tsx index bc16df3f8c7e..7e1be896a1d7 100644 --- a/src/components/Tooltip/TooltipSense.tsx +++ b/src/components/Tooltip/TooltipSense.tsx @@ -4,7 +4,7 @@ import CONST from '@src/CONST'; let active = false; /** - * Debounced function to deactive the TooltipSense after a specific time + * Debounced function to deactivate the TooltipSense after a specific time */ const debouncedDeactivate = lodashDebounce(() => { active = false; diff --git a/src/components/Tooltip/types.ts b/src/components/Tooltip/types.ts index 69c49906d94b..ec08c815eb92 100644 --- a/src/components/Tooltip/types.ts +++ b/src/components/Tooltip/types.ts @@ -5,7 +5,7 @@ import type {TooltipAnchorAlignment} from '@src/types/utils/AnchorAlignment'; import type ChildrenProps from '@src/types/utils/ChildrenProps'; type SharedTooltipProps = { - /** The text to display in the tooltip. If text is ommitted, only children will be rendered. */ + /** The text to display in the tooltip. If text is omitted, only children will be rendered. */ text?: string; /** Maximum number of lines to show in tooltip */ @@ -67,7 +67,7 @@ type GenericTooltipProps = SharedTooltipProps & { /** Whether the actual Tooltip should be rendered. If false, it's just going to return the children */ shouldRender?: boolean; - /** Whether to ignore TooltipSense activity and always triger animation */ + /** Whether to ignore TooltipSense activity and always trigger animation */ shouldForceAnimate?: boolean; /** Whether it is education tooltip */ diff --git a/src/components/TransactionItemRow/TransactionItemRowRBR.tsx b/src/components/TransactionItemRow/TransactionItemRowRBR.tsx index e9c1629e87d4..89e0c5b13018 100644 --- a/src/components/TransactionItemRow/TransactionItemRowRBR.tsx +++ b/src/components/TransactionItemRow/TransactionItemRowRBR.tsx @@ -18,7 +18,7 @@ function TransactionItemRowRBR({transaction, containerStyles}: {transaction: Tra const {translate} = useLocalize(); const theme = useTheme(); - const RBRmessages = transactionViolations + const RBRMessages = transactionViolations .map((violation, index) => { const translation = ViolationsUtils.getViolationTranslation(violation, translate); return index > 0 ? translation.charAt(0).toLowerCase() + translation.slice(1) : translation; @@ -38,7 +38,7 @@ function TransactionItemRowRBR({transaction, containerStyles}: {transaction: Tra numberOfLines={1} style={[styles.textMicroSupporting, styles.pre, styles.flexShrink1, {color: theme.danger}]} > - {RBRmessages} + {RBRMessages} ) diff --git a/src/components/VideoPlayer/BaseVideoPlayer.tsx b/src/components/VideoPlayer/BaseVideoPlayer.tsx index 251c74d4cbcc..d8b8a695d7ae 100644 --- a/src/components/VideoPlayer/BaseVideoPlayer.tsx +++ b/src/components/VideoPlayer/BaseVideoPlayer.tsx @@ -77,7 +77,7 @@ function BaseVideoPlayer({ const [isEnded, setIsEnded] = useState(false); const [isBuffering, setIsBuffering] = useState(true); const [hasError, setHasError] = useState(false); - // we add "#t=0.001" at the end of the URL to skip first milisecond of the video and always be able to show proper video preview when video is paused at the beginning + // we add "#t=0.001" at the end of the URL to skip first millisecond of the video and always be able to show proper video preview when video is paused at the beginning const [sourceURL] = useState(() => VideoUtils.addSkipTimeTagToURL(url.includes('blob:') || url.includes('file:///') ? url : addEncryptedAuthTokenToURL(url), 0.001)); const [isPopoverVisible, setIsPopoverVisible] = useState(false); const [popoverAnchorPosition, setPopoverAnchorPosition] = useState({horizontal: 0, vertical: 0}); @@ -237,9 +237,9 @@ function BaseVideoPlayer({ const isVideoPlaying = status.isPlaying; // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing const currentDuration = status.durationMillis || videoDuration * 1000; - const currentPositon = status.positionMillis || 0; + const currentPosition = status.positionMillis || 0; - if (shouldReplayVideo(status, isVideoPlaying, currentDuration, currentPositon) && !isEnded) { + if (shouldReplayVideo(status, isVideoPlaying, currentDuration, currentPosition) && !isEnded) { videoPlayerRef.current?.setStatusAsync({positionMillis: 0, shouldPlay: true}); } @@ -248,7 +248,7 @@ function BaseVideoPlayer({ setIsLoading(Number.isNaN(status.durationMillis)); // when video is ready to display duration is not NaN setIsBuffering(status.isBuffering); setDuration(currentDuration); - setPosition(currentPositon); + setPosition(currentPosition); videoStateRef.current = status; onPlaybackStatusUpdate?.(status); diff --git a/src/components/VideoPlayer/VideoErrorIndicator.tsx b/src/components/VideoPlayer/VideoErrorIndicator.tsx index 249006569374..3b021777f913 100644 --- a/src/components/VideoPlayer/VideoErrorIndicator.tsx +++ b/src/components/VideoPlayer/VideoErrorIndicator.tsx @@ -28,7 +28,7 @@ function VideoErrorIndicator({isPreview = false}: VideoErrorIndicatorProps) { /> {!isPreview && ( - {translate('common.errorOccuredWhileTryingToPlayVideo')} + {translate('common.errorOccurredWhileTryingToPlayVideo')} )} diff --git a/src/components/VideoPlayerContexts/VideoPopoverMenuContext.tsx b/src/components/VideoPlayerContexts/VideoPopoverMenuContext.tsx index 310563114849..ff4a349f898e 100644 --- a/src/components/VideoPlayerContexts/VideoPopoverMenuContext.tsx +++ b/src/components/VideoPlayerContexts/VideoPopoverMenuContext.tsx @@ -73,11 +73,11 @@ function VideoPopoverMenuContextProvider({children}: ChildrenProps) { } function useVideoPopoverMenuContext() { - const videoPopooverMenuContext = useContext(Context); - if (!videoPopooverMenuContext) { + const videoPopoverMenuContext = useContext(Context); + if (!videoPopoverMenuContext) { throw new Error('useVideoPopoverMenuContext must be used within a VideoPopoverMenuContext'); } - return videoPopooverMenuContext; + return videoPopoverMenuContext; } VideoPopoverMenuContextProvider.displayName = 'VideoPopoverMenuContextProvider'; diff --git a/src/components/WorkspaceConfirmationForm.tsx b/src/components/WorkspaceConfirmationForm.tsx index ecf6760f2efb..fa589dc06ef7 100644 --- a/src/components/WorkspaceConfirmationForm.tsx +++ b/src/components/WorkspaceConfirmationForm.tsx @@ -108,7 +108,7 @@ function WorkspaceConfirmationForm({onSubmit, policyOwnerEmail = '', onBackButto // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing -- nullish coalescing cannot be used if left side can be empty string source={workspaceAvatar?.avatarUri || getDefaultWorkspaceAvatar(workspaceNameFirstCharacter)} fallbackIcon={Expensicons.FallbackWorkspaceAvatar} - size={CONST.AVATAR_SIZE.XLARGE} + size={CONST.AVATAR_SIZE.X_LARGE} name={workspaceNameFirstCharacter} avatarID={policyID} type={CONST.ICON_TYPE_WORKSPACE} @@ -143,7 +143,7 @@ function WorkspaceConfirmationForm({onSubmit, policyOwnerEmail = '', onBackButto setAvatarFile(undefined); setWorkspaceAvatar({avatarUri: null, avatarFileName: null, avatarFileType: null}); }} - size={CONST.AVATAR_SIZE.XLARGE} + size={CONST.AVATAR_SIZE.X_LARGE} avatarStyle={[styles.avatarXLarge, styles.alignSelfCenter]} shouldDisableViewPhoto editIcon={Expensicons.Camera} diff --git a/src/components/WorkspaceMembersSelectionList.tsx b/src/components/WorkspaceMembersSelectionList.tsx index f7614fd4b9dc..c4b8a48bbe80 100644 --- a/src/components/WorkspaceMembersSelectionList.tsx +++ b/src/components/WorkspaceMembersSelectionList.tsx @@ -3,7 +3,7 @@ import type {SectionListData} from 'react-native'; import useDebouncedState from '@hooks/useDebouncedState'; import useLocalize from '@hooks/useLocalize'; import usePolicy from '@hooks/usePolicy'; -import useScreenWrapperTranstionStatus from '@hooks/useScreenWrapperTransitionStatus'; +import useScreenWrapperTransitionStatus from '@hooks/useScreenWrapperTransitionStatus'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as PolicyUtils from '@libs/PolicyUtils'; @@ -35,7 +35,7 @@ type WorkspaceMembersSelectionListProps = { function WorkspaceMembersSelectionList({policyID, selectedApprover, setApprover}: WorkspaceMembersSelectionListProps) { const {translate} = useLocalize(); - const {didScreenTransitionEnd} = useScreenWrapperTranstionStatus(); + const {didScreenTransitionEnd} = useScreenWrapperTransitionStatus(); const [searchTerm, debouncedSearchTerm, setSearchTerm] = useDebouncedState(''); const personalDetails = usePersonalDetails(); const policy = usePolicy(policyID); diff --git a/src/hooks/useAnimatedHighlightStyle/index.ts b/src/hooks/useAnimatedHighlightStyle/index.ts index 4c9099c7f1ba..5a591cdf907b 100644 --- a/src/hooks/useAnimatedHighlightStyle/index.ts +++ b/src/hooks/useAnimatedHighlightStyle/index.ts @@ -1,7 +1,7 @@ import React, {useState} from 'react'; import {InteractionManager} from 'react-native'; import {Easing, interpolate, interpolateColor, runOnJS, useAnimatedStyle, useSharedValue, withDelay, withSequence, withTiming} from 'react-native-reanimated'; -import useScreenWrapperTranstionStatus from '@hooks/useScreenWrapperTransitionStatus'; +import useScreenWrapperTransitionStatus from '@hooks/useScreenWrapperTransitionStatus'; import useTheme from '@hooks/useTheme'; import CONST from '@src/CONST'; @@ -62,7 +62,7 @@ export default function useAnimatedHighlightStyle({ const [startHighlight, setStartHighlight] = useState(false); const repeatableProgress = useSharedValue(0); const nonRepeatableProgress = useSharedValue(shouldHighlight ? 0 : 1); - const {didScreenTransitionEnd} = useScreenWrapperTranstionStatus(); + const {didScreenTransitionEnd} = useScreenWrapperTransitionStatus(); const theme = useTheme(); const highlightBackgroundStyle = useAnimatedStyle(() => ({ diff --git a/src/hooks/useOnboardingFlow.ts b/src/hooks/useOnboardingFlow.ts index 4cfbc4ca4ba6..ec018ed763ee 100644 --- a/src/hooks/useOnboardingFlow.ts +++ b/src/hooks/useOnboardingFlow.ts @@ -22,7 +22,7 @@ function useOnboardingFlowRouter() { selector: hasCompletedGuidedSetupFlowSelector, canBeMissing: true, }); - const [tryNewDot, tryNewDotdMetadata] = useOnyx(ONYXKEYS.NVP_TRYNEWDOT, { + const [tryNewDot, tryNewDotdMetadata] = useOnyx(ONYXKEYS.NVP_TRY_NEW_DOT, { selector: tryNewDotOnyxSelector, canBeMissing: true, }); diff --git a/src/hooks/useScreenWrapperTransitionStatus.ts b/src/hooks/useScreenWrapperTransitionStatus.ts index b9e94abfc024..0d58bf3120c8 100644 --- a/src/hooks/useScreenWrapperTransitionStatus.ts +++ b/src/hooks/useScreenWrapperTransitionStatus.ts @@ -6,7 +6,7 @@ import {ScreenWrapperStatusContext} from '@components/ScreenWrapper'; * Use this hook if you can't get the transition status from the ScreenWrapper itself. Usually when ScreenWrapper is used inside TopTabNavigator. * @returns `didScreenTransitionEnd` flag to indicate if navigation transition ended. */ -export default function useScreenWrapperTranstionStatus() { +export default function useScreenWrapperTransitionStatus() { const value = useContext(ScreenWrapperStatusContext); if (value === undefined) { diff --git a/src/hooks/useSidePanel.ts b/src/hooks/useSidePanel.ts index 70c15bd1a382..4fb4cf7df20b 100644 --- a/src/hooks/useSidePanel.ts +++ b/src/hooks/useSidePanel.ts @@ -23,7 +23,7 @@ function useSidePanelDisplayStatus() { const [isModalCenteredVisible = false] = useOnyx(ONYXKEYS.MODAL, { canBeMissing: true, selector: (modal) => - modal?.type === CONST.MODAL.MODAL_TYPE.CENTERED_SWIPABLE_TO_RIGHT || + modal?.type === CONST.MODAL.MODAL_TYPE.CENTERED_SWIPEABLE_TO_RIGHT || modal?.type === CONST.MODAL.MODAL_TYPE.CENTERED_UNSWIPEABLE || modal?.type === CONST.MODAL.MODAL_TYPE.CENTERED_SMALL || modal?.type === CONST.MODAL.MODAL_TYPE.CENTERED, diff --git a/src/languages/en.ts b/src/languages/en.ts index 3923014d5bae..e09a73e826fc 100755 --- a/src/languages/en.ts +++ b/src/languages/en.ts @@ -430,8 +430,8 @@ const translations = { conciergeHelp: 'Please reach out to Concierge for help.', youAppearToBeOffline: 'You appear to be offline.', thisFeatureRequiresInternet: 'This feature requires an active internet connection.', - attachementWillBeAvailableOnceBackOnline: 'Attachment will become available once back online.', - errorOccuredWhileTryingToPlayVideo: 'An error occurred while trying to play this video.', + attachmentWillBeAvailableOnceBackOnline: 'Attachment will become available once back online.', + errorOccurredWhileTryingToPlayVideo: 'An error occurred while trying to play this video.', areYouSure: 'Are you sure?', verify: 'Verify', yesContinue: 'Yes, continue', @@ -1370,7 +1370,7 @@ const translations = { useStagingServer: 'Use Staging Server', forceOffline: 'Force offline', simulatePoorConnection: 'Simulate poor internet connection', - simulatFailingNetworkRequests: 'Simulate failing network requests', + simulateFailingNetworkRequests: 'Simulate failing network requests', authenticationStatus: 'Authentication status', deviceCredentials: 'Device credentials', invalidate: 'Invalidate', @@ -2174,7 +2174,7 @@ const translations = { goBackHome: 'Go back to home page', }, errorPage: { - title: ({isBreakline}: {isBreakline: boolean}) => `Oops... ${isBreakline ? '\n' : ''}Something went wrong`, + title: ({isBreakLine}: {isBreakLine: boolean}) => `Oops... ${isBreakLine ? '\n' : ''}Something went wrong`, subtitle: 'Your request could not be completed. Please try again later.', }, setPasswordPage: { @@ -5468,7 +5468,7 @@ const translations = { workspaceName: 'Workspace name', chatUserDisplayNames: 'Chat member display names', scrollToNewestMessages: 'Scroll to newest messages', - prestyledText: 'Prestyled text', + preStyledText: 'Prestyled text', viewAttachment: 'View attachment', }, parentReportAction: { @@ -6207,9 +6207,9 @@ const translations = { }, }, productTrainingTooltip: { - // TODO: CONCEIRGE_LHN_GBR tooltip will be replaced by a tooltip in the #admins room + // TODO: CONCIERGE_LHN_GBR tooltip will be replaced by a tooltip in the #admins room // https://github.com/Expensify/App/issues/57045#issuecomment-2701455668 - conciergeLHNGBR: { + conciergeLHNGbr: { part1: 'Get started', part2: ' here!', }, diff --git a/src/languages/es.ts b/src/languages/es.ts index a493fb2441ca..2a442b270636 100644 --- a/src/languages/es.ts +++ b/src/languages/es.ts @@ -423,8 +423,8 @@ const translations = { conciergeHelp: 'Por favor, contacta con Concierge para obtener ayuda.', youAppearToBeOffline: 'Parece que estás desconectado.', thisFeatureRequiresInternet: 'Esta función requiere una conexión a Internet activa.', - attachementWillBeAvailableOnceBackOnline: 'El archivo adjunto estará disponible cuando vuelvas a estar en línea.', - errorOccuredWhileTryingToPlayVideo: 'Se produjo un error al intentar reproducir este video.', + attachmentWillBeAvailableOnceBackOnline: 'El archivo adjunto estará disponible cuando vuelvas a estar en línea.', + errorOccurredWhileTryingToPlayVideo: 'Se produjo un error al intentar reproducir este video.', areYouSure: '¿Estás seguro?', verify: 'Verifique', yesContinue: 'Sí, continuar', @@ -1370,7 +1370,7 @@ const translations = { useStagingServer: 'Usar servidor "staging"', forceOffline: 'Forzar desconexión', simulatePoorConnection: 'Simular una conexión a internet deficiente', - simulatFailingNetworkRequests: 'Simular fallos en solicitudes de red', + simulateFailingNetworkRequests: 'Simular fallos en solicitudes de red', authenticationStatus: 'Estado de autenticación', deviceCredentials: 'Credenciales del dispositivo', invalidate: 'Invalidar', @@ -2182,7 +2182,7 @@ const translations = { goBackHome: 'Volver a la página principal', }, errorPage: { - title: ({isBreakline}: {isBreakline: boolean}) => `Ups... ${isBreakline ? '\n' : ''}Algo no ha ido bien`, + title: ({isBreakLine}: {isBreakLine: boolean}) => `Ups... ${isBreakLine ? '\n' : ''}Algo no ha ido bien`, subtitle: 'No se ha podido completar la acción. Por favor, inténtalo más tarde.', }, setPasswordPage: { @@ -5986,7 +5986,7 @@ const translations = { workspaceName: 'Nombre del espacio de trabajo', chatUserDisplayNames: 'Nombres de los miembros del chat', scrollToNewestMessages: 'Desplázate a los mensajes más recientes', - prestyledText: 'texto preestilizado', + preStyledText: 'texto preestilizado', viewAttachment: 'Ver archivo adjunto', }, parentReportAction: { @@ -6732,9 +6732,9 @@ const translations = { }, }, productTrainingTooltip: { - // TODO: CONCEIRGE_LHN_GBR tooltip will be replaced by a tooltip in the #admins room + // TODO: CONCIERGE_LHN_GBR tooltip will be replaced by a tooltip in the #admins room // https://github.com/Expensify/App/issues/57045#issuecomment-2701455668 - conciergeLHNGBR: { + conciergeLHNGbr: { part1: '¡Comienza', part2: ' aquí!', }, diff --git a/src/libs/EmojiUtils.tsx b/src/libs/EmojiUtils.tsx index 9eb53105b9e4..f73b9c5808db 100644 --- a/src/libs/EmojiUtils.tsx +++ b/src/libs/EmojiUtils.tsx @@ -16,7 +16,7 @@ import type EmojiTrie from './EmojiTrie'; import type {SupportedLanguage} from './EmojiTrie'; import memoize from './memoize'; -type HeaderIndice = {code: string; index: number; icon: IconAsset}; +type HeaderIndices = {code: string; index: number; icon: IconAsset}; type EmojiSpacer = {code: string; spacer: boolean}; type EmojiPickerListItem = EmojiSpacer | Emoji | HeaderEmoji; type EmojiPickerList = EmojiPickerListItem[]; @@ -194,8 +194,8 @@ function containsOnlyEmojis(message: string): boolean { /** * Get the header emojis with their code, icon and index */ -function getHeaderEmojis(emojis: EmojiPickerList): HeaderIndice[] { - const headerIndices: HeaderIndice[] = []; +function getHeaderEmojis(emojis: EmojiPickerList): HeaderIndices[] { + const headerIndices: HeaderIndices[] = []; emojis.forEach((emoji, index) => { if (!('header' in emoji)) { return; @@ -667,7 +667,7 @@ function getProcessedText(processedTextArray: TextWithEmoji[], style: StyleProp< ); } -export type {HeaderIndice, EmojiPickerList, EmojiPickerListItem}; +export type {HeaderIndices, EmojiPickerList, EmojiPickerListItem}; export { findEmojiByName, diff --git a/src/libs/OptionsListUtils.ts b/src/libs/OptionsListUtils.ts index 34c87d0318e6..f461f6bac157 100644 --- a/src/libs/OptionsListUtils.ts +++ b/src/libs/OptionsListUtils.ts @@ -282,7 +282,7 @@ type OrderOptionsConfig = }; type OrderReportOptionsConfig = { - preferChatroomsOverThreads?: boolean; + preferChatRoomsOverThreads?: boolean; preferPolicyExpenseChat?: boolean; preferRecentExpenseReports?: boolean; }; @@ -790,7 +790,7 @@ function getLastMessageTextForReport( lastMessageTextFromReport = getDowngradeWorkspaceMessage(); } else if (isActionableAddPaymentCard(lastReportAction) || isActionOfType(lastReportAction, CONST.REPORT.ACTIONS.TYPE.CHANGE_POLICY)) { lastMessageTextFromReport = getReportActionMessageText(lastReportAction); - } else if (lastReportAction?.actionName === 'EXPORTINTEGRATION') { + } else if (lastReportAction?.actionName === CONST.REPORT.ACTIONS.TYPE.EXPORTED_TO_INTEGRATION) { lastMessageTextFromReport = getExportIntegrationLastMessageText(lastReportAction); } else if (lastReportAction?.actionName && isOldDotReportAction(lastReportAction)) { lastMessageTextFromReport = getMessageOfOldDotReportAction(lastReportAction, false); @@ -1200,7 +1200,7 @@ function orderReportOptions(options: OptionData[]) { function orderReportOptionsWithSearch( options: OptionData[], searchValue: string, - {preferChatroomsOverThreads = false, preferPolicyExpenseChat = false, preferRecentExpenseReports = false}: OrderReportOptionsConfig = {}, + {preferChatRoomsOverThreads = false, preferPolicyExpenseChat = false, preferRecentExpenseReports = false}: OrderReportOptionsConfig = {}, ) { const orderedByDate = orderReportOptions(options); @@ -1222,7 +1222,7 @@ function orderReportOptionsWithSearch( if (preferRecentExpenseReports && option.isPolicyExpenseChat) { return 1; } - if (preferChatroomsOverThreads && option.isThread) { + if (preferChatRoomsOverThreads && option.isThread) { return 4; } if (!!option.isChatRoom || option.private_isArchived) { diff --git a/src/libs/PopoverWithMeasuredContentUtils.ts b/src/libs/PopoverWithMeasuredContentUtils.ts index 0bef469744dc..0fa209a501b6 100644 --- a/src/libs/PopoverWithMeasuredContentUtils.ts +++ b/src/libs/PopoverWithMeasuredContentUtils.ts @@ -33,22 +33,22 @@ function computeHorizontalShift(anchorLeftEdge: number, menuWidth: number, windo * @param menuHeight - The height of the menu itself. * @param windowHeight - The height of the Window. * @param anchorHeight - The height of anchor component - * @param shoudSwitchPositionIfOverflow - + * @param shouldSwitchPositionIfOverflow - */ -function computeVerticalShift(anchorTopEdge: number, menuHeight: number, windowHeight: number, anchorHeight: number, shoudSwitchPositionIfOverflow = false): number { +function computeVerticalShift(anchorTopEdge: number, menuHeight: number, windowHeight: number, anchorHeight: number, shouldSwitchPositionIfOverflow = false): number { const popoverBottomEdge = anchorTopEdge + menuHeight; let canSwitchPosition = false; if (anchorTopEdge < 0) { // Anchor is in top window Edge, shift bottom by a multiple of four. canSwitchPosition = popoverBottomEdge + menuHeight + anchorHeight <= windowHeight; - return roundToNearestMultipleOfFour(shoudSwitchPositionIfOverflow && canSwitchPosition ? menuHeight + anchorHeight : 0 - anchorTopEdge); + return roundToNearestMultipleOfFour(shouldSwitchPositionIfOverflow && canSwitchPosition ? menuHeight + anchorHeight : 0 - anchorTopEdge); } if (popoverBottomEdge > windowHeight) { // Anchor is in Bottom window Edge, shift top by a multiple of four. canSwitchPosition = anchorTopEdge - menuHeight - anchorHeight >= 0; - return roundToNearestMultipleOfFour(shoudSwitchPositionIfOverflow && canSwitchPosition ? -(menuHeight + anchorHeight) : windowHeight - popoverBottomEdge); + return roundToNearestMultipleOfFour(shouldSwitchPositionIfOverflow && canSwitchPosition ? -(menuHeight + anchorHeight) : windowHeight - popoverBottomEdge); } // Anchor is not in the gutter, so no need to shift it vertically diff --git a/src/libs/actions/Session/index.ts b/src/libs/actions/Session/index.ts index 6c5ed1c554ee..d3720676a9fc 100644 --- a/src/libs/actions/Session/index.ts +++ b/src/libs/actions/Session/index.ts @@ -608,7 +608,7 @@ function signInAfterTransitionFromOldDot(hybridAppSettings: string) { [ONYXKEYS.SESSION]: {email, authToken, encryptedAuthToken: decodeURIComponent(encryptedAuthToken), accountID: Number(accountID)}, [ONYXKEYS.CREDENTIALS]: {autoGeneratedLogin, autoGeneratedPassword}, [ONYXKEYS.IS_SINGLE_NEW_DOT_ENTRY]: isSingleNewDotEntry, - [ONYXKEYS.NVP_TRYNEWDOT]: { + [ONYXKEYS.NVP_TRY_NEW_DOT]: { classicRedirect: {completedHybridAppOnboarding}, nudgeMigration: nudgeMigrationTimestamp ? {timestamp: new Date(nudgeMigrationTimestamp)} : undefined, }, diff --git a/src/libs/actions/Transaction.ts b/src/libs/actions/Transaction.ts index d9cb8049fac7..df3c2561e1c8 100644 --- a/src/libs/actions/Transaction.ts +++ b/src/libs/actions/Transaction.ts @@ -688,7 +688,7 @@ function changeTransactionsReport(transactionIDs: string[], reportID: string) { value: { parentReportID: reportID, parentReportActionID: optimisticMoneyRequestReportActionID, - policyID: reportID !== CONST.REPORT.UNREPORTED_REPORTID ? newReport.policyID : CONST.POLICY.ID_FAKE, + policyID: reportID !== CONST.REPORT.UNREPORTED_REPORT_ID ? newReport.policyID : CONST.POLICY.ID_FAKE, }, }); @@ -764,7 +764,7 @@ function changeTransactionsReport(transactionIDs: string[], reportID: string) { // 6. Add MOVEDTRANSACTION or UNREPORTEDTRANSACTION report actions const movedAction = - reportID === CONST.REPORT.UNREPORTED_REPORTID + reportID === CONST.REPORT.UNREPORTED_REPORT_ID ? buildOptimisticUnreportedTransactionAction(transactionThreadReportID, transaction.reportID) : buildOptimisticMovedTransactionAction(transactionThreadReportID, reportID); diff --git a/src/libs/actions/Welcome/index.ts b/src/libs/actions/Welcome/index.ts index 23a0f7ee6c9e..f41481834de5 100644 --- a/src/libs/actions/Welcome/index.ts +++ b/src/libs/actions/Welcome/index.ts @@ -140,7 +140,7 @@ function completeHybridAppOnboarding() { const optimisticData: OnyxUpdate[] = [ { onyxMethod: Onyx.METHOD.MERGE, - key: ONYXKEYS.NVP_TRYNEWDOT, + key: ONYXKEYS.NVP_TRY_NEW_DOT, value: { classicRedirect: { completedHybridAppOnboarding: true, @@ -179,7 +179,7 @@ Onyx.connect({ }); Onyx.connect({ - key: ONYXKEYS.NVP_TRYNEWDOT, + key: ONYXKEYS.NVP_TRY_NEW_DOT, callback: (value) => { tryNewDotData = value; checkTryNewDotDataReady(); diff --git a/src/libs/onboardingSelectors.ts b/src/libs/onboardingSelectors.ts index b578a6a36942..c7e251b059c1 100644 --- a/src/libs/onboardingSelectors.ts +++ b/src/libs/onboardingSelectors.ts @@ -29,7 +29,7 @@ function hasCompletedGuidedSetupFlowSelector(onboarding: OnyxValue): {isHybridAppOnboardingCompleted: boolean | undefined; hasBeenAddedToNudgeMigration: boolean} { +function tryNewDotOnyxSelector(tryNewDotData: OnyxValue): {isHybridAppOnboardingCompleted: boolean | undefined; hasBeenAddedToNudgeMigration: boolean} { let isHybridAppOnboardingCompleted = tryNewDotData?.classicRedirect?.completedHybridAppOnboarding; const hasBeenAddedToNudgeMigration = !!tryNewDotData?.nudgeMigration?.timestamp; diff --git a/src/pages/NewChatConfirmPage.tsx b/src/pages/NewChatConfirmPage.tsx index e4e736ba1b99..0284ff317420 100644 --- a/src/pages/NewChatConfirmPage.tsx +++ b/src/pages/NewChatConfirmPage.tsx @@ -142,7 +142,7 @@ function NewChatConfirmPage() { setAvatarFile(undefined); setGroupDraft({avatarUri: null, avatarFileName: null, avatarFileType: null}); }} - size={CONST.AVATAR_SIZE.XLARGE} + size={CONST.AVATAR_SIZE.X_LARGE} avatarStyle={styles.avatarXLarge} shouldDisableViewPhoto editIcon={Expensicons.Camera} diff --git a/src/pages/NewChatPage.tsx b/src/pages/NewChatPage.tsx index fa3eec324778..a3103885d9d1 100755 --- a/src/pages/NewChatPage.tsx +++ b/src/pages/NewChatPage.tsx @@ -18,7 +18,7 @@ import useDismissedReferralBanners from '@hooks/useDismissedReferralBanners'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; import useSafeAreaInsets from '@hooks/useSafeAreaInsets'; -import useScreenWrapperTranstionStatus from '@hooks/useScreenWrapperTransitionStatus'; +import useScreenWrapperTransitionStatus from '@hooks/useScreenWrapperTransitionStatus'; import useThemeStyles from '@hooks/useThemeStyles'; import {navigateToAndOpenReport, searchInServer, setGroupDraft} from '@libs/actions/Report'; import {canUseTouchScreen} from '@libs/DeviceCapabilities'; @@ -50,7 +50,7 @@ function useOptions() { const [betas] = useOnyx(ONYXKEYS.BETAS); const [newGroupDraft] = useOnyx(ONYXKEYS.NEW_GROUP_CHAT_DRAFT); const personalData = useCurrentUserPersonalDetails(); - const {didScreenTransitionEnd} = useScreenWrapperTranstionStatus(); + const {didScreenTransitionEnd} = useScreenWrapperTransitionStatus(); const {options: listOptions, areOptionsInitialized} = useOptionsList({ shouldInitialize: didScreenTransitionEnd, }); diff --git a/src/pages/ProfilePage.tsx b/src/pages/ProfilePage.tsx index ce05adb791bd..eb4696762080 100755 --- a/src/pages/ProfilePage.tsx +++ b/src/pages/ProfilePage.tsx @@ -196,7 +196,7 @@ function ProfilePage({route}: ProfilePageProps) { source={details?.avatar} avatarID={accountID} type={CONST.ICON_TYPE_AVATAR} - size={CONST.AVATAR_SIZE.XLARGE} + size={CONST.AVATAR_SIZE.X_LARGE} fallbackIcon={fallbackIcon} /> diff --git a/src/pages/ReportDetailsPage.tsx b/src/pages/ReportDetailsPage.tsx index 2c2098d9686e..c28d61577ce5 100644 --- a/src/pages/ReportDetailsPage.tsx +++ b/src/pages/ReportDetailsPage.tsx @@ -749,7 +749,7 @@ function ReportDetailsPage({policies, report, route, reportMetadata}: ReportDeta source={icons.at(0)?.source} avatarID={icons.at(0)?.id} isUsingDefaultAvatar={!report.avatarUrl} - size={CONST.AVATAR_SIZE.XLARGE} + size={CONST.AVATAR_SIZE.X_LARGE} avatarStyle={styles.avatarXLarge} onViewPhotoPress={() => Navigation.navigate(ROUTES.REPORT_AVATAR.getRoute(report.reportID))} onImageRemoved={() => { diff --git a/src/pages/ReportParticipantDetailsPage.tsx b/src/pages/ReportParticipantDetailsPage.tsx index bfc4506818d1..4c27b1a62742 100644 --- a/src/pages/ReportParticipantDetailsPage.tsx +++ b/src/pages/ReportParticipantDetailsPage.tsx @@ -82,7 +82,7 @@ function ReportParticipantDetails({report, route}: ReportParticipantDetailsPageP source={details.avatar} avatarID={accountID} type={CONST.ICON_TYPE_AVATAR} - size={CONST.AVATAR_SIZE.XLARGE} + size={CONST.AVATAR_SIZE.X_LARGE} fallbackIcon={fallbackIcon} /> {!!(displayName ?? '') && ( diff --git a/src/pages/RoomMemberDetailsPage.tsx b/src/pages/RoomMemberDetailsPage.tsx index e10dd09b206a..13b68ec67cf6 100644 --- a/src/pages/RoomMemberDetailsPage.tsx +++ b/src/pages/RoomMemberDetailsPage.tsx @@ -80,7 +80,7 @@ function RoomMemberDetailsPage({report, route}: RoomMemberDetailsPagePageProps) source={details.avatar} avatarID={accountID} type={CONST.ICON_TYPE_AVATAR} - size={CONST.AVATAR_SIZE.XLARGE} + size={CONST.AVATAR_SIZE.X_LARGE} fallbackIcon={fallbackIcon} /> {!!(details.displayName ?? '') && ( diff --git a/src/pages/Share/ShareTab.tsx b/src/pages/Share/ShareTab.tsx index 447500cfe797..08c4b4fe5e8c 100644 --- a/src/pages/Share/ShareTab.tsx +++ b/src/pages/Share/ShareTab.tsx @@ -57,7 +57,7 @@ function ShareTab() { const filteredOptions = filterOptions(textInputValue); const orderedOptions = combineOrderingOfReportsAndPersonalDetails(filteredOptions, textInputValue, { sortByReportTypeInSearch: true, - preferChatroomsOverThreads: true, + preferChatRoomsOverThreads: true, }); const reportOptions: OptionData[] = [...orderedOptions.recentReports, ...orderedOptions.personalDetails]; diff --git a/src/pages/home/report/ContextMenu/PopoverReportActionContextMenu.tsx b/src/pages/home/report/ContextMenu/PopoverReportActionContextMenu.tsx index 46d1912558b8..b450a597ac3b 100644 --- a/src/pages/home/report/ContextMenu/PopoverReportActionContextMenu.tsx +++ b/src/pages/home/report/ContextMenu/PopoverReportActionContextMenu.tsx @@ -65,7 +65,7 @@ function PopoverReportActionContextMenu(_props: unknown, ref: ForwardedRef([]); - const [shoudSwitchPositionIfOverflow, setShoudSwitchPositionIfOverflow] = useState(false); + const [shouldSwitchPositionIfOverflow, setShoudSwitchPositionIfOverflow] = useState(false); const contentRef = useRef(null); const anchorRef = useRef(null); @@ -340,7 +340,7 @@ function PopoverReportActionContextMenu(_props: unknown, ref: ForwardedRef ) => value?.[EXIT_SURVEY_REASON_INPUT_IDS.REASON] ?? null}); const shouldShowQuickTips = isEmptyObject(tryNewDot) || tryNewDot?.classicRedirect?.dismissed === true || (!isEmptyObject(tryNewDot) && tryNewDot?.classicRedirect?.dismissed === undefined); diff --git a/src/pages/settings/InitialSettingsPage.tsx b/src/pages/settings/InitialSettingsPage.tsx index 954f14370a6d..d92d553b636b 100755 --- a/src/pages/settings/InitialSettingsPage.tsx +++ b/src/pages/settings/InitialSettingsPage.tsx @@ -90,7 +90,7 @@ function InitialSettingsPage({currentUserPersonalDetails}: InitialSettingsPagePr const [loginList] = useOnyx(ONYXKEYS.LOGIN_LIST); const [policies] = useOnyx(ONYXKEYS.COLLECTION.POLICY); const [privatePersonalDetails] = useOnyx(ONYXKEYS.PRIVATE_PERSONAL_DETAILS); - const [tryNewDot] = useOnyx(ONYXKEYS.NVP_TRYNEWDOT); + const [tryNewDot] = useOnyx(ONYXKEYS.NVP_TRY_NEW_DOT); const [allCards] = useOnyx(`${ONYXKEYS.CARD_LIST}`); const {shouldUseNarrowLayout} = useResponsiveLayout(); diff --git a/src/pages/settings/Profile/ProfilePage.tsx b/src/pages/settings/Profile/ProfilePage.tsx index d83bef20e5cf..e57fc99d5711 100755 --- a/src/pages/settings/Profile/ProfilePage.tsx +++ b/src/pages/settings/Profile/ProfilePage.tsx @@ -175,7 +175,7 @@ function ProfilePage() { > {isEmptyObject(currentUserPersonalDetails) || accountID === -1 || !avatarURL ? ( - + ) : ( diff --git a/src/styles/index.ts b/src/styles/index.ts index d9e335b30b10..671b94205aff 100644 --- a/src/styles/index.ts +++ b/src/styles/index.ts @@ -505,7 +505,7 @@ const styles = (theme: ThemeColors) => ...headlineFont, ...whiteSpace.preWrap, color: theme.heading, - fontSize: variables.fontSizeh2, + fontSize: variables.fontSizeH2, lineHeight: variables.lineHeightSizeh2, }, @@ -1808,7 +1808,7 @@ const styles = (theme: ThemeColors) => ...headlineFont, }, - breadcrumsContainer: { + breadcrumbsContainer: { minHeight: 24, }, @@ -2714,7 +2714,7 @@ const styles = (theme: ThemeColors) => searchResultsHeaderBar: { display: 'flex', height: variables.contentHeaderDesktopHeight, - zIndex: variables.popoverzIndex, + zIndex: variables.popoverZIndex, position: 'relative', paddingLeft: 20, paddingRight: 12, @@ -3396,7 +3396,7 @@ const styles = (theme: ThemeColors) => moneyRequestConfirmationAmount: { ...headlineFont, - fontSize: variables.fontSizeh1, + fontSize: variables.fontSizeH1, }, moneyRequestMenuItem: { diff --git a/src/styles/utils/generators/ModalStyleUtils.ts b/src/styles/utils/generators/ModalStyleUtils.ts index 059756be4f68..e9a685196518 100644 --- a/src/styles/utils/generators/ModalStyleUtils.ts +++ b/src/styles/utils/generators/ModalStyleUtils.ts @@ -122,7 +122,7 @@ const createModalStyleUtils: StyleUtilGenerator = ({the shouldAddTopSafeAreaPadding = isSmallScreenWidth; shouldAddBottomSafeAreaPadding = false; break; - case CONST.MODAL.MODAL_TYPE.CENTERED_SWIPABLE_TO_RIGHT: + case CONST.MODAL.MODAL_TYPE.CENTERED_SWIPEABLE_TO_RIGHT: // A centered modal is one that has a visible backdrop // and can be dismissed by clicking outside of the modal. // This modal should take up the entire visible area when diff --git a/src/styles/utils/index.ts b/src/styles/utils/index.ts index 57080ac041c9..75776d638a79 100644 --- a/src/styles/utils/index.ts +++ b/src/styles/utils/index.ts @@ -98,7 +98,7 @@ const avatarBorderSizes: Partial> = { [CONST.AVATAR_SIZE.DEFAULT]: variables.componentBorderRadiusNormal, [CONST.AVATAR_SIZE.MEDIUM]: variables.componentBorderRadiusLarge, [CONST.AVATAR_SIZE.LARGE]: variables.componentBorderRadiusLarge, - [CONST.AVATAR_SIZE.XLARGE]: variables.componentBorderRadiusLarge, + [CONST.AVATAR_SIZE.X_LARGE]: variables.componentBorderRadiusLarge, [CONST.AVATAR_SIZE.LARGE_BORDERED]: variables.componentBorderRadiusRounded, [CONST.AVATAR_SIZE.SMALL_NORMAL]: variables.componentBorderRadiusMedium, }; @@ -111,7 +111,7 @@ const avatarSizes: Record = { [CONST.AVATAR_SIZE.SMALL]: variables.avatarSizeSmall, [CONST.AVATAR_SIZE.SMALLER]: variables.avatarSizeSmaller, [CONST.AVATAR_SIZE.LARGE]: variables.avatarSizeLarge, - [CONST.AVATAR_SIZE.XLARGE]: variables.avatarSizeXLarge, + [CONST.AVATAR_SIZE.X_LARGE]: variables.avatarSizeXLarge, [CONST.AVATAR_SIZE.MEDIUM]: variables.avatarSizeMedium, [CONST.AVATAR_SIZE.LARGE_BORDERED]: variables.avatarSizeLargeBordered, [CONST.AVATAR_SIZE.HEADER]: variables.avatarSizeHeader, @@ -139,7 +139,7 @@ const avatarBorderWidths: Partial> = { [CONST.AVATAR_SIZE.SMALL]: 2, [CONST.AVATAR_SIZE.SMALLER]: 2, [CONST.AVATAR_SIZE.LARGE]: 4, - [CONST.AVATAR_SIZE.XLARGE]: 4, + [CONST.AVATAR_SIZE.X_LARGE]: 4, [CONST.AVATAR_SIZE.MEDIUM]: 3, [CONST.AVATAR_SIZE.LARGE_BORDERED]: 4, }; diff --git a/src/styles/variables.ts b/src/styles/variables.ts index f30205afa64a..31afbcd7351d 100644 --- a/src/styles/variables.ts +++ b/src/styles/variables.ts @@ -57,8 +57,8 @@ export default { fontSizeLarge: getValueUsingPixelRatio(17, 19), fontSizeHero: 36, fontSizeHeroXL: 72, - fontSizeh1: 19, - fontSizeh2: 19, + fontSizeH1: 19, + fontSizeH2: 19, fontSizeXLarge: 22, fontSizeXXLarge: 28, fontSizeXXXLarge: getValueUsingPixelRatio(32, 37), @@ -208,7 +208,7 @@ export default { reportActionImagesDoubleImageHeight: 138, reportActionImagesMultipleImageHeight: 110, reportActionItemImagesMoreCornerTriangleWidth: 40, - popoverzIndex: 10000, + popoverZIndex: 10000, workspaceTypeIconWidth: 34, sectionMargin: 16, workspaceSectionMaxWidth: 680, diff --git a/src/types/onyx/DismissedProductTraining.ts b/src/types/onyx/DismissedProductTraining.ts index 0c224fae8547..c158f50f163c 100644 --- a/src/types/onyx/DismissedProductTraining.ts +++ b/src/types/onyx/DismissedProductTraining.ts @@ -1,7 +1,7 @@ import CONST from '@src/CONST'; const { - CONCEIRGE_LHN_GBR, + CONCIERGE_LHN_GBR, RENAME_SAVED_SEARCH, BOTTOM_NAV_INBOX_TOOLTIP, LHN_WORKSPACE_CHAT_TOOLTIP, @@ -30,12 +30,12 @@ type DismissedProductTraining = { */ [CONST.MIGRATED_USER_WELCOME_MODAL]: DismissedProductTrainingElement; - // TODO: CONCEIRGE_LHN_GBR tooltip will be replaced by a tooltip in the #admins room + // TODO: CONCIERGE_LHN_GBR tooltip will be replaced by a tooltip in the #admins room // https://github.com/Expensify/App/issues/57045#issuecomment-2701455668 /** * When user dismisses the conciergeLHNGBR product training tooltip, we store the timestamp here. */ - [CONCEIRGE_LHN_GBR]: DismissedProductTrainingElement; + [CONCIERGE_LHN_GBR]: DismissedProductTrainingElement; /** * When user dismisses the renameSavedSearch product training tooltip, we store the timestamp here. diff --git a/tests/ui/SwitchToExpensifyClassicTest.tsx b/tests/ui/SwitchToExpensifyClassicTest.tsx index 4d64b44218c7..e107ef4334db 100644 --- a/tests/ui/SwitchToExpensifyClassicTest.tsx +++ b/tests/ui/SwitchToExpensifyClassicTest.tsx @@ -52,7 +52,7 @@ function signInAppAndEnterTestFlow(dismissedValue?: boolean): Promise { await act(async () => { await TestHelper.signInWithTestUser(USER_A_ACCOUNT_ID, USER_A_EMAIL, undefined, undefined, 'A'); }); - await Onyx.set(ONYXKEYS.NVP_TRYNEWDOT, { + await Onyx.set(ONYXKEYS.NVP_TRY_NEW_DOT, { classicRedirect: { dismissed: dismissedValue, }, diff --git a/tests/ui/components/ProductTrainingContextProvider.tsx b/tests/ui/components/ProductTrainingContextProvider.tsx index 2dbd7300b552..4705601db40b 100644 --- a/tests/ui/components/ProductTrainingContextProvider.tsx +++ b/tests/ui/components/ProductTrainingContextProvider.tsx @@ -174,7 +174,7 @@ describe('ProductTrainingContextProvider', () => { it('should not show tooltips for migrated users before welcome modal dismissal', async () => { // When user is a migrated user and welcome modal is not dismissed Onyx.merge(ONYXKEYS.NVP_ONBOARDING, {hasCompletedGuidedSetupFlow: true}); - Onyx.merge(ONYXKEYS.NVP_TRYNEWDOT, {nudgeMigration: {timestamp: new Date()}}); + Onyx.merge(ONYXKEYS.NVP_TRY_NEW_DOT, {nudgeMigration: {timestamp: new Date()}}); await waitForBatchedUpdatesWithAct(); // Then tooltips should not show @@ -188,7 +188,7 @@ describe('ProductTrainingContextProvider', () => { it('should show tooltips for migrated users after welcome modal dismissal', async () => { // When migrated user has dismissed welcome modal Onyx.merge(ONYXKEYS.NVP_ONBOARDING, {hasCompletedGuidedSetupFlow: true}); - Onyx.merge(ONYXKEYS.NVP_TRYNEWDOT, {nudgeMigration: {timestamp: new Date()}}); + Onyx.merge(ONYXKEYS.NVP_TRY_NEW_DOT, {nudgeMigration: {timestamp: new Date()}}); const date = new Date(); Onyx.set(ONYXKEYS.NVP_DISMISSED_PRODUCT_TRAINING, { migratedUserWelcomeModal: { @@ -229,7 +229,7 @@ describe('ProductTrainingContextProvider', () => { it('should hide tooltip when hideProductTrainingTooltip is called', async () => { // When migrated user has dismissed welcome modal Onyx.merge(ONYXKEYS.NVP_ONBOARDING, {hasCompletedGuidedSetupFlow: true}); - Onyx.merge(ONYXKEYS.NVP_TRYNEWDOT, {nudgeMigration: {timestamp: new Date()}}); + Onyx.merge(ONYXKEYS.NVP_TRY_NEW_DOT, {nudgeMigration: {timestamp: new Date()}}); const date = new Date(); Onyx.set(ONYXKEYS.NVP_DISMISSED_PRODUCT_TRAINING, { migratedUserWelcomeModal: { @@ -268,7 +268,7 @@ describe('ProductTrainingContextProvider', () => { await waitForBatchedUpdatesWithAct(); // TODO: To be replaced by expense reports search tooltip - const testTooltip = CONST.PRODUCT_TRAINING_TOOLTIP_NAMES.CONCEIRGE_LHN_GBR; + const testTooltip = CONST.PRODUCT_TRAINING_TOOLTIP_NAMES.CONCIERGE_LHN_GBR; const {result, rerender} = renderHook(() => useProductTrainingContext(testTooltip), {wrapper}); // Then narrow layout tooltip should not show expect(result.current.shouldShowProductTrainingTooltip).toBe(false);