diff --git a/.github/scripts/findUnusedKeys.sh b/.github/scripts/findUnusedKeys.sh index 1411fffc8389..193149e609af 100755 --- a/.github/scripts/findUnusedKeys.sh +++ b/.github/scripts/findUnusedKeys.sh @@ -6,10 +6,11 @@ LIB_PATH="$(cd "$(dirname "${BASH_SOURCE[0]}")" && cd ../../ && pwd)" readonly SRC_DIR="${LIB_PATH}/src" readonly STYLES_DIR="${LIB_PATH}/src/styles" -readonly STYLES_FILE="${LIB_PATH}/src/styles/styles.ts" -readonly UTILITIES_STYLES_FILE="${LIB_PATH}/src/styles/utilities" +readonly STYLES_FILE="${LIB_PATH}/src/styles/index.ts" +readonly UTILS_STYLES_FILE="${LIB_PATH}/src/styles/utils" +readonly UTILS_STYLES_GENERATORS_FILE="${LIB_PATH}/src/styles/utils/generators" readonly STYLES_KEYS_FILE="${LIB_PATH}/scripts/style_keys_list_temp.txt" -readonly UTILITY_STYLES_KEYS_FILE="${LIB_PATH}/scripts/utility_keys_list_temp.txt" +readonly UTIL_STYLES_KEYS_FILE="${LIB_PATH}/scripts/util_keys_list_temp.txt" readonly REMOVAL_KEYS_FILE="${LIB_PATH}/scripts/removal_keys_list_temp.txt" readonly AMOUNT_LINES_TO_SHOW=3 @@ -29,7 +30,7 @@ ctrl_c() { delete_temp_files exit 1 } - + count_lines() { local file=$1 if [[ -e "$file" ]]; then @@ -43,11 +44,11 @@ count_lines() { show_unused_style_keywords() { while IFS=: read -r key file line_number; do title "File: $file:$line_number" - + # Get lines before and after the error line local lines_before=$((line_number - AMOUNT_LINES_TO_SHOW)) local lines_after=$((line_number + AMOUNT_LINES_TO_SHOW)) - + # Read the lines into an array local lines=() while IFS= read -r line; do @@ -84,14 +85,14 @@ lookfor_unused_keywords() { # Search for keywords starting with "styles" while IFS= read -r keyword; do - + # Remove any [ ] characters from the keyword local clean_keyword="${keyword//[\[\]]/}" # skip styles. keyword that might be used in comments if [[ "$clean_keyword" == "styles." ]]; then continue fi - + if ! remove_keyword "$clean_keyword" ; then # In case of a leaf of the styles object is being used, it means the parent objects is being used # we need to mark it as used. @@ -99,7 +100,7 @@ lookfor_unused_keywords() { # Keyword has more than two words, remove words after the second word local keyword_prefix="${clean_keyword%.*}" remove_keyword "$keyword_prefix" - fi + fi fi done < <(grep -E -o '\bstyles\.[a-zA-Z0-9_.]*' "$file" | grep -v '\/\/' | grep -vE '\/\*.*\*\/') done < <(find "${SRC_DIR}" -type f \( "${FILE_EXTENSIONS[@]}" \)) @@ -134,10 +135,10 @@ find_styles_object_and_store_keys() { if [[ ! "$line" =~ ^[[:space:]]*(const|let|var)[[:space:]]+([a-zA-Z0-9_-]+)[[:space:]]*=[[:space:]]*\{|^[[:space:]]*([a-zA-Z0-9_-]+\.)?[a-zA-Z0-9_-]+:[[:space:]]*\{|^[[:space:]]*\} ]]; then continue fi - + if [[ "$line" =~ ^[[:space:]]*(const|let|var)[[:space:]]+([a-zA-Z0-9_-]+)[[:space:]]*=[[:space:]]*\{ ]]; then key="${BASH_REMATCH[2]%%:*{*)}" - echo "styles.${key}|...${key}|${base_name}.${key}:${file}:${line_number}" >> "$STYLES_KEYS_FILE" + echo "styles.${key}|...${key}|${base_name}.${key}:${file}:${line_number}" >> "$STYLES_KEYS_FILE" fi done < "$file" } @@ -225,7 +226,7 @@ find_theme_style_and_store_keys() { continue fi - + if [[ "$line" =~ ^[[:space:]]*([a-zA-Z0-9_-]+\.)?[a-zA-Z0-9_-]+:[[:space:]]*\{|^[[:space:]]*([a-zA-Z0-9_-])+:[[:space:]]*\(.*\)[[:space:]]*'=>'[[:space:]]*\(\{ ]]; then # Removing all the extra lines after the ":" local key="${line%%:*}" @@ -295,63 +296,64 @@ lookfor_unused_spread_keywords() { done < "$STYLES_FILE" } -find_utility_styles_store_prefix() { +find_util_styles_store_prefix() { # Loop through all files in the src folder while read -r file; do # Search for keywords starting with "styles" while IFS= read -r keyword; do local variable="${keyword##*/}" local variable_trimmed="${variable// /}" # Trim spaces - - echo "$variable_trimmed" >> "$UTILITY_STYLES_KEYS_FILE" - done < <(grep -E -o './utilities/[a-zA-Z0-9_-]+' "$file" | grep -v '\/\/' | grep -vE '\/\*.*\*\/') + + echo "$variable_trimmed" >> "$UTIL_STYLES_KEYS_FILE" + done < <(grep -E -o './utils/[a-zA-Z0-9_-]+' "$file" | grep -v '\/\/' | grep -vE '\/\*.*\*\/') done < <(find "${STYLES_DIR}" -type f \( "${FILE_EXTENSIONS[@]}" \)) # Sort and remove duplicates from the temporary file - sort -u -o "${UTILITY_STYLES_KEYS_FILE}" "${UTILITY_STYLES_KEYS_FILE}" + sort -u -o "${UTIL_STYLES_KEYS_FILE}" "${UTIL_STYLES_KEYS_FILE}" } -find_utility_usage_as_styles() { +find_util_usage_as_styles() { while read -r file; do local root_key local parent_dir - # Get the folder name, given this utility files are index.js + # Get the folder name, given this util files are index.js parent_dir=$(dirname "$file") root_key=$(basename "${parent_dir}") - if [[ "${root_key}" == "utilities" ]]; then + if [[ "${root_key}" == "utils" ]]; then continue fi find_theme_style_and_store_keys "${file}" 0 "${root_key}" - done < <(find "${UTILITIES_STYLES_FILE}" -type f \( "${FILE_EXTENSIONS[@]}" \)) + done < <(find "${UTILS_STYLES_FILE}" -type f \( -path "${UTILS_STYLES_GENERATORS_FILE}" -prune -o -name "${FILE_EXTENSIONS[@]}" \) -print) + } -lookfor_unused_utilities() { - # Read each utility keyword from the file +lookfor_unused_utils() { + # Read each util keyword from the file while read -r keyword; do - # Creating a copy so later the replacement can reference it + # Creating a copy so later the replacement can reference it local original_keyword="${keyword}" # Iterate through all files in "src/styles" while read -r file; do # Find all words that match "$keyword.[a-zA-Z0-9_-]+" while IFS= read -r match; do - # Replace the utility prefix with "styles" + # Replace the util prefix with "styles" local variable="${match/#$original_keyword/styles}" # Call the remove_keyword function with the variable remove_keyword "${variable}" remove_keyword "${match}" done < <(grep -E -o "$original_keyword\.[a-zA-Z0-9_-]+" "$file" | grep -v '\/\/' | grep -vE '\/\*.*\*\/') done < <(find "${STYLES_DIR}" -type f \( "${FILE_EXTENSIONS[@]}" \)) - done < "$UTILITY_STYLES_KEYS_FILE" + done < "$UTIL_STYLES_KEYS_FILE" } echo "🔍 Looking for styles." -# Find and store the name of the utility files as keys -find_utility_styles_store_prefix -find_utility_usage_as_styles +# Find and store the name of the util files as keys +find_util_styles_store_prefix +find_util_usage_as_styles # Find and store keys from styles.ts find_styles_object_and_store_keys "$STYLES_FILE" @@ -360,8 +362,8 @@ collect_theme_keys_from_styles "$STYLES_FILE" echo "🗄️ Now going through the codebase and looking for unused keys." -# Look for usages of utilities into src/styles -lookfor_unused_utilities +# Look for usages of utils into src/styles +lookfor_unused_utils lookfor_unused_spread_keywords lookfor_unused_keywords diff --git a/.storybook/theme.js b/.storybook/theme.js index 67898fb00943..08d8b584d580 100644 --- a/.storybook/theme.js +++ b/.storybook/theme.js @@ -1,5 +1,5 @@ import {create} from '@storybook/theming'; -import colors from '../src/styles/colors'; +import colors from '../src/styles/theme/colors'; export default create({ brandTitle: 'New Expensify UI Docs', diff --git a/src/App.js b/src/App.js index e273dcce1e47..12fc6a9426e1 100644 --- a/src/App.js +++ b/src/App.js @@ -16,6 +16,9 @@ import {LocaleContextProvider} from './components/LocaleContextProvider'; import OnyxProvider from './components/OnyxProvider'; import PopoverContextProvider from './components/PopoverProvider'; import SafeArea from './components/SafeArea'; +import ThemeIllustrationsProvider from './components/ThemeIllustrationsProvider'; +import ThemeProvider from './components/ThemeProvider'; +import ThemeStylesProvider from './components/ThemeStylesProvider'; import {CurrentReportIDContextProvider} from './components/withCurrentReportID'; import {EnvironmentProvider} from './components/withEnvironment'; import {KeyboardStateProvider} from './components/withKeyboardState'; @@ -26,9 +29,6 @@ import OnyxUpdateManager from './libs/actions/OnyxUpdateManager'; import * as Session from './libs/actions/Session'; import * as Environment from './libs/Environment/Environment'; import {ReportAttachmentsProvider} from './pages/home/report/ReportAttachmentsContext'; -import ThemeIllustrationsProvider from './styles/illustrations/ThemeIllustrationsProvider'; -import ThemeProvider from './styles/themes/ThemeProvider'; -import ThemeStylesProvider from './styles/ThemeStylesProvider'; // For easier debugging and development, when we are in web we expose Onyx to the window, so you can more easily set data into Onyx if (window && Environment.isDevelopment()) { diff --git a/src/components/AddPlaidBankAccount.js b/src/components/AddPlaidBankAccount.js index 68d529c4a78d..6e3d0e2f0d68 100644 --- a/src/components/AddPlaidBankAccount.js +++ b/src/components/AddPlaidBankAccount.js @@ -6,11 +6,11 @@ import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import KeyboardShortcut from '@libs/KeyboardShortcut'; import Log from '@libs/Log'; import {plaidDataPropTypes} from '@pages/ReimbursementAccount/plaidDataPropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as App from '@userActions/App'; import * as BankAccounts from '@userActions/BankAccounts'; import CONST from '@src/CONST'; diff --git a/src/components/AddressForm.js b/src/components/AddressForm.js index 1621328d388f..68d451e5c7c8 100644 --- a/src/components/AddressForm.js +++ b/src/components/AddressForm.js @@ -5,9 +5,9 @@ import React, {useCallback} from 'react'; import {View} from 'react-native'; import _ from 'underscore'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; import * as ValidationUtils from '@libs/ValidationUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import AddressSearch from './AddressSearch'; import CountrySelector from './CountrySelector'; diff --git a/src/components/AddressSearch/CurrentLocationButton.js b/src/components/AddressSearch/CurrentLocationButton.js index 90d2c15733f1..06541565f567 100644 --- a/src/components/AddressSearch/CurrentLocationButton.js +++ b/src/components/AddressSearch/CurrentLocationButton.js @@ -5,10 +5,10 @@ import Icon from '@components/Icon'; import * as Expensicons from '@components/Icon/Expensicons'; import PressableWithFeedback from '@components/Pressable/PressableWithFeedback'; import useLocalize from '@hooks/useLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import getButtonState from '@libs/getButtonState'; -import colors from '@styles/colors'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; +import colors from '@styles/theme/colors'; const propTypes = { /** Callback that runs when location button is clicked */ diff --git a/src/components/AddressSearch/index.js b/src/components/AddressSearch/index.js index 2fed1d153947..3c764b36f3eb 100644 --- a/src/components/AddressSearch/index.js +++ b/src/components/AddressSearch/index.js @@ -10,13 +10,13 @@ import networkPropTypes from '@components/networkPropTypes'; import {withNetwork} from '@components/OnyxProvider'; import TextInput from '@components/TextInput'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as ApiUtils from '@libs/ApiUtils'; import compose from '@libs/compose'; import getCurrentPosition from '@libs/getCurrentPosition'; import * as GooglePlacesUtils from '@libs/GooglePlacesUtils'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import CONST from '@src/CONST'; import CurrentLocationButton from './CurrentLocationButton'; diff --git a/src/components/AmountTextInput.js b/src/components/AmountTextInput.js index 63e59d7eef4a..25e1ce6f05ec 100644 --- a/src/components/AmountTextInput.js +++ b/src/components/AmountTextInput.js @@ -1,7 +1,7 @@ import PropTypes from 'prop-types'; import React from 'react'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; import refPropTypes from './refPropTypes'; import TextInput from './TextInput'; diff --git a/src/components/AnchorForAttachmentsOnly/index.native.js b/src/components/AnchorForAttachmentsOnly/index.native.js index e3c7a71f2304..3277d51ec058 100644 --- a/src/components/AnchorForAttachmentsOnly/index.native.js +++ b/src/components/AnchorForAttachmentsOnly/index.native.js @@ -1,5 +1,5 @@ import React from 'react'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as anchorForAttachmentsOnlyPropTypes from './anchorForAttachmentsOnlyPropTypes'; import BaseAnchorForAttachmentsOnly from './BaseAnchorForAttachmentsOnly'; diff --git a/src/components/AnchorForCommentsOnly/BaseAnchorForCommentsOnly.js b/src/components/AnchorForCommentsOnly/BaseAnchorForCommentsOnly.js index c056f68fa16c..4d32b4427d92 100644 --- a/src/components/AnchorForCommentsOnly/BaseAnchorForCommentsOnly.js +++ b/src/components/AnchorForCommentsOnly/BaseAnchorForCommentsOnly.js @@ -7,12 +7,12 @@ import _ from 'underscore'; import PressableWithSecondaryInteraction from '@components/PressableWithSecondaryInteraction'; import Text from '@components/Text'; import Tooltip from '@components/Tooltip'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import * as ContextMenuActions from '@pages/home/report/ContextMenu/ContextMenuActions'; import * as ReportActionContextMenu from '@pages/home/report/ContextMenu/ReportActionContextMenu'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import {propTypes as anchorForCommentsOnlyPropTypes} from './anchorForCommentsOnlyPropTypes'; diff --git a/src/components/AnimatedStep/index.tsx b/src/components/AnimatedStep/index.tsx index 1a87592cba9b..e2b9952c0617 100644 --- a/src/components/AnimatedStep/index.tsx +++ b/src/components/AnimatedStep/index.tsx @@ -1,8 +1,8 @@ import React, {useMemo} from 'react'; import {StyleProp, ViewStyle} from 'react-native'; import * as Animatable from 'react-native-animatable'; +import useThemeStyles from '@hooks/useThemeStyles'; import useNativeDriver from '@libs/useNativeDriver'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ChildrenProps from '@src/types/utils/ChildrenProps'; import {AnimationDirection} from './AnimatedStepContext'; diff --git a/src/components/AnonymousReportFooter.tsx b/src/components/AnonymousReportFooter.tsx index 65dc813a829d..877ca9444661 100644 --- a/src/components/AnonymousReportFooter.tsx +++ b/src/components/AnonymousReportFooter.tsx @@ -3,7 +3,7 @@ import {Text, View} from 'react-native'; import {OnyxCollection} from 'react-native-onyx'; import {OnyxEntry} from 'react-native-onyx/lib/types'; import useLocalize from '@hooks/useLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Session from '@userActions/Session'; import {PersonalDetails, Report} from '@src/types/onyx'; import AvatarWithDisplayName from './AvatarWithDisplayName'; diff --git a/src/components/ArchivedReportFooter.tsx b/src/components/ArchivedReportFooter.tsx index 712ef6be769e..7dadd86debfe 100644 --- a/src/components/ArchivedReportFooter.tsx +++ b/src/components/ArchivedReportFooter.tsx @@ -2,10 +2,10 @@ import lodashEscape from 'lodash/escape'; import React from 'react'; import {OnyxEntry, withOnyx} from 'react-native-onyx'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as PersonalDetailsUtils from '@libs/PersonalDetailsUtils'; import * as ReportActionsUtils from '@libs/ReportActionsUtils'; import * as ReportUtils from '@libs/ReportUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import type {PersonalDetailsList, Report, ReportAction} from '@src/types/onyx'; diff --git a/src/components/AttachmentModal.js b/src/components/AttachmentModal.js index 79be536945ac..13b3b9f1e836 100755 --- a/src/components/AttachmentModal.js +++ b/src/components/AttachmentModal.js @@ -8,6 +8,9 @@ import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import addEncryptedAuthTokenToURL from '@libs/addEncryptedAuthTokenToURL'; import compose from '@libs/compose'; @@ -19,9 +22,6 @@ import * as ReportUtils from '@libs/ReportUtils'; import * as TransactionUtils from '@libs/TransactionUtils'; import useNativeDriver from '@libs/useNativeDriver'; import reportPropTypes from '@pages/reportPropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/AttachmentPicker/index.native.js b/src/components/AttachmentPicker/index.native.js index 5b955ee69dd3..59928b80c4b1 100644 --- a/src/components/AttachmentPicker/index.native.js +++ b/src/components/AttachmentPicker/index.native.js @@ -12,9 +12,9 @@ import Popover from '@components/Popover'; import useArrowKeyFocusManager from '@hooks/useArrowKeyFocusManager'; import useKeyboardShortcut from '@hooks/useKeyboardShortcut'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as FileUtils from '@libs/fileDownload/FileUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import {defaultProps as baseDefaultProps, propTypes as basePropTypes} from './attachmentPickerPropTypes'; import launchCamera from './launchCamera'; diff --git a/src/components/Attachments/AttachmentCarousel/AttachmentCarouselCellRenderer.js b/src/components/Attachments/AttachmentCarousel/AttachmentCarouselCellRenderer.js index dd2713a38b2b..f4cbffc0e1e4 100644 --- a/src/components/Attachments/AttachmentCarousel/AttachmentCarouselCellRenderer.js +++ b/src/components/Attachments/AttachmentCarousel/AttachmentCarouselCellRenderer.js @@ -1,8 +1,8 @@ import PropTypes from 'prop-types'; import React from 'react'; import {PixelRatio, View} from 'react-native'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; -import useThemeStyles from '@styles/useThemeStyles'; const propTypes = { /** Cell Container styles */ diff --git a/src/components/Attachments/AttachmentCarousel/CarouselButtons.js b/src/components/Attachments/AttachmentCarousel/CarouselButtons.js index 14a6ea268468..1847d30ede22 100644 --- a/src/components/Attachments/AttachmentCarousel/CarouselButtons.js +++ b/src/components/Attachments/AttachmentCarousel/CarouselButtons.js @@ -7,9 +7,9 @@ import Button from '@components/Button'; import * as Expensicons from '@components/Icon/Expensicons'; import Tooltip from '@components/Tooltip'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; const propTypes = { /** Where the arrows should be visible */ diff --git a/src/components/Attachments/AttachmentCarousel/CarouselItem.js b/src/components/Attachments/AttachmentCarousel/CarouselItem.js index 1642fa32734a..e1fcc86e12a5 100644 --- a/src/components/Attachments/AttachmentCarousel/CarouselItem.js +++ b/src/components/Attachments/AttachmentCarousel/CarouselItem.js @@ -8,8 +8,8 @@ import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeed import SafeAreaConsumer from '@components/SafeAreaConsumer'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import ReportAttachmentsContext from '@pages/home/report/ReportAttachmentsContext'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/components/Attachments/AttachmentCarousel/Pager/ImageTransformer.js b/src/components/Attachments/AttachmentCarousel/Pager/ImageTransformer.js index cc1e20cb44e0..4bce03b6f25e 100644 --- a/src/components/Attachments/AttachmentCarousel/Pager/ImageTransformer.js +++ b/src/components/Attachments/AttachmentCarousel/Pager/ImageTransformer.js @@ -15,7 +15,7 @@ import Animated, { withDecay, withSpring, } from 'react-native-reanimated'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import AttachmentCarouselPagerContext from './AttachmentCarouselPagerContext'; import ImageWrapper from './ImageWrapper'; diff --git a/src/components/Attachments/AttachmentCarousel/Pager/ImageWrapper.js b/src/components/Attachments/AttachmentCarousel/Pager/ImageWrapper.js index b0a8b1f0d083..b639eb291bb1 100644 --- a/src/components/Attachments/AttachmentCarousel/Pager/ImageWrapper.js +++ b/src/components/Attachments/AttachmentCarousel/Pager/ImageWrapper.js @@ -2,7 +2,7 @@ import PropTypes from 'prop-types'; import React from 'react'; import {StyleSheet} from 'react-native'; import Animated from 'react-native-reanimated'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; const imageWrapperPropTypes = { children: PropTypes.node.isRequired, diff --git a/src/components/Attachments/AttachmentCarousel/Pager/index.js b/src/components/Attachments/AttachmentCarousel/Pager/index.js index 6913941ed726..15c98ece62cb 100644 --- a/src/components/Attachments/AttachmentCarousel/Pager/index.js +++ b/src/components/Attachments/AttachmentCarousel/Pager/index.js @@ -6,7 +6,7 @@ import PagerView from 'react-native-pager-view'; import Animated, {runOnJS, useAnimatedProps, useAnimatedReaction, useEvent, useHandler, useSharedValue} from 'react-native-reanimated'; import _ from 'underscore'; import refPropTypes from '@components/refPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import AttachmentCarouselPagerContext from './AttachmentCarouselPagerContext'; const AnimatedPagerView = Animated.createAnimatedComponent(createNativeWrapper(PagerView)); diff --git a/src/components/Attachments/AttachmentCarousel/index.js b/src/components/Attachments/AttachmentCarousel/index.js index fb31e32de91c..8f225d426dca 100644 --- a/src/components/Attachments/AttachmentCarousel/index.js +++ b/src/components/Attachments/AttachmentCarousel/index.js @@ -6,10 +6,10 @@ import BlockingView from '@components/BlockingViews/BlockingView'; import * as Illustrations from '@components/Icon/Illustrations'; import withLocalize from '@components/withLocalize'; import withWindowDimensions from '@components/withWindowDimensions'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/Attachments/AttachmentCarousel/index.native.js b/src/components/Attachments/AttachmentCarousel/index.native.js index ea45509d6ce3..374b2d47d12d 100644 --- a/src/components/Attachments/AttachmentCarousel/index.native.js +++ b/src/components/Attachments/AttachmentCarousel/index.native.js @@ -5,9 +5,9 @@ import _ from 'underscore'; import BlockingView from '@components/BlockingViews/BlockingView'; import * as Illustrations from '@components/Icon/Illustrations'; import withLocalize from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import ONYXKEYS from '@src/ONYXKEYS'; import {defaultProps, propTypes} from './attachmentCarouselPropTypes'; diff --git a/src/components/Attachments/AttachmentView/AttachmentViewImage/index.js b/src/components/Attachments/AttachmentView/AttachmentViewImage/index.js index 3b080e47e4d1..78b69be077aa 100755 --- a/src/components/Attachments/AttachmentView/AttachmentViewImage/index.js +++ b/src/components/Attachments/AttachmentView/AttachmentViewImage/index.js @@ -2,8 +2,8 @@ import React, {memo} from 'react'; import ImageView from '@components/ImageView'; import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeedback'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import {attachmentViewImageDefaultProps, attachmentViewImagePropTypes} from './propTypes'; diff --git a/src/components/Attachments/AttachmentView/AttachmentViewImage/index.native.js b/src/components/Attachments/AttachmentView/AttachmentViewImage/index.native.js index a61adcf04043..fd709c82a2e2 100755 --- a/src/components/Attachments/AttachmentView/AttachmentViewImage/index.native.js +++ b/src/components/Attachments/AttachmentView/AttachmentViewImage/index.native.js @@ -3,8 +3,8 @@ import AttachmentCarouselPage from '@components/Attachments/AttachmentCarousel/P import ImageView from '@components/ImageView'; import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeedback'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import {attachmentViewImageDefaultProps, attachmentViewImagePropTypes} from './propTypes'; diff --git a/src/components/Attachments/AttachmentView/AttachmentViewPdf/index.android.js b/src/components/Attachments/AttachmentView/AttachmentViewPdf/index.android.js index b9dd65e2716b..308d3cf2c0ba 100644 --- a/src/components/Attachments/AttachmentView/AttachmentViewPdf/index.android.js +++ b/src/components/Attachments/AttachmentView/AttachmentViewPdf/index.android.js @@ -3,7 +3,7 @@ import {StyleSheet, View} from 'react-native'; import {Gesture, GestureDetector} from 'react-native-gesture-handler'; import Animated, {useSharedValue} from 'react-native-reanimated'; import AttachmentCarouselPagerContext from '@components/Attachments/AttachmentCarousel/Pager/AttachmentCarouselPagerContext'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import BaseAttachmentViewPdf from './BaseAttachmentViewPdf'; import {attachmentViewPdfDefaultProps, attachmentViewPdfPropTypes} from './propTypes'; diff --git a/src/components/Attachments/AttachmentView/index.js b/src/components/Attachments/AttachmentView/index.js index 6e1ed651ae06..79d1b6f407b9 100755 --- a/src/components/Attachments/AttachmentView/index.js +++ b/src/components/Attachments/AttachmentView/index.js @@ -12,13 +12,12 @@ import Text from '@components/Text'; import Tooltip from '@components/Tooltip'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import useNetwork from '@hooks/useNetwork'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import addEncryptedAuthTokenToURL from '@libs/addEncryptedAuthTokenToURL'; import compose from '@libs/compose'; import * as TransactionUtils from '@libs/TransactionUtils'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; -import cursor from '@styles/utilities/cursor'; import variables from '@styles/variables'; import ONYXKEYS from '@src/ONYXKEYS'; import AttachmentViewImage from './AttachmentViewImage'; @@ -141,7 +140,7 @@ function AttachmentView({ onScaleChanged={onScaleChanged} onToggleKeyboard={onToggleKeyboard} onLoadComplete={() => !loadComplete && setLoadComplete(true)} - errorLabelStyles={isUsedInAttachmentModal ? [styles.textLabel, styles.textLarge] : [cursor.cursorAuto]} + errorLabelStyles={isUsedInAttachmentModal ? [styles.textLabel, styles.textLarge] : [styles.cursorAuto]} style={isUsedInAttachmentModal ? styles.imageModalPDF : styles.flex1} /> diff --git a/src/components/AutoCompleteSuggestions/BaseAutoCompleteSuggestions.tsx b/src/components/AutoCompleteSuggestions/BaseAutoCompleteSuggestions.tsx index 07db455968a3..4ad3d45544b0 100644 --- a/src/components/AutoCompleteSuggestions/BaseAutoCompleteSuggestions.tsx +++ b/src/components/AutoCompleteSuggestions/BaseAutoCompleteSuggestions.tsx @@ -5,8 +5,8 @@ import {View} from 'react-native'; import {ScrollView} from 'react-native-gesture-handler'; import Animated, {Easing, FadeOutDown, useAnimatedStyle, useSharedValue, withTiming} from 'react-native-reanimated'; import PressableWithFeedback from '@components/Pressable/PressableWithFeedback'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; import viewForwardedRef from '@src/types/utils/viewForwardedRef'; import type {AutoCompleteSuggestionsProps, RenderSuggestionMenuItemProps} from './types'; diff --git a/src/components/AutoCompleteSuggestions/index.tsx b/src/components/AutoCompleteSuggestions/index.tsx index 3ccbb4efaf5a..baca4011a177 100644 --- a/src/components/AutoCompleteSuggestions/index.tsx +++ b/src/components/AutoCompleteSuggestions/index.tsx @@ -1,9 +1,9 @@ import React from 'react'; import ReactDOM from 'react-dom'; import {View} from 'react-native'; +import useStyleUtils from '@hooks/useStyleUtils'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; -import useStyleUtils from '@styles/useStyleUtils'; import BaseAutoCompleteSuggestions from './BaseAutoCompleteSuggestions'; import type {AutoCompleteSuggestionsProps} from './types'; diff --git a/src/components/AutoEmailLink.js b/src/components/AutoEmailLink.js index bffd2493aa5d..af581525ab69 100644 --- a/src/components/AutoEmailLink.js +++ b/src/components/AutoEmailLink.js @@ -2,7 +2,7 @@ import {CONST} from 'expensify-common/lib/CONST'; import PropTypes from 'prop-types'; import React from 'react'; import _ from 'underscore'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import Text from './Text'; import TextLink from './TextLink'; diff --git a/src/components/AutoUpdateTime.js b/src/components/AutoUpdateTime.js index 1970839ec320..b9aa3446fa12 100644 --- a/src/components/AutoUpdateTime.js +++ b/src/components/AutoUpdateTime.js @@ -5,8 +5,8 @@ import PropTypes from 'prop-types'; 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 useThemeStyles from '@styles/useThemeStyles'; import Text from './Text'; import withLocalize, {withLocalizePropTypes} from './withLocalize'; diff --git a/src/components/Avatar.tsx b/src/components/Avatar.tsx index f801cb11e9df..978d2f097cbf 100644 --- a/src/components/Avatar.tsx +++ b/src/components/Avatar.tsx @@ -1,11 +1,11 @@ import React, {useEffect, useState} from 'react'; import {StyleProp, View, ViewStyle} 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 useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import type {AvatarSizeName} from '@styles/utils'; import CONST from '@src/CONST'; import {AvatarType} from '@src/types/onyx/OnyxCommon'; diff --git a/src/components/AvatarCropModal/AvatarCropModal.js b/src/components/AvatarCropModal/AvatarCropModal.js index 419891d9bdef..a39daeb78ba7 100644 --- a/src/components/AvatarCropModal/AvatarCropModal.js +++ b/src/components/AvatarCropModal/AvatarCropModal.js @@ -15,11 +15,11 @@ import Text from '@components/Text'; import Tooltip from '@components/Tooltip'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import cropOrRotateImage from '@libs/cropOrRotateImage'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ImageCropView from './ImageCropView'; import Slider from './Slider'; diff --git a/src/components/AvatarCropModal/ImageCropView.js b/src/components/AvatarCropModal/ImageCropView.js index 94289b24d6ca..3f6263cf7b95 100644 --- a/src/components/AvatarCropModal/ImageCropView.js +++ b/src/components/AvatarCropModal/ImageCropView.js @@ -5,9 +5,9 @@ import {PanGestureHandler} from 'react-native-gesture-handler'; import Animated, {interpolate, useAnimatedStyle} from 'react-native-reanimated'; import Icon from '@components/Icon'; import * as Expensicons from '@components/Icon/Expensicons'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import ControlSelection from '@libs/ControlSelection'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import gestureHandlerPropTypes from './gestureHandlerPropTypes'; const propTypes = { diff --git a/src/components/AvatarCropModal/Slider.js b/src/components/AvatarCropModal/Slider.js index 9df6ac3c0498..ba2e1471ce9e 100644 --- a/src/components/AvatarCropModal/Slider.js +++ b/src/components/AvatarCropModal/Slider.js @@ -5,8 +5,8 @@ import {PanGestureHandler} from 'react-native-gesture-handler'; import Animated, {useAnimatedStyle} from 'react-native-reanimated'; import Tooltip from '@components/Tooltip'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import ControlSelection from '@libs/ControlSelection'; -import useThemeStyles from '@styles/useThemeStyles'; import gestureHandlerPropTypes from './gestureHandlerPropTypes'; const propTypes = { diff --git a/src/components/AvatarSkeleton.tsx b/src/components/AvatarSkeleton.tsx index d2706447f756..0887830aa07a 100644 --- a/src/components/AvatarSkeleton.tsx +++ b/src/components/AvatarSkeleton.tsx @@ -1,6 +1,6 @@ import React from 'react'; import {Circle} from 'react-native-svg'; -import useTheme from '@styles/themes/useTheme'; +import useTheme from '@hooks/useTheme'; import SkeletonViewContentLoader from './SkeletonViewContentLoader'; function AvatarSkeleton() { diff --git a/src/components/AvatarWithDisplayName.tsx b/src/components/AvatarWithDisplayName.tsx index 3cc39f9e815f..5ea21502f2ca 100644 --- a/src/components/AvatarWithDisplayName.tsx +++ b/src/components/AvatarWithDisplayName.tsx @@ -2,12 +2,12 @@ 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 useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as ReportUtils from '@libs/ReportUtils'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/components/AvatarWithImagePicker.js b/src/components/AvatarWithImagePicker.js index 9b061ba5c670..325d4706da71 100644 --- a/src/components/AvatarWithImagePicker.js +++ b/src/components/AvatarWithImagePicker.js @@ -4,12 +4,12 @@ import React, {useEffect, useRef, useState} from 'react'; import {StyleSheet, View} from 'react-native'; import _ from 'underscore'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Browser from '@libs/Browser'; import * as FileUtils from '@libs/fileDownload/FileUtils'; import getImageResolution from '@libs/fileDownload/getImageResolution'; import stylePropTypes from '@styles/stylePropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import CONST from '@src/CONST'; import AttachmentModal from './AttachmentModal'; diff --git a/src/components/AvatarWithIndicator.tsx b/src/components/AvatarWithIndicator.tsx index 3ae9507350c8..2fd733d4b072 100644 --- a/src/components/AvatarWithIndicator.tsx +++ b/src/components/AvatarWithIndicator.tsx @@ -1,7 +1,7 @@ import React from 'react'; import {View} from 'react-native'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as UserUtils from '@libs/UserUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import Avatar from './Avatar'; import AvatarSkeleton from './AvatarSkeleton'; import * as Expensicons from './Icon/Expensicons'; diff --git a/src/components/Badge.tsx b/src/components/Badge.tsx index b670921dff4c..70aebc30ee83 100644 --- a/src/components/Badge.tsx +++ b/src/components/Badge.tsx @@ -1,7 +1,7 @@ import React, {useCallback} from 'react'; import {GestureResponderEvent, PressableStateCallbackType, StyleProp, TextStyle, View, ViewStyle} from 'react-native'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; import PressableWithoutFeedback from './Pressable/PressableWithoutFeedback'; import Text from './Text'; diff --git a/src/components/Banner.tsx b/src/components/Banner.tsx index 3eb2316aa9d0..7ceb3deb9e63 100644 --- a/src/components/Banner.tsx +++ b/src/components/Banner.tsx @@ -1,9 +1,9 @@ import React, {memo} from 'react'; import {StyleProp, TextStyle, View, ViewStyle} from 'react-native'; import useLocalize from '@hooks/useLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import getButtonState from '@libs/getButtonState'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import Hoverable from './Hoverable'; import Icon from './Icon'; diff --git a/src/components/BaseMiniContextMenuItem.tsx b/src/components/BaseMiniContextMenuItem.tsx index 082c0e20801a..8d115a37cba7 100644 --- a/src/components/BaseMiniContextMenuItem.tsx +++ b/src/components/BaseMiniContextMenuItem.tsx @@ -1,10 +1,10 @@ import React, {ForwardedRef} from 'react'; import {PressableStateCallbackType, View} from 'react-native'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import DomUtils from '@libs/DomUtils'; import getButtonState from '@libs/getButtonState'; import ReportActionComposeFocusManager from '@libs/ReportActionComposeFocusManager'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import PressableWithoutFeedback from './Pressable/PressableWithoutFeedback'; import Tooltip from './Tooltip/PopoverAnchorTooltip'; diff --git a/src/components/BigNumberPad.tsx b/src/components/BigNumberPad.tsx index 3204b39cb19c..8b840f9d1b57 100644 --- a/src/components/BigNumberPad.tsx +++ b/src/components/BigNumberPad.tsx @@ -1,9 +1,9 @@ import React, {useState} from 'react'; import {View} from 'react-native'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import ControlSelection from '@libs/ControlSelection'; -import useThemeStyles from '@styles/useThemeStyles'; import Button from './Button'; type BigNumberPadProps = { diff --git a/src/components/BlockingViews/BlockingView.js b/src/components/BlockingViews/BlockingView.js index aec414cdeb74..44f6b7100509 100644 --- a/src/components/BlockingViews/BlockingView.js +++ b/src/components/BlockingViews/BlockingView.js @@ -6,9 +6,9 @@ import Icon from '@components/Icon'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; const propTypes = { diff --git a/src/components/BlockingViews/FullPageNotFoundView.js b/src/components/BlockingViews/FullPageNotFoundView.js index b82474aa0694..ce76b96c0eb0 100644 --- a/src/components/BlockingViews/FullPageNotFoundView.js +++ b/src/components/BlockingViews/FullPageNotFoundView.js @@ -4,8 +4,8 @@ import {View} from 'react-native'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import * as Illustrations from '@components/Icon/Illustrations'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import ROUTES from '@src/ROUTES'; import BlockingView from './BlockingView'; diff --git a/src/components/Button/index.tsx b/src/components/Button/index.tsx index 06577c3ac813..af8ec33683de 100644 --- a/src/components/Button/index.tsx +++ b/src/components/Button/index.tsx @@ -9,9 +9,9 @@ import Text from '@components/Text'; import withNavigationFallback from '@components/withNavigationFallback'; import useActiveElement from '@hooks/useActiveElement'; import useKeyboardShortcut from '@hooks/useKeyboardShortcut'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import HapticFeedback from '@libs/HapticFeedback'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ChildrenProps from '@src/types/utils/ChildrenProps'; import validateSubmitShortcut from './validateSubmitShortcut'; diff --git a/src/components/ButtonWithDropdownMenu.js b/src/components/ButtonWithDropdownMenu.js index a5f311740f19..0291143a9dbc 100644 --- a/src/components/ButtonWithDropdownMenu.js +++ b/src/components/ButtonWithDropdownMenu.js @@ -2,10 +2,10 @@ import PropTypes from 'prop-types'; import React, {useEffect, useRef, useState} from 'react'; import {View} from 'react-native'; import _ from 'underscore'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import Button from './Button'; import Icon from './Icon'; diff --git a/src/components/CardPreview.tsx b/src/components/CardPreview.tsx index 6dc8abfb80ef..e3ddbd54b892 100644 --- a/src/components/CardPreview.tsx +++ b/src/components/CardPreview.tsx @@ -3,7 +3,7 @@ import {View} from 'react-native'; import {OnyxEntry, withOnyx} from 'react-native-onyx'; import ExpensifyCardImage from '@assets/images/expensify-card.svg'; import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; import ONYXKEYS from '@src/ONYXKEYS'; import {PrivatePersonalDetails, Session} from '@src/types/onyx'; diff --git a/src/components/CategoryPicker/index.js b/src/components/CategoryPicker/index.js index 36cf9b1deadc..d170def12276 100644 --- a/src/components/CategoryPicker/index.js +++ b/src/components/CategoryPicker/index.js @@ -4,8 +4,8 @@ import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; import OptionsSelector from '@components/OptionsSelector'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as OptionsListUtils from '@libs/OptionsListUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import {defaultProps, propTypes} from './categoryPickerPropTypes'; diff --git a/src/components/Checkbox.tsx b/src/components/Checkbox.tsx index 5dd3164eadcc..23bc068e8fe0 100644 --- a/src/components/Checkbox.tsx +++ b/src/components/Checkbox.tsx @@ -1,8 +1,8 @@ import React, {ForwardedRef, forwardRef, KeyboardEvent as ReactKeyboardEvent} from 'react'; import {GestureResponderEvent, StyleProp, View, ViewStyle} from 'react-native'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; +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 Icon from './Icon'; diff --git a/src/components/CheckboxWithLabel.js b/src/components/CheckboxWithLabel.js index 92cd7ea38eea..24f61c305dda 100644 --- a/src/components/CheckboxWithLabel.js +++ b/src/components/CheckboxWithLabel.js @@ -2,7 +2,7 @@ import PropTypes from 'prop-types'; import React, {useState} from 'react'; import {View} from 'react-native'; import _ from 'underscore'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; import Checkbox from './Checkbox'; import FormHelpMessage from './FormHelpMessage'; diff --git a/src/components/CollapsibleSection/index.tsx b/src/components/CollapsibleSection/index.tsx index 04574c5fd057..bc7bf6e89dba 100644 --- a/src/components/CollapsibleSection/index.tsx +++ b/src/components/CollapsibleSection/index.tsx @@ -4,7 +4,7 @@ import Icon from '@components/Icon'; import * as Expensicons from '@components/Icon/Expensicons'; import PressableWithFeedback from '@components/Pressable/PressableWithFeedback'; import Text from '@components/Text'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; import ChildrenProps from '@src/types/utils/ChildrenProps'; import Collapsible from './Collapsible'; diff --git a/src/components/ColorSchemeWrapper/index.tsx b/src/components/ColorSchemeWrapper/index.tsx index 2909f1ffbe9f..0a1ccc5e5d67 100644 --- a/src/components/ColorSchemeWrapper/index.tsx +++ b/src/components/ColorSchemeWrapper/index.tsx @@ -1,7 +1,7 @@ import React from 'react'; import {View} from 'react-native'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; function ColorSchemeWrapper({children}: React.PropsWithChildren): React.ReactElement { const theme = useTheme(); diff --git a/src/components/CommunicationsLink.js b/src/components/CommunicationsLink.js index dbbe5737b3aa..01ae0354a66d 100644 --- a/src/components/CommunicationsLink.js +++ b/src/components/CommunicationsLink.js @@ -1,8 +1,8 @@ import PropTypes from 'prop-types'; import React from 'react'; import {View} from 'react-native'; +import useThemeStyles from '@hooks/useThemeStyles'; import Clipboard from '@libs/Clipboard'; -import useThemeStyles from '@styles/useThemeStyles'; import ContextMenuItem from './ContextMenuItem'; import * as Expensicons from './Icon/Expensicons'; import withLocalize, {withLocalizePropTypes} from './withLocalize'; diff --git a/src/components/Composer/index.android.js b/src/components/Composer/index.android.js index 698c68cc78e9..af64831df117 100644 --- a/src/components/Composer/index.android.js +++ b/src/components/Composer/index.android.js @@ -3,9 +3,9 @@ import React, {useCallback, useEffect, useMemo, useRef} from 'react'; import {StyleSheet} from 'react-native'; import _ from 'underscore'; import RNTextInput from '@components/RNTextInput'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as ComposerUtils from '@libs/ComposerUtils'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; const propTypes = { /** Maximum number of lines in the text input */ diff --git a/src/components/Composer/index.ios.js b/src/components/Composer/index.ios.js index 9852e607562b..c9947999b273 100644 --- a/src/components/Composer/index.ios.js +++ b/src/components/Composer/index.ios.js @@ -3,9 +3,9 @@ import React, {useCallback, useEffect, useMemo, useRef} from 'react'; import {StyleSheet} from 'react-native'; import _ from 'underscore'; import RNTextInput from '@components/RNTextInput'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as ComposerUtils from '@libs/ComposerUtils'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; const propTypes = { /** If the input should clear, it actually gets intercepted instead of .clear() */ diff --git a/src/components/Composer/index.js b/src/components/Composer/index.js index 713439671162..3af22b63ed69 100755 --- a/src/components/Composer/index.js +++ b/src/components/Composer/index.js @@ -9,6 +9,9 @@ import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withNavigation from '@components/withNavigation'; import useIsScrollBarVisible from '@hooks/useIsScrollBarVisible'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as Browser from '@libs/Browser'; import compose from '@libs/compose'; @@ -16,9 +19,6 @@ import * as ComposerUtils from '@libs/ComposerUtils'; import updateIsFullComposerAvailable from '@libs/ComposerUtils/updateIsFullComposerAvailable'; import isEnterWhileComposition from '@libs/KeyboardShortcut/isEnterWhileComposition'; import ReportActionComposeFocusManager from '@libs/ReportActionComposeFocusManager'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/components/ConfirmContent.js b/src/components/ConfirmContent.js index ff8ee4f861a4..8574cc02014e 100644 --- a/src/components/ConfirmContent.js +++ b/src/components/ConfirmContent.js @@ -4,7 +4,7 @@ import {View} from 'react-native'; import _ from 'underscore'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; import Button from './Button'; import Header from './Header'; diff --git a/src/components/ConfirmationPage.tsx b/src/components/ConfirmationPage.tsx index 12e8b40a0f25..21813edd693d 100644 --- a/src/components/ConfirmationPage.tsx +++ b/src/components/ConfirmationPage.tsx @@ -1,6 +1,6 @@ import React from 'react'; import {View} from 'react-native'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import Button from './Button'; import FixedFooter from './FixedFooter'; import Lottie from './Lottie'; diff --git a/src/components/ConfirmedRoute.js b/src/components/ConfirmedRoute.js index 79b97b38194a..3abec6d0d1f4 100644 --- a/src/components/ConfirmedRoute.js +++ b/src/components/ConfirmedRoute.js @@ -5,9 +5,9 @@ import React, {useCallback, useEffect} from 'react'; import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; import useNetwork from '@hooks/useNetwork'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as TransactionUtils from '@libs/TransactionUtils'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as MapboxToken from '@userActions/MapboxToken'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/ConnectBankAccountButton.js b/src/components/ConnectBankAccountButton.js index 6afd3d57d4e6..f036918d9429 100644 --- a/src/components/ConnectBankAccountButton.js +++ b/src/components/ConnectBankAccountButton.js @@ -1,9 +1,9 @@ import PropTypes from 'prop-types'; import React from 'react'; import {View} from 'react-native'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import * as ReimbursementAccount from '@userActions/ReimbursementAccount'; import Button from './Button'; import * as Expensicons from './Icon/Expensicons'; diff --git a/src/components/ContextMenuItem.js b/src/components/ContextMenuItem.js index 2cabd71b11cb..307cfcde9b10 100644 --- a/src/components/ContextMenuItem.js +++ b/src/components/ContextMenuItem.js @@ -1,10 +1,10 @@ import PropTypes from 'prop-types'; import React, {forwardRef, useImperativeHandle} from 'react'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import useThrottledButtonState from '@hooks/useThrottledButtonState'; import useWindowDimensions from '@hooks/useWindowDimensions'; import getButtonState from '@libs/getButtonState'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import BaseMiniContextMenuItem from './BaseMiniContextMenuItem'; import Icon from './Icon'; import MenuItem from './MenuItem'; diff --git a/src/components/CountrySelector.js b/src/components/CountrySelector.js index b138bc949937..68a6486bce48 100644 --- a/src/components/CountrySelector.js +++ b/src/components/CountrySelector.js @@ -2,8 +2,8 @@ import PropTypes from 'prop-types'; import React, {useEffect} from 'react'; import {View} from 'react-native'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import ROUTES from '@src/ROUTES'; import FormHelpMessage from './FormHelpMessage'; import MenuItemWithTopDescription from './MenuItemWithTopDescription'; diff --git a/src/components/CurrencySymbolButton.js b/src/components/CurrencySymbolButton.js index 47c25a43ad11..d03834fc1fd6 100644 --- a/src/components/CurrencySymbolButton.js +++ b/src/components/CurrencySymbolButton.js @@ -1,7 +1,7 @@ import PropTypes from 'prop-types'; import React from 'react'; import useLocalize from '@hooks/useLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; import PressableWithoutFeedback from './Pressable/PressableWithoutFeedback'; import Text from './Text'; diff --git a/src/components/CurrentUserPersonalDetailsSkeletonView/index.tsx b/src/components/CurrentUserPersonalDetailsSkeletonView/index.tsx index 6f6daddc51b8..02c308705994 100644 --- a/src/components/CurrentUserPersonalDetailsSkeletonView/index.tsx +++ b/src/components/CurrentUserPersonalDetailsSkeletonView/index.tsx @@ -3,9 +3,9 @@ import {View} from 'react-native'; import {Circle, Rect} from 'react-native-svg'; import {ValueOf} from 'type-fest'; import SkeletonViewContentLoader from '@components/SkeletonViewContentLoader'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; import CONST from '@src/CONST'; diff --git a/src/components/CurrentWalletBalance.tsx b/src/components/CurrentWalletBalance.tsx index 9a5b2cd0227b..28a83fb1ae50 100644 --- a/src/components/CurrentWalletBalance.tsx +++ b/src/components/CurrentWalletBalance.tsx @@ -1,8 +1,8 @@ import React from 'react'; import {StyleProp, TextStyle} from 'react-native'; import {OnyxEntry, withOnyx} from 'react-native-onyx'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as CurrencyUtils from '@libs/CurrencyUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import ONYXKEYS from '@src/ONYXKEYS'; import UserWallet from '@src/types/onyx/UserWallet'; import Text from './Text'; diff --git a/src/components/CustomStatusBar/index.tsx b/src/components/CustomStatusBar/index.tsx index 3b5022c60898..2c1af898786d 100644 --- a/src/components/CustomStatusBar/index.tsx +++ b/src/components/CustomStatusBar/index.tsx @@ -1,30 +1,19 @@ import {EventListenerCallback, NavigationContainerEventMap} from '@react-navigation/native'; -import PropTypes from 'prop-types'; import React, {useCallback, useContext, useEffect} from 'react'; +import useTheme from '@hooks/useTheme'; import {navigationRef} from '@libs/Navigation/Navigation'; import StatusBar from '@libs/StatusBar'; -import useTheme from '@styles/themes/useTheme'; import CustomStatusBarContext from './CustomStatusBarContext'; import updateStatusBarAppearance from './updateStatusBarAppearance'; type CustomStatusBarProps = { - isNested: boolean; -}; - -const propTypes = { /** Whether the CustomStatusBar is nested within another CustomStatusBar. * A nested CustomStatusBar will disable the "root" CustomStatusBar. */ - isNested: PropTypes.bool, -}; - -type CustomStatusBarType = { - (props: CustomStatusBarProps): React.ReactNode; - displayName: string; - propTypes: typeof propTypes; + isNested: boolean; }; // eslint-disable-next-line react/function-component-definition -const CustomStatusBar: CustomStatusBarType = ({isNested = false}) => { +function CustomStatusBar({isNested = false}: CustomStatusBarProps) { const {isRootStatusBarDisabled, disableRootStatusBar} = useContext(CustomStatusBarContext); const theme = useTheme(); @@ -83,9 +72,8 @@ const CustomStatusBar: CustomStatusBarType = ({isNested = false}) => { } return ; -}; +} CustomStatusBar.displayName = 'CustomStatusBar'; -CustomStatusBar.propTypes = propTypes; export default CustomStatusBar; diff --git a/src/components/CustomStatusBar/updateStatusBarAppearance/types.ts b/src/components/CustomStatusBar/updateStatusBarAppearance/types.ts index 3d16b5944a31..823f0059eccf 100644 --- a/src/components/CustomStatusBar/updateStatusBarAppearance/types.ts +++ b/src/components/CustomStatusBar/updateStatusBarAppearance/types.ts @@ -1,4 +1,4 @@ -import {StatusBarStyle} from '@styles/styles'; +import {StatusBarStyle} from '@styles/index'; type UpdateStatusBarAppearanceProps = { backgroundColor?: string; diff --git a/src/components/DatePicker/CalendarPicker/ArrowIcon.js b/src/components/DatePicker/CalendarPicker/ArrowIcon.js index a03e18085706..793aca9e7635 100644 --- a/src/components/DatePicker/CalendarPicker/ArrowIcon.js +++ b/src/components/DatePicker/CalendarPicker/ArrowIcon.js @@ -3,8 +3,8 @@ import React from 'react'; import {View} from 'react-native'; import Icon from '@components/Icon'; import * as Expensicons from '@components/Icon/Expensicons'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/components/DatePicker/CalendarPicker/YearPickerModal.js b/src/components/DatePicker/CalendarPicker/YearPickerModal.js index f51d869efbac..e8883648051c 100644 --- a/src/components/DatePicker/CalendarPicker/YearPickerModal.js +++ b/src/components/DatePicker/CalendarPicker/YearPickerModal.js @@ -7,7 +7,7 @@ import ScreenWrapper from '@components/ScreenWrapper'; import SelectionList from '@components/SelectionList'; import {radioListItemPropTypes} from '@components/SelectionList/selectionListPropTypes'; import useLocalize from '@hooks/useLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/components/DatePicker/index.js b/src/components/DatePicker/index.js index ac6454d25975..8af550c9dc66 100644 --- a/src/components/DatePicker/index.js +++ b/src/components/DatePicker/index.js @@ -8,7 +8,7 @@ import * as Expensicons from '@components/Icon/Expensicons'; import TextInput from '@components/TextInput'; import {propTypes as baseTextInputPropTypes, defaultProps as defaultBaseTextInputPropTypes} from '@components/TextInput/BaseTextInput/baseTextInputPropTypes'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; import CalendarPicker from './CalendarPicker'; diff --git a/src/components/DeeplinkWrapper/DeeplinkRedirectLoadingIndicator.js b/src/components/DeeplinkWrapper/DeeplinkRedirectLoadingIndicator.js index 3c7366949ac1..622767b8a5f8 100644 --- a/src/components/DeeplinkWrapper/DeeplinkRedirectLoadingIndicator.js +++ b/src/components/DeeplinkWrapper/DeeplinkRedirectLoadingIndicator.js @@ -8,10 +8,10 @@ import * as Illustrations from '@components/Icon/Illustrations'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/components/DisplayNames/DisplayNamesTooltipItem.tsx b/src/components/DisplayNames/DisplayNamesTooltipItem.tsx index 82f9c5799b78..440457d22965 100644 --- a/src/components/DisplayNames/DisplayNamesTooltipItem.tsx +++ b/src/components/DisplayNames/DisplayNamesTooltipItem.tsx @@ -2,8 +2,8 @@ import React, {RefObject, useCallback} from 'react'; import {Text as RNText, StyleProp, TextStyle} from 'react-native'; import Text from '@components/Text'; import UserDetailsTooltip from '@components/UserDetailsTooltip'; +import useThemeStyles from '@hooks/useThemeStyles'; import {AvatarSource} from '@libs/UserUtils'; -import useThemeStyles from '@styles/useThemeStyles'; type DisplayNamesTooltipItemProps = { index?: number; diff --git a/src/components/DisplayNames/DisplayNamesWithTooltip.tsx b/src/components/DisplayNames/DisplayNamesWithTooltip.tsx index 8c8720c7c99f..43061ada9a94 100644 --- a/src/components/DisplayNames/DisplayNamesWithTooltip.tsx +++ b/src/components/DisplayNames/DisplayNamesWithTooltip.tsx @@ -2,7 +2,7 @@ import React, {Fragment, useCallback, useRef} from 'react'; import {Text as RNText, View} from 'react-native'; import Text from '@components/Text'; import Tooltip from '@components/Tooltip'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import DisplayNamesTooltipItem from './DisplayNamesTooltipItem'; import DisplayNamesProps from './types'; diff --git a/src/components/DisplayNames/DisplayNamesWithoutTooltip.tsx b/src/components/DisplayNames/DisplayNamesWithoutTooltip.tsx index 1854ebe2353d..761b0b66ee2c 100644 --- a/src/components/DisplayNames/DisplayNamesWithoutTooltip.tsx +++ b/src/components/DisplayNames/DisplayNamesWithoutTooltip.tsx @@ -1,7 +1,7 @@ import React from 'react'; import {StyleProp, TextStyle} from 'react-native'; import Text from '@components/Text'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; type DisplayNamesWithoutTooltipProps = { /** The full title of the DisplayNames component (not split up) */ diff --git a/src/components/DistanceEReceipt.js b/src/components/DistanceEReceipt.js index cbf25fd2753b..7d1d3c99f48d 100644 --- a/src/components/DistanceEReceipt.js +++ b/src/components/DistanceEReceipt.js @@ -5,13 +5,13 @@ import _ from 'underscore'; import EReceiptBackground from '@assets/images/eReceipt_background.svg'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as CurrencyUtils from '@libs/CurrencyUtils'; import * as ReceiptUtils from '@libs/ReceiptUtils'; import * as ReportUtils from '@libs/ReportUtils'; import * as TransactionUtils from '@libs/TransactionUtils'; import tryResolveUrlFromApiRoot from '@libs/tryResolveUrlFromApiRoot'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import Icon from './Icon'; import * as Expensicons from './Icon/Expensicons'; import PendingMapView from './MapView/PendingMapView'; diff --git a/src/components/DistanceMapView/index.android.js b/src/components/DistanceMapView/index.android.js index 532d42ac0be5..fa40bd50673e 100644 --- a/src/components/DistanceMapView/index.android.js +++ b/src/components/DistanceMapView/index.android.js @@ -6,8 +6,8 @@ import * as Expensicons from '@components/Icon/Expensicons'; import MapView from '@components/MapView'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as distanceMapViewPropTypes from './distanceMapViewPropTypes'; function DistanceMapView(props) { diff --git a/src/components/DistanceRequest/DistanceRequestFooter.js b/src/components/DistanceRequest/DistanceRequestFooter.js index d374f90a1b6c..d2813c152a64 100644 --- a/src/components/DistanceRequest/DistanceRequestFooter.js +++ b/src/components/DistanceRequest/DistanceRequestFooter.js @@ -10,9 +10,9 @@ import DistanceMapView from '@components/DistanceMapView'; import * as Expensicons from '@components/Icon/Expensicons'; import transactionPropTypes from '@components/transactionPropTypes'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as TransactionUtils from '@libs/TransactionUtils'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/DistanceRequest/DistanceRequestRenderItem.js b/src/components/DistanceRequest/DistanceRequestRenderItem.js index 1735e244a347..2aa2ac58f379 100644 --- a/src/components/DistanceRequest/DistanceRequestRenderItem.js +++ b/src/components/DistanceRequest/DistanceRequestRenderItem.js @@ -5,7 +5,7 @@ import _ from 'underscore'; import * as Expensicons from '@components/Icon/Expensicons'; import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription'; import useLocalize from '@hooks/useLocalize'; -import useTheme from '@styles/themes/useTheme'; +import useTheme from '@hooks/useTheme'; const propTypes = { /** The waypoints for the distance request */ diff --git a/src/components/DistanceRequest/index.js b/src/components/DistanceRequest/index.js index be34a42ead5e..b2fd16cb7d97 100644 --- a/src/components/DistanceRequest/index.js +++ b/src/components/DistanceRequest/index.js @@ -14,12 +14,12 @@ import transactionPropTypes from '@components/transactionPropTypes'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; import usePrevious from '@hooks/usePrevious'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as ErrorUtils from '@libs/ErrorUtils'; import * as IOUUtils from '@libs/IOUUtils'; import Navigation from '@libs/Navigation/Navigation'; import * as TransactionUtils from '@libs/TransactionUtils'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import * as MapboxToken from '@userActions/MapboxToken'; import * as Transaction from '@userActions/Transaction'; diff --git a/src/components/DotIndicatorMessage.tsx b/src/components/DotIndicatorMessage.tsx index 6a7d78768ed7..65afe8c7e4eb 100644 --- a/src/components/DotIndicatorMessage.tsx +++ b/src/components/DotIndicatorMessage.tsx @@ -1,11 +1,11 @@ /* eslint-disable react/no-array-index-key */ import React from 'react'; import {StyleProp, TextStyle, View, ViewStyle} from 'react-native'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import fileDownload from '@libs/fileDownload'; import * as Localize from '@libs/Localize'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import Icon from './Icon'; import * as Expensicons from './Icon/Expensicons'; diff --git a/src/components/DragAndDrop/NoDropZone/index.tsx b/src/components/DragAndDrop/NoDropZone/index.tsx index 9f2c700b8918..4760a16fd20b 100644 --- a/src/components/DragAndDrop/NoDropZone/index.tsx +++ b/src/components/DragAndDrop/NoDropZone/index.tsx @@ -1,7 +1,7 @@ import React, {useRef} from 'react'; import {View} from 'react-native'; import useDragAndDrop from '@hooks/useDragAndDrop'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import type NoDropZoneProps from './types'; function NoDropZone({children}: NoDropZoneProps) { diff --git a/src/components/DragAndDrop/Provider/index.tsx b/src/components/DragAndDrop/Provider/index.tsx index 761c512497ac..a5da9cc45a36 100644 --- a/src/components/DragAndDrop/Provider/index.tsx +++ b/src/components/DragAndDrop/Provider/index.tsx @@ -3,7 +3,7 @@ import Str from 'expensify-common/lib/str'; import React, {useCallback, useEffect, useMemo, useRef} from 'react'; import {View} from 'react-native'; import useDragAndDrop from '@hooks/useDragAndDrop'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import type {DragAndDropContextParams, DragAndDropProviderProps, SetOnDropHandlerCallback} from './types'; const DragAndDropContext = React.createContext({}); diff --git a/src/components/DraggableList/index.native.tsx b/src/components/DraggableList/index.native.tsx index e7ff058234b7..f532b21720da 100644 --- a/src/components/DraggableList/index.native.tsx +++ b/src/components/DraggableList/index.native.tsx @@ -1,7 +1,7 @@ import React from 'react'; import DraggableFlatList from 'react-native-draggable-flatlist'; import {FlatList} from 'react-native-gesture-handler'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import type {DraggableListProps} from './types'; function DraggableList({renderClone, shouldUsePortal, ...viewProps}: DraggableListProps, ref: React.ForwardedRef>) { diff --git a/src/components/DraggableList/index.tsx b/src/components/DraggableList/index.tsx index 28128002c589..b92691075424 100644 --- a/src/components/DraggableList/index.tsx +++ b/src/components/DraggableList/index.tsx @@ -1,7 +1,7 @@ import React, {useCallback} from 'react'; import {DragDropContext, Draggable, Droppable, type OnDragEndResponder} from 'react-beautiful-dnd'; import {ScrollView} from 'react-native'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import type {DraggableListProps} from './types'; import useDraggableInPortal from './useDraggableInPortal'; diff --git a/src/components/EReceipt.js b/src/components/EReceipt.js index f5e5b7f2f6b3..12cea0df04ac 100644 --- a/src/components/EReceipt.js +++ b/src/components/EReceipt.js @@ -3,11 +3,11 @@ import React from 'react'; import {View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import useLocalize from '@hooks/useLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as CardUtils from '@libs/CardUtils'; import * as CurrencyUtils from '@libs/CurrencyUtils'; import * as ReportUtils from '@libs/ReportUtils'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/EReceiptThumbnail.js b/src/components/EReceiptThumbnail.js index 1f719862412b..7c782a0aa327 100644 --- a/src/components/EReceiptThumbnail.js +++ b/src/components/EReceiptThumbnail.js @@ -2,9 +2,9 @@ import PropTypes from 'prop-types'; import React, {useMemo, useState} from 'react'; import {View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as ReportUtils from '@libs/ReportUtils'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/EmojiPicker/CategoryShortcutBar.js b/src/components/EmojiPicker/CategoryShortcutBar.js index c0c9fb8ea161..facafea13a70 100644 --- a/src/components/EmojiPicker/CategoryShortcutBar.js +++ b/src/components/EmojiPicker/CategoryShortcutBar.js @@ -2,7 +2,7 @@ import PropTypes from 'prop-types'; import React from 'react'; import {View} from 'react-native'; import _ from 'underscore'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CategoryShortcutButton from './CategoryShortcutButton'; const propTypes = { diff --git a/src/components/EmojiPicker/CategoryShortcutButton.js b/src/components/EmojiPicker/CategoryShortcutButton.js index 1fcbe7e863e4..a7dc0d7bf564 100644 --- a/src/components/EmojiPicker/CategoryShortcutButton.js +++ b/src/components/EmojiPicker/CategoryShortcutButton.js @@ -4,10 +4,10 @@ import Icon from '@components/Icon'; import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeedback'; import Tooltip from '@components/Tooltip'; import useLocalize from '@hooks/useLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import getButtonState from '@libs/getButtonState'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import CONST from '@src/CONST'; diff --git a/src/components/EmojiPicker/EmojiPicker.js b/src/components/EmojiPicker/EmojiPicker.js index 96d7ee88b816..6c05a4b6a5b5 100644 --- a/src/components/EmojiPicker/EmojiPicker.js +++ b/src/components/EmojiPicker/EmojiPicker.js @@ -4,10 +4,10 @@ import {Dimensions} from 'react-native'; import _ from 'underscore'; import PopoverWithMeasuredContent from '@components/PopoverWithMeasuredContent'; import withViewportOffsetTop from '@components/withViewportOffsetTop'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import calculateAnchorPosition from '@libs/calculateAnchorPosition'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import EmojiPickerMenu from './EmojiPickerMenu'; diff --git a/src/components/EmojiPicker/EmojiPickerButton.js b/src/components/EmojiPicker/EmojiPickerButton.js index 165646d4795d..869fe1edbfe5 100644 --- a/src/components/EmojiPicker/EmojiPickerButton.js +++ b/src/components/EmojiPicker/EmojiPickerButton.js @@ -5,9 +5,9 @@ import * as Expensicons from '@components/Icon/Expensicons'; import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeedback'; import Tooltip from '@components/Tooltip/PopoverAnchorTooltip'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import getButtonState from '@libs/getButtonState'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as EmojiPickerAction from '@userActions/EmojiPickerAction'; const propTypes = { diff --git a/src/components/EmojiPicker/EmojiPickerButtonDropdown.js b/src/components/EmojiPicker/EmojiPickerButtonDropdown.js index 5dc43ef47699..43687ec4b7a8 100644 --- a/src/components/EmojiPicker/EmojiPickerButtonDropdown.js +++ b/src/components/EmojiPicker/EmojiPickerButtonDropdown.js @@ -7,9 +7,9 @@ import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeed import Text from '@components/Text'; import Tooltip from '@components/Tooltip/PopoverAnchorTooltip'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import getButtonState from '@libs/getButtonState'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as EmojiPickerAction from '@userActions/EmojiPickerAction'; import CONST from '@src/CONST'; diff --git a/src/components/EmojiPicker/EmojiPickerMenu/index.js b/src/components/EmojiPicker/EmojiPickerMenu/index.js index 263f5929d567..36594dabcd30 100755 --- a/src/components/EmojiPicker/EmojiPickerMenu/index.js +++ b/src/components/EmojiPicker/EmojiPickerMenu/index.js @@ -11,6 +11,8 @@ import EmojiSkinToneList from '@components/EmojiPicker/EmojiSkinToneList'; import Text from '@components/Text'; import TextInput from '@components/TextInput'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as Browser from '@libs/Browser'; import canFocusInputOnScreenFocus from '@libs/canFocusInputOnScreenFocus'; @@ -18,8 +20,6 @@ import compose from '@libs/compose'; import * as EmojiUtils from '@libs/EmojiUtils'; import isEnterWhileComposition from '@libs/KeyboardShortcut/isEnterWhileComposition'; import * as ReportUtils from '@libs/ReportUtils'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as User from '@userActions/User'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/EmojiPicker/EmojiPickerMenu/index.native.js b/src/components/EmojiPicker/EmojiPickerMenu/index.native.js index eb8217bb5633..6ad93538c83b 100644 --- a/src/components/EmojiPicker/EmojiPickerMenu/index.native.js +++ b/src/components/EmojiPicker/EmojiPickerMenu/index.native.js @@ -12,11 +12,11 @@ import Text from '@components/Text'; import TextInput from '@components/TextInput'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import useSingleExecution from '@hooks/useSingleExecution'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import compose from '@libs/compose'; import * as EmojiUtils from '@libs/EmojiUtils'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as User from '@userActions/User'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/EmojiPicker/EmojiSkinToneList.js b/src/components/EmojiPicker/EmojiSkinToneList.js index 69690fa882c9..2b574b0b533f 100644 --- a/src/components/EmojiPicker/EmojiSkinToneList.js +++ b/src/components/EmojiPicker/EmojiSkinToneList.js @@ -6,7 +6,7 @@ import * as Emojis from '@assets/emojis'; import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeedback'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; import EmojiPickerMenuItem from './EmojiPickerMenuItem'; import getSkinToneEmojiFromIndex from './getSkinToneEmojiFromIndex'; diff --git a/src/components/EmojiSuggestions.tsx b/src/components/EmojiSuggestions.tsx index 01f840677e5e..2fcf8e827b4e 100644 --- a/src/components/EmojiSuggestions.tsx +++ b/src/components/EmojiSuggestions.tsx @@ -1,10 +1,10 @@ import React, {ReactElement, useCallback} from 'react'; import {View} from 'react-native'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import type {SimpleEmoji} from '@libs/EmojiTrie'; import * as EmojiUtils from '@libs/EmojiUtils'; import getStyledTextArray from '@libs/GetStyledTextArray'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import AutoCompleteSuggestions from './AutoCompleteSuggestions'; import Text from './Text'; diff --git a/src/components/EnvironmentBadge.tsx b/src/components/EnvironmentBadge.tsx index a3f321072988..6babbf119445 100644 --- a/src/components/EnvironmentBadge.tsx +++ b/src/components/EnvironmentBadge.tsx @@ -1,7 +1,7 @@ import React from 'react'; import useEnvironment from '@hooks/useEnvironment'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Environment from '@libs/Environment/Environment'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import pkg from '../../package.json'; import Badge from './Badge'; diff --git a/src/components/ExceededCommentLength.js b/src/components/ExceededCommentLength.js index 2cc1c50e2f66..3fd6688944f7 100644 --- a/src/components/ExceededCommentLength.js +++ b/src/components/ExceededCommentLength.js @@ -1,7 +1,7 @@ import PropTypes from 'prop-types'; import React from 'react'; import useLocalize from '@hooks/useLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; import Text from './Text'; diff --git a/src/components/ExpensifyWordmark.tsx b/src/components/ExpensifyWordmark.tsx index 49559d1cc6d5..b1ef7c093e29 100644 --- a/src/components/ExpensifyWordmark.tsx +++ b/src/components/ExpensifyWordmark.tsx @@ -5,9 +5,9 @@ import DevLogo from '@assets/images/expensify-logo--dev.svg'; import StagingLogo from '@assets/images/expensify-logo--staging.svg'; import ProductionLogo from '@assets/images/expensify-wordmark.svg'; import useEnvironment from '@hooks/useEnvironment'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; import CONST from '@src/CONST'; import withWindowDimensions from './withWindowDimensions'; diff --git a/src/components/FeatureList.js b/src/components/FeatureList.js index 7b0c70372579..bf0852d179f1 100644 --- a/src/components/FeatureList.js +++ b/src/components/FeatureList.js @@ -3,7 +3,7 @@ import React from 'react'; import {View} from 'react-native'; import _ from 'underscore'; import useLocalize from '@hooks/useLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import MenuItem from './MenuItem'; import menuItemPropTypes from './menuItemPropTypes'; import Text from './Text'; diff --git a/src/components/FixedFooter.tsx b/src/components/FixedFooter.tsx index 4b32e1b8ce81..7fd6811c1df6 100644 --- a/src/components/FixedFooter.tsx +++ b/src/components/FixedFooter.tsx @@ -1,6 +1,6 @@ import React, {ReactNode} from 'react'; import {StyleProp, View, ViewStyle} from 'react-native'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; type FixedFooterProps = { /** Children to wrap in FixedFooter. */ diff --git a/src/components/FocusModeNotification.js b/src/components/FocusModeNotification.js index ea6db244091a..e846c1f188e2 100644 --- a/src/components/FocusModeNotification.js +++ b/src/components/FocusModeNotification.js @@ -1,7 +1,7 @@ import React, {useEffect} from 'react'; import useEnvironment from '@hooks/useEnvironment'; import useLocalize from '@hooks/useLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Link from '@userActions/Link'; import * as User from '@userActions/User'; import CONST from '@src/CONST'; @@ -10,9 +10,9 @@ import Text from './Text'; import TextLinkWithRef from './TextLink'; function FocusModeNotification() { + const styles = useThemeStyles(); const {environmentURL} = useEnvironment(); const {translate} = useLocalize(); - const styles = useThemeStyles(); useEffect(() => { User.updateChatPriorityMode(CONST.PRIORITY_MODE.GSD, true); }, []); diff --git a/src/components/Form.js b/src/components/Form.js index e129ad7f9209..7b6f587e7bd1 100644 --- a/src/components/Form.js +++ b/src/components/Form.js @@ -4,13 +4,13 @@ import React, {forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, import {Keyboard, ScrollView, StyleSheet} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as ErrorUtils from '@libs/ErrorUtils'; import FormUtils from '@libs/FormUtils'; import * as ValidationUtils from '@libs/ValidationUtils'; import Visibility from '@libs/Visibility'; import stylePropTypes from '@styles/stylePropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as FormActions from '@userActions/FormActions'; import CONST from '@src/CONST'; import FormAlertWithSubmitButton from './FormAlertWithSubmitButton'; diff --git a/src/components/Form/FormWrapper.js b/src/components/Form/FormWrapper.js index 638b6e5f8d19..da34262a8af8 100644 --- a/src/components/Form/FormWrapper.js +++ b/src/components/Form/FormWrapper.js @@ -8,9 +8,9 @@ import FormSubmit from '@components/FormSubmit'; import refPropTypes from '@components/refPropTypes'; import SafeAreaConsumer from '@components/SafeAreaConsumer'; import ScrollViewWithContext from '@components/ScrollViewWithContext'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as ErrorUtils from '@libs/ErrorUtils'; import stylePropTypes from '@styles/stylePropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import errorsPropType from './errorsPropType'; const propTypes = { diff --git a/src/components/FormAlertWithSubmitButton.js b/src/components/FormAlertWithSubmitButton.js index 6886b6fdcaaf..86e88c27b388 100644 --- a/src/components/FormAlertWithSubmitButton.js +++ b/src/components/FormAlertWithSubmitButton.js @@ -2,7 +2,7 @@ import PropTypes from 'prop-types'; import React from 'react'; import {View} from 'react-native'; import _ from 'underscore'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import Button from './Button'; import FormAlertWrapper from './FormAlertWrapper'; diff --git a/src/components/FormAlertWrapper.js b/src/components/FormAlertWrapper.js index d6612f6ae688..6062ea8f7803 100644 --- a/src/components/FormAlertWrapper.js +++ b/src/components/FormAlertWrapper.js @@ -2,8 +2,8 @@ import PropTypes from 'prop-types'; import React from 'react'; import {View} from 'react-native'; import _ from 'underscore'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; -import useThemeStyles from '@styles/useThemeStyles'; import FormHelpMessage from './FormHelpMessage'; import networkPropTypes from './networkPropTypes'; import {withNetwork} from './OnyxProvider'; diff --git a/src/components/FormHelpMessage.tsx b/src/components/FormHelpMessage.tsx index 3d0b2df443f2..43709b51db44 100644 --- a/src/components/FormHelpMessage.tsx +++ b/src/components/FormHelpMessage.tsx @@ -1,9 +1,9 @@ import isEmpty from 'lodash/isEmpty'; import React from 'react'; import {StyleProp, View, ViewStyle} from 'react-native'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Localize from '@libs/Localize'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import Icon from './Icon'; import * as Expensicons from './Icon/Expensicons'; import Text from './Text'; diff --git a/src/components/FormScrollView.tsx b/src/components/FormScrollView.tsx index c2f01e1d0511..4646a534e750 100644 --- a/src/components/FormScrollView.tsx +++ b/src/components/FormScrollView.tsx @@ -1,6 +1,6 @@ import React, {ForwardedRef} from 'react'; import {ScrollView, ScrollViewProps} from 'react-native'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; type FormScrollViewProps = ScrollViewProps & { /** Form elements */ diff --git a/src/components/FullscreenLoadingIndicator.tsx b/src/components/FullscreenLoadingIndicator.tsx index fc0687f6da18..2b5f7b3ada72 100644 --- a/src/components/FullscreenLoadingIndicator.tsx +++ b/src/components/FullscreenLoadingIndicator.tsx @@ -1,7 +1,7 @@ import React from 'react'; import {ActivityIndicator, StyleProp, StyleSheet, View, ViewStyle} from 'react-native'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; type FullScreenLoadingIndicatorProps = { style?: StyleProp; diff --git a/src/components/GrowlNotification/GrowlNotificationContainer/index.js b/src/components/GrowlNotification/GrowlNotificationContainer/index.js index 82672edb14c2..ccc404d415d7 100644 --- a/src/components/GrowlNotification/GrowlNotificationContainer/index.js +++ b/src/components/GrowlNotification/GrowlNotificationContainer/index.js @@ -1,7 +1,7 @@ import React from 'react'; import {Animated} from 'react-native'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import growlNotificationContainerPropTypes from './growlNotificationContainerPropTypes'; const propTypes = { diff --git a/src/components/GrowlNotification/GrowlNotificationContainer/index.native.js b/src/components/GrowlNotification/GrowlNotificationContainer/index.native.js index 457a9dce66d9..207033f8fac2 100644 --- a/src/components/GrowlNotification/GrowlNotificationContainer/index.native.js +++ b/src/components/GrowlNotification/GrowlNotificationContainer/index.native.js @@ -1,8 +1,8 @@ import React from 'react'; import {Animated} from 'react-native'; import useSafeAreaInsets from '@hooks/useSafeAreaInsets'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import growlNotificationContainerPropTypes from './growlNotificationContainerPropTypes'; const propTypes = { diff --git a/src/components/GrowlNotification/index.js b/src/components/GrowlNotification/index.js index faf1ec9cfa16..bcb4a8703b94 100644 --- a/src/components/GrowlNotification/index.js +++ b/src/components/GrowlNotification/index.js @@ -5,10 +5,10 @@ import Icon from '@components/Icon'; import * as Expensicons from '@components/Icon/Expensicons'; import * as Pressables from '@components/Pressable'; import Text from '@components/Text'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Growl from '@libs/Growl'; import useNativeDriver from '@libs/useNativeDriver'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import GrowlNotificationContainer from './GrowlNotificationContainer'; diff --git a/src/components/HTMLEngineProvider/BaseHTMLEngineProvider.js b/src/components/HTMLEngineProvider/BaseHTMLEngineProvider.js index 9a2d7c673c5b..86ddf0a52bb3 100755 --- a/src/components/HTMLEngineProvider/BaseHTMLEngineProvider.js +++ b/src/components/HTMLEngineProvider/BaseHTMLEngineProvider.js @@ -2,9 +2,9 @@ import PropTypes from 'prop-types'; import React, {useMemo} from 'react'; import {defaultHTMLElementModels, RenderHTMLConfigProvider, TRenderEngineProvider} from 'react-native-render-html'; import _ from 'underscore'; +import useThemeStyles from '@hooks/useThemeStyles'; import convertToLTR from '@libs/convertToLTR'; -import singleFontFamily from '@styles/fontFamily/singleFontFamily'; -import useThemeStyles from '@styles/useThemeStyles'; +import singleFontFamily from '@styles/utils/fontFamily/singleFontFamily'; import * as HTMLEngineUtils from './htmlEngineUtils'; import htmlRenderers from './HTMLRenderers'; diff --git a/src/components/HTMLEngineProvider/HTMLRenderers/AnchorRenderer.js b/src/components/HTMLEngineProvider/HTMLRenderers/AnchorRenderer.js index 49642308a357..8fd907470c19 100644 --- a/src/components/HTMLEngineProvider/HTMLRenderers/AnchorRenderer.js +++ b/src/components/HTMLEngineProvider/HTMLRenderers/AnchorRenderer.js @@ -6,8 +6,8 @@ import AnchorForCommentsOnly from '@components/AnchorForCommentsOnly'; import * as HTMLEngineUtils from '@components/HTMLEngineProvider/htmlEngineUtils'; import Text from '@components/Text'; import useEnvironment from '@hooks/useEnvironment'; +import useThemeStyles from '@hooks/useThemeStyles'; import tryResolveUrlFromApiRoot from '@libs/tryResolveUrlFromApiRoot'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Link from '@userActions/Link'; import CONST from '@src/CONST'; import htmlRendererPropTypes from './htmlRendererPropTypes'; diff --git a/src/components/HTMLEngineProvider/HTMLRenderers/CodeRenderer.js b/src/components/HTMLEngineProvider/HTMLRenderers/CodeRenderer.js index 9d101b8a5190..1932eaaf8a4f 100644 --- a/src/components/HTMLEngineProvider/HTMLRenderers/CodeRenderer.js +++ b/src/components/HTMLEngineProvider/HTMLRenderers/CodeRenderer.js @@ -3,7 +3,7 @@ import {splitBoxModelStyle} from 'react-native-render-html'; import _ from 'underscore'; import * as HTMLEngineUtils from '@components/HTMLEngineProvider/htmlEngineUtils'; import InlineCodeBlock from '@components/InlineCodeBlock'; -import useStyleUtils from '@styles/useStyleUtils'; +import useStyleUtils from '@hooks/useStyleUtils'; import htmlRendererPropTypes from './htmlRendererPropTypes'; function CodeRenderer(props) { diff --git a/src/components/HTMLEngineProvider/HTMLRenderers/EditedRenderer.js b/src/components/HTMLEngineProvider/HTMLRenderers/EditedRenderer.js index e97d01808a6e..9ff5fdecae13 100644 --- a/src/components/HTMLEngineProvider/HTMLRenderers/EditedRenderer.js +++ b/src/components/HTMLEngineProvider/HTMLRenderers/EditedRenderer.js @@ -2,9 +2,8 @@ import React from 'react'; import _ from 'underscore'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import editedLabelStyles from '@styles/editedLabelStyles'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; import CONST from '@src/CONST'; import htmlRendererPropTypes from './htmlRendererPropTypes'; @@ -32,7 +31,7 @@ function EditedRenderer(props) { {...defaultRendererProps} fontSize={variables.fontSizeSmall} color={theme.textSupporting} - style={[editedLabelStyles, isPendingDelete && styles.offlineFeedback.deleted]} + style={[styles.editedLabelStyles, isPendingDelete && styles.offlineFeedback.deleted]} > {props.translate('reportActionCompose.edited')} diff --git a/src/components/HTMLEngineProvider/HTMLRenderers/ImageRenderer.js b/src/components/HTMLEngineProvider/HTMLRenderers/ImageRenderer.js index f5ecc106d629..05016a25394a 100644 --- a/src/components/HTMLEngineProvider/HTMLRenderers/ImageRenderer.js +++ b/src/components/HTMLEngineProvider/HTMLRenderers/ImageRenderer.js @@ -5,10 +5,10 @@ import PressableWithoutFocus from '@components/Pressable/PressableWithoutFocus'; import {ShowContextMenuContext, showContextMenuForReport} from '@components/ShowContextMenuContext'; import ThumbnailImage from '@components/ThumbnailImage'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; import * as ReportUtils from '@libs/ReportUtils'; import tryResolveUrlFromApiRoot from '@libs/tryResolveUrlFromApiRoot'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/components/HTMLEngineProvider/HTMLRenderers/MentionHereRenderer.js b/src/components/HTMLEngineProvider/HTMLRenderers/MentionHereRenderer.js index 82769598d84a..93ede229876d 100644 --- a/src/components/HTMLEngineProvider/HTMLRenderers/MentionHereRenderer.js +++ b/src/components/HTMLEngineProvider/HTMLRenderers/MentionHereRenderer.js @@ -2,7 +2,7 @@ import React from 'react'; import {TNodeChildrenRenderer} from 'react-native-render-html'; import _ from 'underscore'; import Text from '@components/Text'; -import useStyleUtils from '@styles/useStyleUtils'; +import useStyleUtils from '@hooks/useStyleUtils'; import htmlRendererPropTypes from './htmlRendererPropTypes'; function MentionHereRenderer(props) { diff --git a/src/components/HTMLEngineProvider/HTMLRenderers/MentionUserRenderer.js b/src/components/HTMLEngineProvider/HTMLRenderers/MentionUserRenderer.js index 14580bf90bfb..11ffabe4fe6a 100644 --- a/src/components/HTMLEngineProvider/HTMLRenderers/MentionUserRenderer.js +++ b/src/components/HTMLEngineProvider/HTMLRenderers/MentionUserRenderer.js @@ -8,13 +8,13 @@ import Text from '@components/Text'; import UserDetailsTooltip from '@components/UserDetailsTooltip'; import withCurrentUserPersonalDetails from '@components/withCurrentUserPersonalDetails'; import useLocalize from '@hooks/useLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as LocalePhoneNumber from '@libs/LocalePhoneNumber'; import Navigation from '@libs/Navigation/Navigation'; import * as PersonalDetailsUtils from '@libs/PersonalDetailsUtils'; import * as ReportUtils from '@libs/ReportUtils'; import personalDetailsPropType from '@pages/personalDetailsPropType'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ROUTES from '@src/ROUTES'; import htmlRendererPropTypes from './htmlRendererPropTypes'; diff --git a/src/components/HTMLEngineProvider/HTMLRenderers/PreRenderer/BasePreRenderer.js b/src/components/HTMLEngineProvider/HTMLRenderers/PreRenderer/BasePreRenderer.js index ea8d3858c49b..07954cc97a00 100644 --- a/src/components/HTMLEngineProvider/HTMLRenderers/PreRenderer/BasePreRenderer.js +++ b/src/components/HTMLEngineProvider/HTMLRenderers/PreRenderer/BasePreRenderer.js @@ -6,8 +6,8 @@ import htmlRendererPropTypes from '@components/HTMLEngineProvider/HTMLRenderers/ import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeedback'; import {ShowContextMenuContext, showContextMenuForReport} from '@components/ShowContextMenuContext'; import withLocalize from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as ReportUtils from '@libs/ReportUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/components/Header.tsx b/src/components/Header.tsx index 46fe1a25c920..c02f21d7c6f2 100644 --- a/src/components/Header.tsx +++ b/src/components/Header.tsx @@ -1,6 +1,6 @@ import React, {ReactElement} from 'react'; import {StyleProp, TextStyle, View} from 'react-native'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import EnvironmentBadge from './EnvironmentBadge'; import Text from './Text'; diff --git a/src/components/HeaderGap/index.desktop.tsx b/src/components/HeaderGap/index.desktop.tsx index 4ee252c0772d..3687bb2e6b02 100644 --- a/src/components/HeaderGap/index.desktop.tsx +++ b/src/components/HeaderGap/index.desktop.tsx @@ -1,6 +1,6 @@ import React, {memo} from 'react'; import {View} from 'react-native'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import type {HeaderGapProps, HeaderGapReturnType} from './types'; function HeaderGap({styles}: HeaderGapProps): HeaderGapReturnType { diff --git a/src/components/HeaderPageLayout.js b/src/components/HeaderPageLayout.js index 27c9656abd1a..9ef5d4f83a06 100644 --- a/src/components/HeaderPageLayout.js +++ b/src/components/HeaderPageLayout.js @@ -3,11 +3,11 @@ import React, {useMemo} from 'react'; import {ScrollView, View} from 'react-native'; import _ from 'underscore'; import useNetwork from '@hooks/useNetwork'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as Browser from '@libs/Browser'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import FixedFooter from './FixedFooter'; import HeaderWithBackButton from './HeaderWithBackButton'; import headerWithBackButtonPropTypes from './HeaderWithBackButton/headerWithBackButtonPropTypes'; diff --git a/src/components/HeaderWithBackButton/index.js b/src/components/HeaderWithBackButton/index.js index 9de8bd6a22c7..5c76d1665310 100755 --- a/src/components/HeaderWithBackButton/index.js +++ b/src/components/HeaderWithBackButton/index.js @@ -10,12 +10,12 @@ import ThreeDotsMenu from '@components/ThreeDotsMenu'; import Tooltip from '@components/Tooltip'; import useKeyboardState from '@hooks/useKeyboardState'; import useLocalize from '@hooks/useLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import useThrottledButtonState from '@hooks/useThrottledButtonState'; import useWaitForNavigation from '@hooks/useWaitForNavigation'; import getButtonState from '@libs/getButtonState'; import Navigation from '@libs/Navigation/Navigation'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ROUTES from '@src/ROUTES'; import headerWithBackButtonPropTypes from './headerWithBackButtonPropTypes'; diff --git a/src/components/Icon/BankIcons.ts b/src/components/Icon/BankIcons.ts index 5e4c0192ca86..5a843af6690b 100644 --- a/src/components/Icon/BankIcons.ts +++ b/src/components/Icon/BankIcons.ts @@ -1,7 +1,7 @@ import {SvgProps} from 'react-native-svg'; import GenericBank from '@assets/images/bankicons/generic-bank-account.svg'; import GenericBankCard from '@assets/images/cardicons/generic-bank-card.svg'; -import {type ThemeStyles} from '@styles/styles'; +import {type ThemeStyles} from '@styles/index'; import variables from '@styles/variables'; import CONST from '@src/CONST'; import {BankIcon, BankName, BankNameKey} from '@src/types/onyx/Bank'; diff --git a/src/components/Icon/svgs/LoungeAccessIcon.tsx b/src/components/Icon/svgs/LoungeAccessIcon.tsx index 48b140da3bc8..e57573c439f1 100644 --- a/src/components/Icon/svgs/LoungeAccessIcon.tsx +++ b/src/components/Icon/svgs/LoungeAccessIcon.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import Svg, {G, Path, Polygon} from 'react-native-svg'; -import useTheme from '@styles/themes/useTheme'; +import useTheme from '@hooks/useTheme'; type LoungeAccessIconProps = { /** The fill color for the icon. Can be hex, rgb, rgba, or valid react-native named color such as 'red' or 'blue'. */ diff --git a/src/components/IllustratedHeaderPageLayout.js b/src/components/IllustratedHeaderPageLayout.js index 0557c7a6ca7b..9980d8a7879a 100644 --- a/src/components/IllustratedHeaderPageLayout.js +++ b/src/components/IllustratedHeaderPageLayout.js @@ -1,7 +1,7 @@ import PropTypes from 'prop-types'; import React from 'react'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import HeaderPageLayout from './HeaderPageLayout'; import headerWithBackButtonPropTypes from './HeaderWithBackButton/headerWithBackButtonPropTypes'; import Lottie from './Lottie'; diff --git a/src/components/ImageView/index.js b/src/components/ImageView/index.js index 7ec5b0c33432..0db1f87cd704 100644 --- a/src/components/ImageView/index.js +++ b/src/components/ImageView/index.js @@ -4,9 +4,9 @@ import {View} from 'react-native'; import FullscreenLoadingIndicator from '@components/FullscreenLoadingIndicator'; import Image from '@components/Image'; import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeedback'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/components/ImageView/index.native.js b/src/components/ImageView/index.native.js index 5ebd03170d92..6c04a1c83ee5 100644 --- a/src/components/ImageView/index.native.js +++ b/src/components/ImageView/index.native.js @@ -5,8 +5,8 @@ import ImageZoom from 'react-native-image-pan-zoom'; import _ from 'underscore'; import FullscreenLoadingIndicator from '@components/FullscreenLoadingIndicator'; import Image from '@components/Image'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; /** diff --git a/src/components/ImageWithSizeCalculation.tsx b/src/components/ImageWithSizeCalculation.tsx index 82b4b4759112..cffbc8941388 100644 --- a/src/components/ImageWithSizeCalculation.tsx +++ b/src/components/ImageWithSizeCalculation.tsx @@ -2,8 +2,8 @@ import delay from 'lodash/delay'; import React, {useEffect, useRef, useState} from 'react'; import {StyleProp, View, ViewStyle} from 'react-native'; import {OnLoadEvent} from 'react-native-fast-image'; +import useThemeStyles from '@hooks/useThemeStyles'; import Log from '@libs/Log'; -import useThemeStyles from '@styles/useThemeStyles'; import FullscreenLoadingIndicator from './FullscreenLoadingIndicator'; import Image from './Image'; import RESIZE_MODES from './Image/resizeModes'; diff --git a/src/components/Indicator.tsx b/src/components/Indicator.tsx index 5332c4bd984f..7b7eae97fd86 100644 --- a/src/components/Indicator.tsx +++ b/src/components/Indicator.tsx @@ -2,10 +2,10 @@ import React from 'react'; import {StyleSheet, View} from 'react-native'; import {OnyxCollection, withOnyx} from 'react-native-onyx'; import {OnyxEntry} from 'react-native-onyx/lib/types'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as PolicyUtils from '@libs/PolicyUtils'; import * as UserUtils from '@libs/UserUtils'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as PaymentMethods from '@userActions/PaymentMethods'; import ONYXKEYS from '@src/ONYXKEYS'; import type {BankAccountList, FundList, LoginList, Policy, PolicyMembers, ReimbursementAccount, UserWallet, WalletTerms} from '@src/types/onyx'; diff --git a/src/components/InlineCodeBlock/WrappedText.tsx b/src/components/InlineCodeBlock/WrappedText.tsx index 6dbd17f18e2a..f0bb4e3ffd53 100644 --- a/src/components/InlineCodeBlock/WrappedText.tsx +++ b/src/components/InlineCodeBlock/WrappedText.tsx @@ -1,7 +1,7 @@ import React, {Fragment} from 'react'; import {StyleProp, TextStyle, View, ViewStyle} from 'react-native'; import Text from '@components/Text'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; import type ChildrenProps from '@src/types/utils/ChildrenProps'; diff --git a/src/components/InlineCodeBlock/index.native.tsx b/src/components/InlineCodeBlock/index.native.tsx index 308b88e76e88..3a70308fa0cc 100644 --- a/src/components/InlineCodeBlock/index.native.tsx +++ b/src/components/InlineCodeBlock/index.native.tsx @@ -1,6 +1,6 @@ import React from 'react'; import type {TText} from 'react-native-render-html'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import type InlineCodeBlockProps from './types'; import WrappedText from './WrappedText'; diff --git a/src/components/InlineSystemMessage.tsx b/src/components/InlineSystemMessage.tsx index 6e6423a19a35..bef4c21289d5 100644 --- a/src/components/InlineSystemMessage.tsx +++ b/src/components/InlineSystemMessage.tsx @@ -1,7 +1,7 @@ import React from 'react'; import {View} from 'react-native'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import Icon from './Icon'; import * as Expensicons from './Icon/Expensicons'; import Text from './Text'; diff --git a/src/components/InvertedFlatList/index.native.js b/src/components/InvertedFlatList/index.native.js index d52d5a6d08f7..59810cba62c4 100644 --- a/src/components/InvertedFlatList/index.native.js +++ b/src/components/InvertedFlatList/index.native.js @@ -1,5 +1,5 @@ import React, {forwardRef} from 'react'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import BaseInvertedFlatList from './BaseInvertedFlatList'; import CellRendererComponent from './CellRendererComponent'; diff --git a/src/components/LHNOptionsList/LHNOptionsList.js b/src/components/LHNOptionsList/LHNOptionsList.js index 8febd7f247d6..71b14b6fadcd 100644 --- a/src/components/LHNOptionsList/LHNOptionsList.js +++ b/src/components/LHNOptionsList/LHNOptionsList.js @@ -8,13 +8,13 @@ import _ from 'underscore'; import participantPropTypes from '@components/participantPropTypes'; import transactionPropTypes from '@components/transactionPropTypes'; import withCurrentReportID, {withCurrentReportIDDefaultProps, withCurrentReportIDPropTypes} from '@components/withCurrentReportID'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as ReportUtils from '@libs/ReportUtils'; import reportActionPropTypes from '@pages/home/report/reportActionPropTypes'; import reportPropTypes from '@pages/reportPropTypes'; import stylePropTypes from '@styles/stylePropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/LHNOptionsList/OptionRowLHN.js b/src/components/LHNOptionsList/OptionRowLHN.js index 9b7141249180..9e50c4b1690a 100644 --- a/src/components/LHNOptionsList/OptionRowLHN.js +++ b/src/components/LHNOptionsList/OptionRowLHN.js @@ -15,6 +15,9 @@ import SubscriptAvatar from '@components/SubscriptAvatar'; import Text from '@components/Text'; import Tooltip from '@components/Tooltip'; import useLocalize from '@hooks/useLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import DateUtils from '@libs/DateUtils'; import DomUtils from '@libs/DomUtils'; @@ -24,9 +27,6 @@ import ReportActionComposeFocusManager from '@libs/ReportActionComposeFocusManag import * as ReportUtils from '@libs/ReportUtils'; import * as ContextMenuActions from '@pages/home/report/ContextMenu/ContextMenuActions'; import * as ReportActionContextMenu from '@pages/home/report/ContextMenu/ReportActionContextMenu'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/components/LocalePicker.tsx b/src/components/LocalePicker.tsx index c04b0131744f..46adb1a4895e 100644 --- a/src/components/LocalePicker.tsx +++ b/src/components/LocalePicker.tsx @@ -1,8 +1,8 @@ import React from 'react'; import {OnyxEntry, withOnyx} from 'react-native-onyx'; import useLocalize from '@hooks/useLocalize'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as App from '@userActions/App'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/LocationErrorMessage/BaseLocationErrorMessage.js b/src/components/LocationErrorMessage/BaseLocationErrorMessage.js index 5c0552e6bce7..14601c7c4ba2 100644 --- a/src/components/LocationErrorMessage/BaseLocationErrorMessage.js +++ b/src/components/LocationErrorMessage/BaseLocationErrorMessage.js @@ -8,9 +8,9 @@ import Text from '@components/Text'; import TextLink from '@components/TextLink'; import Tooltip from '@components/Tooltip'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import colors from '@styles/colors'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; +import colors from '@styles/theme/colors'; import CONST from '@src/CONST'; import * as locationErrorMessagePropTypes from './locationErrorMessagePropTypes'; diff --git a/src/components/Lottie/Lottie.tsx b/src/components/Lottie/Lottie.tsx index 868eaf8cb95e..2bf7df056c4d 100644 --- a/src/components/Lottie/Lottie.tsx +++ b/src/components/Lottie/Lottie.tsx @@ -3,7 +3,7 @@ import React, {ForwardedRef, forwardRef} from 'react'; import {View} from 'react-native'; import DotLottieAnimation from '@components/LottieAnimations/types'; import useNetwork from '@hooks/useNetwork'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; type Props = { source: DotLottieAnimation; diff --git a/src/components/MagicCodeInput.js b/src/components/MagicCodeInput.js index 91430602a115..55a65237a691 100644 --- a/src/components/MagicCodeInput.js +++ b/src/components/MagicCodeInput.js @@ -4,10 +4,10 @@ import {StyleSheet, View} from 'react-native'; import {TapGestureHandler} from 'react-native-gesture-handler'; import _ from 'underscore'; import useNetwork from '@hooks/useNetwork'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Browser from '@libs/Browser'; import * as ValidationUtils from '@libs/ValidationUtils'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import FormHelpMessage from './FormHelpMessage'; import networkPropTypes from './networkPropTypes'; diff --git a/src/components/MapView/Direction.tsx b/src/components/MapView/Direction.tsx index ca4b26f2f2db..b3162149a48d 100644 --- a/src/components/MapView/Direction.tsx +++ b/src/components/MapView/Direction.tsx @@ -1,5 +1,5 @@ import Mapbox from '@rnmapbox/maps'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import {DirectionProps} from './MapViewTypes'; function Direction({coordinates}: DirectionProps) { diff --git a/src/components/MapView/Direction.website.tsx b/src/components/MapView/Direction.website.tsx index 9e5af2aa2b1d..f85bda125473 100644 --- a/src/components/MapView/Direction.website.tsx +++ b/src/components/MapView/Direction.website.tsx @@ -5,7 +5,7 @@ import React from 'react'; import {Layer, Source} from 'react-map-gl'; import {View} from 'react-native'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import {DirectionProps} from './MapViewTypes'; function Direction({coordinates}: DirectionProps) { diff --git a/src/components/MapView/MapView.tsx b/src/components/MapView/MapView.tsx index 91f9d9930079..7b3d73479dde 100644 --- a/src/components/MapView/MapView.tsx +++ b/src/components/MapView/MapView.tsx @@ -3,10 +3,10 @@ import Mapbox, {MapState, MarkerView, setAccessToken} from '@rnmapbox/maps'; import {forwardRef, memo, useCallback, useEffect, useImperativeHandle, useRef, useState} from 'react'; import {View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; +import useThemeStyles from '@hooks/useThemeStyles'; import setUserLocation from '@libs/actions/UserLocation'; import compose from '@libs/compose'; import getCurrentPosition from '@libs/getCurrentPosition'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import useLocalize from '@src/hooks/useLocalize'; import useNetwork from '@src/hooks/useNetwork'; diff --git a/src/components/MapView/MapView.website.tsx b/src/components/MapView/MapView.website.tsx index ecdb62efbe15..7910d7f93a29 100644 --- a/src/components/MapView/MapView.website.tsx +++ b/src/components/MapView/MapView.website.tsx @@ -9,9 +9,9 @@ import React, {forwardRef, useCallback, useEffect, useImperativeHandle, useState import Map, {MapRef, Marker} from 'react-map-gl'; import {View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import setUserLocation from '@userActions/UserLocation'; import CONST from '@src/CONST'; import useLocalize from '@src/hooks/useLocalize'; diff --git a/src/components/MapView/PendingMapView.tsx b/src/components/MapView/PendingMapView.tsx index 2acdb59d3782..0af816785e9a 100644 --- a/src/components/MapView/PendingMapView.tsx +++ b/src/components/MapView/PendingMapView.tsx @@ -4,7 +4,7 @@ import {View} from 'react-native'; import BlockingView from '@components/BlockingViews/BlockingView'; import Icon from '@components/Icon'; import * as Expensicons from '@components/Icon/Expensicons'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; import {PendingMapViewProps} from './MapViewTypes'; diff --git a/src/components/MentionSuggestions.tsx b/src/components/MentionSuggestions.tsx index b42540bacb13..f1daaaa229be 100644 --- a/src/components/MentionSuggestions.tsx +++ b/src/components/MentionSuggestions.tsx @@ -1,9 +1,9 @@ import React, {useCallback} from 'react'; import {View} from 'react-native'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import getStyledTextArray from '@libs/GetStyledTextArray'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import {Icon} from '@src/types/onyx/OnyxCommon'; import AutoCompleteSuggestions from './AutoCompleteSuggestions'; diff --git a/src/components/MenuItem.js b/src/components/MenuItem.js index 679e8853742d..b1f6b7f7319a 100644 --- a/src/components/MenuItem.js +++ b/src/components/MenuItem.js @@ -2,14 +2,14 @@ import ExpensiMark from 'expensify-common/lib/ExpensiMark'; import React, {useEffect, useMemo} from 'react'; import {View} from 'react-native'; import _ from 'underscore'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import ControlSelection from '@libs/ControlSelection'; import convertToLTR from '@libs/convertToLTR'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import getButtonState from '@libs/getButtonState'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import * as Session from '@userActions/Session'; import CONST from '@src/CONST'; diff --git a/src/components/MessagesRow.tsx b/src/components/MessagesRow.tsx index c0b0a7807deb..e019bd1aef30 100644 --- a/src/components/MessagesRow.tsx +++ b/src/components/MessagesRow.tsx @@ -1,8 +1,8 @@ import React from 'react'; import {StyleProp, View, ViewStyle} from 'react-native'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Localize from '@libs/Localize'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import {isEmptyObject} from '@src/types/utils/EmptyObject'; import DotIndicatorMessage from './DotIndicatorMessage'; diff --git a/src/components/Modal/BaseModal.tsx b/src/components/Modal/BaseModal.tsx index 1ea284b55280..89640c56f5ef 100644 --- a/src/components/Modal/BaseModal.tsx +++ b/src/components/Modal/BaseModal.tsx @@ -4,12 +4,12 @@ import ReactNativeModal from 'react-native-modal'; import ColorSchemeWrapper from '@components/ColorSchemeWrapper'; import usePrevious from '@hooks/usePrevious'; import useSafeAreaInsets from '@hooks/useSafeAreaInsets'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import ComposerFocusManager from '@libs/ComposerFocusManager'; import useNativeDriver from '@libs/useNativeDriver'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import * as Modal from '@userActions/Modal'; import CONST from '@src/CONST'; diff --git a/src/components/Modal/index.tsx b/src/components/Modal/index.tsx index bfc899f9c278..4269420dcd7f 100644 --- a/src/components/Modal/index.tsx +++ b/src/components/Modal/index.tsx @@ -1,8 +1,8 @@ import React, {useState} from 'react'; import withWindowDimensions from '@components/withWindowDimensions'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; import StatusBar from '@libs/StatusBar'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; import CONST from '@src/CONST'; import BaseModal from './BaseModal'; import BaseModalProps from './types'; diff --git a/src/components/MoneyReportHeader.js b/src/components/MoneyReportHeader.js index 9a1f59d64efa..f73ddef0dfa0 100644 --- a/src/components/MoneyReportHeader.js +++ b/src/components/MoneyReportHeader.js @@ -5,6 +5,7 @@ import {View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as CurrencyUtils from '@libs/CurrencyUtils'; import Navigation from '@libs/Navigation/Navigation'; @@ -12,7 +13,6 @@ import * as ReportUtils from '@libs/ReportUtils'; import iouReportPropTypes from '@pages/iouReportPropTypes'; import nextStepPropTypes from '@pages/nextStepPropTypes'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/MoneyReportHeaderStatusBar.js b/src/components/MoneyReportHeaderStatusBar.js index e693ce5e502b..687bc92ffbcd 100644 --- a/src/components/MoneyReportHeaderStatusBar.js +++ b/src/components/MoneyReportHeaderStatusBar.js @@ -1,9 +1,9 @@ import React, {useMemo} from 'react'; import {Text, View} from 'react-native'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as NextStepUtils from '@libs/NextStepUtils'; import nextStepPropTypes from '@pages/nextStepPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import RenderHTML from './RenderHTML'; diff --git a/src/components/MoneyRequestConfirmationList.js b/src/components/MoneyRequestConfirmationList.js index 1bd7b71c5aa3..65bffa9bffd6 100755 --- a/src/components/MoneyRequestConfirmationList.js +++ b/src/components/MoneyRequestConfirmationList.js @@ -9,6 +9,8 @@ import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; import useLocalize from '@hooks/useLocalize'; import usePermissions from '@hooks/usePermissions'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as CurrencyUtils from '@libs/CurrencyUtils'; import DistanceRequestUtils from '@libs/DistanceRequestUtils'; @@ -22,8 +24,6 @@ import * as ReceiptUtils from '@libs/ReceiptUtils'; import * as ReportUtils from '@libs/ReportUtils'; import * as TransactionUtils from '@libs/TransactionUtils'; import {iouDefaultProps, iouPropTypes} from '@pages/iou/propTypes'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/MoneyRequestHeader.js b/src/components/MoneyRequestHeader.js index 178163f6569f..488630dd0590 100644 --- a/src/components/MoneyRequestHeader.js +++ b/src/components/MoneyRequestHeader.js @@ -4,6 +4,7 @@ import React, {useCallback, useEffect, useState} from 'react'; import {View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import compose from '@libs/compose'; import * as HeaderUtils from '@libs/HeaderUtils'; @@ -13,7 +14,6 @@ import * as ReportUtils from '@libs/ReportUtils'; import * as TransactionUtils from '@libs/TransactionUtils'; import reportActionPropTypes from '@pages/home/report/reportActionPropTypes'; import iouReportPropTypes from '@pages/iouReportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/MoneyRequestHeaderStatusBar.js b/src/components/MoneyRequestHeaderStatusBar.js index e50b69cca1fe..530524af12b0 100644 --- a/src/components/MoneyRequestHeaderStatusBar.js +++ b/src/components/MoneyRequestHeaderStatusBar.js @@ -1,7 +1,7 @@ import PropTypes from 'prop-types'; import React from 'react'; import {View} from 'react-native'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import Text from './Text'; const propTypes = { diff --git a/src/components/MoneyRequestSkeletonView.tsx b/src/components/MoneyRequestSkeletonView.tsx index 3e175f000acd..e11e7bcecc07 100644 --- a/src/components/MoneyRequestSkeletonView.tsx +++ b/src/components/MoneyRequestSkeletonView.tsx @@ -1,7 +1,7 @@ import React from 'react'; import {Rect} from 'react-native-svg'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; import SkeletonViewContentLoader from './SkeletonViewContentLoader'; diff --git a/src/components/MoneyTemporaryForRefactorRequestConfirmationList.js b/src/components/MoneyTemporaryForRefactorRequestConfirmationList.js index a85322978b33..5c7ea712e772 100755 --- a/src/components/MoneyTemporaryForRefactorRequestConfirmationList.js +++ b/src/components/MoneyTemporaryForRefactorRequestConfirmationList.js @@ -7,6 +7,8 @@ import {View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as CurrencyUtils from '@libs/CurrencyUtils'; import DistanceRequestUtils from '@libs/DistanceRequestUtils'; @@ -19,8 +21,6 @@ import * as PolicyUtils from '@libs/PolicyUtils'; import * as ReceiptUtils from '@libs/ReceiptUtils'; import * as ReportUtils from '@libs/ReportUtils'; import * as TransactionUtils from '@libs/TransactionUtils'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/MultipleAvatars.tsx b/src/components/MultipleAvatars.tsx index a7b22a663e08..997e63cb022f 100644 --- a/src/components/MultipleAvatars.tsx +++ b/src/components/MultipleAvatars.tsx @@ -1,10 +1,10 @@ import React, {memo, useMemo} from 'react'; import {StyleProp, View, ViewStyle} from 'react-native'; import {ValueOf} from 'type-fest'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import {AvatarSource} from '@libs/UserUtils'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import CONST from '@src/CONST'; import type {Icon} from '@src/types/onyx/OnyxCommon'; diff --git a/src/components/OfflineIndicator.tsx b/src/components/OfflineIndicator.tsx index b402caa2c750..739befa7d081 100644 --- a/src/components/OfflineIndicator.tsx +++ b/src/components/OfflineIndicator.tsx @@ -2,8 +2,8 @@ import React, {useMemo} from 'react'; import {StyleProp, View, ViewStyle} from 'react-native'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import Icon from './Icon'; import * as Expensicons from './Icon/Expensicons'; diff --git a/src/components/OfflineWithFeedback.tsx b/src/components/OfflineWithFeedback.tsx index 78c93c250f84..5fcf1fe7442b 100644 --- a/src/components/OfflineWithFeedback.tsx +++ b/src/components/OfflineWithFeedback.tsx @@ -1,9 +1,9 @@ import React, {useCallback} from 'react'; import {ImageStyle, StyleProp, TextStyle, View, ViewStyle} from 'react-native'; import useNetwork from '@hooks/useNetwork'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import shouldRenderOffscreen from '@libs/shouldRenderOffscreen'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import * as OnyxCommon from '@src/types/onyx/OnyxCommon'; import ChildrenProps from '@src/types/utils/ChildrenProps'; diff --git a/src/components/Onfido/BaseOnfidoWeb.js b/src/components/Onfido/BaseOnfidoWeb.js index 7a3b90945a5c..09ec96cf5b1e 100644 --- a/src/components/Onfido/BaseOnfidoWeb.js +++ b/src/components/Onfido/BaseOnfidoWeb.js @@ -3,10 +3,10 @@ import * as OnfidoSDK from 'onfido-sdk-ui'; import React, {forwardRef, useEffect} from 'react'; import _ from 'underscore'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; import Log from '@libs/Log'; -import fontFamily from '@styles/fontFamily'; -import fontWeightBold from '@styles/fontWeight/bold'; -import useTheme from '@styles/themes/useTheme'; +import fontFamily from '@styles/utils/fontFamily'; +import fontWeightBold from '@styles/utils/fontWeight/bold'; import variables from '@styles/variables'; import CONST from '@src/CONST'; import './index.css'; diff --git a/src/components/OptionRow.js b/src/components/OptionRow.js index 24f109112679..1a8c395ddd8b 100644 --- a/src/components/OptionRow.js +++ b/src/components/OptionRow.js @@ -3,11 +3,11 @@ import PropTypes from 'prop-types'; import React, {useEffect, useRef, useState} from 'react'; import {InteractionManager, StyleSheet, View} from 'react-native'; import _ from 'underscore'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as ReportUtils from '@libs/ReportUtils'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import Button from './Button'; import DisplayNames from './DisplayNames'; diff --git a/src/components/OptionsList/BaseOptionsList.js b/src/components/OptionsList/BaseOptionsList.js index 31bc4d4070af..d22df00bd0b3 100644 --- a/src/components/OptionsList/BaseOptionsList.js +++ b/src/components/OptionsList/BaseOptionsList.js @@ -7,7 +7,7 @@ import OptionsListSkeletonView from '@components/OptionsListSkeletonView'; import SectionList from '@components/SectionList'; import Text from '@components/Text'; import usePrevious from '@hooks/usePrevious'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; import CONST from '@src/CONST'; import {defaultProps as optionsListDefaultProps, propTypes as optionsListPropTypes} from './optionsListPropTypes'; diff --git a/src/components/PDFView/PDFInfoMessage.js b/src/components/PDFView/PDFInfoMessage.js index 9ec53b2ae375..7c234b19daa5 100644 --- a/src/components/PDFView/PDFInfoMessage.js +++ b/src/components/PDFView/PDFInfoMessage.js @@ -6,7 +6,7 @@ import * as Expensicons from '@components/Icon/Expensicons'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; const propTypes = { diff --git a/src/components/PDFView/PDFPasswordForm.js b/src/components/PDFView/PDFPasswordForm.js index 2c33d8d93a31..42d2ebbb771e 100644 --- a/src/components/PDFView/PDFPasswordForm.js +++ b/src/components/PDFView/PDFPasswordForm.js @@ -6,10 +6,10 @@ import Button from '@components/Button'; import Text from '@components/Text'; import TextInput from '@components/TextInput'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as Browser from '@libs/Browser'; import shouldDelayFocus from '@libs/shouldDelayFocus'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import PDFInfoMessage from './PDFInfoMessage'; diff --git a/src/components/ParentNavigationSubtitle.tsx b/src/components/ParentNavigationSubtitle.tsx index c12cefe6bead..b3f1653fda1a 100644 --- a/src/components/ParentNavigationSubtitle.tsx +++ b/src/components/ParentNavigationSubtitle.tsx @@ -1,8 +1,8 @@ import React from 'react'; import {StyleProp, ViewStyle} from 'react-native'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import {ParentNavigationSummaryParams} from '@src/languages/types'; import ROUTES from '@src/ROUTES'; diff --git a/src/components/Picker/BasePicker.tsx b/src/components/Picker/BasePicker.tsx index dfb2d6332da5..6f587f350b79 100644 --- a/src/components/Picker/BasePicker.tsx +++ b/src/components/Picker/BasePicker.tsx @@ -7,8 +7,8 @@ import Icon from '@components/Icon'; import * as Expensicons from '@components/Icon/Expensicons'; import Text from '@components/Text'; import useScrollContext from '@hooks/useScrollContext'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import type {BasePickerHandle, BasePickerProps} from './types'; type IconToRender = () => ReactElement; diff --git a/src/components/PinButton.js b/src/components/PinButton.js index 4b336b1d71d4..182e49054100 100644 --- a/src/components/PinButton.js +++ b/src/components/PinButton.js @@ -1,7 +1,7 @@ import React from 'react'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import reportPropTypes from '@pages/reportPropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Report from '@userActions/Report'; import * as Session from '@userActions/Session'; import CONST from '@src/CONST'; diff --git a/src/components/PopoverMenu/index.js b/src/components/PopoverMenu/index.js index 2106efb9d31e..1bb50dfbd89e 100644 --- a/src/components/PopoverMenu/index.js +++ b/src/components/PopoverMenu/index.js @@ -9,8 +9,8 @@ import Text from '@components/Text'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; import useArrowKeyFocusManager from '@hooks/useArrowKeyFocusManager'; import useKeyboardShortcut from '@hooks/useKeyboardShortcut'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import {defaultProps as createMenuDefaultProps, propTypes as createMenuPropTypes} from './popoverMenuPropTypes'; diff --git a/src/components/PopoverWithMeasuredContent.js b/src/components/PopoverWithMeasuredContent.js index b2c94c81770f..7de5be113e53 100644 --- a/src/components/PopoverWithMeasuredContent.js +++ b/src/components/PopoverWithMeasuredContent.js @@ -2,9 +2,9 @@ import PropTypes from 'prop-types'; import React, {useMemo, useState} from 'react'; import {View} from 'react-native'; import _ from 'underscore'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; -import PopoverWithMeasuredContentStyleUtils from '@styles/PopoverWithMeasuredContentStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; +import PopoverWithMeasuredContentUtils from '@libs/PopoverWithMeasuredContentUtils'; import CONST from '@src/CONST'; import Popover from './Popover'; import {defaultProps as defaultPopoverProps, propTypes as popoverPropTypes} from './Popover/popoverPropTypes'; @@ -128,8 +128,8 @@ function PopoverWithMeasuredContent(props) { }; }, [props.anchorPosition, props.anchorAlignment, popoverWidth, popoverHeight]); - const horizontalShift = PopoverWithMeasuredContentStyleUtils.computeHorizontalShift(adjustedAnchorPosition.left, popoverWidth, windowWidth); - const verticalShift = PopoverWithMeasuredContentStyleUtils.computeVerticalShift(adjustedAnchorPosition.top, popoverHeight, windowHeight); + const horizontalShift = PopoverWithMeasuredContentUtils.computeHorizontalShift(adjustedAnchorPosition.left, popoverWidth, windowWidth); + const verticalShift = PopoverWithMeasuredContentUtils.computeVerticalShift(adjustedAnchorPosition.top, popoverHeight, windowHeight); const shiftedAnchorPosition = { left: adjustedAnchorPosition.left + horizontalShift, bottom: windowHeight - (adjustedAnchorPosition.top + popoverHeight) - verticalShift, diff --git a/src/components/PopoverWithoutOverlay/index.js b/src/components/PopoverWithoutOverlay/index.js index c13d9e1a0931..43ca1c0de818 100644 --- a/src/components/PopoverWithoutOverlay/index.js +++ b/src/components/PopoverWithoutOverlay/index.js @@ -5,8 +5,8 @@ import {defaultProps, propTypes} from '@components/Popover/popoverPropTypes'; import {PopoverContext} from '@components/PopoverProvider'; import withWindowDimensions from '@components/withWindowDimensions'; import useSafeAreaInsets from '@hooks/useSafeAreaInsets'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Modal from '@userActions/Modal'; function Popover(props) { diff --git a/src/components/Pressable/GenericPressable/BaseGenericPressable.tsx b/src/components/Pressable/GenericPressable/BaseGenericPressable.tsx index 0d0ed33d5138..0a9f544bcee1 100644 --- a/src/components/Pressable/GenericPressable/BaseGenericPressable.tsx +++ b/src/components/Pressable/GenericPressable/BaseGenericPressable.tsx @@ -2,11 +2,11 @@ import React, {ForwardedRef, forwardRef, useCallback, useEffect, useMemo} from ' // eslint-disable-next-line no-restricted-imports import {GestureResponderEvent, Pressable, View} from 'react-native'; import useSingleExecution from '@hooks/useSingleExecution'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import Accessibility from '@libs/Accessibility'; import HapticFeedback from '@libs/HapticFeedback'; import KeyboardShortcut from '@libs/KeyboardShortcut'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import PressableProps, {PressableRef} from './types'; diff --git a/src/components/Pressable/PressableWithDelayToggle.tsx b/src/components/Pressable/PressableWithDelayToggle.tsx index ec9e54c83b7e..e768f0d0b3fa 100644 --- a/src/components/Pressable/PressableWithDelayToggle.tsx +++ b/src/components/Pressable/PressableWithDelayToggle.tsx @@ -6,10 +6,10 @@ import Icon from '@components/Icon'; import * as Expensicons from '@components/Icon/Expensicons'; import Text from '@components/Text'; import Tooltip from '@components/Tooltip'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import useThrottledButtonState from '@hooks/useThrottledButtonState'; import getButtonState from '@libs/getButtonState'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import PressableProps, {PressableRef} from './GenericPressable/types'; import PressableWithoutFeedback from './PressableWithoutFeedback'; diff --git a/src/components/PressableWithSecondaryInteraction/index.tsx b/src/components/PressableWithSecondaryInteraction/index.tsx index 437123dbe952..0cb53e40325a 100644 --- a/src/components/PressableWithSecondaryInteraction/index.tsx +++ b/src/components/PressableWithSecondaryInteraction/index.tsx @@ -2,9 +2,9 @@ import React, {forwardRef, useEffect, useRef} from 'react'; import {GestureResponderEvent} from 'react-native'; import {PressableRef} from '@components/Pressable/GenericPressable/types'; import PressableWithFeedback from '@components/Pressable/PressableWithFeedback'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import PressableWithSecondaryInteractionProps from './types'; /** This is a special Pressable that calls onSecondaryInteraction when LongPressed, or right-clicked. */ diff --git a/src/components/QRCode.tsx b/src/components/QRCode.tsx index 5363281ddc67..99a3a1f64118 100644 --- a/src/components/QRCode.tsx +++ b/src/components/QRCode.tsx @@ -1,7 +1,7 @@ import React, {Ref} from 'react'; import {ImageSourcePropType} from 'react-native'; import QRCodeLibrary from 'react-native-qrcode-svg'; -import useTheme from '@styles/themes/useTheme'; +import useTheme from '@hooks/useTheme'; import CONST from '@src/CONST'; type LogoRatio = typeof CONST.QR.DEFAULT_LOGO_SIZE_RATIO | typeof CONST.QR.EXPENSIFY_LOGO_SIZE_RATIO; diff --git a/src/components/QRShare/index.js b/src/components/QRShare/index.js index f7bb5cb5f788..f644db844e53 100644 --- a/src/components/QRShare/index.js +++ b/src/components/QRShare/index.js @@ -4,8 +4,8 @@ import _ from 'underscore'; import ExpensifyWordmark from '@assets/images/expensify-wordmark.svg'; import QRCode from '@components/QRCode'; import Text from '@components/Text'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; import {qrShareDefaultProps, qrSharePropTypes} from './propTypes'; diff --git a/src/components/RadioButton.tsx b/src/components/RadioButton.tsx index 68fcda6677c8..2d18ccb480b8 100644 --- a/src/components/RadioButton.tsx +++ b/src/components/RadioButton.tsx @@ -1,7 +1,7 @@ import React from 'react'; import {View} from 'react-native'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; import Icon from './Icon'; import * as Expensicons from './Icon/Expensicons'; diff --git a/src/components/RadioButtonWithLabel.tsx b/src/components/RadioButtonWithLabel.tsx index 7d8df23bae49..4c223262ac50 100644 --- a/src/components/RadioButtonWithLabel.tsx +++ b/src/components/RadioButtonWithLabel.tsx @@ -1,6 +1,6 @@ import React, {ComponentType} from 'react'; import {StyleProp, View, ViewStyle} from 'react-native'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import FormHelpMessage from './FormHelpMessage'; import * as Pressables from './Pressable'; import RadioButton from './RadioButton'; diff --git a/src/components/RadioButtons.tsx b/src/components/RadioButtons.tsx index b83710bd85bf..8aa3ef7e8ffe 100644 --- a/src/components/RadioButtons.tsx +++ b/src/components/RadioButtons.tsx @@ -1,5 +1,5 @@ import React, {useState} from 'react'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import RadioButtonWithLabel from './RadioButtonWithLabel'; type Choice = { diff --git a/src/components/Reactions/AddReactionBubble.js b/src/components/Reactions/AddReactionBubble.js index 128eafd51ee8..61ad4ce76d64 100644 --- a/src/components/Reactions/AddReactionBubble.js +++ b/src/components/Reactions/AddReactionBubble.js @@ -7,9 +7,9 @@ import PressableWithFeedback from '@components/Pressable/PressableWithFeedback'; import Text from '@components/Text'; import Tooltip from '@components/Tooltip/PopoverAnchorTooltip'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import getButtonState from '@libs/getButtonState'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import * as EmojiPickerAction from '@userActions/EmojiPickerAction'; import * as Session from '@userActions/Session'; diff --git a/src/components/Reactions/EmojiReactionBubble.js b/src/components/Reactions/EmojiReactionBubble.js index 7ec72468ee91..3fd22a758f67 100644 --- a/src/components/Reactions/EmojiReactionBubble.js +++ b/src/components/Reactions/EmojiReactionBubble.js @@ -4,8 +4,8 @@ import PressableWithSecondaryInteraction from '@components/PressableWithSecondar import Text from '@components/Text'; import {withCurrentUserPersonalDetailsDefaultProps} from '@components/withCurrentUserPersonalDetails'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/components/Reactions/MiniQuickEmojiReactions.js b/src/components/Reactions/MiniQuickEmojiReactions.js index 92913a7c4c5e..34d336887031 100644 --- a/src/components/Reactions/MiniQuickEmojiReactions.js +++ b/src/components/Reactions/MiniQuickEmojiReactions.js @@ -8,11 +8,11 @@ import Icon from '@components/Icon'; import * as Expensicons from '@components/Icon/Expensicons'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as EmojiUtils from '@libs/EmojiUtils'; import getButtonState from '@libs/getButtonState'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as EmojiPickerAction from '@userActions/EmojiPickerAction'; import * as Session from '@userActions/Session'; import CONST from '@src/CONST'; diff --git a/src/components/Reactions/QuickEmojiReactions/BaseQuickEmojiReactions.js b/src/components/Reactions/QuickEmojiReactions/BaseQuickEmojiReactions.js index 9d32b0240a23..c932632f7bff 100644 --- a/src/components/Reactions/QuickEmojiReactions/BaseQuickEmojiReactions.js +++ b/src/components/Reactions/QuickEmojiReactions/BaseQuickEmojiReactions.js @@ -7,8 +7,8 @@ import AddReactionBubble from '@components/Reactions/AddReactionBubble'; import EmojiReactionBubble from '@components/Reactions/EmojiReactionBubble'; import EmojiReactionsPropTypes from '@components/Reactions/EmojiReactionsPropTypes'; import Tooltip from '@components/Tooltip'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as EmojiUtils from '@libs/EmojiUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Session from '@userActions/Session'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/Reactions/ReactionTooltipContent.js b/src/components/Reactions/ReactionTooltipContent.js index 1a7a06e9487d..bb6b03c5918b 100644 --- a/src/components/Reactions/ReactionTooltipContent.js +++ b/src/components/Reactions/ReactionTooltipContent.js @@ -5,8 +5,8 @@ import _ from 'underscore'; import Text from '@components/Text'; import {withCurrentUserPersonalDetailsDefaultProps, withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails'; import withLocalize from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as PersonalDetailsUtils from '@libs/PersonalDetailsUtils'; -import useThemeStyles from '@styles/useThemeStyles'; const propTypes = { /** diff --git a/src/components/Reactions/ReportActionItemEmojiReactions.js b/src/components/Reactions/ReportActionItemEmojiReactions.js index 7c504e35cb9f..547f4089857f 100644 --- a/src/components/Reactions/ReportActionItemEmojiReactions.js +++ b/src/components/Reactions/ReportActionItemEmojiReactions.js @@ -7,11 +7,11 @@ import OfflineWithFeedback from '@components/OfflineWithFeedback'; import Tooltip from '@components/Tooltip'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultProps, withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails'; import withLocalize from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as EmojiUtils from '@libs/EmojiUtils'; import reportActionPropTypes from '@pages/home/report/reportActionPropTypes'; import {ReactionListContext} from '@pages/home/ReportScreenContext'; -import useThemeStyles from '@styles/useThemeStyles'; import AddReactionBubble from './AddReactionBubble'; import EmojiReactionBubble from './EmojiReactionBubble'; import EmojiReactionsPropTypes from './EmojiReactionsPropTypes'; diff --git a/src/components/ReceiptEmptyState.js b/src/components/ReceiptEmptyState.js index 6af1cadd48c5..371518dd9a77 100644 --- a/src/components/ReceiptEmptyState.js +++ b/src/components/ReceiptEmptyState.js @@ -1,6 +1,6 @@ import PropTypes from 'prop-types'; import React from 'react'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; import Icon from './Icon'; import * as Expensicons from './Icon/Expensicons'; diff --git a/src/components/ReimbursementAccountLoadingIndicator.js b/src/components/ReimbursementAccountLoadingIndicator.js index 72bf3ce1896d..bc0e70e64419 100644 --- a/src/components/ReimbursementAccountLoadingIndicator.js +++ b/src/components/ReimbursementAccountLoadingIndicator.js @@ -2,7 +2,7 @@ import PropTypes from 'prop-types'; import React from 'react'; import {StyleSheet, View} from 'react-native'; import useLocalize from '@hooks/useLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import FullPageOfflineBlockingView from './BlockingViews/FullPageOfflineBlockingView'; import FullScreenLoadingIndicator from './FullscreenLoadingIndicator'; import HeaderWithBackButton from './HeaderWithBackButton'; diff --git a/src/components/ReportActionItem/ChronosOOOListActions.js b/src/components/ReportActionItem/ChronosOOOListActions.js index 7c918b6a2d9c..f90ae67796b9 100644 --- a/src/components/ReportActionItem/ChronosOOOListActions.js +++ b/src/components/ReportActionItem/ChronosOOOListActions.js @@ -7,9 +7,9 @@ import Button from '@components/Button'; import OfflineWithFeedback from '@components/OfflineWithFeedback'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import DateUtils from '@libs/DateUtils'; import reportActionPropTypes from '@pages/home/report/reportActionPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Chronos from '@userActions/Chronos'; const propTypes = { diff --git a/src/components/ReportActionItem/MoneyReportView.js b/src/components/ReportActionItem/MoneyReportView.js index c52d4abe371c..c12659e94673 100644 --- a/src/components/ReportActionItem/MoneyReportView.js +++ b/src/components/ReportActionItem/MoneyReportView.js @@ -7,13 +7,13 @@ import SpacerView from '@components/SpacerView'; import Text from '@components/Text'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; import useLocalize from '@hooks/useLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as CurrencyUtils from '@libs/CurrencyUtils'; import * as ReportUtils from '@libs/ReportUtils'; import AnimatedEmptyStateBackground from '@pages/home/report/AnimatedEmptyStateBackground'; import reportPropTypes from '@pages/reportPropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; const propTypes = { diff --git a/src/components/ReportActionItem/MoneyRequestAction.js b/src/components/ReportActionItem/MoneyRequestAction.js index 040682990d2c..e0a3152a41b4 100644 --- a/src/components/ReportActionItem/MoneyRequestAction.js +++ b/src/components/ReportActionItem/MoneyRequestAction.js @@ -8,6 +8,7 @@ import {withNetwork} from '@components/OnyxProvider'; import refPropTypes from '@components/refPropTypes'; import RenderHTML from '@components/RenderHTML'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as IOUUtils from '@libs/IOUUtils'; import Navigation from '@libs/Navigation/Navigation'; @@ -17,7 +18,6 @@ import * as ReportUtils from '@libs/ReportUtils'; import reportActionPropTypes from '@pages/home/report/reportActionPropTypes'; import iouReportPropTypes from '@pages/iouReportPropTypes'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Report from '@userActions/Report'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/ReportActionItem/MoneyRequestPreview.js b/src/components/ReportActionItem/MoneyRequestPreview.js index 210a0575a310..3bfa20023ac2 100644 --- a/src/components/ReportActionItem/MoneyRequestPreview.js +++ b/src/components/ReportActionItem/MoneyRequestPreview.js @@ -15,6 +15,9 @@ import {showContextMenuForReport} from '@components/ShowContextMenuContext'; import Text from '@components/Text'; import transactionPropTypes from '@components/transactionPropTypes'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import compose from '@libs/compose'; import ControlSelection from '@libs/ControlSelection'; @@ -28,9 +31,6 @@ import * as ReportUtils from '@libs/ReportUtils'; import * as TransactionUtils from '@libs/TransactionUtils'; import walletTermsPropTypes from '@pages/EnablePayments/walletTermsPropTypes'; import reportActionPropTypes from '@pages/home/report/reportActionPropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as PaymentMethods from '@userActions/PaymentMethods'; import * as Report from '@userActions/Report'; import CONST from '@src/CONST'; diff --git a/src/components/ReportActionItem/MoneyRequestView.js b/src/components/ReportActionItem/MoneyRequestView.js index 1afc909b54df..817c88d456db 100644 --- a/src/components/ReportActionItem/MoneyRequestView.js +++ b/src/components/ReportActionItem/MoneyRequestView.js @@ -17,6 +17,9 @@ import transactionPropTypes from '@components/transactionPropTypes'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails'; import useLocalize from '@hooks/useLocalize'; import usePermissions from '@hooks/usePermissions'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as CardUtils from '@libs/CardUtils'; import compose from '@libs/compose'; @@ -32,9 +35,6 @@ import AnimatedEmptyStateBackground from '@pages/home/report/AnimatedEmptyStateB import reportActionPropTypes from '@pages/home/report/reportActionPropTypes'; import iouReportPropTypes from '@pages/iouReportPropTypes'; import reportPropTypes from '@pages/reportPropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/ReportActionItem/RenameAction.js b/src/components/ReportActionItem/RenameAction.js index b4f4b23c9ebf..52039b7b593b 100644 --- a/src/components/ReportActionItem/RenameAction.js +++ b/src/components/ReportActionItem/RenameAction.js @@ -4,9 +4,9 @@ import React from 'react'; import Text from '@components/Text'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import reportActionPropTypes from '@pages/home/report/reportActionPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; const propTypes = { /** All the data of the action */ diff --git a/src/components/ReportActionItem/ReportActionItemImage.js b/src/components/ReportActionItem/ReportActionItemImage.js index 534a92dae830..2c5ef22b1b8e 100644 --- a/src/components/ReportActionItem/ReportActionItemImage.js +++ b/src/components/ReportActionItem/ReportActionItemImage.js @@ -10,9 +10,9 @@ import {ShowContextMenuContext} from '@components/ShowContextMenuContext'; import ThumbnailImage from '@components/ThumbnailImage'; import transactionPropTypes from '@components/transactionPropTypes'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as TransactionUtils from '@libs/TransactionUtils'; import tryResolveUrlFromApiRoot from '@libs/tryResolveUrlFromApiRoot'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/components/ReportActionItem/ReportActionItemImages.js b/src/components/ReportActionItem/ReportActionItemImages.js index b20513d63fe3..96f919aea750 100644 --- a/src/components/ReportActionItem/ReportActionItemImages.js +++ b/src/components/ReportActionItem/ReportActionItemImages.js @@ -5,9 +5,9 @@ import {Polygon, Svg} from 'react-native-svg'; import _ from 'underscore'; import Text from '@components/Text'; import transactionPropTypes from '@components/transactionPropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; import ReportActionItemImage from './ReportActionItemImage'; diff --git a/src/components/ReportActionItem/ReportPreview.js b/src/components/ReportActionItem/ReportPreview.js index e6b387f362ef..aa3c02b76fc0 100644 --- a/src/components/ReportActionItem/ReportPreview.js +++ b/src/components/ReportActionItem/ReportPreview.js @@ -14,6 +14,8 @@ import {showContextMenuForReport} from '@components/ShowContextMenuContext'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import ControlSelection from '@libs/ControlSelection'; import * as CurrencyUtils from '@libs/CurrencyUtils'; @@ -25,8 +27,6 @@ import * as ReportUtils from '@libs/ReportUtils'; import * as TransactionUtils from '@libs/TransactionUtils'; import reportActionPropTypes from '@pages/home/report/reportActionPropTypes'; import reportPropTypes from '@pages/reportPropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/ReportActionItem/TaskAction.js b/src/components/ReportActionItem/TaskAction.js index d79bb6f78b93..5825d623a5ca 100644 --- a/src/components/ReportActionItem/TaskAction.js +++ b/src/components/ReportActionItem/TaskAction.js @@ -3,8 +3,8 @@ import React from 'react'; import {View} from 'react-native'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as TaskUtils from '@libs/TaskUtils'; -import useThemeStyles from '@styles/useThemeStyles'; const propTypes = { /** Name of the reportAction action */ diff --git a/src/components/ReportActionItem/TaskPreview.js b/src/components/ReportActionItem/TaskPreview.js index 3b04364ee69a..ed875bb04af2 100644 --- a/src/components/ReportActionItem/TaskPreview.js +++ b/src/components/ReportActionItem/TaskPreview.js @@ -14,6 +14,8 @@ import RenderHTML from '@components/RenderHTML'; import {showContextMenuForReport} from '@components/ShowContextMenuContext'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultProps, withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import ControlSelection from '@libs/ControlSelection'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; @@ -23,8 +25,6 @@ import Navigation from '@libs/Navigation/Navigation'; import * as ReportUtils from '@libs/ReportUtils'; import * as TaskUtils from '@libs/TaskUtils'; import reportActionPropTypes from '@pages/home/report/reportActionPropTypes'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Session from '@userActions/Session'; import * as Task from '@userActions/Task'; import CONST from '@src/CONST'; diff --git a/src/components/ReportActionItem/TaskView.js b/src/components/ReportActionItem/TaskView.js index ea02dba705a6..bb8945495018 100644 --- a/src/components/ReportActionItem/TaskView.js +++ b/src/components/ReportActionItem/TaskView.js @@ -17,6 +17,8 @@ import Text from '@components/Text'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions from '@components/withWindowDimensions'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import convertToLTR from '@libs/convertToLTR'; import getButtonState from '@libs/getButtonState'; @@ -24,8 +26,6 @@ import Navigation from '@libs/Navigation/Navigation'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as ReportUtils from '@libs/ReportUtils'; import reportPropTypes from '@pages/reportPropTypes'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Session from '@userActions/Session'; import * as Task from '@userActions/Task'; import CONST from '@src/CONST'; diff --git a/src/components/ReportActionsSkeletonView/SkeletonViewLines.tsx b/src/components/ReportActionsSkeletonView/SkeletonViewLines.tsx index 3451e13298b3..c4c2a3f43eb3 100644 --- a/src/components/ReportActionsSkeletonView/SkeletonViewLines.tsx +++ b/src/components/ReportActionsSkeletonView/SkeletonViewLines.tsx @@ -1,8 +1,8 @@ import React from 'react'; import {Circle, Rect} from 'react-native-svg'; import SkeletonViewContentLoader from '@components/SkeletonViewContentLoader'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; type SkeletonViewLinesProps = { diff --git a/src/components/ReportHeaderSkeletonView.tsx b/src/components/ReportHeaderSkeletonView.tsx index fc739b5d06d8..91adb26faff5 100644 --- a/src/components/ReportHeaderSkeletonView.tsx +++ b/src/components/ReportHeaderSkeletonView.tsx @@ -2,9 +2,9 @@ import React from 'react'; import {View} from 'react-native'; import {Circle, Rect} from 'react-native-svg'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import CONST from '@src/CONST'; import Icon from './Icon'; diff --git a/src/components/ReportWelcomeText.js b/src/components/ReportWelcomeText.js index 6613517b2ed2..a204d0c59aaf 100644 --- a/src/components/ReportWelcomeText.js +++ b/src/components/ReportWelcomeText.js @@ -4,13 +4,13 @@ import React from 'react'; import {View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as PolicyUtils from '@libs/PolicyUtils'; import * as ReportUtils from '@libs/ReportUtils'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/components/RoomHeaderAvatars.js b/src/components/RoomHeaderAvatars.js index a51219122e0a..5a6363d4a642 100644 --- a/src/components/RoomHeaderAvatars.js +++ b/src/components/RoomHeaderAvatars.js @@ -2,10 +2,10 @@ import PropTypes from 'prop-types'; import React, {memo} from 'react'; import {View} from 'react-native'; import _ from 'underscore'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as UserUtils from '@libs/UserUtils'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import AttachmentModal from './AttachmentModal'; import Avatar from './Avatar'; diff --git a/src/components/SAMLLoadingIndicator.js b/src/components/SAMLLoadingIndicator.js index d6d061122eff..84f9098e564f 100644 --- a/src/components/SAMLLoadingIndicator.js +++ b/src/components/SAMLLoadingIndicator.js @@ -1,16 +1,17 @@ import React from 'react'; import {StyleSheet, View} from 'react-native'; import useLocalize from '@hooks/useLocalize'; -import themeColors from '@styles/themes/default'; -import useThemeStyles from '@styles/useThemeStyles'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import Icon from './Icon'; import * as Expensicons from './Icon/Expensicons'; import * as Illustrations from './Icon/Illustrations'; import Text from './Text'; function SAMLLoadingIndicator() { - const {translate} = useLocalize(); + const theme = useTheme(); const styles = useThemeStyles(); + const {translate} = useLocalize(); return ( @@ -30,7 +31,7 @@ function SAMLLoadingIndicator() { diff --git a/src/components/SafeArea/index.ios.tsx b/src/components/SafeArea/index.ios.tsx index 194919b3eef4..1b2e1881ade3 100644 --- a/src/components/SafeArea/index.ios.tsx +++ b/src/components/SafeArea/index.ios.tsx @@ -1,6 +1,6 @@ import React from 'react'; import {SafeAreaView} from 'react-native-safe-area-context'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import SafeAreaProps from './types'; function SafeArea({children}: SafeAreaProps) { diff --git a/src/components/SafeAreaConsumer/index.android.tsx b/src/components/SafeAreaConsumer/index.android.tsx index 5117000627cf..4e6c9bbd3528 100644 --- a/src/components/SafeAreaConsumer/index.android.tsx +++ b/src/components/SafeAreaConsumer/index.android.tsx @@ -1,8 +1,8 @@ import React from 'react'; // eslint-disable-next-line no-restricted-imports import {SafeAreaInsetsContext} from 'react-native-safe-area-context'; +import useStyleUtils from '@hooks/useStyleUtils'; import StatusBar from '@libs/StatusBar'; -import useStyleUtils from '@styles/useStyleUtils'; import SafeAreaConsumerProps from './types'; /** diff --git a/src/components/SafeAreaConsumer/index.tsx b/src/components/SafeAreaConsumer/index.tsx index 54c5d984be5f..c05e836a2348 100644 --- a/src/components/SafeAreaConsumer/index.tsx +++ b/src/components/SafeAreaConsumer/index.tsx @@ -1,7 +1,7 @@ import React from 'react'; // eslint-disable-next-line no-restricted-imports import {SafeAreaInsetsContext} from 'react-native-safe-area-context'; -import useStyleUtils from '@styles/useStyleUtils'; +import useStyleUtils from '@hooks/useStyleUtils'; import SafeAreaConsumerProps from './types'; /** diff --git a/src/components/ScreenWrapper/index.js b/src/components/ScreenWrapper/index.js index 6af67c51ffaf..bd277ffa1ab8 100644 --- a/src/components/ScreenWrapper/index.js +++ b/src/components/ScreenWrapper/index.js @@ -14,9 +14,9 @@ import useEnvironment from '@hooks/useEnvironment'; import useInitialDimensions from '@hooks/useInitialWindowDimensions'; import useKeyboardState from '@hooks/useKeyboardState'; import useNetwork from '@hooks/useNetwork'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as Browser from '@libs/Browser'; -import useThemeStyles from '@styles/useThemeStyles'; import toggleTestToolsModal from '@userActions/TestTool'; import CONST from '@src/CONST'; import {defaultProps, propTypes} from './propTypes'; diff --git a/src/components/Section.js b/src/components/Section.js index ad52bf0e3509..a59476fb0c05 100644 --- a/src/components/Section.js +++ b/src/components/Section.js @@ -1,7 +1,7 @@ import PropTypes from 'prop-types'; import React from 'react'; import {View} from 'react-native'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import Icon from './Icon'; import MenuItemList from './MenuItemList'; import menuItemPropTypes from './menuItemPropTypes'; diff --git a/src/components/SelectCircle.tsx b/src/components/SelectCircle.tsx index 7a7e23388722..637c06f4d35f 100644 --- a/src/components/SelectCircle.tsx +++ b/src/components/SelectCircle.tsx @@ -1,7 +1,7 @@ import React from 'react'; import {StyleProp, View, ViewStyle} from 'react-native'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import Icon from './Icon'; import * as Expensicons from './Icon/Expensicons'; diff --git a/src/components/SelectionList/BaseListItem.js b/src/components/SelectionList/BaseListItem.js index 39bd10ca5a9d..ac679f32d103 100644 --- a/src/components/SelectionList/BaseListItem.js +++ b/src/components/SelectionList/BaseListItem.js @@ -7,9 +7,9 @@ import OfflineWithFeedback from '@components/OfflineWithFeedback'; import PressableWithFeedback from '@components/Pressable/PressableWithFeedback'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; import RadioListItem from './RadioListItem'; import {baseListItemPropTypes} from './selectionListPropTypes'; diff --git a/src/components/SelectionList/BaseSelectionList.js b/src/components/SelectionList/BaseSelectionList.js index 4f88b3ddc78a..454127612e0d 100644 --- a/src/components/SelectionList/BaseSelectionList.js +++ b/src/components/SelectionList/BaseSelectionList.js @@ -17,10 +17,10 @@ import withKeyboardState, {keyboardStatePropTypes} from '@components/withKeyboar import useActiveElement from '@hooks/useActiveElement'; import useKeyboardShortcut from '@hooks/useKeyboardShortcut'; import useLocalize from '@hooks/useLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import Log from '@libs/Log'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import CONST from '@src/CONST'; import BaseListItem from './BaseListItem'; diff --git a/src/components/SelectionList/RadioListItem.js b/src/components/SelectionList/RadioListItem.js index 6d69b01e5d5e..2de0c96932ea 100644 --- a/src/components/SelectionList/RadioListItem.js +++ b/src/components/SelectionList/RadioListItem.js @@ -2,7 +2,7 @@ import React from 'react'; import {View} from 'react-native'; import Text from '@components/Text'; import Tooltip from '@components/Tooltip'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import {radioListItemPropTypes} from './selectionListPropTypes'; function RadioListItem({item, showTooltip, textStyles, alternateTextStyles}) { diff --git a/src/components/SelectionList/UserListItem.js b/src/components/SelectionList/UserListItem.js index 0b4b6b52e0ac..39b7e02df3eb 100644 --- a/src/components/SelectionList/UserListItem.js +++ b/src/components/SelectionList/UserListItem.js @@ -4,7 +4,7 @@ import {View} from 'react-native'; import SubscriptAvatar from '@components/SubscriptAvatar'; import Text from '@components/Text'; import Tooltip from '@components/Tooltip'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import {userListItemPropTypes} from './selectionListPropTypes'; function UserListItem({item, textStyles, alternateTextStyles, showTooltip}) { diff --git a/src/components/ShowMoreButton/index.js b/src/components/ShowMoreButton/index.js index 5f1620ac7c88..34b55fa5dcf1 100644 --- a/src/components/ShowMoreButton/index.js +++ b/src/components/ShowMoreButton/index.js @@ -5,10 +5,10 @@ import _ from 'underscore'; import Button from '@components/Button'; import * as Expensicons from '@components/Icon/Expensicons'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as NumberFormatUtils from '@libs/NumberFormatUtils'; import stylePropTypes from '@styles/stylePropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; const propTypes = { /** Additional styles for container */ diff --git a/src/components/SignInButtons/AppleSignIn/index.desktop.js b/src/components/SignInButtons/AppleSignIn/index.desktop.js index f5dd4512c7c1..cc7ae5b623a5 100644 --- a/src/components/SignInButtons/AppleSignIn/index.desktop.js +++ b/src/components/SignInButtons/AppleSignIn/index.desktop.js @@ -1,7 +1,7 @@ import React from 'react'; import {View} from 'react-native'; import IconButton from '@components/SignInButtons/IconButton'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONFIG from '@src/CONFIG'; import CONST from '@src/CONST'; import ROUTES from '@src/ROUTES'; diff --git a/src/components/SignInButtons/GoogleSignIn/index.desktop.js b/src/components/SignInButtons/GoogleSignIn/index.desktop.js index aec0b0a5eef7..9284a5332e3d 100644 --- a/src/components/SignInButtons/GoogleSignIn/index.desktop.js +++ b/src/components/SignInButtons/GoogleSignIn/index.desktop.js @@ -2,7 +2,7 @@ import React from 'react'; import {View} from 'react-native'; import IconButton from '@components/SignInButtons/IconButton'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONFIG from '@src/CONFIG'; import CONST from '@src/CONST'; import ROUTES from '@src/ROUTES'; diff --git a/src/components/SignInButtons/GoogleSignIn/index.website.js b/src/components/SignInButtons/GoogleSignIn/index.website.js index 7a909c5b1658..8f8a977bdb09 100644 --- a/src/components/SignInButtons/GoogleSignIn/index.website.js +++ b/src/components/SignInButtons/GoogleSignIn/index.website.js @@ -2,7 +2,7 @@ import PropTypes from 'prop-types'; import React, {useCallback} from 'react'; import {View} from 'react-native'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Session from '@userActions/Session'; import CONFIG from '@src/CONFIG'; import CONST from '@src/CONST'; diff --git a/src/components/SignInButtons/IconButton.js b/src/components/SignInButtons/IconButton.js index ddfde61d6a07..19a5bd9b27b8 100644 --- a/src/components/SignInButtons/IconButton.js +++ b/src/components/SignInButtons/IconButton.js @@ -4,7 +4,7 @@ import Icon from '@components/Icon'; import * as Expensicons from '@components/Icon/Expensicons'; import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeedback'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/components/SingleChoiceQuestion.tsx b/src/components/SingleChoiceQuestion.tsx index 6a3a3d87ee8a..5b4ea54e4436 100644 --- a/src/components/SingleChoiceQuestion.tsx +++ b/src/components/SingleChoiceQuestion.tsx @@ -1,7 +1,7 @@ import React, {ForwardedRef, forwardRef} from 'react'; import {Text as RNText} from 'react-native'; +import useThemeStyles from '@hooks/useThemeStyles'; import type {MaybePhraseKey} from '@libs/Localize'; -import useThemeStyles from '@styles/useThemeStyles'; import FormHelpMessage from './FormHelpMessage'; import RadioButtons, {Choice} from './RadioButtons'; import Text from './Text'; diff --git a/src/components/SingleOptionSelector.js b/src/components/SingleOptionSelector.js index 5ef9d0398555..15cf83116bd1 100644 --- a/src/components/SingleOptionSelector.js +++ b/src/components/SingleOptionSelector.js @@ -2,7 +2,7 @@ import PropTypes from 'prop-types'; import React from 'react'; import {View} from 'react-native'; import _ from 'underscore'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; import PressableWithoutFeedback from './Pressable/PressableWithoutFeedback'; import SelectCircle from './SelectCircle'; diff --git a/src/components/SpacerView.js b/src/components/SpacerView.js index b9705a15b5f3..6b3ece2d476f 100644 --- a/src/components/SpacerView.js +++ b/src/components/SpacerView.js @@ -2,8 +2,8 @@ import PropTypes from 'prop-types'; import React from 'react'; import Animated, {useAnimatedStyle, useSharedValue, withTiming} from 'react-native-reanimated'; import usePrevious from '@hooks/usePrevious'; +import useStyleUtils from '@hooks/useStyleUtils'; import stylePropTypes from '@styles/stylePropTypes'; -import useStyleUtils from '@styles/useStyleUtils'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/components/SplashScreenHider/index.native.tsx b/src/components/SplashScreenHider/index.native.tsx index fcedbc67dbf9..9585d0d5abeb 100644 --- a/src/components/SplashScreenHider/index.native.tsx +++ b/src/components/SplashScreenHider/index.native.tsx @@ -2,8 +2,8 @@ import {useCallback, useRef} from 'react'; import {StyleSheet, ViewStyle} from 'react-native'; import Reanimated, {Easing, runOnJS, useAnimatedStyle, useSharedValue, withTiming} from 'react-native-reanimated'; import Logo from '@assets/images/new-expensify-dark.svg'; +import useThemeStyles from '@hooks/useThemeStyles'; import BootSplash from '@libs/BootSplash'; -import useThemeStyles from '@styles/useThemeStyles'; import type {SplashScreenHiderProps, SplashScreenHiderReturnType} from './types'; function SplashScreenHider({onHide = () => {}}: SplashScreenHiderProps): SplashScreenHiderReturnType { diff --git a/src/components/StatePicker/StateSelectorModal.js b/src/components/StatePicker/StateSelectorModal.js index 908bb5eb5b2a..003211478529 100644 --- a/src/components/StatePicker/StateSelectorModal.js +++ b/src/components/StatePicker/StateSelectorModal.js @@ -7,9 +7,9 @@ import Modal from '@components/Modal'; import ScreenWrapper from '@components/ScreenWrapper'; import SelectionList from '@components/SelectionList'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import searchCountryOptions from '@libs/searchCountryOptions'; import StringUtils from '@libs/StringUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/components/StatePicker/index.js b/src/components/StatePicker/index.js index d9c137ac9dc1..6fa60fbba947 100644 --- a/src/components/StatePicker/index.js +++ b/src/components/StatePicker/index.js @@ -7,7 +7,7 @@ import FormHelpMessage from '@components/FormHelpMessage'; import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription'; import refPropTypes from '@components/refPropTypes'; import useLocalize from '@hooks/useLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import StateSelectorModal from './StateSelectorModal'; const propTypes = { diff --git a/src/components/SubscriptAvatar.tsx b/src/components/SubscriptAvatar.tsx index 7fa2900eaffb..9a0aa934ff1b 100644 --- a/src/components/SubscriptAvatar.tsx +++ b/src/components/SubscriptAvatar.tsx @@ -1,10 +1,10 @@ import React, {memo} from 'react'; import {View} from 'react-native'; import {ValueOf} from 'type-fest'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import type {AvatarSource} from '@libs/UserUtils'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import {AvatarType} from '@src/types/onyx/OnyxCommon'; import Avatar from './Avatar'; diff --git a/src/components/Switch.tsx b/src/components/Switch.tsx index 5195c0040add..fd9d9ae315ff 100644 --- a/src/components/Switch.tsx +++ b/src/components/Switch.tsx @@ -1,7 +1,7 @@ import React, {useEffect, useRef} from 'react'; import {Animated} from 'react-native'; +import useThemeStyles from '@hooks/useThemeStyles'; import useNativeDriver from '@libs/useNativeDriver'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import PressableWithFeedback from './Pressable/PressableWithFeedback'; diff --git a/src/components/TabSelector/TabIcon.js b/src/components/TabSelector/TabIcon.js index 76217b69e9f3..d96ae19897f4 100644 --- a/src/components/TabSelector/TabIcon.js +++ b/src/components/TabSelector/TabIcon.js @@ -2,7 +2,7 @@ import PropTypes from 'prop-types'; import React from 'react'; import {Animated, StyleSheet, View} from 'react-native'; import Icon from '@components/Icon'; -import useTheme from '@styles/themes/useTheme'; +import useTheme from '@hooks/useTheme'; const propTypes = { /** Icon to display on tab */ diff --git a/src/components/TabSelector/TabLabel.js b/src/components/TabSelector/TabLabel.js index 5dc050731fc5..fdf204011152 100644 --- a/src/components/TabSelector/TabLabel.js +++ b/src/components/TabSelector/TabLabel.js @@ -1,7 +1,7 @@ import PropTypes from 'prop-types'; import React from 'react'; import {Animated, StyleSheet, Text, View} from 'react-native'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; const propTypes = { /** Title of the tab */ diff --git a/src/components/TabSelector/TabSelector.js b/src/components/TabSelector/TabSelector.js index e968226e83fa..444bb62263d9 100644 --- a/src/components/TabSelector/TabSelector.js +++ b/src/components/TabSelector/TabSelector.js @@ -4,8 +4,8 @@ import {View} from 'react-native'; import _ from 'underscore'; import * as Expensicons from '@components/Icon/Expensicons'; import useLocalize from '@hooks/useLocalize'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; import TabSelectorItem from './TabSelectorItem'; diff --git a/src/components/TabSelector/TabSelectorItem.js b/src/components/TabSelector/TabSelectorItem.js index 116b5db02d2c..88aa98766fae 100644 --- a/src/components/TabSelector/TabSelectorItem.js +++ b/src/components/TabSelector/TabSelectorItem.js @@ -2,7 +2,7 @@ import PropTypes from 'prop-types'; import React from 'react'; import {Animated, StyleSheet} from 'react-native'; import PressableWithFeedback from '@components/Pressable/PressableWithFeedback'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import TabIcon from './TabIcon'; import TabLabel from './TabLabel'; diff --git a/src/components/TagPicker/index.js b/src/components/TagPicker/index.js index 334ca3e38370..cb3d9bf260e6 100644 --- a/src/components/TagPicker/index.js +++ b/src/components/TagPicker/index.js @@ -4,10 +4,10 @@ import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; import OptionsSelector from '@components/OptionsSelector'; import useLocalize from '@hooks/useLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as PolicyUtils from '@libs/PolicyUtils'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import {defaultProps, propTypes} from './tagPickerPropTypes'; diff --git a/src/components/TaskHeaderActionButton.tsx b/src/components/TaskHeaderActionButton.tsx index 5f8461d8e324..47975fd7fc1e 100644 --- a/src/components/TaskHeaderActionButton.tsx +++ b/src/components/TaskHeaderActionButton.tsx @@ -2,8 +2,8 @@ import React from 'react'; import {View} from 'react-native'; import {OnyxEntry, withOnyx} from 'react-native-onyx'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as ReportUtils from '@libs/ReportUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Session from '@userActions/Session'; import * as Task from '@userActions/Task'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/TestToolMenu.tsx b/src/components/TestToolMenu.tsx index 53953b861d7d..82b597f77268 100644 --- a/src/components/TestToolMenu.tsx +++ b/src/components/TestToolMenu.tsx @@ -1,8 +1,8 @@ import React from 'react'; import {OnyxEntry, withOnyx} from 'react-native-onyx'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as ApiUtils from '@libs/ApiUtils'; import compose from '@libs/compose'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Network from '@userActions/Network'; import * as Session from '@userActions/Session'; import * as User from '@userActions/User'; diff --git a/src/components/TestToolRow.tsx b/src/components/TestToolRow.tsx index 4999866b27ee..4ed1aa126002 100644 --- a/src/components/TestToolRow.tsx +++ b/src/components/TestToolRow.tsx @@ -1,6 +1,6 @@ import React from 'react'; import {View} from 'react-native'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import Text from './Text'; type TestToolRowProps = { diff --git a/src/components/TestToolsModal.tsx b/src/components/TestToolsModal.tsx index f555c2b0b4fe..4138df64adc2 100644 --- a/src/components/TestToolsModal.tsx +++ b/src/components/TestToolsModal.tsx @@ -1,7 +1,7 @@ import React from 'react'; import {View} from 'react-native'; import {OnyxEntry, withOnyx} from 'react-native-onyx'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import toggleTestToolsModal from '@userActions/TestTool'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/Text.tsx b/src/components/Text.tsx index ae2f6ba99392..0d201bd253c4 100644 --- a/src/components/Text.tsx +++ b/src/components/Text.tsx @@ -1,8 +1,8 @@ import React, {ForwardedRef} from 'react'; import {Text as RNText, TextProps as RNTextProps, StyleSheet} from 'react-native'; import type {TextStyle} from 'react-native'; -import fontFamily from '@styles/fontFamily'; -import useTheme from '@styles/themes/useTheme'; +import useTheme from '@hooks/useTheme'; +import fontFamily from '@styles/utils/fontFamily'; import variables from '@styles/variables'; import ChildrenProps from '@src/types/utils/ChildrenProps'; diff --git a/src/components/TextInput/BaseTextInput/index.js b/src/components/TextInput/BaseTextInput/index.js index bd33cac02f17..67776d6c7e91 100644 --- a/src/components/TextInput/BaseTextInput/index.js +++ b/src/components/TextInput/BaseTextInput/index.js @@ -13,12 +13,12 @@ import Text from '@components/Text'; import * as styleConst from '@components/TextInput/styleConst'; import TextInputLabel from '@components/TextInput/TextInputLabel'; import withLocalize from '@components/withLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Browser from '@libs/Browser'; import isInputAutoFilled from '@libs/isInputAutoFilled'; import useNativeDriver from '@libs/useNativeDriver'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import CONST from '@src/CONST'; import * as baseTextInputPropTypes from './baseTextInputPropTypes'; diff --git a/src/components/TextInput/BaseTextInput/index.native.js b/src/components/TextInput/BaseTextInput/index.native.js index b9bbf567f9cb..2151af206149 100644 --- a/src/components/TextInput/BaseTextInput/index.native.js +++ b/src/components/TextInput/BaseTextInput/index.native.js @@ -13,12 +13,12 @@ import Text from '@components/Text'; import * as styleConst from '@components/TextInput/styleConst'; import TextInputLabel from '@components/TextInput/TextInputLabel'; import withLocalize from '@components/withLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import getSecureEntryKeyboardType from '@libs/getSecureEntryKeyboardType'; import isInputAutoFilled from '@libs/isInputAutoFilled'; import useNativeDriver from '@libs/useNativeDriver'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import CONST from '@src/CONST'; import * as baseTextInputPropTypes from './baseTextInputPropTypes'; diff --git a/src/components/TextInput/TextInputLabel/index.js b/src/components/TextInput/TextInputLabel/index.js index dbd6fa765503..61af88fe317b 100644 --- a/src/components/TextInput/TextInputLabel/index.js +++ b/src/components/TextInput/TextInputLabel/index.js @@ -1,6 +1,6 @@ import React, {useEffect, useRef} from 'react'; import {Animated} from 'react-native'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; import {defaultProps, propTypes} from './TextInputLabelPropTypes'; diff --git a/src/components/TextInput/TextInputLabel/index.native.js b/src/components/TextInput/TextInputLabel/index.native.js index afc2aa09c84e..eb0f8b17e8b7 100644 --- a/src/components/TextInput/TextInputLabel/index.native.js +++ b/src/components/TextInput/TextInputLabel/index.native.js @@ -1,7 +1,7 @@ import React, {useState} from 'react'; import {Animated} from 'react-native'; import * as styleConst from '@components/TextInput/styleConst'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as TextInputLabelPropTypes from './TextInputLabelPropTypes'; function TextInputLabel(props) { diff --git a/src/components/TextInput/index.js b/src/components/TextInput/index.js index 27ca1d524eda..87db18754ed8 100644 --- a/src/components/TextInput/index.js +++ b/src/components/TextInput/index.js @@ -1,9 +1,9 @@ import React, {useEffect, useRef} from 'react'; import _ from 'underscore'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Browser from '@libs/Browser'; import DomUtils from '@libs/DomUtils'; import Visibility from '@libs/Visibility'; -import useThemeStyles from '@styles/useThemeStyles'; import BaseTextInput from './BaseTextInput'; import * as baseTextInputPropTypes from './BaseTextInput/baseTextInputPropTypes'; import * as styleConst from './styleConst'; diff --git a/src/components/TextInput/index.native.js b/src/components/TextInput/index.native.js index 14591167a425..e5aba76957ad 100644 --- a/src/components/TextInput/index.native.js +++ b/src/components/TextInput/index.native.js @@ -1,6 +1,6 @@ import React, {forwardRef, useEffect} from 'react'; import {AppState, Keyboard} from 'react-native'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import BaseTextInput from './BaseTextInput'; import * as baseTextInputPropTypes from './BaseTextInput/baseTextInputPropTypes'; diff --git a/src/components/TextLink.tsx b/src/components/TextLink.tsx index 95c456ddc8e3..1a67e7bc4c5f 100644 --- a/src/components/TextLink.tsx +++ b/src/components/TextLink.tsx @@ -1,7 +1,7 @@ import React, {ForwardedRef, forwardRef, KeyboardEventHandler, MouseEventHandler} from 'react'; import {GestureResponderEvent, Text as RNText, StyleProp, TextStyle} from 'react-native'; import useEnvironment from '@hooks/useEnvironment'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Link from '@userActions/Link'; import CONST from '@src/CONST'; import Text, {TextProps} from './Text'; diff --git a/src/components/TextWithEllipsis/index.tsx b/src/components/TextWithEllipsis/index.tsx index ee2ec72d1248..fda0d5ab576e 100644 --- a/src/components/TextWithEllipsis/index.tsx +++ b/src/components/TextWithEllipsis/index.tsx @@ -1,7 +1,7 @@ import React from 'react'; import {StyleProp, TextStyle, View, ViewStyle} from 'react-native'; import Text from '@components/Text'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; type TextWithEllipsisProps = { /** Leading text before the ellipsis */ diff --git a/src/styles/illustrations/ThemeIllustrationsProvider.tsx b/src/components/ThemeIllustrationsProvider.tsx similarity index 58% rename from src/styles/illustrations/ThemeIllustrationsProvider.tsx rename to src/components/ThemeIllustrationsProvider.tsx index 423e0c1866b1..3b83a00960a4 100644 --- a/src/styles/illustrations/ThemeIllustrationsProvider.tsx +++ b/src/components/ThemeIllustrationsProvider.tsx @@ -1,8 +1,7 @@ import React, {useMemo} from 'react'; -import useThemePreference from '@styles/themes/useThemePreference'; -import DarkIllustrations from './dark'; -import LightIllustrations from './light'; -import ThemeIllustrationsContext from './ThemeIllustrationsContext'; +import useThemePreference from '@hooks/useThemePreference'; +import ThemeIllustrationsContext from '@styles/theme/context/ThemeIllustrationsContext'; +import Illustrations from '@styles/theme/illustrations'; type ThemeIllustrationsProviderProps = { children: React.ReactNode; @@ -11,7 +10,7 @@ type ThemeIllustrationsProviderProps = { function ThemeIllustrationsProvider({children}: ThemeIllustrationsProviderProps) { const themePreference = useThemePreference(); - const illustrations = useMemo(() => (themePreference === 'dark' ? DarkIllustrations : LightIllustrations), [themePreference]); + const illustrations = useMemo(() => Illustrations[themePreference], [themePreference]); return {children}; } diff --git a/src/styles/themes/ThemeProvider.tsx b/src/components/ThemeProvider.tsx similarity index 74% rename from src/styles/themes/ThemeProvider.tsx rename to src/components/ThemeProvider.tsx index 0d302b5ae056..34bc32be9c99 100644 --- a/src/styles/themes/ThemeProvider.tsx +++ b/src/components/ThemeProvider.tsx @@ -1,10 +1,10 @@ /* eslint-disable react/jsx-props-no-spreading */ import PropTypes from 'prop-types'; import React, {useMemo} from 'react'; -import ThemeContext from './ThemeContext'; -import themes from './themes'; -import {ThemePreferenceWithoutSystem} from './types'; -import useThemePreferenceWithStaticOverride from './useThemePreferenceWithStaticOverride'; +import useThemePreferenceWithStaticOverride from '@hooks/useThemePreferenceWithStaticOverride'; +import themes from '@styles/theme'; +import ThemeContext from '@styles/theme/context/ThemeContext'; +import {ThemePreferenceWithoutSystem} from '@styles/theme/types'; const propTypes = { /** Rendered child component */ diff --git a/src/styles/ThemeStylesProvider.tsx b/src/components/ThemeStylesProvider.tsx similarity index 75% rename from src/styles/ThemeStylesProvider.tsx rename to src/components/ThemeStylesProvider.tsx index 766cb00bd09b..f0d25d9e4dde 100644 --- a/src/styles/ThemeStylesProvider.tsx +++ b/src/components/ThemeStylesProvider.tsx @@ -1,8 +1,8 @@ import React, {useMemo} from 'react'; -import stylesGenerator from './styles'; -import useTheme from './themes/useTheme'; -import ThemeStylesContext from './ThemeStylesContext'; -import createStyleUtils from './utils'; +import useTheme from '@hooks/useTheme'; +import stylesGenerator from '@styles/index'; +import ThemeStylesContext from '@styles/theme/context/ThemeStylesContext'; +import createStyleUtils from '@styles/utils'; type ThemeStylesProviderProps = React.PropsWithChildren; diff --git a/src/components/ThreeDotsMenu/index.js b/src/components/ThreeDotsMenu/index.js index 341ac6e5eb9a..0e84b4beeb7c 100644 --- a/src/components/ThreeDotsMenu/index.js +++ b/src/components/ThreeDotsMenu/index.js @@ -8,8 +8,8 @@ import PopoverMenu from '@components/PopoverMenu'; import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeedback'; import Tooltip from '@components/Tooltip/PopoverAnchorTooltip'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Browser from '@libs/Browser'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ThreeDotsMenuItemPropTypes from './ThreeDotsMenuItemPropTypes'; diff --git a/src/components/ThumbnailImage.tsx b/src/components/ThumbnailImage.tsx index a4a200d96082..08b269e45f62 100644 --- a/src/components/ThumbnailImage.tsx +++ b/src/components/ThumbnailImage.tsx @@ -1,10 +1,10 @@ import lodashClamp from 'lodash/clamp'; import React, {useCallback, useState} from 'react'; import {Dimensions, StyleProp, View, ViewStyle} from 'react-native'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import ImageWithSizeCalculation from './ImageWithSizeCalculation'; type ThumbnailImageProps = { diff --git a/src/components/TimePicker/TimePicker.js b/src/components/TimePicker/TimePicker.js index 7da6084b5312..5b49739150cc 100644 --- a/src/components/TimePicker/TimePicker.js +++ b/src/components/TimePicker/TimePicker.js @@ -10,11 +10,11 @@ import refPropTypes from '@components/refPropTypes'; import Text from '@components/Text'; import useKeyboardShortcut from '@hooks/useKeyboardShortcut'; import useLocalize from '@hooks/useLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import DateUtils from '@libs/DateUtils'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import setSelection from './setSelection'; diff --git a/src/components/Tooltip/TooltipRenderedOnPageBody.tsx b/src/components/Tooltip/TooltipRenderedOnPageBody.tsx index 2ed885c9d3d7..4549f48501bf 100644 --- a/src/components/Tooltip/TooltipRenderedOnPageBody.tsx +++ b/src/components/Tooltip/TooltipRenderedOnPageBody.tsx @@ -2,8 +2,8 @@ import React, {useEffect, useLayoutEffect, useMemo, useRef, useState} from 'reac import ReactDOM from 'react-dom'; import {Animated, View} from 'react-native'; import Text from '@components/Text'; +import useStyleUtils from '@hooks/useStyleUtils'; import Log from '@libs/Log'; -import useStyleUtils from '@styles/useStyleUtils'; import textRef from '@src/types/utils/textRef'; import viewRef from '@src/types/utils/viewRef'; import TooltipProps from './types'; diff --git a/src/components/UnorderedList.tsx b/src/components/UnorderedList.tsx index a51cefce9ce6..a2b836bd4d80 100644 --- a/src/components/UnorderedList.tsx +++ b/src/components/UnorderedList.tsx @@ -1,6 +1,6 @@ import React from 'react'; import {View} from 'react-native'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import Text from './Text'; type UnorderedListProps = { diff --git a/src/components/UnreadActionIndicator.tsx b/src/components/UnreadActionIndicator.tsx index b34f962e57bd..f422ae24bd4f 100755 --- a/src/components/UnreadActionIndicator.tsx +++ b/src/components/UnreadActionIndicator.tsx @@ -1,7 +1,7 @@ import React from 'react'; import {View} from 'react-native'; import useLocalize from '@hooks/useLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; import Text from './Text'; diff --git a/src/components/UserDetailsTooltip/BaseUserDetailsTooltip.website.js b/src/components/UserDetailsTooltip/BaseUserDetailsTooltip.website.js index b689f2b73de9..5e88a7994e51 100644 --- a/src/components/UserDetailsTooltip/BaseUserDetailsTooltip.website.js +++ b/src/components/UserDetailsTooltip/BaseUserDetailsTooltip.website.js @@ -7,10 +7,10 @@ import Avatar from '@components/Avatar'; import {usePersonalDetails} from '@components/OnyxProvider'; import Tooltip from '@components/Tooltip'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as LocalePhoneNumber from '@libs/LocalePhoneNumber'; import * as ReportUtils from '@libs/ReportUtils'; import * as UserUtils from '@libs/UserUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import {defaultProps, propTypes} from './userDetailsTooltipPropTypes'; diff --git a/src/components/ValidateCode/ExpiredValidateCodeModal.js b/src/components/ValidateCode/ExpiredValidateCodeModal.js index caeef8a14a0a..cb880a0a2844 100644 --- a/src/components/ValidateCode/ExpiredValidateCodeModal.js +++ b/src/components/ValidateCode/ExpiredValidateCodeModal.js @@ -5,8 +5,8 @@ import * as Expensicons from '@components/Icon/Expensicons'; import * as Illustrations from '@components/Icon/Illustrations'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; const propTypes = { diff --git a/src/components/ValidateCode/JustSignedInModal.js b/src/components/ValidateCode/JustSignedInModal.js index 0ae4c882784c..fedb92c49ee3 100644 --- a/src/components/ValidateCode/JustSignedInModal.js +++ b/src/components/ValidateCode/JustSignedInModal.js @@ -6,8 +6,8 @@ import * as Expensicons from '@components/Icon/Expensicons'; import * as Illustrations from '@components/Icon/Illustrations'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; const propTypes = { diff --git a/src/components/ValidateCode/ValidateCodeModal.js b/src/components/ValidateCode/ValidateCodeModal.js index 58f9b24e3c91..a2fea513f851 100644 --- a/src/components/ValidateCode/ValidateCodeModal.js +++ b/src/components/ValidateCode/ValidateCodeModal.js @@ -10,8 +10,8 @@ import * as Illustrations from '@components/Icon/Illustrations'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; import * as Session from '@userActions/Session'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/ValuePicker/ValueSelectorModal.js b/src/components/ValuePicker/ValueSelectorModal.js index b70bcc5cbbb7..edc5a48d0bb3 100644 --- a/src/components/ValuePicker/ValueSelectorModal.js +++ b/src/components/ValuePicker/ValueSelectorModal.js @@ -5,7 +5,7 @@ import HeaderWithBackButton from '@components/HeaderWithBackButton'; import Modal from '@components/Modal'; import ScreenWrapper from '@components/ScreenWrapper'; import SelectionList from '@components/SelectionList'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/components/ValuePicker/index.js b/src/components/ValuePicker/index.js index 6eb20d1bde6a..b5ddaa7dcb73 100644 --- a/src/components/ValuePicker/index.js +++ b/src/components/ValuePicker/index.js @@ -5,8 +5,8 @@ import {View} from 'react-native'; import FormHelpMessage from '@components/FormHelpMessage'; import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription'; import refPropTypes from '@components/refPropTypes'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; import ValueSelectorModal from './ValueSelectorModal'; diff --git a/src/components/VideoChatButtonAndMenu/BaseVideoChatButtonAndMenu.js b/src/components/VideoChatButtonAndMenu/BaseVideoChatButtonAndMenu.js index 3d1488ec8521..54e7309ee48b 100755 --- a/src/components/VideoChatButtonAndMenu/BaseVideoChatButtonAndMenu.js +++ b/src/components/VideoChatButtonAndMenu/BaseVideoChatButtonAndMenu.js @@ -12,9 +12,9 @@ import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeed import Tooltip from '@components/Tooltip/PopoverAnchorTooltip'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Link from '@userActions/Link'; import * as Session from '@userActions/Session'; import CONST from '@src/CONST'; diff --git a/src/components/WalletSection.tsx b/src/components/WalletSection.tsx index c0c02877828e..224734089810 100644 --- a/src/components/WalletSection.tsx +++ b/src/components/WalletSection.tsx @@ -1,6 +1,6 @@ import React from 'react'; import {SvgProps} from 'react-native-svg'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import ChildrenProps from '@src/types/utils/ChildrenProps'; import Section from './Section'; diff --git a/src/components/WalletStatementModal/index.tsx b/src/components/WalletStatementModal/index.tsx index 0f1d1804df60..d6120b842ddc 100644 --- a/src/components/WalletStatementModal/index.tsx +++ b/src/components/WalletStatementModal/index.tsx @@ -2,8 +2,8 @@ import React, {useState} from 'react'; import {View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import FullScreenLoadingIndicator from '@components/FullscreenLoadingIndicator'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Report from '@userActions/Report'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/components/withStyleUtils.tsx b/src/components/withStyleUtils.tsx index 6ea044fce70c..821587a1ae43 100644 --- a/src/components/withStyleUtils.tsx +++ b/src/components/withStyleUtils.tsx @@ -1,7 +1,7 @@ import PropTypes from 'prop-types'; import React, {ComponentType, ForwardedRef, forwardRef, ReactElement, RefAttributes} from 'react'; +import useStyleUtils from '@hooks/useStyleUtils'; import getComponentDisplayName from '@libs/getComponentDisplayName'; -import useStyleUtils from '@styles/useStyleUtils'; import {StyleUtilsType} from '@styles/utils'; const withStyleUtilsPropTypes = { diff --git a/src/components/withTheme.tsx b/src/components/withTheme.tsx index 59380110904a..93349e8e2ba4 100644 --- a/src/components/withTheme.tsx +++ b/src/components/withTheme.tsx @@ -1,8 +1,8 @@ import PropTypes from 'prop-types'; import React, {ComponentType, ForwardedRef, forwardRef, ReactElement, RefAttributes} from 'react'; +import useTheme from '@hooks/useTheme'; import getComponentDisplayName from '@libs/getComponentDisplayName'; -import {type ThemeColors} from '@styles/themes/types'; -import useTheme from '@styles/themes/useTheme'; +import {type ThemeColors} from '@styles/theme/types'; const withThemePropTypes = { theme: PropTypes.object.isRequired, diff --git a/src/components/withThemeStyles.tsx b/src/components/withThemeStyles.tsx index d811573d1730..0ae960bd4351 100644 --- a/src/components/withThemeStyles.tsx +++ b/src/components/withThemeStyles.tsx @@ -1,8 +1,8 @@ import PropTypes from 'prop-types'; import React, {ComponentType, ForwardedRef, forwardRef, ReactElement, RefAttributes} from 'react'; +import useThemeStyles from '@hooks/useThemeStyles'; import getComponentDisplayName from '@libs/getComponentDisplayName'; -import {type ThemeStyles} from '@styles/styles'; -import useThemeStyles from '@styles/useThemeStyles'; +import {type ThemeStyles} from '@styles/index'; const withThemeStylesPropTypes = { themeStyles: PropTypes.object.isRequired, diff --git a/src/components/withToggleVisibilityView.tsx b/src/components/withToggleVisibilityView.tsx index 0e3e91d09bf2..974ce3b7f855 100644 --- a/src/components/withToggleVisibilityView.tsx +++ b/src/components/withToggleVisibilityView.tsx @@ -1,8 +1,8 @@ import React, {ComponentType, ForwardedRef, ReactElement, RefAttributes} from 'react'; import {View} from 'react-native'; import {SetOptional} from 'type-fest'; +import useThemeStyles from '@hooks/useThemeStyles'; import getComponentDisplayName from '@libs/getComponentDisplayName'; -import useThemeStyles from '@styles/useThemeStyles'; type ToggleVisibilityViewProps = { /** Whether the content is visible. */ diff --git a/src/styles/useStyleUtils.ts b/src/hooks/useStyleUtils.ts similarity index 83% rename from src/styles/useStyleUtils.ts rename to src/hooks/useStyleUtils.ts index aadb3f884220..8e6ad31396d5 100644 --- a/src/styles/useStyleUtils.ts +++ b/src/hooks/useStyleUtils.ts @@ -1,5 +1,5 @@ import {useContext} from 'react'; -import ThemeStylesContext from './ThemeStylesContext'; +import ThemeStylesContext from '@styles/theme/context/ThemeStylesContext'; function useStyleUtils() { const themeStylesContext = useContext(ThemeStylesContext); diff --git a/src/styles/themes/useTheme.ts b/src/hooks/useTheme.ts similarity index 72% rename from src/styles/themes/useTheme.ts rename to src/hooks/useTheme.ts index adeaffbcae8a..966e9b499e2f 100644 --- a/src/styles/themes/useTheme.ts +++ b/src/hooks/useTheme.ts @@ -1,6 +1,6 @@ import {useContext} from 'react'; -import ThemeContext from './ThemeContext'; -import {type ThemeColors} from './types'; +import ThemeContext from '@styles/theme/context/ThemeContext'; +import {type ThemeColors} from '@styles/theme/types'; function useTheme(): ThemeColors { const theme = useContext(ThemeContext); diff --git a/src/styles/illustrations/useThemeIllustrations.ts b/src/hooks/useThemeIllustrations.ts similarity index 81% rename from src/styles/illustrations/useThemeIllustrations.ts rename to src/hooks/useThemeIllustrations.ts index 32f986dc655a..5bc07185f882 100644 --- a/src/styles/illustrations/useThemeIllustrations.ts +++ b/src/hooks/useThemeIllustrations.ts @@ -1,5 +1,5 @@ import {useContext} from 'react'; -import ThemeIllustrationsContext from './ThemeIllustrationsContext'; +import ThemeIllustrationsContext from '@styles/theme/context/ThemeIllustrationsContext'; function useThemeIllustrations() { const illustrations = useContext(ThemeIllustrationsContext); diff --git a/src/styles/themes/useThemePreference.ts b/src/hooks/useThemePreference.ts similarity index 95% rename from src/styles/themes/useThemePreference.ts rename to src/hooks/useThemePreference.ts index ac87e2488b31..7c9dad49a841 100644 --- a/src/styles/themes/useThemePreference.ts +++ b/src/hooks/useThemePreference.ts @@ -1,8 +1,8 @@ import {useContext, useEffect, useState} from 'react'; import {Appearance, ColorSchemeName} from 'react-native'; import {PreferredThemeContext} from '@components/OnyxProvider'; +import {ThemePreferenceWithoutSystem} from '@styles/theme/types'; import CONST from '@src/CONST'; -import {ThemePreferenceWithoutSystem} from './types'; function useThemePreference() { const [themePreference, setThemePreference] = useState(CONST.THEME.DEFAULT); diff --git a/src/styles/themes/useThemePreferenceWithStaticOverride.ts b/src/hooks/useThemePreferenceWithStaticOverride.ts similarity index 90% rename from src/styles/themes/useThemePreferenceWithStaticOverride.ts rename to src/hooks/useThemePreferenceWithStaticOverride.ts index b447740a0de1..4619da1966ce 100644 --- a/src/styles/themes/useThemePreferenceWithStaticOverride.ts +++ b/src/hooks/useThemePreferenceWithStaticOverride.ts @@ -1,4 +1,4 @@ -import {ThemePreferenceWithoutSystem} from './types'; +import {ThemePreferenceWithoutSystem} from '@styles/theme/types'; import useThemePreference from './useThemePreference'; const useThemePreferenceWithStaticOverride = (staticThemePreference: ThemePreferenceWithoutSystem | undefined) => { diff --git a/src/styles/useThemeStyles.ts b/src/hooks/useThemeStyles.ts similarity index 83% rename from src/styles/useThemeStyles.ts rename to src/hooks/useThemeStyles.ts index 164806a908e4..05f36ff52cc5 100644 --- a/src/styles/useThemeStyles.ts +++ b/src/hooks/useThemeStyles.ts @@ -1,5 +1,5 @@ import {useContext} from 'react'; -import ThemeStylesContext from './ThemeStylesContext'; +import ThemeStylesContext from '@styles/theme/context/ThemeStylesContext'; function useThemeStyles() { const themeStylesContext = useContext(ThemeStylesContext); diff --git a/src/libs/ComposerUtils/updateNumberOfLines/types.ts b/src/libs/ComposerUtils/updateNumberOfLines/types.ts index 5e109afe8959..c121eaaef319 100644 --- a/src/libs/ComposerUtils/updateNumberOfLines/types.ts +++ b/src/libs/ComposerUtils/updateNumberOfLines/types.ts @@ -1,6 +1,6 @@ import {NativeSyntheticEvent, TextInputContentSizeChangeEventData} from 'react-native'; import ComposerProps from '@libs/ComposerUtils/types'; -import {type ThemeStyles} from '@styles/styles'; +import {type ThemeStyles} from '@styles/index'; type UpdateNumberOfLines = (props: ComposerProps, event: NativeSyntheticEvent, styles: ThemeStyles) => void; diff --git a/src/libs/Navigation/AppNavigator/AuthScreens.tsx b/src/libs/Navigation/AppNavigator/AuthScreens.tsx index 008015db7a90..f6572c84709d 100644 --- a/src/libs/Navigation/AppNavigator/AuthScreens.tsx +++ b/src/libs/Navigation/AppNavigator/AuthScreens.tsx @@ -1,6 +1,7 @@ import React, {memo, useEffect, useRef} from 'react'; import {View} from 'react-native'; import Onyx, {OnyxEntry, withOnyx} from 'react-native-onyx'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import KeyboardShortcut from '@libs/KeyboardShortcut'; import getCurrentUrl from '@libs/Navigation/currentUrl'; @@ -14,7 +15,6 @@ import DemoSetupPage from '@pages/DemoSetupPage'; import NotFoundPage from '@pages/ErrorPage/NotFoundPage'; import DesktopSignInRedirectPage from '@pages/signin/DesktopSignInRedirectPage'; import SearchInputManager from '@pages/workspace/SearchInputManager'; -import useThemeStyles from '@styles/useThemeStyles'; import * as App from '@userActions/App'; import * as Download from '@userActions/Download'; import * as Modal from '@userActions/Modal'; diff --git a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx index ebdfe849327e..65c3d7011d78 100644 --- a/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx +++ b/src/libs/Navigation/AppNavigator/ModalStackNavigators.tsx @@ -1,6 +1,7 @@ import {ParamListBase} from '@react-navigation/routers'; import {CardStyleInterpolators, createStackNavigator, StackNavigationOptions} from '@react-navigation/stack'; import React, {useMemo} from 'react'; +import useThemeStyles from '@hooks/useThemeStyles'; import type { AddPersonalBankAccountNavigatorParamList, DetailsNavigatorParamList, @@ -28,7 +29,6 @@ import type { TeachersUniteNavigatorParamList, WalletStatementNavigatorParamList, } from '@navigation/types'; -import useThemeStyles from '@styles/useThemeStyles'; import SCREENS from '@src/SCREENS'; import type {Screen} from '@src/SCREENS'; diff --git a/src/libs/Navigation/AppNavigator/Navigators/CentralPaneNavigator/BaseCentralPaneNavigator.tsx b/src/libs/Navigation/AppNavigator/Navigators/CentralPaneNavigator/BaseCentralPaneNavigator.tsx index 228ea6bd3dce..f2cdd140f7d8 100644 --- a/src/libs/Navigation/AppNavigator/Navigators/CentralPaneNavigator/BaseCentralPaneNavigator.tsx +++ b/src/libs/Navigation/AppNavigator/Navigators/CentralPaneNavigator/BaseCentralPaneNavigator.tsx @@ -1,9 +1,9 @@ import {createStackNavigator} from '@react-navigation/stack'; import React from 'react'; +import useThemeStyles from '@hooks/useThemeStyles'; import ReportScreenWrapper from '@libs/Navigation/AppNavigator/ReportScreenWrapper'; import getCurrentUrl from '@libs/Navigation/currentUrl'; import type {CentralPaneNavigatorParamList} from '@navigation/types'; -import useThemeStyles from '@styles/useThemeStyles'; import SCREENS from '@src/SCREENS'; const Stack = createStackNavigator(); diff --git a/src/libs/Navigation/AppNavigator/Navigators/Overlay.tsx b/src/libs/Navigation/AppNavigator/Navigators/Overlay.tsx index 09099cb493f6..065de8da578b 100644 --- a/src/libs/Navigation/AppNavigator/Navigators/Overlay.tsx +++ b/src/libs/Navigation/AppNavigator/Navigators/Overlay.tsx @@ -3,7 +3,7 @@ import React from 'react'; import {Animated, View} from 'react-native'; import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeedback'; import useLocalize from '@hooks/useLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; type OverlayProps = { diff --git a/src/libs/Navigation/AppNavigator/Navigators/RightModalNavigator.tsx b/src/libs/Navigation/AppNavigator/Navigators/RightModalNavigator.tsx index 10b8129bc3e7..bd790589c8d1 100644 --- a/src/libs/Navigation/AppNavigator/Navigators/RightModalNavigator.tsx +++ b/src/libs/Navigation/AppNavigator/Navigators/RightModalNavigator.tsx @@ -2,11 +2,11 @@ import {createStackNavigator, StackScreenProps} from '@react-navigation/stack'; import React, {useMemo} from 'react'; import {View} from 'react-native'; import NoDropZone from '@components/DragAndDrop/NoDropZone'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as ModalStackNavigators from '@libs/Navigation/AppNavigator/ModalStackNavigators'; import RHPScreenOptions from '@libs/Navigation/AppNavigator/RHPScreenOptions'; import type {AuthScreensParamList, RightModalNavigatorParamList} from '@navigation/types'; -import useThemeStyles from '@styles/useThemeStyles'; import NAVIGATORS from '@src/NAVIGATORS'; import SCREENS from '@src/SCREENS'; import Overlay from './Overlay'; diff --git a/src/libs/Navigation/AppNavigator/RHPScreenOptions.ts b/src/libs/Navigation/AppNavigator/RHPScreenOptions.ts index 6cae31a219f9..814c61ad32a3 100644 --- a/src/libs/Navigation/AppNavigator/RHPScreenOptions.ts +++ b/src/libs/Navigation/AppNavigator/RHPScreenOptions.ts @@ -1,5 +1,5 @@ import {CardStyleInterpolators, StackNavigationOptions} from '@react-navigation/stack'; -import {ThemeStyles} from '@styles/styles'; +import {ThemeStyles} from '@styles/index'; /** * RHP stack navigator screen options generator function diff --git a/src/libs/Navigation/AppNavigator/getRootNavigatorScreenOptions.ts b/src/libs/Navigation/AppNavigator/getRootNavigatorScreenOptions.ts index b294e6d7ab11..379c5281b78f 100644 --- a/src/libs/Navigation/AppNavigator/getRootNavigatorScreenOptions.ts +++ b/src/libs/Navigation/AppNavigator/getRootNavigatorScreenOptions.ts @@ -1,6 +1,6 @@ import {StackCardInterpolationProps, StackNavigationOptions} from '@react-navigation/stack'; -import getNavigationModalCardStyle from '@styles/getNavigationModalCardStyles'; -import {ThemeStyles} from '@styles/styles'; +import {ThemeStyles} from '@styles/index'; +import getNavigationModalCardStyle from '@styles/utils/getNavigationModalCardStyles'; import variables from '@styles/variables'; import CONFIG from '@src/CONFIG'; import modalCardStyleInterpolator from './modalCardStyleInterpolator'; diff --git a/src/libs/Navigation/AppNavigator/modalCardStyleInterpolator.ts b/src/libs/Navigation/AppNavigator/modalCardStyleInterpolator.ts index f7e772148e79..eff88422cc5c 100644 --- a/src/libs/Navigation/AppNavigator/modalCardStyleInterpolator.ts +++ b/src/libs/Navigation/AppNavigator/modalCardStyleInterpolator.ts @@ -1,6 +1,6 @@ import type {StackCardInterpolatedStyle, StackCardInterpolationProps} from '@react-navigation/stack'; import {Animated} from 'react-native'; -import getCardStyles from '@styles/cardStyles'; +import getCardStyles from '@styles/utils/cardStyles'; import variables from '@styles/variables'; export default (isSmallScreenWidth: boolean, isFullScreenModal: boolean, {current: {progress}, inverted, layouts: {screen}}: StackCardInterpolationProps): StackCardInterpolatedStyle => { diff --git a/src/libs/Navigation/NavigationRoot.tsx b/src/libs/Navigation/NavigationRoot.tsx index 7c0b9ef4fc8c..48523162ba2e 100644 --- a/src/libs/Navigation/NavigationRoot.tsx +++ b/src/libs/Navigation/NavigationRoot.tsx @@ -2,9 +2,9 @@ import {DefaultTheme, getPathFromState, NavigationContainer, NavigationState} fr import React, {useEffect, useMemo, useRef} from 'react'; import useCurrentReportID from '@hooks/useCurrentReportID'; import useFlipper from '@hooks/useFlipper'; +import useTheme from '@hooks/useTheme'; import useWindowDimensions from '@hooks/useWindowDimensions'; import Log from '@libs/Log'; -import useTheme from '@styles/themes/useTheme'; import AppNavigator from './AppNavigator'; import linkingConfig from './linkingConfig'; import Navigation, {navigationRef} from './Navigation'; diff --git a/src/libs/PaymentUtils.ts b/src/libs/PaymentUtils.ts index ee7a293f6ad1..e41b3295a2c5 100644 --- a/src/libs/PaymentUtils.ts +++ b/src/libs/PaymentUtils.ts @@ -1,5 +1,5 @@ import getBankIcon from '@components/Icon/BankIcons'; -import {type ThemeStyles} from '@styles/styles'; +import {type ThemeStyles} from '@styles/index'; import CONST from '@src/CONST'; import BankAccount from '@src/types/onyx/BankAccount'; import Fund from '@src/types/onyx/Fund'; diff --git a/src/styles/PopoverWithMeasuredContentStyleUtils.ts b/src/libs/PopoverWithMeasuredContentUtils.ts similarity index 88% rename from src/styles/PopoverWithMeasuredContentStyleUtils.ts rename to src/libs/PopoverWithMeasuredContentUtils.ts index 94a0fb77d8bb..b932249211be 100644 --- a/src/styles/PopoverWithMeasuredContentStyleUtils.ts +++ b/src/libs/PopoverWithMeasuredContentUtils.ts @@ -1,5 +1,5 @@ -import roundToNearestMultipleOfFour from './utils/roundToNearestMultipleOfFour'; -import variables from './variables'; +import roundToNearestMultipleOfFour from '@styles/utils/roundToNearestMultipleOfFour'; +import variables from '@styles/variables'; /** * Compute the amount that the Context menu's Anchor needs to be horizontally shifted @@ -50,6 +50,6 @@ function computeVerticalShift(anchorTopEdge: number, menuHeight: number, windowH return 0; } -const PopoverWithMeasuredContentStyleUtils = {computeHorizontalShift, computeVerticalShift}; +const PopoverWithMeasuredContentUtils = {computeHorizontalShift, computeVerticalShift}; -export default PopoverWithMeasuredContentStyleUtils; +export default PopoverWithMeasuredContentUtils; diff --git a/src/pages/AddPersonalBankAccountPage.js b/src/pages/AddPersonalBankAccountPage.js index a4d75a7c73a0..09b73ea158f9 100644 --- a/src/pages/AddPersonalBankAccountPage.js +++ b/src/pages/AddPersonalBankAccountPage.js @@ -9,9 +9,9 @@ import FormProvider from '@components/Form/FormProvider'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import getPlaidOAuthReceivedRedirectURI from '@libs/getPlaidOAuthReceivedRedirectURI'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import * as BankAccounts from '@userActions/BankAccounts'; import * as PaymentMethods from '@userActions/PaymentMethods'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/DetailsPage.js b/src/pages/DetailsPage.js index 9145459e42d1..b0362a69b4d6 100755 --- a/src/pages/DetailsPage.js +++ b/src/pages/DetailsPage.js @@ -20,10 +20,10 @@ import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import UserDetailsTooltip from '@components/UserDetailsTooltip'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as ReportUtils from '@libs/ReportUtils'; import * as UserUtils from '@libs/UserUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Report from '@userActions/Report'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/EditRequestCategoryPage.js b/src/pages/EditRequestCategoryPage.js index 290c05f0c494..205b4bf66dfa 100644 --- a/src/pages/EditRequestCategoryPage.js +++ b/src/pages/EditRequestCategoryPage.js @@ -5,8 +5,8 @@ import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; const propTypes = { /** Transaction default category value */ diff --git a/src/pages/EditRequestCreatedPage.js b/src/pages/EditRequestCreatedPage.js index c2b05d9e6dfa..fbe1b3c782a7 100644 --- a/src/pages/EditRequestCreatedPage.js +++ b/src/pages/EditRequestCreatedPage.js @@ -5,7 +5,7 @@ import FormProvider from '@components/Form/FormProvider'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import useLocalize from '@hooks/useLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import ONYXKEYS from '@src/ONYXKEYS'; const propTypes = { diff --git a/src/pages/EditRequestDescriptionPage.js b/src/pages/EditRequestDescriptionPage.js index 3a895d2b09f5..9b2a9e465746 100644 --- a/src/pages/EditRequestDescriptionPage.js +++ b/src/pages/EditRequestDescriptionPage.js @@ -8,9 +8,9 @@ import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import TextInput from '@components/TextInput'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Browser from '@libs/Browser'; import updateMultilineInputRange from '@libs/updateMultilineInputRange'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/EditRequestMerchantPage.js b/src/pages/EditRequestMerchantPage.js index af6ff89296f1..5fa14d850f45 100644 --- a/src/pages/EditRequestMerchantPage.js +++ b/src/pages/EditRequestMerchantPage.js @@ -8,7 +8,7 @@ import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import TextInput from '@components/TextInput'; import useLocalize from '@hooks/useLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/EditRequestReceiptPage.js b/src/pages/EditRequestReceiptPage.js index 03c0aa777d5e..1525ec162963 100644 --- a/src/pages/EditRequestReceiptPage.js +++ b/src/pages/EditRequestReceiptPage.js @@ -5,8 +5,8 @@ import DragAndDropProvider from '@components/DragAndDrop/Provider'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import ReceiptSelector from './iou/ReceiptSelector'; const propTypes = { diff --git a/src/pages/EditRequestTagPage.js b/src/pages/EditRequestTagPage.js index 74cf69944f2c..8ecc4a953065 100644 --- a/src/pages/EditRequestTagPage.js +++ b/src/pages/EditRequestTagPage.js @@ -5,8 +5,8 @@ import ScreenWrapper from '@components/ScreenWrapper'; import TagPicker from '@components/TagPicker'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; const propTypes = { /** Transaction default tag value */ diff --git a/src/pages/EnablePayments/AdditionalDetailsStep.js b/src/pages/EnablePayments/AdditionalDetailsStep.js index 9ed85447a3b3..f6ba2bb509fb 100644 --- a/src/pages/EnablePayments/AdditionalDetailsStep.js +++ b/src/pages/EnablePayments/AdditionalDetailsStep.js @@ -15,10 +15,10 @@ import TextInput from '@components/TextInput'; import TextLink from '@components/TextLink'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultProps, withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as ValidationUtils from '@libs/ValidationUtils'; import AddressForm from '@pages/ReimbursementAccount/AddressForm'; -import useThemeStyles from '@styles/useThemeStyles'; import * as PersonalDetails from '@userActions/PersonalDetails'; import * as Wallet from '@userActions/Wallet'; import CONST from '@src/CONST'; diff --git a/src/pages/EnablePayments/FailedKYC.js b/src/pages/EnablePayments/FailedKYC.js index de170bec4070..fc54ea9c1074 100644 --- a/src/pages/EnablePayments/FailedKYC.js +++ b/src/pages/EnablePayments/FailedKYC.js @@ -3,7 +3,7 @@ import {View} from 'react-native'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/pages/EnablePayments/IdologyQuestions.js b/src/pages/EnablePayments/IdologyQuestions.js index 9e4f9d697fca..8f21d68abe4f 100644 --- a/src/pages/EnablePayments/IdologyQuestions.js +++ b/src/pages/EnablePayments/IdologyQuestions.js @@ -9,7 +9,7 @@ import SingleChoiceQuestion from '@components/SingleChoiceQuestion'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; import useLocalize from '@hooks/useLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as BankAccounts from '@userActions/BankAccounts'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/EnablePayments/OnfidoPrivacy.js b/src/pages/EnablePayments/OnfidoPrivacy.js index c542df0196cf..77b884fb2934 100644 --- a/src/pages/EnablePayments/OnfidoPrivacy.js +++ b/src/pages/EnablePayments/OnfidoPrivacy.js @@ -10,9 +10,9 @@ import FullscreenLoadingIndicator from '@components/FullscreenLoadingIndicator'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as ErrorUtils from '@libs/ErrorUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as BankAccounts from '@userActions/BankAccounts'; import ONYXKEYS from '@src/ONYXKEYS'; import walletOnfidoDataPropTypes from './walletOnfidoDataPropTypes'; diff --git a/src/pages/EnablePayments/TermsPage/LongTermsForm.js b/src/pages/EnablePayments/TermsPage/LongTermsForm.js index 2ed7854ee6ba..d95f80e99673 100644 --- a/src/pages/EnablePayments/TermsPage/LongTermsForm.js +++ b/src/pages/EnablePayments/TermsPage/LongTermsForm.js @@ -6,8 +6,8 @@ import Icon from '@components/Icon'; import * as Expensicons from '@components/Icon/Expensicons'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Localize from '@libs/Localize'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; const termsData = [ diff --git a/src/pages/EnablePayments/TermsPage/ShortTermsForm.js b/src/pages/EnablePayments/TermsPage/ShortTermsForm.js index 898aec9b2c16..77f77f3cb34b 100644 --- a/src/pages/EnablePayments/TermsPage/ShortTermsForm.js +++ b/src/pages/EnablePayments/TermsPage/ShortTermsForm.js @@ -2,9 +2,9 @@ import React from 'react'; import {View} from 'react-native'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Localize from '@libs/Localize'; import userWalletPropTypes from '@pages/EnablePayments/userWalletPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/pages/EnablePayments/TermsStep.js b/src/pages/EnablePayments/TermsStep.js index 368f92f0db27..8297ca54c2b4 100644 --- a/src/pages/EnablePayments/TermsStep.js +++ b/src/pages/EnablePayments/TermsStep.js @@ -7,9 +7,9 @@ import HeaderWithBackButton from '@components/HeaderWithBackButton'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as ErrorUtils from '@libs/ErrorUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as BankAccounts from '@userActions/BankAccounts'; import ONYXKEYS from '@src/ONYXKEYS'; import LongTermsForm from './TermsPage/LongTermsForm'; diff --git a/src/pages/ErrorPage/ErrorBodyText/index.js b/src/pages/ErrorPage/ErrorBodyText/index.js index d3436a2fc0a8..47b765f8f5e8 100644 --- a/src/pages/ErrorPage/ErrorBodyText/index.js +++ b/src/pages/ErrorPage/ErrorBodyText/index.js @@ -2,7 +2,7 @@ import React from 'react'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/pages/ErrorPage/GenericErrorPage.js b/src/pages/ErrorPage/GenericErrorPage.js index 01c4990cbc62..85d49a8b9074 100644 --- a/src/pages/ErrorPage/GenericErrorPage.js +++ b/src/pages/ErrorPage/GenericErrorPage.js @@ -9,9 +9,9 @@ import SafeAreaConsumer from '@components/SafeAreaConsumer'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; import * as Session from '@userActions/Session'; import CONST from '@src/CONST'; diff --git a/src/pages/FlagCommentPage.js b/src/pages/FlagCommentPage.js index 3695896ea473..6c6421593837 100644 --- a/src/pages/FlagCommentPage.js +++ b/src/pages/FlagCommentPage.js @@ -10,11 +10,11 @@ import MenuItem from '@components/MenuItem'; import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import * as ReportActionsUtils from '@libs/ReportActionsUtils'; import * as ReportUtils from '@libs/ReportUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Report from '@userActions/Report'; import * as Session from '@userActions/Session'; import CONST from '@src/CONST'; diff --git a/src/pages/GetAssistancePage.js b/src/pages/GetAssistancePage.js index 08c9a6bf6815..a880637ca100 100644 --- a/src/pages/GetAssistancePage.js +++ b/src/pages/GetAssistancePage.js @@ -10,9 +10,9 @@ import ScreenWrapper from '@components/ScreenWrapper'; import Section from '@components/Section'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Link from '@userActions/Link'; import * as Report from '@userActions/Report'; import CONST from '@src/CONST'; diff --git a/src/pages/KeyboardShortcutsPage.js b/src/pages/KeyboardShortcutsPage.js index c44c6213d3a5..809d2ce6dc07 100644 --- a/src/pages/KeyboardShortcutsPage.js +++ b/src/pages/KeyboardShortcutsPage.js @@ -6,8 +6,8 @@ import MenuItem from '@components/MenuItem'; import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import KeyboardShortcut from '@libs/KeyboardShortcut'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; function KeyboardShortcutsPage() { diff --git a/src/pages/LogInWithShortLivedAuthTokenPage.js b/src/pages/LogInWithShortLivedAuthTokenPage.js index 16d0c3909d62..1fe9b67eef16 100644 --- a/src/pages/LogInWithShortLivedAuthTokenPage.js +++ b/src/pages/LogInWithShortLivedAuthTokenPage.js @@ -10,9 +10,9 @@ import * as Illustrations from '@components/Icon/Illustrations'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Session from '@userActions/Session'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/NewChatPage.js b/src/pages/NewChatPage.js index 2bbd0556aad8..6f45c0b33f5a 100755 --- a/src/pages/NewChatPage.js +++ b/src/pages/NewChatPage.js @@ -11,13 +11,13 @@ import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; import useAutoFocusInput from '@hooks/useAutoFocusInput'; import useNetwork from '@hooks/useNetwork'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as Browser from '@libs/Browser'; import compose from '@libs/compose'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import Permissions from '@libs/Permissions'; import * as ReportUtils from '@libs/ReportUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import * as Report from '@userActions/Report'; import CONST from '@src/CONST'; diff --git a/src/pages/PrivateNotes/PrivateNotesEditPage.js b/src/pages/PrivateNotes/PrivateNotesEditPage.js index 88bf2ac569c2..c62fbe3edcb5 100644 --- a/src/pages/PrivateNotes/PrivateNotesEditPage.js +++ b/src/pages/PrivateNotes/PrivateNotesEditPage.js @@ -16,6 +16,7 @@ import Text from '@components/Text'; import TextInput from '@components/TextInput'; import withLocalize from '@components/withLocalize'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import * as ReportUtils from '@libs/ReportUtils'; @@ -23,7 +24,6 @@ import updateMultilineInputRange from '@libs/updateMultilineInputRange'; import withReportAndPrivateNotesOrNotFound from '@pages/home/report/withReportAndPrivateNotesOrNotFound'; import personalDetailsPropType from '@pages/personalDetailsPropType'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Report from '@userActions/Report'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/PrivateNotes/PrivateNotesListPage.js b/src/pages/PrivateNotes/PrivateNotesListPage.js index e9a4f11a7202..a34eb0ce596d 100644 --- a/src/pages/PrivateNotes/PrivateNotesListPage.js +++ b/src/pages/PrivateNotes/PrivateNotesListPage.js @@ -13,12 +13,12 @@ import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import withReportAndPrivateNotesOrNotFound from '@pages/home/report/withReportAndPrivateNotesOrNotFound'; import personalDetailsPropType from '@pages/personalDetailsPropType'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/PrivateNotes/PrivateNotesViewPage.js b/src/pages/PrivateNotes/PrivateNotesViewPage.js index 76057d3d74bc..1406dfd76748 100644 --- a/src/pages/PrivateNotes/PrivateNotesViewPage.js +++ b/src/pages/PrivateNotes/PrivateNotesViewPage.js @@ -10,12 +10,12 @@ import OfflineWithFeedback from '@components/OfflineWithFeedback'; import ScreenWrapper from '@components/ScreenWrapper'; import withLocalize from '@components/withLocalize'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import withReportAndPrivateNotesOrNotFound from '@pages/home/report/withReportAndPrivateNotesOrNotFound'; import personalDetailsPropType from '@pages/personalDetailsPropType'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/ProfilePage.js b/src/pages/ProfilePage.js index 3e5e8863bf22..3772b8127ef7 100755 --- a/src/pages/ProfilePage.js +++ b/src/pages/ProfilePage.js @@ -23,12 +23,12 @@ import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import UserDetailsTooltip from '@components/UserDetailsTooltip'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import * as ReportUtils from '@libs/ReportUtils'; import * as UserUtils from '@libs/UserUtils'; import * as ValidationUtils from '@libs/ValidationUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import * as PersonalDetails from '@userActions/PersonalDetails'; import * as Report from '@userActions/Report'; diff --git a/src/pages/ReferralDetailsPage.js b/src/pages/ReferralDetailsPage.js index 73e1ac393615..e05b6c5b0553 100644 --- a/src/pages/ReferralDetailsPage.js +++ b/src/pages/ReferralDetailsPage.js @@ -11,9 +11,9 @@ import MenuItem from '@components/MenuItem'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; import useSingleExecution from '@hooks/useSingleExecution'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import Clipboard from '@libs/Clipboard'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Link from '@userActions/Link'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/ReimbursementAccount/ACHContractStep.js b/src/pages/ReimbursementAccount/ACHContractStep.js index 4161932b35b6..d10d440a0af5 100644 --- a/src/pages/ReimbursementAccount/ACHContractStep.js +++ b/src/pages/ReimbursementAccount/ACHContractStep.js @@ -12,8 +12,8 @@ import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; import withLocalize from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as ValidationUtils from '@libs/ValidationUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as BankAccounts from '@userActions/BankAccounts'; import * as FormActions from '@userActions/FormActions'; import CONST from '@src/CONST'; diff --git a/src/pages/ReimbursementAccount/AddressForm.js b/src/pages/ReimbursementAccount/AddressForm.js index e18a5ae04ab7..d1d43f6a4108 100644 --- a/src/pages/ReimbursementAccount/AddressForm.js +++ b/src/pages/ReimbursementAccount/AddressForm.js @@ -5,7 +5,7 @@ import AddressSearch from '@components/AddressSearch'; import InputWrapper from '@components/Form/InputWrapper'; import StatePicker from '@components/StatePicker'; import TextInput from '@components/TextInput'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/pages/ReimbursementAccount/BankAccountManualStep.js b/src/pages/ReimbursementAccount/BankAccountManualStep.js index 7103d650b2fb..8e79a492bfe3 100644 --- a/src/pages/ReimbursementAccount/BankAccountManualStep.js +++ b/src/pages/ReimbursementAccount/BankAccountManualStep.js @@ -11,9 +11,9 @@ import TextInput from '@components/TextInput'; import TextLink from '@components/TextLink'; import {withLocalizePropTypes} from '@components/withLocalize'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import shouldDelayFocus from '@libs/shouldDelayFocus'; import * as ValidationUtils from '@libs/ValidationUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as BankAccounts from '@userActions/BankAccounts'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/ReimbursementAccount/BankAccountPlaidStep.js b/src/pages/ReimbursementAccount/BankAccountPlaidStep.js index 298862570271..c235a31f626f 100644 --- a/src/pages/ReimbursementAccount/BankAccountPlaidStep.js +++ b/src/pages/ReimbursementAccount/BankAccountPlaidStep.js @@ -13,8 +13,8 @@ import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; import withLocalize from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; -import useThemeStyles from '@styles/useThemeStyles'; import * as BankAccounts from '@userActions/BankAccounts'; import * as ReimbursementAccount from '@userActions/ReimbursementAccount'; import CONST from '@src/CONST'; diff --git a/src/pages/ReimbursementAccount/BankAccountStep.js b/src/pages/ReimbursementAccount/BankAccountStep.js index e60830054376..408c0e46a47d 100644 --- a/src/pages/ReimbursementAccount/BankAccountStep.js +++ b/src/pages/ReimbursementAccount/BankAccountStep.js @@ -15,10 +15,10 @@ import Section from '@components/Section'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; import withLocalize from '@components/withLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import getPlaidDesktopMessage from '@libs/getPlaidDesktopMessage'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import * as BankAccounts from '@userActions/BankAccounts'; import * as Link from '@userActions/Link'; diff --git a/src/pages/ReimbursementAccount/CompanyStep.js b/src/pages/ReimbursementAccount/CompanyStep.js index 51fd467c28ff..957965f9ed7d 100644 --- a/src/pages/ReimbursementAccount/CompanyStep.js +++ b/src/pages/ReimbursementAccount/CompanyStep.js @@ -18,9 +18,9 @@ import Text from '@components/Text'; import TextInput from '@components/TextInput'; import TextLink from '@components/TextLink'; import withLocalize from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as ValidationUtils from '@libs/ValidationUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as BankAccounts from '@userActions/BankAccounts'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/ReimbursementAccount/ContinueBankAccountSetup.js b/src/pages/ReimbursementAccount/ContinueBankAccountSetup.js index 45c503494c3d..d1ac0989ae38 100644 --- a/src/pages/ReimbursementAccount/ContinueBankAccountSetup.js +++ b/src/pages/ReimbursementAccount/ContinueBankAccountSetup.js @@ -13,8 +13,8 @@ import ScreenWrapper from '@components/ScreenWrapper'; import Section from '@components/Section'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import WorkspaceResetBankAccountModal from '@pages/workspace/WorkspaceResetBankAccountModal'; -import useThemeStyles from '@styles/useThemeStyles'; import * as BankAccounts from '@userActions/BankAccounts'; import CONST from '@src/CONST'; import * as ReimbursementAccountProps from './reimbursementAccountPropTypes'; diff --git a/src/pages/ReimbursementAccount/Enable2FAPrompt.js b/src/pages/ReimbursementAccount/Enable2FAPrompt.js index d91c8df7bed0..90752a57c50b 100644 --- a/src/pages/ReimbursementAccount/Enable2FAPrompt.js +++ b/src/pages/ReimbursementAccount/Enable2FAPrompt.js @@ -6,8 +6,8 @@ import * as Illustrations from '@components/Icon/Illustrations'; import Section from '@components/Section'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import ROUTES from '@src/ROUTES'; const propTypes = { diff --git a/src/pages/ReimbursementAccount/EnableStep.js b/src/pages/ReimbursementAccount/EnableStep.js index e7bdcf4082d2..d8d76d6cfb2f 100644 --- a/src/pages/ReimbursementAccount/EnableStep.js +++ b/src/pages/ReimbursementAccount/EnableStep.js @@ -15,10 +15,10 @@ import ScreenWrapper from '@components/ScreenWrapper'; import Section from '@components/Section'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import userPropTypes from '@pages/settings/userPropTypes'; import WorkspaceResetBankAccountModal from '@pages/workspace/WorkspaceResetBankAccountModal'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Link from '@userActions/Link'; import * as BankAccounts from '@userActions/ReimbursementAccount'; import CONST from '@src/CONST'; diff --git a/src/pages/ReimbursementAccount/ExampleCheck.js b/src/pages/ReimbursementAccount/ExampleCheck.js index aa32caf8144d..47bb59af1050 100644 --- a/src/pages/ReimbursementAccount/ExampleCheck.js +++ b/src/pages/ReimbursementAccount/ExampleCheck.js @@ -1,8 +1,8 @@ import React from 'react'; import {Image} from 'react-native'; import useLocalize from '@hooks/useLocalize'; -import useThemeIllustrations from '@styles/illustrations/useThemeIllustrations'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeIllustrations from '@hooks/useThemeIllustrations'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; function ExampleCheckImage() { diff --git a/src/pages/ReimbursementAccount/IdentityForm.js b/src/pages/ReimbursementAccount/IdentityForm.js index bab1a0bca81e..c1ee79f56a14 100644 --- a/src/pages/ReimbursementAccount/IdentityForm.js +++ b/src/pages/ReimbursementAccount/IdentityForm.js @@ -6,7 +6,7 @@ import _ from 'underscore'; import DatePicker from '@components/DatePicker'; import InputWrapper from '@components/Form/InputWrapper'; import TextInput from '@components/TextInput'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; import AddressForm from './AddressForm'; diff --git a/src/pages/ReimbursementAccount/ReimbursementAccountPage.js b/src/pages/ReimbursementAccount/ReimbursementAccountPage.js index de1c02cd1dbd..81d4af93d86c 100644 --- a/src/pages/ReimbursementAccount/ReimbursementAccountPage.js +++ b/src/pages/ReimbursementAccount/ReimbursementAccountPage.js @@ -13,6 +13,7 @@ import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; import usePrevious from '@hooks/usePrevious'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import getPlaidOAuthReceivedRedirectURI from '@libs/getPlaidOAuthReceivedRedirectURI'; import BankAccount from '@libs/models/BankAccount'; @@ -20,7 +21,6 @@ import Navigation from '@libs/Navigation/Navigation'; import * as PolicyUtils from '@libs/PolicyUtils'; import shouldReopenOnfido from '@libs/shouldReopenOnfido'; import withPolicy from '@pages/workspace/withPolicy'; -import useThemeStyles from '@styles/useThemeStyles'; import * as BankAccounts from '@userActions/BankAccounts'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; @@ -159,7 +159,7 @@ function getRouteForCurrentStep(currentStep) { } function ReimbursementAccountPage({reimbursementAccount, route, onfidoToken, policy, account, isLoadingApp, session, plaidLinkToken, plaidCurrentEvent, reimbursementAccountDraft}) { - /** + /** The SetupWithdrawalAccount flow allows us to continue the flow from various points depending on where the user left off. This view will refer to the achData as the single source of truth to determine which route to display. We can also specify a specific route to navigate to via route params when the component first @@ -235,7 +235,7 @@ function ReimbursementAccountPage({reimbursementAccount, route, onfidoToken, pol return achData.state === BankAccount.STATE.PENDING || _.contains([CONST.BANK_ACCOUNT.STEP.BANK_ACCOUNT, ''], getStepToOpenFromRouteParams(route)); } - /** + /** When this page is first opened, `reimbursementAccount` prop might not yet be fully loaded from Onyx or could be partially loaded such that `reimbursementAccount.achData.currentStep` is unavailable. Calculating `shouldShowContinueSetupButton` immediately on initial render doesn't make sense as diff --git a/src/pages/ReimbursementAccount/RequestorOnfidoStep.js b/src/pages/ReimbursementAccount/RequestorOnfidoStep.js index dc6cff300b09..b149e28d7f11 100644 --- a/src/pages/ReimbursementAccount/RequestorOnfidoStep.js +++ b/src/pages/ReimbursementAccount/RequestorOnfidoStep.js @@ -8,8 +8,8 @@ import HeaderWithBackButton from '@components/HeaderWithBackButton'; import Onfido from '@components/Onfido'; import ScreenWrapper from '@components/ScreenWrapper'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import Growl from '@libs/Growl'; -import useThemeStyles from '@styles/useThemeStyles'; import * as BankAccounts from '@userActions/BankAccounts'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/ReimbursementAccount/RequestorStep.js b/src/pages/ReimbursementAccount/RequestorStep.js index 31f5f0f4d315..e5e0c36aeaa2 100644 --- a/src/pages/ReimbursementAccount/RequestorStep.js +++ b/src/pages/ReimbursementAccount/RequestorStep.js @@ -10,8 +10,8 @@ import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as ValidationUtils from '@libs/ValidationUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as BankAccounts from '@userActions/BankAccounts'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/ReimbursementAccount/ValidationStep.js b/src/pages/ReimbursementAccount/ValidationStep.js index 00b6e6928c7c..f1dfc944a24c 100644 --- a/src/pages/ReimbursementAccount/ValidationStep.js +++ b/src/pages/ReimbursementAccount/ValidationStep.js @@ -18,11 +18,11 @@ import Text from '@components/Text'; import TextInput from '@components/TextInput'; import TextLink from '@components/TextLink'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import BankAccount from '@libs/models/BankAccount'; import * as ValidationUtils from '@libs/ValidationUtils'; import WorkspaceResetBankAccountModal from '@pages/workspace/WorkspaceResetBankAccountModal'; -import useThemeStyles from '@styles/useThemeStyles'; import * as BankAccounts from '@userActions/BankAccounts'; import * as Report from '@userActions/Report'; import CONST from '@src/CONST'; diff --git a/src/pages/ReportDetailsPage.js b/src/pages/ReportDetailsPage.js index fcc497111b92..dc8b77db4ac8 100644 --- a/src/pages/ReportDetailsPage.js +++ b/src/pages/ReportDetailsPage.js @@ -16,12 +16,12 @@ import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeed import RoomHeaderAvatars from '@components/RoomHeaderAvatars'; import ScreenWrapper from '@components/ScreenWrapper'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as PolicyUtils from '@libs/PolicyUtils'; import * as ReportUtils from '@libs/ReportUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Report from '@userActions/Report'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/ReportParticipantsPage.js b/src/pages/ReportParticipantsPage.js index ceaa53a41a6b..4ec31b29f914 100755 --- a/src/pages/ReportParticipantsPage.js +++ b/src/pages/ReportParticipantsPage.js @@ -9,13 +9,13 @@ import HeaderWithBackButton from '@components/HeaderWithBackButton'; import OptionsList from '@components/OptionsList'; import ScreenWrapper from '@components/ScreenWrapper'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as LocalePhoneNumber from '@libs/LocalePhoneNumber'; import Navigation from '@libs/Navigation/Navigation'; import * as PersonalDetailsUtils from '@libs/PersonalDetailsUtils'; import * as ReportUtils from '@libs/ReportUtils'; import * as UserUtils from '@libs/UserUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/ReportWelcomeMessagePage.js b/src/pages/ReportWelcomeMessagePage.js index a17e1efe6a0c..ae8a4635a98e 100644 --- a/src/pages/ReportWelcomeMessagePage.js +++ b/src/pages/ReportWelcomeMessagePage.js @@ -12,11 +12,11 @@ import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import TextInput from '@components/TextInput'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import * as ReportUtils from '@libs/ReportUtils'; import updateMultilineInputRange from '@libs/updateMultilineInputRange'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Report from '@userActions/Report'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/RoomInvitePage.js b/src/pages/RoomInvitePage.js index 9b5b4f461652..cb72b2f8b08a 100644 --- a/src/pages/RoomInvitePage.js +++ b/src/pages/RoomInvitePage.js @@ -10,6 +10,7 @@ import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import SelectionList from '@components/SelectionList'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Browser from '@libs/Browser'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; @@ -17,7 +18,6 @@ import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as PersonalDetailsUtils from '@libs/PersonalDetailsUtils'; import * as PolicyUtils from '@libs/PolicyUtils'; import * as ReportUtils from '@libs/ReportUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Report from '@userActions/Report'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/RoomMembersPage.js b/src/pages/RoomMembersPage.js index a48ab08408f2..d8e7dbdaf76e 100644 --- a/src/pages/RoomMembersPage.js +++ b/src/pages/RoomMembersPage.js @@ -13,6 +13,7 @@ import SelectionList from '@components/SelectionList'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultProps, withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Browser from '@libs/Browser'; import compose from '@libs/compose'; import Log from '@libs/Log'; @@ -21,7 +22,6 @@ import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as PolicyUtils from '@libs/PolicyUtils'; import * as ReportUtils from '@libs/ReportUtils'; import * as UserUtils from '@libs/UserUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Report from '@userActions/Report'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/TeachersUnite/ImTeacherUpdateEmailPage.js b/src/pages/TeachersUnite/ImTeacherUpdateEmailPage.js index 2dad59fc01b7..e9564bfffe0b 100644 --- a/src/pages/TeachersUnite/ImTeacherUpdateEmailPage.js +++ b/src/pages/TeachersUnite/ImTeacherUpdateEmailPage.js @@ -6,8 +6,8 @@ import HeaderWithBackButton from '@components/HeaderWithBackButton'; import * as Illustrations from '@components/Icon/Illustrations'; import ScreenWrapper from '@components/ScreenWrapper'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/TeachersUnite/IntroSchoolPrincipalPage.js b/src/pages/TeachersUnite/IntroSchoolPrincipalPage.js index f44356347273..3e2a2a2775a3 100644 --- a/src/pages/TeachersUnite/IntroSchoolPrincipalPage.js +++ b/src/pages/TeachersUnite/IntroSchoolPrincipalPage.js @@ -12,10 +12,10 @@ import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import TextInput from '@components/TextInput'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as ErrorUtils from '@libs/ErrorUtils'; import Navigation from '@libs/Navigation/Navigation'; import * as ValidationUtils from '@libs/ValidationUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import TeachersUnite from '@userActions/TeachersUnite'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/TeachersUnite/KnowATeacherPage.js b/src/pages/TeachersUnite/KnowATeacherPage.js index f2a5732b6a0a..61e03017b7ea 100644 --- a/src/pages/TeachersUnite/KnowATeacherPage.js +++ b/src/pages/TeachersUnite/KnowATeacherPage.js @@ -12,11 +12,11 @@ import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import TextInput from '@components/TextInput'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as ErrorUtils from '@libs/ErrorUtils'; import * as LoginUtils from '@libs/LoginUtils'; import Navigation from '@libs/Navigation/Navigation'; import * as ValidationUtils from '@libs/ValidationUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import TeachersUnite from '@userActions/TeachersUnite'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/TeachersUnite/SaveTheWorldPage.js b/src/pages/TeachersUnite/SaveTheWorldPage.js index d179b7d1db95..36e03f0b4716 100644 --- a/src/pages/TeachersUnite/SaveTheWorldPage.js +++ b/src/pages/TeachersUnite/SaveTheWorldPage.js @@ -8,9 +8,9 @@ import LottieAnimations from '@components/LottieAnimations'; import MenuItem from '@components/MenuItem'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/home/HeaderView.js b/src/pages/home/HeaderView.js index f5f50244d274..0647310940bd 100644 --- a/src/pages/home/HeaderView.js +++ b/src/pages/home/HeaderView.js @@ -20,6 +20,8 @@ import Text from '@components/Text'; import ThreeDotsMenu from '@components/ThreeDotsMenu'; import Tooltip from '@components/Tooltip'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import {getGroupChatName} from '@libs/GroupChatUtils'; import * as HeaderUtils from '@libs/HeaderUtils'; @@ -28,8 +30,6 @@ import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as ReportActionsUtils from '@libs/ReportActionsUtils'; import * as ReportUtils from '@libs/ReportUtils'; import reportPropTypes from '@pages/reportPropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Link from '@userActions/Link'; import * as Report from '@userActions/Report'; import * as Session from '@userActions/Session'; diff --git a/src/pages/home/ReportScreen.js b/src/pages/home/ReportScreen.js index 971c0737d8aa..c910f170cc2b 100644 --- a/src/pages/home/ReportScreen.js +++ b/src/pages/home/ReportScreen.js @@ -18,6 +18,7 @@ import withViewportOffsetTop from '@components/withViewportOffsetTop'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; import usePrevious from '@hooks/usePrevious'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; @@ -27,7 +28,6 @@ import * as ReportUtils from '@libs/ReportUtils'; import personalDetailsPropType from '@pages/personalDetailsPropType'; import reportMetadataPropTypes from '@pages/reportMetadataPropTypes'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as ComposerActions from '@userActions/Composer'; import * as Report from '@userActions/Report'; import CONST from '@src/CONST'; diff --git a/src/pages/home/report/AnimatedEmptyStateBackground.js b/src/pages/home/report/AnimatedEmptyStateBackground.js index 0ff401a9d3f4..7e259b7473cf 100644 --- a/src/pages/home/report/AnimatedEmptyStateBackground.js +++ b/src/pages/home/report/AnimatedEmptyStateBackground.js @@ -1,9 +1,9 @@ import React from 'react'; import Animated, {SensorType, useAnimatedSensor, useAnimatedStyle, useSharedValue, withSpring} from 'react-native-reanimated'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeIllustrations from '@hooks/useThemeIllustrations'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as NumberUtils from '@libs/NumberUtils'; -import useThemeIllustrations from '@styles/illustrations/useThemeIllustrations'; -import useStyleUtils from '@styles/useStyleUtils'; import variables from '@styles/variables'; import CONST from '@src/CONST'; diff --git a/src/pages/home/report/ContextMenu/BaseReportActionContextMenu.js b/src/pages/home/report/ContextMenu/BaseReportActionContextMenu.js index 33adfa4b35f9..0a9941072df7 100755 --- a/src/pages/home/report/ContextMenu/BaseReportActionContextMenu.js +++ b/src/pages/home/report/ContextMenu/BaseReportActionContextMenu.js @@ -11,8 +11,8 @@ import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withW import useArrowKeyFocusManager from '@hooks/useArrowKeyFocusManager'; import useKeyboardShortcut from '@hooks/useKeyboardShortcut'; import useNetwork from '@hooks/useNetwork'; +import useStyleUtils from '@hooks/useStyleUtils'; import compose from '@libs/compose'; -import useStyleUtils from '@styles/useStyleUtils'; import * as Session from '@userActions/Session'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/home/report/ContextMenu/MiniReportActionContextMenu/index.js b/src/pages/home/report/ContextMenu/MiniReportActionContextMenu/index.js index f5a688e9d8ed..d858206cdfc3 100644 --- a/src/pages/home/report/ContextMenu/MiniReportActionContextMenu/index.js +++ b/src/pages/home/report/ContextMenu/MiniReportActionContextMenu/index.js @@ -2,12 +2,12 @@ import PropTypes from 'prop-types'; import React from 'react'; import {View} from 'react-native'; import _ from 'underscore'; +import useStyleUtils from '@hooks/useStyleUtils'; import BaseReportActionContextMenu from '@pages/home/report/ContextMenu/BaseReportActionContextMenu'; import { defaultProps as GenericReportActionContextMenuDefaultProps, propTypes as genericReportActionContextMenuPropTypes, } from '@pages/home/report/ContextMenu/genericReportActionContextMenuPropTypes'; -import useStyleUtils from '@styles/useStyleUtils'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.android.js b/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.android.js index 873e7fa243af..700a2fb399e4 100644 --- a/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.android.js +++ b/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.android.js @@ -1,6 +1,6 @@ import React from 'react'; import {Animated, View} from 'react-native'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import floatingMessageCounterContainerPropTypes from './floatingMessageCounterContainerPropTypes'; function FloatingMessageCounterContainer(props) { diff --git a/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.js b/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.js index 0b721067631c..19123e65cbf2 100644 --- a/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.js +++ b/src/pages/home/report/FloatingMessageCounter/FloatingMessageCounterContainer/index.js @@ -1,6 +1,6 @@ import React from 'react'; import {Animated} from 'react-native'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import floatingMessageCounterContainerPropTypes from './floatingMessageCounterContainerPropTypes'; function FloatingMessageCounterContainer(props) { diff --git a/src/pages/home/report/FloatingMessageCounter/index.js b/src/pages/home/report/FloatingMessageCounter/index.js index fe0a343e973b..07138104bf74 100644 --- a/src/pages/home/report/FloatingMessageCounter/index.js +++ b/src/pages/home/report/FloatingMessageCounter/index.js @@ -6,9 +6,9 @@ import Icon from '@components/Icon'; import * as Expensicons from '@components/Icon/Expensicons'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useNativeDriver from '@libs/useNativeDriver'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import FloatingMessageCounterContainer from './FloatingMessageCounterContainer'; diff --git a/src/pages/home/report/LinkPreviewer.js b/src/pages/home/report/LinkPreviewer.js index 5c16d5596774..f62295a6fb71 100644 --- a/src/pages/home/report/LinkPreviewer.js +++ b/src/pages/home/report/LinkPreviewer.js @@ -5,9 +5,9 @@ import {Image, View} from 'react-native'; import _ from 'underscore'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; const IMAGE_TYPES = ['jpg', 'jpeg', 'png']; diff --git a/src/pages/home/report/ListBoundaryLoader/ListBoundaryLoader.js b/src/pages/home/report/ListBoundaryLoader/ListBoundaryLoader.js index 7184944d5902..77bcc7bdd38e 100644 --- a/src/pages/home/report/ListBoundaryLoader/ListBoundaryLoader.js +++ b/src/pages/home/report/ListBoundaryLoader/ListBoundaryLoader.js @@ -3,8 +3,8 @@ import React from 'react'; import {ActivityIndicator, View} from 'react-native'; import ReportActionsSkeletonView from '@components/ReportActionsSkeletonView'; import useNetwork from '@hooks/useNetwork'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/pages/home/report/ParticipantLocalTime.js b/src/pages/home/report/ParticipantLocalTime.js index 5efd53fe6ae7..1992953c959e 100644 --- a/src/pages/home/report/ParticipantLocalTime.js +++ b/src/pages/home/report/ParticipantLocalTime.js @@ -4,9 +4,9 @@ import {View} from 'react-native'; import participantPropTypes from '@components/participantPropTypes'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import DateUtils from '@libs/DateUtils'; import Timers from '@libs/Timers'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/pages/home/report/ReactionList/BaseReactionList.js b/src/pages/home/report/ReactionList/BaseReactionList.js index f94f6cdfde0d..2d881d080c31 100755 --- a/src/pages/home/report/ReactionList/BaseReactionList.js +++ b/src/pages/home/report/ReactionList/BaseReactionList.js @@ -6,9 +6,9 @@ import {FlatList} from 'react-native'; import OptionRow from '@components/OptionRow'; import participantPropTypes from '@components/participantPropTypes'; import withWindowDimensions from '@components/withWindowDimensions'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; import * as UserUtils from '@libs/UserUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import CONST from '@src/CONST'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/home/report/ReactionList/HeaderReactionList.js b/src/pages/home/report/ReactionList/HeaderReactionList.js index 1b1751e32eef..04b124f969a9 100644 --- a/src/pages/home/report/ReactionList/HeaderReactionList.js +++ b/src/pages/home/report/ReactionList/HeaderReactionList.js @@ -4,10 +4,10 @@ import {View} from 'react-native'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as EmojiUtils from '@libs/EmojiUtils'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import reactionPropTypes from './reactionPropTypes'; const propTypes = { diff --git a/src/pages/home/report/ReportActionCompose/AttachmentPickerWithMenuItems.js b/src/pages/home/report/ReportActionCompose/AttachmentPickerWithMenuItems.js index 31a5a0857577..1aeae46c252f 100644 --- a/src/pages/home/report/ReportActionCompose/AttachmentPickerWithMenuItems.js +++ b/src/pages/home/report/ReportActionCompose/AttachmentPickerWithMenuItems.js @@ -9,11 +9,11 @@ import PopoverMenu from '@components/PopoverMenu'; import PressableWithFeedback from '@components/Pressable/PressableWithFeedback'; import Tooltip from '@components/Tooltip/PopoverAnchorTooltip'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as Browser from '@libs/Browser'; import Navigation from '@libs/Navigation/Navigation'; import * as ReportUtils from '@libs/ReportUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import * as Report from '@userActions/Report'; import * as Task from '@userActions/Task'; diff --git a/src/pages/home/report/ReportActionCompose/ComposerWithSuggestions/ComposerWithSuggestions.js b/src/pages/home/report/ReportActionCompose/ComposerWithSuggestions/ComposerWithSuggestions.js index 2157a7549509..8def3a53ca0d 100644 --- a/src/pages/home/report/ReportActionCompose/ComposerWithSuggestions/ComposerWithSuggestions.js +++ b/src/pages/home/report/ReportActionCompose/ComposerWithSuggestions/ComposerWithSuggestions.js @@ -9,6 +9,9 @@ import withKeyboardState from '@components/withKeyboardState'; import useDebounce from '@hooks/useDebounce'; import useLocalize from '@hooks/useLocalize'; import usePrevious from '@hooks/usePrevious'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as Browser from '@libs/Browser'; import canFocusInputOnScreenFocus from '@libs/canFocusInputOnScreenFocus'; @@ -27,9 +30,6 @@ import updateMultilineInputRange from '@libs/updateMultilineInputRange'; import willBlurTextInputOnTapOutsideFunc from '@libs/willBlurTextInputOnTapOutside'; import SilentCommentUpdater from '@pages/home/report/ReportActionCompose/SilentCommentUpdater'; import Suggestions from '@pages/home/report/ReportActionCompose/Suggestions'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as EmojiPickerActions from '@userActions/EmojiPickerAction'; import * as InputFocus from '@userActions/InputFocus'; import * as Report from '@userActions/Report'; diff --git a/src/pages/home/report/ReportActionCompose/ReportActionCompose.js b/src/pages/home/report/ReportActionCompose/ReportActionCompose.js index 3d29aa4918ad..396e94d9cf9d 100644 --- a/src/pages/home/report/ReportActionCompose/ReportActionCompose.js +++ b/src/pages/home/report/ReportActionCompose/ReportActionCompose.js @@ -15,6 +15,7 @@ import {usePersonalDetails, withNetwork} from '@components/OnyxProvider'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultProps, withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails'; import useHandleExceedMaxCommentLength from '@hooks/useHandleExceedMaxCommentLength'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import canFocusInputOnScreenFocus from '@libs/canFocusInputOnScreenFocus'; import compose from '@libs/compose'; @@ -29,7 +30,6 @@ import reportActionPropTypes from '@pages/home/report/reportActionPropTypes'; import ReportDropUI from '@pages/home/report/ReportDropUI'; import ReportTypingIndicator from '@pages/home/report/ReportTypingIndicator'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as EmojiPickerActions from '@userActions/EmojiPickerAction'; import * as Report from '@userActions/Report'; import * as User from '@userActions/User'; diff --git a/src/pages/home/report/ReportActionCompose/SendButton.js b/src/pages/home/report/ReportActionCompose/SendButton.js index fde40998fa8c..d0b0453ace2f 100644 --- a/src/pages/home/report/ReportActionCompose/SendButton.js +++ b/src/pages/home/report/ReportActionCompose/SendButton.js @@ -7,8 +7,8 @@ import * as Expensicons from '@components/Icon/Expensicons'; import PressableWithFeedback from '@components/Pressable/PressableWithFeedback'; import Tooltip from '@components/Tooltip'; import useLocalize from '@hooks/useLocalize'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/pages/home/report/ReportActionItem.js b/src/pages/home/report/ReportActionItem.js index 3e4eebffe48f..2e888a5471b8 100644 --- a/src/pages/home/report/ReportActionItem.js +++ b/src/pages/home/report/ReportActionItem.js @@ -32,6 +32,9 @@ import UnreadActionIndicator from '@components/UnreadActionIndicator'; import withLocalize from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; import usePrevious from '@hooks/usePrevious'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import ControlSelection from '@libs/ControlSelection'; import * as CurrencyUtils from '@libs/CurrencyUtils'; @@ -46,9 +49,6 @@ import SelectionScraper from '@libs/SelectionScraper'; import userWalletPropTypes from '@pages/EnablePayments/userWalletPropTypes'; import {ReactionListContext} from '@pages/home/ReportScreenContext'; import reportPropTypes from '@pages/reportPropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as BankAccounts from '@userActions/BankAccounts'; import * as EmojiPickerAction from '@userActions/EmojiPickerAction'; import * as store from '@userActions/ReimbursementAccount/store'; diff --git a/src/pages/home/report/ReportActionItemBasicMessage.tsx b/src/pages/home/report/ReportActionItemBasicMessage.tsx index bf53ee16450d..63e6d2424a7c 100644 --- a/src/pages/home/report/ReportActionItemBasicMessage.tsx +++ b/src/pages/home/report/ReportActionItemBasicMessage.tsx @@ -1,7 +1,7 @@ import React from 'react'; import {View} from 'react-native'; import Text from '@components/Text'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import ChildrenProps from '@src/types/utils/ChildrenProps'; type ReportActionItemBasicMessageProps = ChildrenProps & { diff --git a/src/pages/home/report/ReportActionItemCreated.js b/src/pages/home/report/ReportActionItemCreated.js index 633701f0b375..e5ec3e4b8744 100644 --- a/src/pages/home/report/ReportActionItemCreated.js +++ b/src/pages/home/report/ReportActionItemCreated.js @@ -10,12 +10,12 @@ import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeed import ReportWelcomeText from '@components/ReportWelcomeText'; import withLocalize from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import reportWithoutHasDraftSelector from '@libs/OnyxSelectors/reportWithoutHasDraftSelector'; import * as ReportUtils from '@libs/ReportUtils'; import reportPropTypes from '@pages/reportPropTypes'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Report from '@userActions/Report'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/home/report/ReportActionItemDate.js b/src/pages/home/report/ReportActionItemDate.js index a65bdd4aa7d7..58471a88061f 100644 --- a/src/pages/home/report/ReportActionItemDate.js +++ b/src/pages/home/report/ReportActionItemDate.js @@ -3,8 +3,8 @@ import React, {memo} from 'react'; import {withCurrentDate} from '@components/OnyxProvider'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; -import useThemeStyles from '@styles/useThemeStyles'; const propTypes = { /** UTC timestamp for when the action was created */ diff --git a/src/pages/home/report/ReportActionItemDraft.tsx b/src/pages/home/report/ReportActionItemDraft.tsx index b46af5401ee4..de4458d7b39f 100644 --- a/src/pages/home/report/ReportActionItemDraft.tsx +++ b/src/pages/home/report/ReportActionItemDraft.tsx @@ -1,6 +1,6 @@ import React from 'react'; import {View} from 'react-native'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import ChildrenProps from '@src/types/utils/ChildrenProps'; function ReportActionItemDraft({children}: ChildrenProps) { diff --git a/src/pages/home/report/ReportActionItemFragment.js b/src/pages/home/report/ReportActionItemFragment.js index c5097bdfc4a5..f05b3decc6d7 100644 --- a/src/pages/home/report/ReportActionItemFragment.js +++ b/src/pages/home/report/ReportActionItemFragment.js @@ -7,10 +7,10 @@ import Text from '@components/Text'; import UserDetailsTooltip from '@components/UserDetailsTooltip'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import convertToLTR from '@libs/convertToLTR'; import * as ReportUtils from '@libs/ReportUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import AttachmentCommentFragment from './comment/AttachmentCommentFragment'; import TextCommentFragment from './comment/TextCommentFragment'; diff --git a/src/pages/home/report/ReportActionItemGrouped.tsx b/src/pages/home/report/ReportActionItemGrouped.tsx index 5e49f7af9d10..2dff5b81c6a7 100644 --- a/src/pages/home/report/ReportActionItemGrouped.tsx +++ b/src/pages/home/report/ReportActionItemGrouped.tsx @@ -1,6 +1,6 @@ import React from 'react'; import {StyleProp, View, ViewStyle} from 'react-native'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import ChildrenProps from '@src/types/utils/ChildrenProps'; type ReportActionItemGroupedProps = ChildrenProps & { diff --git a/src/pages/home/report/ReportActionItemMessage.js b/src/pages/home/report/ReportActionItemMessage.js index 46e0438f250a..b47d941f40b5 100644 --- a/src/pages/home/report/ReportActionItemMessage.js +++ b/src/pages/home/report/ReportActionItemMessage.js @@ -4,9 +4,9 @@ import React from 'react'; import {Text, View} from 'react-native'; import _ from 'underscore'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as ReportActionsUtils from '@libs/ReportActionsUtils'; import * as ReportUtils from '@libs/ReportUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import TextCommentFragment from './comment/TextCommentFragment'; import ReportActionItemFragment from './ReportActionItemFragment'; diff --git a/src/pages/home/report/ReportActionItemMessageEdit.js b/src/pages/home/report/ReportActionItemMessageEdit.js index ca66822e6215..3da0fad72f0a 100644 --- a/src/pages/home/report/ReportActionItemMessageEdit.js +++ b/src/pages/home/report/ReportActionItemMessageEdit.js @@ -17,6 +17,9 @@ import useHandleExceedMaxCommentLength from '@hooks/useHandleExceedMaxCommentLen import useKeyboardState from '@hooks/useKeyboardState'; import useLocalize from '@hooks/useLocalize'; import useReportScrollManager from '@hooks/useReportScrollManager'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as Browser from '@libs/Browser'; import * as ComposerUtils from '@libs/ComposerUtils'; @@ -28,9 +31,6 @@ import * as ReportActionsUtils from '@libs/ReportActionsUtils'; import * as ReportUtils from '@libs/ReportUtils'; import setShouldShowComposeInputKeyboardAware from '@libs/setShouldShowComposeInputKeyboardAware'; import reportPropTypes from '@pages/reportPropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as EmojiPickerAction from '@userActions/EmojiPickerAction'; import * as InputFocus from '@userActions/InputFocus'; import * as Report from '@userActions/Report'; diff --git a/src/pages/home/report/ReportActionItemParentAction.js b/src/pages/home/report/ReportActionItemParentAction.js index 4a125d1d5633..c11200ccc4db 100644 --- a/src/pages/home/report/ReportActionItemParentAction.js +++ b/src/pages/home/report/ReportActionItemParentAction.js @@ -6,11 +6,11 @@ import {withOnyx} from 'react-native-onyx'; import OfflineWithFeedback from '@components/OfflineWithFeedback'; import withLocalize from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as ReportActionsUtils from '@libs/ReportActionsUtils'; import reportPropTypes from '@pages/reportPropTypes'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Report from '@userActions/Report'; import ONYXKEYS from '@src/ONYXKEYS'; import AnimatedEmptyStateBackground from './AnimatedEmptyStateBackground'; diff --git a/src/pages/home/report/ReportActionItemSingle.js b/src/pages/home/report/ReportActionItemSingle.js index 2c4df44d8b57..81827073aa49 100644 --- a/src/pages/home/report/ReportActionItemSingle.js +++ b/src/pages/home/report/ReportActionItemSingle.js @@ -13,6 +13,9 @@ import Text from '@components/Text'; import Tooltip from '@components/Tooltip'; import UserDetailsTooltip from '@components/UserDetailsTooltip'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import ControlSelection from '@libs/ControlSelection'; import DateUtils from '@libs/DateUtils'; import Navigation from '@libs/Navigation/Navigation'; @@ -20,9 +23,6 @@ import * as ReportUtils from '@libs/ReportUtils'; import * as UserUtils from '@libs/UserUtils'; import reportPropTypes from '@pages/reportPropTypes'; import stylePropTypes from '@styles/stylePropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ROUTES from '@src/ROUTES'; import ReportActionItemDate from './ReportActionItemDate'; diff --git a/src/pages/home/report/ReportActionItemThread.js b/src/pages/home/report/ReportActionItemThread.js index a3da95147020..35ef49dc97fd 100644 --- a/src/pages/home/report/ReportActionItemThread.js +++ b/src/pages/home/report/ReportActionItemThread.js @@ -6,8 +6,8 @@ import MultipleAvatars from '@components/MultipleAvatars'; import PressableWithSecondaryInteraction from '@components/PressableWithSecondaryInteraction'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Report from '@userActions/Report'; import CONST from '@src/CONST'; diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js index 55995a8059e7..46abbfc71b84 100644 --- a/src/pages/home/report/ReportActionsList.js +++ b/src/pages/home/report/ReportActionsList.js @@ -12,12 +12,12 @@ import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withW import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; import useReportScrollManager from '@hooks/useReportScrollManager'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import DateUtils from '@libs/DateUtils'; import * as ReportActionsUtils from '@libs/ReportActionsUtils'; import * as ReportUtils from '@libs/ReportUtils'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import * as Report from '@userActions/Report'; import CONST from '@src/CONST'; diff --git a/src/pages/home/report/ReportDropUI.js b/src/pages/home/report/ReportDropUI.js index 2f4c81313ec2..c1c3b8e506ab 100644 --- a/src/pages/home/report/ReportDropUI.js +++ b/src/pages/home/report/ReportDropUI.js @@ -6,7 +6,7 @@ import Icon from '@components/Icon'; import * as Expensicons from '@components/Icon/Expensicons'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; const propTypes = { /** Callback to execute when a file is dropped. */ diff --git a/src/pages/home/report/ReportFooter.js b/src/pages/home/report/ReportFooter.js index e5dd5da19ad5..48bfd5d18bcc 100644 --- a/src/pages/home/report/ReportFooter.js +++ b/src/pages/home/report/ReportFooter.js @@ -9,10 +9,10 @@ import participantPropTypes from '@components/participantPropTypes'; import SwipeableView from '@components/SwipeableView'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; import useNetwork from '@hooks/useNetwork'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as ReportUtils from '@libs/ReportUtils'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import * as Session from '@userActions/Session'; import CONST from '@src/CONST'; diff --git a/src/pages/home/report/ReportTypingIndicator.js b/src/pages/home/report/ReportTypingIndicator.js index 3a2c611ac358..74778b364db1 100755 --- a/src/pages/home/report/ReportTypingIndicator.js +++ b/src/pages/home/report/ReportTypingIndicator.js @@ -7,8 +7,8 @@ import {withNetwork} from '@components/OnyxProvider'; import Text from '@components/Text'; import TextWithEllipsis from '@components/TextWithEllipsis'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; -import useThemeStyles from '@styles/useThemeStyles'; import * as PersonalDetails from '@userActions/PersonalDetails'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/home/report/comment/AttachmentCommentFragment.js b/src/pages/home/report/comment/AttachmentCommentFragment.js index ec75edd18a35..30c131b57060 100644 --- a/src/pages/home/report/comment/AttachmentCommentFragment.js +++ b/src/pages/home/report/comment/AttachmentCommentFragment.js @@ -1,8 +1,8 @@ import PropTypes from 'prop-types'; import React from 'react'; import {View} from 'react-native'; +import useThemeStyles from '@hooks/useThemeStyles'; import reportActionSourcePropType from '@pages/home/report/reportActionSourcePropType'; -import useThemeStyles from '@styles/useThemeStyles'; import RenderCommentHTML from './RenderCommentHTML'; const propTypes = { diff --git a/src/pages/home/report/comment/TextCommentFragment.js b/src/pages/home/report/comment/TextCommentFragment.js index 403c470dfc9d..3d6482344450 100644 --- a/src/pages/home/report/comment/TextCommentFragment.js +++ b/src/pages/home/report/comment/TextCommentFragment.js @@ -5,15 +5,14 @@ import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; import ZeroWidthView from '@components/ZeroWidthView'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import convertToLTR from '@libs/convertToLTR'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import * as EmojiUtils from '@libs/EmojiUtils'; import reportActionFragmentPropTypes from '@pages/home/report/reportActionFragmentPropTypes'; import reportActionSourcePropType from '@pages/home/report/reportActionSourcePropType'; -import editedLabelStyles from '@styles/editedLabelStyles'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import CONST from '@src/CONST'; import RenderCommentHTML from './RenderCommentHTML'; @@ -103,7 +102,7 @@ function TextCommentFragment(props) { {props.translate('reportActionCompose.edited')} diff --git a/src/pages/home/sidebar/AvatarWithOptionalStatus.js b/src/pages/home/sidebar/AvatarWithOptionalStatus.js index 487514ce199f..0bad9e845e9c 100644 --- a/src/pages/home/sidebar/AvatarWithOptionalStatus.js +++ b/src/pages/home/sidebar/AvatarWithOptionalStatus.js @@ -6,8 +6,8 @@ import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeed import Text from '@components/Text'; import Tooltip from '@components/Tooltip'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ROUTES from '@src/ROUTES'; import PressableAvatarWithIndicator from './PressableAvatarWithIndicator'; diff --git a/src/pages/home/sidebar/SidebarLinks.js b/src/pages/home/sidebar/SidebarLinks.js index 6f860010e9d7..eb4f9000d2b4 100644 --- a/src/pages/home/sidebar/SidebarLinks.js +++ b/src/pages/home/sidebar/SidebarLinks.js @@ -12,6 +12,9 @@ import OptionsListSkeletonView from '@components/OptionsListSkeletonView'; import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeedback'; import Tooltip from '@components/Tooltip'; import useLocalize from '@hooks/useLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import KeyboardShortcut from '@libs/KeyboardShortcut'; import Navigation from '@libs/Navigation/Navigation'; @@ -19,9 +22,6 @@ import onyxSubscribe from '@libs/onyxSubscribe'; import SidebarUtils from '@libs/SidebarUtils'; import * as ReportActionContextMenu from '@pages/home/report/ContextMenu/ReportActionContextMenu'; import safeAreaInsetPropTypes from '@pages/safeAreaInsetPropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import * as App from '@userActions/App'; import * as Session from '@userActions/Session'; diff --git a/src/pages/home/sidebar/SidebarLinksData.js b/src/pages/home/sidebar/SidebarLinksData.js index 97f119bbd2e8..dbc77a41817b 100644 --- a/src/pages/home/sidebar/SidebarLinksData.js +++ b/src/pages/home/sidebar/SidebarLinksData.js @@ -10,10 +10,10 @@ import {withNetwork} from '@components/OnyxProvider'; import withCurrentReportID from '@components/withCurrentReportID'; import withNavigationFocus from '@components/withNavigationFocus'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import SidebarUtils from '@libs/SidebarUtils'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import SidebarLinks, {basePropTypes} from './SidebarLinks'; diff --git a/src/pages/home/sidebar/SidebarScreen/BaseSidebarScreen.js b/src/pages/home/sidebar/SidebarScreen/BaseSidebarScreen.js index 5b7a126a4655..a6853316b582 100644 --- a/src/pages/home/sidebar/SidebarScreen/BaseSidebarScreen.js +++ b/src/pages/home/sidebar/SidebarScreen/BaseSidebarScreen.js @@ -1,10 +1,10 @@ import React, {useEffect} from 'react'; import {View} from 'react-native'; import ScreenWrapper from '@components/ScreenWrapper'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Browser from '@libs/Browser'; import Performance from '@libs/Performance'; import SidebarLinksData from '@pages/home/sidebar/SidebarLinksData'; -import useThemeStyles from '@styles/useThemeStyles'; import Timing from '@userActions/Timing'; import CONST from '@src/CONST'; import sidebarPropTypes from './sidebarPropTypes'; diff --git a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js index 1da45bc71777..65b79ed5af78 100644 --- a/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js +++ b/src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js @@ -11,10 +11,10 @@ import withNavigation from '@components/withNavigation'; import withNavigationFocus from '@components/withNavigationFocus'; import withWindowDimensions from '@components/withWindowDimensions'; import usePrevious from '@hooks/usePrevious'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import * as ReportUtils from '@libs/ReportUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as App from '@userActions/App'; import * as IOU from '@userActions/IOU'; import * as Policy from '@userActions/Policy'; diff --git a/src/pages/home/sidebar/SignInButton.js b/src/pages/home/sidebar/SignInButton.js index f820298b0a22..9edcc9584dbd 100644 --- a/src/pages/home/sidebar/SignInButton.js +++ b/src/pages/home/sidebar/SignInButton.js @@ -4,7 +4,7 @@ import {View} from 'react-native'; import Button from '@components/Button'; import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeedback'; import useLocalize from '@hooks/useLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Session from '@userActions/Session'; import CONST from '@src/CONST'; diff --git a/src/pages/iou/MoneyRequestCategoryPage.js b/src/pages/iou/MoneyRequestCategoryPage.js index 7f3bf7985ba6..ceb2152d2b49 100644 --- a/src/pages/iou/MoneyRequestCategoryPage.js +++ b/src/pages/iou/MoneyRequestCategoryPage.js @@ -7,10 +7,10 @@ import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/iou/MoneyRequestDatePage.js b/src/pages/iou/MoneyRequestDatePage.js index 8121bb381f32..b7d1c4002da1 100644 --- a/src/pages/iou/MoneyRequestDatePage.js +++ b/src/pages/iou/MoneyRequestDatePage.js @@ -8,9 +8,9 @@ import FormProvider from '@components/Form/FormProvider'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as MoneyRequestUtils from '@libs/MoneyRequestUtils'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/iou/MoneyRequestDescriptionPage.js b/src/pages/iou/MoneyRequestDescriptionPage.js index 2d3e7d887e60..fe3100b8c3bd 100644 --- a/src/pages/iou/MoneyRequestDescriptionPage.js +++ b/src/pages/iou/MoneyRequestDescriptionPage.js @@ -11,12 +11,12 @@ import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import TextInput from '@components/TextInput'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as IOU from '@libs/actions/IOU'; import * as Browser from '@libs/Browser'; import * as MoneyRequestUtils from '@libs/MoneyRequestUtils'; import Navigation from '@libs/Navigation/Navigation'; import updateMultilineInputRange from '@libs/updateMultilineInputRange'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/iou/MoneyRequestMerchantPage.js b/src/pages/iou/MoneyRequestMerchantPage.js index be57f0b6c534..bf799cd0957b 100644 --- a/src/pages/iou/MoneyRequestMerchantPage.js +++ b/src/pages/iou/MoneyRequestMerchantPage.js @@ -11,8 +11,8 @@ import ScreenWrapper from '@components/ScreenWrapper'; import TextInput from '@components/TextInput'; import useAutoFocusInput from '@hooks/useAutoFocusInput'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/iou/MoneyRequestSelectorPage.js b/src/pages/iou/MoneyRequestSelectorPage.js index ee4ee88d7008..e367709cb010 100644 --- a/src/pages/iou/MoneyRequestSelectorPage.js +++ b/src/pages/iou/MoneyRequestSelectorPage.js @@ -11,6 +11,7 @@ import ScreenWrapper from '@components/ScreenWrapper'; import TabSelector from '@components/TabSelector/TabSelector'; import useLocalize from '@hooks/useLocalize'; import usePrevious from '@hooks/usePrevious'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import * as IOUUtils from '@libs/IOUUtils'; @@ -19,7 +20,6 @@ import OnyxTabNavigator, {TopTab} from '@libs/Navigation/OnyxTabNavigator'; import * as ReportUtils from '@libs/ReportUtils'; import withReportOrNotFound from '@pages/home/report/withReportOrNotFound'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/iou/MoneyRequestTagPage.js b/src/pages/iou/MoneyRequestTagPage.js index d16a7aa6679c..60e40d665580 100644 --- a/src/pages/iou/MoneyRequestTagPage.js +++ b/src/pages/iou/MoneyRequestTagPage.js @@ -9,11 +9,11 @@ import TagPicker from '@components/TagPicker'; import tagPropTypes from '@components/tagPropTypes'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import * as PolicyUtils from '@libs/PolicyUtils'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/iou/ReceiptDropUI.js b/src/pages/iou/ReceiptDropUI.js index 18ad31e036e4..67330860a052 100644 --- a/src/pages/iou/ReceiptDropUI.js +++ b/src/pages/iou/ReceiptDropUI.js @@ -4,7 +4,7 @@ import {Text, View} from 'react-native'; import ReceiptUpload from '@assets/images/receipt-upload.svg'; import DragAndDropConsumer from '@components/DragAndDrop/Consumer'; import useLocalize from '@hooks/useLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/pages/iou/ReceiptSelector/index.js b/src/pages/iou/ReceiptSelector/index.js index e9e734ddf2f8..adbfc0618de7 100644 --- a/src/pages/iou/ReceiptSelector/index.js +++ b/src/pages/iou/ReceiptSelector/index.js @@ -15,6 +15,8 @@ import Icon from '@components/Icon'; import * as Expensicons from '@components/Icon/Expensicons'; import PressableWithFeedback from '@components/Pressable/PressableWithFeedback'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as Browser from '@libs/Browser'; import * as FileUtils from '@libs/fileDownload/FileUtils'; @@ -22,8 +24,6 @@ import Navigation from '@libs/Navigation/Navigation'; import {iouDefaultProps, iouPropTypes} from '@pages/iou/propTypes'; import ReceiptDropUI from '@pages/iou/ReceiptDropUI'; import reportPropTypes from '@pages/reportPropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/iou/ReceiptSelector/index.native.js b/src/pages/iou/ReceiptSelector/index.native.js index 0073725a2c50..109e7ebdaa71 100644 --- a/src/pages/iou/ReceiptSelector/index.native.js +++ b/src/pages/iou/ReceiptSelector/index.native.js @@ -13,13 +13,13 @@ import Icon from '@components/Icon'; import * as Expensicons from '@components/Icon/Expensicons'; import PressableWithFeedback from '@components/Pressable/PressableWithFeedback'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as FileUtils from '@libs/fileDownload/FileUtils'; import Log from '@libs/Log'; import Navigation from '@libs/Navigation/Navigation'; import {iouDefaultProps, iouPropTypes} from '@pages/iou/propTypes'; import reportPropTypes from '@pages/reportPropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/iou/SplitBillDetailsPage.js b/src/pages/iou/SplitBillDetailsPage.js index dd9e7ce93cc6..94c2f1c31242 100644 --- a/src/pages/iou/SplitBillDetailsPage.js +++ b/src/pages/iou/SplitBillDetailsPage.js @@ -11,6 +11,7 @@ import MoneyRequestHeaderStatusBar from '@components/MoneyRequestHeaderStatusBar import ScreenWrapper from '@components/ScreenWrapper'; import transactionPropTypes from '@components/transactionPropTypes'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as ReportUtils from '@libs/ReportUtils'; @@ -19,7 +20,6 @@ import reportActionPropTypes from '@pages/home/report/reportActionPropTypes'; import withReportAndReportActionOrNotFound from '@pages/home/report/withReportAndReportActionOrNotFound'; import personalDetailsPropType from '@pages/personalDetailsPropType'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/iou/WaypointEditor.js b/src/pages/iou/WaypointEditor.js index 3c0d8802c5d0..e8d3c8520ca8 100644 --- a/src/pages/iou/WaypointEditor.js +++ b/src/pages/iou/WaypointEditor.js @@ -15,11 +15,11 @@ import ScreenWrapper from '@components/ScreenWrapper'; import transactionPropTypes from '@components/transactionPropTypes'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as ErrorUtils from '@libs/ErrorUtils'; import Navigation from '@libs/Navigation/Navigation'; import * as ValidationUtils from '@libs/ValidationUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Transaction from '@userActions/Transaction'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/iou/request/IOURequestStartPage.js b/src/pages/iou/request/IOURequestStartPage.js index c24e4f4e9e5f..6572e154ee14 100644 --- a/src/pages/iou/request/IOURequestStartPage.js +++ b/src/pages/iou/request/IOURequestStartPage.js @@ -13,6 +13,7 @@ import TabSelector from '@components/TabSelector/TabSelector'; import transactionPropTypes from '@components/transactionPropTypes'; import useLocalize from '@hooks/useLocalize'; import usePrevious from '@hooks/usePrevious'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import * as IOUUtils from '@libs/IOUUtils'; import Navigation from '@libs/Navigation/Navigation'; @@ -20,7 +21,6 @@ import OnyxTabNavigator, {TopTab} from '@libs/Navigation/OnyxTabNavigator'; import * as ReportUtils from '@libs/ReportUtils'; import * as TransactionUtils from '@libs/TransactionUtils'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js b/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js index daa874488980..8d7d5cfceb77 100644 --- a/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js +++ b/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js @@ -10,6 +10,7 @@ import OptionsSelector from '@components/OptionsSelector'; import refPropTypes from '@components/refPropTypes'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import useNetwork from '@hooks/useNetwork'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Report from '@libs/actions/Report'; import * as Browser from '@libs/Browser'; import compose from '@libs/compose'; @@ -17,7 +18,6 @@ import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as ReportUtils from '@libs/ReportUtils'; import personalDetailsPropType from '@pages/personalDetailsPropType'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/iou/request/step/IOURequestStepCategory.js b/src/pages/iou/request/step/IOURequestStepCategory.js index 7614683f1e1e..2218262e1877 100644 --- a/src/pages/iou/request/step/IOURequestStepCategory.js +++ b/src/pages/iou/request/step/IOURequestStepCategory.js @@ -3,10 +3,10 @@ import CategoryPicker from '@components/CategoryPicker'; import Text from '@components/Text'; import transactionPropTypes from '@components/transactionPropTypes'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import ROUTES from '@src/ROUTES'; import IOURequestStepRoutePropTypes from './IOURequestStepRoutePropTypes'; diff --git a/src/pages/iou/request/step/IOURequestStepConfirmation.js b/src/pages/iou/request/step/IOURequestStepConfirmation.js index cb90103c6ffc..1f458ef37f01 100644 --- a/src/pages/iou/request/step/IOURequestStepConfirmation.js +++ b/src/pages/iou/request/step/IOURequestStepConfirmation.js @@ -11,6 +11,7 @@ import transactionPropTypes from '@components/transactionPropTypes'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultProps, withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import compose from '@libs/compose'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; @@ -22,7 +23,6 @@ import * as TransactionUtils from '@libs/TransactionUtils'; import personalDetailsPropType from '@pages/personalDetailsPropType'; import reportPropTypes from '@pages/reportPropTypes'; import {policyPropTypes} from '@pages/workspace/withPolicy'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import * as Policy from '@userActions/Policy'; import CONST from '@src/CONST'; diff --git a/src/pages/iou/request/step/IOURequestStepDate.js b/src/pages/iou/request/step/IOURequestStepDate.js index 58c67b26052a..c90779af47ee 100644 --- a/src/pages/iou/request/step/IOURequestStepDate.js +++ b/src/pages/iou/request/step/IOURequestStepDate.js @@ -5,10 +5,10 @@ import DatePicker from '@components/DatePicker'; import FormProvider from '@components/Form/FormProvider'; import transactionPropTypes from '@components/transactionPropTypes'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as IOUUtils from '@libs/IOUUtils'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/iou/request/step/IOURequestStepDescription.js b/src/pages/iou/request/step/IOURequestStepDescription.js index 6cf9f86068a6..849f3276667e 100644 --- a/src/pages/iou/request/step/IOURequestStepDescription.js +++ b/src/pages/iou/request/step/IOURequestStepDescription.js @@ -7,11 +7,11 @@ import InputWrapperWithRef from '@components/Form/InputWrapper'; import TextInput from '@components/TextInput'; import transactionPropTypes from '@components/transactionPropTypes'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Browser from '@libs/Browser'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import updateMultilineInputRange from '@libs/updateMultilineInputRange'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/iou/request/step/IOURequestStepDistance.js b/src/pages/iou/request/step/IOURequestStepDistance.js index 39e9d6f03afa..a4b1e97425ee 100644 --- a/src/pages/iou/request/step/IOURequestStepDistance.js +++ b/src/pages/iou/request/step/IOURequestStepDistance.js @@ -11,12 +11,12 @@ import transactionPropTypes from '@components/transactionPropTypes'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; import usePrevious from '@hooks/usePrevious'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as ErrorUtils from '@libs/ErrorUtils'; import Navigation from '@libs/Navigation/Navigation'; import * as TransactionUtils from '@libs/TransactionUtils'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import * as IOU from '@userActions/IOU'; import * as MapboxToken from '@userActions/MapboxToken'; @@ -51,9 +51,9 @@ function IOURequestStepDistance({ }, transaction, }) { + const styles = useThemeStyles(); const {isOffline} = useNetwork(); const {translate} = useLocalize(); - const styles = useThemeStyles(); const [optimisticWaypoints, setOptimisticWaypoints] = useState(null); const [hasError, setHasError] = useState(false); diff --git a/src/pages/iou/request/step/IOURequestStepMerchant.js b/src/pages/iou/request/step/IOURequestStepMerchant.js index 2dbb6f8473b9..3234b6046f31 100644 --- a/src/pages/iou/request/step/IOURequestStepMerchant.js +++ b/src/pages/iou/request/step/IOURequestStepMerchant.js @@ -7,9 +7,9 @@ import TextInput from '@components/TextInput'; import transactionPropTypes from '@components/transactionPropTypes'; import useAutoFocusInput from '@hooks/useAutoFocusInput'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/iou/request/step/IOURequestStepScan/index.js b/src/pages/iou/request/step/IOURequestStepScan/index.js index e4c50ff25b5c..c51727f0143b 100644 --- a/src/pages/iou/request/step/IOURequestStepScan/index.js +++ b/src/pages/iou/request/step/IOURequestStepScan/index.js @@ -13,6 +13,8 @@ import Icon from '@components/Icon'; import * as Expensicons from '@components/Icon/Expensicons'; import PressableWithFeedback from '@components/Pressable/PressableWithFeedback'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as Browser from '@libs/Browser'; import compose from '@libs/compose'; @@ -24,8 +26,6 @@ import StepScreenDragAndDropWrapper from '@pages/iou/request/step/StepScreenDrag import withFullTransactionOrNotFound from '@pages/iou/request/step/withFullTransactionOrNotFound'; import withWritableReportOrNotFound from '@pages/iou/request/step/withWritableReportOrNotFound'; import reportPropTypes from '@pages/reportPropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import CONST from '@src/CONST'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/iou/request/step/IOURequestStepScan/index.native.js b/src/pages/iou/request/step/IOURequestStepScan/index.native.js index e80fbbce0676..8745600924e8 100644 --- a/src/pages/iou/request/step/IOURequestStepScan/index.native.js +++ b/src/pages/iou/request/step/IOURequestStepScan/index.native.js @@ -11,6 +11,8 @@ import Icon from '@components/Icon'; import * as Expensicons from '@components/Icon/Expensicons'; import PressableWithFeedback from '@components/Pressable/PressableWithFeedback'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as FileUtils from '@libs/fileDownload/FileUtils'; import Log from '@libs/Log'; @@ -20,8 +22,6 @@ import StepScreenWrapper from '@pages/iou/request/step/StepScreenWrapper'; import withFullTransactionOrNotFound from '@pages/iou/request/step/withFullTransactionOrNotFound'; import withWritableReportOrNotFound from '@pages/iou/request/step/withWritableReportOrNotFound'; import reportPropTypes from '@pages/reportPropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import CONST from '@src/CONST'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/iou/request/step/IOURequestStepTag.js b/src/pages/iou/request/step/IOURequestStepTag.js index 12e5dc8f9dab..7e2ccbe1a9dd 100644 --- a/src/pages/iou/request/step/IOURequestStepTag.js +++ b/src/pages/iou/request/step/IOURequestStepTag.js @@ -6,11 +6,11 @@ import tagPropTypes from '@components/tagPropTypes'; import Text from '@components/Text'; import transactionPropTypes from '@components/transactionPropTypes'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import * as PolicyUtils from '@libs/PolicyUtils'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/iou/request/step/IOURequestStepWaypoint.js b/src/pages/iou/request/step/IOURequestStepWaypoint.js index 7af58a7e0352..dc5b9f7d6275 100644 --- a/src/pages/iou/request/step/IOURequestStepWaypoint.js +++ b/src/pages/iou/request/step/IOURequestStepWaypoint.js @@ -16,12 +16,12 @@ import ScreenWrapper from '@components/ScreenWrapper'; import transactionPropTypes from '@components/transactionPropTypes'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import compose from '@libs/compose'; import * as ErrorUtils from '@libs/ErrorUtils'; import Navigation from '@libs/Navigation/Navigation'; import * as ValidationUtils from '@libs/ValidationUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Transaction from '@userActions/Transaction'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/iou/request/step/StepScreenDragAndDropWrapper.js b/src/pages/iou/request/step/StepScreenDragAndDropWrapper.js index a369775d7110..ceb0d5a44351 100644 --- a/src/pages/iou/request/step/StepScreenDragAndDropWrapper.js +++ b/src/pages/iou/request/step/StepScreenDragAndDropWrapper.js @@ -4,8 +4,8 @@ import {View} from 'react-native'; import DragAndDropProvider from '@components/DragAndDrop/Provider'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; -import useThemeStyles from '@styles/useThemeStyles'; const propTypes = { /** The things to display inside the screenwrapper */ @@ -32,9 +32,10 @@ const defaultProps = { }; function StepScreenDragAndDropWrapper({testID, headerTitle, onBackButtonPress, onEntryTransitionEnd, children, shouldShowWrapper}) { - const [isDraggingOver, setIsDraggingOver] = useState(false); const styles = useThemeStyles(); + const [isDraggingOver, setIsDraggingOver] = useState(false); + if (!shouldShowWrapper) { return children; } diff --git a/src/pages/iou/request/step/StepScreenWrapper.js b/src/pages/iou/request/step/StepScreenWrapper.js index 5131a9c60dc6..eae542f0f6f9 100644 --- a/src/pages/iou/request/step/StepScreenWrapper.js +++ b/src/pages/iou/request/step/StepScreenWrapper.js @@ -4,8 +4,8 @@ import {View} from 'react-native'; import _ from 'underscore'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; -import useThemeStyles from '@styles/useThemeStyles'; const propTypes = { /** The things to display inside the screenwrapper */ diff --git a/src/pages/iou/steps/MoneyRequestAmountForm.js b/src/pages/iou/steps/MoneyRequestAmountForm.js index a8e56f7a41e8..c9075d896deb 100644 --- a/src/pages/iou/steps/MoneyRequestAmountForm.js +++ b/src/pages/iou/steps/MoneyRequestAmountForm.js @@ -9,13 +9,13 @@ import FormHelpMessage from '@components/FormHelpMessage'; import refPropTypes from '@components/refPropTypes'; import TextInputWithCurrencySymbol from '@components/TextInputWithCurrencySymbol'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as Browser from '@libs/Browser'; import * as CurrencyUtils from '@libs/CurrencyUtils'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import getOperatingSystem from '@libs/getOperatingSystem'; import * as MoneyRequestUtils from '@libs/MoneyRequestUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; const propTypes = { diff --git a/src/pages/iou/steps/MoneyRequestConfirmPage.js b/src/pages/iou/steps/MoneyRequestConfirmPage.js index 03ebb9bdb562..3476b2304875 100644 --- a/src/pages/iou/steps/MoneyRequestConfirmPage.js +++ b/src/pages/iou/steps/MoneyRequestConfirmPage.js @@ -13,6 +13,7 @@ import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultPro import withLocalize from '@components/withLocalize'; import useInitialValue from '@hooks/useInitialValue'; import useNetwork from '@hooks/useNetwork'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import compose from '@libs/compose'; import * as FileUtils from '@libs/fileDownload/FileUtils'; @@ -22,7 +23,6 @@ import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as ReportUtils from '@libs/ReportUtils'; import {iouDefaultProps, iouPropTypes} from '@pages/iou/propTypes'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import * as Policy from '@userActions/Policy'; import CONST from '@src/CONST'; diff --git a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsPage.js b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsPage.js index d44c40db209f..7826643d4283 100644 --- a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsPage.js +++ b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsPage.js @@ -10,13 +10,13 @@ import ScreenWrapper from '@components/ScreenWrapper'; import transactionPropTypes from '@components/transactionPropTypes'; import useInitialValue from '@hooks/useInitialValue'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import * as MoneyRequestUtils from '@libs/MoneyRequestUtils'; import Navigation from '@libs/Navigation/Navigation'; import * as TransactionUtils from '@libs/TransactionUtils'; import {iouDefaultProps, iouPropTypes} from '@pages/iou/propTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js index a8b4dae0facc..d8d644479270 100755 --- a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js +++ b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js @@ -10,6 +10,7 @@ import OptionsSelector from '@components/OptionsSelector'; import refPropTypes from '@components/refPropTypes'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import useNetwork from '@hooks/useNetwork'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Report from '@libs/actions/Report'; import * as Browser from '@libs/Browser'; import compose from '@libs/compose'; @@ -17,7 +18,6 @@ import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as ReportUtils from '@libs/ReportUtils'; import personalDetailsPropType from '@pages/personalDetailsPropType'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/iou/steps/NewRequestAmountPage.js b/src/pages/iou/steps/NewRequestAmountPage.js index bf92c420e82c..569e2ce693ee 100644 --- a/src/pages/iou/steps/NewRequestAmountPage.js +++ b/src/pages/iou/steps/NewRequestAmountPage.js @@ -9,13 +9,13 @@ import FullPageNotFoundView from '@components/BlockingViews/FullPageNotFoundView import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as CurrencyUtils from '@libs/CurrencyUtils'; import * as IOUUtils from '@libs/IOUUtils'; import * as MoneyRequestUtils from '@libs/MoneyRequestUtils'; import Navigation from '@libs/Navigation/Navigation'; import {iouDefaultProps, iouPropTypes} from '@pages/iou/propTypes'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as IOU from '@userActions/IOU'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/settings/AboutPage/AboutPage.js b/src/pages/settings/AboutPage/AboutPage.js index c192abf84e43..16ae590cf86b 100644 --- a/src/pages/settings/AboutPage/AboutPage.js +++ b/src/pages/settings/AboutPage/AboutPage.js @@ -11,13 +11,13 @@ import Text from '@components/Text'; import TextLink from '@components/TextLink'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWaitForNavigation from '@hooks/useWaitForNavigation'; import compose from '@libs/compose'; import * as Environment from '@libs/Environment/Environment'; import Navigation from '@libs/Navigation/Navigation'; import {CONTEXT_MENU_TYPES} from '@pages/home/report/ContextMenu/ContextMenuActions'; import * as ReportActionContextMenu from '@pages/home/report/ContextMenu/ReportActionContextMenu'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Link from '@userActions/Link'; import * as Report from '@userActions/Report'; import CONST from '@src/CONST'; diff --git a/src/pages/settings/AppDownloadLinks.js b/src/pages/settings/AppDownloadLinks.js index 182a25a121b5..471a38b039b2 100644 --- a/src/pages/settings/AppDownloadLinks.js +++ b/src/pages/settings/AppDownloadLinks.js @@ -7,11 +7,11 @@ import MenuItem from '@components/MenuItem'; import ScreenWrapper from '@components/ScreenWrapper'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import {CONTEXT_MENU_TYPES} from '@pages/home/report/ContextMenu/ContextMenuActions'; import * as ReportActionContextMenu from '@pages/home/report/ContextMenu/ReportActionContextMenu'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Link from '@userActions/Link'; import CONST from '@src/CONST'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/settings/InitialSettingsPage.js b/src/pages/settings/InitialSettingsPage.js index 2af5b145caab..ede356f3bb02 100755 --- a/src/pages/settings/InitialSettingsPage.js +++ b/src/pages/settings/InitialSettingsPage.js @@ -21,6 +21,8 @@ import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultPro import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import useLocalize from '@hooks/useLocalize'; import useSingleExecution from '@hooks/useSingleExecution'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWaitForNavigation from '@hooks/useWaitForNavigation'; import * as CardUtils from '@libs/CardUtils'; import compose from '@libs/compose'; @@ -34,8 +36,6 @@ import {CONTEXT_MENU_TYPES} from '@pages/home/report/ContextMenu/ContextMenuActi import * as ReportActionContextMenu from '@pages/home/report/ContextMenu/ReportActionContextMenu'; import policyMemberPropType from '@pages/policyMemberPropType'; import * as ReimbursementAccountProps from '@pages/ReimbursementAccount/reimbursementAccountPropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Link from '@userActions/Link'; import * as PaymentMethods from '@userActions/PaymentMethods'; import * as Session from '@userActions/Session'; diff --git a/src/pages/settings/Preferences/PreferencesPage.js b/src/pages/settings/Preferences/PreferencesPage.js index 6fa3e2df3474..10e09e7aee3b 100755 --- a/src/pages/settings/Preferences/PreferencesPage.js +++ b/src/pages/settings/Preferences/PreferencesPage.js @@ -11,9 +11,9 @@ import TestToolMenu from '@components/TestToolMenu'; import Text from '@components/Text'; import useEnvironment from '@hooks/useEnvironment'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as User from '@userActions/User'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/settings/Preferences/PriorityModePage.js b/src/pages/settings/Preferences/PriorityModePage.js index 0778394d2b28..2a9d9c5b0d9e 100644 --- a/src/pages/settings/Preferences/PriorityModePage.js +++ b/src/pages/settings/Preferences/PriorityModePage.js @@ -7,8 +7,8 @@ import ScreenWrapper from '@components/ScreenWrapper'; import SelectionList from '@components/SelectionList'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import * as User from '@userActions/User'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/settings/Preferences/ThemePage.js b/src/pages/settings/Preferences/ThemePage.js index f4acd10a7230..529759df6611 100644 --- a/src/pages/settings/Preferences/ThemePage.js +++ b/src/pages/settings/Preferences/ThemePage.js @@ -7,9 +7,9 @@ import ScreenWrapper from '@components/ScreenWrapper'; import SelectionList from '@components/SelectionList'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import * as User from '@userActions/User'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/settings/Profile/Contacts/ContactMethodsPage.js b/src/pages/settings/Profile/Contacts/ContactMethodsPage.js index a17dd8f2c17e..34399daf55e3 100644 --- a/src/pages/settings/Profile/Contacts/ContactMethodsPage.js +++ b/src/pages/settings/Profile/Contacts/ContactMethodsPage.js @@ -14,9 +14,9 @@ import OfflineWithFeedback from '@components/OfflineWithFeedback'; import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/settings/Profile/Contacts/NewContactMethodPage.js b/src/pages/settings/Profile/Contacts/NewContactMethodPage.js index 4623d359de4d..8f6982e24b98 100644 --- a/src/pages/settings/Profile/Contacts/NewContactMethodPage.js +++ b/src/pages/settings/Profile/Contacts/NewContactMethodPage.js @@ -12,11 +12,11 @@ import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import TextInput from '@components/TextInput'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as ErrorUtils from '@libs/ErrorUtils'; import * as LoginUtils from '@libs/LoginUtils'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import * as User from '@userActions/User'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/settings/Profile/Contacts/ValidateCodeForm/BaseValidateCodeForm.js b/src/pages/settings/Profile/Contacts/ValidateCodeForm/BaseValidateCodeForm.js index 60c9b46748f6..d15405f8029c 100644 --- a/src/pages/settings/Profile/Contacts/ValidateCodeForm/BaseValidateCodeForm.js +++ b/src/pages/settings/Profile/Contacts/ValidateCodeForm/BaseValidateCodeForm.js @@ -13,12 +13,12 @@ import {withNetwork} from '@components/OnyxProvider'; import PressableWithFeedback from '@components/Pressable/PressableWithFeedback'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as ErrorUtils from '@libs/ErrorUtils'; import * as ValidationUtils from '@libs/ValidationUtils'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Session from '@userActions/Session'; import * as User from '@userActions/User'; import CONST from '@src/CONST'; diff --git a/src/pages/settings/Profile/CustomStatus/SetDatePage.js b/src/pages/settings/Profile/CustomStatus/SetDatePage.js index 30bd89b60177..8839f1289490 100644 --- a/src/pages/settings/Profile/CustomStatus/SetDatePage.js +++ b/src/pages/settings/Profile/CustomStatus/SetDatePage.js @@ -6,12 +6,12 @@ import FormProvider from '@components/Form/FormProvider'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as User from '@libs/actions/User'; import compose from '@libs/compose'; import DateUtils from '@libs/DateUtils'; import Navigation from '@libs/Navigation/Navigation'; import * as ValidationUtils from '@libs/ValidationUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/settings/Profile/CustomStatus/SetTimePage.js b/src/pages/settings/Profile/CustomStatus/SetTimePage.js index 9e48b5826e7d..3cdf739ac7b9 100644 --- a/src/pages/settings/Profile/CustomStatus/SetTimePage.js +++ b/src/pages/settings/Profile/CustomStatus/SetTimePage.js @@ -8,11 +8,11 @@ import ScreenWrapper from '@components/ScreenWrapper'; import TimePicker from '@components/TimePicker/TimePicker'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as User from '@libs/actions/User'; import compose from '@libs/compose'; import DateUtils from '@libs/DateUtils'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.js b/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.js index a4f9c1c3a4e5..569435048383 100644 --- a/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.js +++ b/src/pages/settings/Profile/CustomStatus/StatusClearAfterPage.js @@ -13,13 +13,13 @@ import Text from '@components/Text'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultProps} from '@components/withCurrentUserPersonalDetails'; import withLocalize from '@components/withLocalize'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as User from '@libs/actions/User'; import compose from '@libs/compose'; import DateUtils from '@libs/DateUtils'; import Navigation from '@libs/Navigation/Navigation'; import * as ValidationUtils from '@libs/ValidationUtils'; import personalDetailsPropType from '@pages/personalDetailsPropType'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/settings/Profile/CustomStatus/StatusPage.js b/src/pages/settings/Profile/CustomStatus/StatusPage.js index 1bf4165c15c5..bf21d3cd2b54 100644 --- a/src/pages/settings/Profile/CustomStatus/StatusPage.js +++ b/src/pages/settings/Profile/CustomStatus/StatusPage.js @@ -15,12 +15,12 @@ import Text from '@components/Text'; import TextInput from '@components/TextInput'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails'; import useLocalize from '@hooks/useLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import DateUtils from '@libs/DateUtils'; import Navigation from '@libs/Navigation/Navigation'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as User from '@userActions/User'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/settings/Profile/DisplayNamePage.js b/src/pages/settings/Profile/DisplayNamePage.js index 5c13bfe72d5f..8ea471283004 100644 --- a/src/pages/settings/Profile/DisplayNamePage.js +++ b/src/pages/settings/Profile/DisplayNamePage.js @@ -12,11 +12,11 @@ import Text from '@components/Text'; import TextInput from '@components/TextInput'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultProps, withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as ErrorUtils from '@libs/ErrorUtils'; import Navigation from '@libs/Navigation/Navigation'; import * as ValidationUtils from '@libs/ValidationUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as PersonalDetails from '@userActions/PersonalDetails'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/settings/Profile/LoungeAccessPage.js b/src/pages/settings/Profile/LoungeAccessPage.js index f6b6968372d1..60cb0896a4eb 100644 --- a/src/pages/settings/Profile/LoungeAccessPage.js +++ b/src/pages/settings/Profile/LoungeAccessPage.js @@ -5,11 +5,11 @@ import LottieAnimations from '@components/LottieAnimations'; import Text from '@components/Text'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultProps, withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import NotFoundPage from '@pages/ErrorPage/NotFoundPage'; import userPropTypes from '@pages/settings/userPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/settings/Profile/PersonalDetails/AddressPage.js b/src/pages/settings/Profile/PersonalDetails/AddressPage.js index fa22a3b22f9e..6c883e7fa9d8 100644 --- a/src/pages/settings/Profile/PersonalDetails/AddressPage.js +++ b/src/pages/settings/Profile/PersonalDetails/AddressPage.js @@ -8,8 +8,8 @@ import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import useLocalize from '@hooks/useLocalize'; import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import * as PersonalDetails from '@userActions/PersonalDetails'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.js b/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.js index 10a6d8807afc..393e95cb35fe 100644 --- a/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.js +++ b/src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.js @@ -10,10 +10,10 @@ import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import * as ValidationUtils from '@libs/ValidationUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as PersonalDetails from '@userActions/PersonalDetails'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js b/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js index a9005c39534d..365ea62184ab 100644 --- a/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js +++ b/src/pages/settings/Profile/PersonalDetails/LegalNamePage.js @@ -12,11 +12,11 @@ import ScreenWrapper from '@components/ScreenWrapper'; import TextInput from '@components/TextInput'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as ErrorUtils from '@libs/ErrorUtils'; import Navigation from '@libs/Navigation/Navigation'; import * as ValidationUtils from '@libs/ValidationUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as PersonalDetails from '@userActions/PersonalDetails'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/settings/Profile/PersonalDetails/PersonalDetailsInitialPage.js b/src/pages/settings/Profile/PersonalDetails/PersonalDetailsInitialPage.js index 4fc2bbb17428..cf6887b7e04c 100644 --- a/src/pages/settings/Profile/PersonalDetails/PersonalDetailsInitialPage.js +++ b/src/pages/settings/Profile/PersonalDetails/PersonalDetailsInitialPage.js @@ -11,10 +11,10 @@ import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import * as PersonalDetailsUtils from '@libs/PersonalDetailsUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/settings/Profile/ProfilePage.js b/src/pages/settings/Profile/ProfilePage.js index fc6c38f96335..89dfa4f0e419 100755 --- a/src/pages/settings/Profile/ProfilePage.js +++ b/src/pages/settings/Profile/ProfilePage.js @@ -13,11 +13,11 @@ import ScreenWrapper from '@components/ScreenWrapper'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultProps, withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import * as UserUtils from '@libs/UserUtils'; import userPropTypes from '@pages/settings/userPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as App from '@userActions/App'; import * as PersonalDetails from '@userActions/PersonalDetails'; import CONST from '@src/CONST'; diff --git a/src/pages/settings/Profile/PronounsPage.js b/src/pages/settings/Profile/PronounsPage.js index 40f2562724ef..20022f22523a 100644 --- a/src/pages/settings/Profile/PronounsPage.js +++ b/src/pages/settings/Profile/PronounsPage.js @@ -10,9 +10,9 @@ import SelectionList from '@components/SelectionList'; import Text from '@components/Text'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultProps, withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import * as PersonalDetails from '@userActions/PersonalDetails'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/settings/Profile/TimezoneInitialPage.js b/src/pages/settings/Profile/TimezoneInitialPage.js index 463b20029745..bf86e8a5a077 100644 --- a/src/pages/settings/Profile/TimezoneInitialPage.js +++ b/src/pages/settings/Profile/TimezoneInitialPage.js @@ -8,9 +8,9 @@ import Switch from '@components/Switch'; import Text from '@components/Text'; import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultProps, withCurrentUserPersonalDetailsPropTypes} from '@components/withCurrentUserPersonalDetails'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import * as PersonalDetails from '@userActions/PersonalDetails'; import CONST from '@src/CONST'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/settings/Report/ReportSettingsPage.js b/src/pages/settings/Report/ReportSettingsPage.js index 0676f0875932..c7cfd9c7850d 100644 --- a/src/pages/settings/Report/ReportSettingsPage.js +++ b/src/pages/settings/Report/ReportSettingsPage.js @@ -14,13 +14,13 @@ import OfflineWithFeedback from '@components/OfflineWithFeedback'; import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import {getGroupChatName} from '@libs/GroupChatUtils'; import Navigation from '@libs/Navigation/Navigation'; import * as ReportUtils from '@libs/ReportUtils'; import withReportOrNotFound from '@pages/home/report/withReportOrNotFound'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Report from '@userActions/Report'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/settings/Report/RoomNamePage.js b/src/pages/settings/Report/RoomNamePage.js index 7916043c7e20..fa2bee325e8a 100644 --- a/src/pages/settings/Report/RoomNamePage.js +++ b/src/pages/settings/Report/RoomNamePage.js @@ -9,6 +9,7 @@ import HeaderWithBackButton from '@components/HeaderWithBackButton'; import RoomNameInput from '@components/RoomNameInput'; import ScreenWrapper from '@components/ScreenWrapper'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as ErrorUtils from '@libs/ErrorUtils'; import Navigation from '@libs/Navigation/Navigation'; @@ -16,7 +17,6 @@ import * as ReportUtils from '@libs/ReportUtils'; import * as ValidationUtils from '@libs/ValidationUtils'; import withReportOrNotFound from '@pages/home/report/withReportOrNotFound'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Report from '@userActions/Report'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/settings/Security/CloseAccountPage.js b/src/pages/settings/Security/CloseAccountPage.js index 2c55c5e73f0c..9aad345d7b3d 100644 --- a/src/pages/settings/Security/CloseAccountPage.js +++ b/src/pages/settings/Security/CloseAccountPage.js @@ -12,10 +12,10 @@ import Text from '@components/Text'; import TextInput from '@components/TextInput'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import * as ValidationUtils from '@libs/ValidationUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as CloseAccount from '@userActions/CloseAccount'; import * as User from '@userActions/User'; import CONST from '@src/CONST'; diff --git a/src/pages/settings/Security/SecuritySettingsPage.js b/src/pages/settings/Security/SecuritySettingsPage.js index 95a0efa2fc39..392a264977c6 100644 --- a/src/pages/settings/Security/SecuritySettingsPage.js +++ b/src/pages/settings/Security/SecuritySettingsPage.js @@ -8,11 +8,11 @@ import IllustratedHeaderPageLayout from '@components/IllustratedHeaderPageLayout import LottieAnimations from '@components/LottieAnimations'; import MenuItemList from '@components/MenuItemList'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWaitForNavigation from '@hooks/useWaitForNavigation'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; import SCREENS from '@src/SCREENS'; diff --git a/src/pages/settings/Security/TwoFactorAuth/StepWrapper/StepWrapper.js b/src/pages/settings/Security/TwoFactorAuth/StepWrapper/StepWrapper.js index 69d662ba6e81..ba899a0e2d20 100644 --- a/src/pages/settings/Security/TwoFactorAuth/StepWrapper/StepWrapper.js +++ b/src/pages/settings/Security/TwoFactorAuth/StepWrapper/StepWrapper.js @@ -4,7 +4,7 @@ import useAnimatedStepContext from '@components/AnimatedStep/useAnimatedStepCont import FullPageOfflineBlockingView from '@components/BlockingViews/FullPageOfflineBlockingView'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as TwoFactorAuthActions from '@userActions/TwoFactorAuthActions'; import StepWrapperPropTypes from './StepWrapperPropTypes'; diff --git a/src/pages/settings/Security/TwoFactorAuth/Steps/CodesStep.js b/src/pages/settings/Security/TwoFactorAuth/Steps/CodesStep.js index 86d218ec63ae..420d976dcd26 100644 --- a/src/pages/settings/Security/TwoFactorAuth/Steps/CodesStep.js +++ b/src/pages/settings/Security/TwoFactorAuth/Steps/CodesStep.js @@ -11,14 +11,14 @@ import PressableWithDelayToggle from '@components/Pressable/PressableWithDelayTo import Section from '@components/Section'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import Clipboard from '@libs/Clipboard'; import localFileDownload from '@libs/localFileDownload'; import StepWrapper from '@pages/settings/Security/TwoFactorAuth/StepWrapper/StepWrapper'; import useTwoFactorAuthContext from '@pages/settings/Security/TwoFactorAuth/TwoFactorAuthContext/useTwoFactorAuth'; import {defaultAccount, TwoFactorAuthPropTypes} from '@pages/settings/Security/TwoFactorAuth/TwoFactorAuthPropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Session from '@userActions/Session'; import * as TwoFactorAuthActions from '@userActions/TwoFactorAuthActions'; import CONST from '@src/CONST'; diff --git a/src/pages/settings/Security/TwoFactorAuth/Steps/DisabledStep.js b/src/pages/settings/Security/TwoFactorAuth/Steps/DisabledStep.js index 9de25ecb8f4b..db64a805d088 100644 --- a/src/pages/settings/Security/TwoFactorAuth/Steps/DisabledStep.js +++ b/src/pages/settings/Security/TwoFactorAuth/Steps/DisabledStep.js @@ -4,8 +4,8 @@ import Button from '@components/Button'; import FixedFooter from '@components/FixedFooter'; import * as Illustrations from '@components/Icon/Illustrations'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import StepWrapper from '@pages/settings/Security/TwoFactorAuth/StepWrapper/StepWrapper'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import * as TwoFactorAuthActions from '@userActions/TwoFactorAuthActions'; diff --git a/src/pages/settings/Security/TwoFactorAuth/Steps/EnabledStep.js b/src/pages/settings/Security/TwoFactorAuth/Steps/EnabledStep.js index e0f90c57f350..27f9c0f04404 100644 --- a/src/pages/settings/Security/TwoFactorAuth/Steps/EnabledStep.js +++ b/src/pages/settings/Security/TwoFactorAuth/Steps/EnabledStep.js @@ -5,10 +5,10 @@ import * as Expensicons from '@components/Icon/Expensicons'; import * as Illustrations from '@components/Icon/Illustrations'; import Section from '@components/Section'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import StepWrapper from '@pages/settings/Security/TwoFactorAuth/StepWrapper/StepWrapper'; import useTwoFactorAuthContext from '@pages/settings/Security/TwoFactorAuth/TwoFactorAuthContext/useTwoFactorAuth'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Session from '@userActions/Session'; import CONST from '@src/CONST'; diff --git a/src/pages/settings/Security/TwoFactorAuth/Steps/VerifyStep.js b/src/pages/settings/Security/TwoFactorAuth/Steps/VerifyStep.js index 8a2b4c6fdf6c..e5f809204bd6 100644 --- a/src/pages/settings/Security/TwoFactorAuth/Steps/VerifyStep.js +++ b/src/pages/settings/Security/TwoFactorAuth/Steps/VerifyStep.js @@ -11,12 +11,12 @@ import QRCode from '@components/QRCode'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import Clipboard from '@libs/Clipboard'; import StepWrapper from '@pages/settings/Security/TwoFactorAuth/StepWrapper/StepWrapper'; import useTwoFactorAuthContext from '@pages/settings/Security/TwoFactorAuth/TwoFactorAuthContext/useTwoFactorAuth'; import TwoFactorAuthForm from '@pages/settings/Security/TwoFactorAuth/TwoFactorAuthForm'; import {defaultAccount, TwoFactorAuthPropTypes} from '@pages/settings/Security/TwoFactorAuth/TwoFactorAuthPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Session from '@userActions/Session'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/settings/Wallet/ActivatePhysicalCardPage.js b/src/pages/settings/Wallet/ActivatePhysicalCardPage.js index 788c571d9e7d..bfc8583998b6 100644 --- a/src/pages/settings/Wallet/ActivatePhysicalCardPage.js +++ b/src/pages/settings/Wallet/ActivatePhysicalCardPage.js @@ -12,14 +12,14 @@ import MagicCodeInput from '@components/MagicCodeInput'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as CardUtils from '@libs/CardUtils'; import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import * as ErrorUtils from '@libs/ErrorUtils'; import Navigation from '@libs/Navigation/Navigation'; import NotFoundPage from '@pages/ErrorPage/NotFoundPage'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as CardSettings from '@userActions/Card'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/settings/Wallet/AddDebitCardPage.js b/src/pages/settings/Wallet/AddDebitCardPage.js index 1f824fed5293..0704bf6bf3b8 100644 --- a/src/pages/settings/Wallet/AddDebitCardPage.js +++ b/src/pages/settings/Wallet/AddDebitCardPage.js @@ -14,9 +14,9 @@ import TextInput from '@components/TextInput'; import TextLink from '@components/TextLink'; import useLocalize from '@hooks/useLocalize'; import usePrevious from '@hooks/usePrevious'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; import * as ValidationUtils from '@libs/ValidationUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as PaymentMethods from '@userActions/PaymentMethods'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/settings/Wallet/Card/BaseGetPhysicalCard.js b/src/pages/settings/Wallet/Card/BaseGetPhysicalCard.js index 4176393e92dd..1d1ce906189b 100644 --- a/src/pages/settings/Wallet/Card/BaseGetPhysicalCard.js +++ b/src/pages/settings/Wallet/Card/BaseGetPhysicalCard.js @@ -6,6 +6,7 @@ import _ from 'underscore'; import Form from '@components/Form'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as FormActions from '@libs/actions/FormActions'; import * as Wallet from '@libs/actions/Wallet'; import * as CardUtils from '@libs/CardUtils'; @@ -13,7 +14,6 @@ import FormUtils from '@libs/FormUtils'; import * as GetPhysicalCardUtils from '@libs/GetPhysicalCardUtils'; import Navigation from '@libs/Navigation/Navigation'; import assignedCardPropTypes from '@pages/settings/Wallet/assignedCardPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/settings/Wallet/Card/GetPhysicalCardConfirm.js b/src/pages/settings/Wallet/Card/GetPhysicalCardConfirm.js index 0ae83cd28b5c..9f364c32c075 100644 --- a/src/pages/settings/Wallet/Card/GetPhysicalCardConfirm.js +++ b/src/pages/settings/Wallet/Card/GetPhysicalCardConfirm.js @@ -5,10 +5,10 @@ import * as Expensicons from '@components/Icon/Expensicons'; import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import FormUtils from '@libs/FormUtils'; import Navigation from '@libs/Navigation/Navigation'; import * as PersonalDetailsUtils from '@libs/PersonalDetailsUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/settings/Wallet/Card/GetPhysicalCardName.js b/src/pages/settings/Wallet/Card/GetPhysicalCardName.js index 3c87bed424ba..0040dac8b75f 100644 --- a/src/pages/settings/Wallet/Card/GetPhysicalCardName.js +++ b/src/pages/settings/Wallet/Card/GetPhysicalCardName.js @@ -4,9 +4,9 @@ import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; import TextInput from '@components/TextInput'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import FormUtils from '@libs/FormUtils'; import * as ValidationUtils from '@libs/ValidationUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/settings/Wallet/Card/GetPhysicalCardPhone.js b/src/pages/settings/Wallet/Card/GetPhysicalCardPhone.js index 82b684332491..3d4c7f4ac6fb 100644 --- a/src/pages/settings/Wallet/Card/GetPhysicalCardPhone.js +++ b/src/pages/settings/Wallet/Card/GetPhysicalCardPhone.js @@ -6,8 +6,8 @@ import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; import TextInput from '@components/TextInput'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import FormUtils from '@libs/FormUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/settings/Wallet/ChooseTransferAccountPage.js b/src/pages/settings/Wallet/ChooseTransferAccountPage.js index 2ffbf12f52c2..815d2e883cf0 100644 --- a/src/pages/settings/Wallet/ChooseTransferAccountPage.js +++ b/src/pages/settings/Wallet/ChooseTransferAccountPage.js @@ -6,9 +6,9 @@ import * as Expensicons from '@components/Icon/Expensicons'; import MenuItem from '@components/MenuItem'; import ScreenWrapper from '@components/ScreenWrapper'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import * as BankAccounts from '@userActions/BankAccounts'; import * as PaymentMethods from '@userActions/PaymentMethods'; import CONST from '@src/CONST'; diff --git a/src/pages/settings/Wallet/ExpensifyCardPage.js b/src/pages/settings/Wallet/ExpensifyCardPage.js index b469027e6a57..513da42b9011 100644 --- a/src/pages/settings/Wallet/ExpensifyCardPage.js +++ b/src/pages/settings/Wallet/ExpensifyCardPage.js @@ -13,13 +13,13 @@ import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription'; import ScreenWrapper from '@components/ScreenWrapper'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as CardUtils from '@libs/CardUtils'; import * as CurrencyUtils from '@libs/CurrencyUtils'; import FormUtils from '@libs/FormUtils'; import * as GetPhysicalCardUtils from '@libs/GetPhysicalCardUtils'; import Navigation from '@libs/Navigation/Navigation'; import NotFoundPage from '@pages/ErrorPage/NotFoundPage'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Card from '@userActions/Card'; import * as Link from '@userActions/Link'; import CONST from '@src/CONST'; diff --git a/src/pages/settings/Wallet/PaymentMethodList.js b/src/pages/settings/Wallet/PaymentMethodList.js index 4f6d0331f3b4..6e424a918b7e 100644 --- a/src/pages/settings/Wallet/PaymentMethodList.js +++ b/src/pages/settings/Wallet/PaymentMethodList.js @@ -16,13 +16,13 @@ import OfflineWithFeedback from '@components/OfflineWithFeedback'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as CardUtils from '@libs/CardUtils'; import Log from '@libs/Log'; import Navigation from '@libs/Navigation/Navigation'; import * as PaymentUtils from '@libs/PaymentUtils'; import stylePropTypes from '@styles/stylePropTypes'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import * as PaymentMethods from '@userActions/PaymentMethods'; import CONST from '@src/CONST'; diff --git a/src/pages/settings/Wallet/RedDotCardSection.js b/src/pages/settings/Wallet/RedDotCardSection.js index 65c700575340..7025cf7bf1a2 100644 --- a/src/pages/settings/Wallet/RedDotCardSection.js +++ b/src/pages/settings/Wallet/RedDotCardSection.js @@ -4,8 +4,8 @@ import {View} from 'react-native'; import Icon from '@components/Icon'; import * as Expensicons from '@components/Icon/Expensicons'; import Text from '@components/Text'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; const propTypes = { title: PropTypes.string.isRequired, diff --git a/src/pages/settings/Wallet/ReportCardLostPage.js b/src/pages/settings/Wallet/ReportCardLostPage.js index aa313b73a6bd..b01dc99cb485 100644 --- a/src/pages/settings/Wallet/ReportCardLostPage.js +++ b/src/pages/settings/Wallet/ReportCardLostPage.js @@ -12,11 +12,11 @@ import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; import usePrevious from '@hooks/usePrevious'; import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as CardUtils from '@libs/CardUtils'; import Navigation from '@libs/Navigation/Navigation'; import * as PersonalDetailsUtils from '@libs/PersonalDetailsUtils'; import NotFoundPage from '@pages/ErrorPage/NotFoundPage'; -import useThemeStyles from '@styles/useThemeStyles'; import * as CardActions from '@userActions/Card'; import * as FormActions from '@userActions/FormActions'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/settings/Wallet/ReportVirtualCardFraudPage.js b/src/pages/settings/Wallet/ReportVirtualCardFraudPage.js index 01d3c272ad8b..fa88e01d8b41 100644 --- a/src/pages/settings/Wallet/ReportVirtualCardFraudPage.js +++ b/src/pages/settings/Wallet/ReportVirtualCardFraudPage.js @@ -9,11 +9,11 @@ import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; import usePrevious from '@hooks/usePrevious'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as CardUtils from '@libs/CardUtils'; import * as ErrorUtils from '@libs/ErrorUtils'; import Navigation from '@libs/Navigation/Navigation'; import NotFoundPage from '@pages/ErrorPage/NotFoundPage'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Card from '@userActions/Card'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/settings/Wallet/TransferBalancePage.js b/src/pages/settings/Wallet/TransferBalancePage.js index 2414edb29087..303baa4b4b13 100644 --- a/src/pages/settings/Wallet/TransferBalancePage.js +++ b/src/pages/settings/Wallet/TransferBalancePage.js @@ -15,12 +15,12 @@ import {withNetwork} from '@components/OnyxProvider'; import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as CurrencyUtils from '@libs/CurrencyUtils'; import Navigation from '@libs/Navigation/Navigation'; import * as PaymentUtils from '@libs/PaymentUtils'; import userWalletPropTypes from '@pages/EnablePayments/userWalletPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import * as PaymentMethods from '@userActions/PaymentMethods'; import CONST from '@src/CONST'; diff --git a/src/pages/settings/Wallet/WalletEmptyState.js b/src/pages/settings/Wallet/WalletEmptyState.js index f4609bdc8534..7a3a9e9ce6b7 100644 --- a/src/pages/settings/Wallet/WalletEmptyState.js +++ b/src/pages/settings/Wallet/WalletEmptyState.js @@ -6,8 +6,8 @@ import * as Illustrations from '@components/Icon/Illustrations'; import IllustratedHeaderPageLayout from '@components/IllustratedHeaderPageLayout'; import LottieAnimations from '@components/LottieAnimations'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; import Navigation from '@libs/Navigation/Navigation'; -import useTheme from '@styles/themes/useTheme'; import ROUTES from '@src/ROUTES'; import SCREENS from '@src/SCREENS'; diff --git a/src/pages/settings/Wallet/WalletPage/CardDetails.js b/src/pages/settings/Wallet/WalletPage/CardDetails.js index a51c4c5fad6f..b51c34e89d17 100644 --- a/src/pages/settings/Wallet/WalletPage/CardDetails.js +++ b/src/pages/settings/Wallet/WalletPage/CardDetails.js @@ -8,10 +8,10 @@ import PressableWithDelayToggle from '@components/Pressable/PressableWithDelayTo import TextLink from '@components/TextLink'; import useLocalize from '@hooks/useLocalize'; import usePrivatePersonalDetails from '@hooks/usePrivatePersonalDetails'; +import useThemeStyles from '@hooks/useThemeStyles'; import Clipboard from '@libs/Clipboard'; import Navigation from '@libs/Navigation/Navigation'; import * as PersonalDetailsUtils from '@libs/PersonalDetailsUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/settings/Wallet/WalletPage/WalletPage.js b/src/pages/settings/Wallet/WalletPage/WalletPage.js index 6f452eed3629..d9d96946d199 100644 --- a/src/pages/settings/Wallet/WalletPage/WalletPage.js +++ b/src/pages/settings/Wallet/WalletPage/WalletPage.js @@ -20,6 +20,8 @@ import ScreenWrapper from '@components/ScreenWrapper'; import Text from '@components/Text'; import WalletSection from '@components/WalletSection'; import useLocalize from '@hooks/useLocalize'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import compose from '@libs/compose'; import getClickedTargetLocation from '@libs/getClickedTargetLocation'; @@ -27,8 +29,6 @@ import Navigation from '@libs/Navigation/Navigation'; import * as PaymentUtils from '@libs/PaymentUtils'; import PaymentMethodList from '@pages/settings/Wallet/PaymentMethodList'; import WalletEmptyState from '@pages/settings/Wallet/WalletEmptyState'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import * as BankAccounts from '@userActions/BankAccounts'; import * as PaymentMethods from '@userActions/PaymentMethods'; diff --git a/src/pages/signin/ChangeExpensifyLoginLink.js b/src/pages/signin/ChangeExpensifyLoginLink.js index 0fee34f988a1..6ba9b7fcd0f5 100755 --- a/src/pages/signin/ChangeExpensifyLoginLink.js +++ b/src/pages/signin/ChangeExpensifyLoginLink.js @@ -6,8 +6,8 @@ import _ from 'underscore'; import PressableWithFeedback from '@components/Pressable/PressableWithFeedback'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/signin/ChooseSSOOrMagicCode.js b/src/pages/signin/ChooseSSOOrMagicCode.js index bfb704b71f6d..db985e525545 100644 --- a/src/pages/signin/ChooseSSOOrMagicCode.js +++ b/src/pages/signin/ChooseSSOOrMagicCode.js @@ -8,10 +8,10 @@ import FormHelpMessage from '@components/FormHelpMessage'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as ErrorUtils from '@libs/ErrorUtils'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Session from '@userActions/Session'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/signin/EmailDeliveryFailurePage.js b/src/pages/signin/EmailDeliveryFailurePage.js index fe39618e79df..9996374cc6cd 100644 --- a/src/pages/signin/EmailDeliveryFailurePage.js +++ b/src/pages/signin/EmailDeliveryFailurePage.js @@ -8,7 +8,7 @@ import Text from '@components/Text'; import TextLink from '@components/TextLink'; import useKeyboardState from '@hooks/useKeyboardState'; import useLocalize from '@hooks/useLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import redirectToSignIn from '@userActions/SignInRedirect'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/signin/Licenses.js b/src/pages/signin/Licenses.js index ef9cd8548a2d..605cfed328b5 100644 --- a/src/pages/signin/Licenses.js +++ b/src/pages/signin/Licenses.js @@ -4,7 +4,7 @@ import LocalePicker from '@components/LocalePicker'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; const currentYear = new Date().getFullYear(); diff --git a/src/pages/signin/LoginForm/BaseLoginForm.js b/src/pages/signin/LoginForm/BaseLoginForm.js index e7ac249582a9..81c2e985f8da 100644 --- a/src/pages/signin/LoginForm/BaseLoginForm.js +++ b/src/pages/signin/LoginForm/BaseLoginForm.js @@ -18,6 +18,7 @@ import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withToggleVisibilityView from '@components/withToggleVisibilityView'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; import usePrevious from '@hooks/usePrevious'; +import useThemeStyles from '@hooks/useThemeStyles'; import canFocusInputOnScreenFocus from '@libs/canFocusInputOnScreenFocus'; import compose from '@libs/compose'; import * as ErrorUtils from '@libs/ErrorUtils'; @@ -27,7 +28,6 @@ import * as LoginUtils from '@libs/LoginUtils'; import * as PolicyUtils from '@libs/PolicyUtils'; import * as ValidationUtils from '@libs/ValidationUtils'; import Visibility from '@libs/Visibility'; -import useThemeStyles from '@styles/useThemeStyles'; import * as CloseAccount from '@userActions/CloseAccount'; import * as MemoryOnlyKeys from '@userActions/MemoryOnlyKeys/MemoryOnlyKeys'; import * as Session from '@userActions/Session'; diff --git a/src/pages/signin/SignInHeroCopy.js b/src/pages/signin/SignInHeroCopy.js index 75c53c6b2344..847de3868cee 100644 --- a/src/pages/signin/SignInHeroCopy.js +++ b/src/pages/signin/SignInHeroCopy.js @@ -4,9 +4,9 @@ import {View} from 'react-native'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; const propTypes = { diff --git a/src/pages/signin/SignInHeroImage.js b/src/pages/signin/SignInHeroImage.js index 302e09a7afbc..c665a09932c2 100644 --- a/src/pages/signin/SignInHeroImage.js +++ b/src/pages/signin/SignInHeroImage.js @@ -3,7 +3,7 @@ import React from 'react'; import Lottie from '@components/Lottie'; import LottieAnimations from '@components/LottieAnimations'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; const propTypes = { diff --git a/src/pages/signin/SignInModal.js b/src/pages/signin/SignInModal.js index 9784eb0b67a1..1bb8b6065a15 100644 --- a/src/pages/signin/SignInModal.js +++ b/src/pages/signin/SignInModal.js @@ -1,8 +1,8 @@ import React from 'react'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; +import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Session from '@userActions/Session'; import SignInPage from './SignInPage'; diff --git a/src/pages/signin/SignInPage.js b/src/pages/signin/SignInPage.js index dbad6324c922..23c5b09a0909 100644 --- a/src/pages/signin/SignInPage.js +++ b/src/pages/signin/SignInPage.js @@ -6,18 +6,18 @@ import {withOnyx} from 'react-native-onyx'; import _ from 'underscore'; import ColorSchemeWrapper from '@components/ColorSchemeWrapper'; import CustomStatusBar from '@components/CustomStatusBar'; +import ThemeProvider from '@components/ThemeProvider'; +import ThemeStylesProvider from '@components/ThemeStylesProvider'; import useLocalize from '@hooks/useLocalize'; import useSafeAreaInsets from '@hooks/useSafeAreaInsets'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import * as ActiveClientManager from '@libs/ActiveClientManager'; import * as Localize from '@libs/Localize'; import Log from '@libs/Log'; import Navigation from '@libs/Navigation/Navigation'; import Performance from '@libs/Performance'; -import ThemeProvider from '@styles/themes/ThemeProvider'; -import ThemeStylesProvider from '@styles/ThemeStylesProvider'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as App from '@userActions/App'; import * as Session from '@userActions/Session'; import CONST from '@src/CONST'; diff --git a/src/pages/signin/SignInPageHero.js b/src/pages/signin/SignInPageHero.js index a7bc13785764..81415452451e 100644 --- a/src/pages/signin/SignInPageHero.js +++ b/src/pages/signin/SignInPageHero.js @@ -2,8 +2,8 @@ import PropTypes from 'prop-types'; import React from 'react'; import {View} from 'react-native'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; import SignInHeroCopy from './SignInHeroCopy'; import SignInHeroImage from './SignInHeroImage'; diff --git a/src/pages/signin/SignInPageLayout/BackgroundImage/index.android.js b/src/pages/signin/SignInPageLayout/BackgroundImage/index.android.js index 4185bba88149..b6d9e82726f0 100644 --- a/src/pages/signin/SignInPageLayout/BackgroundImage/index.android.js +++ b/src/pages/signin/SignInPageLayout/BackgroundImage/index.android.js @@ -1,6 +1,6 @@ import React from 'react'; import AndroidBackgroundImage from '@assets/images/home-background--android.svg'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import defaultPropTypes from './propTypes'; function BackgroundImage(props) { diff --git a/src/pages/signin/SignInPageLayout/BackgroundImage/index.js b/src/pages/signin/SignInPageLayout/BackgroundImage/index.js index 872ce7139317..ac93ceeb4e2c 100644 --- a/src/pages/signin/SignInPageLayout/BackgroundImage/index.js +++ b/src/pages/signin/SignInPageLayout/BackgroundImage/index.js @@ -2,7 +2,7 @@ import PropTypes from 'prop-types'; import React from 'react'; import DesktopBackgroundImage from '@assets/images/home-background--desktop.svg'; import MobileBackgroundImage from '@assets/images/home-background--mobile.svg'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import defaultPropTypes from './propTypes'; const defaultProps = { diff --git a/src/pages/signin/SignInPageLayout/Footer.js b/src/pages/signin/SignInPageLayout/Footer.js index 261f0473a6e5..3837914a79bd 100644 --- a/src/pages/signin/SignInPageLayout/Footer.js +++ b/src/pages/signin/SignInPageLayout/Footer.js @@ -8,11 +8,11 @@ import * as Expensicons from '@components/Icon/Expensicons'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import Licenses from '@pages/signin/Licenses'; import Socials from '@pages/signin/Socials'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import * as Session from '@userActions/Session'; import CONST from '@src/CONST'; diff --git a/src/pages/signin/SignInPageLayout/SignInPageContent.js b/src/pages/signin/SignInPageLayout/SignInPageContent.js index fd48ebecf066..5865c235335a 100755 --- a/src/pages/signin/SignInPageLayout/SignInPageContent.js +++ b/src/pages/signin/SignInPageLayout/SignInPageContent.js @@ -7,11 +7,11 @@ import OfflineIndicator from '@components/OfflineIndicator'; import SignInPageForm from '@components/SignInPageForm'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import compose from '@libs/compose'; import SignInHeroImage from '@pages/signin/SignInHeroImage'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; const propTypes = { diff --git a/src/pages/signin/SignInPageLayout/index.js b/src/pages/signin/SignInPageLayout/index.js index 667f873c572e..bc171dd1dc12 100644 --- a/src/pages/signin/SignInPageLayout/index.js +++ b/src/pages/signin/SignInPageLayout/index.js @@ -5,12 +5,12 @@ import {withSafeAreaInsets} from 'react-native-safe-area-context'; import SignInGradient from '@assets/images/home-fade-gradient.svg'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import usePrevious from '@hooks/usePrevious'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import compose from '@libs/compose'; import SignInPageHero from '@pages/signin/SignInPageHero'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import BackgroundImage from './BackgroundImage'; import Footer from './Footer'; diff --git a/src/pages/signin/Socials.js b/src/pages/signin/Socials.js index f5cbbd81e2d8..a5747402d16e 100644 --- a/src/pages/signin/Socials.js +++ b/src/pages/signin/Socials.js @@ -4,8 +4,8 @@ import _ from 'underscore'; import Icon from '@components/Icon'; import * as Expensicons from '@components/Icon/Expensicons'; import PressableWithoutFeedback from '@components/Pressable/PressableWithoutFeedback'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import variables from '@styles/variables'; import * as Link from '@userActions/Link'; import CONST from '@src/CONST'; diff --git a/src/pages/signin/Terms.js b/src/pages/signin/Terms.js index 44e024208fc8..75db2e5debd1 100644 --- a/src/pages/signin/Terms.js +++ b/src/pages/signin/Terms.js @@ -2,7 +2,7 @@ import React, {useMemo} from 'react'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import CONST from '@src/CONST'; function Terms(props) { diff --git a/src/pages/signin/ThirdPartySignInPage.js b/src/pages/signin/ThirdPartySignInPage.js index f0d0f8d42e93..35297e22e665 100644 --- a/src/pages/signin/ThirdPartySignInPage.js +++ b/src/pages/signin/ThirdPartySignInPage.js @@ -9,9 +9,9 @@ import Text from '@components/Text'; import TextLink from '@components/TextLink'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/signin/UnlinkLoginForm.js b/src/pages/signin/UnlinkLoginForm.js index 1ae9b1fd79c6..851a984407e1 100644 --- a/src/pages/signin/UnlinkLoginForm.js +++ b/src/pages/signin/UnlinkLoginForm.js @@ -11,8 +11,8 @@ import {withNetwork} from '@components/OnyxProvider'; import PressableWithFeedback from '@components/Pressable/PressableWithFeedback'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Session from '@userActions/Session'; import redirectToSignIn from '@userActions/SignInRedirect'; import CONST from '@src/CONST'; diff --git a/src/pages/signin/ValidateCodeForm/BaseValidateCodeForm.js b/src/pages/signin/ValidateCodeForm/BaseValidateCodeForm.js index 4e9bf4c3b506..03db6d3436cf 100755 --- a/src/pages/signin/ValidateCodeForm/BaseValidateCodeForm.js +++ b/src/pages/signin/ValidateCodeForm/BaseValidateCodeForm.js @@ -14,15 +14,15 @@ import Text from '@components/Text'; import TextInput from '@components/TextInput'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import usePrevious from '@hooks/usePrevious'; +import useStyleUtils from '@hooks/useStyleUtils'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import canFocusInputOnScreenFocus from '@libs/canFocusInputOnScreenFocus'; import compose from '@libs/compose'; import * as ErrorUtils from '@libs/ErrorUtils'; import * as ValidationUtils from '@libs/ValidationUtils'; import ChangeExpensifyLoginLink from '@pages/signin/ChangeExpensifyLoginLink'; import Terms from '@pages/signin/Terms'; -import useTheme from '@styles/themes/useTheme'; -import useStyleUtils from '@styles/useStyleUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Session from '@userActions/Session'; import * as User from '@userActions/User'; import CONST from '@src/CONST'; diff --git a/src/pages/tasks/NewTaskDescriptionPage.js b/src/pages/tasks/NewTaskDescriptionPage.js index 30908b2de79b..b11e7c163755 100644 --- a/src/pages/tasks/NewTaskDescriptionPage.js +++ b/src/pages/tasks/NewTaskDescriptionPage.js @@ -10,11 +10,11 @@ import ScreenWrapper from '@components/ScreenWrapper'; import TextInput from '@components/TextInput'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import useAutoFocusInput from '@hooks/useAutoFocusInput'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Browser from '@libs/Browser'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import updateMultilineInputRange from '@libs/updateMultilineInputRange'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Task from '@userActions/Task'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/tasks/NewTaskDetailsPage.js b/src/pages/tasks/NewTaskDetailsPage.js index f04b837d85b6..3dab58dfad04 100644 --- a/src/pages/tasks/NewTaskDetailsPage.js +++ b/src/pages/tasks/NewTaskDetailsPage.js @@ -10,11 +10,11 @@ import ScreenWrapper from '@components/ScreenWrapper'; import TextInput from '@components/TextInput'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import useAutoFocusInput from '@hooks/useAutoFocusInput'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Browser from '@libs/Browser'; import compose from '@libs/compose'; import * as ErrorUtils from '@libs/ErrorUtils'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Task from '@userActions/Task'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/tasks/NewTaskPage.js b/src/pages/tasks/NewTaskPage.js index 24bdb39d5bff..1c4c3f58b0a1 100644 --- a/src/pages/tasks/NewTaskPage.js +++ b/src/pages/tasks/NewTaskPage.js @@ -11,13 +11,13 @@ import MenuItem from '@components/MenuItem'; import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription'; import ScreenWrapper from '@components/ScreenWrapper'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as LocalePhoneNumber from '@libs/LocalePhoneNumber'; import Navigation from '@libs/Navigation/Navigation'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as ReportUtils from '@libs/ReportUtils'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Task from '@userActions/Task'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/tasks/NewTaskTitlePage.js b/src/pages/tasks/NewTaskTitlePage.js index 48c9d9126297..7bf6065625c0 100644 --- a/src/pages/tasks/NewTaskTitlePage.js +++ b/src/pages/tasks/NewTaskTitlePage.js @@ -9,10 +9,10 @@ import ScreenWrapper from '@components/ScreenWrapper'; import TextInput from '@components/TextInput'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import useAutoFocusInput from '@hooks/useAutoFocusInput'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as ErrorUtils from '@libs/ErrorUtils'; import Navigation from '@libs/Navigation/Navigation'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Task from '@userActions/Task'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/tasks/TaskAssigneeSelectorModal.js b/src/pages/tasks/TaskAssigneeSelectorModal.js index c61990b1c347..dbc7c262cd93 100644 --- a/src/pages/tasks/TaskAssigneeSelectorModal.js +++ b/src/pages/tasks/TaskAssigneeSelectorModal.js @@ -13,12 +13,12 @@ import ScreenWrapper from '@components/ScreenWrapper'; import withCurrentUserPersonalDetails from '@components/withCurrentUserPersonalDetails'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import useAutoFocusInput from '@hooks/useAutoFocusInput'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as ReportUtils from '@libs/ReportUtils'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Task from '@userActions/Task'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/tasks/TaskDescriptionPage.js b/src/pages/tasks/TaskDescriptionPage.js index 4e963a22b749..c5dab0dc2f94 100644 --- a/src/pages/tasks/TaskDescriptionPage.js +++ b/src/pages/tasks/TaskDescriptionPage.js @@ -11,6 +11,7 @@ import ScreenWrapper from '@components/ScreenWrapper'; import TextInput from '@components/TextInput'; import withCurrentUserPersonalDetails from '@components/withCurrentUserPersonalDetails'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Browser from '@libs/Browser'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; @@ -19,7 +20,6 @@ import StringUtils from '@libs/StringUtils'; import updateMultilineInputRange from '@libs/updateMultilineInputRange'; import withReportOrNotFound from '@pages/home/report/withReportOrNotFound'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Task from '@userActions/Task'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/tasks/TaskShareDestinationSelectorModal.js b/src/pages/tasks/TaskShareDestinationSelectorModal.js index 914afa34bd85..b0b6dac15d69 100644 --- a/src/pages/tasks/TaskShareDestinationSelectorModal.js +++ b/src/pages/tasks/TaskShareDestinationSelectorModal.js @@ -10,6 +10,7 @@ import ScreenWrapper from '@components/ScreenWrapper'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import useAutoFocusInput from '@hooks/useAutoFocusInput'; import useNetwork from '@hooks/useNetwork'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Report from '@libs/actions/Report'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; @@ -17,7 +18,6 @@ import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as ReportUtils from '@libs/ReportUtils'; import personalDetailsPropType from '@pages/personalDetailsPropType'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Task from '@userActions/Task'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/tasks/TaskTitlePage.js b/src/pages/tasks/TaskTitlePage.js index 6dff0e3d8f7e..9b3d28a0d032 100644 --- a/src/pages/tasks/TaskTitlePage.js +++ b/src/pages/tasks/TaskTitlePage.js @@ -10,12 +10,12 @@ import ScreenWrapper from '@components/ScreenWrapper'; import TextInput from '@components/TextInput'; import withCurrentUserPersonalDetails from '@components/withCurrentUserPersonalDetails'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import * as ReportUtils from '@libs/ReportUtils'; import withReportOrNotFound from '@pages/home/report/withReportOrNotFound'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Task from '@userActions/Task'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/workspace/WorkspaceInitialPage.js b/src/pages/workspace/WorkspaceInitialPage.js index 3c73687ca813..80813c847239 100644 --- a/src/pages/workspace/WorkspaceInitialPage.js +++ b/src/pages/workspace/WorkspaceInitialPage.js @@ -18,6 +18,7 @@ import Tooltip from '@components/Tooltip'; import useLocalize from '@hooks/useLocalize'; import usePrevious from '@hooks/usePrevious'; import useSingleExecution from '@hooks/useSingleExecution'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWaitForNavigation from '@hooks/useWaitForNavigation'; import useWindowDimensions from '@hooks/useWindowDimensions'; import compose from '@libs/compose'; @@ -26,7 +27,6 @@ import * as PolicyUtils from '@libs/PolicyUtils'; import * as ReportUtils from '@libs/ReportUtils'; import * as ReimbursementAccountProps from '@pages/ReimbursementAccount/reimbursementAccountPropTypes'; import reportPropTypes from '@pages/reportPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as App from '@userActions/App'; import * as Policy from '@userActions/Policy'; import * as ReimbursementAccount from '@userActions/ReimbursementAccount'; diff --git a/src/pages/workspace/WorkspaceInvitePage.js b/src/pages/workspace/WorkspaceInvitePage.js index 3528224f39b9..7a28558ee587 100644 --- a/src/pages/workspace/WorkspaceInvitePage.js +++ b/src/pages/workspace/WorkspaceInvitePage.js @@ -11,12 +11,12 @@ import ScreenWrapper from '@components/ScreenWrapper'; import SelectionList from '@components/SelectionList'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Browser from '@libs/Browser'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as PolicyUtils from '@libs/PolicyUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Policy from '@userActions/Policy'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/workspace/WorkspaceMembersPage.js b/src/pages/workspace/WorkspaceMembersPage.js index 59993087c44c..9834d4e9e1c0 100644 --- a/src/pages/workspace/WorkspaceMembersPage.js +++ b/src/pages/workspace/WorkspaceMembersPage.js @@ -19,6 +19,7 @@ import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultPro import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; import usePrevious from '@hooks/usePrevious'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Browser from '@libs/Browser'; import compose from '@libs/compose'; import Log from '@libs/Log'; @@ -28,7 +29,6 @@ import * as PersonalDetailsUtils from '@libs/PersonalDetailsUtils'; import * as PolicyUtils from '@libs/PolicyUtils'; import * as UserUtils from '@libs/UserUtils'; import personalDetailsPropType from '@pages/personalDetailsPropType'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Policy from '@userActions/Policy'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/workspace/WorkspaceNewRoomPage.js b/src/pages/workspace/WorkspaceNewRoomPage.js index c7fc9de2571f..d09790af58d5 100644 --- a/src/pages/workspace/WorkspaceNewRoomPage.js +++ b/src/pages/workspace/WorkspaceNewRoomPage.js @@ -17,6 +17,7 @@ import useAutoFocusInput from '@hooks/useAutoFocusInput'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; import usePrevious from '@hooks/usePrevious'; +import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import compose from '@libs/compose'; import * as ErrorUtils from '@libs/ErrorUtils'; @@ -25,7 +26,6 @@ import Permissions from '@libs/Permissions'; import * as PolicyUtils from '@libs/PolicyUtils'; import * as ReportUtils from '@libs/ReportUtils'; import * as ValidationUtils from '@libs/ValidationUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import variables from '@styles/variables'; import * as App from '@userActions/App'; import * as Report from '@userActions/Report'; diff --git a/src/pages/workspace/WorkspacePageWithSections.js b/src/pages/workspace/WorkspacePageWithSections.js index bea94ed3ef4e..6b5c179a2e51 100644 --- a/src/pages/workspace/WorkspacePageWithSections.js +++ b/src/pages/workspace/WorkspacePageWithSections.js @@ -9,13 +9,13 @@ import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; import ScrollViewWithContext from '@components/ScrollViewWithContext'; import useNetwork from '@hooks/useNetwork'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import BankAccount from '@libs/models/BankAccount'; import Navigation from '@libs/Navigation/Navigation'; import * as PolicyUtils from '@libs/PolicyUtils'; import * as ReimbursementAccountProps from '@pages/ReimbursementAccount/reimbursementAccountPropTypes'; import userPropTypes from '@pages/settings/userPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as BankAccounts from '@userActions/BankAccounts'; import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; diff --git a/src/pages/workspace/WorkspaceResetBankAccountModal.js b/src/pages/workspace/WorkspaceResetBankAccountModal.js index 19e15a2828bc..f4ad662ebb75 100644 --- a/src/pages/workspace/WorkspaceResetBankAccountModal.js +++ b/src/pages/workspace/WorkspaceResetBankAccountModal.js @@ -5,9 +5,9 @@ import {withOnyx} from 'react-native-onyx'; import ConfirmModal from '@components/ConfirmModal'; import Text from '@components/Text'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import BankAccount from '@libs/models/BankAccount'; import * as ReimbursementAccountProps from '@pages/ReimbursementAccount/reimbursementAccountPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as BankAccounts from '@userActions/BankAccounts'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/workspace/WorkspaceSettingsPage.js b/src/pages/workspace/WorkspaceSettingsPage.js index d121134f26da..9bc4b755fce9 100644 --- a/src/pages/workspace/WorkspaceSettingsPage.js +++ b/src/pages/workspace/WorkspaceSettingsPage.js @@ -16,12 +16,12 @@ import Text from '@components/Text'; import TextInput from '@components/TextInput'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; import useLocalize from '@hooks/useLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import * as ReportUtils from '@libs/ReportUtils'; import * as UserUtils from '@libs/UserUtils'; import * as ValidationUtils from '@libs/ValidationUtils'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Policy from '@userActions/Policy'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/workspace/WorkspacesListPage.js b/src/pages/workspace/WorkspacesListPage.js index cf258b462285..cac0d1bd71a6 100755 --- a/src/pages/workspace/WorkspacesListPage.js +++ b/src/pages/workspace/WorkspacesListPage.js @@ -12,6 +12,8 @@ import MenuItem from '@components/MenuItem'; import OfflineWithFeedback from '@components/OfflineWithFeedback'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import * as CurrencyUtils from '@libs/CurrencyUtils'; import Navigation from '@libs/Navigation/Navigation'; @@ -19,8 +21,6 @@ import * as PolicyUtils from '@libs/PolicyUtils'; import * as ReportUtils from '@libs/ReportUtils'; import policyMemberPropType from '@pages/policyMemberPropType'; import * as ReimbursementAccountProps from '@pages/ReimbursementAccount/reimbursementAccountPropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as App from '@userActions/App'; import * as Policy from '@userActions/Policy'; import CONST from '@src/CONST'; diff --git a/src/pages/workspace/bills/WorkspaceBillsFirstSection.js b/src/pages/workspace/bills/WorkspaceBillsFirstSection.js index 8221beb23fcf..3f7f59180c8b 100644 --- a/src/pages/workspace/bills/WorkspaceBillsFirstSection.js +++ b/src/pages/workspace/bills/WorkspaceBillsFirstSection.js @@ -10,9 +10,9 @@ import Section from '@components/Section'; import Text from '@components/Text'; import TextLink from '@components/TextLink'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import userPropTypes from '@pages/settings/userPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Link from '@userActions/Link'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/workspace/bills/WorkspaceBillsNoVBAView.js b/src/pages/workspace/bills/WorkspaceBillsNoVBAView.js index 51faa2710208..8211f70163d5 100644 --- a/src/pages/workspace/bills/WorkspaceBillsNoVBAView.js +++ b/src/pages/workspace/bills/WorkspaceBillsNoVBAView.js @@ -6,7 +6,7 @@ import * as Illustrations from '@components/Icon/Illustrations'; import Section from '@components/Section'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import WorkspaceBillsFirstSection from './WorkspaceBillsFirstSection'; const propTypes = { diff --git a/src/pages/workspace/bills/WorkspaceBillsVBAView.js b/src/pages/workspace/bills/WorkspaceBillsVBAView.js index 065c3fbaa84d..dd9c1c7fbaf6 100644 --- a/src/pages/workspace/bills/WorkspaceBillsVBAView.js +++ b/src/pages/workspace/bills/WorkspaceBillsVBAView.js @@ -6,7 +6,7 @@ import * as Illustrations from '@components/Icon/Illustrations'; import Section from '@components/Section'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Link from '@userActions/Link'; import WorkspaceBillsFirstSection from './WorkspaceBillsFirstSection'; diff --git a/src/pages/workspace/card/WorkspaceCardNoVBAView.js b/src/pages/workspace/card/WorkspaceCardNoVBAView.js index cf920571495f..3233f8ea7e23 100644 --- a/src/pages/workspace/card/WorkspaceCardNoVBAView.js +++ b/src/pages/workspace/card/WorkspaceCardNoVBAView.js @@ -7,7 +7,7 @@ import Section from '@components/Section'; import Text from '@components/Text'; import UnorderedList from '@components/UnorderedList'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; const propTypes = { /** The policy ID currently being configured */ diff --git a/src/pages/workspace/card/WorkspaceCardVBANoECardView.js b/src/pages/workspace/card/WorkspaceCardVBANoECardView.js index 2b4925ff20bd..970cd9105368 100644 --- a/src/pages/workspace/card/WorkspaceCardVBANoECardView.js +++ b/src/pages/workspace/card/WorkspaceCardVBANoECardView.js @@ -8,9 +8,9 @@ import Section from '@components/Section'; import Text from '@components/Text'; import UnorderedList from '@components/UnorderedList'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import userPropTypes from '@pages/settings/userPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Link from '@userActions/Link'; import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; diff --git a/src/pages/workspace/card/WorkspaceCardVBAWithECardView.js b/src/pages/workspace/card/WorkspaceCardVBAWithECardView.js index 278f6d01319c..40ecd80b8e6e 100644 --- a/src/pages/workspace/card/WorkspaceCardVBAWithECardView.js +++ b/src/pages/workspace/card/WorkspaceCardVBAWithECardView.js @@ -6,7 +6,7 @@ import Section from '@components/Section'; import Text from '@components/Text'; import UnorderedList from '@components/UnorderedList'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Link from '@userActions/Link'; const propTypes = { diff --git a/src/pages/workspace/invoices/WorkspaceInvoicesFirstSection.js b/src/pages/workspace/invoices/WorkspaceInvoicesFirstSection.js index 749e6b28b11b..b33311021e61 100644 --- a/src/pages/workspace/invoices/WorkspaceInvoicesFirstSection.js +++ b/src/pages/workspace/invoices/WorkspaceInvoicesFirstSection.js @@ -6,7 +6,7 @@ import * as Illustrations from '@components/Icon/Illustrations'; import Section from '@components/Section'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Link from '@userActions/Link'; const propTypes = { diff --git a/src/pages/workspace/invoices/WorkspaceInvoicesNoVBAView.js b/src/pages/workspace/invoices/WorkspaceInvoicesNoVBAView.js index 9be8994bc5a7..25a97ac93442 100644 --- a/src/pages/workspace/invoices/WorkspaceInvoicesNoVBAView.js +++ b/src/pages/workspace/invoices/WorkspaceInvoicesNoVBAView.js @@ -6,7 +6,7 @@ import * as Illustrations from '@components/Icon/Illustrations'; import Section from '@components/Section'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import WorkspaceInvoicesFirstSection from './WorkspaceInvoicesFirstSection'; const propTypes = { diff --git a/src/pages/workspace/invoices/WorkspaceInvoicesVBAView.js b/src/pages/workspace/invoices/WorkspaceInvoicesVBAView.js index 0c6ea7103990..c5e047f6291b 100644 --- a/src/pages/workspace/invoices/WorkspaceInvoicesVBAView.js +++ b/src/pages/workspace/invoices/WorkspaceInvoicesVBAView.js @@ -6,7 +6,7 @@ import * as Illustrations from '@components/Icon/Illustrations'; import Section from '@components/Section'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Link from '@userActions/Link'; import WorkspaceInvoicesFirstSection from './WorkspaceInvoicesFirstSection'; diff --git a/src/pages/workspace/reimburse/WorkspaceReimburseSection.js b/src/pages/workspace/reimburse/WorkspaceReimburseSection.js index bf9111775f18..7cf17c9d498c 100644 --- a/src/pages/workspace/reimburse/WorkspaceReimburseSection.js +++ b/src/pages/workspace/reimburse/WorkspaceReimburseSection.js @@ -9,10 +9,10 @@ import * as Illustrations from '@components/Icon/Illustrations'; import networkPropTypes from '@components/networkPropTypes'; import Section from '@components/Section'; import Text from '@components/Text'; +import useTheme from '@hooks/useTheme'; +import useThemeStyles from '@hooks/useThemeStyles'; import BankAccount from '@libs/models/BankAccount'; import * as ReimbursementAccountProps from '@pages/ReimbursementAccount/reimbursementAccountPropTypes'; -import useTheme from '@styles/themes/useTheme'; -import useThemeStyles from '@styles/useThemeStyles'; import * as Link from '@userActions/Link'; import CONST from '@src/CONST'; diff --git a/src/pages/workspace/reimburse/WorkspaceReimburseView.js b/src/pages/workspace/reimburse/WorkspaceReimburseView.js index 752639c33d3a..23136064fc2b 100644 --- a/src/pages/workspace/reimburse/WorkspaceReimburseView.js +++ b/src/pages/workspace/reimburse/WorkspaceReimburseView.js @@ -14,11 +14,11 @@ import {withNetwork} from '@components/OnyxProvider'; import Section from '@components/Section'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useThemeStyles from '@hooks/useThemeStyles'; import compose from '@libs/compose'; import Navigation from '@libs/Navigation/Navigation'; import * as PolicyUtils from '@libs/PolicyUtils'; import * as ReimbursementAccountProps from '@pages/ReimbursementAccount/reimbursementAccountPropTypes'; -import useThemeStyles from '@styles/useThemeStyles'; import * as BankAccounts from '@userActions/BankAccounts'; import * as Link from '@userActions/Link'; import * as Policy from '@userActions/Policy'; diff --git a/src/pages/workspace/travel/WorkspaceTravelNoVBAView.js b/src/pages/workspace/travel/WorkspaceTravelNoVBAView.js index 64269084aad4..d8154955a5d7 100644 --- a/src/pages/workspace/travel/WorkspaceTravelNoVBAView.js +++ b/src/pages/workspace/travel/WorkspaceTravelNoVBAView.js @@ -6,7 +6,7 @@ import * as Illustrations from '@components/Icon/Illustrations'; import Section from '@components/Section'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; const propTypes = { /** The policy ID currently being configured */ diff --git a/src/pages/workspace/travel/WorkspaceTravelVBAView.js b/src/pages/workspace/travel/WorkspaceTravelVBAView.js index b6424e918037..5228f9185852 100644 --- a/src/pages/workspace/travel/WorkspaceTravelVBAView.js +++ b/src/pages/workspace/travel/WorkspaceTravelVBAView.js @@ -5,7 +5,7 @@ import * as Illustrations from '@components/Icon/Illustrations'; import Section from '@components/Section'; import Text from '@components/Text'; import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; -import useThemeStyles from '@styles/useThemeStyles'; +import useThemeStyles from '@hooks/useThemeStyles'; import * as Link from '@userActions/Link'; import * as Report from '@userActions/Report'; import CONST from '@src/CONST'; diff --git a/src/stories/CheckboxWithLabel.stories.js b/src/stories/CheckboxWithLabel.stories.js index e8d45f434b16..2da4713e81b3 100644 --- a/src/stories/CheckboxWithLabel.stories.js +++ b/src/stories/CheckboxWithLabel.stories.js @@ -1,7 +1,7 @@ import React from 'react'; import CheckboxWithLabel from '@components/CheckboxWithLabel'; import Text from '@components/Text'; -import styles from '@styles/styles'; +import {defaultStyles} from '@styles/index'; /** * We use the Component Story Format for writing stories. Follow the docs here: @@ -34,9 +34,9 @@ WithLabelComponent.args = { onInputChange: () => {}, LabelComponent: () => ( <> - Test - Test - Test + Test + Test + Test ), }; diff --git a/src/stories/Composer.stories.js b/src/stories/Composer.stories.js index 799012e1c051..04fa9be7de86 100644 --- a/src/stories/Composer.stories.js +++ b/src/stories/Composer.stories.js @@ -5,9 +5,9 @@ import Composer from '@components/Composer'; import RenderHTML from '@components/RenderHTML'; import Text from '@components/Text'; import withNavigationFallback from '@components/withNavigationFallback'; -import styles from '@styles/styles'; -import themeColors from '@styles/themes/default'; -import useStyleUtils from '@styles/useStyleUtils'; +import useStyleUtils from '@hooks/useStyleUtils'; +import {defaultStyles} from '@styles/index'; +import {defaultTheme} from '@styles/theme'; import CONST from '@src/CONST'; const ComposerWithNavigation = withNavigationFallback(Composer); @@ -32,29 +32,29 @@ function Default(args) { return ( - + - + - Entered Comment (Drop Enabled) + Entered Comment (Drop Enabled) {comment} - - Rendered Comment + + Rendered Comment {Boolean(renderedHTML) && } {Boolean(pastedFile) && ( - + - + {fileURL ? ( - + Release to upload file diff --git a/src/stories/Form.stories.js b/src/stories/Form.stories.js index 1edc860a4871..a937c6732e9b 100644 --- a/src/stories/Form.stories.js +++ b/src/stories/Form.stories.js @@ -11,7 +11,7 @@ import Text from '@components/Text'; import TextInput from '@components/TextInput'; import NetworkConnection from '@libs/NetworkConnection'; import * as ValidationUtils from '@libs/ValidationUtils'; -import styles from '@styles/styles'; +import {defaultStyles} from '@styles/index'; import * as FormActions from '@userActions/FormActions'; import CONST from '@src/CONST'; @@ -60,26 +60,26 @@ function Template(args) { label="Account number" accessibilityLabel="Account number" inputID="accountNumber" - containerStyles={[styles.mt4]} + containerStyles={[defaultStyles.mt4]} /> - + I accept the Expensify Terms of Service} /> diff --git a/src/stories/PopoverMenu.stories.js b/src/stories/PopoverMenu.stories.js index b860a8343309..c03a554741f1 100644 --- a/src/stories/PopoverMenu.stories.js +++ b/src/stories/PopoverMenu.stories.js @@ -3,7 +3,8 @@ import {SafeAreaProvider} from 'react-native-safe-area-context'; import * as Expensicons from '@components/Icon/Expensicons'; import MenuItem from '@components/MenuItem'; import PopoverMenu from '@components/PopoverMenu'; -import themeColors from '@styles/themes/default'; +// eslint-disable-next-line no-restricted-imports +import themeColors from '@styles/theme/themes/dark'; /** * We use the Component Story Format for writing stories. Follow the docs here: diff --git a/src/stories/SelectionList.stories.js b/src/stories/SelectionList.stories.js index ec80a8e908ac..c08ef2df783a 100644 --- a/src/stories/SelectionList.stories.js +++ b/src/stories/SelectionList.stories.js @@ -3,7 +3,7 @@ import {View} from 'react-native'; import _ from 'underscore'; import SelectionList from '@components/SelectionList'; import Text from '@components/Text'; -import styles from '@styles/styles'; +import {defaultStyles} from '@styles/index'; import CONST from '@src/CONST'; /** @@ -228,8 +228,8 @@ function MultipleSelection(args) { accountID: item.keyForList, login: item.text, rightElement: isAdmin && ( - - Admin + + Admin ), }; @@ -290,8 +290,8 @@ function WithSectionHeader(args) { accountID: item.keyForList, login: item.text, rightElement: isAdmin && ( - - Admin + + Admin ), }; @@ -350,8 +350,8 @@ function WithConfirmButton(args) { accountID: item.keyForList, login: item.text, rightElement: isAdmin && ( - - Admin + + Admin ), }; diff --git a/src/styles/illustrations/ThemeIllustrationsContext.ts b/src/styles/illustrations/ThemeIllustrationsContext.ts deleted file mode 100644 index e4956e6c0479..000000000000 --- a/src/styles/illustrations/ThemeIllustrationsContext.ts +++ /dev/null @@ -1,7 +0,0 @@ -import React from 'react'; -import DarkIllustrations from './dark'; -import {Illustrations} from './types'; - -const ThemeIllustrationsContext = React.createContext(DarkIllustrations); - -export default ThemeIllustrationsContext; diff --git a/src/styles/styles.ts b/src/styles/index.ts similarity index 98% rename from src/styles/styles.ts rename to src/styles/index.ts index ac2fee2074e0..9e02335bde0d 100644 --- a/src/styles/styles.ts +++ b/src/styles/index.ts @@ -9,35 +9,36 @@ import {MixedStyleDeclaration, MixedStyleRecord} from 'react-native-render-html' import DotLottieAnimation from '@components/LottieAnimations/types'; import * as Browser from '@libs/Browser'; import CONST from '@src/CONST'; -import addOutlineWidth from './addOutlineWidth'; -import codeStyles from './codeStyles'; -import colors from './colors'; -import fontFamily from './fontFamily'; -import fontWeightBold from './fontWeight/bold'; -import getPopOverVerticalOffset from './getPopOverVerticalOffset'; -import optionAlternateTextPlatformStyles from './optionAlternateTextPlatformStyles'; -import overflowXHidden from './overflowXHidden'; -import pointerEventsAuto from './pointerEventsAuto'; -import pointerEventsBoxNone from './pointerEventsBoxNone'; -import pointerEventsNone from './pointerEventsNone'; -import {defaultTheme} from './themes/themes'; -import {type ThemeColors} from './themes/types'; -import borders from './utilities/borders'; -import cursor from './utilities/cursor'; -import display from './utilities/display'; -import flex from './utilities/flex'; -import objectFit from './utilities/objectFit'; -import overflow from './utilities/overflow'; -import positioning from './utilities/positioning'; -import sizing from './utilities/sizing'; -import spacing from './utilities/spacing'; -import textDecorationLine from './utilities/textDecorationLine'; -import textUnderline from './utilities/textUnderline'; -import userSelect from './utilities/userSelect'; -import visibility from './utilities/visibility'; -import whiteSpace from './utilities/whiteSpace'; -import wordBreak from './utilities/wordBreak'; -import writingDirection from './utilities/writingDirection'; +import {defaultTheme} from './theme'; +import colors from './theme/colors'; +import {type ThemeColors} from './theme/types'; +import addOutlineWidth from './utils/addOutlineWidth'; +import borders from './utils/borders'; +import codeStyles from './utils/codeStyles'; +import cursor from './utils/cursor'; +import display from './utils/display'; +import editedLabelStyles from './utils/editedLabelStyles'; +import flex from './utils/flex'; +import fontFamily from './utils/fontFamily'; +import fontWeightBold from './utils/fontWeight/bold'; +import getPopOverVerticalOffset from './utils/getPopOverVerticalOffset'; +import objectFit from './utils/objectFit'; +import optionAlternateTextPlatformStyles from './utils/optionAlternateTextPlatformStyles'; +import overflow from './utils/overflow'; +import overflowXHidden from './utils/overflowXHidden'; +import pointerEventsAuto from './utils/pointerEventsAuto'; +import pointerEventsBoxNone from './utils/pointerEventsBoxNone'; +import pointerEventsNone from './utils/pointerEventsNone'; +import positioning from './utils/positioning'; +import sizing from './utils/sizing'; +import spacing from './utils/spacing'; +import textDecorationLine from './utils/textDecorationLine'; +import textUnderline from './utils/textUnderline'; +import userSelect from './utils/userSelect'; +import visibility from './utils/visibility'; +import whiteSpace from './utils/whiteSpace'; +import wordBreak from './utils/wordBreak'; +import writingDirection from './utils/writingDirection'; import variables from './variables'; type ColorScheme = (typeof CONST.COLOR_SCHEME)[keyof typeof CONST.COLOR_SCHEME]; @@ -234,6 +235,7 @@ const styles = (theme: ThemeColors) => ...textUnderline, ...objectFit, ...textDecorationLine, + editedLabelStyles, autoCompleteSuggestionsContainer: { backgroundColor: theme.appBG, @@ -4051,4 +4053,5 @@ type ThemeStyles = ReturnType; const defaultStyles = styles(defaultTheme); export default styles; -export {defaultStyles, type Styles, type ThemeStyles, type StatusBarStyle, type ColorScheme}; +export {defaultStyles}; +export type {Styles, ThemeStyles, StatusBarStyle, ColorScheme}; diff --git a/src/styles/stylePropTypes.js b/src/styles/stylePropTypes.js index b97decba621c..f9ecdb98ff13 100644 --- a/src/styles/stylePropTypes.js +++ b/src/styles/stylePropTypes.js @@ -1,3 +1,5 @@ import PropTypes from 'prop-types'; -export default PropTypes.oneOfType([PropTypes.object, PropTypes.arrayOf(PropTypes.object), PropTypes.func]); +const stylePropTypes = PropTypes.oneOfType([PropTypes.object, PropTypes.arrayOf(PropTypes.object), PropTypes.func]); + +export default stylePropTypes; diff --git a/src/styles/colors.ts b/src/styles/theme/colors.ts similarity index 98% rename from src/styles/colors.ts rename to src/styles/theme/colors.ts index 35d93f060c86..061336d2d114 100644 --- a/src/styles/colors.ts +++ b/src/styles/theme/colors.ts @@ -1,4 +1,4 @@ -import {Color} from './themes/types'; +import {Color} from './types'; /** * DO NOT import colors.js into files. Use the theme switching hooks and HOCs instead. diff --git a/src/styles/themes/ThemeContext.ts b/src/styles/theme/context/ThemeContext.ts similarity index 59% rename from src/styles/themes/ThemeContext.ts rename to src/styles/theme/context/ThemeContext.ts index ec35675953fe..64cd805b3f59 100644 --- a/src/styles/themes/ThemeContext.ts +++ b/src/styles/theme/context/ThemeContext.ts @@ -1,6 +1,6 @@ import React from 'react'; -import {defaultTheme} from './themes'; -import {type ThemeColors} from './types'; +import {type ThemeColors} from '@styles/theme/types'; +import {defaultTheme} from '..'; const ThemeContext = React.createContext(defaultTheme); diff --git a/src/styles/theme/context/ThemeIllustrationsContext.ts b/src/styles/theme/context/ThemeIllustrationsContext.ts new file mode 100644 index 000000000000..b70cf6aa5ea2 --- /dev/null +++ b/src/styles/theme/context/ThemeIllustrationsContext.ts @@ -0,0 +1,7 @@ +import React from 'react'; +import {DefaultIllustrations} from '@styles/theme/illustrations'; +import {IllustrationsType} from '@styles/theme/illustrations/types'; + +const ThemeIllustrationsContext = React.createContext(DefaultIllustrations); + +export default ThemeIllustrationsContext; diff --git a/src/styles/ThemeStylesContext.ts b/src/styles/theme/context/ThemeStylesContext.ts similarity index 62% rename from src/styles/ThemeStylesContext.ts rename to src/styles/theme/context/ThemeStylesContext.ts index 73f044f2dcbd..a1c81bbd9c7c 100644 --- a/src/styles/ThemeStylesContext.ts +++ b/src/styles/theme/context/ThemeStylesContext.ts @@ -1,8 +1,8 @@ import React from 'react'; -import {defaultStyles} from './styles'; -import type {ThemeStyles} from './styles'; -import {DefaultStyleUtils} from './utils'; -import type {StyleUtilsType} from './utils'; +import {defaultStyles} from '@styles/index'; +import type {ThemeStyles} from '@styles/index'; +import {DefaultStyleUtils} from '@styles/utils'; +import type {StyleUtilsType} from '@styles/utils'; type ThemeStylesContextType = { styles: ThemeStyles; diff --git a/src/styles/theme/illustrations/index.ts b/src/styles/theme/illustrations/index.ts new file mode 100644 index 000000000000..7f5cd2feeedb --- /dev/null +++ b/src/styles/theme/illustrations/index.ts @@ -0,0 +1,15 @@ +import {ThemePreferenceWithoutSystem} from '@styles/theme/types'; +import CONST from '@src/CONST'; +import darkIllustrations from './themes/dark'; +import lightIllustrations from './themes/light'; +import type {IllustrationsType} from './types'; + +const Illustrations = { + [CONST.THEME.LIGHT]: lightIllustrations, + [CONST.THEME.DARK]: darkIllustrations, +} satisfies Record; + +const DefaultIllustrations = Illustrations[CONST.THEME.DEFAULT]; + +export default Illustrations; +export {DefaultIllustrations}; diff --git a/src/styles/illustrations/dark.ts b/src/styles/theme/illustrations/themes/dark.ts similarity index 80% rename from src/styles/illustrations/dark.ts rename to src/styles/theme/illustrations/themes/dark.ts index ca52a24a4e4e..2a4390ae2520 100644 --- a/src/styles/illustrations/dark.ts +++ b/src/styles/theme/illustrations/themes/dark.ts @@ -1,12 +1,12 @@ import EmptyStateBackgroundImage from '@assets/images/themeDependent/empty-state_background-fade-dark.png'; import ExampleCheckEN from '@assets/images/themeDependent/example-check-image-dark-en.png'; import ExampleCheckES from '@assets/images/themeDependent/example-check-image-dark-es.png'; -import {Illustrations} from './types'; +import {IllustrationsType} from '@styles/theme/illustrations/types'; const illustrations = { EmptyStateBackgroundImage, ExampleCheckEN, ExampleCheckES, -} satisfies Illustrations; +} satisfies IllustrationsType; export default illustrations; diff --git a/src/styles/illustrations/light.ts b/src/styles/theme/illustrations/themes/light.ts similarity index 80% rename from src/styles/illustrations/light.ts rename to src/styles/theme/illustrations/themes/light.ts index a953a312327f..f41114a04efa 100644 --- a/src/styles/illustrations/light.ts +++ b/src/styles/theme/illustrations/themes/light.ts @@ -1,12 +1,12 @@ import EmptyStateBackgroundImage from '@assets/images/themeDependent/empty-state_background-fade-light.png'; import ExampleCheckEN from '@assets/images/themeDependent/example-check-image-light-en.png'; import ExampleCheckES from '@assets/images/themeDependent/example-check-image-light-es.png'; -import {Illustrations} from './types'; +import {IllustrationsType} from '@styles/theme/illustrations/types'; const illustrations = { EmptyStateBackgroundImage, ExampleCheckEN, ExampleCheckES, -} satisfies Illustrations; +} satisfies IllustrationsType; export default illustrations; diff --git a/src/styles/illustrations/types.ts b/src/styles/theme/illustrations/types.ts similarity index 80% rename from src/styles/illustrations/types.ts rename to src/styles/theme/illustrations/types.ts index bfb1db4a19c1..bda98dc55fbf 100644 --- a/src/styles/illustrations/types.ts +++ b/src/styles/theme/illustrations/types.ts @@ -1,10 +1,10 @@ import {ImageSourcePropType} from 'react-native'; -type Illustrations = { +type IllustrationsType = { EmptyStateBackgroundImage: ImageSourcePropType; ExampleCheckES: ImageSourcePropType; ExampleCheckEN: ImageSourcePropType; }; // eslint-disable-next-line import/prefer-default-export -export {type Illustrations}; +export {type IllustrationsType}; diff --git a/src/styles/themes/themes.ts b/src/styles/theme/index.ts similarity index 81% rename from src/styles/themes/themes.ts rename to src/styles/theme/index.ts index c0a305df294f..de7805a6fe9d 100644 --- a/src/styles/themes/themes.ts +++ b/src/styles/theme/index.ts @@ -1,6 +1,6 @@ import CONST from '@src/CONST'; -import darkTheme from './default'; -import lightTheme from './light'; +import darkTheme from './themes/dark'; +import lightTheme from './themes/light'; import {type ThemeColors, ThemePreferenceWithoutSystem} from './types'; const themes = { diff --git a/src/styles/themes/default.ts b/src/styles/theme/themes/dark.ts similarity index 98% rename from src/styles/themes/default.ts rename to src/styles/theme/themes/dark.ts index ca48b139b107..714802095810 100644 --- a/src/styles/themes/default.ts +++ b/src/styles/theme/themes/dark.ts @@ -1,7 +1,7 @@ -import colors from '@styles/colors'; +import colors from '@styles/theme/colors'; +import {type ThemeColors} from '@styles/theme/types'; import CONST from '@src/CONST'; import SCREENS from '@src/SCREENS'; -import {type ThemeColors} from './types'; const darkTheme = { // Figma keys diff --git a/src/styles/themes/light.ts b/src/styles/theme/themes/light.ts similarity index 98% rename from src/styles/themes/light.ts rename to src/styles/theme/themes/light.ts index 3c37ec4534d0..8d401f7533d7 100644 --- a/src/styles/themes/light.ts +++ b/src/styles/theme/themes/light.ts @@ -1,7 +1,7 @@ -import colors from '@styles/colors'; +import colors from '@styles/theme/colors'; +import {type ThemeColors} from '@styles/theme/types'; import CONST from '@src/CONST'; import SCREENS from '@src/SCREENS'; -import {type ThemeColors} from './types'; const lightTheme = { // Figma keys diff --git a/src/styles/themes/types.ts b/src/styles/theme/types.ts similarity index 97% rename from src/styles/themes/types.ts rename to src/styles/theme/types.ts index 3a123419c384..0cd69b45270f 100644 --- a/src/styles/themes/types.ts +++ b/src/styles/theme/types.ts @@ -1,5 +1,5 @@ -import {type ColorScheme, type StatusBarStyle} from '@styles/styles'; import CONST from '@src/CONST'; +import {type ColorScheme, type StatusBarStyle} from '..'; type Color = string; diff --git a/src/styles/addOutlineWidth/index.native.ts b/src/styles/utils/addOutlineWidth/index.native.ts similarity index 100% rename from src/styles/addOutlineWidth/index.native.ts rename to src/styles/utils/addOutlineWidth/index.native.ts diff --git a/src/styles/addOutlineWidth/index.ts b/src/styles/utils/addOutlineWidth/index.ts similarity index 100% rename from src/styles/addOutlineWidth/index.ts rename to src/styles/utils/addOutlineWidth/index.ts diff --git a/src/styles/addOutlineWidth/types.ts b/src/styles/utils/addOutlineWidth/types.ts similarity index 76% rename from src/styles/addOutlineWidth/types.ts rename to src/styles/utils/addOutlineWidth/types.ts index 91e3f7409259..f6b9be63893c 100644 --- a/src/styles/addOutlineWidth/types.ts +++ b/src/styles/utils/addOutlineWidth/types.ts @@ -1,5 +1,5 @@ import {TextStyle} from 'react-native'; -import {type ThemeColors} from '@styles/themes/types'; +import {type ThemeColors} from '@styles/theme/types'; type AddOutlineWidth = (theme: ThemeColors, obj: TextStyle, val?: number, hasError?: boolean) => TextStyle; diff --git a/src/styles/utilities/borders.ts b/src/styles/utils/borders.ts similarity index 100% rename from src/styles/utilities/borders.ts rename to src/styles/utils/borders.ts diff --git a/src/styles/cardStyles/index.native.ts b/src/styles/utils/cardStyles/index.native.ts similarity index 100% rename from src/styles/cardStyles/index.native.ts rename to src/styles/utils/cardStyles/index.native.ts diff --git a/src/styles/cardStyles/index.ts b/src/styles/utils/cardStyles/index.ts similarity index 81% rename from src/styles/cardStyles/index.ts rename to src/styles/utils/cardStyles/index.ts index b5d3c069b73a..77a00695d20a 100644 --- a/src/styles/cardStyles/index.ts +++ b/src/styles/utils/cardStyles/index.ts @@ -1,4 +1,4 @@ -import positioning from '@styles/utilities/positioning'; +import positioning from '@styles/utils/positioning'; import GetCardStyles from './types'; /** diff --git a/src/styles/cardStyles/types.ts b/src/styles/utils/cardStyles/types.ts similarity index 100% rename from src/styles/cardStyles/types.ts rename to src/styles/utils/cardStyles/types.ts diff --git a/src/styles/codeStyles/index.android.ts b/src/styles/utils/codeStyles/index.android.ts similarity index 100% rename from src/styles/codeStyles/index.android.ts rename to src/styles/utils/codeStyles/index.android.ts diff --git a/src/styles/codeStyles/index.ios.ts b/src/styles/utils/codeStyles/index.ios.ts similarity index 100% rename from src/styles/codeStyles/index.ios.ts rename to src/styles/utils/codeStyles/index.ios.ts diff --git a/src/styles/codeStyles/index.ts b/src/styles/utils/codeStyles/index.ts similarity index 100% rename from src/styles/codeStyles/index.ts rename to src/styles/utils/codeStyles/index.ts diff --git a/src/styles/codeStyles/types.ts b/src/styles/utils/codeStyles/types.ts similarity index 100% rename from src/styles/codeStyles/types.ts rename to src/styles/utils/codeStyles/types.ts diff --git a/src/styles/containerComposeStyles/index.native.ts b/src/styles/utils/containerComposeStyles/index.native.ts similarity index 100% rename from src/styles/containerComposeStyles/index.native.ts rename to src/styles/utils/containerComposeStyles/index.native.ts diff --git a/src/styles/containerComposeStyles/index.ts b/src/styles/utils/containerComposeStyles/index.ts similarity index 100% rename from src/styles/containerComposeStyles/index.ts rename to src/styles/utils/containerComposeStyles/index.ts diff --git a/src/styles/containerComposeStyles/types.ts b/src/styles/utils/containerComposeStyles/types.ts similarity index 75% rename from src/styles/containerComposeStyles/types.ts rename to src/styles/utils/containerComposeStyles/types.ts index 9930e0230016..2b2d23b7f8c1 100644 --- a/src/styles/containerComposeStyles/types.ts +++ b/src/styles/utils/containerComposeStyles/types.ts @@ -1,5 +1,5 @@ import {ViewStyle} from 'react-native'; -import {type ThemeStyles} from '@styles/styles'; +import {type ThemeStyles} from '@styles/index'; type ContainerComposeStyles = (styles: ThemeStyles) => ViewStyle[]; diff --git a/src/styles/utilities/cursor/index.native.ts b/src/styles/utils/cursor/index.native.ts similarity index 100% rename from src/styles/utilities/cursor/index.native.ts rename to src/styles/utils/cursor/index.native.ts diff --git a/src/styles/utilities/cursor/index.ts b/src/styles/utils/cursor/index.ts similarity index 100% rename from src/styles/utilities/cursor/index.ts rename to src/styles/utils/cursor/index.ts diff --git a/src/styles/utilities/cursor/types.ts b/src/styles/utils/cursor/types.ts similarity index 100% rename from src/styles/utilities/cursor/types.ts rename to src/styles/utils/cursor/types.ts diff --git a/src/styles/utilities/display.ts b/src/styles/utils/display.ts similarity index 100% rename from src/styles/utilities/display.ts rename to src/styles/utils/display.ts diff --git a/src/styles/editedLabelStyles/index.native.ts b/src/styles/utils/editedLabelStyles/index.native.ts similarity index 100% rename from src/styles/editedLabelStyles/index.native.ts rename to src/styles/utils/editedLabelStyles/index.native.ts diff --git a/src/styles/editedLabelStyles/index.ts b/src/styles/utils/editedLabelStyles/index.ts similarity index 67% rename from src/styles/editedLabelStyles/index.ts rename to src/styles/utils/editedLabelStyles/index.ts index 339c50d8a4df..427918af1202 100644 --- a/src/styles/editedLabelStyles/index.ts +++ b/src/styles/utils/editedLabelStyles/index.ts @@ -1,5 +1,5 @@ -import display from '@styles/utilities/display'; -import flex from '@styles/utilities/flex'; +import display from '@styles/utils/display'; +import flex from '@styles/utils/flex'; import EditedLabelStyles from './types'; const editedLabelStyles: EditedLabelStyles = { diff --git a/src/styles/editedLabelStyles/types.ts b/src/styles/utils/editedLabelStyles/types.ts similarity index 100% rename from src/styles/editedLabelStyles/types.ts rename to src/styles/utils/editedLabelStyles/types.ts diff --git a/src/styles/utilities/flex.ts b/src/styles/utils/flex.ts similarity index 100% rename from src/styles/utilities/flex.ts rename to src/styles/utils/flex.ts diff --git a/src/styles/fontFamily/bold/index.android.ts b/src/styles/utils/fontFamily/bold/index.android.ts similarity index 100% rename from src/styles/fontFamily/bold/index.android.ts rename to src/styles/utils/fontFamily/bold/index.android.ts diff --git a/src/styles/fontFamily/bold/index.ios.ts b/src/styles/utils/fontFamily/bold/index.ios.ts similarity index 100% rename from src/styles/fontFamily/bold/index.ios.ts rename to src/styles/utils/fontFamily/bold/index.ios.ts diff --git a/src/styles/fontFamily/bold/index.ts b/src/styles/utils/fontFamily/bold/index.ts similarity index 100% rename from src/styles/fontFamily/bold/index.ts rename to src/styles/utils/fontFamily/bold/index.ts diff --git a/src/styles/fontFamily/bold/types.ts b/src/styles/utils/fontFamily/bold/types.ts similarity index 100% rename from src/styles/fontFamily/bold/types.ts rename to src/styles/utils/fontFamily/bold/types.ts diff --git a/src/styles/fontFamily/index.native.ts b/src/styles/utils/fontFamily/index.native.ts similarity index 100% rename from src/styles/fontFamily/index.native.ts rename to src/styles/utils/fontFamily/index.native.ts diff --git a/src/styles/fontFamily/index.ts b/src/styles/utils/fontFamily/index.ts similarity index 100% rename from src/styles/fontFamily/index.ts rename to src/styles/utils/fontFamily/index.ts diff --git a/src/styles/fontFamily/multiFontFamily.ts b/src/styles/utils/fontFamily/multiFontFamily.ts similarity index 100% rename from src/styles/fontFamily/multiFontFamily.ts rename to src/styles/utils/fontFamily/multiFontFamily.ts diff --git a/src/styles/fontFamily/singleFontFamily.ts b/src/styles/utils/fontFamily/singleFontFamily.ts similarity index 100% rename from src/styles/fontFamily/singleFontFamily.ts rename to src/styles/utils/fontFamily/singleFontFamily.ts diff --git a/src/styles/fontFamily/types.ts b/src/styles/utils/fontFamily/types.ts similarity index 100% rename from src/styles/fontFamily/types.ts rename to src/styles/utils/fontFamily/types.ts diff --git a/src/styles/fontWeight/bold/index.android.ts b/src/styles/utils/fontWeight/bold/index.android.ts similarity index 100% rename from src/styles/fontWeight/bold/index.android.ts rename to src/styles/utils/fontWeight/bold/index.android.ts diff --git a/src/styles/fontWeight/bold/index.ts b/src/styles/utils/fontWeight/bold/index.ts similarity index 100% rename from src/styles/fontWeight/bold/index.ts rename to src/styles/utils/fontWeight/bold/index.ts diff --git a/src/styles/fontWeight/bold/types.ts b/src/styles/utils/fontWeight/bold/types.ts similarity index 100% rename from src/styles/fontWeight/bold/types.ts rename to src/styles/utils/fontWeight/bold/types.ts diff --git a/src/styles/utils/ModalStyleUtils.ts b/src/styles/utils/generators/ModalStyleUtils.ts similarity index 95% rename from src/styles/utils/ModalStyleUtils.ts rename to src/styles/utils/generators/ModalStyleUtils.ts index cf312a4e76f7..67faec504d61 100644 --- a/src/styles/utils/ModalStyleUtils.ts +++ b/src/styles/utils/generators/ModalStyleUtils.ts @@ -1,10 +1,10 @@ import {ViewStyle} from 'react-native'; import {ModalProps} from 'react-native-modal'; import {ValueOf} from 'type-fest'; -import {type ThemeStyles} from '@styles/styles'; -import {type ThemeColors} from '@styles/themes/types'; +import {ThemeStyles} from '@styles/index'; import variables from '@styles/variables'; import CONST from '@src/CONST'; +import StyleUtilGenerator from './types'; function getCenteredModalStyles(styles: ThemeStyles, windowWidth: number, isSmallScreenWidth: boolean, isFullScreenWhenSmall = false): ViewStyle { const modalStyles = styles.centeredModalStyles(isSmallScreenWidth, isFullScreenWhenSmall); @@ -36,14 +36,18 @@ type GetModalStyles = { shouldAddTopSafeAreaPadding: boolean; }; -const createModalStyleUtils = (theme: ThemeColors, styles: ThemeStyles) => ({ +type GetModalStylesStyleUtil = { getModalStyles: ( type: ModalType | undefined, windowDimensions: WindowDimensions, - popoverAnchorPosition: ViewStyle = {}, - innerContainerStyle: ViewStyle = {}, - outerStyle: ViewStyle = {}, - ): GetModalStyles => { + popoverAnchorPosition?: ViewStyle, + innerContainerStyle?: ViewStyle, + outerStyle?: ViewStyle, + ) => GetModalStyles; +}; + +const createModalStyleUtils: StyleUtilGenerator = ({theme, styles}) => ({ + getModalStyles: (type, windowDimensions, popoverAnchorPosition = {}, innerContainerStyle = {}, outerStyle = {}): GetModalStyles => { const {isSmallScreenWidth, windowWidth} = windowDimensions; let modalStyle: GetModalStyles['modalStyle'] = { diff --git a/src/styles/utils/ReportActionContextMenuStyleUtils.ts b/src/styles/utils/generators/ReportActionContextMenuStyleUtils.ts similarity index 73% rename from src/styles/utils/ReportActionContextMenuStyleUtils.ts rename to src/styles/utils/generators/ReportActionContextMenuStyleUtils.ts index 9dd3c2a0d203..10904fca05cd 100644 --- a/src/styles/utils/ReportActionContextMenuStyleUtils.ts +++ b/src/styles/utils/generators/ReportActionContextMenuStyleUtils.ts @@ -1,7 +1,8 @@ import {ViewStyle} from 'react-native'; -import {type ThemeStyles} from '@styles/styles'; -import {type ThemeColors} from '@styles/themes/types'; +import {ThemeStyles} from '@styles/index'; +import {type ThemeColors} from '@styles/theme/types'; import variables from '@styles/variables'; +import StyleUtilGenerator from './types'; const getDefaultWrapperStyle = (theme: ThemeColors): ViewStyle => ({ backgroundColor: theme.componentBG, @@ -20,6 +21,8 @@ const getMiniWrapperStyle = (theme: ThemeColors, styles: ThemeStyles): ViewStyle }, ]; +type GetReportActionContextMenuStylesStyleUtil = {getReportActionContextMenuStyles: (isMini: boolean, isSmallScreenWidth: boolean) => ViewStyle[]}; + /** * Generate the wrapper styles for the ReportActionContextMenu. * @@ -27,8 +30,8 @@ const getMiniWrapperStyle = (theme: ThemeColors, styles: ThemeStyles): ViewStyle * @param isSmallScreenWidth * @param theme */ -const createReportActionContextMenuStyleUtils = (theme: ThemeColors, styles: ThemeStyles) => ({ - getReportActionContextMenuStyles: (isMini: boolean, isSmallScreenWidth: boolean): ViewStyle[] => { +const createReportActionContextMenuStyleUtils: StyleUtilGenerator = ({theme, styles}) => ({ + getReportActionContextMenuStyles: (isMini, isSmallScreenWidth) => { if (isMini) { return getMiniWrapperStyle(theme, styles); } diff --git a/src/styles/utils/TooltipStyleUtils.ts b/src/styles/utils/generators/TooltipStyleUtils.ts similarity index 96% rename from src/styles/utils/TooltipStyleUtils.ts rename to src/styles/utils/generators/TooltipStyleUtils.ts index 5c12a27ee981..0e9fda1a3388 100644 --- a/src/styles/utils/TooltipStyleUtils.ts +++ b/src/styles/utils/generators/TooltipStyleUtils.ts @@ -1,11 +1,10 @@ import {Animated, TextStyle, View, ViewStyle} from 'react-native'; -import fontFamily from '@styles/fontFamily'; -import {type ThemeStyles} from '@styles/styles'; -import {type ThemeColors} from '@styles/themes/types'; -import positioning from '@styles/utilities/positioning'; -import spacing from '@styles/utilities/spacing'; +import fontFamily from '@styles/utils/fontFamily'; +import positioning from '@styles/utils/positioning'; +import roundToNearestMultipleOfFour from '@styles/utils/roundToNearestMultipleOfFour'; +import spacing from '@styles/utils/spacing'; import variables from '@styles/variables'; -import roundToNearestMultipleOfFour from './roundToNearestMultipleOfFour'; +import StyleUtilGenerator from './types'; /** This defines the proximity with the edge of the window in which tooltips should not be displayed. * If a tooltip is too close to the edge of the screen, we'll shift it towards the center. */ @@ -116,6 +115,8 @@ type TooltipParams = { manualShiftVertical?: number; }; +type GetTooltipStylesStyleUtil = {getTooltipStyles: (props: TooltipParams) => TooltipStyles}; + /** * Generate styles for the tooltip component. * @@ -137,7 +138,7 @@ type TooltipParams = { * @param [manualShiftVertical] - Any additional amount to manually shift the tooltip up or down. * A positive value shifts it down, and a negative value shifts it up. */ -const createTooltipStyleUtils = (theme: ThemeColors, styles: ThemeStyles) => ({ +const createTooltipStyleUtils: StyleUtilGenerator = ({theme, styles}) => ({ getTooltipStyles: ({ tooltip, currentSize, @@ -151,7 +152,7 @@ const createTooltipStyleUtils = (theme: ThemeColors, styles: ThemeStyles) => ({ tooltipWrapperHeight, manualShiftHorizontal = 0, manualShiftVertical = 0, - }: TooltipParams): TooltipStyles => { + }) => { const tooltipVerticalPadding = spacing.pv1; // We calculate tooltip width based on the tooltip's content width diff --git a/src/styles/utils/generators/types.ts b/src/styles/utils/generators/types.ts new file mode 100644 index 000000000000..ca6a630d94c5 --- /dev/null +++ b/src/styles/utils/generators/types.ts @@ -0,0 +1,6 @@ +import {ThemeStyles} from '@styles/index'; +import {ThemeColors} from '@styles/theme/types'; + +type StyleUtilGenerator> = (props: {theme: ThemeColors; styles: ThemeStyles}) => StyleUtil; + +export default StyleUtilGenerator; diff --git a/src/styles/getContextMenuItemStyles/index.native.ts b/src/styles/utils/getContextMenuItemStyles/index.native.ts similarity index 100% rename from src/styles/getContextMenuItemStyles/index.native.ts rename to src/styles/utils/getContextMenuItemStyles/index.native.ts diff --git a/src/styles/getContextMenuItemStyles/index.ts b/src/styles/utils/getContextMenuItemStyles/index.ts similarity index 100% rename from src/styles/getContextMenuItemStyles/index.ts rename to src/styles/utils/getContextMenuItemStyles/index.ts diff --git a/src/styles/getContextMenuItemStyles/types.ts b/src/styles/utils/getContextMenuItemStyles/types.ts similarity index 77% rename from src/styles/getContextMenuItemStyles/types.ts rename to src/styles/utils/getContextMenuItemStyles/types.ts index 376fb8d46d7c..06b989becf8a 100644 --- a/src/styles/getContextMenuItemStyles/types.ts +++ b/src/styles/utils/getContextMenuItemStyles/types.ts @@ -1,5 +1,5 @@ import {ViewStyle} from 'react-native'; -import {type ThemeStyles} from '@styles/styles'; +import {type ThemeStyles} from '@styles/index'; type GetContextMenuItemStyle = (styles: ThemeStyles, windowWidth?: number) => ViewStyle[]; diff --git a/src/styles/getNavigationModalCardStyles/index.desktop.ts b/src/styles/utils/getNavigationModalCardStyles/index.desktop.ts similarity index 90% rename from src/styles/getNavigationModalCardStyles/index.desktop.ts rename to src/styles/utils/getNavigationModalCardStyles/index.desktop.ts index 9e182636ad76..523f82048a02 100644 --- a/src/styles/getNavigationModalCardStyles/index.desktop.ts +++ b/src/styles/utils/getNavigationModalCardStyles/index.desktop.ts @@ -1,4 +1,4 @@ -import positioning from '@styles/utilities/positioning'; +import positioning from '@styles/utils/positioning'; import GetNavigationModalCardStyles from './types'; const getNavigationModalCardStyles: GetNavigationModalCardStyles = () => ({ diff --git a/src/styles/getNavigationModalCardStyles/index.ts b/src/styles/utils/getNavigationModalCardStyles/index.ts similarity index 100% rename from src/styles/getNavigationModalCardStyles/index.ts rename to src/styles/utils/getNavigationModalCardStyles/index.ts diff --git a/src/styles/getNavigationModalCardStyles/index.website.ts b/src/styles/utils/getNavigationModalCardStyles/index.website.ts similarity index 90% rename from src/styles/getNavigationModalCardStyles/index.website.ts rename to src/styles/utils/getNavigationModalCardStyles/index.website.ts index 9e182636ad76..523f82048a02 100644 --- a/src/styles/getNavigationModalCardStyles/index.website.ts +++ b/src/styles/utils/getNavigationModalCardStyles/index.website.ts @@ -1,4 +1,4 @@ -import positioning from '@styles/utilities/positioning'; +import positioning from '@styles/utils/positioning'; import GetNavigationModalCardStyles from './types'; const getNavigationModalCardStyles: GetNavigationModalCardStyles = () => ({ diff --git a/src/styles/getNavigationModalCardStyles/types.ts b/src/styles/utils/getNavigationModalCardStyles/types.ts similarity index 100% rename from src/styles/getNavigationModalCardStyles/types.ts rename to src/styles/utils/getNavigationModalCardStyles/types.ts diff --git a/src/styles/getPopOverVerticalOffset/index.desktop.ts b/src/styles/utils/getPopOverVerticalOffset/index.desktop.ts similarity index 100% rename from src/styles/getPopOverVerticalOffset/index.desktop.ts rename to src/styles/utils/getPopOverVerticalOffset/index.desktop.ts diff --git a/src/styles/getPopOverVerticalOffset/index.ts b/src/styles/utils/getPopOverVerticalOffset/index.ts similarity index 100% rename from src/styles/getPopOverVerticalOffset/index.ts rename to src/styles/utils/getPopOverVerticalOffset/index.ts diff --git a/src/styles/getPopOverVerticalOffset/types.ts b/src/styles/utils/getPopOverVerticalOffset/types.ts similarity index 100% rename from src/styles/getPopOverVerticalOffset/types.ts rename to src/styles/utils/getPopOverVerticalOffset/types.ts diff --git a/src/styles/utils/index.ts b/src/styles/utils/index.ts index 59bba2073a0c..c392e61f0814 100644 --- a/src/styles/utils/index.ts +++ b/src/styles/utils/index.ts @@ -1,65 +1,38 @@ import {CSSProperties} from 'react'; -import {Animated, DimensionValue, ImageStyle, PressableStateCallbackType, StyleProp, TextStyle, ViewStyle} from 'react-native'; +import {Animated, DimensionValue, PressableStateCallbackType, StyleProp, TextStyle, ViewStyle} from 'react-native'; import {EdgeInsets} from 'react-native-safe-area-context'; import {ValueOf} from 'type-fest'; import * as Browser from '@libs/Browser'; import * as UserUtils from '@libs/UserUtils'; -import colors from '@styles/colors'; -import containerComposeStyles from '@styles/containerComposeStyles'; -import fontFamily from '@styles/fontFamily'; -import getContextMenuItemStyles from '@styles/getContextMenuItemStyles'; -import {compactContentContainerStyles} from '@styles/optionRowStyles'; -import {defaultStyles, type ThemeStyles} from '@styles/styles'; -import {defaultTheme} from '@styles/themes/themes'; -import {ThemeColors} from '@styles/themes/types'; -import cursor from '@styles/utilities/cursor'; -import positioning from '@styles/utilities/positioning'; -import spacing from '@styles/utilities/spacing'; +import {defaultTheme} from '@styles/theme'; +import colors from '@styles/theme/colors'; +import {ThemeColors} from '@styles/theme/types'; import variables from '@styles/variables'; import CONST from '@src/CONST'; import {Transaction} from '@src/types/onyx'; -import createModalStyleUtils from './ModalStyleUtils'; -import createReportActionContextMenuStyleUtils from './ReportActionContextMenuStyleUtils'; -import createTooltipStyleUtils from './TooltipStyleUtils'; - -type AllStyles = ViewStyle | TextStyle | ImageStyle; -type ParsableStyle = StyleProp | ((state: PressableStateCallbackType) => StyleProp); - -type ColorValue = ValueOf; -type AvatarSizeName = ValueOf; -type EReceiptColorName = ValueOf; -type AvatarSizeValue = ValueOf< - Pick< - typeof variables, - | 'avatarSizeNormal' - | 'avatarSizeSmallSubscript' - | 'avatarSizeMidSubscript' - | 'avatarSizeSubscript' - | 'avatarSizeSmall' - | 'avatarSizeSmaller' - | 'avatarSizeXLarge' - | 'avatarSizeLarge' - | 'avatarSizeMedium' - | 'avatarSizeLargeBordered' - | 'avatarSizeHeader' - | 'avatarSizeMentionIcon' - | 'avatarSizeSmallNormal' - > ->; - -type AvatarStyle = { - width: number; - height: number; - borderRadius: number; - backgroundColor: string; -}; - -type ButtonSizeValue = ValueOf; -type ButtonStateName = ValueOf; -type AvatarSize = {width: number}; - -type WorkspaceColorStyle = {backgroundColor: ColorValue; fill: ColorValue}; -type EreceiptColorStyle = {backgroundColor: ColorValue; color: ColorValue}; +import {defaultStyles, type ThemeStyles} from '..'; +import containerComposeStyles from './containerComposeStyles'; +import fontFamily from './fontFamily'; +import createModalStyleUtils from './generators/ModalStyleUtils'; +import createReportActionContextMenuStyleUtils from './generators/ReportActionContextMenuStyleUtils'; +import createTooltipStyleUtils from './generators/TooltipStyleUtils'; +import getContextMenuItemStyles from './getContextMenuItemStyles'; +import {compactContentContainerStyles} from './optionRowStyles'; +import positioning from './positioning'; +import spacing from './spacing'; +import { + AllStyles, + AvatarSize, + AvatarSizeName, + AvatarSizeValue, + AvatarStyle, + ButtonSizeValue, + ButtonStateName, + EReceiptColorName, + EreceiptColorStyle, + ParsableStyle, + WorkspaceColorStyle, +} from './types'; const workspaceColorOptions: WorkspaceColorStyle[] = [ {backgroundColor: colors.blue200, fill: colors.blue700}, @@ -1103,9 +1076,13 @@ const staticStyleUtils = { const createStyleUtils = (theme: ThemeColors, styles: ThemeStyles) => ({ ...staticStyleUtils, - ...createModalStyleUtils(theme, styles), - ...createTooltipStyleUtils(theme, styles), - ...createReportActionContextMenuStyleUtils(theme, styles), + ...createModalStyleUtils({theme, styles}), + ...createTooltipStyleUtils({theme, styles}), + ...createReportActionContextMenuStyleUtils({theme, styles}), + + getCompactContentContainerStyles: () => compactContentContainerStyles(styles), + getContextMenuItemStyles: (windowWidth?: number) => getContextMenuItemStyles(styles, windowWidth), + getContainerComposeStyles: () => containerComposeStyles(styles), /** * Gets styles for AutoCompleteSuggestion row @@ -1236,7 +1213,7 @@ const createStyleUtils = (theme: ThemeColors, styles: ThemeStyles) => ({ getDisabledLinkStyles: (isDisabled = false): ViewStyle => { const disabledLinkStyles = { color: theme.textSupporting, - ...cursor.cursorDisabled, + ...styles.cursorDisabled, }; // TODO: Remove this "eslint-disable-next" once the theme switching migration is done and styles are fully typed (GH Issue: https://github.com/Expensify/App/issues/27337) @@ -1453,12 +1430,6 @@ const createStyleUtils = (theme: ThemeColors, styles: ThemeStyles) => ({ return containerStyles; }, - - getCompactContentContainerStyles: () => compactContentContainerStyles(styles), - - getContextMenuItemStyles: (windowWidth?: number) => getContextMenuItemStyles(styles, windowWidth), - - getContainerComposeStyles: () => containerComposeStyles(styles), }); type StyleUtilsType = ReturnType; diff --git a/src/styles/italic/index.android.ts b/src/styles/utils/italic/index.android.ts similarity index 100% rename from src/styles/italic/index.android.ts rename to src/styles/utils/italic/index.android.ts diff --git a/src/styles/italic/index.ts b/src/styles/utils/italic/index.ts similarity index 100% rename from src/styles/italic/index.ts rename to src/styles/utils/italic/index.ts diff --git a/src/styles/italic/types.ts b/src/styles/utils/italic/types.ts similarity index 100% rename from src/styles/italic/types.ts rename to src/styles/utils/italic/types.ts diff --git a/src/styles/utilities/objectFit.ts b/src/styles/utils/objectFit.ts similarity index 100% rename from src/styles/utilities/objectFit.ts rename to src/styles/utils/objectFit.ts diff --git a/src/styles/optionAlternateTextPlatformStyles/index.ios.ts b/src/styles/utils/optionAlternateTextPlatformStyles/index.ios.ts similarity index 100% rename from src/styles/optionAlternateTextPlatformStyles/index.ios.ts rename to src/styles/utils/optionAlternateTextPlatformStyles/index.ios.ts diff --git a/src/styles/optionAlternateTextPlatformStyles/index.ts b/src/styles/utils/optionAlternateTextPlatformStyles/index.ts similarity index 100% rename from src/styles/optionAlternateTextPlatformStyles/index.ts rename to src/styles/utils/optionAlternateTextPlatformStyles/index.ts diff --git a/src/styles/optionAlternateTextPlatformStyles/types.ts b/src/styles/utils/optionAlternateTextPlatformStyles/types.ts similarity index 100% rename from src/styles/optionAlternateTextPlatformStyles/types.ts rename to src/styles/utils/optionAlternateTextPlatformStyles/types.ts diff --git a/src/styles/optionRowStyles/index.native.ts b/src/styles/utils/optionRowStyles/index.native.ts similarity index 100% rename from src/styles/optionRowStyles/index.native.ts rename to src/styles/utils/optionRowStyles/index.native.ts diff --git a/src/styles/optionRowStyles/index.ts b/src/styles/utils/optionRowStyles/index.ts similarity index 100% rename from src/styles/optionRowStyles/index.ts rename to src/styles/utils/optionRowStyles/index.ts diff --git a/src/styles/optionRowStyles/types.ts b/src/styles/utils/optionRowStyles/types.ts similarity index 76% rename from src/styles/optionRowStyles/types.ts rename to src/styles/utils/optionRowStyles/types.ts index 3425d7812be2..a31b94e0fc79 100644 --- a/src/styles/optionRowStyles/types.ts +++ b/src/styles/utils/optionRowStyles/types.ts @@ -1,5 +1,5 @@ import {ViewStyle} from 'react-native'; -import {type ThemeStyles} from '@styles/styles'; +import {type ThemeStyles} from '@styles/index'; type CompactContentContainerStyles = (styles: ThemeStyles) => ViewStyle; diff --git a/src/styles/utilities/overflow.ts b/src/styles/utils/overflow.ts similarity index 100% rename from src/styles/utilities/overflow.ts rename to src/styles/utils/overflow.ts diff --git a/src/styles/utilities/overflowAuto/index.native.ts b/src/styles/utils/overflowAuto/index.native.ts similarity index 100% rename from src/styles/utilities/overflowAuto/index.native.ts rename to src/styles/utils/overflowAuto/index.native.ts diff --git a/src/styles/utilities/overflowAuto/index.ts b/src/styles/utils/overflowAuto/index.ts similarity index 100% rename from src/styles/utilities/overflowAuto/index.ts rename to src/styles/utils/overflowAuto/index.ts diff --git a/src/styles/utilities/overflowAuto/types.ts b/src/styles/utils/overflowAuto/types.ts similarity index 100% rename from src/styles/utilities/overflowAuto/types.ts rename to src/styles/utils/overflowAuto/types.ts diff --git a/src/styles/overflowXHidden/index.native.ts b/src/styles/utils/overflowXHidden/index.native.ts similarity index 100% rename from src/styles/overflowXHidden/index.native.ts rename to src/styles/utils/overflowXHidden/index.native.ts diff --git a/src/styles/overflowXHidden/index.ts b/src/styles/utils/overflowXHidden/index.ts similarity index 100% rename from src/styles/overflowXHidden/index.ts rename to src/styles/utils/overflowXHidden/index.ts diff --git a/src/styles/overflowXHidden/types.ts b/src/styles/utils/overflowXHidden/types.ts similarity index 100% rename from src/styles/overflowXHidden/types.ts rename to src/styles/utils/overflowXHidden/types.ts diff --git a/src/styles/utilities/overscrollBehaviorContain/index.native.ts b/src/styles/utils/overscrollBehaviorContain/index.native.ts similarity index 100% rename from src/styles/utilities/overscrollBehaviorContain/index.native.ts rename to src/styles/utils/overscrollBehaviorContain/index.native.ts diff --git a/src/styles/utilities/overscrollBehaviorContain/index.ts b/src/styles/utils/overscrollBehaviorContain/index.ts similarity index 100% rename from src/styles/utilities/overscrollBehaviorContain/index.ts rename to src/styles/utils/overscrollBehaviorContain/index.ts diff --git a/src/styles/utilities/overscrollBehaviorContain/types.ts b/src/styles/utils/overscrollBehaviorContain/types.ts similarity index 100% rename from src/styles/utilities/overscrollBehaviorContain/types.ts rename to src/styles/utils/overscrollBehaviorContain/types.ts diff --git a/src/styles/pointerEventsAuto/index.native.ts b/src/styles/utils/pointerEventsAuto/index.native.ts similarity index 100% rename from src/styles/pointerEventsAuto/index.native.ts rename to src/styles/utils/pointerEventsAuto/index.native.ts diff --git a/src/styles/pointerEventsAuto/index.ts b/src/styles/utils/pointerEventsAuto/index.ts similarity index 100% rename from src/styles/pointerEventsAuto/index.ts rename to src/styles/utils/pointerEventsAuto/index.ts diff --git a/src/styles/pointerEventsAuto/types.ts b/src/styles/utils/pointerEventsAuto/types.ts similarity index 100% rename from src/styles/pointerEventsAuto/types.ts rename to src/styles/utils/pointerEventsAuto/types.ts diff --git a/src/styles/pointerEventsBoxNone/index.native.ts b/src/styles/utils/pointerEventsBoxNone/index.native.ts similarity index 100% rename from src/styles/pointerEventsBoxNone/index.native.ts rename to src/styles/utils/pointerEventsBoxNone/index.native.ts diff --git a/src/styles/pointerEventsBoxNone/index.ts b/src/styles/utils/pointerEventsBoxNone/index.ts similarity index 100% rename from src/styles/pointerEventsBoxNone/index.ts rename to src/styles/utils/pointerEventsBoxNone/index.ts diff --git a/src/styles/pointerEventsBoxNone/types.ts b/src/styles/utils/pointerEventsBoxNone/types.ts similarity index 100% rename from src/styles/pointerEventsBoxNone/types.ts rename to src/styles/utils/pointerEventsBoxNone/types.ts diff --git a/src/styles/pointerEventsNone/index.native.ts b/src/styles/utils/pointerEventsNone/index.native.ts similarity index 100% rename from src/styles/pointerEventsNone/index.native.ts rename to src/styles/utils/pointerEventsNone/index.native.ts diff --git a/src/styles/pointerEventsNone/index.ts b/src/styles/utils/pointerEventsNone/index.ts similarity index 100% rename from src/styles/pointerEventsNone/index.ts rename to src/styles/utils/pointerEventsNone/index.ts diff --git a/src/styles/pointerEventsNone/types.ts b/src/styles/utils/pointerEventsNone/types.ts similarity index 100% rename from src/styles/pointerEventsNone/types.ts rename to src/styles/utils/pointerEventsNone/types.ts diff --git a/src/styles/utilities/positioning.ts b/src/styles/utils/positioning.ts similarity index 100% rename from src/styles/utilities/positioning.ts rename to src/styles/utils/positioning.ts diff --git a/src/styles/utilities/sizing.ts b/src/styles/utils/sizing.ts similarity index 100% rename from src/styles/utilities/sizing.ts rename to src/styles/utils/sizing.ts diff --git a/src/styles/utilities/spacing.ts b/src/styles/utils/spacing.ts similarity index 100% rename from src/styles/utilities/spacing.ts rename to src/styles/utils/spacing.ts diff --git a/src/styles/utilities/textDecorationLine.ts b/src/styles/utils/textDecorationLine.ts similarity index 100% rename from src/styles/utilities/textDecorationLine.ts rename to src/styles/utils/textDecorationLine.ts diff --git a/src/styles/utilities/textUnderline/index.native.ts b/src/styles/utils/textUnderline/index.native.ts similarity index 100% rename from src/styles/utilities/textUnderline/index.native.ts rename to src/styles/utils/textUnderline/index.native.ts diff --git a/src/styles/utilities/textUnderline/index.ts b/src/styles/utils/textUnderline/index.ts similarity index 100% rename from src/styles/utilities/textUnderline/index.ts rename to src/styles/utils/textUnderline/index.ts diff --git a/src/styles/utilities/textUnderline/types.ts b/src/styles/utils/textUnderline/types.ts similarity index 100% rename from src/styles/utilities/textUnderline/types.ts rename to src/styles/utils/textUnderline/types.ts diff --git a/src/styles/utils/types.ts b/src/styles/utils/types.ts new file mode 100644 index 000000000000..c7e1fc60a142 --- /dev/null +++ b/src/styles/utils/types.ts @@ -0,0 +1,59 @@ +import {ImageStyle, PressableStateCallbackType, StyleProp, TextStyle, ViewStyle} from 'react-native'; +import {ValueOf} from 'type-fest'; +import type colors from '@styles/theme/colors'; +import type variables from '@styles/variables'; +import type CONST from '@src/CONST'; + +type AllStyles = ViewStyle | TextStyle | ImageStyle; +type ParsableStyle = StyleProp | ((state: PressableStateCallbackType) => StyleProp); + +type ColorValue = ValueOf; +type AvatarSizeName = ValueOf; +type EReceiptColorName = ValueOf; +type AvatarSizeValue = ValueOf< + Pick< + typeof variables, + | 'avatarSizeNormal' + | 'avatarSizeSmallSubscript' + | 'avatarSizeMidSubscript' + | 'avatarSizeSubscript' + | 'avatarSizeSmall' + | 'avatarSizeSmaller' + | 'avatarSizeXLarge' + | 'avatarSizeLarge' + | 'avatarSizeMedium' + | 'avatarSizeLargeBordered' + | 'avatarSizeHeader' + | 'avatarSizeMentionIcon' + | 'avatarSizeSmallNormal' + > +>; + +type AvatarStyle = { + width: number; + height: number; + borderRadius: number; + backgroundColor: string; +}; + +type ButtonSizeValue = ValueOf; +type ButtonStateName = ValueOf; +type AvatarSize = {width: number}; + +type WorkspaceColorStyle = {backgroundColor: ColorValue; fill: ColorValue}; +type EreceiptColorStyle = {backgroundColor: ColorValue; color: ColorValue}; + +export type { + AllStyles, + ParsableStyle, + ColorValue, + AvatarSizeName, + EReceiptColorName, + AvatarSizeValue, + AvatarStyle, + ButtonSizeValue, + ButtonStateName, + AvatarSize, + WorkspaceColorStyle, + EreceiptColorStyle, +}; diff --git a/src/styles/utilities/userSelect/index.native.ts b/src/styles/utils/userSelect/index.native.ts similarity index 100% rename from src/styles/utilities/userSelect/index.native.ts rename to src/styles/utils/userSelect/index.native.ts diff --git a/src/styles/utilities/userSelect/index.ts b/src/styles/utils/userSelect/index.ts similarity index 100% rename from src/styles/utilities/userSelect/index.ts rename to src/styles/utils/userSelect/index.ts diff --git a/src/styles/utilities/userSelect/types.ts b/src/styles/utils/userSelect/types.ts similarity index 100% rename from src/styles/utilities/userSelect/types.ts rename to src/styles/utils/userSelect/types.ts diff --git a/src/styles/utilities/visibility/index.native.ts b/src/styles/utils/visibility/index.native.ts similarity index 100% rename from src/styles/utilities/visibility/index.native.ts rename to src/styles/utils/visibility/index.native.ts diff --git a/src/styles/utilities/visibility/index.ts b/src/styles/utils/visibility/index.ts similarity index 100% rename from src/styles/utilities/visibility/index.ts rename to src/styles/utils/visibility/index.ts diff --git a/src/styles/utilities/visibility/types.ts b/src/styles/utils/visibility/types.ts similarity index 100% rename from src/styles/utilities/visibility/types.ts rename to src/styles/utils/visibility/types.ts diff --git a/src/styles/utilities/whiteSpace/index.native.ts b/src/styles/utils/whiteSpace/index.native.ts similarity index 100% rename from src/styles/utilities/whiteSpace/index.native.ts rename to src/styles/utils/whiteSpace/index.native.ts diff --git a/src/styles/utilities/whiteSpace/index.ts b/src/styles/utils/whiteSpace/index.ts similarity index 100% rename from src/styles/utilities/whiteSpace/index.ts rename to src/styles/utils/whiteSpace/index.ts diff --git a/src/styles/utilities/whiteSpace/types.ts b/src/styles/utils/whiteSpace/types.ts similarity index 100% rename from src/styles/utilities/whiteSpace/types.ts rename to src/styles/utils/whiteSpace/types.ts diff --git a/src/styles/utilities/wordBreak/index.native.ts b/src/styles/utils/wordBreak/index.native.ts similarity index 100% rename from src/styles/utilities/wordBreak/index.native.ts rename to src/styles/utils/wordBreak/index.native.ts diff --git a/src/styles/utilities/wordBreak/index.ts b/src/styles/utils/wordBreak/index.ts similarity index 100% rename from src/styles/utilities/wordBreak/index.ts rename to src/styles/utils/wordBreak/index.ts diff --git a/src/styles/utilities/wordBreak/types.ts b/src/styles/utils/wordBreak/types.ts similarity index 100% rename from src/styles/utilities/wordBreak/types.ts rename to src/styles/utils/wordBreak/types.ts diff --git a/src/styles/utilities/writingDirection.ts b/src/styles/utils/writingDirection.ts similarity index 100% rename from src/styles/utilities/writingDirection.ts rename to src/styles/utils/writingDirection.ts diff --git a/tests/ui/UnreadIndicatorsTest.js b/tests/ui/UnreadIndicatorsTest.js index ed44d3088ae0..93bb2cb94d30 100644 --- a/tests/ui/UnreadIndicatorsTest.js +++ b/tests/ui/UnreadIndicatorsTest.js @@ -20,7 +20,7 @@ import * as Pusher from '../../src/libs/Pusher/pusher'; import PusherConnectionManager from '../../src/libs/PusherConnectionManager'; import ONYXKEYS from '../../src/ONYXKEYS'; import appSetup from '../../src/setup'; -import fontWeightBold from '../../src/styles/fontWeight/bold'; +import fontWeightBold from '../../src/styles/utils/fontWeight/bold'; import * as TestHelper from '../utils/TestHelper'; import waitForBatchedUpdates from '../utils/waitForBatchedUpdates'; import waitForBatchedUpdatesWithAct from '../utils/waitForBatchedUpdatesWithAct';