chore: move formatters file (#36267)

## **Description**

Rename file and moved to the more appropriate hooks folder

[![Open in GitHub
Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/MetaMask/metamask-extension/pull/36267?quickstart=1)

## **Changelog**

CHANGELOG entry: Renamed formatters to useFormatters

## **Related issues**

Fixes:

## **Manual testing steps**

CI green

## **Screenshots/Recordings**

<!-- If applicable, add screenshots and/or recordings to visualize the
before and after of your change. -->

### **Before**

<!-- [screenshots/recordings] -->

### **After**

<!-- [screenshots/recordings] -->

## **Pre-merge author checklist**

- [ ] I've followed [MetaMask Contributor
Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask
Extension Coding
Standards](https://github.com/MetaMask/metamask-extension/blob/main/.github/guidelines/CODING_GUIDELINES.md).
- [ ] I've completed the PR template to the best of my ability
- [ ] I’ve included tests if applicable
- [ ] I’ve documented my code using [JSDoc](https://jsdoc.app/) format
if applicable
- [ ] I’ve applied the right labels on the PR (see [labeling
guidelines](https://github.com/MetaMask/metamask-extension/blob/main/.github/guidelines/LABELING_GUIDELINES.md)).
Not required for external contributors.

## **Pre-merge reviewer checklist**

- [ ] I've manually tested the PR (e.g. pull and build branch, run the
app, test code being changed).
- [ ] I confirm that this PR addresses all acceptance criteria described
in the ticket it closes and includes the necessary testing evidence such
as recordings and or screenshots.

Author: n3ps

ui/components/app/assets/account-group-balance-change/account-group-balance-change.tsx

@@ -5,7 +5,7 @@ import {
   Display,
   TextVariant,
 } from '../../../../helpers/constants/design-system';
-import { useFormatters } from '../../../../helpers/formatters';
+import { useFormatters } from '../../../../hooks/useFormatters';
 import { getCurrentCurrency } from '../../../../ducks/metamask/metamask';
 import { getIsMultichainAccountsState2Enabled } from '../../../../selectors';
 import { Box, SensitiveText } from '../../../component-library';

ui/components/app/assets/account-group-balance/account-group-balance.tsx

@@ -20,7 +20,7 @@ import {
 } from '../../../component-library';
 import { getPreferences } from '../../../../selectors';
 import Spinner from '../../../ui/spinner';
-import { useFormatters } from '../../../../helpers/formatters';
+import { useFormatters } from '../../../../hooks/useFormatters';
 import { getCurrentCurrency } from '../../../../ducks/metamask/metamask';
 import { useI18nContext } from '../../../../hooks/useI18nContext';
 

ui/components/app/assets/defi-list/defi-list.tsx

@@ -19,7 +19,7 @@ import PulseLoader from '../../../ui/pulse-loader';
 import { Box } from '../../../component-library';
 import { useI18nContext } from '../../../../hooks/useI18nContext';
 
-import { useFormatters } from '../../../../helpers/formatters';
+import { useFormatters } from '../../../../hooks/useFormatters';
 import { extractUniqueIconAndSymbols } from '../util/extractIconAndSymbol';
 import { getDefiPositions } from '../../../../selectors/assets';
 import { DeFiProtocolPosition } from '../types';

ui/components/app/assets/hooks/useTokenDisplayInfo.tsx

@@ -19,7 +19,7 @@ import { formatWithThreshold } from '../util/formatWithThreshold';
 import { getIntlLocale } from '../../../../ducks/locale/locale';
 import { getCurrentCurrency } from '../../../../ducks/metamask/metamask';
 import { useMultichainSelector } from '../../../../hooks/useMultichainSelector';
-import { useFormatters } from '../../../../helpers/formatters';
+import { useFormatters } from '../../../../hooks/useFormatters';
 import { isEvmChainId } from '../../../../../shared/lib/asset-utils';
 import { getInternalAccountBySelectedAccountGroupAndCaip } from '../../../../selectors/multichain-accounts/account-tree';
 

ui/components/app/wallet-overview/aggregated-percentage-overview-cross-chains.tsx

@@ -16,7 +16,7 @@ import { getCurrentCurrency } from '../../../ducks/metamask/metamask';
 // TODO: Remove restricted import
 // eslint-disable-next-line import/no-restricted-paths
 import { formatValue, isValidAmount } from '../../../../app/scripts/lib/util';
-import { useFormatters } from '../../../helpers/formatters';
+import { useFormatters } from '../../../hooks/useFormatters';
 import {
   Display,
   TextColor,

ui/components/app/wallet-overview/aggregated-percentage-overview.tsx

@@ -25,7 +25,7 @@ import { Box, SensitiveText } from '../../component-library';
 import { getCalculatedTokenAmount1dAgo } from '../../../helpers/utils/util';
 import { getHistoricalMultichainAggregatedBalance } from '../../../selectors/assets';
 import { formatWithThreshold } from '../assets/util/formatWithThreshold';
-import { useFormatters } from '../../../helpers/formatters';
+import { useFormatters } from '../../../hooks/useFormatters';
 
 // core already has this exported type but its not yet available in this version
 // todo remove this and use core type once available

ui/components/multichain/token-list-item/price/percentage-and-amount-change/percentage-and-amount-change.tsx

@@ -14,7 +14,7 @@ import {
   getSelectedAccountCachedBalance,
   getTokensMarketData,
 } from '../../../../../selectors';
-import { useFormatters } from '../../../../../helpers/formatters';
+import { useFormatters } from '../../../../../hooks/useFormatters';
 import { EtherDenomination } from '../../../../../../shared/constants/common';
 import { Numeric } from '../../../../../../shared/modules/Numeric';
 import {

ui/hooks/useCurrencyDisplay.js

@@ -18,7 +18,7 @@ import { Numeric } from '../../shared/modules/Numeric';
 import { EtherDenomination } from '../../shared/constants/common';
 import { getTokenFiatAmount } from '../helpers/utils/token-util';
 import { getCurrencyRates } from '../ducks/metamask/metamask';
-import { useFormatters } from '../helpers/formatters';
+import { useFormatters } from './useFormatters';
 import { useMultichainSelector } from './useMultichainSelector';
 
 // The smallest non-zero amount that can be displayed.

ui/helpers/formatters.ts renamed to ui/hooks/useFormatters.ts

@@ -9,7 +9,7 @@ import {
 } from '../../../../helpers/constants/design-system';
 import { Box, Text } from '../../../../components/component-library';
 import { loadingOpacity, getShortDateFormatter } from '../../util';
-import { useFormatters } from '../../../../helpers/formatters';
+import { useFormatters } from '../../../../hooks/useFormatters';
 import { Skeleton } from '../../../../components/component-library/skeleton';
 import { TokenCellPercentChange } from '../../../../components/app/assets/token-cell/cells';
 import { TokenFiatDisplayInfo } from '../../../../components/app/assets/types';