chore: remove react and react-i18next from peer deps of utils

apps/explorer/src/app/routes/network-parameters/network-parameters.tsx

@@ -10,7 +10,7 @@ import {
   addDecimalsFormatNumber,
   formatNumber,
   removePaginationWrapper,
-  suitableForSyntaxHighlighter,
+  validForSyntaxHighlighter,
 } from '@vegaprotocol/utils';
 import { t } from '@vegaprotocol/i18n';
 import { RouteTitle } from '../../components/route-title';
@@ -134,7 +134,7 @@ export const NetworkParameterRow = ({
 }: {
   row: { key: string; value: string };
 }) => {
-  const isSyntaxRow = suitableForSyntaxHighlighter(value);
+  const isSyntaxRow = validForSyntaxHighlighter(value);
   useDocumentTitle(['Network Parameters']);
 
   return (

apps/governance/src/routes/proposals/propose/network-parameter/propose-network-parameter.tsx

@@ -1,7 +1,7 @@
 import { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useForm } from 'react-hook-form';
-import { suitableForSyntaxHighlighter } from '@vegaprotocol/utils';
+import { validForSyntaxHighlighter } from '@vegaprotocol/utils';
 import { useNetworkParams } from '@vegaprotocol/network-parameters';
 import {
   getClosingTimestamp,
@@ -46,7 +46,7 @@ const SelectedNetworkParamCurrentValue = ({
     <div className="mb-4">
       <p className="text-sm text-white">{t('CurrentValue')}</p>
 
-      {suitableForSyntaxHighlighter(value) ? (
+      {validForSyntaxHighlighter(value) ? (
         <SyntaxHighlighter data={JSON.parse(value)} />
       ) : (
         <Input

apps/governance/src/routes/proposals/propose/new-asset/propose-new-asset.tsx

@@ -8,7 +8,7 @@ import {
   doesValueEquateToParam,
 } from '@vegaprotocol/proposals';
 import { useEnvironment, DocsLinks } from '@vegaprotocol/environment';
-import { useValidateJson } from '@vegaprotocol/utils';
+import { useValidateJson } from '@vegaprotocol/react-helpers';
 import {
   NetworkParams,
   useNetworkParams,

apps/governance/src/routes/proposals/propose/new-market/propose-new-market.tsx

@@ -7,7 +7,7 @@ import {
   doesValueEquateToParam,
 } from '@vegaprotocol/proposals';
 import { useEnvironment, DocsLinks } from '@vegaprotocol/environment';
-import { useValidateJson } from '@vegaprotocol/utils';
+import { useValidateJson } from '@vegaprotocol/react-helpers';
 import {
   NetworkParams,
   useNetworkParams,

apps/governance/src/routes/proposals/propose/raw/propose-raw.tsx

@@ -14,7 +14,7 @@ import {
   RoundedWrapper,
   TextArea,
 } from '@vegaprotocol/ui-toolkit';
-import { useValidateJson } from '@vegaprotocol/utils';
+import { useValidateJson } from '@vegaprotocol/react-helpers';
 import {
   NetworkParams,
   useNetworkParams,

apps/governance/src/routes/proposals/propose/update-asset/propose-update-asset.tsx

@@ -7,7 +7,7 @@ import {
   doesValueEquateToParam,
 } from '@vegaprotocol/proposals';
 import { useEnvironment, DocsLinks } from '@vegaprotocol/environment';
-import { useValidateJson } from '@vegaprotocol/utils';
+import { useValidateJson } from '@vegaprotocol/react-helpers';
 import {
   NetworkParams,
   useNetworkParams,

apps/governance/src/routes/proposals/propose/update-market/propose-update-market.tsx

@@ -8,7 +8,7 @@ import {
   useProposalSubmit,
 } from '@vegaprotocol/proposals';
 import { useEnvironment, DocsLinks } from '@vegaprotocol/environment';
-import { useValidateJson } from '@vegaprotocol/utils';
+import { useValidateJson } from '@vegaprotocol/react-helpers';
 import {
   NetworkParams,
   useNetworkParams,

apps/trading/client-pages/competitions/team-form.tsx

@@ -9,7 +9,7 @@ import {
   VegaIcon,
   VegaIconNames,
 } from '@vegaprotocol/ui-toolkit';
-import { URL_REGEX, isValidVegaPublicKey } from '@vegaprotocol/utils';
+import { URL_REGEX, validVegaPublicKey } from '@vegaprotocol/utils';
 
 import { type useReferralSetTransaction } from '../../lib/hooks/use-referral-set-transaction';
 import { useT } from '../../lib/use-t';
@@ -217,9 +217,7 @@ export const TeamForm = ({
                     validate: {
                       allowList: (value) => {
                         const publicKeys = parseAllowListText(value);
-                        if (
+                        if (publicKeys.every((pk) => validVegaPublicKey(pk))) {
-                          publicKeys.every((pk) => isValidVegaPublicKey(pk))
-                        ) {
                           return true;
                         }
                         return t('Invalid public key found in allow list');

apps/trading/client-pages/market/market-header-stats.tsx

@@ -2,12 +2,11 @@ import { useAssetDetailsDialogStore } from '@vegaprotocol/assets';
 import { DocsLinks, useEnvironment } from '@vegaprotocol/environment';
 import { ButtonLink, ExternalLink, Link } from '@vegaprotocol/ui-toolkit';
 import type { Market } from '@vegaprotocol/markets';
+import { addDecimalsFormatNumber, fromNanoSeconds } from '@vegaprotocol/utils';
 import {
-  addDecimalsFormatNumber,
+  useMarketExpiryDate,
-  fromNanoSeconds,
-  getExpiryDate,
   getMarketExpiryDate,
-} from '@vegaprotocol/utils';
+} from '@vegaprotocol/react-helpers';
 import {
   Last24hPriceChange,
   Last24hVolume,
@@ -264,12 +263,13 @@ export const FundingCountdown = ({ marketId }: { marketId: string }) => {
 };
 
 const ExpiryLabel = ({ market }: ExpiryLabelProps) => {
+  const expiryDate = useMarketExpiryDate(
+    market.tradableInstrument.instrument.metadata.tags,
+    market.marketTimestamps.close,
+    market.state
+  );
   const content = market.tradableInstrument.instrument.metadata.tags
-    ? getExpiryDate(
+    ? expiryDate
-        market.tradableInstrument.instrument.metadata.tags,
-        market.marketTimestamps.close,
-        market.state
-      )
     : '-';
   return <div data-testid="trading-expiry">{content}</div>;
 };

apps/trading/client-pages/markets/closed.tsx

@@ -11,10 +11,8 @@ import { useMemo } from 'react';
 import type { Asset } from '@vegaprotocol/types';
 import type { ProductType } from '@vegaprotocol/types';
 import { MarketState, MarketStateMapping } from '@vegaprotocol/types';
-import {
+import { addDecimalsFormatNumber } from '@vegaprotocol/utils';
-  addDecimalsFormatNumber,
+import { getMarketExpiryDate } from '@vegaprotocol/react-helpers';
-  getMarketExpiryDate,
-} from '@vegaprotocol/utils';
 import { closedMarketsWithDataProvider, getAsset } from '@vegaprotocol/markets';
 import type { DataSourceFilterFragment } from '@vegaprotocol/markets';
 import { useAssetDetailsDialogStore } from '@vegaprotocol/assets';

apps/trading/components/market-banner/market-settled-banner.tsx

@@ -7,11 +7,8 @@ import {
   useSuccessorMarket,
   type Market,
 } from '@vegaprotocol/markets';
-import {
+import { addDecimalsFormatNumber, isNumeric } from '@vegaprotocol/utils';
-  addDecimalsFormatNumber,
+import { getMarketExpiryDate } from '@vegaprotocol/react-helpers';
-  getMarketExpiryDate,
-  isNumeric,
-} from '@vegaprotocol/utils';
 import { useT, ns } from '../../lib/use-t';
 import { Links } from '../../lib/links';
 

apps/trading/components/profile-dialog/profile-dialog.tsx

@@ -9,7 +9,7 @@ import {
 import { useProfileDialogStore } from '../../stores/profile-dialog-store';
 import { useForm } from 'react-hook-form';
 import { useT } from '../../lib/use-t';
-import { useRequired } from '@vegaprotocol/utils';
+import { useRequired } from '@vegaprotocol/react-helpers';
 import {
   useSimpleTransaction,
   type Status,

libs/accounts/src/lib/transfer-form.tsx

@@ -1,13 +1,15 @@
 import sortBy from 'lodash/sortBy';
 import {
-  useMaxSafe,
-  useRequired,
-  useVegaPublicKey,
   addDecimal,
   toBigNum,
   removeDecimal,
   addDecimalsFormatNumber,
 } from '@vegaprotocol/utils';
+import {
+  useMaxSafe,
+  useRequired,
+  useVegaPublicKey,
+} from '@vegaprotocol/react-helpers';
 import { useT } from './use-t';
 import {
   TradingFormGroup,

libs/deal-ticket/src/components/deal-ticket/deal-ticket-price-tp-sl.tsx

@@ -1,7 +1,8 @@
 import { Controller, type Control } from 'react-hook-form';
 import type { Market } from '@vegaprotocol/markets';
 import type { OrderFormValues } from '../../hooks/use-form-values';
-import { determinePriceStep, useValidateAmount } from '@vegaprotocol/utils';
+import { determinePriceStep } from '@vegaprotocol/utils';
+import { useValidateAmount } from '@vegaprotocol/react-helpers';
 import {
   TradingFormGroup,
   Tooltip,

libs/deal-ticket/src/components/deal-ticket/deal-ticket-size-iceberg.tsx

@@ -1,7 +1,7 @@
 import { Controller, type Control } from 'react-hook-form';
 import type { Market } from '@vegaprotocol/markets';
 import type { OrderFormValues } from '../../hooks/use-form-values';
-import { useValidateAmount } from '@vegaprotocol/utils';
+import { useValidateAmount } from '@vegaprotocol/react-helpers';
 import {
   TradingFormGroup,
   TradingInput,

libs/deal-ticket/src/components/deal-ticket/deal-ticket-stop-order.tsx

@@ -8,8 +8,8 @@ import {
   formatForInput,
   formatValue,
   removeDecimal,
-  useValidateAmount,
 } from '@vegaprotocol/utils';
+import { useValidateAmount } from '@vegaprotocol/react-helpers';
 import { type Control, type UseFormWatch } from 'react-hook-form';
 import { useForm, Controller, useController } from 'react-hook-form';
 import * as Schema from '@vegaprotocol/types';

libs/deal-ticket/src/components/deal-ticket/deal-ticket.tsx

@@ -31,10 +31,10 @@ import { useOpenVolume } from '@vegaprotocol/positions';
 import {
   toBigNum,
   removeDecimal,
-  useValidateAmount,
   formatForInput,
   formatValue,
 } from '@vegaprotocol/utils';
+import { useValidateAmount } from '@vegaprotocol/react-helpers';
 import { activeOrdersProvider } from '@vegaprotocol/orders';
 import {
   getAsset,

libs/deposits/src/lib/deposit-form.tsx

@@ -1,16 +1,18 @@
 import type { Asset, AssetFieldsFragment } from '@vegaprotocol/assets';
 import { AssetOption } from '@vegaprotocol/assets';
 import {
+  addDecimal,
+  isAssetTypeERC20,
+  formatNumber,
+} from '@vegaprotocol/utils';
+import {
+  useLocalStorage,
   useEthereumAddress,
   useRequired,
   useVegaPublicKey,
   useMinSafe,
   useMaxSafe,
-  addDecimal,
+} from '@vegaprotocol/react-helpers';
-  isAssetTypeERC20,
-  formatNumber,
-} from '@vegaprotocol/utils';
-import { useLocalStorage } from '@vegaprotocol/react-helpers';
 import {
   TradingFormGroup,
   TradingInput,

libs/i18n/src/index.ts

@@ -16,6 +16,7 @@ import en_markets from './locales/en/markets.json';
 import en_web3 from './locales/en/web3.json';
 import en_proposals from './locales/en/proposals.json';
 import en_positions from './locales/en/positions.json';
+import en_react_helpers from './locales/en/react-helpers.json';
 import en_trades from './locales/en/trading.json';
 import en_ui_toolkit from './locales/en/ui-toolkit.json';
 import en_wallet from './locales/en/wallet.json';
@@ -39,6 +40,7 @@ export const locales = {
     web3: en_web3,
     positions: en_positions,
     proposals: en_proposals,
+    react_helpers: en_react_helpers,
     trades: en_trades,
     'ui-toolkit': en_ui_toolkit,
     wallet: en_wallet,

libs/markets/src/lib/components/market-info/market-info-panels.tsx

@@ -27,8 +27,8 @@ import {
   formatNumber,
   formatNumberPercentage,
   getDateTimeFormat,
-  getMarketExpiryDateFormatted,
 } from '@vegaprotocol/utils';
+import { getMarketExpiryDateFormatted } from '@vegaprotocol/react-helpers';
 import type { Get } from 'type-fest';
 import { MarketInfoTable } from './info-key-value-table';
 import type {

libs/orders/src/lib/components/order-list/order-edit-dialog.tsx

@@ -3,10 +3,10 @@ import {
   getDateTimeFormat,
   addDecimal,
   addDecimalsFormatNumber,
-  useValidateAmount,
   determinePriceStep,
   determineSizeStep,
 } from '@vegaprotocol/utils';
+import { useValidateAmount } from '@vegaprotocol/react-helpers';
 import { Size } from '@vegaprotocol/datagrid';
 import * as Schema from '@vegaprotocol/types';
 import {

libs/orders/src/lib/components/stop-orders-table/stop-orders-table.tsx

@@ -3,8 +3,8 @@ import {
   getDateTimeFormat,
   isNumeric,
   toBigNum,
-  useFormatTrigger,
 } from '@vegaprotocol/utils';
+import { useFormatTrigger } from '@vegaprotocol/react-helpers';
 import * as Schema from '@vegaprotocol/types';
 import {
   ActionsDropdown,

libs/react-helpers/src/hooks/index.ts

@@ -12,5 +12,8 @@ export * from './use-theme-switcher';
 export * from './use-storybook-theme-observer';
 export * from './use-yesterday';
 export * from './use-previous';
+export * from './use-validate';
+export * from './use-market-expiry-date';
 export { useScript } from './use-script';
 export { useUserAgent } from './use-user-agent';
+export { useFormatTrigger } from './use-format-trigger';

libs/react-helpers/src/hooks/use-format-trigger.ts

@@ -1,7 +1,7 @@
-import { type StopOrder, StopOrderTriggerDirection } from '@vegaprotocol/types';
-import { addDecimalsFormatNumber } from './number';
 import { useCallback } from 'react';
-import { useT } from '../use-t';
+import { type StopOrder, StopOrderTriggerDirection } from '@vegaprotocol/types';
+import { addDecimalsFormatNumber } from '@vegaprotocol/utils';
+import { useT } from './use-t';
 
 export const useFormatTrigger = () => {
   const t = useT();

libs/react-helpers/src/hooks/use-market-expiry-date.ts

@@ -1,42 +1,10 @@
 import { MarketState } from '@vegaprotocol/types';
+import { getDateTimeFormat } from '@vegaprotocol/utils';
 import { isValid, parseISO } from 'date-fns';
-import { getDateTimeFormat } from './format';
 import { useT } from './use-t';
 
-export const getMarketExpiryDate = (
+export const useMarketExpiryDate = (
-  tags?: ReadonlyArray<string> | null
+  tags: ReadonlyArray<string> | null | undefined,
-): Date | null => {
-  if (tags) {
-    const dateFound = tags.reduce<Date | null>((agg, tag) => {
-      const parsed = parseISO(
-        (tag.match(/^settlement.*:/) &&
-          tag
-            .split(':')
-            .filter((item, i) => i)
-            .join(':')) as string
-      );
-      if (isValid(parsed)) {
-        agg = parsed;
-      }
-      return agg;
-    }, null);
-    return dateFound;
-  }
-  return null;
-};
-
-export const getMarketExpiryDateFormatted = (
-  tags?: ReadonlyArray<string> | null
-): string | null => {
-  if (tags) {
-    const dateFound = getMarketExpiryDate(tags);
-    return dateFound ? getDateTimeFormat().format(dateFound) : null;
-  }
-  return null;
-};
-
-export const getExpiryDate = (
-  tags: ReadonlyArray<string> | null,
   close: string | null,
   state: MarketState
 ): string => {
@@ -67,3 +35,35 @@ export const getExpiryDate = (
   }
   return content;
 };
+
+export const getMarketExpiryDateFormatted = (
+  tags?: ReadonlyArray<string> | null
+): string | null => {
+  if (tags) {
+    const dateFound = getMarketExpiryDate(tags);
+    return dateFound ? getDateTimeFormat().format(dateFound) : null;
+  }
+  return null;
+};
+
+export const getMarketExpiryDate = (
+  tags?: ReadonlyArray<string> | null
+): Date | null => {
+  if (tags) {
+    const dateFound = tags.reduce<Date | null>((agg, tag) => {
+      const parsed = parseISO(
+        (tag.match(/^settlement.*:/) &&
+          tag
+            .split(':')
+            .filter((item, i) => i)
+            .join(':')) as string
+      );
+      if (isValid(parsed)) {
+        agg = parsed;
+      }
+      return agg;
+    }, null);
+    return dateFound;
+  }
+  return null;
+};

libs/react-helpers/src/hooks/use-t.ts

@@ -1,3 +1,3 @@
 import { useTranslation } from 'react-i18next';
-export const ns = 'utils';
+export const ns = 'react-helpers';
 export const useT = () => useTranslation(ns).t;

libs/react-helpers/src/hooks/use-validate.ts

@@ -0,0 +1,121 @@
+import { useCallback } from 'react';
+import BigNumber from 'bignumber.js';
+import * as utils from '@vegaprotocol/utils';
+import { useT } from './use-t';
+
+export const useRequired = () => {
+  const t = useT();
+  return useCallback(
+    (value: string) => {
+      if (!utils.validRequired(value)) {
+        return t('Required');
+      }
+      return true;
+    },
+    [t]
+  );
+};
+
+export const useEthereumAddress = () => {
+  const t = useT();
+  return useCallback(
+    (value: string) => {
+      if (!utils.validEthAddress(value)) {
+        return t('Invalid Ethereum address');
+      }
+      return true;
+    },
+    [t]
+  );
+};
+
+export const useVegaPublicKey = () => {
+  const t = useT();
+  return useCallback(
+    (value: string) => {
+      if (!utils.validVegaPublicKey(value)) {
+        return t('Invalid Vega key');
+      }
+      return true;
+    },
+    [t]
+  );
+};
+
+export const useMinSafe = () => {
+  const t = useT();
+  return useCallback(
+    (min: BigNumber) => (value: string) => {
+      if (utils.validMinSafe(value, min)) {
+        return t('Value is below minimum');
+      }
+      return true;
+    },
+    [t]
+  );
+};
+
+export const useMaxSafe = () => {
+  const t = useT();
+  return useCallback(
+    (max: BigNumber) => (value: string) => {
+      if (utils.validMaxSafe(value, max)) {
+        return t('Value is above maximum');
+      }
+      return true;
+    },
+    [t]
+  );
+};
+
+export const useValidateJson = () => {
+  const t = useT();
+  return useCallback(
+    (value: string) => {
+      if (!utils.validJSON(value)) {
+        return t('Must be valid JSON');
+      }
+      return true;
+    },
+    [t]
+  );
+};
+
+export const useValidateUrl = () => {
+  const t = useT();
+  return useCallback(
+    (value: string) => {
+      if (!utils.validUrl(value)) {
+        return t('Invalid URL');
+      }
+      return true;
+    },
+    [t]
+  );
+};
+
+/** Used in deal ticket price/size amounts */
+export const useValidateAmount = () => {
+  const t = useT();
+  return useCallback(
+    (step: number | string, field: string) => {
+      return (value?: string) => {
+        if (!utils.validStep(step, value)) {
+          if (new BigNumber(step).isEqualTo(1)) {
+            return t('{{field}} must be whole numbers for this market', {
+              field,
+              step,
+            });
+          }
+
+          return t('{{field}} must be a multiple of {{step}} for this market', {
+            field,
+            step,
+          });
+        }
+        return true;
+      };
+    },
+    [t]
+  );
+};

libs/trading-view/src/lib/use-datafeed.ts

@@ -17,7 +17,8 @@ import {
   type SymbolQuery,
   type SymbolQueryVariables,
 } from './__generated__/Symbol';
-import { getMarketExpiryDate, toBigNum } from '@vegaprotocol/utils';
+import { toBigNum } from '@vegaprotocol/utils';
+import { getMarketExpiryDate } from '@vegaprotocol/react-helpers';
 import {
   type IBasicDataFeed,
   type DatafeedConfiguration,

libs/utils/.eslintrc.json

@@ -1,6 +1,6 @@
 {
   "extends": ["../../.eslintrc.json"],
-  "ignorePatterns": ["!**/*", "__generated__"],
+  "ignorePatterns": ["!**/*"],
   "overrides": [
     {
       "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
@@ -9,16 +9,18 @@
           "error",
           {
             "paths": [
-              "error",
               "@apollo/client",
+              "@ethersproject",
               "@vegaprotocol/data-provider",
               "ag-grid-react",
               "ag-grid-community",
+              "ethers",
               "graphql",
               "graphql-tag",
               "graphql-ws",
-              "ethers",
+              "react",
-              "@ethersproject"
+              "react-dom",
+              "react-i18next"
             ],
             "patterns": ["@sentry/*"]
           }

libs/utils/package.json

@@ -7,10 +7,6 @@
     "date-fns": "^2.28.0",
     "lodash": "^4.17.21"
   },
-  "peerDependencies": {
-    "react": "18.2.0",
-    "react-i18next": "13.5.0"
-  },
   "type": "module",
   "module": "./index.js"
 }

libs/utils/src/index.ts

@@ -7,7 +7,6 @@ export * from './lib/helpers';
 export * from './lib/is-asset-erc20';
 export * from './lib/is-valid-url';
 export * from './lib/local-storage';
-export * from './lib/markets';
 export * from './lib/price-change';
 export * from './lib/remove-0x';
 export * from './lib/remove-pagination-wrapper';

libs/utils/src/lib/format/index.ts

@@ -3,5 +3,4 @@ export * from './number';
 export * from './range';
 export * from './size';
 export * from './strings';
-export * from './trigger';
 export * from './ether';

libs/utils/src/lib/validate/common.spec.ts

@@ -1,40 +1,66 @@
-import { renderHook } from '@testing-library/react';
+import { validEthAddress, validVegaPublicKey, validStep } from './common';
-import { useEthereumAddress, useVegaPublicKey } from './common';
-
-it('ethereumAddress', () => {
-  const result = renderHook(useEthereumAddress);
-  const ethereumAddress = result.result.current;
-
-  const errorMessage = 'Invalid Ethereum address';
 
+it('validEthAddress', () => {
   const validAddress = '0x72c22822A19D20DE7e426fB84aa047399Ddd8853';
-  expect(ethereumAddress(validAddress)).toEqual(true);
+  expect(validEthAddress(validAddress)).toEqual(true);
 
   const invalidChars = '0xzzc22822A19D20DE7e426fB84aa047399Ddd8853';
-  expect(ethereumAddress(invalidChars)).toEqual(errorMessage);
+  expect(validEthAddress(invalidChars)).toEqual(false);
 
   const tooManyChars = '0x72c22822A19D20DE7e426fB84aa047399Ddd88531111111';
-  expect(ethereumAddress(tooManyChars)).toEqual(errorMessage);
+  expect(validEthAddress(tooManyChars)).toEqual(false);
 
   const no0x = '1x72c22822A19D20DE7e426fB84aa047399Ddd8853';
-  expect(ethereumAddress(no0x)).toEqual(errorMessage);
+  expect(validEthAddress(no0x)).toEqual(false);
 });
 
-it('vegaPublicKey', () => {
+it('validVegaPublicKey', () => {
-  const result = renderHook(useVegaPublicKey);
-  const vegaPublicKey = result.result.current;
-
-  const errorMessage = 'Invalid Vega key';
-
   const validKey =
     '70d14a321e02e71992fd115563df765000ccc4775cbe71a0e2f9ff5a3b9dc680';
-  expect(vegaPublicKey(validKey)).toEqual(true);
+  expect(validVegaPublicKey(validKey)).toEqual(true);
 
   const invalidChars =
     'zzz14a321e02e71992fd115563df765000ccc4775cbe71a0e2f9ff5a3b9dc680';
-  expect(vegaPublicKey(invalidChars)).toEqual(errorMessage);
+  expect(validVegaPublicKey(invalidChars)).toEqual(false);
 
   const tooManyChars =
     '70d14a321e02e71992fd115563df765000ccc4775cbe71a0e2f9ff5a3b9dc680111111';
-  expect(vegaPublicKey(tooManyChars)).toEqual(errorMessage);
+  expect(validVegaPublicKey(tooManyChars)).toEqual(false);
+});
+
+describe('validateAgainstStep', () => {
+  it('fails when step is an empty string', () => {
+    expect(validStep('', '1234')).toEqual(false);
+  });
+
+  it.each([
+    [0, 0],
+    [1234567890, 0],
+    [0.03, 0.03],
+    [0.09, 0.03],
+    [0.27, 0.03],
+    [1, 1],
+    [123, 1],
+    [4, 2],
+    [8, 2],
+  ])(
+    'checks whether given value (%s) IS a multiple of given step (%s)',
+    (value, step) => {
+      expect(validStep(step, value)).toEqual(true);
+    }
+  );
+
+  it.each([
+    [1, 2],
+    [0.1, 0.003],
+    [1.11, 0.1],
+    [123.1, 1],
+    [222, 221],
+    [NaN, 1],
+  ])(
+    'checks whether given value (%s) IS NOT a multiple of given step (%s)',
+    (value, step) => {
+      expect(validStep(step, value)).toEqual(false);
+    }
+  );
 });

libs/utils/src/lib/validate/common.ts

@@ -1,77 +1,52 @@
 import BigNumber from 'bignumber.js';
-import { useT } from '../use-t';
-import { useCallback } from 'react';
 
-export const useRequired = () => {
+export const validRequired = (value: string | number | undefined | null) => {
-  const t = useT();
+  if (value === null || value === undefined || value === '') {
-  return useCallback(
+    return false;
-    (value: string) => {
+  }
-      if (value === null || value === undefined || value === '') {
+  return true;
-        return t('Required');
-      }
-      return true;
-    },
-    [t]
-  );
-};
-
-export const useEthereumAddress = () => {
-  const t = useT();
-  return useCallback(
-    (value: string) => {
-      if (!/^0x[0-9a-fA-F]{40}$/i.test(value)) {
-        return t('Invalid Ethereum address');
-      }
-      return true;
-    },
-    [t]
-  );
 };
 
 export const VEGA_ID_REGEX = /^[A-Fa-f0-9]{64}$/i;
-export const isValidVegaPublicKey = (value: string) => {
+export const validVegaPublicKey = (value: string) => {
   return VEGA_ID_REGEX.test(value);
 };
-export const useVegaPublicKey = () => {
+
-  const t = useT();
+export const URL_REGEX =
-  return useCallback(
+  /^(https?:\/\/)?([a-zA-Z0-9.-]+(\.[a-zA-Z]{2,})+)(:[0-9]{1,5})?(\/[^\s]*)?$/;
-    (value: string) => {
+export const validUrl = (value: string) => {
-      if (!isValidVegaPublicKey(value)) {
+  return URL_REGEX.test(value);
-        return t('Invalid Vega key');
-      }
-      return true;
-    },
-    [t]
-  );
 };
 
-export const useMinSafe = () => {
+export const ETH_ADDRESS = /^0x[0-9a-fA-F]{40}$/i;
-  const t = useT();
+export const validEthAddress = (value: string) => {
-  return useCallback(
+  return ETH_ADDRESS.test(value);
-    (min: BigNumber) => (value: string) => {
-      if (new BigNumber(value).isLessThan(min)) {
-        return t('Value is below minimum');
-      }
-      return true;
-    },
-    [t]
-  );
 };
 
-export const useMaxSafe = () => {
+export const validMinSafe = (
-  const t = useT();
+  value: string | number | BigNumber,
-  return useCallback(
+  min: string | number | BigNumber
-    (max: BigNumber) => (value: string) => {
+) => {
-      if (new BigNumber(value).isGreaterThan(max)) {
+  return new BigNumber(value).isLessThan(min);
-        return t('Value is above maximum');
-      }
-      return true;
-    },
-    [t]
-  );
 };
 
-export const suitableForSyntaxHighlighter = (str: string) => {
+export const validMaxSafe = (
+  value: string | number | BigNumber,
+  max: string | number | BigNumber
+) => {
+  return new BigNumber(value).isGreaterThan(max);
+};
+
+export const validJSON = (value: string) => {
+  try {
+    JSON.parse(value);
+    return true;
+  } catch (e) {
+    return false;
+  }
+};
+
+export const validForSyntaxHighlighter = (str: string) => {
   try {
     const test = JSON.parse(str);
     return test && Object.keys(test).length > 0;
@@ -80,35 +55,17 @@ export const suitableForSyntaxHighlighter = (str: string) => {
   }
 };
 
-export const useValidateJson = () => {
+export const validStep = (step: string | number, input?: string | number) => {
-  const t = useT();
+  const stepValue = new BigNumber(step);
-  return useCallback(
+  if (stepValue.isNaN()) {
-    (value: string) => {
+    // unable to check if step is not a number
-      try {
+    return false;
-        JSON.parse(value);
+  }
-        return true;
+  if (stepValue.isZero()) {
-      } catch (e) {
+    // every number is valid when step is zero
-        return t('Must be valid JSON');
+    return true;
-      }
+  }
-    },
-    [t]
-  );
-};
 
-export const URL_REGEX =
+  const value = new BigNumber(input || '');
-  /^(https?:\/\/)?([a-zA-Z0-9.-]+(\.[a-zA-Z]{2,})+)(:[0-9]{1,5})?(\/[^\s]*)?$/;
+  return value.modulo(stepValue).isZero();
-const isValidUrl = (value: string) => {
-  return URL_REGEX.test(value);
-};
-export const useValidateUrl = () => {
-  const t = useT();
-  return useCallback(
-    (value: string) => {
-      if (!isValidUrl(value)) {
-        return t('Invalid URL');
-      }
-      return true;
-    },
-    [t]
-  );
 };

libs/utils/src/lib/validate/index.ts

@@ -1,2 +1 @@
 export * from './common';
-export * from './validate-amount';

libs/utils/src/lib/validate/validate-amount.spec.ts

@@ -1,38 +0,0 @@
-import { validateAgainstStep } from './validate-amount';
-
-describe('validateAgainstStep', () => {
-  it('fails when step is an empty string', () => {
-    expect(validateAgainstStep('', '1234')).toEqual(false);
-  });
-
-  it.each([
-    [0, 0],
-    [1234567890, 0],
-    [0.03, 0.03],
-    [0.09, 0.03],
-    [0.27, 0.03],
-    [1, 1],
-    [123, 1],
-    [4, 2],
-    [8, 2],
-  ])(
-    'checks whether given value (%s) IS a multiple of given step (%s)',
-    (value, step) => {
-      expect(validateAgainstStep(step, value)).toEqual(true);
-    }
-  );
-
-  it.each([
-    [1, 2],
-    [0.1, 0.003],
-    [1.11, 0.1],
-    [123.1, 1],
-    [222, 221],
-    [NaN, 1],
-  ])(
-    'checks whether given value (%s) IS NOT a multiple of given step (%s)',
-    (value, step) => {
-      expect(validateAgainstStep(step, value)).toEqual(false);
-    }
-  );
-});

libs/utils/src/lib/validate/validate-amount.ts

@@ -1,50 +0,0 @@
-import { useCallback } from 'react';
-import { useT } from '../use-t';
-import BigNumber from 'bignumber.js';
-
-export const useValidateAmount = () => {
-  const t = useT();
-  return useCallback(
-    (step: number | string, field: string) => {
-      return (value?: string) => {
-        const isValid = validateAgainstStep(step, value);
-        if (!isValid) {
-          if (new BigNumber(step).isEqualTo(1)) {
-            return t('{{field}} must be whole numbers for this market', {
-              field,
-              step,
-            });
-          }
-
-          return t('{{field}} must be a multiple of {{step}} for this market', {
-            field,
-            step,
-          });
-        }
-        return true;
-      };
-    },
-    [t]
-  );
-};
-
-const isMultipleOf = (value: BigNumber, multipleOf: BigNumber) =>
-  value.modulo(multipleOf).isZero();
-
-export const validateAgainstStep = (
-  step: string | number,
-  input?: string | number
-) => {
-  const stepValue = new BigNumber(step);
-  if (stepValue.isNaN()) {
-    // unable to check if step is not a number
-    return false;
-  }
-  if (stepValue.isZero()) {
-    // every number is valid when step is zero
-    return true;
-  }
-
-  const value = new BigNumber(input || '');
-  return isMultipleOf(value, stepValue);
-};

libs/wallet/src/connectors/view-party-connector.ts

@@ -1,6 +1,6 @@
 import { type StoreApi } from 'zustand';
 import { type Store, type Connector } from '../types';
-import { isValidVegaPublicKey } from '@vegaprotocol/utils';
+import { validVegaPublicKey } from '@vegaprotocol/utils';
 import {
   ConnectorError,
   chainIdError,
@@ -40,7 +40,7 @@ export class ViewPartyConnector implements Connector {
         throw userRejectedError();
       }
 
-      if (!isValidVegaPublicKey(value)) {
+      if (!validVegaPublicKey(value)) {
         throw connectError('invalid public key');
       }
 

libs/web3/src/lib/use-vega-transaction-toasts.tsx

@@ -40,9 +40,9 @@ import {
   formatNumber,
   toBigNum,
   truncateByChars,
-  useFormatTrigger,
   HALFMAXGOINT64,
 } from '@vegaprotocol/utils';
+import { useFormatTrigger } from '@vegaprotocol/react-helpers';
 import { useAssetsMapProvider } from '@vegaprotocol/assets';
 import { useEthWithdrawApprovalsStore } from './use-ethereum-withdraw-approvals-store';
 import { DApp, EXPLORER_TX, useLinks } from '@vegaprotocol/environment';

libs/withdraws/src/lib/withdraw-form.tsx

@@ -1,13 +1,15 @@
 import type { Asset } from '@vegaprotocol/assets';
 import { AssetOption } from '@vegaprotocol/assets';
 import {
-  useEthereumAddress,
-  useRequired,
-  useMinSafe,
   removeDecimal,
   isAssetTypeERC20,
   formatNumber,
 } from '@vegaprotocol/utils';
+import {
+  useEthereumAddress,
+  useRequired,
+  useMinSafe,
+} from '@vegaprotocol/react-helpers';
 import { useLocalStorage } from '@vegaprotocol/react-helpers';
 import {
   TradingFormGroup,