feat(refactor): Use @w3ux/types types (#2156)

package.json

@@ -33,10 +33,10 @@
     "@substrate/connect": "0.7.35",
     "@w3ux/extension-assets": "^0.2.6",
     "@w3ux/hooks": "^1.0.0",
-    "@w3ux/react-connect-kit": "^1.1.0",
+    "@w3ux/react-connect-kit": "^1.2.1",
     "@w3ux/react-odometer": "^1.0.0",
-    "@w3ux/react-polkicon": "^1.1.0",
-    "@w3ux/utils": "^0.2.0",
+    "@w3ux/react-polkicon": "^1.1.1",
+    "@w3ux/utils": "^0.3.0",
     "@w3ux/validator-assets": "^0.1.0",
     "@zondax/ledger-substrate": "^0.44.2",
     "bignumber.js": "^9.1.2",
@@ -77,6 +77,7 @@
     "@typescript-eslint/eslint-plugin": "^7.12.0",
     "@typescript-eslint/parser": "^7.12.0",
     "@vitejs/plugin-react-swc": "^3.7.0",
+    "@w3ux/types": "^0.1.0",
     "eslint": "8.57.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-import-resolver-typescript": "^3.6.1",

src/canvas/CreatePool/PoolName/Input.tsx

@@ -5,7 +5,7 @@ import type { FormEvent } from 'react';
 import { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useActiveAccounts } from 'contexts/ActiveAccounts';
-import type { AnyJson } from 'types';
+import type { AnyJson } from '@w3ux/types';
 
 export const Input = ({
   listenIsValid,

src/canvas/JoinPool/Overview/PerformanceGraph.tsx

@@ -16,7 +16,7 @@ import { useNetwork } from 'contexts/Network';
 import { GraphWrapper, HeadingWrapper } from '../Wrappers';
 import { Line } from 'react-chartjs-2';
 import BigNumber from 'bignumber.js';
-import type { AnyJson } from 'types';
+import type { AnyJson } from '@w3ux/types';
 import { graphColors } from 'theme/graphs';
 import { useTheme } from 'contexts/Themes';
 import { ButtonHelp } from 'kits/Buttons/ButtonHelp';

src/canvas/PoolMembers/Lists/Default.tsx

@@ -10,7 +10,7 @@ import { usePoolMembers } from 'contexts/Pools/PoolMembers';
 import { List, ListStatusHeader, Wrapper as ListWrapper } from 'library/List';
 import { Pagination } from 'library/List/Pagination';
 import { ListProvider } from 'library/List/context';
-import type { Sync } from 'types';
+import type { Sync } from '@w3ux/types';
 import { Member } from './Member';
 import type { DefaultMembersListProps } from './types';
 import type { PoolMember } from 'contexts/Pools/PoolMembers/types';

src/canvas/PoolMembers/Lists/Member.tsx

@@ -18,7 +18,7 @@ import { Identity } from 'library/ListItem/Labels/Identity';
 import { PoolMemberBonded } from 'library/ListItem/Labels/PoolMemberBonded';
 import { Select } from 'library/ListItem/Labels/Select';
 import { Labels, Separator, Wrapper } from 'library/ListItem/Wrappers';
-import type { AnyJson } from 'types';
+import type { AnyJson } from '@w3ux/types';
 import { usePrompt } from 'contexts/Prompt';
 import { UnbondMember } from '../Prompts/UnbondMember';
 import { WithdrawMember } from '../Prompts/WithdrawMember';

src/canvas/PoolMembers/Lists/types.ts

@@ -1,7 +1,7 @@
 // Copyright 2024 @paritytech/polkadot-staking-dashboard authors & contributors
 // SPDX-License-Identifier: GPL-3.0-only
 
-import type { AnyJson } from 'types';
+import type { AnyJson } from '@w3ux/types';
 
 export interface MembersListProps {
   pagination: boolean;

src/contexts/Api/types.ts

@@ -5,8 +5,9 @@ import type { ApiPromise } from '@polkadot/api';
 import type { U8aLike } from '@polkadot/util/types';
 import type BigNumber from 'bignumber.js';
 import type { ReactNode } from 'react';
-import type { AnyJson, NetworkName } from '../../types';
+import type { NetworkName } from '../../types';
 import type { ApiStatus, ConnectionType } from 'model/Api/types';
+import type { AnyJson } from '@w3ux/types';
 
 export interface APIProviderProps {
   children: ReactNode;

src/contexts/FastUnstake/index.tsx

@@ -12,7 +12,7 @@ import type { ReactNode } from 'react';
 import { createContext, useContext, useEffect, useRef, useState } from 'react';
 import { useApi } from 'contexts/Api';
 import { useStaking } from 'contexts/Staking';
-import type { AnyApi, AnyJson, MaybeAddress } from 'types';
+import type { AnyApi, MaybeAddress } from 'types';
 import Worker from 'workers/stakers?worker';
 import { useEffectIgnoreInitial } from '@w3ux/hooks';
 import { validateLocalExposure } from 'contexts/Validators/Utils';
@@ -24,6 +24,7 @@ import type {
   LocalMeta,
   MetaInterface,
 } from './types';
+import type { AnyJson } from '@w3ux/types';
 
 const worker = new Worker();
 

src/contexts/Filters/index.tsx

@@ -3,7 +3,7 @@
 
 import type { ReactNode } from 'react';
 import { createContext, useContext, useState } from 'react';
-import type { AnyFunction, AnyJson } from 'types';
+import type { AnyFunction, AnyJson } from '@w3ux/types';
 import {
   defaultExcludes,
   defaultFiltersInterface,

src/contexts/Filters/types.ts

@@ -1,7 +1,7 @@
 // Copyright 2024 @paritytech/polkadot-staking-dashboard authors & contributors
 // SPDX-License-Identifier: GPL-3.0-only
 
-import type { AnyFunction, AnyJson } from 'types';
+import type { AnyFunction, AnyJson } from '@w3ux/types';
 
 export type FilterType = 'exclude' | 'include';
 

src/contexts/LedgerHardware/index.tsx

@@ -5,7 +5,7 @@ import { setStateWithRef } from '@w3ux/utils';
 import type { ReactNode } from 'react';
 import { createContext, useContext, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import type { AnyJson, MaybeString } from 'types';
+import type { MaybeString } from 'types';
 import { useApi } from 'contexts/Api';
 import { getLedgerErrorType } from './Utils';
 import { defaultFeedback, defaultLedgerHardwareContext } from './defaults';
@@ -17,6 +17,7 @@ import type {
   LedgerStatusCode,
 } from './types';
 import { Ledger } from './static/ledger';
+import type { AnyJson } from '@w3ux/types';
 
 export const LedgerHardwareContext =
   createContext<LedgerHardwareContextInterface>(defaultLedgerHardwareContext);

src/contexts/LedgerHardware/static/ledger.ts

@@ -5,7 +5,7 @@ import TransportWebHID from '@ledgerhq/hw-transport-webhid';
 import { newSubstrateApp, type SubstrateApp } from '@zondax/ledger-substrate';
 import { withTimeout } from '@w3ux/utils';
 import { u8aToBuffer } from '@polkadot/util';
-import type { AnyJson } from 'types';
+import type { AnyJson } from '@w3ux/types';
 
 const LEDGER_DEFAULT_ACCOUNT = 0x80000000;
 const LEDGER_DEFAULT_CHANGE = 0x80000000;

src/contexts/LedgerHardware/types.ts

@@ -1,8 +1,9 @@
 // Copyright 2024 @paritytech/polkadot-staking-dashboard authors & contributors
 // SPDX-License-Identifier: GPL-3.0-only
 
+import type { AnyJson } from '@w3ux/types';
 import type { FunctionComponent, SVGProps } from 'react';
-import type { AnyJson, MaybeString, NetworkName } from 'types';
+import type { MaybeString, NetworkName } from 'types';
 
 export interface LedgerHardwareContextInterface {
   integrityChecked: boolean;

src/contexts/Payouts/Utils.ts

@@ -2,8 +2,9 @@
 // SPDX-License-Identifier: GPL-3.0-only
 
 import BigNumber from 'bignumber.js';
-import type { AnyJson, NetworkName } from 'types';
+import type { NetworkName } from 'types';
 import type { LocalValidatorExposure } from './types';
+import type { AnyJson } from '@w3ux/types';
 
 // Check if local exposure entry exists for an era.
 export const hasLocalEraExposure = (

src/contexts/Payouts/index.tsx

@@ -5,7 +5,8 @@ import type { ReactNode } from 'react';
 import { useState, useEffect, useRef, useContext, createContext } from 'react';
 import { useStaking } from 'contexts/Staking';
 import { useApi } from 'contexts/Api';
-import type { AnyApi, AnyJson, Sync } from 'types';
+import type { AnyApi } from 'types';
+import type { AnyJson, Sync } from '@w3ux/types';
 import Worker from 'workers/stakers?worker';
 import { rmCommas, setStateWithRef } from '@w3ux/utils';
 import BigNumber from 'bignumber.js';

src/contexts/Payouts/types.ts

@@ -1,7 +1,7 @@
 // Copyright 2024 @paritytech/polkadot-staking-dashboard authors & contributors
 // SPDX-License-Identifier: GPL-3.0-only
 
-import type { Sync } from 'types';
+import type { Sync } from '@w3ux/types';
 
 export interface PayoutsContextInterface {
   payoutsSynced: Sync;

src/contexts/Pools/BondedPools/index.tsx

@@ -15,7 +15,8 @@ import type {
   PoolTab,
 } from './types';
 import { useStaking } from 'contexts/Staking';
-import type { AnyApi, AnyJson, MaybeAddress, Sync } from 'types';
+import type { AnyApi, MaybeAddress } from 'types';
+import type { AnyJson, Sync } from '@w3ux/types';
 import { useEffectIgnoreInitial } from '@w3ux/hooks';
 import { useNetwork } from 'contexts/Network';
 import { useApi } from '../../Api';

src/contexts/Pools/BondedPools/types.ts

@@ -1,10 +1,11 @@
 // Copyright 2024 @paritytech/polkadot-staking-dashboard authors & contributors
 // SPDX-License-Identifier: GPL-3.0-only
 
-import type { AnyApi, AnyJson, MaybeAddress } from 'types';
+import type { AnyApi, MaybeAddress } from 'types';
 import type { ActiveBondedPool } from '../ActivePool/types';
 import type { AnyFilter } from 'library/Filter/types';
 import type { Dispatch, SetStateAction } from 'react';
+import type { AnyJson } from '@w3ux/types';
 
 export interface BondedPoolsContextState {
   queryBondedPool: (poolId: number) => AnyApi;

src/contexts/Pools/PoolMembers/index.tsx

@@ -5,13 +5,14 @@ import { setStateWithRef } from '@w3ux/utils';
 import type { ReactNode } from 'react';
 import { createContext, useContext, useRef, useState } from 'react';
 import { usePlugins } from 'contexts/Plugins';
-import type { AnyApi, AnyMetaBatch, Fn, MaybeAddress, Sync } from 'types';
+import type { AnyApi, AnyMetaBatch, Fn, MaybeAddress } from 'types';
 import { useEffectIgnoreInitial } from '@w3ux/hooks';
 import { useNetwork } from 'contexts/Network';
 import { useActiveAccounts } from 'contexts/ActiveAccounts';
 import { useApi } from '../../Api';
 import { defaultPoolMembers } from './defaults';
 import type { PoolMember, PoolMemberContext } from './types';
+import type { Sync } from '@w3ux/types';
 
 export const PoolMembersContext =
   createContext<PoolMemberContext>(defaultPoolMembers);

src/contexts/Pools/PoolMembers/types.ts

@@ -1,7 +1,8 @@
 // Copyright 2024 @paritytech/polkadot-staking-dashboard authors & contributors
 // SPDX-License-Identifier: GPL-3.0-only
 
-import type { AnyMetaBatch, MaybeAddress, Sync } from 'types';
+import type { Sync } from '@w3ux/types';
+import type { AnyMetaBatch, MaybeAddress } from 'types';
 
 export interface PoolMemberContext {
   fetchPoolMembersMetaBatch: (k: string, v: AnyMetaBatch[], r: boolean) => void;

src/contexts/Pools/PoolPerformance/index.tsx

@@ -24,7 +24,7 @@ import {
   defaultPoolPerformanceTask,
   defaultPoolPerformanceContext,
 } from './defaults';
-import type { Sync } from 'types';
+import type { Sync } from '@w3ux/types';
 
 const worker = new Worker();
 

src/contexts/Pools/PoolPerformance/types.ts

@@ -2,7 +2,7 @@
 // SPDX-License-Identifier: GPL-3.0-only
 
 import type BigNumber from 'bignumber.js';
-import type { Sync } from 'types';
+import type { Sync } from '@w3ux/types';
 
 export interface PoolPerformanceContextInterface {
   getPoolRewardPoints: (key: PoolRewardPointsKey) => PoolRewardPoints;

src/contexts/Proxies/types.ts

@@ -1,8 +1,9 @@
 // Copyright 2024 @paritytech/polkadot-staking-dashboard authors & contributors
 // SPDX-License-Identifier: GPL-3.0-only
 
+import type { AnyJson } from '@w3ux/types';
 import type BigNumber from 'bignumber.js';
-import type { AnyJson, MaybeAddress } from 'types';
+import type { MaybeAddress } from 'types';
 
 export type ProxyType =
   | 'Any'

src/contexts/Setup/types.ts

@@ -1,9 +1,10 @@
 // Copyright 2024 @paritytech/polkadot-staking-dashboard authors & contributors
 // SPDX-License-Identifier: GPL-3.0-only
 
+import type { AnyJson } from '@w3ux/types';
 import type { PoolRoles } from 'contexts/Pools/ActivePool/types';
 import type { ValidatorPrefs } from 'contexts/Validators/types';
-import type { AnyJson, BondFor, MaybeAddress, MaybeString } from 'types';
+import type { BondFor, MaybeAddress, MaybeString } from 'types';
 
 export type PayeeOptions =
   | 'Staked'

src/contexts/TxMeta/index.tsx

@@ -7,14 +7,15 @@ import type { ReactNode } from 'react';
 import { createContext, useContext, useRef, useState } from 'react';
 import { useBonded } from 'contexts/Bonded';
 import { useStaking } from 'contexts/Staking';
-import type { AnyJson, MaybeAddress } from 'types';
+import type { MaybeAddress } from 'types';
 import { useActiveAccounts } from 'contexts/ActiveAccounts';
 import { useImportedAccounts } from 'contexts/Connect/ImportedAccounts';
 import * as defaults from './defaults';
 import type { TxMetaContextInterface } from './types';
 import { useEffectIgnoreInitial } from '@w3ux/hooks';
 import { useActiveBalances } from 'hooks/useActiveBalances';
 import { useApi } from 'contexts/Api';
+import type { AnyJson } from '@w3ux/types';
 
 export const TxMetaContext = createContext<TxMetaContextInterface>(
   defaults.defaultTxMeta

src/contexts/TxMeta/types.ts

@@ -1,8 +1,9 @@
 // Copyright 2024 @paritytech/polkadot-staking-dashboard authors & contributors
 // SPDX-License-Identifier: GPL-3.0-only
 
+import type { AnyJson } from '@w3ux/types';
 import type BigNumber from 'bignumber.js';
-import type { AnyJson, MaybeAddress } from 'types';
+import type { MaybeAddress } from 'types';
 
 export interface TxMetaContextInterface {
   sender: MaybeAddress;

src/contexts/UI/index.tsx

@@ -6,7 +6,7 @@ import type { ReactNode, RefObject } from 'react';
 import { createContext, useContext, useEffect, useRef, useState } from 'react';
 import { PageWidthMediumThreshold } from 'consts';
 import { useEffectIgnoreInitial } from '@w3ux/hooks';
-import type { AnyJson } from 'types';
+import type { AnyJson } from '@w3ux/types';
 import * as defaults from './defaults';
 import type { UIContextInterface } from './types';
 

src/contexts/Validators/Utils.ts

@@ -1,14 +1,15 @@
 // Copyright 2024 @paritytech/polkadot-staking-dashboard authors & contributors
 // SPDX-License-Identifier: GPL-3.0-only
 
+import type { AnyJson } from '@w3ux/types';
 import BigNumber from 'bignumber.js';
 import type { LocalMeta } from 'contexts/FastUnstake/types';
 import type {
   EraRewardPoints,
   LocalValidatorEntriesData,
   Validator,
 } from 'contexts/Validators/types';
-import type { AnyJson, NetworkName } from 'types';
+import type { NetworkName } from 'types';
 
 // Get favorite validators from local storage.
 export const getLocalFavorites = (network: NetworkName) => {

src/contexts/Validators/ValidatorEntries/index.tsx

@@ -5,7 +5,7 @@ import { greaterThanZero, rmCommas, shuffle } from '@w3ux/utils';
 import BigNumber from 'bignumber.js';
 import type { ReactNode } from 'react';
 import { createContext, useContext, useEffect, useRef, useState } from 'react';
-import type { AnyApi, AnyJson, Fn, Sync } from 'types';
+import type { AnyApi, Fn } from 'types';
 import { useEffectIgnoreInitial } from '@w3ux/hooks';
 import { useNetwork } from 'contexts/Network';
 import { useApi } from 'contexts/Api';
@@ -32,6 +32,7 @@ import {
 import { getLocalEraValidators, setLocalEraValidators } from '../Utils';
 import { useErasPerDay } from 'hooks/useErasPerDay';
 import { IdentitiesController } from 'controllers/IdentitiesController';
+import type { AnyJson, Sync } from '@w3ux/types';
 
 export const ValidatorsContext = createContext<ValidatorsContextInterface>(
   defaultValidatorsContext

src/contexts/Validators/types.ts

@@ -2,7 +2,7 @@
 // SPDX-License-Identifier: GPL-3.0-only
 
 import type BigNumber from 'bignumber.js';
-import type { AnyJson, Sync } from 'types';
+import type { AnyJson, Sync } from '@w3ux/types';
 
 export interface ValidatorsContextInterface {
   fetchValidatorPrefs: (a: ValidatorAddresses) => Promise<Validator[] | null>;

src/controllers/IdentitiesController/index.ts

@@ -1,8 +1,9 @@
 // Copyright 2024 @paritytech/polkadot-staking-dashboard authors & contributors
 // SPDX-License-Identifier: GPL-3.0-only
 
-import type { AnyApi, AnyJson } from 'types';
+import type { AnyApi } from 'types';
 import type { ApiPromise } from '@polkadot/api';
+import type { AnyJson } from '@w3ux/types';
 
 export class IdentitiesController {
   static fetch = async (api: ApiPromise, addresses: string[]) => {
@@ -20,7 +21,7 @@ export class IdentitiesController {
       return Object.fromEntries(
         data
           .map((key: string, index: number) => [addresses[index], key])
-          .filter(([, value]: AnyJson) => value !== null)
+          .filter(([, value]) => value !== null)
       );
     };
 

src/hooks/useDotLottieButton/index.tsx

@@ -5,7 +5,7 @@ import type { ReactNode } from 'react';
 import { useEffect, useRef, useState } from 'react';
 import { useTheme } from 'contexts/Themes';
 import type { Theme } from 'contexts/Themes/types';
-import type { AnyJson } from 'types';
+import type { AnyJson } from '@w3ux/types';
 
 export const useDotLottieButton = (filename: string, options: AnyJson = {}) => {
   const { mode } = useTheme();

src/hooks/useFillVariables/index.tsx

@@ -4,7 +4,7 @@
 import { capitalizeFirstLetter, planckToUnit } from '@w3ux/utils';
 import { useApi } from 'contexts/Api';
 import { useNetwork } from 'contexts/Network';
-import type { AnyJson } from 'types';
+import type { AnyJson } from '@w3ux/types';
 import { useErasPerDay } from '../useErasPerDay';
 
 export const useFillVariables = () => {

src/hooks/useNominationStatus/index.tsx

@@ -5,9 +5,10 @@ import { useTranslation } from 'react-i18next';
 import { useActivePool } from 'contexts/Pools/ActivePool';
 import { useStaking } from 'contexts/Staking';
 import { useValidators } from 'contexts/Validators/ValidatorEntries';
-import type { AnyJson, BondFor, MaybeAddress } from 'types';
+import type { BondFor, MaybeAddress } from 'types';
 import { useSyncing } from 'hooks/useSyncing';
 import { useBalances } from 'contexts/Balances';
+import type { AnyJson } from '@w3ux/types';
 
 export const useNominationStatus = () => {
   const { t } = useTranslation();