add lint changes

.github/actions/javascript/authorChecklist/categories/index.ts

@@ -1,4 +1,4 @@
-import Category from './Category';
+import type Category from './Category';
 import newComponent from './newComponentCategory';
 
 const categories: Category[] = [newComponent];

.github/actions/javascript/authorChecklist/categories/newComponentCategory.ts

@@ -4,7 +4,7 @@ import traverse from '@babel/traverse';
 import CONST from '../../../../libs/CONST';
 import GithubUtils from '../../../../libs/GithubUtils';
 import promiseSome from '../../../../libs/promiseSome';
-import Category from './Category';
+import type Category from './Category';
 
 type SuperClassType = {superClass: {name?: string; object: {name: string}; property: {name: string}} | null; name: string};
 

assets/emojis/common.ts

@@ -7,7 +7,7 @@ import TravelAndPlaces from '@assets/images/emojiCategoryIcons/plane.svg';
 import AnimalsAndNature from '@assets/images/emojiCategoryIcons/plant.svg';
 import Activities from '@assets/images/emojiCategoryIcons/soccer-ball.svg';
 import FrequentlyUsed from '@assets/images/history.svg';
-import {HeaderEmoji, PickerEmojis} from './types';
+import type {HeaderEmoji, PickerEmojis} from './types';
 
 const skinTones = [
     {

assets/emojis/en.ts

@@ -1,4 +1,4 @@
-import {EmojisList} from './types';
+import type {EmojisList} from './types';
 
 /* eslint-disable @typescript-eslint/naming-convention */
 const enEmojis: EmojisList = {

assets/emojis/es.ts

@@ -1,4 +1,4 @@
-import {EmojisList} from './types';
+import type {EmojisList} from './types';
 
 /* eslint-disable @typescript-eslint/naming-convention */
 const esEmojis: EmojisList = {

assets/emojis/index.ts

@@ -1,7 +1,7 @@
 import emojis from './common';
 import enEmojis from './en';
 import esEmojis from './es';
-import {Emoji} from './types';
+import type {Emoji} from './types';
 
 type EmojiTable = Record<string, Emoji>;
 

assets/emojis/types.ts

@@ -1,4 +1,4 @@
-import IconAsset from '@src/types/utils/IconAsset';
+import type IconAsset from '@src/types/utils/IconAsset';
 
 type Emoji = {
     code: string;

src/CONFIG.ts

@@ -1,5 +1,6 @@
 import {Platform} from 'react-native';
-import Config, {NativeConfig} from 'react-native-config';
+import type {NativeConfig} from 'react-native-config';
+import Config from 'react-native-config';
 import CONST from './CONST';
 import getPlatform from './libs/getPlatform';
 import * as Url from './libs/Url';

src/ONYXKEYS.ts

@@ -1,8 +1,8 @@
-import {OnyxEntry} from 'react-native-onyx/lib/types';
-import {ValueOf} from 'type-fest';
-import CONST from './CONST';
-import * as OnyxTypes from './types/onyx';
-import DeepValueOf from './types/utils/DeepValueOf';
+import type {OnyxEntry} from 'react-native-onyx/lib/types';
+import type {ValueOf} from 'type-fest';
+import type CONST from './CONST';
+import type * as OnyxTypes from './types/onyx';
+import type DeepValueOf from './types/utils/DeepValueOf';
 
 /**
  * This is a file containing constants for all the top level keys in our store

src/ROUTES.ts

@@ -1,5 +1,5 @@
-import {IsEqual, ValueOf} from 'type-fest';
-import CONST from './CONST';
+import type {IsEqual, ValueOf} from 'type-fest';
+import type CONST from './CONST';
 
 // This is a file containing constants for all the routes we want to be able to go to
 

src/SCREENS.ts

@@ -2,7 +2,7 @@
  * This is a file containing constants for all of the screen names. In most cases, we should use the routes for
  * navigation. But there are situations where we may need to access screen names directly.
  */
-import DeepValueOf from './types/utils/DeepValueOf';
+import type DeepValueOf from './types/utils/DeepValueOf';
 
 const PROTECTED_SCREENS = {
     HOME: 'Home',

src/components/AnchorForCommentsOnly/BaseAnchorForCommentsOnly.tsx

@@ -1,6 +1,7 @@
 import Str from 'expensify-common/lib/str';
 import React, {useEffect, useRef} from 'react';
-import {Text as RNText, StyleSheet} from 'react-native';
+import type {Text as RNText} from 'react-native';
+import { StyleSheet} from 'react-native';
 import PressableWithSecondaryInteraction from '@components/PressableWithSecondaryInteraction';
 import Text from '@components/Text';
 import Tooltip from '@components/Tooltip';

src/components/AnchorForCommentsOnly/types.ts

@@ -1,5 +1,5 @@
-import {StyleProp, TextStyle} from 'react-native';
-import ChildrenProps from '@src/types/utils/ChildrenProps';
+import type {StyleProp, TextStyle} from 'react-native';
+import type ChildrenProps from '@src/types/utils/ChildrenProps';
 
 type AnchorForCommentsOnlyProps = ChildrenProps & {
     /** The URL to open */

src/components/AnimatedStep/AnimatedStepContext.ts

@@ -1,6 +1,7 @@
-import React, {createContext} from 'react';
-import {ValueOf} from 'type-fest';
-import CONST from '@src/CONST';
+import type React from 'react';
+import {createContext} from 'react';
+import type {ValueOf} from 'type-fest';
+import type CONST from '@src/CONST';
 
 type AnimationDirection = ValueOf<typeof CONST.ANIMATION_DIRECTION>;
 

src/components/AnimatedStep/AnimatedStepProvider.tsx

@@ -1,7 +1,8 @@
 import React, {useMemo, useState} from 'react';
 import CONST from '@src/CONST';
-import ChildrenProps from '@src/types/utils/ChildrenProps';
-import AnimatedStepContext, {AnimationDirection} from './AnimatedStepContext';
+import type ChildrenProps from '@src/types/utils/ChildrenProps';
+import type {AnimationDirection} from './AnimatedStepContext';
+import AnimatedStepContext from './AnimatedStepContext';
 
 function AnimatedStepProvider({children}: ChildrenProps): React.ReactNode {
     const [animationDirection, setAnimationDirection] = useState<AnimationDirection>(CONST.ANIMATION_DIRECTION.IN);

src/components/AnimatedStep/index.tsx

@@ -1,11 +1,11 @@
 import React, {useMemo} from 'react';
-import {StyleProp, ViewStyle} from 'react-native';
+import type {StyleProp, ViewStyle} from 'react-native';
 import * as Animatable from 'react-native-animatable';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useNativeDriver from '@libs/useNativeDriver';
 import CONST from '@src/CONST';
-import ChildrenProps from '@src/types/utils/ChildrenProps';
-import {AnimationDirection} from './AnimatedStepContext';
+import type ChildrenProps from '@src/types/utils/ChildrenProps';
+import type {AnimationDirection} from './AnimatedStepContext';
 
 type AnimatedStepProps = ChildrenProps & {
     /** Styles to be assigned to Container */

src/components/AnimatedStep/useAnimatedStepContext.ts

@@ -1,5 +1,6 @@
 import {useContext} from 'react';
-import AnimatedStepContext, {StepContext} from './AnimatedStepContext';
+import type {StepContext} from './AnimatedStepContext';
+import AnimatedStepContext from './AnimatedStepContext';
 
 function useAnimatedStepContext(): StepContext {
     const context = useContext(AnimatedStepContext);

src/components/AnonymousReportFooter.tsx

@@ -1,11 +1,11 @@
 import React from 'react';
 import {Text, View} from 'react-native';
-import {OnyxCollection} from 'react-native-onyx';
-import {OnyxEntry} from 'react-native-onyx/lib/types';
+import type {OnyxCollection} from 'react-native-onyx';
+import type {OnyxEntry} from 'react-native-onyx/lib/types';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import * as Session from '@userActions/Session';
-import {PersonalDetails, Report} from '@src/types/onyx';
+import type {PersonalDetails, Report} from '@src/types/onyx';
 import AvatarWithDisplayName from './AvatarWithDisplayName';
 import Button from './Button';
 import ExpensifyWordmark from './ExpensifyWordmark';

src/components/ArchivedReportFooter.tsx

@@ -1,6 +1,7 @@
 import lodashEscape from 'lodash/escape';
 import React from 'react';
-import {OnyxEntry, withOnyx} from 'react-native-onyx';
+import type {OnyxEntry} from 'react-native-onyx';
+import { withOnyx} from 'react-native-onyx';
 import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import * as PersonalDetailsUtils from '@libs/PersonalDetailsUtils';

src/components/AutoCompleteSuggestions/BaseAutoCompleteSuggestions.tsx

@@ -1,6 +1,7 @@
 import {FlashList} from '@shopify/flash-list';
-import React, {ForwardedRef, forwardRef, ReactElement, useCallback, useEffect, useMemo, useRef} from 'react';
-import {View} from 'react-native';
+import type {ForwardedRef, ReactElement} from 'react';
+import React, { forwardRef, useCallback, useEffect, useMemo, useRef} from 'react';
+import type {View} from 'react-native';
 // We take ScrollView from this package to properly handle the scrolling of AutoCompleteSuggestions in chats since one scroll is nested inside another
 import {ScrollView} from 'react-native-gesture-handler';
 import Animated, {Easing, FadeOutDown, useAnimatedStyle, useSharedValue, withTiming} from 'react-native-reanimated';

src/components/AutoCompleteSuggestions/types.ts

@@ -1,4 +1,4 @@
-import {ReactElement} from 'react';
+import type {ReactElement} from 'react';
 
 type MeasureParentContainerCallback = (x: number, y: number, width: number) => void;
 

src/components/AutoUpdateTime.tsx

@@ -6,9 +6,10 @@ import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react';
 import {View} from 'react-native';
 import useThemeStyles from '@hooks/useThemeStyles';
 import DateUtils from '@libs/DateUtils';
-import {Timezone} from '@src/types/onyx/PersonalDetails';
+import type {Timezone} from '@src/types/onyx/PersonalDetails';
 import Text from './Text';
-import withLocalize, {WithLocalizeProps} from './withLocalize';
+import type {WithLocalizeProps} from './withLocalize';
+import withLocalize from './withLocalize';
 
 type AutoUpdateTimeProps = WithLocalizeProps & {
     /** Timezone of the user from their personal details */

src/components/Avatar.tsx

@@ -1,14 +1,15 @@
 import React, {useEffect, useState} from 'react';
-import {StyleProp, View, ViewStyle} from 'react-native';
+import type {StyleProp, ViewStyle} from 'react-native';
+import { View} from 'react-native';
 import useNetwork from '@hooks/useNetwork';
 import useStyleUtils from '@hooks/useStyleUtils';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import * as ReportUtils from '@libs/ReportUtils';
-import {AvatarSource} from '@libs/UserUtils';
+import type {AvatarSource} from '@libs/UserUtils';
 import type {AvatarSizeName} from '@styles/utils';
 import CONST from '@src/CONST';
-import {AvatarType} from '@src/types/onyx/OnyxCommon';
+import type {AvatarType} from '@src/types/onyx/OnyxCommon';
 import Icon from './Icon';
 import * as Expensicons from './Icon/Expensicons';
 import Image from './Image';

src/components/AvatarWithDisplayName.tsx

@@ -1,7 +1,8 @@
 import React, {useCallback, useEffect, useRef} from 'react';
 import {View} from 'react-native';
-import {OnyxCollection, OnyxEntry, withOnyx} from 'react-native-onyx';
-import {ValueOf} from 'type-fest';
+import type {OnyxCollection, OnyxEntry} from 'react-native-onyx';
+import { withOnyx} from 'react-native-onyx';
+import type {ValueOf} from 'type-fest';
 import useStyleUtils from '@hooks/useStyleUtils';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
@@ -11,7 +12,7 @@ import * as ReportUtils from '@libs/ReportUtils';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
-import {PersonalDetails, Policy, Report, ReportActions} from '@src/types/onyx';
+import type {PersonalDetails, Policy, Report, ReportActions} from '@src/types/onyx';
 import DisplayNames from './DisplayNames';
 import MultipleAvatars from './MultipleAvatars';
 import ParentNavigationSubtitle from './ParentNavigationSubtitle';

src/components/Badge.tsx

@@ -1,5 +1,6 @@
 import React, {useCallback} from 'react';
-import {GestureResponderEvent, PressableStateCallbackType, StyleProp, TextStyle, View, ViewStyle} from 'react-native';
+import type {GestureResponderEvent, PressableStateCallbackType, StyleProp, TextStyle, ViewStyle} from 'react-native';
+import { View} from 'react-native';
 import useStyleUtils from '@hooks/useStyleUtils';
 import useThemeStyles from '@hooks/useThemeStyles';
 import CONST from '@src/CONST';

src/components/Banner.tsx

@@ -1,5 +1,6 @@
 import React, {memo} from 'react';
-import {StyleProp, TextStyle, View, ViewStyle} from 'react-native';
+import type {StyleProp, TextStyle, ViewStyle} from 'react-native';
+import { View} from 'react-native';
 import useLocalize from '@hooks/useLocalize';
 import useStyleUtils from '@hooks/useStyleUtils';
 import useTheme from '@hooks/useTheme';

src/components/BaseMiniContextMenuItem.tsx

@@ -1,5 +1,7 @@
-import React, {ForwardedRef} from 'react';
-import {PressableStateCallbackType, View} from 'react-native';
+import type {ForwardedRef} from 'react';
+import React from 'react';
+import type {PressableStateCallbackType} from 'react-native';
+import { View} from 'react-native';
 import useStyleUtils from '@hooks/useStyleUtils';
 import useThemeStyles from '@hooks/useThemeStyles';
 import DomUtils from '@libs/DomUtils';

src/components/BlockingViews/BlockingView.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
-import {ImageSourcePropType, View} from 'react-native';
-import {SvgProps} from 'react-native-svg';
+import type {ImageSourcePropType} from 'react-native';
+import { View} from 'react-native';
+import type {SvgProps} from 'react-native-svg';
 import AutoEmailLink from '@components/AutoEmailLink';
 import Icon from '@components/Icon';
 import Text from '@components/Text';
@@ -9,7 +10,7 @@ import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@libs/Navigation/Navigation';
 import variables from '@styles/variables';
-import {TranslationPaths} from '@src/languages/types';
+import type {TranslationPaths} from '@src/languages/types';
 
 type BlockingViewProps = {
     /** Expensicon for the page */

src/components/BlockingViews/FullPageNotFoundView.tsx

@@ -6,7 +6,7 @@ import useLocalize from '@hooks/useLocalize';
 import useThemeStyles from '@hooks/useThemeStyles';
 import Navigation from '@libs/Navigation/Navigation';
 import variables from '@styles/variables';
-import {TranslationPaths} from '@src/languages/types';
+import type {TranslationPaths} from '@src/languages/types';
 import ROUTES from '@src/ROUTES';
 import BlockingView from './BlockingView';
 

src/components/BlockingViews/FullPageOfflineBlockingView.tsx

@@ -3,7 +3,7 @@ import * as Expensicons from '@components/Icon/Expensicons';
 import useLocalize from '@hooks/useLocalize';
 import useNetwork from '@hooks/useNetwork';
 import useTheme from '@hooks/useTheme';
-import ChildrenProps from '@src/types/utils/ChildrenProps';
+import type ChildrenProps from '@src/types/utils/ChildrenProps';
 import BlockingView from './BlockingView';
 
 function FullPageOfflineBlockingView({children}: ChildrenProps) {

src/components/Breadcrumbs.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
-import {StyleProp, View, ViewStyle} from 'react-native';
+import type {StyleProp, ViewStyle} from 'react-native';
+import { View} from 'react-native';
 import LogoComponent from '@assets/images/expensify-wordmark.svg';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';

src/components/Button/index.tsx

@@ -1,6 +1,8 @@
 import {useIsFocused} from '@react-navigation/native';
-import React, {ForwardedRef, useCallback} from 'react';
-import {ActivityIndicator, GestureResponderEvent, StyleProp, TextStyle, View, ViewStyle} from 'react-native';
+import type {ForwardedRef} from 'react';
+import React, { useCallback} from 'react';
+import type { GestureResponderEvent, StyleProp, TextStyle, ViewStyle} from 'react-native';
+import {ActivityIndicator, View} from 'react-native';
 import Icon from '@components/Icon';
 import * as Expensicons from '@components/Icon/Expensicons';
 import PressableWithFeedback from '@components/Pressable/PressableWithFeedback';
@@ -12,8 +14,8 @@ import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import HapticFeedback from '@libs/HapticFeedback';
 import CONST from '@src/CONST';
-import ChildrenProps from '@src/types/utils/ChildrenProps';
-import IconAsset from '@src/types/utils/IconAsset';
+import type ChildrenProps from '@src/types/utils/ChildrenProps';
+import type IconAsset from '@src/types/utils/IconAsset';
 import validateSubmitShortcut from './validateSubmitShortcut';
 
 type ButtonWithText = {

src/components/Button/validateSubmitShortcut/index.native.ts

@@ -1,4 +1,4 @@
-import ValidateSubmitShortcut from './types';
+import type ValidateSubmitShortcut from './types';
 
 /**
  * Validate if the submit shortcut should be triggered depending on the button state

src/components/Button/validateSubmitShortcut/index.ts

@@ -1,4 +1,4 @@
-import ValidateSubmitShortcut from './types';
+import type ValidateSubmitShortcut from './types';
 
 /**
  * Validate if the submit shortcut should be triggered depending on the button state

src/components/Button/validateSubmitShortcut/types.ts

@@ -1,4 +1,4 @@
-import {GestureResponderEvent} from 'react-native';
+import type {GestureResponderEvent} from 'react-native';
 
 type ValidateSubmitShortcut = (isFocused: boolean, isDisabled: boolean, isLoading: boolean, event?: GestureResponderEvent | KeyboardEvent) => boolean;
 

src/components/CardPreview.tsx

@@ -1,12 +1,13 @@
 import React from 'react';
 import {View} from 'react-native';
-import {OnyxEntry, withOnyx} from 'react-native-onyx';
+import type {OnyxEntry} from 'react-native-onyx';
+import { withOnyx} from 'react-native-onyx';
 import ExpensifyCardImage from '@assets/images/expensify-card.svg';
 import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails';
 import useThemeStyles from '@hooks/useThemeStyles';
 import variables from '@styles/variables';
 import ONYXKEYS from '@src/ONYXKEYS';
-import {PrivatePersonalDetails, Session} from '@src/types/onyx';
+import type {PrivatePersonalDetails, Session} from '@src/types/onyx';
 import ImageSVG from './ImageSVG';
 import Text from './Text';
 

src/components/Checkbox.tsx

@@ -1,10 +1,12 @@
-import React, {type ForwardedRef, forwardRef, type MouseEventHandler, type KeyboardEvent as ReactKeyboardEvent} from 'react';
-import {GestureResponderEvent, StyleProp, View, ViewStyle} from 'react-native';
+import React, { forwardRef  } from 'react';
+import type {ForwardedRef, MouseEventHandler, KeyboardEvent as ReactKeyboardEvent} from 'react';
+import type {GestureResponderEvent, StyleProp, ViewStyle} from 'react-native';
+import { View} from 'react-native';
 import useStyleUtils from '@hooks/useStyleUtils';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import CONST from '@src/CONST';
-import ChildrenProps from '@src/types/utils/ChildrenProps';
+import type ChildrenProps from '@src/types/utils/ChildrenProps';
 import Icon from './Icon';
 import * as Expensicons from './Icon/Expensicons';
 import PressableWithFeedback from './Pressable/PressableWithFeedback';

src/components/CheckboxWithLabel.tsx

@@ -1,5 +1,7 @@
-import React, {ComponentType, ForwardedRef, useState} from 'react';
-import {StyleProp, View, ViewStyle} from 'react-native';
+import type {ComponentType, ForwardedRef} from 'react';
+import React, { useState} from 'react';
+import type {StyleProp, ViewStyle} from 'react-native';
+import { View} from 'react-native';
 import useThemeStyles from '@hooks/useThemeStyles';
 import variables from '@styles/variables';
 import Checkbox from './Checkbox';