diff --git a/.env.example b/.env.example
index 167425fd..5eb59ecd 100644
--- a/.env.example
+++ b/.env.example
@@ -1,37 +1,16 @@
-# DEVNET #
-NEXT_PUBLIC_NETWORK=devnet
-NEXT_PUBLIC_CHAIN_ID=devnet
-NEXT_PUBLIC_RPC=https://rpc.devnet.osmosis.zone/
-NEXT_PUBLIC_GQL=https://devnet-osmosis-gql.marsprotocol.io/graphql 
-NEXT_PUBLIC_REST=https://lcd.devnet.osmosis.zone/
-
-
-# MAINNET # 
 NEXT_PUBLIC_NETWORK=mainnet
-NEXT_PUBLIC_CHAIN_ID=osmosis-1  
-NEXT_PUBLIC_RPC=https://osmosis-node.marsprotocol.io/GGSFGSFGFG34/osmosis-rpc-front/
-NEXT_PUBLIC_GQL=https://osmosis-node.marsprotocol.io/GGSFGSFGFG34/osmosis-hive-front/graphql
-NEXT_PUBLIC_REST=https://osmosis-node.marsprotocol.io/GGSFGSFGFG34/osmosis-lcd-front/
 
+NEXT_PUBLIC_OSMOSIS_RPC=https://osmosis-node.marsprotocol.io/GGSFGSFGFG34/osmosis-rpc-front/
+NEXT_PUBLIC_OSMOSIS_REST=https://osmosis-node.marsprotocol.io/GGSFGSFGFG34/osmosis-lcd-front/
+NEXT_PUBLIC_OSMOSIS_TEST_RPC=https://rpc.devnet.osmosis.zone/
+NEXT_PUBLIC_OSMOSIS_TEST_REST=https://lcd.devnet.osmosis.zone/
+NEXT_PUBLIC_NEUTRON_TEST_RPC=https://rpc-palvus.pion-1.ntrn.tech/
+NEXT_PUBLIC_NEUTRON_TEST_REST=https://rest-palvus.pion-1.ntrn.tech/
 
-# COMMON #
-NEXT_PUBLIC_SWAP=https://app.osmosis.zone
-NEXT_PUBLIC_VAULT_APR=https://api.marsprotocol.io/v1/vaults/osmosis
-NEXT_PUBLIC_ACCOUNT_NFT=osmo1450hrg6dv2l58c0rvdwx8ec2a0r6dd50hn4frk370tpvqjhy8khqw7sw09
-NEXT_PUBLIC_ORACLE=osmo1mhznfr60vjdp2gejhyv2gax9nvyyzhd3z0qcwseyetkfustjauzqycsy2g
-NEXT_PUBLIC_RED_BANK=osmo1c3ljch9dfw5kf52nfwpxd2zmj2ese7agnx0p9tenkrryasrle5sqf3ftpg
-NEXT_PUBLIC_CREDIT_MANAGER=osmo1f2m24wktq0sw3c0lexlg7fv4kngwyttvzws3a3r3al9ld2s2pvds87jqvf
-NEXT_PUBLIC_INCENTIVES=osmo1nkahswfr8shg8rlxqwup0vgahp0dk4x8w6tkv3rra8rratnut36sk22vrm
-NEXT_PUBLIC_SWAPPER=osmo1wee0z8c7tcawyl647eapqs4a88q8jpa7ddy6nn2nrs7t47p2zhxswetwla
-NEXT_PUBLIC_PYTH=osmo13ge29x4e2s63a8ytz2px8gurtyznmue4a69n5275692v3qn3ks8q7cwck7
-NEXT_PUBLIC_ZAPPER=osmo17qwvc70pzc9mudr8t02t3pl74hhqsgwnskl734p4hug3s8mkerdqzduf7c
-NEXT_PUBLIC_PARAMS=osmo1nlmdxt9ctql2jr47qd4fpgzg84cjswxyw6q99u4y4u4q6c2f5ksq7ysent
-NEXT_PUBLIC_PYTH_ENDPOINT=https://hermes.pyth.network/api
-NEXT_PUBLIC_MAINNET_REST=https://osmosis-node.marsprotocol.io/GGSFGSFGFG34/osmosis-rpc-front/
-NEXT_PUBLIC_CANDLES_ENDPOINT_THE_GRAPH=https://osmosis-candles.marsprotocol.io/
-NEXT_PUBLIC_CANDLES_ENDPOINT_PYTH=https://benchmarks.pyth.network
 NEXT_PUBLIC_WALLET_CONNECT_ID=d93fdffb159bae5ec87d8fee4cdbb045
-CHARTING_LIBRARY_REPOSITORY=github.com/tradingview/charting_library
-CHARTING_LIBRARY_ACCESS_TOKEN=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
-CHARTING_LIBRARY_USERNAME=mars-git-demo
-NEXT_PUBLIC_STRIDE_APRS=https://edge.stride.zone/api/stake-stats
+CHARTING_LIBRARY_USERNAME=git_username
+CHARTING_LIBRARY_ACCESS_TOKEN=access_token
+CHARTING_LIBRARY_REPOSITORY=github.com/tradingview/charting_library/
+
+NEXT_PUBLIC_PYTH_API=https://mars.rpc.p2p.world/api
+
diff --git a/__mocks__/fileMock.js b/__mocks__/fileMock.js
deleted file mode 100644
index 8761cdaa..00000000
--- a/__mocks__/fileMock.js
+++ /dev/null
@@ -1,6 +0,0 @@
-module.exports = {
-  src: '/img.jpg',
-  height: 24,
-  width: 24,
-  blurDataURL: 'data:image/png;base64,imagedata',
-}
diff --git a/__mocks__/helmet.js b/__mocks__/helmet.js
deleted file mode 100644
index 34967f49..00000000
--- a/__mocks__/helmet.js
+++ /dev/null
@@ -1,17 +0,0 @@
-jest.mock('react-helmet-async', () => {
-  const React = require('react')
-  const plugin = jest.requireActual('react-helmet-async')
-  const mockHelmet = ({ children, ...props }) =>
-    React.createElement(
-      'div',
-      {
-        ...props,
-        className: 'mock-helmet',
-      },
-      children,
-    )
-  return {
-    ...plugin,
-    Helmet: jest.fn().mockImplementation(mockHelmet),
-  }
-})
\ No newline at end of file
diff --git a/__mocks__/store.js b/__mocks__/store.js
deleted file mode 100644
index 0ceb53cc..00000000
--- a/__mocks__/store.js
+++ /dev/null
@@ -1,23 +0,0 @@
-jest.mock('store', () => {
-  let state = {}
-
-  const mockUseStore = (selectorFn) => {
-    return selectorFn(state)
-  }
-
-  mockUseStore.setState = (newState) => {
-    state = {
-      ...state,
-      ...newState,
-    }
-  }
-
-  mockUseStore.clearState = () => {
-    state = {}
-  }
-
-  return {
-    __esModule: true,
-    default: mockUseStore,
-  }
-})
diff --git a/__mocks__/styleMock.js b/__mocks__/styleMock.js
deleted file mode 100644
index 4ba52ba2..00000000
--- a/__mocks__/styleMock.js
+++ /dev/null
@@ -1 +0,0 @@
-module.exports = {}
diff --git a/__mocks__/svgMock.js b/__mocks__/svgMock.js
deleted file mode 100644
index 1e37d85b..00000000
--- a/__mocks__/svgMock.js
+++ /dev/null
@@ -1,7 +0,0 @@
-/* eslint-disable react/display-name */
-import React from 'react'
-
-const SvgrMock = React.forwardRef((props, ref) => <svg ref={ref} {...props} />)
-
-export const ReactComponent = SvgrMock
-export default SvgrMock
diff --git a/__tests__/Footer.test.tsx b/__tests__/Footer.test.tsx
deleted file mode 100644
index d68cd3a8..00000000
--- a/__tests__/Footer.test.tsx
+++ /dev/null
@@ -1,14 +0,0 @@
-import { render } from '@testing-library/react'
-
-import Footer from 'components/Footer'
-
-import packageJSON from '../package.json'
-
-describe('<Footer />', () => {
-  it('should render package version correctly', () => {
-    const { getByText, container } = render(<Footer />)
-    const versionText = getByText(`v${packageJSON.version}`)
-
-    expect(versionText).toBeInTheDocument()
-  })
-})
diff --git a/__tests__/components/Account/AccountDetails.test.tsx b/__tests__/components/Account/AccountDetails.test.tsx
deleted file mode 100644
index d4f81f84..00000000
--- a/__tests__/components/Account/AccountDetails.test.tsx
+++ /dev/null
@@ -1,67 +0,0 @@
-import { render, screen } from '@testing-library/react'
-
-import AccountDetails from 'components/Account/AccountDetails'
-import useCurrentAccount from 'hooks/useCurrentAccount'
-import useStore from 'store'
-
-jest.mock('react-router', () => ({
-  ...(jest.requireActual('react-router') as {}),
-  useLocation: jest.fn().mockImplementation(() => {
-    return { pathname: '/testroute' }
-  }),
-}))
-jest.mock('hooks/useCurrentAccount', () => jest.fn(() => null))
-jest.mock('hooks/useHealthComputer', () =>
-  jest.fn(() => ({
-    health: 0,
-  })),
-)
-// AccountBalancesTable component has wallet provider dependency, so we mock it
-jest.mock('components/Account/AccountBalancesTable', () => jest.fn(() => null))
-
-const mockedUseCurrentAccount = useCurrentAccount as jest.Mock
-const mockedAccounts: Account[] = [
-  { id: '1', deposits: [], lends: [], debts: [], vaults: [], kind: 'default' },
-  { id: '2', deposits: [], lends: [], debts: [], vaults: [], kind: 'default' },
-]
-jest.mock('hooks/useAccountId', () => jest.fn(() => '1'))
-jest.mock('hooks/useAccounts', () =>
-  jest.fn(() => ({
-    data: mockedAccounts,
-  })),
-)
-jest.mock('hooks/useAccountIds', () =>
-  jest.fn(() => ({
-    data: ['1', '2'],
-  })),
-)
-jest.mock('hooks/useCurrentAccount', () => jest.fn(() => mockedAccounts[0]))
-
-describe('<AccountDetails />', () => {
-  beforeAll(() => {
-    useStore.setState({
-      address: 'walletAddress',
-      accounts: mockedAccounts,
-    })
-  })
-
-  afterAll(() => {
-    useStore.clearState()
-  })
-
-  it('renders account details WHEN account is selected', () => {
-    mockedUseCurrentAccount.mockReturnValue(mockedAccounts)
-    render(<AccountDetails />)
-
-    const container = screen.queryByTestId('account-details')
-    expect(container).toBeInTheDocument()
-  })
-
-  it('does not render WHEN account is NOT selected', () => {
-    mockedUseCurrentAccount.mockReturnValue(null)
-    render(<AccountDetails />)
-
-    const container = screen.queryByTestId('account-details')
-    expect(container).not.toBeInTheDocument()
-  })
-})
diff --git a/__tests__/components/Button/Button.test.tsx b/__tests__/components/Button/Button.test.tsx
deleted file mode 100644
index 7e52b677..00000000
--- a/__tests__/components/Button/Button.test.tsx
+++ /dev/null
@@ -1,157 +0,0 @@
-import { cleanup, render } from '@testing-library/react'
-
-import Button from 'components/Button'
-import {
-  buttonColorClasses,
-  buttonSizeClasses,
-  buttonVariantClasses,
-  focusClasses,
-} from 'components/Button/constants'
-import { parseMockComponentProps } from 'utils/testing'
-
-jest.mock('components/CircularProgress', () => {
-  return {
-    CircularProgress: (props: any) =>
-      require('utils/testing').createMockComponent('circular-progress-component', props),
-  }
-})
-
-describe('<Button />', () => {
-  afterAll(() => {
-    jest.unmock('components/CircularProgress')
-  })
-
-  it('should render', () => {
-    const { container } = render(<Button />)
-    expect(container).toBeInTheDocument()
-  })
-
-  it('should render `children` when its passed', () => {
-    const children = <span data-testid='test-id'>Hello World!</span>
-    const { getByTestId } = render(<Button>{children}</Button>)
-
-    expect(getByTestId('test-id')).toBeInTheDocument()
-  })
-
-  it('should handle `className` prop correctly', () => {
-    const testClass = 'test-class'
-    const { container } = render(<Button className={testClass} />)
-
-    expect(container.querySelector('button')).toHaveClass(testClass)
-  })
-
-  it('should handle `color` prop correctly', () => {
-    const colors = Object.keys(buttonColorClasses) as [keyof typeof buttonColorClasses]
-
-    colors.forEach((color) => {
-      const { container } = render(<Button color={color} />)
-
-      expect(container.querySelector('button')).toHaveClass(buttonColorClasses[color])
-    })
-  })
-
-  it('should handle `disabled=true` prop correctly', () => {
-    const testFunction = jest.fn()
-    const { container } = render(<Button disabled={true} onClick={testFunction} />)
-    const button = container.querySelector('button')
-
-    button?.click()
-
-    expect(button).toHaveClass('pointer-events-none')
-    expect(testFunction).not.toBeCalled()
-  })
-
-  it('should handle `disabled=false` prop correctly', () => {
-    const testFunction = jest.fn()
-    const { container } = render(<Button disabled={false} onClick={testFunction} />)
-    const button = container.querySelector('button')
-
-    button?.click()
-
-    expect(button).not.toHaveClass('pointer-events-none')
-    expect(testFunction).toBeCalled()
-  })
-
-  it('should show progress indicator when `showProgressIndicator=true`', () => {
-    const { getByTestId } = render(<Button showProgressIndicator={true} />)
-    const circularProgressComponent = getByTestId('circular-progress-component')
-
-    expect(circularProgressComponent).toBeInTheDocument()
-  })
-
-  it('should set correct values for progress indicator size', () => {
-    const sizeValues = { xs: 8, sm: 10, md: 12, lg: 18 }
-
-    Object.entries(sizeValues).forEach(([size, value]) => {
-      const { getByTestId } = render(
-        <Button showProgressIndicator={true} size={size as keyof typeof buttonSizeClasses} />,
-      )
-      const circularProgressComponent = getByTestId('circular-progress-component')
-      const sizeProp = parseMockComponentProps(circularProgressComponent).size
-
-      expect(sizeProp).toBe(value)
-      cleanup()
-    })
-  })
-
-  it('should handle `size` prop correctly', () => {
-    const sizes = Object.keys(buttonSizeClasses) as [keyof typeof buttonSizeClasses]
-
-    sizes.forEach((size) => {
-      const { container } = render(<Button size={size} />)
-
-      expect(container.querySelector('button')).toHaveClass(buttonSizeClasses[size])
-    })
-  })
-
-  it('should show `text` when its passed', () => {
-    const text = 'Hello!'
-    const { getByText } = render(<Button text={text} />)
-
-    expect(getByText(text)).toBeInTheDocument()
-  })
-
-  it('should handle `variant` prop correctly', () => {
-    const variants = Object.keys(buttonVariantClasses) as [keyof typeof buttonVariantClasses]
-
-    variants.forEach((variant) => {
-      const { container } = render(<Button variant={variant} />)
-
-      expect(container.querySelector('button')).toHaveClass(buttonVariantClasses[variant])
-    })
-  })
-
-  it('should show left icon when `leftIcon` prop is passed', () => {
-    const icon = <span data-testid='left-icon'>this is the left icon</span>
-    const { getByTestId } = render(<Button leftIcon={icon} />)
-
-    expect(getByTestId('left-icon')).toBeInTheDocument()
-  })
-
-  it('should show right icon when `rightIcon` prop is passed', () => {
-    const icon = <span data-testid='right-icon'>this is the right icon</span>
-    const { getByTestId } = render(<Button rightIcon={icon} />)
-
-    expect(getByTestId('right-icon')).toBeInTheDocument()
-  })
-
-  it('should handle `iconClassName` prop correctly', () => {
-    const icon = <span data-testid='icon'>just an icon</span>
-    const { getByTestId } = render(<Button rightIcon={icon} iconClassName='test-icon-class' />)
-
-    expect(getByTestId('icon').parentElement).toHaveClass('test-icon-class')
-  })
-
-  it('should show submenu indicator when `hasSubmenu=true`', () => {
-    const { getByTestId } = render(<Button hasSubmenu={true} />)
-
-    expect(getByTestId('button-submenu-indicator')).toBeInTheDocument()
-  })
-
-  it('should set focus classes when `hasFocus=true`', () => {
-    const { container } = render(<Button hasFocus={true} color='primary' />)
-    const button = container.querySelector('button')
-
-    expect(button).toHaveClass(focusClasses['primary'])
-  })
-})
diff --git a/__tests__/components/Card.test.tsx b/__tests__/components/Card.test.tsx
deleted file mode 100644
index 4bd8e615..00000000
--- a/__tests__/components/Card.test.tsx
+++ /dev/null
@@ -1,60 +0,0 @@
-import { render, screen } from '@testing-library/react'
-
-import Card from 'components/Card'
-
-jest.mock('components/Text', () => {
-  return {
-    __esModule: true,
-    default: (props: any) =>
-      require('utils/testing').createMockComponent('mock-text-component', props),
-  }
-})
-
-describe('<Card />', () => {
-  const defaultProps = {
-    children: <></>,
-  }
-
-  afterAll(() => {
-    jest.unmock('components/Text')
-  })
-
-  it('should render', () => {
-    const { container } = render(<Card {...defaultProps} />)
-    expect(container).toBeInTheDocument()
-  })
-
-  it('should handle `className` prop correctly', () => {
-    const testClass = 'test-class'
-    const { container } = render(<Card {...defaultProps} className={testClass} />)
-    expect(container.querySelector('section')).toHaveClass(testClass)
-  })
-
-  it('should handle `contentClassName` prop correctly', () => {
-    const testClass = 'test-class'
-    const { container } = render(<Card {...defaultProps} contentClassName={testClass} />)
-
-    expect(container.querySelector('div')).toHaveClass(testClass)
-  })
-
-  it('should handle `title` prop as string correctly', () => {
-    const testTitle = 'this-is-the-test-title'
-    const { queryByText } = render(<Card {...defaultProps} title={testTitle} />)
-
-    expect(queryByText(testTitle)).toBeInTheDocument()
-  })
-
-  it('should handle `title` prop as element correctly', () => {
-    const testTitle = <p data-testid='test-title'>Test title</p>
-    const { queryByTestId } = render(<Card {...defaultProps} title={testTitle} />)
-
-    expect(queryByTestId('test-title')).toBeInTheDocument()
-    expect(queryByTestId('mock-text-component')).not.toBeInTheDocument()
-  })
-
-  it('should handle `id` prop as element correctly', () => {
-    const testId = 'test-id'
-    const { container } = render(<Card {...defaultProps} id={testId} />)
-    expect(container.querySelector(`section#${testId}`)).toBeInTheDocument()
-  })
-})
diff --git a/__tests__/components/CircularProgress.test.tsx b/__tests__/components/CircularProgress.test.tsx
deleted file mode 100644
index 98251b19..00000000
--- a/__tests__/components/CircularProgress.test.tsx
+++ /dev/null
@@ -1,34 +0,0 @@
-import { render } from '@testing-library/react'
-
-import { CircularProgress } from 'components/CircularProgress'
-import { LocalStorageKeys } from 'constants/localStorageKeys'
-
-describe('<CircularProgress />', () => {
-  afterAll(() => {
-    localStorage.removeItem(LocalStorageKeys.REDUCE_MOTION)
-  })
-
-  it('should render', () => {
-    const { container } = render(<CircularProgress />)
-
-    expect(container).toBeInTheDocument()
-  })
-
-  it('should render `...` when animations disabled', () => {
-    localStorage.setItem(LocalStorageKeys.REDUCE_MOTION, 'true')
-
-    const { getByText } = render(<CircularProgress />)
-    const threeDots = getByText('...')
-
-    expect(threeDots).toBeInTheDocument()
-  })
-
-  it('should render the component with animation classes when animations enabled', () => {
-    localStorage.setItem(LocalStorageKeys.REDUCE_MOTION, 'false')
-
-    const { container } = render(<CircularProgress />)
-    const progressWithAnimations = container.querySelector('.animate-progress')
-
-    expect(progressWithAnimations).toBeInTheDocument()
-  })
-})
diff --git a/__tests__/components/Modals/Unlock/UnlockModal.test.tsx b/__tests__/components/Modals/Unlock/UnlockModal.test.tsx
deleted file mode 100644
index c19fbdf3..00000000
--- a/__tests__/components/Modals/Unlock/UnlockModal.test.tsx
+++ /dev/null
@@ -1,65 +0,0 @@
-import { render } from '@testing-library/react'
-
-import Modal from 'components/Modal'
-import UnlockModal from 'components/Modals/Unlock'
-import { BN_ONE, BN_ZERO } from 'constants/math'
-import { TESTNET_VAULTS_META_DATA } from 'constants/vaults'
-import useStore from 'store'
-import { BN } from 'utils/helpers'
-
-jest.mock('components/Modal')
-const mockedModal = jest.mocked(Modal).mockImplementation(() => <div>Mock</div>)
-
-const mockedDepositedVault: DepositedVault = {
-  ...TESTNET_VAULTS_META_DATA[0],
-  status: 'active',
-  apy: 1,
-  apr: null,
-  ltv: {
-    max: 0.65,
-    liq: 0.7,
-  },
-  amounts: {
-    primary: BN_ONE,
-    secondary: BN_ONE,
-    locked: BN_ONE,
-    unlocked: BN_ONE,
-    unlocking: BN_ONE,
-  },
-  values: {
-    primary: BN_ZERO,
-    secondary: BN_ZERO,
-    unlocked: BN_ZERO,
-    unlocking: BN_ZERO,
-  },
-  cap: {
-    denom: 'mock',
-    max: BN(10),
-    used: BN_ONE,
-  },
-}
-
-describe('<UnlockModal />', () => {
-  afterAll(() => {
-    useStore.clearState()
-  })
-
-  it('should render', () => {
-    const { container } = render(<UnlockModal />)
-    expect(container).toBeInTheDocument()
-  })
-
-  describe('should set content correctly', () => {
-    it('should have no content when no modal is present in store', () => {
-      useStore.setState({ unlockModal: null })
-      render(<UnlockModal />)
-      expect(mockedModal).toHaveBeenCalledTimes(0)
-    })
-
-    it('should have content when modal is present in store', () => {
-      useStore.setState({ unlockModal: { vault: mockedDepositedVault } })
-      render(<UnlockModal />)
-      expect(mockedModal).toHaveBeenCalledTimes(1)
-    })
-  })
-})
diff --git a/__tests__/components/PageMetadata.test.tsx b/__tests__/components/PageMetadata.test.tsx
deleted file mode 100644
index e46492e0..00000000
--- a/__tests__/components/PageMetadata.test.tsx
+++ /dev/null
@@ -1,32 +0,0 @@
-import { render } from '@testing-library/react'
-import * as rrd from 'react-router-dom'
-
-import PageMetadata from 'components/PageMetadata'
-import PAGE_METADATA from 'constants/pageMetadata'
-
-jest.mock('react-router-dom')
-const mockedUseLocation = rrd.useLocation as jest.Mock
-
-describe('<PageMetadata />', () => {
-  afterAll(() => {
-    jest.clearAllMocks()
-  })
-
-  Object.keys(PAGE_METADATA).forEach((page) => {
-    it(`should render correct ${page} metadata`, () => {
-      const pageKey = page as keyof typeof PAGE_METADATA
-      const pageMetadata = PAGE_METADATA[pageKey]
-
-      mockedUseLocation.mockReturnValue({ pathname: pageKey })
-
-      const { container } = render(<PageMetadata />)
-      const titleElement = container.querySelector('title')
-      const descriptionElement = container.querySelector('meta[name="description"]')
-      const keywordsElement = container.querySelector('meta[name="keywords"]')
-
-      expect(titleElement).toHaveTextContent(pageMetadata.title)
-      expect(descriptionElement).toHaveAttribute('content', pageMetadata.description)
-      expect(keywordsElement).toHaveAttribute('content', pageMetadata.keywords)
-    })
-  })
-})
diff --git a/__tests__/components/TokenInput.test.tsx b/__tests__/components/TokenInput.test.tsx
deleted file mode 100644
index 6c67010b..00000000
--- a/__tests__/components/TokenInput.test.tsx
+++ /dev/null
@@ -1,98 +0,0 @@
-import { fireEvent, render } from '@testing-library/react'
-import BigNumber from 'bignumber.js'
-
-import TokenInput from 'components/TokenInput'
-import { ASSETS } from 'constants/assets'
-
-jest.mock('components/DisplayCurrency', () => {
-  return {
-    __esModule: true,
-    default: (props: any) =>
-      require('utils/testing').createMockComponent('mock-display-currency-component', props),
-  }
-})
-
-describe('<TokenInput />', () => {
-  const asset = ASSETS[0]
-  const defaultProps = {
-    amount: new BigNumber(1),
-    asset,
-    max: new BigNumber(100),
-    onChangeAsset: jest.fn(),
-    onChange: jest.fn(),
-  }
-
-  afterAll(() => {
-    jest.unmock('components/DisplayCurrency')
-  })
-
-  it('should render', () => {
-    const { container } = render(<TokenInput warningMessages={[]} {...defaultProps} />)
-    expect(container).toBeInTheDocument()
-  })
-
-  it('should handle `className` prop correctly', () => {
-    const testClass = 'test-class'
-    const { getByTestId } = render(
-      <TokenInput warningMessages={[]} {...defaultProps} className={testClass} />,
-    )
-    expect(getByTestId('token-input-component')).toHaveClass(testClass)
-  })
-
-  it('should handle `disabled` prop correctly', () => {
-    const { getByTestId } = render(
-      <TokenInput warningMessages={[]} {...defaultProps} disabled={true} />,
-    )
-    expect(getByTestId('token-input-component')).toHaveClass('pointer-events-none', 'opacity-50')
-  })
-
-  it('should handle `maxText` prop correctly', () => {
-    const { getByTestId } = render(
-      <TokenInput warningMessages={[]} {...defaultProps} maxText='Max' />,
-    )
-    expect(getByTestId('token-input-max-button')).toBeInTheDocument()
-  })
-
-  describe('should render the max button', () => {
-    it('when `maxText` prop is defined', () => {
-      const { getByTestId } = render(
-        <TokenInput warningMessages={[]} {...defaultProps} maxText='Max' />,
-      )
-      expect(getByTestId('token-input-max-button')).toBeInTheDocument()
-    })
-    it('not when `maxText` prop is undefined', () => {
-      const { queryByTestId } = render(<TokenInput warningMessages={[]} {...defaultProps} />)
-      expect(queryByTestId('token-input-max-button')).not.toBeInTheDocument()
-    })
-  })
-
-  describe('should render <Select />', () => {
-    it('when `hasSelect` prop is true and balances is defined', () => {
-      const { getByTestId } = render(
-        <TokenInput warningMessages={[]} {...defaultProps} balances={[]} hasSelect />,
-      )
-      expect(getByTestId('select-component')).toBeInTheDocument()
-    })
-    it('not when `hasSelect` prop is true and balances is not defined', () => {
-      const { queryByTestId } = render(
-        <TokenInput warningMessages={[]} {...defaultProps} hasSelect />,
-      )
-      expect(queryByTestId('select-component')).not.toBeInTheDocument()
-    })
-    it('not when `hasSelect` prop is false and balances is defined', () => {
-      const { queryByTestId } = render(
-        <TokenInput warningMessages={[]} {...defaultProps} balances={[]} />,
-      )
-      expect(queryByTestId('select-component')).not.toBeInTheDocument()
-    })
-  })
-
-  it('should call onMaxBtnClick when the user clicks on max button', () => {
-    const { getByTestId } = render(
-      <TokenInput warningMessages={[]} {...defaultProps} maxText='max' />,
-    )
-    const maxBtn = getByTestId('token-input-max-button')
-    fireEvent.click(maxBtn)
-    expect(defaultProps.onChange).toBeCalledWith(defaultProps.max)
-  })
-})
diff --git a/__tests__/components/Tooltip/Tooltip.test.tsx b/__tests__/components/Tooltip/Tooltip.test.tsx
deleted file mode 100644
index 9f2a3894..00000000
--- a/__tests__/components/Tooltip/Tooltip.test.tsx
+++ /dev/null
@@ -1,45 +0,0 @@
-import { render } from '@testing-library/react'
-
-import { Tooltip } from 'components/Tooltip'
-
-describe('<Tooltip />', () => {
-  const defaultProps = {
-    content: <></>,
-  }
-
-  it('should render', () => {
-    const { container } = render(<Tooltip {...defaultProps} type='info' />)
-    expect(container).toBeInTheDocument()
-  })
-
-  it('should handle `children` prop correctly', () => {
-    const { getByTestId } = render(
-      <Tooltip {...defaultProps} type='info'>
-        <p data-testid='test-child'>Test text</p>
-      </Tooltip>,
-    )
-    expect(getByTestId('test-child')).toBeInTheDocument()
-  })
-
-  it('should handle `className` prop correctly', () => {
-    const testClass = 'test-class'
-    const { container } = render(<Tooltip {...defaultProps} type='info' className={testClass} />)
-    expect(container.getElementsByClassName(testClass)).toHaveLength(1)
-  })
-
-  describe('should handle `underline` prop correctly', () => {
-    it('should have border class when children are passed', () => {
-      const { container } = render(
-        <Tooltip {...defaultProps} type='info' underline>
-          <></>
-        </Tooltip>,
-      )
-      expect(container.getElementsByClassName('border-b-1')).toHaveLength(1)
-    })
-
-    it('should not have border class when children are passed', () => {
-      const { container } = render(<Tooltip {...defaultProps} type='info' underline />)
-      expect(container.getElementsByClassName('border-b-1')).toHaveLength(0)
-    })
-  })
-})
diff --git a/__tests__/components/Tooltip/TooltipContent.test.tsx b/__tests__/components/Tooltip/TooltipContent.test.tsx
deleted file mode 100644
index a7e114c1..00000000
--- a/__tests__/components/Tooltip/TooltipContent.test.tsx
+++ /dev/null
@@ -1,43 +0,0 @@
-import { render } from '@testing-library/react'
-
-import TooltipContent from 'components/Tooltip/TooltipContent'
-
-describe('<Tooltip />', () => {
-  const defaultProps = {
-    content: <></>,
-  }
-
-  it('should render', () => {
-    const { container } = render(<TooltipContent {...defaultProps} type='info' />)
-    expect(container).toBeInTheDocument()
-  })
-
-  it('should handle `type` prop correctly', () => {
-    const types = { info: 'bg-white/20', warning: 'bg-warning', error: 'bg-error' }
-    Object.entries(types).forEach(([key, value]) => {
-      const { container } = render(<TooltipContent {...defaultProps} type={key as TooltipType} />)
-      expect(container.getElementsByClassName(value)).toHaveLength(1)
-    })
-  })
-
-  describe('should handle `content` props correctly', () => {
-    it('should render Text component when type is string', () => {
-      const testText = 'testText'
-      const { getByTestId } = render(
-        <TooltipContent {...defaultProps} type='info' content={testText} />,
-      )
-      const textComponent = getByTestId('text-component')
-      expect(textComponent).toHaveTextContent(testText)
-    })
-
-    it('should render content when type is ReactNode', () => {
-      const testNode = <p data-testid='test-node'>Test node</p>
-      const { queryByTestId } = render(
-        <TooltipContent {...defaultProps} type='info' content={testNode} />,
-      )
-
-      expect(queryByTestId('text-component')).not.toBeInTheDocument()
-      expect(queryByTestId('test-node')).toBeInTheDocument()
-    })
-  })
-})
diff --git a/jest.config.js b/jest.config.js
deleted file mode 100644
index 377aee24..00000000
--- a/jest.config.js
+++ /dev/null
@@ -1,60 +0,0 @@
-module.exports = {
-  collectCoverage: true,
-  coverageProvider: 'v8',
-  collectCoverageFrom: [
-    '**/*.{js,jsx,ts,tsx}',
-    '!**/*.d.ts',
-    '!**/node_modules/**',
-    '!<rootDir>/out/**',
-    '!<rootDir>/.next/**',
-    '!<rootDir>/*.config.js',
-    '!<rootDir>/coverage/**',
-    '!<rootDir>/src/types/**',
-    '!<rootDir>/src/utils/charting_library/**',
-    '!<rootDir>/src/utils/datafeeds/**',
-    '!<rootDir>/public/charting_library/**',
-    '!<rootDir>/public/datafeeds/**',
-    '!<rootDir>/src/utils/health_computer/**',
-  ],
-  moduleNameMapper: {
-    // Handle CSS imports (with CSS modules)
-    // https://jestjs.io/docs/webpack#mocking-css-modules
-    '^.+\\.module\\.(css|sass|scss)$': 'identity-obj-proxy',
-
-    // Handle CSS imports (without CSS modules)
-    '^.+\\.(css|sass|scss)$': '<rootDir>/__mocks__/styleMock.js',
-
-    // Handle image imports
-    // https://jestjs.io/docs/webpack#handling-static-assets
-    '^.+\\.(png|jpg|jpeg|gif|webp|avif|ico|bmp)$/i': `<rootDir>/__mocks__/fileMock.js`,
-    '^.+\\.svg$': `<rootDir>/__mocks__/svgMock.js`,
-
-    // Handle module aliases
-    '^app/(.*)$': '<rootDir>/src/app/$1',
-    '^api/(.*)$': '<rootDir>/src/api/$1',
-    '^components/(.*)$': '<rootDir>/src/components/$1',
-    '^constants/(.*)$': '<rootDir>/src/constants/$1',
-    '^fonts/(.*)$': '<rootDir>/src/fonts/$1',
-    '^hooks/(.*)$': '<rootDir>/src/hooks/$1',
-    '^pages/(.*)$': '<rootDir>/src/pages/$1',
-    '^store/(.*)$': '<rootDir>/src/store/$1',
-    '^styles/(.*)$': '<rootDir>/src/styles/$1',
-    '^types/(.*)$': '<rootDir>/src/types/$1',
-    '^utils/(.*)$': '<rootDir>/src/utils/$1',
-    '^store': '<rootDir>/src/store',
-  },
-  // Add more setup options before each test is run
-  setupFilesAfterEnv: [
-    '<rootDir>/jest.setup.js',
-    '<rootDir>/__mocks__/store.js',
-    '<rootDir>/__mocks__/helmet.js',
-  ],
-  testPathIgnorePatterns: ['<rootDir>/node_modules/', '<rootDir>/.next/'],
-  testEnvironment: 'jsdom',
-  transform: {
-    // Use babel-jest to transpile tests with the next/babel preset
-    // https://jestjs.io/docs/configuration#transform-objectstring-pathtotransformer--pathtotransformer-object
-    '^.+\\.(js|jsx|ts|tsx)$': ['babel-jest', { presets: ['next/babel'] }],
-  },
-  transformIgnorePatterns: ['/node_modules/', '^.+\\.module\\.(css|sass|scss)$'],
-}
diff --git a/jest.setup.js b/jest.setup.js
deleted file mode 100644
index 264828a9..00000000
--- a/jest.setup.js
+++ /dev/null
@@ -1 +0,0 @@
-import '@testing-library/jest-dom/extend-expect'
diff --git a/package.json b/package.json
index a11c1059..ef1e29ba 100644
--- a/package.json
+++ b/package.json
@@ -1,14 +1,12 @@
 {
   "name": "mars-v2-frontend",
-  "version": "2.1.2",
+  "version": "2.2.0",
   "private": true,
   "scripts": {
     "build": "yarn validate-env && next build",
     "dev": "next dev",
-    "test": "jest",
-    "test:cov": "jest --coverage",
     "lint": "eslint ./src/ && yarn prettier-check",
-    "format": "eslint ./src/ ./__tests__/ --fix && prettier --write ./src/ ./__tests__/",
+    "format": "eslint ./src/ --fix && prettier --write ./src/ ",
     "prettier-check": "prettier --ignore-path .gitignore --check ./src/",
     "start": "next start",
     "validate-env": "node ./validate-env",
@@ -17,15 +15,15 @@
   },
   "lint-staged": {
     "*.ts*": [
-      "eslint ./src/ ./__tests__/ --fix",
-      "prettier --write ./src/ ./__tests__/"
+      "eslint ./src/ --fix",
+      "prettier --write ./src/"
     ]
   },
   "dependencies": {
-    "@cosmjs/cosmwasm-stargate": "^0.31.1",
+    "@cosmjs/cosmwasm-stargate": "^0.32.2",
     "@delphi-labs/shuttle-react": "^3.10.0",
     "@keplr-wallet/cosmos": "^0.12.42",
-    "@sentry/nextjs": "^7.84.0",
+    "@sentry/nextjs": "^7.94.1",
     "@splinetool/react-spline": "^2.2.6",
     "@splinetool/runtime": "^0.9.521",
     "@tailwindcss/container-queries": "^0.1.1",
@@ -45,40 +43,35 @@
     "react-draggable": "^4.4.6",
     "react-helmet-async": "^2.0.3",
     "react-qr-code": "^2.0.12",
-    "react-router-dom": "^6.17.0",
+    "react-router-dom": "^6.21.3",
     "react-spring": "^9.7.3",
     "react-toastify": "^9.1.3",
     "react-use-clipboard": "^1.0.9",
     "recharts": "^2.10.1",
-    "sharp": "^0.33.0",
+    "sharp": "^0.33.2",
     "swr": "^2.2.4",
     "tailwind-scrollbar-hide": "^1.1.7",
-    "zustand": "^4.4.6"
+    "zustand": "^4.4.7"
   },
   "devDependencies": {
     "@svgr/webpack": "^8.1.0",
-    "@testing-library/jest-dom": "^5.17.0",
-    "@testing-library/react": "^14.0.0",
     "@types/debounce-promise": "^3.1.9",
     "@types/lodash.debounce": "^4.0.9",
     "@types/lodash.throttle": "^4.1.8",
-    "@types/node": "^20.8.6",
+    "@types/node": "^20.10.6",
     "@types/react": "18.2.41",
     "@types/react-dom": "18.2.15",
     "@types/react-helmet": "^6.1.11",
     "autoprefixer": "^10.4.16",
-    "babel-jest": "^29.7.0",
     "dotenv": "^16.3.1",
     "dotenv-cli": "^7.3.0",
-    "eslint": "^8.54.0",
+    "eslint": "^8.56.0",
     "eslint-config-next": "^14.0.4",
     "eslint-plugin-import": "^2.29.0",
     "husky": "^8.0.3",
     "identity-obj-proxy": "^3.0.0",
-    "jest": "^29.7.0",
-    "jest-environment-jsdom": "^29.7.0",
     "lint-staged": "^15.2.0",
-    "prettier": "^3.0.3",
+    "prettier": "^3.2.4",
     "prettier-plugin-tailwindcss": "^0.5.6",
     "shelljs": "^0.8.5",
     "tailwindcss": "^3.3.3",
diff --git a/public/images/tokens/ntrn.svg b/public/images/tokens/ntrn.svg
new file mode 100644
index 00000000..4fc072f5
--- /dev/null
+++ b/public/images/tokens/ntrn.svg
@@ -0,0 +1,16 @@
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 24 24">
+  <path
+    fill="#FFF"
+    d="M23.6,14.9C22,21.3,15.5,25.2,9,23.6C2.6,22-1.3,15.5,0.3,9.1S8.4-1.2,14.8,0.4C21.3,2,25.2,8.5,23.6,14.9
+        L23.6,14.9L23.6,14.9z"
+  />
+  <path
+    fill="#000"
+    d="M12,15.1c-1.7,0-3.1-1.4-3.1-3.1c0-0.6,0.2-1.2,0.5-1.6L5.4,7.1v11.5h11.5l-3.3-3.9C13.1,15,12.5,15.1,12,15.1z
+        "
+  />
+  <path
+    fill="#000"
+    d="M6.4,5.4l3.5,4.2c0.5-0.5,1.3-0.8,2-0.8c1.7,0,3.1,1.4,3.1,3.1c0,0.7-0.3,1.4-0.7,2l4.1,3.6V5.4H6.4z"
+  />
+</svg>
diff --git a/public/images/wallets/vectis.png b/public/images/wallets/vectis.png
new file mode 100644
index 00000000..f2434fd9
Binary files /dev/null and b/public/images/wallets/vectis.png differ
diff --git a/public/images/wallets/xdefi.png b/public/images/wallets/xdefi.png
index 5342a2cc..df50e131 100644
Binary files a/public/images/wallets/xdefi.png and b/public/images/wallets/xdefi.png differ
diff --git a/public/tradingview.css b/public/tradingview.css
index fbbc05d9..c0031ccc 100644
--- a/public/tradingview.css
+++ b/public/tradingview.css
@@ -40,6 +40,16 @@
   cursor: pointer;
 }
 
+.layout__area--center {
+  background: var(--tv-background) !important;
+}
+
+.chart-widget.chart-widget--themed-dark.chart-widget__top--themed-dark.chart-widget__bottom--themed-dark
+  > table
+  canvas {
+  background: transparent !important;
+}
+
 /* Floating menu */
 .floating-toolbar-react-widgets__button:hover,
 [class^='button-']:hover:before {
diff --git a/src/api/accounts/getAccount.ts b/src/api/accounts/getAccount.ts
index b73f7a89..b1bdb98f 100644
--- a/src/api/accounts/getAccount.ts
+++ b/src/api/accounts/getAccount.ts
@@ -3,21 +3,25 @@ import { getCreditManagerQueryClient } from 'api/cosmwasm-client'
 import getDepositedVaults from 'api/vaults/getDepositedVaults'
 import { BNCoin } from 'types/classes/BNCoin'
 import { Positions } from 'types/generated/mars-credit-manager/MarsCreditManager.types'
+import { resolvePerpsPositions } from 'utils/resolvers'
 
-export default async function getAccount(accountId?: string): Promise<Account> {
+export default async function getAccount(
+  chainConfig: ChainConfig,
+  accountId?: string,
+): Promise<Account> {
   if (!accountId) return new Promise((_, reject) => reject('No account ID found'))
 
-  const creditManagerQueryClient = await getCreditManagerQueryClient()
+  const creditManagerQueryClient = await getCreditManagerQueryClient(chainConfig)
 
   const accountPosition: Positions = await cacheFn(
     () => creditManagerQueryClient.positions({ accountId: accountId }),
     positionsCache,
-    `account/${accountId}`,
+    `${chainConfig.id}/account/${accountId}`,
   )
 
   const accountKind = await creditManagerQueryClient.accountKind({ accountId: accountId })
 
-  const depositedVaults = await getDepositedVaults(accountId, accountPosition)
+  const depositedVaults = await getDepositedVaults(accountId, chainConfig, accountPosition)
 
   if (accountPosition) {
     return {
@@ -26,6 +30,7 @@ export default async function getAccount(accountId?: string): Promise<Account> {
       lends: accountPosition.lends.map((lend) => new BNCoin(lend)),
       deposits: accountPosition.deposits.map((deposit) => new BNCoin(deposit)),
       vaults: depositedVaults,
+      perps: resolvePerpsPositions(accountPosition.perps),
       kind: accountKind,
     }
   }
diff --git a/src/api/cosmwasm-client.ts b/src/api/cosmwasm-client.ts
index a4fa92c6..bca16491 100644
--- a/src/api/cosmwasm-client.ts
+++ b/src/api/cosmwasm-client.ts
@@ -1,6 +1,5 @@
 import { CosmWasmClient } from '@cosmjs/cosmwasm-stargate'
 
-import { ENV } from 'constants/env'
 import { ICNSQueryClient } from 'types/classes/ICNSClient.client'
 import { MarsAccountNftQueryClient } from 'types/generated/mars-account-nft/MarsAccountNft.client'
 import { MarsCreditManagerQueryClient } from 'types/generated/mars-credit-manager/MarsCreditManager.client'
@@ -8,142 +7,187 @@ import { MarsIncentivesQueryClient } from 'types/generated/mars-incentives/MarsI
 import { MarsMockVaultQueryClient } from 'types/generated/mars-mock-vault/MarsMockVault.client'
 import { MarsOracleOsmosisQueryClient } from 'types/generated/mars-oracle-osmosis/MarsOracleOsmosis.client'
 import { MarsParamsQueryClient } from 'types/generated/mars-params/MarsParams.client'
+import { MarsPerpsQueryClient } from 'types/generated/mars-perps/MarsPerps.client'
 import { MarsRedBankQueryClient } from 'types/generated/mars-red-bank/MarsRedBank.client'
 import { MarsSwapperOsmosisQueryClient } from 'types/generated/mars-swapper-osmosis/MarsSwapperOsmosis.client'
 
-let _cosmWasmClient: CosmWasmClient
-let _accountNftQueryClient: MarsAccountNftQueryClient
-let _creditManagerQueryClient: MarsCreditManagerQueryClient
-let _oracleQueryClient: MarsOracleOsmosisQueryClient
-let _redBankQueryClient: MarsRedBankQueryClient
-let _paramsQueryClient: MarsParamsQueryClient
-let _incentivesQueryClient: MarsIncentivesQueryClient
-let _swapperOsmosisClient: MarsSwapperOsmosisQueryClient
-let _ICNSQueryClient: ICNSQueryClient
+let _cosmWasmClient: Map<string, CosmWasmClient> = new Map()
+let _accountNftQueryClient: Map<string, MarsAccountNftQueryClient> = new Map()
+let _creditManagerQueryClient: Map<string, MarsCreditManagerQueryClient> = new Map()
+let _oracleQueryClient: Map<string, MarsOracleOsmosisQueryClient> = new Map()
+let _redBankQueryClient: Map<string, MarsRedBankQueryClient> = new Map()
+let _paramsQueryClient: Map<string, MarsParamsQueryClient> = new Map()
+let _incentivesQueryClient: Map<string, MarsIncentivesQueryClient> = new Map()
+let _swapperOsmosisClient: Map<string, MarsSwapperOsmosisQueryClient> = new Map()
+let _perpsClient: Map<string, MarsPerpsQueryClient> = new Map()
+let _ICNSQueryClient: Map<string, ICNSQueryClient> = new Map()
 
-const getClient = async () => {
+const getClient = async (rpc: string) => {
   try {
-    if (!_cosmWasmClient) {
-      _cosmWasmClient = await CosmWasmClient.connect(ENV.URL_RPC)
+    if (!_cosmWasmClient.get(rpc)) {
+      const client = await CosmWasmClient.connect(rpc)
+      _cosmWasmClient.set(rpc, client)
     }
 
-    return _cosmWasmClient
+    return _cosmWasmClient.get(rpc)!
   } catch (error) {
     throw error
   }
 }
 
-const getAccountNftQueryClient = async () => {
+const getAccountNftQueryClient = async (chainConfig: ChainConfig) => {
   try {
-    if (!_accountNftQueryClient) {
-      const client = await getClient()
-      _accountNftQueryClient = new MarsAccountNftQueryClient(client, ENV.ADDRESS_ACCOUNT_NFT)
+    const contract = chainConfig.contracts.accountNft
+    const rpc = chainConfig.endpoints.rpc
+    const key = rpc + contract
+
+    if (!_accountNftQueryClient.get(key)) {
+      const client = await getClient(rpc)
+      _accountNftQueryClient.set(key, new MarsAccountNftQueryClient(client, contract))
     }
 
-    return _accountNftQueryClient
+    return _accountNftQueryClient.get(key)!
   } catch (error) {
     throw error
   }
 }
 
-const getCreditManagerQueryClient = async () => {
+const getCreditManagerQueryClient = async (chainConfig: ChainConfig) => {
   try {
-    if (!_creditManagerQueryClient) {
-      const client = await getClient()
-      _creditManagerQueryClient = new MarsCreditManagerQueryClient(
-        client,
-        ENV.ADDRESS_CREDIT_MANAGER,
-      )
+    const contract = chainConfig.contracts.creditManager
+    const rpc = chainConfig.endpoints.rpc
+    const key = rpc + contract
+
+    if (!_creditManagerQueryClient.get(key)) {
+      const client = await getClient(rpc)
+      _creditManagerQueryClient.set(key, new MarsCreditManagerQueryClient(client, contract))
     }
 
-    return _creditManagerQueryClient
+    return _creditManagerQueryClient.get(key)!
   } catch (error) {
     throw error
   }
 }
 
-const getParamsQueryClient = async () => {
+const getParamsQueryClient = async (chainConfig: ChainConfig) => {
   try {
-    if (!_paramsQueryClient) {
-      const client = await getClient()
-      _paramsQueryClient = new MarsParamsQueryClient(client, ENV.ADDRESS_PARAMS)
+    const contract = chainConfig.contracts.params
+    const rpc = chainConfig.endpoints.rpc
+    const key = rpc + contract
+
+    if (!_paramsQueryClient.get(key)) {
+      const client = await getClient(rpc)
+      _paramsQueryClient.set(key, new MarsParamsQueryClient(client, contract))
     }
 
-    return _paramsQueryClient
+    return _paramsQueryClient.get(key)!
   } catch (error) {
     throw error
   }
 }
 
-const getOracleQueryClient = async () => {
+const getOracleQueryClient = async (chainConfig: ChainConfig) => {
   try {
-    if (!_oracleQueryClient) {
-      const client = await getClient()
-      _oracleQueryClient = new MarsOracleOsmosisQueryClient(client, ENV.ADDRESS_ORACLE)
+    const contract = chainConfig.contracts.oracle
+    const rpc = chainConfig.endpoints.rpc
+    const key = rpc + contract
+
+    if (!_oracleQueryClient.get(key)) {
+      const client = await getClient(rpc)
+      _oracleQueryClient.set(key, new MarsOracleOsmosisQueryClient(client, contract))
     }
 
-    return _oracleQueryClient
+    return _oracleQueryClient.get(key)!
   } catch (error) {
     throw error
   }
 }
 
-const getRedBankQueryClient = async () => {
+const getRedBankQueryClient = async (chainConfig: ChainConfig) => {
   try {
-    if (!_redBankQueryClient) {
-      const client = await getClient()
-      _redBankQueryClient = new MarsRedBankQueryClient(client, ENV.ADDRESS_RED_BANK)
+    const contract = chainConfig.contracts.redBank
+    const rpc = chainConfig.endpoints.rpc
+    const key = rpc + contract
+
+    if (!_redBankQueryClient.get(key)) {
+      const client = await getClient(rpc)
+      _redBankQueryClient.set(key, new MarsRedBankQueryClient(client, contract))
     }
 
-    return _redBankQueryClient
+    return _redBankQueryClient.get(key)!
   } catch (error) {
     throw error
   }
 }
 
-const getVaultQueryClient = async (address: string) => {
+const getVaultQueryClient = async (chainConfig: ChainConfig, address: string) => {
   try {
-    const client = await getClient()
+    const client = await getClient(chainConfig.endpoints.rpc)
     return new MarsMockVaultQueryClient(client, address)
   } catch (error) {
     throw error
   }
 }
 
-const getIncentivesQueryClient = async () => {
+const getIncentivesQueryClient = async (chainConfig: ChainConfig) => {
   try {
-    if (!_incentivesQueryClient) {
-      const client = await getClient()
-      _incentivesQueryClient = new MarsIncentivesQueryClient(client, ENV.ADDRESS_INCENTIVES)
+    const contract = chainConfig.contracts.incentives
+    const rpc = chainConfig.endpoints.rpc
+    const key = rpc + contract
+    if (!_incentivesQueryClient.get(key)) {
+      const client = await getClient(rpc)
+      _incentivesQueryClient.set(key, new MarsIncentivesQueryClient(client, contract))
     }
 
-    return _incentivesQueryClient
+    return _incentivesQueryClient.get(key)!
   } catch (error) {
     throw error
   }
 }
 
-const getSwapperQueryClient = async () => {
+const getSwapperQueryClient = async (chainConfig: ChainConfig) => {
   try {
-    if (!_swapperOsmosisClient) {
-      const client = await getClient()
-      _swapperOsmosisClient = new MarsSwapperOsmosisQueryClient(client, ENV.ADDRESS_SWAPPER)
+    const contract = chainConfig.contracts.swapper
+    const rpc = chainConfig.endpoints.rpc
+    const key = rpc + contract
+    if (!_swapperOsmosisClient.get(key)) {
+      const client = await getClient(rpc)
+      _swapperOsmosisClient.set(key, new MarsSwapperOsmosisQueryClient(client, contract))
     }
 
-    return _swapperOsmosisClient
+    return _swapperOsmosisClient.get(key)!
   } catch (error) {
     throw error
   }
 }
 
-const getICNSQueryClient = async () => {
+const getPerpsQueryClient = async (chainConfig: ChainConfig) => {
   try {
-    if (!_ICNSQueryClient) {
-      const client = await getClient()
-      _ICNSQueryClient = new ICNSQueryClient(client)
+    const contract = chainConfig.contracts.perps
+    const rpc = chainConfig.endpoints.rpc
+    const key = rpc + contract
+    if (!_perpsClient.get(key)) {
+      const client = await getClient(rpc)
+      _perpsClient.set(key, new MarsPerpsQueryClient(client, contract))
     }
 
-    return _ICNSQueryClient
+    return _perpsClient.get(key)!
+  } catch (error) {
+    throw error
+  }
+}
+
+const getICNSQueryClient = async (chainConfig: ChainConfig) => {
+  try {
+    const contract = chainConfig.contracts.params
+    const rpc = chainConfig.endpoints.rpc
+    const key = rpc + contract
+    if (!_ICNSQueryClient.get(key)) {
+      const client = await getClient(rpc)
+      _ICNSQueryClient.set(key, new ICNSQueryClient(client))
+    }
+
+    return _ICNSQueryClient.get(key)!
   } catch (error) {
     throw error
   }
@@ -160,4 +204,5 @@ export {
   getRedBankQueryClient,
   getSwapperQueryClient,
   getVaultQueryClient,
+  getPerpsQueryClient,
 }
diff --git a/src/api/hls/getAprs.ts b/src/api/hls/getAprs.ts
index deaf4041..51c9086a 100644
--- a/src/api/hls/getAprs.ts
+++ b/src/api/hls/getAprs.ts
@@ -1,9 +1,8 @@
 import { cacheFn, stakingAprCache } from 'api/cache'
-import { ENV } from 'constants/env'
 
-export default async function getStakingAprs() {
+export default async function getStakingAprs(url: string) {
   try {
-    return cacheFn(() => fetchAprs(), stakingAprCache, `stakingAprs`)
+    return cacheFn(() => fetchAprs(url), stakingAprCache, `stakingAprs`)
   } catch (error) {
     throw error
   }
@@ -13,9 +12,7 @@ interface StakingAprResponse {
   stats: StakingApr[]
 }
 
-async function fetchAprs(): Promise<StakingApr[]> {
-  const url = ENV.STRIDE_APRS
-
+async function fetchAprs(url: string): Promise<StakingApr[]> {
   const response = await fetch(url)
   const body = (await response.json()) as StakingAprResponse
   return body.stats
diff --git a/src/api/hls/getHLSStakingAccounts.ts b/src/api/hls/getHLSStakingAccounts.ts
index 3b5ab3eb..8431253c 100644
--- a/src/api/hls/getHLSStakingAccounts.ts
+++ b/src/api/hls/getHLSStakingAccounts.ts
@@ -4,24 +4,29 @@ import getAccounts from 'api/wallets/getAccounts'
 import { calculateAccountLeverage, getAccountPositionValues, isAccountEmpty } from 'utils/accounts'
 
 export default async function getHLSStakingAccounts(
+  chainConfig: ChainConfig,
   address?: string,
 ): Promise<HLSAccountWithStrategy[]> {
-  const accounts = await getAccounts('high_levered_strategy', address)
+  const accounts = await getAccounts('high_levered_strategy', chainConfig, address)
   const activeAccounts = accounts.filter((account) => !isAccountEmpty(account))
-  const hlsStrategies = await getHLSStakingAssets()
-  const prices = await getPrices()
+  const hlsStrategies = await getHLSStakingAssets(chainConfig)
+  const prices = await getPrices(chainConfig)
   const hlsAccountsWithStrategy: HLSAccountWithStrategy[] = []
 
   activeAccounts.forEach((account) => {
     if (account.deposits.length === 0) return
 
     const strategy = hlsStrategies.find(
-      (strategy) => strategy.denoms.deposit === account.deposits.at(0).denom,
+      (strategy) => strategy.denoms.deposit === account.deposits[0].denom,
     )
 
     if (!strategy) return
 
-    const [deposits, lends, debts, vaults] = getAccountPositionValues(account, prices)
+    const [deposits, lends, debts, vaults] = getAccountPositionValues(
+      account,
+      prices,
+      chainConfig.assets,
+    )
 
     hlsAccountsWithStrategy.push({
       ...account,
@@ -31,7 +36,7 @@ export default async function getHLSStakingAccounts(
         debt: debts,
         total: deposits,
       },
-      leverage: calculateAccountLeverage(account, prices).toNumber(),
+      leverage: calculateAccountLeverage(account, prices, chainConfig.assets).toNumber(),
     })
   })
 
diff --git a/src/api/hls/getHLSStakingAssets.ts b/src/api/hls/getHLSStakingAssets.ts
index 58a05526..0ef28f69 100644
--- a/src/api/hls/getHLSStakingAssets.ts
+++ b/src/api/hls/getHLSStakingAssets.ts
@@ -1,28 +1,29 @@
 import { getParamsQueryClient } from 'api/cosmwasm-client'
 import getStakingAprs from 'api/hls/getAprs'
 import getAssetParams from 'api/params/getAssetParams'
-import { getAssetByDenom, getStakingAssets } from 'utils/assets'
+import { byDenom } from 'utils/array'
 import { BN } from 'utils/helpers'
 import { resolveHLSStrategies } from 'utils/resolvers'
 
-export default async function getHLSStakingAssets() {
-  const stakingAssetDenoms = getStakingAssets().map((asset) => asset.denom)
-  const assetParams = await getAssetParams()
+export default async function getHLSStakingAssets(chainConfig: ChainConfig) {
+  const stakingAssetDenoms = chainConfig.assets
+    .filter((asset) => asset.isStaking)
+    .map((asset) => asset.denom)
+  const assetParams = await getAssetParams(chainConfig)
   const HLSAssets = assetParams
     .filter((asset) => stakingAssetDenoms.includes(asset.denom))
     .filter((asset) => asset.credit_manager.hls)
   const strategies = resolveHLSStrategies('coin', HLSAssets)
-
-  const client = await getParamsQueryClient()
+  const client = await getParamsQueryClient(chainConfig)
   const depositCaps$ = strategies.map((strategy) =>
     client.totalDeposit({ denom: strategy.denoms.deposit }),
   )
 
-  const aprs = await getStakingAprs()
+  const aprs = await getStakingAprs(chainConfig.endpoints.aprs.stride)
 
   return Promise.all(depositCaps$).then((depositCaps) => {
     return depositCaps.map((depositCap, index) => {
-      const borrowSymbol = getAssetByDenom(strategies[index].denoms.borrow)?.symbol
+      const borrowSymbol = chainConfig.assets.find(byDenom(strategies[index].denoms.borrow))?.symbol
       return {
         ...strategies[index],
         depositCap: {
diff --git a/src/api/hls/getHLSVaults.ts b/src/api/hls/getHLSVaults.ts
index 2b09a9b3..6761af77 100644
--- a/src/api/hls/getHLSVaults.ts
+++ b/src/api/hls/getHLSVaults.ts
@@ -4,10 +4,10 @@ import { getVaultConfigs } from 'api/vaults/getVaultConfigs'
 import { BN } from 'utils/helpers'
 import { resolveHLSStrategies } from 'utils/resolvers'
 
-export default async function getHLSVaults() {
-  const assetParams = await getAssetParams()
-  const client = await getCreditManagerQueryClient()
-  const vaultConfigs = await getVaultConfigs()
+export default async function getHLSVaults(chainConfig: ChainConfig) {
+  const assetParams = await getAssetParams(chainConfig)
+  const client = await getCreditManagerQueryClient(chainConfig)
+  const vaultConfigs = await getVaultConfigs(chainConfig)
   const HLSAssets = assetParams.filter((asset) => asset.credit_manager.hls)
   const strategies = resolveHLSStrategies('vault', HLSAssets)
 
diff --git a/src/api/incentives/calculateAssetIncentivesApy.ts b/src/api/incentives/calculateAssetIncentivesApy.ts
index d2c75c7c..243a952b 100644
--- a/src/api/incentives/calculateAssetIncentivesApy.ts
+++ b/src/api/incentives/calculateAssetIncentivesApy.ts
@@ -2,28 +2,28 @@ import getTotalActiveEmissionValue from 'api/incentives/getTotalActiveEmissionVa
 import getMarket from 'api/markets/getMarket'
 import getUnderlyingLiquidityAmount from 'api/markets/getMarketUnderlyingLiquidityAmount'
 import getPrice from 'api/prices/getPrice'
-import { ASSETS } from 'constants/assets'
 import { byDenom } from 'utils/array'
 import { SECONDS_IN_A_YEAR } from 'utils/constants'
 import { BN } from 'utils/helpers'
 
 export default async function calculateAssetIncentivesApy(
+  chainConfig: ChainConfig,
   denom: string,
 ): Promise<BigNumber | null> {
   try {
     const [totalActiveEmissionValue, market] = await Promise.all([
-      getTotalActiveEmissionValue(denom),
-      getMarket(denom),
+      getTotalActiveEmissionValue(chainConfig, denom),
+      getMarket(chainConfig, denom),
     ])
 
     if (!totalActiveEmissionValue) return null
 
     const [marketLiquidityAmount, assetPrice] = await Promise.all([
-      getUnderlyingLiquidityAmount(market),
-      getPrice(denom),
+      getUnderlyingLiquidityAmount(chainConfig, market),
+      getPrice(chainConfig, denom),
     ])
 
-    const assetDecimals = (ASSETS.find(byDenom(denom)) as Asset).decimals
+    const assetDecimals = (chainConfig.assets.find(byDenom(denom)) as Asset).decimals
 
     const marketLiquidityValue = BN(marketLiquidityAmount)
       .shiftedBy(-assetDecimals)
diff --git a/src/api/incentives/getTotalActiveEmissionValue.ts b/src/api/incentives/getTotalActiveEmissionValue.ts
index 082686ea..f71132a2 100644
--- a/src/api/incentives/getTotalActiveEmissionValue.ts
+++ b/src/api/incentives/getTotalActiveEmissionValue.ts
@@ -1,16 +1,16 @@
 import { cacheFn, emissionsCache } from 'api/cache'
 import { getIncentivesQueryClient } from 'api/cosmwasm-client'
 import getPrice from 'api/prices/getPrice'
-import { ASSETS } from 'constants/assets'
 import { BN_ZERO } from 'constants/math'
 import { byDenom } from 'utils/array'
 import { BN } from 'utils/helpers'
 
 export default async function getTotalActiveEmissionValue(
+  chainConfig: ChainConfig,
   denom: string,
 ): Promise<BigNumber | null> {
   try {
-    const client = await getIncentivesQueryClient()
+    const client = await getIncentivesQueryClient(chainConfig)
     const activeEmissions = await cacheFn(
       () =>
         client.activeEmissions({
@@ -26,12 +26,12 @@ export default async function getTotalActiveEmissionValue(
     }
 
     const prices = await Promise.all(
-      activeEmissions.map((activeEmission) => getPrice(activeEmission.denom)),
+      activeEmissions.map((activeEmission) => getPrice(chainConfig, activeEmission.denom)),
     )
 
     return activeEmissions.reduce((accumulation, current, index) => {
       const price = prices[index]
-      const decimals = ASSETS.find(byDenom(current.denom))?.decimals as number
+      const decimals = chainConfig.assets.find(byDenom(current.denom))?.decimals as number
       const emissionValue = BN(current.emission_rate).shiftedBy(-decimals).multipliedBy(price)
 
       return accumulation.plus(emissionValue)
diff --git a/src/api/incentives/getUnclaimedRewards.ts b/src/api/incentives/getUnclaimedRewards.ts
index 46df88d4..66304905 100644
--- a/src/api/incentives/getUnclaimedRewards.ts
+++ b/src/api/incentives/getUnclaimedRewards.ts
@@ -1,17 +1,19 @@
 import { cacheFn, unclaimedRewardsCache } from 'api/cache'
 import { getIncentivesQueryClient } from 'api/cosmwasm-client'
-import { ENV } from 'constants/env'
 import { BNCoin } from 'types/classes/BNCoin'
 import iterateContractQuery from 'utils/iterateContractQuery'
 
-export default async function getUnclaimedRewards(accountId: string): Promise<BNCoin[]> {
+export default async function getUnclaimedRewards(
+  chainConfig: ChainConfig,
+  accountId: string,
+): Promise<BNCoin[]> {
   try {
-    const client = await getIncentivesQueryClient()
+    const client = await getIncentivesQueryClient(chainConfig)
     const unclaimedRewards = await cacheFn(
       () =>
         iterateContractQuery(() =>
           client.userUnclaimedRewards({
-            user: ENV.ADDRESS_CREDIT_MANAGER,
+            user: chainConfig.contracts.creditManager,
             accountId,
           }),
         ),
diff --git a/src/api/markets/getMarket.ts b/src/api/markets/getMarket.ts
index add9d976..078bf5fc 100644
--- a/src/api/markets/getMarket.ts
+++ b/src/api/markets/getMarket.ts
@@ -2,14 +2,14 @@ import { cacheFn, marketCache } from 'api/cache'
 import { getParamsQueryClient, getRedBankQueryClient } from 'api/cosmwasm-client'
 import { resolveMarketResponse } from 'utils/resolvers'
 
-export default async function getMarket(denom: string): Promise<Market> {
-  return cacheFn(() => fetchMarket(denom), marketCache, denom, 60)
+export default async function getMarket(chainConfig: ChainConfig, denom: string): Promise<Market> {
+  return cacheFn(() => fetchMarket(chainConfig, denom), marketCache, denom, 60)
 }
 
-async function fetchMarket(denom: string) {
+async function fetchMarket(chainConfig: ChainConfig, denom: string) {
   try {
-    const redBankClient = await getRedBankQueryClient()
-    const paramsClient = await getParamsQueryClient()
+    const redBankClient = await getRedBankQueryClient(chainConfig)
+    const paramsClient = await getParamsQueryClient(chainConfig)
 
     const [market, assetParams, assetCap] = await Promise.all([
       redBankClient.market({ denom }),
diff --git a/src/api/markets/getMarketBorrowings.ts b/src/api/markets/getMarketBorrowings.ts
index 65cbdf1b..1b0c65b8 100644
--- a/src/api/markets/getMarketBorrowings.ts
+++ b/src/api/markets/getMarketBorrowings.ts
@@ -1,19 +1,21 @@
 import getMarketLiquidities from 'api/markets/getMarketLiquidities'
 import getMarkets from 'api/markets/getMarkets'
 import getPrices from 'api/prices/getPrices'
-import { getEnabledMarketAssets } from 'utils/assets'
 import { BN } from 'utils/helpers'
 
-export default async function getMarketBorrowings(): Promise<BorrowAsset[]> {
-  const liquidities = await getMarketLiquidities()
-  const enabledAssets = getEnabledMarketAssets()
-  const borrowEnabledMarkets = (await getMarkets()).filter((market: Market) => market.borrowEnabled)
-  const prices = await getPrices()
+export default async function getMarketBorrowings(
+  chainConfig: ChainConfig,
+): Promise<BorrowAsset[]> {
+  const liquidities = await getMarketLiquidities(chainConfig)
+  const borrowEnabledMarkets = (await getMarkets(chainConfig)).filter(
+    (market: Market) => market.borrowEnabled,
+  )
+  const prices = await getPrices(chainConfig)
 
   const borrow: BorrowAsset[] = borrowEnabledMarkets.map((market) => {
     const price = prices.find((coin) => coin.denom === market.denom)?.amount ?? '1'
     const amount = liquidities.find((coin) => coin.denom === market.denom)?.amount ?? '0'
-    const asset = enabledAssets.find((asset) => asset.denom === market.denom)!
+    const asset = chainConfig.assets.find((asset) => asset.denom === market.denom)!
 
     return {
       ...asset,
diff --git a/src/api/markets/getMarketDebts.ts b/src/api/markets/getMarketDebts.ts
index fc3dddf2..ab3e3c0f 100644
--- a/src/api/markets/getMarketDebts.ts
+++ b/src/api/markets/getMarketDebts.ts
@@ -3,10 +3,10 @@ import { getRedBankQueryClient } from 'api/cosmwasm-client'
 import getMarkets from 'api/markets/getMarkets'
 import { BNCoin } from 'types/classes/BNCoin'
 
-export default async function getMarketDebts(): Promise<BNCoin[]> {
+export default async function getMarketDebts(chainConfig: ChainConfig): Promise<BNCoin[]> {
   try {
-    const markets: Market[] = await getMarkets()
-    const redBankQueryClient = await getRedBankQueryClient()
+    const markets: Market[] = await getMarkets(chainConfig)
+    const redBankQueryClient = await getRedBankQueryClient(chainConfig)
 
     const debtQueries = markets.map((asset) =>
       cacheFn(
diff --git a/src/api/markets/getMarketDeposits.ts b/src/api/markets/getMarketDeposits.ts
index 57e46f58..824c824e 100644
--- a/src/api/markets/getMarketDeposits.ts
+++ b/src/api/markets/getMarketDeposits.ts
@@ -2,10 +2,12 @@ import getMarkets from 'api/markets/getMarkets'
 import getUnderlyingLiquidityAmount from 'api/markets/getMarketUnderlyingLiquidityAmount'
 import { BNCoin } from 'types/classes/BNCoin'
 
-export default async function getMarketDeposits(): Promise<BNCoin[]> {
+export default async function getMarketDeposits(chainConfig: ChainConfig): Promise<BNCoin[]> {
   try {
-    const markets: Market[] = await getMarkets()
-    const depositQueries = markets.map(getUnderlyingLiquidityAmount)
+    const markets: Market[] = await getMarkets(chainConfig)
+    const depositQueries = markets.map((market) =>
+      getUnderlyingLiquidityAmount(chainConfig, market),
+    )
     const depositsResults = await Promise.all(depositQueries)
 
     return depositsResults.map<BNCoin>(
diff --git a/src/api/markets/getMarketLiquidities.ts b/src/api/markets/getMarketLiquidities.ts
index 51a9be61..0c8cb3e0 100644
--- a/src/api/markets/getMarketLiquidities.ts
+++ b/src/api/markets/getMarketLiquidities.ts
@@ -1,11 +1,10 @@
-import { BN } from 'utils/helpers'
-import getMarketDeposits from 'api/markets/getMarketDeposits'
 import getMarketDebts from 'api/markets/getMarketDebts'
+import getMarketDeposits from 'api/markets/getMarketDeposits'
 import { BNCoin } from 'types/classes/BNCoin'
 
-export default async function getMarketLiquidities(): Promise<BNCoin[]> {
-  const deposits = await getMarketDeposits()
-  const debts = await getMarketDebts()
+export default async function getMarketLiquidities(chainConfig: ChainConfig): Promise<BNCoin[]> {
+  const deposits = await getMarketDeposits(chainConfig)
+  const debts = await getMarketDebts(chainConfig)
 
   const liquidity: BNCoin[] = deposits.map((deposit) => {
     const debt = debts.find((debt) => debt.denom === deposit.denom)
diff --git a/src/api/markets/getMarketUnderlyingLiquidityAmount.ts b/src/api/markets/getMarketUnderlyingLiquidityAmount.ts
index 44c5aa6e..e2fe4de0 100644
--- a/src/api/markets/getMarketUnderlyingLiquidityAmount.ts
+++ b/src/api/markets/getMarketUnderlyingLiquidityAmount.ts
@@ -1,18 +1,21 @@
 import { cacheFn, underlyingLiquidityAmountCache } from 'api/cache'
 import { getRedBankQueryClient } from 'api/cosmwasm-client'
 
-export default async function getUnderlyingLiquidityAmount(market: Market): Promise<string> {
+export default async function getUnderlyingLiquidityAmount(
+  chainConfig: ChainConfig,
+  market: Market,
+): Promise<string> {
   return cacheFn(
-    () => fetchUnderlyingLiquidityAmount(market),
+    () => fetchUnderlyingLiquidityAmount(chainConfig, market),
     underlyingLiquidityAmountCache,
     `underlyingLiquidity/${market.denom}/amount/${market.collateralTotalScaled}`,
     60,
   )
 }
 
-async function fetchUnderlyingLiquidityAmount(market: Market) {
+async function fetchUnderlyingLiquidityAmount(chainConfig: ChainConfig, market: Market) {
   try {
-    const client = await getRedBankQueryClient()
+    const client = await getRedBankQueryClient(chainConfig)
     return await client.underlyingLiquidityAmount({
       denom: market.denom,
       amountScaled: market.collateralTotalScaled,
diff --git a/src/api/markets/getMarkets.ts b/src/api/markets/getMarkets.ts
index e4babe8c..cbcc4370 100644
--- a/src/api/markets/getMarkets.ts
+++ b/src/api/markets/getMarkets.ts
@@ -6,36 +6,46 @@ import {
 } from 'types/generated/mars-params/MarsParams.types'
 import { Market as RedBankMarket } from 'types/generated/mars-red-bank/MarsRedBank.types'
 import { byDenom } from 'utils/array'
-import { getEnabledMarketAssets } from 'utils/assets'
 import iterateContractQuery from 'utils/iterateContractQuery'
 import { resolveMarketResponse } from 'utils/resolvers'
 
-export default async function getMarkets(): Promise<Market[]> {
+export default async function getMarkets(chainConfig: ChainConfig): Promise<Market[]> {
   try {
-    const redBankClient = await getRedBankQueryClient()
-    const paramsClient = await getParamsQueryClient()
+    const redBankClient = await getRedBankQueryClient(chainConfig)
+    const paramsClient = await getParamsQueryClient(chainConfig)
 
-    const enabledAssets = getEnabledMarketAssets()
-    const capQueries = enabledAssets.map((asset) =>
+    const marketAssets = chainConfig.assets.filter((asset) => asset.isMarket)
+
+    const capQueries = marketAssets
+      .filter((asset) => asset.isMarket)
+      .map((asset) =>
+        cacheFn(
+          () => paramsClient.totalDeposit({ denom: asset.denom }),
+          totalDepositCache,
+          `chains/${chainConfig.id}/enabledMarkets/${asset.denom}`,
+          60,
+        ),
+      )
+
+    const caps = await Promise.all(capQueries)
+
+    const [markets, assetParams, assetCaps] = await Promise.all([
       cacheFn(
-        () => paramsClient.totalDeposit({ denom: asset.denom }),
-        totalDepositCache,
-        `enabledMarkets/${asset.denom}`,
+        () => iterateContractQuery(redBankClient.markets),
+        marketsCache,
+        `chains/${chainConfig.id}/markets`,
         60,
       ),
-    )
-    const [markets, assetParams, assetCaps] = await Promise.all([
-      cacheFn(() => iterateContractQuery(redBankClient.markets), marketsCache, 'markets', 60),
       cacheFn(
         async () => await iterateContractQuery(paramsClient.allAssetParams),
         allParamsCache,
-        'params',
+        `chains/${chainConfig.id}/params`,
         60,
       ),
       Promise.all(capQueries),
     ])
 
-    return enabledAssets.map((asset) =>
+    return marketAssets.map((asset) =>
       resolveMarketResponse(
         markets.find(byDenom(asset.denom)) as RedBankMarket,
         assetParams.find(byDenom(asset.denom)) as AssetParams,
@@ -43,6 +53,7 @@ export default async function getMarkets(): Promise<Market[]> {
       ),
     )
   } catch (ex) {
+    console.log(ex)
     throw ex
   }
 }
diff --git a/src/api/params/getAssetParams.ts b/src/api/params/getAssetParams.ts
index d42ceee2..34e96071 100644
--- a/src/api/params/getAssetParams.ts
+++ b/src/api/params/getAssetParams.ts
@@ -3,15 +3,17 @@ import { getParamsQueryClient } from 'api/cosmwasm-client'
 import { AssetParamsBaseForAddr } from 'types/generated/mars-params/MarsParams.types'
 import iterateContractQuery from 'utils/iterateContractQuery'
 
-export default async function getAssetParams(): Promise<AssetParamsBaseForAddr[]> {
+export default async function getAssetParams(
+  chainConfig: ChainConfig,
+): Promise<AssetParamsBaseForAddr[]> {
   try {
     return await cacheFn(
       async () => {
-        const paramsQueryClient = await getParamsQueryClient()
+        const paramsQueryClient = await getParamsQueryClient(chainConfig)
         return iterateContractQuery(paramsQueryClient.allAssetParams)
       },
       assetParamsCache,
-      'assetParams',
+      `${chainConfig.id}/assetParams`,
       600,
     )
   } catch (ex) {
diff --git a/src/api/perps/getOpeningFee.ts b/src/api/perps/getOpeningFee.ts
new file mode 100644
index 00000000..f89d41c6
--- /dev/null
+++ b/src/api/perps/getOpeningFee.ts
@@ -0,0 +1,14 @@
+import { getPerpsQueryClient } from 'api/cosmwasm-client'
+import { BNCoin } from 'types/classes/BNCoin'
+
+export default async function getOpeningFee(
+  chainConfig: ChainConfig,
+  denom: string,
+  amount: string,
+) {
+  const perpsClient = await getPerpsQueryClient(chainConfig)
+
+  return perpsClient
+    .openingFee({ denom, size: amount as any })
+    .then((resp) => BNCoin.fromCoin(resp.fee))
+}
diff --git a/src/api/prices/getMarsPrice.ts b/src/api/prices/getMarsPrice.ts
index 906ad8df..b0cf2275 100644
--- a/src/api/prices/getMarsPrice.ts
+++ b/src/api/prices/getMarsPrice.ts
@@ -1,11 +1,10 @@
 import getPoolPrice from 'api/prices/getPoolPrice'
-import { ASSETS } from 'constants/assets'
 import { bySymbol } from 'utils/array'
 
-async function getMarsPrice() {
-  const marsAsset = ASSETS.find(bySymbol('MARS'))
+async function getMarsPrice(chainConfig: ChainConfig) {
+  const marsAsset = chainConfig.assets.find(bySymbol('MARS'))
   if (!marsAsset) return 0
-  return await getPoolPrice(marsAsset)
+  return await getPoolPrice(chainConfig, marsAsset)
 }
 
 export default getMarsPrice
diff --git a/src/api/prices/getOraclePrices.ts b/src/api/prices/getOraclePrices.ts
index 008b461c..335ffb00 100644
--- a/src/api/prices/getOraclePrices.ts
+++ b/src/api/prices/getOraclePrices.ts
@@ -1,5 +1,6 @@
 import { cacheFn, oraclePriceCache } from 'api/cache'
 import { getOracleQueryClient } from 'api/cosmwasm-client'
+import { BN_ZERO } from 'constants/math'
 import { PRICE_ORACLE_DECIMALS } from 'constants/query'
 import { BNCoin } from 'types/classes/BNCoin'
 import { PriceResponse } from 'types/generated/mars-oracle-osmosis/MarsOracleOsmosis.types'
@@ -7,15 +8,18 @@ import { byDenom } from 'utils/array'
 import { BN } from 'utils/helpers'
 import iterateContractQuery from 'utils/iterateContractQuery'
 
-export default async function getOraclePrices(...assets: Asset[]): Promise<BNCoin[]> {
+export default async function getOraclePrices(
+  chainConfig: ChainConfig,
+  assets: Asset[],
+): Promise<BNCoin[]> {
   try {
     if (!assets.length) return []
 
-    const oracleQueryClient = await getOracleQueryClient()
+    const oracleQueryClient = await getOracleQueryClient(chainConfig)
     const priceResults = await cacheFn(
       () => iterateContractQuery(oracleQueryClient.prices),
       oraclePriceCache,
-      'oraclePrices',
+      `${chainConfig.id}/oraclePrices`,
       60,
     )
 
@@ -24,7 +28,7 @@ export default async function getOraclePrices(...assets: Asset[]): Promise<BNCoi
       const decimalDiff = asset.decimals - PRICE_ORACLE_DECIMALS
       return BNCoin.fromDenomAndBigNumber(
         asset.denom,
-        BN(priceResponse.price).shiftedBy(decimalDiff),
+        BN(priceResponse?.price ?? BN_ZERO).shiftedBy(decimalDiff),
       )
     })
   } catch (ex) {
diff --git a/src/api/prices/getPoolPrice.ts b/src/api/prices/getPoolPrice.ts
index 6481d6b5..19058d30 100644
--- a/src/api/prices/getPoolPrice.ts
+++ b/src/api/prices/getPoolPrice.ts
@@ -1,6 +1,5 @@
 import { cacheFn, poolPriceCache } from 'api/cache'
 import getPrice from 'api/prices/getPrice'
-import { ENV } from 'constants/env'
 import { BN_ONE } from 'constants/math'
 import { BNCoin } from 'types/classes/BNCoin'
 import { byDenom, byTokenDenom, partition } from 'utils/array'
@@ -17,28 +16,29 @@ interface PoolAsset {
 }
 
 export default async function getPoolPrice(
+  chainConfig: ChainConfig,
   asset: Asset,
   lookupPricesForBaseAsset?: BNCoin[],
 ): Promise<BigNumber> {
   if (!asset.poolId) throw 'given asset should have a poolId to fetch the price'
 
-  const [assetRate, baseAsset] = await getAssetRate(asset)
+  const [assetRate, baseAsset] = await getAssetRate(chainConfig, asset)
   const baseAssetPrice =
     (lookupPricesForBaseAsset &&
       lookupPricesForBaseAsset.find(byDenom(baseAsset.token.denom))?.amount) ||
-    (await getPrice(baseAsset.token.denom))
+    (await getPrice(chainConfig, baseAsset.token.denom))
 
   if (!baseAssetPrice) throw 'base asset price must be available on Pyth or in Oracle contract'
 
   return assetRate.multipliedBy(baseAssetPrice)
 }
 
-const getAssetRate = async (asset: Asset) => {
-  const url = `${ENV.URL_REST}osmosis/gamm/v1beta1/pools/${asset.poolId}`
+const getAssetRate = async (chainConfig: ChainConfig, asset: Asset) => {
+  const url = chainConfig.endpoints.pools.replace('POOL_ID', asset.poolId!.toString())
   const response = await cacheFn(
     () => fetch(url).then((res) => res.json()),
     poolPriceCache,
-    `poolPrices/${(asset.poolId || 0).toString()}`,
+    `${chainConfig.id}/poolPrices/${(asset.poolId || 0).toString()}`,
     60,
   )
   const pool = response.pool
diff --git a/src/api/prices/getPrice.ts b/src/api/prices/getPrice.ts
index 009cb5f4..519e32ed 100644
--- a/src/api/prices/getPrice.ts
+++ b/src/api/prices/getPrice.ts
@@ -1,37 +1,20 @@
 import { cacheFn, priceCache } from 'api/cache'
-import { getOracleQueryClient } from 'api/cosmwasm-client'
-import getPoolPrice from 'api/prices/getPoolPrice'
-import getPythPrice from 'api/prices/getPythPrices'
-import { ASSETS } from 'constants/assets'
-import { PRICE_ORACLE_DECIMALS } from 'constants/query'
+import getPrices from 'api/prices/getPrices'
+import { BN_ZERO } from 'constants/math'
 import { byDenom } from 'utils/array'
-import { BN } from 'utils/helpers'
 
-export default async function getPrice(denom: string): Promise<BigNumber> {
-  return cacheFn(() => fetchPrice(denom), priceCache, `price/${denom}`, 60)
+export default async function getPrice(
+  chainConfig: ChainConfig,
+  denom: string,
+): Promise<BigNumber> {
+  return cacheFn(() => fetchPrice(chainConfig, denom), priceCache, `price/${denom}`, 60)
 }
 
-async function fetchPrice(denom: string) {
+async function fetchPrice(chainConfig: ChainConfig, denom: string) {
   try {
-    const asset = ASSETS.find(byDenom(denom)) as Asset
+    const prices = await getPrices(chainConfig)
 
-    if (asset.pythPriceFeedId) {
-      return (await getPythPrice(asset.pythPriceFeedId))[0]
-    }
-
-    if (asset.hasOraclePrice) {
-      const oracleQueryClient = await getOracleQueryClient()
-      const priceResponse = await oracleQueryClient.price({ denom: asset.denom })
-      const decimalDiff = asset.decimals - PRICE_ORACLE_DECIMALS
-
-      return BN(priceResponse.price).shiftedBy(decimalDiff)
-    }
-
-    if (asset.poolId) {
-      return await getPoolPrice(asset)
-    }
-
-    throw `could not fetch the price info for the given denom: ${denom}`
+    return prices.find(byDenom(denom))?.amount ?? BN_ZERO
   } catch (ex) {
     throw ex
   }
diff --git a/src/api/prices/getPriceData.ts b/src/api/prices/getPriceData.ts
deleted file mode 100644
index 71650bf2..00000000
--- a/src/api/prices/getPriceData.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import fetchPythPriceData from 'api/prices/getPythPriceData'
-import { getPythAssets } from 'utils/assets'
-
-export default async function getPricesData(): Promise<string[]> {
-  try {
-    const assetsWithPythPriceFeedId = getPythAssets()
-    const pythAndOraclePriceData = await requestPythPriceData(assetsWithPythPriceFeedId)
-    return pythAndOraclePriceData
-  } catch (ex) {
-    console.error(ex)
-    throw ex
-  }
-}
-
-async function requestPythPriceData(assets: Asset[]): Promise<string[]> {
-  if (!assets.length) return []
-
-  const priceFeedIds = assets.map((a) => a.pythPriceFeedId) as string[]
-  return await fetchPythPriceData(...priceFeedIds)
-}
diff --git a/src/api/prices/getPrices.ts b/src/api/prices/getPrices.ts
index 8b4f077c..6dc5a1fd 100644
--- a/src/api/prices/getPrices.ts
+++ b/src/api/prices/getPrices.ts
@@ -1,29 +1,35 @@
 import getOraclePrices from 'api/prices/getOraclePrices'
 import getPoolPrice from 'api/prices/getPoolPrice'
 import fetchPythPrices from 'api/prices/getPythPrices'
+import chains from 'configs/chains'
 import useStore from 'store'
 import { BNCoin } from 'types/classes/BNCoin'
 import { partition } from 'utils/array'
-import { getAssetsMustHavePriceInfo } from 'utils/assets'
+import { getAllAssetsWithPythId } from 'utils/assets'
 
-export default async function getPrices(): Promise<BNCoin[]> {
+export default async function getPrices(chainConfig: ChainConfig): Promise<BNCoin[]> {
   const usdPrice = new BNCoin({ denom: 'usd', amount: '1' })
+
+  const pythAndOraclePrices = []
+  const assetsToFetchPrices = useStore
+    .getState()
+    .chainConfig.assets.filter(
+      (asset) => (asset.isEnabled && asset.isMarket) || asset.forceFetchPrice,
+    )
+
+  const assetsWithPythPriceFeedId = getAllAssetsWithPythId(chains)
+  const pythPrices = await requestPythPrices(assetsWithPythPriceFeedId)
+  pythAndOraclePrices.push(...pythPrices)
+
   try {
-    const assetsToFetchPrices = getAssetsMustHavePriceInfo()
-    const [assetsWithPythPriceFeedId, assetsWithOraclePrices, assetsWithPoolIds] =
+    const [assetsWithOraclePrices, assetsWithPoolIds] =
       separateAssetsByPriceSources(assetsToFetchPrices)
+    const oraclePrices = await getOraclePrices(chainConfig, assetsWithOraclePrices)
+    const poolPrices = await requestPoolPrices(chainConfig, assetsWithPoolIds, pythAndOraclePrices)
 
-    const pythAndOraclePrices = (
-      await Promise.all([
-        requestPythPrices(assetsWithPythPriceFeedId),
-        getOraclePrices(...assetsWithOraclePrices),
-      ])
-    ).flat()
-    const poolPrices = await requestPoolPrices(assetsWithPoolIds, pythAndOraclePrices)
+    if (oraclePrices) useStore.setState({ isOracleStale: false })
 
-    useStore.setState({ isOracleStale: false })
-
-    return [...pythAndOraclePrices, ...poolPrices, usdPrice]
+    return [...pythAndOraclePrices, ...oraclePrices, ...poolPrices, usdPrice]
   } catch (ex) {
     console.error(ex)
     let message = 'Unknown Error'
@@ -31,41 +37,43 @@ export default async function getPrices(): Promise<BNCoin[]> {
     if (message.includes('price publish time is too old'))
       useStore.setState({ isOracleStale: true })
 
-    throw ex
+    return [...pythAndOraclePrices, usdPrice]
   }
 }
 
 async function requestPythPrices(assets: Asset[]): Promise<BNCoin[]> {
   if (!assets.length) return []
 
-  const priceFeedIds = assets.map((a) => a.pythPriceFeedId) as string[]
-  return await fetchPythPrices(...priceFeedIds).then(mapResponseToBnCoin(assets))
+  const priceFeedIds = assets
+    .map((a) => a.pythPriceFeedId)
+    .filter((priceFeedId, index, array) => array.indexOf(priceFeedId) === index) as string[]
+  return await fetchPythPrices(priceFeedIds, assets)
 }
 
-async function requestPoolPrices(assets: Asset[], lookupPrices: BNCoin[]): Promise<BNCoin[]> {
-  const requests = assets.map((asset) => getPoolPrice(asset, lookupPrices))
+async function requestPoolPrices(
+  chainConfig: ChainConfig,
+  assets: Asset[],
+  lookupPrices: BNCoin[],
+): Promise<BNCoin[]> {
+  const requests = assets.map((asset) => getPoolPrice(chainConfig, asset, lookupPrices))
 
   return await Promise.all(requests).then(mapResponseToBnCoin(assets))
 }
 
-const mapResponseToBnCoin = (assets: Asset[]) => (prices: BigNumber[]) =>
-  prices.map((price: BigNumber, index: number) =>
+const mapResponseToBnCoin = (assets: Asset[]) => (prices: BigNumber[]) => {
+  return prices.map((price: BigNumber, index: number) =>
     BNCoin.fromDenomAndBigNumber(assets[index].denom, price),
   )
+}
 
 function separateAssetsByPriceSources(assets: Asset[]) {
-  // Only fetch Pyth prices for mainnet
-  const [assetsWithPythPriceFeedId, assetsWithoutPythPriceFeedId] = partition(
-    assets,
-    (asset) => !!asset.pythPriceFeedId,
-  )
+  const assetsWithoutPythPriceFeedId = assets.filter((asset) => !asset.pythPriceFeedId)
 
-  // Don't get oracle price if it's not mainnet and there is a poolId
   const [assetsWithOraclePrice, assetsWithoutOraclePrice] = partition(
     assetsWithoutPythPriceFeedId,
     (asset) => asset.hasOraclePrice || !asset.poolId,
   )
   const assetsWithPoolId = assetsWithoutOraclePrice.filter((asset) => !!asset.poolId)
 
-  return [assetsWithPythPriceFeedId, assetsWithOraclePrice, assetsWithPoolId]
+  return [assetsWithOraclePrice, assetsWithPoolId]
 }
diff --git a/src/api/prices/getPythPriceData.ts b/src/api/prices/getPythPriceData.ts
index bb6b8d50..17339687 100644
--- a/src/api/prices/getPythPriceData.ts
+++ b/src/api/prices/getPythPriceData.ts
@@ -1,9 +1,9 @@
 import { cacheFn, pythPriceCache } from 'api/cache'
-import { ENV } from 'constants/env'
+import { pythEndpoints } from 'constants/pyth'
 
-export default async function fetchPythPriceData(...priceFeedIds: string[]) {
+export default async function getPythPriceData(priceFeedIds: string[]) {
   try {
-    const pricesUrl = new URL(`${ENV.PYTH_ENDPOINT}/latest_vaas`)
+    const pricesUrl = new URL(`${pythEndpoints.api}/latest_vaas`)
     priceFeedIds.forEach((id) => pricesUrl.searchParams.append('ids[]', id))
 
     const pythDataResponse: string[] = await cacheFn(
@@ -14,6 +14,7 @@ export default async function fetchPythPriceData(...priceFeedIds: string[]) {
     )
     return pythDataResponse
   } catch (ex) {
-    throw ex
+    console.log(ex)
+    return []
   }
 }
diff --git a/src/api/prices/getPythPrices.ts b/src/api/prices/getPythPrices.ts
index 5add3652..8aa74d56 100644
--- a/src/api/prices/getPythPrices.ts
+++ b/src/api/prices/getPythPrices.ts
@@ -1,10 +1,11 @@
 import { cacheFn, pythPriceCache } from 'api/cache'
-import { ENV } from 'constants/env'
+import { pythEndpoints } from 'constants/pyth'
+import { BNCoin } from 'types/classes/BNCoin'
 import { BN } from 'utils/helpers'
 
-export default async function fetchPythPrices(...priceFeedIds: string[]) {
+export default async function fetchPythPrices(priceFeedIds: string[], assets: Asset[]) {
   try {
-    const pricesUrl = new URL(`${ENV.PYTH_ENDPOINT}/latest_price_feeds`)
+    const pricesUrl = new URL(`${pythEndpoints.api}/latest_price_feeds`)
     priceFeedIds.forEach((id) => pricesUrl.searchParams.append('ids[]', id))
 
     const pythResponse: PythPriceData[] = await cacheFn(
@@ -14,7 +15,18 @@ export default async function fetchPythPrices(...priceFeedIds: string[]) {
       30,
     )
 
-    return pythResponse.map(({ price }) => BN(price.price).shiftedBy(price.expo))
+    const mappedPriceData = [] as BNCoin[]
+
+    assets.forEach((asset) => {
+      const price = pythResponse.find((pythPrice) => asset.pythPriceFeedId === pythPrice.id)?.price
+      if (price)
+        mappedPriceData.push(
+          BNCoin.fromDenomAndBigNumber(asset.denom, BN(price.price).shiftedBy(price.expo)),
+        )
+      return
+    })
+
+    return mappedPriceData
   } catch (ex) {
     throw ex
   }
diff --git a/src/api/swap/estimateExactIn.ts b/src/api/swap/estimateExactIn.ts
index 6e7606c7..14e98a23 100644
--- a/src/api/swap/estimateExactIn.ts
+++ b/src/api/swap/estimateExactIn.ts
@@ -2,9 +2,13 @@ import { getSwapperQueryClient } from 'api/cosmwasm-client'
 import { BN_ZERO } from 'constants/math'
 import { BN } from 'utils/helpers'
 
-export default async function estimateExactIn(coinIn: Coin, denomOut: string) {
+export default async function estimateExactIn(
+  chainConfig: ChainConfig,
+  coinIn: Coin,
+  denomOut: string,
+) {
   try {
-    const swapperClient = await getSwapperQueryClient()
+    const swapperClient = await getSwapperQueryClient(chainConfig)
     const estimatedAmount = (await swapperClient.estimateExactInSwap({ coinIn, denomOut })).amount
 
     return BN(estimatedAmount)
diff --git a/src/api/swap/getOsmosisSwapFee.ts b/src/api/swap/getOsmosisSwapFee.ts
new file mode 100644
index 00000000..4577e687
--- /dev/null
+++ b/src/api/swap/getOsmosisSwapFee.ts
@@ -0,0 +1,53 @@
+import { BN_ZERO } from 'constants/math'
+import { STANDARD_SWAP_FEE } from 'utils/constants'
+
+export default async function getOsmosisSwapFee(
+  chainConfig: ChainConfig,
+  poolIds: string[],
+): Promise<number> {
+  const promises = poolIds.map((poolId) =>
+    fetch(chainConfig.endpoints.pools.replace('POOL_ID', poolId)),
+  )
+
+  const responses = await Promise.all(promises)
+
+  const pools = await Promise.all(responses.map(async (pool) => (await pool.json()).pool as Pool))
+
+  if (!pools?.length) return STANDARD_SWAP_FEE
+
+  return pools
+    .reduce((acc, pool) => acc.plus(pool?.pool_params?.swap_fee || STANDARD_SWAP_FEE), BN_ZERO)
+    .toNumber()
+}
+
+interface Pool {
+  '@type': string
+  address: string
+  future_pool_governor: string
+  id: string
+  pool_assets?: PoolAsset[]
+  pool_liquidity?: PoolLiquidity[]
+  pool_params: PoolParams
+  total_shares: TotalShares
+  total_weight: string
+}
+
+interface PoolAsset {
+  token: TotalShares
+  weight: string
+}
+
+interface PoolLiquidity {
+  amount: string
+  denom: string
+}
+interface TotalShares {
+  amount: string
+  denom: string
+}
+
+interface PoolParams {
+  exit_fee: string
+  smooth_weight_change_params: null
+  swap_fee: string
+}
diff --git a/src/api/swap/getPools.ts b/src/api/swap/getPools.ts
deleted file mode 100644
index 27d49d4c..00000000
--- a/src/api/swap/getPools.ts
+++ /dev/null
@@ -1,42 +0,0 @@
-import { ENV } from 'constants/env'
-
-const url = `${ENV.URL_REST}osmosis/gamm/v1beta1/pools/`
-export default async function getPools(poolIds: string[]): Promise<Pool[]> {
-  const promises = poolIds.map((poolId) => fetch(url + poolId))
-
-  const responses = await Promise.all(promises)
-
-  return await Promise.all(responses.map(async (pool) => (await pool.json()).pool as Pool))
-}
-
-interface Pool {
-  '@type': string
-  address: string
-  future_pool_governor: string
-  id: string
-  pool_assets?: PoolAsset[]
-  pool_liquidity?: PoolLiquidity[]
-  pool_params: PoolParams
-  total_shares: TotalShares
-  total_weight: string
-}
-
-interface PoolAsset {
-  token: TotalShares
-  weight: string
-}
-
-interface PoolLiquidity {
-  amount: string
-  denom: string
-}
-interface TotalShares {
-  amount: string
-  denom: string
-}
-
-interface PoolParams {
-  exit_fee: string
-  smooth_weight_change_params: null
-  swap_fee: string
-}
diff --git a/src/api/swap/getSwapRoute.ts b/src/api/swap/getSwapRoute.ts
index c5501c49..1547fa3e 100644
--- a/src/api/swap/getSwapRoute.ts
+++ b/src/api/swap/getSwapRoute.ts
@@ -1,8 +1,12 @@
 import { getSwapperQueryClient } from 'api/cosmwasm-client'
 
-export default async function getSwapRoute(denomIn: string, denomOut: string): Promise<Route[]> {
+export default async function getSwapRoute(
+  chainConfig: ChainConfig,
+  denomIn: string,
+  denomOut: string,
+): Promise<Route[]> {
   try {
-    const swapperClient = await getSwapperQueryClient()
+    const swapperClient = await getSwapperQueryClient(chainConfig)
     const routes = await swapperClient.route({
       denomIn,
       denomOut,
diff --git a/src/api/vaults/getDepositedVaults.ts b/src/api/vaults/getDepositedVaults.ts
index 189d4734..14ccb939 100644
--- a/src/api/vaults/getDepositedVaults.ts
+++ b/src/api/vaults/getDepositedVaults.ts
@@ -21,9 +21,13 @@ import {
 import { getCoinValue } from 'utils/formatters'
 import { BN } from 'utils/helpers'
 
-async function getUnlocksAtTimestamp(unlockingId: number, vaultAddress: string) {
+async function getUnlocksAtTimestamp(
+  chainConfig: ChainConfig,
+  unlockingId: number,
+  vaultAddress: string,
+) {
   try {
-    const client = await getClient()
+    const client = await getClient(chainConfig.endpoints.rpc)
 
     const vaultExtension = (await cacheFn(
       () =>
@@ -42,6 +46,7 @@ async function getUnlocksAtTimestamp(unlockingId: number, vaultAddress: string)
 }
 
 async function getVaultPositionStatusAndUnlockIdAndUnlockTime(
+  chainConfig: ChainConfig,
   vaultPosition: VaultPosition,
 ): Promise<[VaultStatus, number | undefined, number | undefined]> {
   const amount = vaultPosition.amount
@@ -50,7 +55,11 @@ async function getVaultPositionStatusAndUnlockIdAndUnlockTime(
 
   if (amount.locking.unlocking.length) {
     const unlockId = amount.locking.unlocking[0].id
-    const unlocksAtTimestamp = await getUnlocksAtTimestamp(unlockId, vaultPosition.vault.address)
+    const unlocksAtTimestamp = await getUnlocksAtTimestamp(
+      chainConfig,
+      unlockId,
+      vaultPosition.vault.address,
+    )
 
     if (moment(unlocksAtTimestamp).isBefore(new Date())) {
       return [VaultStatus.UNLOCKED, unlockId, unlocksAtTimestamp]
@@ -83,12 +92,13 @@ export function flatVaultPositionAmount(
 }
 
 export async function getLpTokensForVaultPosition(
+  chainConfig: ChainConfig,
   vault: Vault,
   vaultPosition: VaultPosition,
 ): Promise<Coin[]> {
   try {
-    const vaultQueryClient = await getVaultQueryClient(vault.address)
-    const creditManagerQueryClient = await getCreditManagerQueryClient()
+    const vaultQueryClient = await getVaultQueryClient(chainConfig, vault.address)
+    const creditManagerQueryClient = await getCreditManagerQueryClient(chainConfig)
     const amounts = flatVaultPositionAmount(vaultPosition.amount)
     const totalAmount = amounts.locked.plus(amounts.unlocked).plus(amounts.unlocking).toString()
 
@@ -133,15 +143,16 @@ export async function getLpTokensForVaultPosition(
 async function getVaultValuesAndAmounts(
   vault: Vault,
   vaultPosition: VaultPosition,
+  chainConfig: ChainConfig,
 ): Promise<VaultValuesAndAmounts> {
   try {
     const pricesQueries = Promise.all([
-      getPrice(vault.denoms.primary),
-      getPrice(vault.denoms.secondary),
-      getPrice(vault.denoms.lp),
+      getPrice(chainConfig, vault.denoms.primary),
+      getPrice(chainConfig, vault.denoms.secondary),
+      getPrice(chainConfig, vault.denoms.lp),
     ])
 
-    const lpTokensQuery = getLpTokensForVaultPosition(vault, vaultPosition)
+    const lpTokensQuery = getLpTokensForVaultPosition(chainConfig, vault, vaultPosition)
     const amounts = flatVaultPositionAmount(vaultPosition.amount)
 
     const [[primaryLpToken, secondaryLpToken], [primaryPrice, secondaryPrice, lpPrice]] =
@@ -154,18 +165,26 @@ async function getVaultValuesAndAmounts(
         secondary: BN(secondaryLpToken.amount),
       },
       values: {
-        primary: getCoinValue(new BNCoin(primaryLpToken), [
-          BNCoin.fromDenomAndBigNumber(primaryLpToken.denom, primaryPrice),
-        ]),
-        secondary: getCoinValue(new BNCoin(secondaryLpToken), [
-          BNCoin.fromDenomAndBigNumber(secondaryLpToken.denom, secondaryPrice),
-        ]),
-        unlocking: getCoinValue(BNCoin.fromDenomAndBigNumber(vault.denoms.lp, amounts.unlocking), [
-          BNCoin.fromDenomAndBigNumber(vault.denoms.lp, lpPrice),
-        ]),
-        unlocked: getCoinValue(BNCoin.fromDenomAndBigNumber(vault.denoms.lp, amounts.unlocked), [
-          BNCoin.fromDenomAndBigNumber(vault.denoms.lp, lpPrice),
-        ]),
+        primary: getCoinValue(
+          new BNCoin(primaryLpToken),
+          [BNCoin.fromDenomAndBigNumber(primaryLpToken.denom, primaryPrice)],
+          chainConfig.assets,
+        ),
+        secondary: getCoinValue(
+          new BNCoin(secondaryLpToken),
+          [BNCoin.fromDenomAndBigNumber(secondaryLpToken.denom, secondaryPrice)],
+          chainConfig.assets,
+        ),
+        unlocking: getCoinValue(
+          BNCoin.fromDenomAndBigNumber(vault.denoms.lp, amounts.unlocking),
+          [BNCoin.fromDenomAndBigNumber(vault.denoms.lp, lpPrice)],
+          chainConfig.assets,
+        ),
+        unlocked: getCoinValue(
+          BNCoin.fromDenomAndBigNumber(vault.denoms.lp, amounts.unlocked),
+          [BNCoin.fromDenomAndBigNumber(vault.denoms.lp, lpPrice)],
+          chainConfig.assets,
+        ),
       },
     }
   } catch (ex) {
@@ -175,10 +194,11 @@ async function getVaultValuesAndAmounts(
 
 async function getDepositedVaults(
   accountId: string,
+  chainConfig: ChainConfig,
   positions?: Positions,
 ): Promise<DepositedVault[]> {
   try {
-    const creditManagerQueryClient = await getCreditManagerQueryClient()
+    const creditManagerQueryClient = await getCreditManagerQueryClient(chainConfig)
 
     if (!positions)
       positions = await cacheFn(
@@ -189,7 +209,7 @@ async function getDepositedVaults(
 
     if (!positions.vaults.length) return []
 
-    const [allVaults] = await Promise.all([getVaults()])
+    const [allVaults] = await Promise.all([getVaults(chainConfig)])
 
     const depositedVaults = positions.vaults.map(async (vaultPosition) => {
       const vault = allVaults.find((v) => v.address === vaultPosition.vault.address)
@@ -199,8 +219,8 @@ async function getDepositedVaults(
       }
 
       const [[status, unlockId, unlocksAt], valuesAndAmounts] = await Promise.all([
-        getVaultPositionStatusAndUnlockIdAndUnlockTime(vaultPosition),
-        getVaultValuesAndAmounts(vault, vaultPosition),
+        getVaultPositionStatusAndUnlockIdAndUnlockTime(chainConfig, vaultPosition),
+        getVaultValuesAndAmounts(vault, vaultPosition, chainConfig),
       ])
 
       return {
diff --git a/src/api/vaults/getVaultAprs.ts b/src/api/vaults/getVaultAprs.ts
index 36e643ab..633ca510 100644
--- a/src/api/vaults/getVaultAprs.ts
+++ b/src/api/vaults/getVaultAprs.ts
@@ -1,17 +1,22 @@
 import { aprsCache, aprsCacheResponse, cacheFn } from 'api/cache'
-import { ENV } from 'constants/env'
 
-export default async function getAprs() {
+export default async function getAprs(chainConfig: ChainConfig) {
+  if (!chainConfig.farm) return []
   try {
     const response = await cacheFn(
-      () => fetch(ENV.URL_VAULT_APR),
+      () => fetch(chainConfig.endpoints.aprs.vaults),
       aprsCacheResponse,
-      'aprsResponse',
+      `${chainConfig.id}/aprsResponse`,
       60,
     )
 
     if (response.ok) {
-      const data: AprResponse = await cacheFn(() => response.json(), aprsCache, 'aprs', 60)
+      const data: AprResponse = await cacheFn(
+        () => response.json(),
+        aprsCache,
+        `${chainConfig.id}/aprs`,
+        60,
+      )
 
       return data.vaults.map((aprData) => {
         const finalApr = aprData.apr.projected_apr * 100
diff --git a/src/api/vaults/getVaultConfigs.ts b/src/api/vaults/getVaultConfigs.ts
index af4aab4d..f8cb618c 100644
--- a/src/api/vaults/getVaultConfigs.ts
+++ b/src/api/vaults/getVaultConfigs.ts
@@ -3,13 +3,15 @@ import { getParamsQueryClient } from 'api/cosmwasm-client'
 import { VaultConfigBaseForAddr } from 'types/generated/mars-params/MarsParams.types'
 import iterateContractQuery from 'utils/iterateContractQuery'
 
-export const getVaultConfigs = async (): Promise<VaultConfigBaseForAddr[]> => {
+export const getVaultConfigs = async (
+  chainConfig: ChainConfig,
+): Promise<VaultConfigBaseForAddr[]> => {
   try {
-    const paramsQueryClient = await getParamsQueryClient()
+    const paramsQueryClient = await getParamsQueryClient(chainConfig)
     return await cacheFn(
       () => iterateContractQuery(paramsQueryClient.allVaultConfigs, 'addr'),
       vaultConfigsCache,
-      'vaultConfigs',
+      `${chainConfig.id}/vaultConfigs`,
       600,
     )
   } catch (ex) {
diff --git a/src/api/vaults/getVaultTokenFromLp.ts b/src/api/vaults/getVaultTokenFromLp.ts
deleted file mode 100644
index 1f4cde4d..00000000
--- a/src/api/vaults/getVaultTokenFromLp.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { cacheFn, previewDepositCache } from 'api/cache'
-import { getVaultQueryClient } from 'api/cosmwasm-client'
-
-export async function getVaultTokenFromLp(
-  vaultAddress: string,
-  lpAmount: string,
-): Promise<{ vaultAddress: string; amount: string }> {
-  try {
-    const client = await getVaultQueryClient(vaultAddress)
-
-    return cacheFn(
-      () =>
-        client.previewDeposit({ amount: lpAmount }).then((amount) => ({ vaultAddress, amount })),
-      previewDepositCache,
-      `vaults/${vaultAddress}/amounts/${lpAmount}`,
-      30,
-    )
-  } catch (ex) {
-    throw ex
-  }
-}
diff --git a/src/api/vaults/getVaultUtilizations.ts b/src/api/vaults/getVaultUtilizations.ts
index 9177b86f..acbb1de6 100644
--- a/src/api/vaults/getVaultUtilizations.ts
+++ b/src/api/vaults/getVaultUtilizations.ts
@@ -1,14 +1,13 @@
 import { cacheFn, vaultUtilizationCache } from 'api/cache'
 import { getCreditManagerQueryClient } from 'api/cosmwasm-client'
-import { ENV } from 'constants/env'
 import { VaultUtilizationResponse } from 'types/generated/mars-credit-manager/MarsCreditManager.types'
 import { VaultConfigBaseForString } from 'types/generated/mars-params/MarsParams.types'
 
 export const getVaultUtilizations = async (
+  chainConfig: ChainConfig,
   vaultConfigs: VaultConfigBaseForString[],
 ): Promise<VaultUtilizationResponse[]> => {
-  if (!ENV.ADDRESS_PARAMS) return []
-  const creditManagerQueryClient = await getCreditManagerQueryClient()
+  const creditManagerQueryClient = await getCreditManagerQueryClient(chainConfig)
   try {
     const vaultUtilizations$ = vaultConfigs.map((vaultConfig) => {
       return cacheFn(
diff --git a/src/api/vaults/getVaults.ts b/src/api/vaults/getVaults.ts
index b0af108f..476f284b 100644
--- a/src/api/vaults/getVaults.ts
+++ b/src/api/vaults/getVaults.ts
@@ -2,20 +2,16 @@ import getAssetParams from 'api/params/getAssetParams'
 import getAprs from 'api/vaults/getVaultAprs'
 import { getVaultConfigs } from 'api/vaults/getVaultConfigs'
 import { getVaultUtilizations } from 'api/vaults/getVaultUtilizations'
-import { ENV } from 'constants/env'
-import { TESTNET_VAULTS_META_DATA, VAULTS_META_DATA } from 'constants/vaults'
-import { NETWORK } from 'types/enums/network'
 import { BN } from 'utils/helpers'
 import { convertAprToApy } from 'utils/parsers'
 import { resolveHLSStrategies } from 'utils/resolvers'
 
-export default async function getVaults(): Promise<Vault[]> {
-  const assetParams = await getAssetParams()
-  const vaultConfigs = await getVaultConfigs()
-  const $vaultUtilizations = getVaultUtilizations(vaultConfigs)
-  const $aprs = getAprs()
-  const vaultMetaDatas =
-    ENV.NETWORK === NETWORK.TESTNET ? TESTNET_VAULTS_META_DATA : VAULTS_META_DATA
+export default async function getVaults(chainConfig: ChainConfig): Promise<Vault[]> {
+  const assetParams = await getAssetParams(chainConfig)
+  const vaultConfigs = await getVaultConfigs(chainConfig)
+  const $vaultUtilizations = getVaultUtilizations(chainConfig, vaultConfigs)
+  const $aprs = getAprs(chainConfig)
+  const vaultMetaDatas = chainConfig.vaults
   const HLSAssets = assetParams.filter((asset) => asset.credit_manager.hls)
   const hlsStrategies = resolveHLSStrategies('vault', HLSAssets)
 
diff --git a/src/api/wallets/getAccountIds.ts b/src/api/wallets/getAccountIds.ts
index 485908ac..1e4a30b3 100644
--- a/src/api/wallets/getAccountIds.ts
+++ b/src/api/wallets/getAccountIds.ts
@@ -2,12 +2,13 @@ import { getCreditManagerQueryClient } from 'api/cosmwasm-client'
 import { ITEM_LIMIT_PER_QUERY } from 'constants/query'
 
 export default async function getAccountIds(
+  chainConfig: ChainConfig,
   address?: string,
   previousResults?: AccountIdAndKind[],
 ): Promise<AccountIdAndKind[]> {
   if (!address) return []
   try {
-    const client = await getCreditManagerQueryClient()
+    const client = await getCreditManagerQueryClient(chainConfig)
 
     const lastItem = previousResults && previousResults.at(-1)
     const accounts = (
@@ -24,7 +25,7 @@ export default async function getAccountIds(
       return accumulated.sort((a, b) => parseInt(a.id) - parseInt(b.id))
     }
 
-    return await getAccountIds(address, accumulated)
+    return await getAccountIds(chainConfig, address, accumulated)
   } catch {
     return new Promise((_, reject) => reject('No data'))
   }
diff --git a/src/api/wallets/getAccounts.ts b/src/api/wallets/getAccounts.ts
index cbb58e61..7b13ed02 100644
--- a/src/api/wallets/getAccounts.ts
+++ b/src/api/wallets/getAccounts.ts
@@ -2,16 +2,19 @@ import getAccount from 'api/accounts/getAccount'
 import getWalletAccountIds from 'api/wallets/getAccountIds'
 import { AccountKind } from 'types/generated/mars-rover-health-computer/MarsRoverHealthComputer.types'
 
-export default async function getAccounts(kind: AccountKind, address?: string): Promise<Account[]> {
+export default async function getAccounts(
+  kind: AccountKind,
+  chainConfig: ChainConfig,
+  address?: string,
+): Promise<Account[]> {
   if (!address) return new Promise((_, reject) => reject('No address'))
-  const accountIdsAndKinds = await getWalletAccountIds(address)
+  const accountIdsAndKinds = await getWalletAccountIds(chainConfig, address)
 
   const $accounts = accountIdsAndKinds
     .filter((a) => a.kind === kind)
-    .map((account) => getAccount(account.id))
+    .map((account) => getAccount(chainConfig, account.id))
 
   const accounts = await Promise.all($accounts).then((accounts) => accounts)
-
   if (accounts) {
     return accounts.sort((a, b) => Number(a.id) - Number(b.id))
   }
diff --git a/src/api/wallets/getICNS.ts b/src/api/wallets/getICNS.ts
index 10870497..3e951714 100644
--- a/src/api/wallets/getICNS.ts
+++ b/src/api/wallets/getICNS.ts
@@ -1,11 +1,13 @@
 import { getICNSQueryClient } from 'api/cosmwasm-client'
-import { ENV } from 'constants/env'
 import { ChainInfoID } from 'types/enums/wallet'
 
-export default async function getICNS(address?: string): Promise<ICNSResult | undefined> {
-  if (!address || ENV.CHAIN_ID !== ChainInfoID.Osmosis1) return
+export default async function getICNS(
+  chainConfig: ChainConfig,
+  address?: string,
+): Promise<ICNSResult | undefined> {
+  if (!address || chainConfig.id !== ChainInfoID.Osmosis1) return
   try {
-    const icnsQueryClient = await getICNSQueryClient()
+    const icnsQueryClient = await getICNSQueryClient(chainConfig)
     return icnsQueryClient.primaryName({ address })
   } catch (ex) {
     throw ex
diff --git a/src/api/wallets/getWalletBalances.ts b/src/api/wallets/getWalletBalances.ts
index 798409a9..c6ea4d3f 100644
--- a/src/api/wallets/getWalletBalances.ts
+++ b/src/api/wallets/getWalletBalances.ts
@@ -1,9 +1,10 @@
-import { ENV } from 'constants/env'
-
-export default async function getWalletBalances(address: string): Promise<Coin[]> {
+export default async function getWalletBalances(
+  chainConfig: ChainConfig,
+  address: string,
+): Promise<Coin[]> {
   const uri = '/cosmos/bank/v1beta1/balances/'
 
-  const response = await fetch(`${ENV.URL_REST}${uri}${address}`)
+  const response = await fetch(`${chainConfig.endpoints.rest}${uri}${address}`)
 
   if (response.ok) {
     const data = await response.json()
diff --git a/src/components/Account/AccountBalancesTable/Columns/Asset.tsx b/src/components/Account/AccountBalancesTable/Columns/Asset.tsx
deleted file mode 100644
index fc26c5a5..00000000
--- a/src/components/Account/AccountBalancesTable/Columns/Asset.tsx
+++ /dev/null
@@ -1,22 +0,0 @@
-import Text from 'components/Text'
-export const ASSET_META = { accessorKey: 'symbol', header: 'Asset', id: 'symbol' }
-
-interface Props {
-  symbol: string
-  type: 'deposits' | 'borrowing' | 'lending' | 'vault'
-}
-
-export const borderColor = (type: Props['type']): string =>
-  type === 'borrowing' ? 'border-loss' : 'border-profit'
-
-export default function Asset(props: Props) {
-  const { symbol, type } = props
-  return (
-    <Text size='xs'>
-      {symbol}
-      {type === 'borrowing' && <span className='ml-1 text-loss'>(debt)</span>}
-      {type === 'lending' && <span className='ml-1 text-profit'>(lent)</span>}
-      {type === 'vault' && <span className='ml-1 text-profit'>(farm)</span>}
-    </Text>
-  )
-}
diff --git a/src/components/DepositCapMessage.tsx b/src/components/DepositCapMessage.tsx
deleted file mode 100644
index 6aaee248..00000000
--- a/src/components/DepositCapMessage.tsx
+++ /dev/null
@@ -1,50 +0,0 @@
-import classNames from 'classnames'
-import { HTMLAttributes } from 'react'
-
-import { FormattedNumber } from 'components/FormattedNumber'
-import { InfoCircle } from 'components/Icons'
-import Text from 'components/Text'
-import { BNCoin } from 'types/classes/BNCoin'
-import { getAssetByDenom } from 'utils/assets'
-
-interface Props extends HTMLAttributes<HTMLDivElement> {
-  action: 'buy' | 'deposit' | 'fund'
-  coins: BNCoin[]
-  showIcon?: boolean
-}
-
-export default function DepositCapMessage(props: Props) {
-  if (!props.coins.length) return null
-
-  return (
-    <div className={classNames('flex items-start', props.className)}>
-      {props.showIcon && <InfoCircle width={26} className='mr-5' />}
-      <div className='flex flex-col gap-2'>
-        <Text size='sm'>Deposit Cap Reached!</Text>
-        <Text size='xs' className='text-white/40'>{`Unfortunately you're not able to ${
-          props.action
-        } more than the following amount${props.coins.length > 1 ? 's' : ''}:`}</Text>
-        {props.coins.map((coin) => {
-          const asset = getAssetByDenom(coin.denom)
-
-          if (!asset) return null
-
-          return (
-            <div key={coin.denom} className='flex gap-1'>
-              <Text size='xs'>Cap Left:</Text>
-              <FormattedNumber
-                amount={Math.max(coin.amount.toNumber(), 0)}
-                options={{
-                  decimals: asset.decimals,
-                  maxDecimals: asset.decimals,
-                  suffix: ` ${asset.symbol}`,
-                }}
-                className='text-xs text-white/60'
-              />
-            </div>
-          )
-        })}
-      </div>
-    </div>
-  )
-}
diff --git a/src/components/DirectionSelect.tsx b/src/components/DirectionSelect.tsx
deleted file mode 100644
index e94da6ed..00000000
--- a/src/components/DirectionSelect.tsx
+++ /dev/null
@@ -1,59 +0,0 @@
-import classNames from 'classnames'
-
-import Text from 'components/Text'
-
-interface Props {
-  direction: OrderDirection
-  onChangeDirection: (direction: OrderDirection) => void
-  asset?: Asset
-}
-
-export function DirectionSelect(props: Props) {
-  const hasAsset = props.asset
-  const directions: OrderDirection[] = hasAsset ? ['buy', 'sell'] : ['long', 'short']
-  return (
-    <div className='flex rounded-sm bg-black/20'>
-      <Direction
-        onClick={() => props.onChangeDirection(directions[0])}
-        direction={directions[0]}
-        isActive={props.direction === directions[0]}
-        asset={props.asset}
-      />
-      <Direction
-        onClick={() => props.onChangeDirection(directions[1])}
-        direction={directions[1]}
-        isActive={props.direction === directions[1]}
-        asset={props.asset}
-      />
-    </div>
-  )
-}
-
-interface DirectionProps {
-  direction: 'long' | 'short' | 'buy' | 'sell'
-  isActive: boolean
-  onClick: () => void
-  asset?: Asset
-}
-function Direction(props: DirectionProps) {
-  const classString = props.direction === 'long' || props.direction === 'buy' ? 'success' : 'error'
-  return (
-    <button
-      className={classNames(
-        'px-4 py-3 rounded-sm flex-1',
-        props.isActive && 'border bg-white/10',
-        `border-${classString}`,
-      )}
-      onClick={props.onClick}
-    >
-      <Text
-        className={classNames(
-          'text-center first-letter:uppercase',
-          props.isActive ? `text-${classString}` : 'text-white/20',
-        )}
-      >
-        {props.asset ? `${props.direction} ${props.asset.symbol}` : props.direction}
-      </Text>
-    </button>
-  )
-}
diff --git a/src/components/DisplayCurrency.tsx b/src/components/DisplayCurrency.tsx
deleted file mode 100644
index d1ce5031..00000000
--- a/src/components/DisplayCurrency.tsx
+++ /dev/null
@@ -1,82 +0,0 @@
-import classNames from 'classnames'
-import { useMemo } from 'react'
-
-import { FormattedNumber } from 'components/FormattedNumber'
-import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
-import { LocalStorageKeys } from 'constants/localStorageKeys'
-import { ORACLE_DENOM } from 'constants/oracle'
-import useLocalStorage from 'hooks/useLocalStorage'
-import usePrices from 'hooks/usePrices'
-import { BNCoin } from 'types/classes/BNCoin'
-import { getDisplayCurrencies } from 'utils/assets'
-import { getCoinValue } from 'utils/formatters'
-import { BN } from 'utils/helpers'
-
-interface Props {
-  coin: BNCoin
-  className?: string
-  isApproximation?: boolean
-  parentheses?: boolean
-  showZero?: boolean
-  options?: FormatOptions
-}
-
-export default function DisplayCurrency(props: Props) {
-  const displayCurrencies = getDisplayCurrencies()
-  const [displayCurrency] = useLocalStorage<string>(
-    LocalStorageKeys.DISPLAY_CURRENCY,
-    DEFAULT_SETTINGS.displayCurrency,
-  )
-  const { data: prices } = usePrices()
-
-  const displayCurrencyAsset = useMemo(
-    () =>
-      displayCurrencies.find((asset) => asset.denom === displayCurrency) ?? displayCurrencies[0],
-    [displayCurrency, displayCurrencies],
-  )
-
-  const isUSD = displayCurrencyAsset.id === 'USD'
-
-  const amount = useMemo(() => {
-    const coinValue = getCoinValue(props.coin, prices)
-
-    if (displayCurrency === ORACLE_DENOM) return coinValue.toNumber()
-
-    const displayDecimals = displayCurrencyAsset.decimals
-    const displayPrice = getCoinValue(
-      BNCoin.fromDenomAndBigNumber(displayCurrency, BN(1).shiftedBy(displayDecimals)),
-      prices,
-    )
-
-    return coinValue.div(displayPrice).toNumber()
-  }, [displayCurrency, displayCurrencyAsset.decimals, prices, props.coin])
-
-  const isLessThanACent = (isUSD && amount < 0.01 && amount > 0) || (amount === 0 && props.showZero)
-  const smallerThanPrefix = isLessThanACent ? '< ' : ''
-
-  const prefix = isUSD
-    ? `${props.isApproximation ? '~ ' : smallerThanPrefix}$`
-    : `${props.isApproximation ? '~ ' : ''}`
-  const suffix = isUSD
-    ? ''
-    : ` ${displayCurrencyAsset.symbol ? ` ${displayCurrencyAsset.symbol}` : ''}`
-
-  return (
-    <FormattedNumber
-      className={classNames(
-        props.className,
-        props.parentheses && 'before:content-["("] after:content-[")"]',
-      )}
-      amount={isLessThanACent ? 0.01 : amount}
-      options={{
-        minDecimals: isUSD ? 2 : 0,
-        maxDecimals: 2,
-        abbreviated: true,
-        prefix,
-        suffix,
-        ...props.options,
-      }}
-      animate
-    />
-  )
-}
diff --git a/src/components/Earn/Farm/FeaturedVaults.tsx b/src/components/Earn/Farm/FeaturedVaults.tsx
deleted file mode 100644
index afa5b66f..00000000
--- a/src/components/Earn/Farm/FeaturedVaults.tsx
+++ /dev/null
@@ -1,39 +0,0 @@
-import { Suspense } from 'react'
-
-import Card from 'components/Card'
-import VaultCard from 'components/Earn/Farm/VaultCard'
-import useVaults from 'hooks/useVaults'
-
-function Content() {
-  const { data: vaults } = useVaults()
-  if (!vaults) return null
-  const featuredVaults = vaults.filter((vault) => vault.isFeatured)
-
-  if (!featuredVaults.length) return null
-
-  return (
-    <Card
-      title='Featured vaults'
-      className='w-full mb-4 h-fit bg-white/5'
-      contentClassName='grid grid-cols-3'
-    >
-      {featuredVaults.map((vault) => (
-        <VaultCard
-          key={vault.address}
-          vault={vault}
-          title={vault.name}
-          subtitle='Hot off the presses'
-          provider={vault.provider}
-        />
-      ))}
-    </Card>
-  )
-}
-
-export default function FeaturedVaults() {
-  return (
-    <Suspense fallback={null}>
-      <Content />
-    </Suspense>
-  )
-}
diff --git a/src/components/Earn/Farm/VaultCard.tsx b/src/components/Earn/Farm/VaultCard.tsx
deleted file mode 100644
index a0864693..00000000
--- a/src/components/Earn/Farm/VaultCard.tsx
+++ /dev/null
@@ -1,83 +0,0 @@
-import ActionButton from 'components/Button/ActionButton'
-import DoubleLogo from 'components/DoubleLogo'
-import Text from 'components/Text'
-import TitleAndSubCell from 'components/TitleAndSubCell'
-import useCurrentAccount from 'hooks/useCurrentAccount'
-import useStore from 'store'
-import { getAssetByDenom } from 'utils/assets'
-import { formatPercent, formatValue } from 'utils/formatters'
-
-interface Props {
-  vault: Vault
-  title: string
-  subtitle: string
-  provider?: string
-  unbondingPeriod?: number
-}
-
-export default function VaultCard(props: Props) {
-  const currentAccount = useCurrentAccount()
-
-  function openVaultModal() {
-    useStore.setState({
-      vaultModal: {
-        vault: props.vault,
-        selectedBorrowDenoms: [props.vault.denoms.secondary],
-        isCreate: true,
-      },
-    })
-  }
-
-  return (
-    <div className='border-r-[1px] border-r-white/10 p-4'>
-      <div className='flex justify-between mb-8 align-center'>
-        <div>
-          <Text size='xs' className='mb-2 text-white/60'>
-            {props.subtitle}
-          </Text>
-          <span className='flex'>
-            <Text className='mr-2 font-bold'>{props.title}</Text>
-            {props.provider && (
-              <Text size='sm' className='text-white/60'>
-                via {props.provider}
-              </Text>
-            )}
-          </span>
-        </div>
-        <DoubleLogo
-          primaryDenom={props.vault.denoms.primary}
-          secondaryDenom={props.vault.denoms.secondary}
-        />
-      </div>
-      <div className='flex justify-between mb-6'>
-        <TitleAndSubCell
-          className='text-xs'
-          title={props.vault.apy ? formatPercent(props.vault.apy, 2) : '-'}
-          sub={'APY'}
-        />
-        <TitleAndSubCell
-          className='text-xs'
-          title={`${props.vault.lockup.duration} ${props.vault.lockup.timeframe}`}
-          sub={'Lockup'}
-        />
-        <TitleAndSubCell
-          className='text-xs'
-          title={formatValue(props.vault.cap.used.integerValue().toNumber() || '0', {
-            abbreviated: true,
-            decimals: getAssetByDenom(props.vault.cap.denom)?.decimals,
-          })}
-          sub={'TVL'}
-        />
-        <TitleAndSubCell
-          className='text-xs'
-          title={formatValue(props.vault.cap.max.integerValue().toNumber() || '0', {
-            abbreviated: true,
-            decimals: getAssetByDenom(props.vault.cap.denom)?.decimals,
-          })}
-          sub={'Deposit Cap'}
-        />
-      </div>
-      <ActionButton onClick={openVaultModal} color='secondary' text='Deposit' className='w-full' />
-    </div>
-  )
-}
diff --git a/src/components/Icons/ArrowRight.svg b/src/components/Icons/ArrowRight.svg
deleted file mode 100644
index b3432e1c..00000000
--- a/src/components/Icons/ArrowRight.svg
+++ /dev/null
@@ -1,9 +0,0 @@
-<svg viewBox="0 0 13 12" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path
-    d="M1.8335 6.00065H11.1668M11.1668 6.00065L6.50016 1.33398M11.1668 6.00065L6.50016 10.6673"
-    stroke="currentColor"
-    stroke-width="2"
-    stroke-linecap="round"
-    stroke-linejoin="round"
-  />
-</svg>
diff --git a/src/components/Icons/index.ts b/src/components/Icons/index.ts
deleted file mode 100644
index 42b9ce7a..00000000
--- a/src/components/Icons/index.ts
+++ /dev/null
@@ -1,68 +0,0 @@
-// @index(['./*.svg'], f => `export { default as ${f.name} } from 'components/Icons/${f.name}.svg'`)
-export { default as Account } from 'components/Icons/Account.svg'
-export { default as AccountArrowDown } from 'components/Icons/AccountArrowDown.svg'
-export { default as ArrowChartLineUp } from 'components/Icons/ArrowChartLineUp.svg'
-export { default as ArrowCircle } from 'components/Icons/ArrowCircle.svg'
-export { default as ArrowCircledTopRight } from 'components/Icons/ArrowCircledTopRight.svg'
-export { default as ArrowDownLine } from 'components/Icons/ArrowDownLine.svg'
-export { default as ArrowRight } from 'components/Icons/ArrowRight.svg'
-export { default as ArrowUpLine } from 'components/Icons/ArrowUpLine.svg'
-export { default as Chain } from 'components/Icons/Chain.svg'
-export { default as Check } from 'components/Icons/Check.svg'
-export { default as CheckCircled } from 'components/Icons/CheckCircled.svg'
-export { default as ChevronDown } from 'components/Icons/ChevronDown.svg'
-export { default as ChevronLeft } from 'components/Icons/ChevronLeft.svg'
-export { default as ChevronRight } from 'components/Icons/ChevronRight.svg'
-export { default as ChevronUp } from 'components/Icons/ChevronUp.svg'
-export { default as Circle } from 'components/Icons/Circle.svg'
-export { default as Coins } from 'components/Icons/Coins.svg'
-export { default as CoinsSwap } from 'components/Icons/CoinsSwap.svg'
-export { default as Compass } from 'components/Icons/Compass.svg'
-export { default as Copy } from 'components/Icons/Copy.svg'
-export { default as Cross } from 'components/Icons/Cross.svg'
-export { default as CrossCircled } from 'components/Icons/CrossCircled.svg'
-export { default as Enter } from 'components/Icons/Enter.svg'
-export { default as ExclamationMarkCircled } from 'components/Icons/ExclamationMarkCircled.svg'
-export { default as ExclamationMarkTriangle } from 'components/Icons/ExclamationMarkTriangle.svg'
-export { default as ExternalLink } from 'components/Icons/ExternalLink.svg'
-export { default as Flag } from 'components/Icons/Flag.svg'
-export { default as Gear } from 'components/Icons/Gear.svg'
-export { default as GridGlobe } from 'components/Icons/GridGlobe.svg'
-export { default as GridHole } from 'components/Icons/GridHole.svg'
-export { default as GridLandscape } from 'components/Icons/GridLandscape.svg'
-export { default as GridPlanet } from 'components/Icons/GridPlanet.svg'
-export { default as GridTire } from 'components/Icons/GridTire.svg'
-export { default as GridWeb } from 'components/Icons/GridWeb.svg'
-export { default as HandCoins } from 'components/Icons/HandCoins.svg'
-export { default as Heart } from 'components/Icons/Heart.svg'
-export { default as InfoCircle } from 'components/Icons/InfoCircle.svg'
-export { default as LockLocked } from 'components/Icons/LockLocked.svg'
-export { default as LockUnlocked } from 'components/Icons/LockUnlocked.svg'
-export { default as Logo } from 'components/Icons/Logo.svg'
-export { default as Luggage } from 'components/Icons/Luggage.svg'
-export { default as MarsProtocol } from 'components/Icons/MarsProtocol.svg'
-export { default as Osmo } from 'components/Icons/Osmo.svg'
-export { default as OverlayMark } from 'components/Icons/OverlayMark.svg'
-export { default as Plus } from 'components/Icons/Plus.svg'
-export { default as PlusCircled } from 'components/Icons/PlusCircled.svg'
-export { default as PlusSquared } from 'components/Icons/PlusSquared.svg'
-export { default as PythLogoType } from 'components/Icons/PythLogoType.svg'
-export { default as Questionmark } from 'components/Icons/Questionmark.svg'
-export { default as ReceiptCheck } from 'components/Icons/ReceiptCheck.svg'
-export { default as Scale } from 'components/Icons/Scale.svg'
-export { default as Search } from 'components/Icons/Search.svg'
-export { default as Shield } from 'components/Icons/Shield.svg'
-export { default as SortAsc } from 'components/Icons/SortAsc.svg'
-export { default as SortDesc } from 'components/Icons/SortDesc.svg'
-export { default as SortNone } from 'components/Icons/SortNone.svg'
-export { default as StarFilled } from 'components/Icons/StarFilled.svg'
-export { default as StarOutlined } from 'components/Icons/StarOutlined.svg'
-export { default as Subtract } from 'components/Icons/Subtract.svg'
-export { default as SwapIcon } from 'components/Icons/SwapIcon.svg'
-export { default as ThreeDots } from 'components/Icons/ThreeDots.svg'
-export { default as TooltipArrow } from 'components/Icons/TooltipArrow.svg'
-export { default as TrashBin } from 'components/Icons/TrashBin.svg'
-export { default as Twitter } from 'components/Icons/Twitter.svg'
-export { default as VerticalThreeLine } from 'components/Icons/VerticalThreeLine.svg'
-export { default as Wallet } from 'components/Icons/Wallet.svg'
-// @endindex
diff --git a/src/components/Modals/Account/AccountDeleteAlertDialog.tsx b/src/components/Modals/Account/AccountDeleteAlertDialog.tsx
index e340fc12..865d0c31 100644
--- a/src/components/Modals/Account/AccountDeleteAlertDialog.tsx
+++ b/src/components/Modals/Account/AccountDeleteAlertDialog.tsx
@@ -1,6 +1,6 @@
 import { useEffect } from 'react'
 
-import { Enter, InfoCircle } from 'components/Icons'
+import { Enter, InfoCircle } from 'components/common/Icons'
 import useAlertDialog from 'hooks/useAlertDialog'
 
 interface Props {
diff --git a/src/components/Modals/Account/AccountDeleteModal.tsx b/src/components/Modals/Account/AccountDeleteModal.tsx
index 13c6fd5a..ba001cdd 100644
--- a/src/components/Modals/Account/AccountDeleteModal.tsx
+++ b/src/components/Modals/Account/AccountDeleteModal.tsx
@@ -1,13 +1,14 @@
 import { useCallback, useMemo } from 'react'
 import { useLocation, useNavigate, useParams, useSearchParams } from 'react-router-dom'
 
-import AssetBalanceRow from 'components/Asset/AssetBalanceRow'
-import { ArrowRight, ExclamationMarkCircled } from 'components/Icons'
+import AssetBalanceRow from 'components/common/assets/AssetBalanceRow'
+import { ArrowRight, ExclamationMarkCircled } from 'components/common/Icons'
 import AccountDeleteAlertDialog from 'components/Modals/Account/AccountDeleteAlertDialog'
-import Text from 'components/Text'
+import Text from 'components/common/Text'
+import useAllAssets from 'hooks/assets/useAllAssets'
 import useStore from 'store'
 import { BNCoin } from 'types/classes/BNCoin'
-import { getAssetByDenom } from 'utils/assets'
+import { byDenom } from 'utils/array'
 import { combineBNCoins } from 'utils/parsers'
 import { getPage, getRoute } from 'utils/route'
 
@@ -31,7 +32,7 @@ function AccountDeleteModal(props: Props) {
   const { address } = useParams()
   const { debts, vaults, id: accountId } = modal || {}
   const [searchParams] = useSearchParams()
-
+  const assets = useAllAssets()
   const closeDeleteAccountModal = useCallback(() => {
     useStore.setState({ accountDeleteModal: null })
   }, [])
@@ -117,7 +118,7 @@ function AccountDeleteModal(props: Props) {
           <div className='flex flex-col w-full gap-4 py-4 overflow-y-scroll max-h-100 scrollbar-hide'>
             {depositsAndLends.map((position, index) => {
               const coin = BNCoin.fromDenomAndBigNumber(position.denom, position.amount)
-              const asset = getAssetByDenom(position.denom)
+              const asset = assets.find(byDenom(position.denom))
               if (!asset) return null
               return <AssetBalanceRow key={index} asset={asset} coin={coin} />
             })}
diff --git a/src/components/Modals/AddVaultAssets/AddVaultBorrowAssetsModalContent.tsx b/src/components/Modals/AddVaultAssets/AddVaultBorrowAssetsModalContent.tsx
index 361b4191..8bd8e29f 100644
--- a/src/components/Modals/AddVaultAssets/AddVaultBorrowAssetsModalContent.tsx
+++ b/src/components/Modals/AddVaultAssets/AddVaultBorrowAssetsModalContent.tsx
@@ -1,9 +1,9 @@
 import { useCallback, useMemo, useState } from 'react'
 
-import AssetSelectTable from 'components/Modals/AssetsSelect/AssetSelectTable'
-import SearchBar from 'components/SearchBar'
-import Text from 'components/Text'
-import useMarketBorrowings from 'hooks/useMarketBorrowings'
+import AssetsSelect from 'components/Modals/AssetsSelect'
+import SearchBar from 'components/common/SearchBar'
+import Text from 'components/common/Text'
+import useMarketBorrowings from 'hooks/markets/useMarketBorrowings'
 import useStore from 'store'
 
 interface Props {
@@ -89,11 +89,11 @@ export default function AddVaultAssetsModalContent(props: Props) {
             Leverage will be set at 50% for both assets by default
           </Text>
         </div>
-        <AssetSelectTable
-          isBorrow={true}
+        <AssetsSelect
           assets={poolAssets}
           onChangeSelected={onChangePoolDenoms}
           selectedDenoms={selectedPoolDenoms}
+          isBorrow
         />
         <div className='p-4'>
           <Text>Assets not in the liquidity pool</Text>
@@ -102,11 +102,11 @@ export default function AddVaultAssetsModalContent(props: Props) {
             these assets below.
           </Text>
         </div>
-        <AssetSelectTable
-          isBorrow={true}
+        <AssetsSelect
           assets={stableAssets}
           onChangeSelected={onChangeOtherDenoms}
           selectedDenoms={selectedOtherDenoms}
+          isBorrow
         />
       </div>
     </>
diff --git a/src/components/Modals/AddVaultAssets/index.tsx b/src/components/Modals/AddVaultAssets/index.tsx
index fb4e7e5f..f3d0c7a1 100644
--- a/src/components/Modals/AddVaultAssets/index.tsx
+++ b/src/components/Modals/AddVaultAssets/index.tsx
@@ -1,10 +1,10 @@
 import { useCallback, useState } from 'react'
 
-import Button from 'components/Button'
-import { CircularProgress } from 'components/CircularProgress'
-import Modal from 'components/Modal'
+import Button from 'components/common/Button'
+import { CircularProgress } from 'components/common/CircularProgress'
+import Modal from 'components/Modals/Modal'
 import AddVaultAssetsModalContent from 'components/Modals/AddVaultAssets/AddVaultBorrowAssetsModalContent'
-import Text from 'components/Text'
+import Text from 'components/common/Text'
 import useStore from 'store'
 
 export default function AddVaultBorrowAssetsModal() {
diff --git a/src/components/Modals/AlertDialog/ButtonIcons.tsx b/src/components/Modals/AlertDialog/ButtonIcons.tsx
index f4e028f7..9ad2debc 100644
--- a/src/components/Modals/AlertDialog/ButtonIcons.tsx
+++ b/src/components/Modals/AlertDialog/ButtonIcons.tsx
@@ -1,4 +1,4 @@
-import { Enter } from 'components/Icons'
+import { Enter } from 'components/common/Icons'
 
 export function NoIcon() {
   return (
diff --git a/src/components/Modals/AlertDialog/index.tsx b/src/components/Modals/AlertDialog/index.tsx
index 68512648..c61438f8 100644
--- a/src/components/Modals/AlertDialog/index.tsx
+++ b/src/components/Modals/AlertDialog/index.tsx
@@ -1,10 +1,10 @@
 import classNames from 'classnames'
 
-import Button from 'components/Button'
-import Checkbox from 'components/Checkbox'
-import Modal from 'components/Modal'
+import Button from 'components/common/Button'
+import Checkbox from 'components/common/Checkbox'
+import Modal from 'components/Modals/Modal'
 import { NoIcon, YesIcon } from 'components/Modals/AlertDialog/ButtonIcons'
-import Text from 'components/Text'
+import Text from 'components/common/Text'
 import useAlertDialog from 'hooks/useAlertDialog'
 import useToggle from 'hooks/useToggle'
 
diff --git a/src/components/Modals/AssetAmountSelectActionModal.tsx b/src/components/Modals/AssetAmountSelectActionModal.tsx
index c937223b..a8f1f2c2 100644
--- a/src/components/Modals/AssetAmountSelectActionModal.tsx
+++ b/src/components/Modals/AssetAmountSelectActionModal.tsx
@@ -1,22 +1,23 @@
 import { useCallback, useState } from 'react'
 
-import CurrentAccountSummary from 'components/Account/CurrentAccountSummary'
-import AssetImage from 'components/Asset/AssetImage'
-import Button from 'components/Button'
-import Card from 'components/Card'
-import Divider from 'components/Divider'
-import { ArrowRight } from 'components/Icons'
-import Modal from 'components/Modal'
-import Text from 'components/Text'
-import TokenInputWithSlider from 'components/TokenInput/TokenInputWithSlider'
+import Modal from 'components/Modals/Modal'
+import CurrentAccountSummary from 'components/account/CurrentAccountSummary'
+import Button from 'components/common/Button'
+import Card from 'components/common/Card'
+import Divider from 'components/common/Divider'
+import { ArrowRight } from 'components/common/Icons'
+import Text from 'components/common/Text'
+import TokenInputWithSlider from 'components/common/TokenInput/TokenInputWithSlider'
+import AssetImage from 'components/common/assets/AssetImage'
 import { BN_ZERO } from 'constants/math'
+import { BNCoin } from 'types/classes/BNCoin'
 import { byDenom } from 'utils/array'
 import { BN } from 'utils/helpers'
 
 interface Props {
   asset: Asset
   title: string
-  coinBalances: Coin[]
+  coinBalances: BNCoin[]
   actionButtonText: string
   contentHeader?: JSX.Element
   onClose: () => void
diff --git a/src/components/Modals/AssetsSelect/AssetSelectTable.tsx b/src/components/Modals/AssetsSelect/AssetSelectTable.tsx
deleted file mode 100644
index 5ca92f93..00000000
--- a/src/components/Modals/AssetsSelect/AssetSelectTable.tsx
+++ /dev/null
@@ -1,154 +0,0 @@
-import {
-  flexRender,
-  getCoreRowModel,
-  getSortedRowModel,
-  RowSelectionState,
-  SortingState,
-  useReactTable,
-} from '@tanstack/react-table'
-import classNames from 'classnames'
-import { useEffect, useMemo, useState } from 'react'
-
-import { SortAsc, SortDesc, SortNone } from 'components/Icons'
-import useAssetTableColumns from 'components/Modals/AssetsSelect/useAssetTableColumns'
-import Text from 'components/Text'
-import useMarketAssets from 'hooks/useMarketAssets'
-import useStore from 'store'
-import { byDenom } from 'utils/array'
-
-interface Props {
-  assets: Asset[] | BorrowAsset[]
-  selectedDenoms: string[]
-  onChangeSelected: (denoms: string[]) => void
-  isBorrow: boolean
-}
-
-export default function AssetSelectTable(props: Props) {
-  const { data: markets } = useMarketAssets()
-  const defaultSelected = useMemo(() => {
-    const assets = props.assets as BorrowAsset[]
-    return assets.reduce(
-      (acc, asset, index) => {
-        if (props.selectedDenoms?.includes(asset.denom)) {
-          acc[index] = true
-        }
-        return acc
-      },
-      {} as { [key: number]: boolean },
-    )
-  }, [props.selectedDenoms, props.assets])
-  const [sorting, setSorting] = useState<SortingState>([{ id: 'symbol', desc: false }])
-  const [selected, setSelected] = useState<RowSelectionState>(defaultSelected)
-  const balances = useStore((s) => s.balances)
-  const columns = useAssetTableColumns(props.isBorrow)
-  const tableData: AssetTableRow[] = useMemo(() => {
-    return props.assets.map((asset) => {
-      const balancesForAsset = balances.find(byDenom(asset.denom))
-      return {
-        asset,
-        balance: balancesForAsset?.amount ?? '0',
-        market: markets.find((market) => market.denom === asset.denom),
-      }
-    })
-  }, [balances, props.assets, markets])
-
-  const table = useReactTable({
-    data: tableData,
-    columns,
-    state: {
-      sorting,
-      rowSelection: selected,
-    },
-    onRowSelectionChange: setSelected,
-    onSortingChange: setSorting,
-    getCoreRowModel: getCoreRowModel(),
-    getSortedRowModel: getSortedRowModel(),
-  })
-
-  useEffect(() => {
-    const newSelectedDenoms = props.assets
-      .filter((_, index) => selected[index])
-      .map((asset) => asset.denom)
-
-    if (
-      props.selectedDenoms.length === newSelectedDenoms.length &&
-      newSelectedDenoms.every((denom) => props.selectedDenoms.includes(denom))
-    )
-      return
-    props.onChangeSelected(newSelectedDenoms)
-  }, [selected, props])
-
-  return (
-    <table className='w-full'>
-      <thead className='border-b border-white/10'>
-        {table.getHeaderGroups().map((headerGroup) => (
-          <tr key={headerGroup.id}>
-            {headerGroup.headers.map((header) => {
-              return (
-                <th
-                  key={header.id}
-                  onClick={header.column.getToggleSortingHandler()}
-                  className={classNames(
-                    'p-2',
-                    header.column.getCanSort() && 'hover:cursor-pointer',
-                    header.id === 'symbol' ? 'text-left' : 'text-right',
-                  )}
-                >
-                  <div
-                    className={classNames(
-                      'flex',
-                      header.id === 'symbol' ? 'justify-start' : 'justify-end',
-                      'align-center',
-                    )}
-                  >
-                    <span className='w-6 h-6 text-white'>
-                      {header.column.getCanSort()
-                        ? {
-                            asc: <SortAsc />,
-                            desc: <SortDesc />,
-                            false: <SortNone />,
-                          }[header.column.getIsSorted() as string] ?? null
-                        : null}
-                    </span>
-                    <Text
-                      tag='span'
-                      size='sm'
-                      className='flex items-center font-normal text-white/40'
-                    >
-                      {flexRender(header.column.columnDef.header, header.getContext())}
-                    </Text>
-                  </div>
-                </th>
-              )
-            })}
-          </tr>
-        ))}
-      </thead>
-      <tbody>
-        {table.getRowModel().rows.map((row) => {
-          return (
-            <tr
-              key={row.id}
-              className='hover:cursor-pointer text-white/60'
-              onClick={() => row.toggleSelected()}
-            >
-              {row.getVisibleCells().map((cell) => {
-                return (
-                  <td
-                    key={cell.id}
-                    className={classNames(
-                      cell.column.id === 'select' ? `` : 'text-right',
-                      'px-4 py-3',
-                    )}
-                  >
-                    {flexRender(cell.column.columnDef.cell, cell.getContext())}
-                  </td>
-                )
-              })}
-            </tr>
-          )
-        })}
-      </tbody>
-    </table>
-  )
-}
diff --git a/src/components/Modals/AssetsSelect/Columns/Asset.tsx b/src/components/Modals/AssetsSelect/Columns/Asset.tsx
new file mode 100644
index 00000000..b29b098f
--- /dev/null
+++ b/src/components/Modals/AssetsSelect/Columns/Asset.tsx
@@ -0,0 +1,55 @@
+import { Row } from '@tanstack/react-table'
+
+import Checkbox from 'components/common/Checkbox'
+import Text from 'components/common/Text'
+import AssetImage from 'components/common/assets/AssetImage'
+import AssetRate from 'components/common/assets/AssetRate'
+
+export const ASSET_META = { id: 'name', header: 'Asset', accessorKey: 'asset.symbol' }
+
+interface Props {
+  row: Row<AssetTableRow>
+}
+
+function isBorrowAsset(object?: any): object is BorrowAsset {
+  if (!object) return false
+  return 'borrowRate' in object
+}
+
+export default function Asset(props: Props) {
+  const { row } = props
+  const asset = row.original.asset
+  const market = row.original.market
+  const isBorrow = isBorrowAsset(asset)
+  const showRate = !isBorrow && market?.borrowEnabled
+  const apy = isBorrow ? market?.apy.borrow : market?.apy.deposit
+
+  return (
+    <div className='flex items-center'>
+      <Checkbox
+        name={`asset-${asset.id.toLowerCase()}`}
+        checked={row.getIsSelected()}
+        onChange={row.getToggleSelectedHandler()}
+        noMouseEvents
+      />
+      <AssetImage asset={asset} size={24} className='ml-4' />
+      <div className='ml-2 text-left'>
+        <Text size='sm' className='mb-0.5 text-white'>
+          {asset.symbol}
+        </Text>
+        {showRate && market ? (
+          <AssetRate
+            rate={apy ?? 0}
+            isEnabled={market.borrowEnabled}
+            className='text-xs'
+            type='apy'
+            orientation='rtl'
+            suffix
+          />
+        ) : (
+          <Text size='xs'>{asset.name}</Text>
+        )}
+      </div>
+    </div>
+  )
+}
diff --git a/src/components/Modals/AssetsSelect/Columns/Balance.tsx b/src/components/Modals/AssetsSelect/Columns/Balance.tsx
new file mode 100644
index 00000000..b26187eb
--- /dev/null
+++ b/src/components/Modals/AssetsSelect/Columns/Balance.tsx
@@ -0,0 +1,38 @@
+import { Row } from '@tanstack/react-table'
+
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import { BN_ZERO } from 'constants/math'
+import { BNCoin } from 'types/classes/BNCoin'
+import { demagnify } from 'utils/formatters'
+import { BN } from 'utils/helpers'
+
+export const BALANCE_META = { id: 'value', header: 'Balance', accessorKey: 'value' }
+
+interface Props {
+  row: Row<AssetTableRow>
+}
+
+export const valueSortingFn = (a: Row<AssetTableRow>, b: Row<AssetTableRow>): number => {
+  const valueA = a.original.value ?? BN_ZERO
+  const valueB = b.original.value ?? BN_ZERO
+  return valueA.minus(valueB).toNumber()
+}
+
+export default function Balance(props: Props) {
+  const { row } = props
+  const asset = row.original.asset
+  const balance = BN(row.original.balance ?? '0')
+  const coin = BNCoin.fromDenomAndBigNumber(asset.denom, balance)
+
+  return (
+    <div className='flex flex-wrap items-center'>
+      <DisplayCurrency coin={coin} className='mb-0.5 w-full text-white' />
+      <FormattedNumber
+        className='w-full text-xs'
+        options={{ minDecimals: 2, maxDecimals: asset.decimals }}
+        amount={demagnify(balance, asset)}
+      />
+    </div>
+  )
+}
diff --git a/src/components/Modals/AssetsSelect/Columns/BorrowRate.tsx b/src/components/Modals/AssetsSelect/Columns/BorrowRate.tsx
new file mode 100644
index 00000000..4acf2a61
--- /dev/null
+++ b/src/components/Modals/AssetsSelect/Columns/BorrowRate.tsx
@@ -0,0 +1,25 @@
+import { Row } from '@tanstack/react-table'
+
+import Text from 'components/common/Text'
+import { formatPercent } from 'utils/formatters'
+
+export const BORROW_RATE_META = {
+  id: 'asset.borrowRate',
+  header: 'BorrowRate',
+  accessorKey: 'asset.borrowRate',
+}
+
+interface Props {
+  row: Row<AssetTableRow>
+}
+
+export default function BorrowRate(props: Props) {
+  const { row } = props
+  const asset = row.original.asset as BorrowAsset
+
+  return (
+    <Text size='sm' className='mb-0.5 text-white'>
+      {formatPercent(asset.borrowRate ?? 0)}
+    </Text>
+  )
+}
diff --git a/src/components/Modals/AssetsSelect/Columns/useAssetSelectColumns.tsx b/src/components/Modals/AssetsSelect/Columns/useAssetSelectColumns.tsx
new file mode 100644
index 00000000..fa98bf42
--- /dev/null
+++ b/src/components/Modals/AssetsSelect/Columns/useAssetSelectColumns.tsx
@@ -0,0 +1,30 @@
+import { ColumnDef } from '@tanstack/react-table'
+import { useMemo } from 'react'
+
+import Asset, { ASSET_META } from 'components/Modals/AssetsSelect/Columns/Asset'
+import Balance, {
+  BALANCE_META,
+  valueSortingFn,
+} from 'components/Modals/AssetsSelect/Columns/Balance'
+import BorrowRate, { BORROW_RATE_META } from 'components/Modals/AssetsSelect/Columns/BorrowRate'
+
+export default function useAssetSelectColumns(isBorrow?: boolean) {
+  return useMemo<ColumnDef<AssetTableRow>[]>(() => {
+    return [
+      {
+        ...ASSET_META,
+        cell: ({ row }) => <Asset row={row} />,
+      },
+      isBorrow
+        ? {
+            ...BORROW_RATE_META,
+            cell: ({ row }) => <BorrowRate row={row} />,
+          }
+        : {
+            ...BALANCE_META,
+            cell: ({ row }) => <Balance row={row} />,
+            sortingFn: valueSortingFn,
+          },
+    ]
+  }, [isBorrow])
+}
diff --git a/src/components/Modals/AssetsSelect/index.tsx b/src/components/Modals/AssetsSelect/index.tsx
new file mode 100644
index 00000000..3c8ffbf9
--- /dev/null
+++ b/src/components/Modals/AssetsSelect/index.tsx
@@ -0,0 +1,81 @@
+import { RowSelectionState } from '@tanstack/react-table'
+import { useEffect, useMemo, useState } from 'react'
+
+import useAssetSelectColumns from 'components/Modals/AssetsSelect/Columns/useAssetSelectColumns'
+import Table from 'components/common/Table'
+import useGetCoinValue from 'hooks/assets/useGetCoinValue'
+import useMarketAssets from 'hooks/markets/useMarketAssets'
+import useStore from 'store'
+import { BNCoin } from 'types/classes/BNCoin'
+import { byDenom } from 'utils/array'
+import { BN } from 'utils/helpers'
+
+interface Props {
+  assets: Asset[]
+  onChangeSelected: (selected: string[]) => void
+  selectedDenoms: string[]
+  isBorrow?: boolean
+}
+
+export default function AssetsSelect(props: Props) {
+  const { assets, onChangeSelected, selectedDenoms, isBorrow } = props
+  const columns = useAssetSelectColumns(isBorrow)
+  const { data: markets } = useMarketAssets()
+  const getCoinValue = useGetCoinValue()
+
+  const defaultSelected = useMemo(() => {
+    const selectableAssets = assets
+    return selectableAssets.reduce(
+      (acc, asset, index) => {
+        if (selectedDenoms?.includes(asset.denom)) {
+          acc[index] = true
+        }
+        return acc
+      },
+      {} as { [key: number]: boolean },
+    )
+  }, [selectedDenoms, assets])
+
+  const [selected, setSelected] = useState<RowSelectionState>(defaultSelected)
+
+  const balances = useStore((s) => s.balances)
+  const tableData: AssetTableRow[] = useMemo(() => {
+    return assets.map((asset) => {
+      const balancesForAsset = balances.find(byDenom(asset.denom))
+      const coin = BNCoin.fromDenomAndBigNumber(asset.denom, BN(balancesForAsset?.amount ?? '0'))
+      const value = getCoinValue(coin)
+      return {
+        asset,
+        balance: balancesForAsset?.amount ?? '0',
+        value,
+        market: markets.find((market) => market.denom === asset.denom),
+      }
+    })
+  }, [balances, assets, markets, getCoinValue])
+
+  useEffect(() => {
+    const selectedAssets = assets.filter((_, index) => selected[index])
+
+    const newSelectedDenoms = selectedAssets
+      .sort((a, b) => a.symbol.localeCompare(b.symbol))
+      .map((asset) => asset.denom)
+    if (
+      selectedDenoms.length === newSelectedDenoms.length &&
+      newSelectedDenoms.every((denom) => selectedDenoms.includes(denom))
+    )
+      return
+    onChangeSelected(newSelectedDenoms)
+  }, [selected, props, assets, selectedDenoms, onChangeSelected])
+
+  return (
+    <Table
+      title='Assets'
+      hideCard={true}
+      columns={columns}
+      data={tableData}
+      initialSorting={[{ id: isBorrow ? 'asset.borrowRate' : 'value', desc: !isBorrow }]}
+      setRowSelection={setSelected}
+      selectedRows={selected}
+    />
+  )
+}
diff --git a/src/components/Modals/AssetsSelect/useAssetTableColumns.tsx b/src/components/Modals/AssetsSelect/useAssetTableColumns.tsx
deleted file mode 100644
index 748c56b7..00000000
--- a/src/components/Modals/AssetsSelect/useAssetTableColumns.tsx
+++ /dev/null
@@ -1,96 +0,0 @@
-import { ColumnDef } from '@tanstack/react-table'
-import React from 'react'
-
-import AssetImage from 'components/Asset/AssetImage'
-import AssetRate from 'components/Asset/AssetRate'
-import Checkbox from 'components/Checkbox'
-import DisplayCurrency from 'components/DisplayCurrency'
-import { FormattedNumber } from 'components/FormattedNumber'
-import Text from 'components/Text'
-import { BNCoin } from 'types/classes/BNCoin'
-import { getAssetByDenom } from 'utils/assets'
-import { demagnify, formatPercent } from 'utils/formatters'
-
-function showBorrowRate(data: AssetTableRow[]) {
-  const assetData = data.length && (data[0].asset as BorrowAsset)
-  return !!(assetData && assetData?.borrowRate)
-}
-
-export default function useAssetTableColumns(isBorrow: boolean) {
-  return React.useMemo<ColumnDef<AssetTableRow>[]>(
-    () => [
-      {
-        header: 'Asset',
-        accessorKey: 'symbol',
-        id: 'symbol',
-        cell: ({ row }) => {
-          const asset = getAssetByDenom(row.original.asset.denom) as Asset
-          const market = row.original.market
-          const borrowAsset = row.original.asset as BorrowAsset
-          const showRate = !borrowAsset?.borrowRate
-          const apy = isBorrow ? market?.apy.borrow : market?.apy.deposit
-
-          return (
-            <div className='flex items-center'>
-              <Checkbox
-                name={`asset-${asset.id.toLowerCase()}`}
-                checked={row.getIsSelected()}
-                onChange={row.getToggleSelectedHandler()}
-                noMouseEvents
-              />
-              <AssetImage asset={asset} size={24} className='ml-4' />
-              <div className='ml-2 text-left'>
-                <Text size='sm' className='mb-0.5 text-white'>
-                  {asset.symbol}
-                </Text>
-                {showRate && market ? (
-                  <AssetRate
-                    rate={apy ?? 0}
-                    isEnabled={market.borrowEnabled}
-                    className='text-xs'
-                    type='apy'
-                    orientation='rtl'
-                    suffix
-                  />
-                ) : (
-                  <Text size='xs'>{asset.name}</Text>
-                )}
-              </div>
-            </div>
-          )
-        },
-      },
-      {
-        id: 'details',
-        header: (data) => {
-          const tableData = data.table.options.data as AssetTableRow[]
-          if (showBorrowRate(tableData)) return 'Borrow Rate'
-          return 'Balance'
-        },
-        cell: ({ row }) => {
-          const asset = row.original.asset as BorrowAsset
-          const balance = row.original.balance
-          if (asset?.borrowRate)
-            return (
-              <Text size='sm' className='mb-0.5 text-white'>
-                {formatPercent(asset.borrowRate ?? 0)}
-              </Text>
-            )
-          if (!balance) return null
-          const coin = new BNCoin({ denom: row.original.asset.denom, amount: balance })
-          return (
-            <div className='flex flex-wrap items-center'>
-              <DisplayCurrency coin={coin} className='mb-0.5 w-full text-white' />
-              <FormattedNumber
-                className='w-full text-xs'
-                options={{ minDecimals: 2, maxDecimals: asset.decimals }}
-                amount={demagnify(balance, asset)}
-              />
-            </div>
-          )
-        },
-      },
-    ],
-    [isBorrow],
-  )
-}
diff --git a/src/components/Modals/BorrowModal.tsx b/src/components/Modals/BorrowModal.tsx
index 193674ee..81fb7b66 100644
--- a/src/components/Modals/BorrowModal.tsx
+++ b/src/components/Modals/BorrowModal.tsx
@@ -1,24 +1,24 @@
 import BigNumber from 'bignumber.js'
 import { useCallback, useEffect, useMemo, useState } from 'react'
 
-import AccountSummary from 'components/Account/AccountSummary'
-import AssetImage from 'components/Asset/AssetImage'
-import Button from 'components/Button'
-import Card from 'components/Card'
-import DisplayCurrency from 'components/DisplayCurrency'
-import Divider from 'components/Divider'
-import { FormattedNumber } from 'components/FormattedNumber'
-import { ArrowRight, InfoCircle } from 'components/Icons'
-import Modal from 'components/Modal'
-import Switch from 'components/Switch'
-import Text from 'components/Text'
-import TitleAndSubCell from 'components/TitleAndSubCell'
-import TokenInputWithSlider from 'components/TokenInput/TokenInputWithSlider'
+import AccountSummary from 'components/account/AccountSummary'
+import AssetImage from 'components/common/assets/AssetImage'
+import Button from 'components/common/Button'
+import Card from 'components/common/Card'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import Divider from 'components/common/Divider'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import { ArrowRight, InfoCircle } from 'components/common/Icons'
+import Switch from 'components/common/Switch'
+import Text from 'components/common/Text'
+import TitleAndSubCell from 'components/common/TitleAndSubCell'
+import TokenInputWithSlider from 'components/common/TokenInput/TokenInputWithSlider'
+import Modal from 'components/Modals/Modal'
 import { BN_ZERO } from 'constants/math'
+import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
+import useMarketAssets from 'hooks/markets/useMarketAssets'
 import useAutoLend from 'hooks/useAutoLend'
-import useCurrentAccount from 'hooks/useCurrentAccount'
 import useHealthComputer from 'hooks/useHealthComputer'
-import useMarketAssets from 'hooks/useMarketAssets'
 import useToggle from 'hooks/useToggle'
 import { useUpdatedAccount } from 'hooks/useUpdatedAccount'
 import { getDepositAndLendCoinsToSpend } from 'hooks/useUpdatedAccount/functions'
diff --git a/src/components/Modals/FundWithdraw/FundAccount.tsx b/src/components/Modals/FundWithdraw/FundAccount.tsx
index 81b8da23..e5c5a2f4 100644
--- a/src/components/Modals/FundWithdraw/FundAccount.tsx
+++ b/src/components/Modals/FundWithdraw/FundAccount.tsx
@@ -1,4 +1,4 @@
-import AccountFundContent from 'components/Account/AccountFund/AccountFundContent'
+import AccountFundContent from 'components/account/AccountFund/AccountFundContent'
 import useStore from 'store'
 
 interface Props {
diff --git a/src/components/Modals/FundWithdraw/WithdrawFromAccount.tsx b/src/components/Modals/FundWithdraw/WithdrawFromAccount.tsx
index 52bd70a4..9488088a 100644
--- a/src/components/Modals/FundWithdraw/WithdrawFromAccount.tsx
+++ b/src/components/Modals/FundWithdraw/WithdrawFromAccount.tsx
@@ -1,14 +1,15 @@
 import BigNumber from 'bignumber.js'
 import { useEffect, useState } from 'react'
 
-import Button from 'components/Button'
-import Divider from 'components/Divider'
-import { ArrowRight } from 'components/Icons'
-import Switch from 'components/Switch'
-import Text from 'components/Text'
-import TokenInputWithSlider from 'components/TokenInput/TokenInputWithSlider'
-import { ASSETS } from 'constants/assets'
+import Button from 'components/common/Button'
+import Divider from 'components/common/Divider'
+import { ArrowRight } from 'components/common/Icons'
+import Switch from 'components/common/Switch'
+import Text from 'components/common/Text'
+import TokenInputWithSlider from 'components/common/TokenInput/TokenInputWithSlider'
 import { BN_ZERO } from 'constants/math'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import useMarketEnabledAssets from 'hooks/assets/useMarketEnabledAssets'
 import useHealthComputer from 'hooks/useHealthComputer'
 import useToggle from 'hooks/useToggle'
 import { useUpdatedAccount } from 'hooks/useUpdatedAccount'
@@ -16,7 +17,6 @@ import useStore from 'store'
 import { BNCoin } from 'types/classes/BNCoin'
 import { cloneAccount, getMergedBalancesForAsset, removeDepositsAndLends } from 'utils/accounts'
 import { byDenom } from 'utils/array'
-import { getEnabledMarketAssets } from 'utils/assets'
 
 interface Props {
   account: Account
@@ -24,8 +24,9 @@ interface Props {
 
 export default function WithdrawFromAccount(props: Props) {
   const { account } = props
+  const assets = useAllAssets()
   const defaultAsset =
-    ASSETS.find(byDenom(account.deposits[0]?.denom || account.lends[0]?.denom)) ?? ASSETS[0]
+    assets.find(byDenom(account.deposits[0]?.denom || account.lends[0]?.denom)) ?? assets[0]
   const withdraw = useStore((s) => s.withdraw)
   const [withdrawWithBorrowing, setWithdrawWithBorrowing] = useToggle()
   const [currentAsset, setCurrentAsset] = useState(defaultAsset)
@@ -35,7 +36,8 @@ export default function WithdrawFromAccount(props: Props) {
   const accountClone = cloneAccount(account)
   const borrowAccount = removeDepositsAndLends(accountClone, currentAsset.denom)
   const { computeMaxBorrowAmount } = useHealthComputer(borrowAccount)
-  const balances = getMergedBalancesForAsset(account, getEnabledMarketAssets())
+  const marketEnabledAssets = useMarketEnabledAssets()
+  const balances = getMergedBalancesForAsset(account, marketEnabledAssets)
   const maxWithdrawAmount = computeMaxWithdrawAmount(currentAsset.denom)
   const maxWithdrawWithBorrowAmount = computeMaxBorrowAmount(currentAsset.denom, 'wallet').plus(
     maxWithdrawAmount,
@@ -46,10 +48,12 @@ export default function WithdrawFromAccount(props: Props) {
   const max = withdrawWithBorrowing ? maxWithdrawWithBorrowAmount : maxWithdrawAmount
 
   const accountDeposit = account.deposits.find(byDenom(currentAsset.denom))?.amount ?? BN_ZERO
-  const shouldReclaim =
-    amount.isGreaterThan(accountDeposit) && !withdrawWithBorrowing && currentAsset.isAutoLendEnabled
-  const reclaimAmount = shouldReclaim ? amount.minus(accountDeposit) : BN_ZERO
-  const isReclaimingMaxAmount = maxWithdrawAmount.isEqualTo(amount)
+  const accountLent = account.lends.find(byDenom(currentAsset.denom))?.amount ?? BN_ZERO
+  const shouldReclaim = amount.isGreaterThan(accountDeposit) && !accountLent.isZero()
+  const isReclaimingMaxAmount = accountLent.isLessThanOrEqualTo(amount.minus(accountDeposit))
+  const reclaimAmount = isReclaimingMaxAmount
+    ? amount
+    : accountLent.minus(amount).minus(accountDeposit)
 
   function onChangeAmount(val: BigNumber) {
     setAmount(val)
@@ -65,13 +69,14 @@ export default function WithdrawFromAccount(props: Props) {
     const borrow = !debtAmount.isZero()
       ? [BNCoin.fromDenomAndBigNumber(currentAsset.denom, debtAmount)]
       : []
-    const reclaims = !reclaimAmount.isZero()
-      ? [
-          BNCoin.fromDenomAndBigNumber(currentAsset.denom, reclaimAmount).toActionCoin(
-            isReclaimingMaxAmount,
-          ),
-        ]
-      : []
+    const reclaims =
+      shouldReclaim && !reclaimAmount.isZero()
+        ? [
+            BNCoin.fromDenomAndBigNumber(currentAsset.denom, reclaimAmount).toActionCoin(
+              isReclaimingMaxAmount,
+            ),
+          ]
+        : []
 
     withdraw({
       accountId: account.id,
diff --git a/src/components/Modals/FundWithdraw/index.tsx b/src/components/Modals/FundWithdraw/index.tsx
index 619bbae3..2891c3df 100644
--- a/src/components/Modals/FundWithdraw/index.tsx
+++ b/src/components/Modals/FundWithdraw/index.tsx
@@ -1,7 +1,7 @@
 import FundWithdrawModalContent from 'components/Modals/FundWithdraw/FundAndWithdrawModalContent'
 import ModalContentWithSummary from 'components/Modals/ModalContentWithSummary'
-import Text from 'components/Text'
-import useAccount from 'hooks/useAccount'
+import Text from 'components/common/Text'
+import useAccount from 'hooks/accounts/useAccount'
 import useAccountId from 'hooks/useAccountId'
 import useStore from 'store'
 
diff --git a/src/components/Modals/GetStartedModal.tsx b/src/components/Modals/GetStartedModal.tsx
index 802adc32..2a403d64 100644
--- a/src/components/Modals/GetStartedModal.tsx
+++ b/src/components/Modals/GetStartedModal.tsx
@@ -1,8 +1,8 @@
 import { useCallback } from 'react'
 
-import { ChevronRight, Compass, HandCoins, Luggage } from 'components/Icons'
-import Modal from 'components/Modal'
-import Text from 'components/Text'
+import { ChevronRight, Compass, HandCoins, Luggage } from 'components/common/Icons'
+import Modal from 'components/Modals/Modal'
+import Text from 'components/common/Text'
 import useStore from 'store'
 import { DocURL } from 'types/enums/docURL'
 
diff --git a/src/components/Modals/HLS/Deposit/CreateAccount.tsx b/src/components/Modals/HLS/Deposit/CreateAccount.tsx
index f761fc08..a73b6147 100644
--- a/src/components/Modals/HLS/Deposit/CreateAccount.tsx
+++ b/src/components/Modals/HLS/Deposit/CreateAccount.tsx
@@ -1,10 +1,10 @@
 import React, { useState } from 'react'
 import { mutate } from 'swr'
 
-import Button from 'components/Button'
-import DocsLink from 'components/DocsLink'
-import { ArrowRight } from 'components/Icons'
-import Text from 'components/Text'
+import Button from 'components/common/Button'
+import DocsLink from 'components/common/DocsLink'
+import { ArrowRight } from 'components/common/Icons'
+import Text from 'components/common/Text'
 import useStore from 'store'
 
 export default function CreateAccount() {
diff --git a/src/components/Modals/HLS/Deposit/Leverage.tsx b/src/components/Modals/HLS/Deposit/Leverage.tsx
index e8e614e4..acb2da25 100644
--- a/src/components/Modals/HLS/Deposit/Leverage.tsx
+++ b/src/components/Modals/HLS/Deposit/Leverage.tsx
@@ -1,9 +1,9 @@
 import React, { useMemo } from 'react'
 
-import Button from 'components/Button'
-import { ArrowRight } from 'components/Icons'
+import Button from 'components/common/Button'
+import { ArrowRight } from 'components/common/Icons'
 import LeverageSummary from 'components/Modals/HLS/Deposit/LeverageSummary'
-import TokenInputWithSlider from 'components/TokenInput/TokenInputWithSlider'
+import TokenInputWithSlider from 'components/common/TokenInput/TokenInputWithSlider'
 import { getLeveragedApy } from 'utils/math'
 
 interface Props {
diff --git a/src/components/Modals/HLS/Deposit/LeverageSummary.tsx b/src/components/Modals/HLS/Deposit/LeverageSummary.tsx
index 995f66ba..7139eac2 100644
--- a/src/components/Modals/HLS/Deposit/LeverageSummary.tsx
+++ b/src/components/Modals/HLS/Deposit/LeverageSummary.tsx
@@ -1,6 +1,6 @@
 import React, { useMemo } from 'react'
 
-import SummaryItems from 'components/SummaryItems'
+import SummaryItems from 'components/common/SummaryItems'
 import useBorrowAsset from 'hooks/useBorrowAsset'
 
 interface Props {
diff --git a/src/components/Modals/HLS/Deposit/ProvideCollateral.tsx b/src/components/Modals/HLS/Deposit/ProvideCollateral.tsx
index f1ed8b49..8bff06a0 100644
--- a/src/components/Modals/HLS/Deposit/ProvideCollateral.tsx
+++ b/src/components/Modals/HLS/Deposit/ProvideCollateral.tsx
@@ -1,8 +1,8 @@
 import React from 'react'
 
-import Button from 'components/Button'
-import { ArrowRight } from 'components/Icons'
-import TokenInputWithSlider from 'components/TokenInput/TokenInputWithSlider'
+import Button from 'components/common/Button'
+import { ArrowRight } from 'components/common/Icons'
+import TokenInputWithSlider from 'components/common/TokenInput/TokenInputWithSlider'
 
 interface Props {
   amount: BigNumber
diff --git a/src/components/Modals/HLS/Deposit/SelectAccount.tsx b/src/components/Modals/HLS/Deposit/SelectAccount.tsx
index e0bf5362..e6a8330e 100644
--- a/src/components/Modals/HLS/Deposit/SelectAccount.tsx
+++ b/src/components/Modals/HLS/Deposit/SelectAccount.tsx
@@ -1,9 +1,9 @@
 import classNames from 'classnames'
 import React from 'react'
 
-import Button from 'components/Button'
-import { ArrowRight } from 'components/Icons'
-import Radio from 'components/Radio'
+import Button from 'components/common/Button'
+import { ArrowRight } from 'components/common/Icons'
+import Radio from 'components/common/Radio'
 
 interface Props {
   hlsAccounts: Account[]
diff --git a/src/components/Modals/HLS/Deposit/SubTitles.tsx b/src/components/Modals/HLS/Deposit/SubTitles.tsx
index 20dde03f..987f2bac 100644
--- a/src/components/Modals/HLS/Deposit/SubTitles.tsx
+++ b/src/components/Modals/HLS/Deposit/SubTitles.tsx
@@ -1,10 +1,11 @@
 import classNames from 'classnames'
 import React from 'react'
 
-import DisplayCurrency from 'components/DisplayCurrency'
-import { ExclamationMarkTriangle } from 'components/Icons'
-import Text from 'components/Text'
-import WarningMessages from 'components/WarningMessages'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import { ExclamationMarkTriangle } from 'components/common/Icons'
+import Text from 'components/common/Text'
+import WarningMessages from 'components/common/WarningMessages'
+import useAllAssets from 'hooks/assets/useAllAssets'
 import { BNCoin } from 'types/classes/BNCoin'
 import { formatAmountWithSymbol, formatLeverage } from 'utils/formatters'
 
@@ -33,6 +34,7 @@ interface CollateralSubTitleProps {
 }
 
 export function CollateralSubTitle(props: CollateralSubTitleProps) {
+  const assets = useAllAssets()
   if (props.isOpen) return null
 
   if (!props.isOpen && props.amount.isZero()) {
@@ -50,10 +52,13 @@ export function CollateralSubTitle(props: CollateralSubTitleProps) {
     <div className='flex items-center gap-1'>
       <WarningMessages messages={props.warningMessages} />
       <SubTitle
-        text={formatAmountWithSymbol({
-          denom: props.denom,
-          amount: props.amount.toString(),
-        })}
+        text={formatAmountWithSymbol(
+          {
+            denom: props.denom,
+            amount: props.amount.toString(),
+          },
+          assets,
+        )}
         color={props.warningMessages.length > 0 ? 'text-warning' : ''}
       />
     </div>
diff --git a/src/components/Modals/HLS/Deposit/Summary/ApyBreakdown.tsx b/src/components/Modals/HLS/Deposit/Summary/ApyBreakdown.tsx
index 051d6921..8e4b0ddb 100644
--- a/src/components/Modals/HLS/Deposit/Summary/ApyBreakdown.tsx
+++ b/src/components/Modals/HLS/Deposit/Summary/ApyBreakdown.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 
-import { FormattedNumber } from 'components/FormattedNumber'
-import Text from 'components/Text'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Text from 'components/common/Text'
 
 interface Props {
   items: { title: string; amount: number }[]
diff --git a/src/components/Modals/HLS/Deposit/Summary/AssetSummary.tsx b/src/components/Modals/HLS/Deposit/Summary/AssetSummary.tsx
index db4e08e8..cfee11fe 100644
--- a/src/components/Modals/HLS/Deposit/Summary/AssetSummary.tsx
+++ b/src/components/Modals/HLS/Deposit/Summary/AssetSummary.tsx
@@ -1,10 +1,10 @@
 import React from 'react'
 
-import AmountAndValue from 'components/AmountAndValue'
-import AssetImage from 'components/Asset/AssetImage'
-import { FormattedNumber } from 'components/FormattedNumber'
+import AmountAndValue from 'components/common/AmountAndValue'
+import AssetImage from 'components/common/assets/AssetImage'
+import { FormattedNumber } from 'components/common/FormattedNumber'
 import Container from 'components/Modals/HLS/Deposit/Summary/Container'
-import Text from 'components/Text'
+import Text from 'components/common/Text'
 
 interface Props {
   amount: BigNumber
diff --git a/src/components/Modals/HLS/Deposit/Summary/Container.tsx b/src/components/Modals/HLS/Deposit/Summary/Container.tsx
index 39ae06f2..8f14c571 100644
--- a/src/components/Modals/HLS/Deposit/Summary/Container.tsx
+++ b/src/components/Modals/HLS/Deposit/Summary/Container.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-import Text from 'components/Text'
+import Text from 'components/common/Text'
 
 interface Props {
   children: React.ReactNode
diff --git a/src/components/Modals/HLS/Deposit/Summary/YourPosition.tsx b/src/components/Modals/HLS/Deposit/Summary/YourPosition.tsx
index 3e0e57a2..ff4673c3 100644
--- a/src/components/Modals/HLS/Deposit/Summary/YourPosition.tsx
+++ b/src/components/Modals/HLS/Deposit/Summary/YourPosition.tsx
@@ -1,12 +1,12 @@
 import React, { useMemo } from 'react'
 
-import DisplayCurrency from 'components/DisplayCurrency'
-import { FormattedNumber } from 'components/FormattedNumber'
-import { InfoCircle } from 'components/Icons'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import { InfoCircle } from 'components/common/Icons'
 import AprBreakdown from 'components/Modals/HLS/Deposit/Summary/ApyBreakdown'
 import Container from 'components/Modals/HLS/Deposit/Summary/Container'
-import Text from 'components/Text'
-import { Tooltip } from 'components/Tooltip'
+import Text from 'components/common/Text'
+import { Tooltip } from 'components/common/Tooltip'
 import { BNCoin } from 'types/classes/BNCoin'
 
 interface Props {
diff --git a/src/components/Modals/HLS/Deposit/Summary/index.tsx b/src/components/Modals/HLS/Deposit/Summary/index.tsx
index a23140c4..43099a90 100644
--- a/src/components/Modals/HLS/Deposit/Summary/index.tsx
+++ b/src/components/Modals/HLS/Deposit/Summary/index.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 
-import Button from 'components/Button'
-import { ArrowRight } from 'components/Icons'
+import Button from 'components/common/Button'
+import { ArrowRight } from 'components/common/Icons'
 import AssetSummary from 'components/Modals/HLS/Deposit/Summary/AssetSummary'
 import YourPosition from 'components/Modals/HLS/Deposit/Summary/YourPosition'
 import useBorrowAsset from 'hooks/useBorrowAsset'
diff --git a/src/components/Modals/HLS/Deposit/index.tsx b/src/components/Modals/HLS/Deposit/index.tsx
index 119e0355..95d90401 100644
--- a/src/components/Modals/HLS/Deposit/index.tsx
+++ b/src/components/Modals/HLS/Deposit/index.tsx
@@ -1,11 +1,11 @@
 import React, { useMemo, useState } from 'react'
 
-import Accordion from 'components/Accordion'
+import Accordion from 'components/common/Accordion'
 import useStakingController from 'components/Modals/HLS/Deposit//useStakingController'
 import useVaultController from 'components/Modals/HLS/Deposit//useVaultController'
 import useAccordionItems from 'components/Modals/HLS/Deposit/useAccordionItems'
 import { EMPTY_ACCOUNT_HLS } from 'constants/accounts'
-import useAccounts from 'hooks/useAccounts'
+import useAccounts from 'hooks/accounts/useAccounts'
 import useCurrentWalletBalance from 'hooks/useCurrentWalletBalance'
 import useIsOpenArray from 'hooks/useIsOpenArray'
 import useVault from 'hooks/useVault'
diff --git a/src/components/Modals/HLS/Deposit/useAccordionItems.tsx b/src/components/Modals/HLS/Deposit/useAccordionItems.tsx
index 72c5fddc..e3080630 100644
--- a/src/components/Modals/HLS/Deposit/useAccordionItems.tsx
+++ b/src/components/Modals/HLS/Deposit/useAccordionItems.tsx
@@ -11,6 +11,7 @@ import {
 } from 'components/Modals/HLS/Deposit/SubTitles'
 import Summary from 'components/Modals/HLS/Deposit/Summary'
 import { BN_ZERO } from 'constants/math'
+import useAllAssets from 'hooks/assets/useAllAssets'
 import usePrices from 'hooks/usePrices'
 import { BNCoin } from 'types/classes/BNCoin'
 import { getCoinAmount, getCoinValue } from 'utils/formatters'
@@ -47,6 +48,7 @@ interface Props {
 
 export default function useAccordionItems(props: Props) {
   const { data: prices } = usePrices()
+  const assets = useAllAssets()
 
   const depositCapLeft = useMemo(() => {
     if (!props.strategy) return BN_ZERO
@@ -62,9 +64,10 @@ export default function useAccordionItems(props: Props) {
     const value = getCoinValue(
       BNCoin.fromDenomAndBigNumber(props.borrowAsset.denom, props.borrowAmount),
       prices,
+      assets,
     )
-    return getCoinAmount(props.collateralAsset.denom, value, prices)
-  }, [prices, props.borrowAmount, props.borrowAsset.denom, props.collateralAsset])
+    return getCoinAmount(props.collateralAsset.denom, value, prices, assets)
+  }, [assets, prices, props.borrowAmount, props.borrowAsset.denom, props.collateralAsset.denom])
 
   const collateralWarningMessages = useMemo(() => {
     const messages: string[] = []
@@ -73,11 +76,14 @@ export default function useAccordionItems(props: Props) {
     }
 
     if (props.depositAmount.isGreaterThan(depositCapLeft)) {
-      messages.push(getDepositCapMessage(props.collateralAsset.denom, depositCapLeft, 'deposit'))
+      messages.push(
+        getDepositCapMessage(props.collateralAsset.denom, depositCapLeft, 'deposit', assets),
+      )
     }
 
     return messages
   }, [
+    assets,
     depositCapLeft,
     props.collateralAsset.denom,
     props.collateralAsset.symbol,
@@ -90,21 +96,22 @@ export default function useAccordionItems(props: Props) {
 
     if (props.borrowAmount.isGreaterThan(props.maxBorrowAmount)) {
       messages.push(
-        getHealthFactorMessage(props.borrowAsset.denom, props.maxBorrowAmount, 'borrow'),
+        getHealthFactorMessage(props.borrowAsset.denom, props.maxBorrowAmount, 'borrow', assets),
       )
     }
 
     if (props.borrowAmount.isGreaterThan(borrowLiquidity)) {
-      messages.push(getLiquidityMessage(props.borrowAsset.denom, borrowLiquidity))
+      messages.push(getLiquidityMessage(props.borrowAsset.denom, borrowLiquidity, assets))
     }
 
     if (additionalDepositFromSwap.plus(props.depositAmount).isGreaterThan(props.maxBorrowAmount)) {
-      messages.push(getDepositCapMessage(props.borrowAsset.denom, depositCapLeft, 'borrow'))
+      messages.push(getDepositCapMessage(props.borrowAsset.denom, depositCapLeft, 'borrow', assets))
     }
 
     return messages
   }, [
     additionalDepositFromSwap,
+    assets,
     borrowLiquidity,
     depositCapLeft,
     props.borrowAmount,
diff --git a/src/components/Modals/HLS/Header.tsx b/src/components/Modals/HLS/Header.tsx
index f38c5b07..d9f747fd 100644
--- a/src/components/Modals/HLS/Header.tsx
+++ b/src/components/Modals/HLS/Header.tsx
@@ -1,8 +1,8 @@
 import React from 'react'
 
-import DoubleLogo from 'components/DoubleLogo'
-import HLSTag from 'components/HLS/HLSTag'
-import Text from 'components/Text'
+import DoubleLogo from 'components/common/DoubleLogo'
+import HLSTag from 'components/hls/HLSTag'
+import Text from 'components/common/Text'
 
 interface Props {
   primaryAsset: Asset
diff --git a/src/components/Modals/HLS/Manage/ChangeLeverage.tsx b/src/components/Modals/HLS/Manage/ChangeLeverage.tsx
index 4405a401..b69cd869 100644
--- a/src/components/Modals/HLS/Manage/ChangeLeverage.tsx
+++ b/src/components/Modals/HLS/Manage/ChangeLeverage.tsx
@@ -1,13 +1,14 @@
 import React, { useCallback, useMemo, useState } from 'react'
 
-import Button from 'components/Button'
+import Button from 'components/common/Button'
 import LeverageSummary from 'components/Modals/HLS/Deposit/LeverageSummary'
-import TokenInputWithSlider from 'components/TokenInput/TokenInputWithSlider'
+import TokenInputWithSlider from 'components/common/TokenInput/TokenInputWithSlider'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
 import { BN_ZERO } from 'constants/math'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import useHealthComputer from 'hooks/useHealthComputer'
-import useLocalStorage from 'hooks/useLocalStorage'
 import usePrices from 'hooks/usePrices'
 import { useUpdatedAccount } from 'hooks/useUpdatedAccount'
 import useStore from 'store'
@@ -28,6 +29,7 @@ interface Props {
 
 export default function ChangeLeverage(props: Props) {
   const { data: prices } = usePrices()
+  const assets = useAllAssets()
   const [slippage] = useLocalStorage<number>(LocalStorageKeys.SLIPPAGE, DEFAULT_SETTINGS.slippage)
   const {
     updatedAccount,
@@ -83,10 +85,11 @@ export default function ChangeLeverage(props: Props) {
     const [deposits, lends, debts, vaults] = getAccountPositionValues(
       updatedAccount || props.account,
       prices,
+      assets,
     )
 
     return deposits.plus(lends).plus(debts).plus(vaults)
-  }, [prices, props.account, updatedAccount])
+  }, [assets, prices, props.account, updatedAccount])
 
   const handleOnClick = useCallback(() => {
     useStore.setState({ hlsManageModal: null })
@@ -98,17 +101,19 @@ export default function ChangeLeverage(props: Props) {
       props.borrowAsset.denom,
       slippage,
       prices,
+      assets,
     )
     changeHlsStakingLeverage({ accountId: props.account.id, actions })
   }, [
     currentDebt,
-    changeHlsStakingLeverage,
     previousDebt,
-    prices,
-    props.account.id,
-    props.borrowAsset.denom,
     props.collateralAsset.denom,
+    props.borrowAsset.denom,
+    props.account.id,
     slippage,
+    prices,
+    assets,
+    changeHlsStakingLeverage,
   ])
 
   const addedDepositAmount = useMemo(
@@ -132,20 +137,25 @@ export default function ChangeLeverage(props: Props) {
     const borrowLiquidity = props.borrowAsset.liquidity?.amount || BN_ZERO
 
     if (borrowLiquidity.isLessThan(currentDebt.minus(previousDebt))) {
-      messages.push(getLiquidityMessage(props.borrowAsset.denom, borrowLiquidity))
+      messages.push(getLiquidityMessage(props.borrowAsset.denom, borrowLiquidity, assets))
     }
 
     if (maxBorrowAmount.isLessThan(currentDebt)) {
-      messages.push(getHealthFactorMessage(props.borrowAsset.denom, maxBorrowAmount, 'borrow'))
+      messages.push(
+        getHealthFactorMessage(props.borrowAsset.denom, maxBorrowAmount, 'borrow', assets),
+      )
     }
 
     if (addedDepositAmount.isGreaterThan(depositCapLeft)) {
-      messages.push(getDepositCapMessage(props.collateralAsset.denom, depositCapLeft, 'borrow'))
+      messages.push(
+        getDepositCapMessage(props.collateralAsset.denom, depositCapLeft, 'borrow', assets),
+      )
     }
 
     return messages
   }, [
     addedDepositAmount,
+    assets,
     currentDebt,
     depositCapLeft,
     maxBorrowAmount,
diff --git a/src/components/Modals/HLS/Manage/Deposit.tsx b/src/components/Modals/HLS/Manage/Deposit.tsx
index 5dd91547..c41b58af 100644
--- a/src/components/Modals/HLS/Manage/Deposit.tsx
+++ b/src/components/Modals/HLS/Manage/Deposit.tsx
@@ -1,14 +1,15 @@
 import BigNumber from 'bignumber.js'
 import React, { useCallback, useMemo } from 'react'
 
-import Button from 'components/Button'
-import Divider from 'components/Divider'
-import SummaryItems from 'components/SummaryItems'
-import Switch from 'components/Switch'
-import Text from 'components/Text'
-import TokenInputWithSlider from 'components/TokenInput/TokenInputWithSlider'
+import Button from 'components/common/Button'
+import Divider from 'components/common/Divider'
+import SummaryItems from 'components/common/SummaryItems'
+import Switch from 'components/common/Switch'
+import Text from 'components/common/Text'
+import TokenInputWithSlider from 'components/common/TokenInput/TokenInputWithSlider'
 import { BN_ZERO } from 'constants/math'
-import useDepositActions from 'hooks/HLS/useDepositActions'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import useDepositActions from 'hooks/hls/useDepositActions'
 import useBorrowAsset from 'hooks/useBorrowAsset'
 import useCurrentWalletBalance from 'hooks/useCurrentWalletBalance'
 import useHealthComputer from 'hooks/useHealthComputer'
@@ -40,6 +41,7 @@ export default function Deposit(props: Props) {
     useUpdatedAccount(props.account)
   const { computeMaxBorrowAmount } = useHealthComputer(updatedAccount)
 
+  const assets = useAllAssets()
   const { data: prices } = usePrices()
   const [keepLeverage, toggleKeepLeverage] = useToggle(true)
   const collateralAssetAmountInWallet = BN(
@@ -49,8 +51,8 @@ export default function Deposit(props: Props) {
   const borrowRate = useBorrowAsset(props.borrowAsset.denom)?.borrowRate || 0
 
   const currentLeverage = useMemo(
-    () => calculateAccountLeverage(props.account, prices).toNumber(),
-    [prices, props.account],
+    () => calculateAccountLeverage(props.account, prices, assets).toNumber(),
+    [prices, props.account, assets],
   )
 
   const depositCoin = useMemo(
@@ -83,7 +85,7 @@ export default function Deposit(props: Props) {
     )
 
     if (capLeft.isLessThan(depositCoin.amount.plus(addedDepositFromSwap))) {
-      messages.push(getDepositCapMessage(props.collateralAsset.denom, capLeft, 'deposit'))
+      messages.push(getDepositCapMessage(props.collateralAsset.denom, capLeft, 'deposit', assets))
     }
 
     if (collateralAssetAmountInWallet.isZero()) {
@@ -99,6 +101,7 @@ export default function Deposit(props: Props) {
     props.account.strategy.depositCap.used,
     props.collateralAsset.denom,
     props.collateralAsset.symbol,
+    assets,
   ])
 
   const maxBorrowAmount = useMemo(
@@ -109,17 +112,20 @@ export default function Deposit(props: Props) {
   const borrowWarningMessages = useMemo(() => {
     let messages: string[] = []
     if (borrowCoin.amount.isGreaterThan(maxBorrowAmount)) {
-      messages.push(getHealthFactorMessage(props.borrowAsset.denom, maxBorrowAmount, 'borrow'))
+      messages.push(
+        getHealthFactorMessage(props.borrowAsset.denom, maxBorrowAmount, 'borrow', assets),
+      )
     }
 
     const borrowLiquidity = props.borrowAsset.liquidity?.amount || BN_ZERO
 
     if (borrowCoin.amount.isGreaterThan(borrowLiquidity)) {
-      messages.push(getLiquidityMessage(props.borrowAsset.denom, borrowLiquidity))
+      messages.push(getLiquidityMessage(props.borrowAsset.denom, borrowLiquidity, assets))
     }
 
     return messages
   }, [
+    assets,
     borrowCoin.amount,
     maxBorrowAmount,
     props.borrowAsset.denom,
@@ -151,9 +157,10 @@ export default function Deposit(props: Props) {
         const depositValue = getCoinValue(
           BNCoin.fromDenomAndBigNumber(props.collateralAsset.denom, amount),
           prices,
+          assets,
         )
         const borrowValue = BN(currentLeverage - 1).times(depositValue)
-        additionalDebt = getCoinAmount(props.borrowAsset.denom, borrowValue, prices)
+        additionalDebt = getCoinAmount(props.borrowAsset.denom, borrowValue, prices, assets)
       }
 
       simulateHlsStakingDeposit(
@@ -168,6 +175,7 @@ export default function Deposit(props: Props) {
       props.borrowAsset.denom,
       props.collateralAsset.denom,
       simulateHlsStakingDeposit,
+      assets,
     ],
   )
 
diff --git a/src/components/Modals/HLS/Manage/Repay.tsx b/src/components/Modals/HLS/Manage/Repay.tsx
index 62da7f47..3dbf2ebf 100644
--- a/src/components/Modals/HLS/Manage/Repay.tsx
+++ b/src/components/Modals/HLS/Manage/Repay.tsx
@@ -1,9 +1,9 @@
 import BigNumber from 'bignumber.js'
 import { useCallback, useMemo } from 'react'
 
-import Button from 'components/Button'
-import SummaryItems from 'components/SummaryItems'
-import TokenInputWithSlider from 'components/TokenInput/TokenInputWithSlider'
+import Button from 'components/common/Button'
+import SummaryItems from 'components/common/SummaryItems'
+import TokenInputWithSlider from 'components/common/TokenInput/TokenInputWithSlider'
 import { BN_ZERO } from 'constants/math'
 import useCurrentWalletBalance from 'hooks/useCurrentWalletBalance'
 import { useUpdatedAccount } from 'hooks/useUpdatedAccount'
@@ -28,7 +28,7 @@ export default function Repay(props: Props) {
   const repay = useStore((s) => s.repay)
 
   const currentDebt: BigNumber = useMemo(
-    () => props.account.debts.find(byDenom(props.borrowAsset.denom)).amount || BN_ZERO,
+    () => props.account.debts.find(byDenom(props.borrowAsset.denom))?.amount || BN_ZERO,
     [props.account.debts, props.borrowAsset.denom],
   )
 
diff --git a/src/components/Modals/HLS/Manage/Withdraw.tsx b/src/components/Modals/HLS/Manage/Withdraw.tsx
index 9492e757..42121ae3 100644
--- a/src/components/Modals/HLS/Manage/Withdraw.tsx
+++ b/src/components/Modals/HLS/Manage/Withdraw.tsx
@@ -1,8 +1,9 @@
-import React, { useCallback, useMemo } from 'react'
+import { useCallback, useMemo } from 'react'
 
-import Button from 'components/Button'
-import TokenInputWithSlider from 'components/TokenInput/TokenInputWithSlider'
+import Button from 'components/common/Button'
+import TokenInputWithSlider from 'components/common/TokenInput/TokenInputWithSlider'
 import { BN_ZERO } from 'constants/math'
+import useAllAssets from 'hooks/assets/useAllAssets'
 import useHealthComputer from 'hooks/useHealthComputer'
 import { useUpdatedAccount } from 'hooks/useUpdatedAccount'
 import useStore from 'store'
@@ -20,6 +21,7 @@ interface Props {
 export default function Withdraw(props: Props) {
   const { removedDeposits, removeDeposits, updatedAccount } = useUpdatedAccount(props.account)
   const { computeMaxWithdrawAmount } = useHealthComputer(updatedAccount)
+  const assets = useAllAssets()
   const withdraw = useStore((s) => s.withdraw)
   const handleChange = useCallback(
     (amount: BigNumber) =>
@@ -40,6 +42,7 @@ export default function Withdraw(props: Props) {
 
   const onClick = useCallback(() => {
     useStore.setState({ hlsManageModal: null })
+    if (!removedDeposit) return
     withdraw({
       accountId: props.account.id,
       coins: [{ coin: removedDeposit }],
@@ -52,10 +55,12 @@ export default function Withdraw(props: Props) {
 
   const warningMessages = useMemo(() => {
     if (maxWithdrawAmount.isLessThan(withdrawAmount) || maxWithdrawAmount.isZero()) {
-      return [getHealthFactorMessage(props.collateralAsset.denom, maxWithdrawAmount, 'withdraw')]
+      return [
+        getHealthFactorMessage(props.collateralAsset.denom, maxWithdrawAmount, 'withdraw', assets),
+      ]
     }
     return []
-  }, [maxWithdrawAmount, props.collateralAsset.denom, withdrawAmount])
+  }, [assets, maxWithdrawAmount, props.collateralAsset.denom, withdrawAmount])
 
   return (
     <>
diff --git a/src/components/Modals/HLS/Manage/index.tsx b/src/components/Modals/HLS/Manage/index.tsx
index 139fb738..b54c78df 100644
--- a/src/components/Modals/HLS/Manage/index.tsx
+++ b/src/components/Modals/HLS/Manage/index.tsx
@@ -6,15 +6,15 @@ import Deposit from 'components/Modals/HLS/Manage/Deposit'
 import Repay from 'components/Modals/HLS/Manage/Repay'
 import Withdraw from 'components/Modals/HLS/Manage/Withdraw'
 import ModalContentWithSummary from 'components/Modals/ModalContentWithSummary'
-import useAccount from 'hooks/useAccount'
+import useAccount from 'hooks/accounts/useAccount'
+import useAsset from 'hooks/assets/useAsset'
 import useBorrowAsset from 'hooks/useBorrowAsset'
 import useStore from 'store'
-import { getAssetByDenom } from 'utils/assets'
 
 export default function HlsManageModalController() {
   const modal = useStore((s) => s.hlsManageModal)
   const { data: account } = useAccount(modal?.accountId)
-  const collateralAsset = getAssetByDenom(modal?.staking.strategy.denoms.deposit || '')
+  const collateralAsset = useAsset(modal?.staking.strategy.denoms.deposit || '')
   const borrowAsset = useBorrowAsset(modal?.staking.strategy.denoms.borrow || '')
 
   if (!modal || !collateralAsset || !borrowAsset || !account) return null
diff --git a/src/components/Modals/HLS/index.tsx b/src/components/Modals/HLS/index.tsx
index 6ad39d10..89b25210 100644
--- a/src/components/Modals/HLS/index.tsx
+++ b/src/components/Modals/HLS/index.tsx
@@ -1,16 +1,16 @@
 import React from 'react'
 
-import Modal from 'components/Modal'
+import Modal from 'components/Modals/Modal'
 import Content from 'components/Modals/HLS/Deposit'
 import Header from 'components/Modals/HLS/Header'
+import useAsset from 'hooks/assets/useAsset'
 import useBorrowAsset from 'hooks/useBorrowAsset'
 import useStore from 'store'
-import { getAssetByDenom } from 'utils/assets'
 
 export default function HlsModalController() {
   const modal = useStore((s) => s.hlsModal)
 
-  const primaryAsset = getAssetByDenom(
+  const primaryAsset = useAsset(
     modal?.vault?.denoms.primary || modal?.strategy?.denoms.deposit || '',
   )
 
diff --git a/src/components/Modals/LendAndReclaim/DetailsHeader.tsx b/src/components/Modals/LendAndReclaim/DetailsHeader.tsx
index f2439db7..c713a65c 100644
--- a/src/components/Modals/LendAndReclaim/DetailsHeader.tsx
+++ b/src/components/Modals/LendAndReclaim/DetailsHeader.tsx
@@ -1,6 +1,6 @@
-import DisplayCurrency from 'components/DisplayCurrency'
-import { FormattedNumber } from 'components/FormattedNumber'
-import TitleAndSubCell from 'components/TitleAndSubCell'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import TitleAndSubCell from 'components/common/TitleAndSubCell'
 import useAssetIncentivesApy from 'hooks/useAssetIncentiveApy'
 import useCurrentWalletBalance from 'hooks/useCurrentWalletBalance'
 import { BNCoin } from 'types/classes/BNCoin'
@@ -15,7 +15,7 @@ function DetailsHeader({ data }: Props) {
   const balanceInWallet = useCurrentWalletBalance(asset.denom)
 
   return (
-    <div className='flex gap-6 border-b border-white/5 px-6 py-4 gradient-header'>
+    <div className='flex gap-6 px-6 py-4 border-b border-white/5 gradient-header'>
       {assetApy && (
         <>
           <TitleAndSubCell
@@ -40,7 +40,7 @@ function DetailsHeader({ data }: Props) {
           <TitleAndSubCell
             title={
               <DisplayCurrency
-                coin={new BNCoin({ denom: asset.denom, amount: accountLentAmount })}
+                coin={new BNCoin({ denom: asset.denom, amount: accountLentAmount.toString() })}
               />
             }
             sub={'Deposited'}
diff --git a/src/components/Modals/LendAndReclaim/index.tsx b/src/components/Modals/LendAndReclaim/index.tsx
index 1e1aa532..28e9c00c 100644
--- a/src/components/Modals/LendAndReclaim/index.tsx
+++ b/src/components/Modals/LendAndReclaim/index.tsx
@@ -2,7 +2,7 @@ import { useCallback } from 'react'
 
 import AssetAmountSelectActionModal from 'components/Modals/AssetAmountSelectActionModal'
 import DetailsHeader from 'components/Modals/LendAndReclaim/DetailsHeader'
-import useCurrentAccount from 'hooks/useCurrentAccount'
+import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
 import useLendAndReclaimModal from 'hooks/useLendAndReclaimModal'
 import { useUpdatedAccount } from 'hooks/useUpdatedAccount'
 import useStore from 'store'
diff --git a/src/components/Modal.tsx b/src/components/Modals/Modal.tsx
similarity index 95%
rename from src/components/Modal.tsx
rename to src/components/Modals/Modal.tsx
index 14175290..5b9a9480 100644
--- a/src/components/Modal.tsx
+++ b/src/components/Modals/Modal.tsx
@@ -1,8 +1,8 @@
 import classNames from 'classnames'
 import { ReactNode, useEffect, useRef } from 'react'
 
-import EscButton from 'components/Button/EscButton'
-import Card from 'components/Card'
+import EscButton from 'components/common/Button/EscButton'
+import Card from 'components/common/Card'
 
 export interface ModalProps {
   header: string | ReactNode
diff --git a/src/components/Modals/ModalContentWithSummary.tsx b/src/components/Modals/ModalContentWithSummary.tsx
index e1d2db4f..cd0ef2a9 100644
--- a/src/components/Modals/ModalContentWithSummary.tsx
+++ b/src/components/Modals/ModalContentWithSummary.tsx
@@ -1,10 +1,10 @@
 import classNames from 'classnames'
 import React from 'react'
 
-import AccountSummary from 'components/Account/AccountSummary'
-import Card from 'components/Card'
-import { CircularProgress } from 'components/CircularProgress'
-import Modal, { ModalProps } from 'components/Modal'
+import AccountSummary from 'components/account/AccountSummary'
+import Card from 'components/common/Card'
+import { CircularProgress } from 'components/common/CircularProgress'
+import Modal, { ModalProps } from 'components/Modals/Modal'
 import useStore from 'store'
 
 interface Props extends ModalProps {
diff --git a/src/components/Modals/Settings/SettingsOptions.tsx b/src/components/Modals/Settings/SettingsOptions.tsx
index 1a22bbfb..70e3f0da 100644
--- a/src/components/Modals/Settings/SettingsOptions.tsx
+++ b/src/components/Modals/Settings/SettingsOptions.tsx
@@ -1,7 +1,7 @@
 import classNames from 'classnames'
 import { ReactNode } from 'react'
 
-import Text from 'components/Text'
+import Text from 'components/common/Text'
 
 interface Props {
   label: string
diff --git a/src/components/Modals/Settings/SettingsSwitch.tsx b/src/components/Modals/Settings/SettingsSwitch.tsx
index 65c09779..a52f7607 100644
--- a/src/components/Modals/Settings/SettingsSwitch.tsx
+++ b/src/components/Modals/Settings/SettingsSwitch.tsx
@@ -1,7 +1,7 @@
 import classNames from 'classnames'
 
-import Switch from 'components/Switch'
-import Text from 'components/Text'
+import Switch from 'components/common/Switch'
+import Text from 'components/common/Text'
 
 interface Props {
   onChange: (value: boolean) => void
diff --git a/src/components/Modals/Settings/index.tsx b/src/components/Modals/Settings/index.tsx
index 11bc4934..0b899d5f 100644
--- a/src/components/Modals/Settings/index.tsx
+++ b/src/components/Modals/Settings/index.tsx
@@ -1,24 +1,26 @@
 import classNames from 'classnames'
 import { useCallback, useMemo, useState } from 'react'
 
-import AssetImage from 'components/Asset/AssetImage'
-import Button from 'components/Button'
-import { ArrowCircle, Enter } from 'components/Icons'
-import Modal from 'components/Modal'
+import Modal from 'components/Modals/Modal'
 import SettingsOptions from 'components/Modals/Settings/SettingsOptions'
 import SettingsSwitch from 'components/Modals/Settings/SettingsSwitch'
-import NumberInput from 'components/NumberInput'
-import Select from 'components/Select'
-import Text from 'components/Text'
-import { TextLink } from 'components/TextLink'
+import Button from 'components/common/Button'
+import { ArrowCircle, Enter } from 'components/common/Icons'
+import NumberInput from 'components/common/NumberInput'
+import Select from 'components/common/Select'
+import Text from 'components/common/Text'
+import { TextLink } from 'components/common/TextLink'
+import AssetImage from 'components/common/assets/AssetImage'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
 import { BN_ZERO } from 'constants/math'
+import useDisplayCurrencyAssets from 'hooks/assets/useDisplayCurrencyAssets'
+import useDisplayCurrency from 'hooks/localStorage/useDisplayCurrency'
+import useEnableAutoLendGlobal from 'hooks/localStorage/useEnableAutoLendGlobal'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import useAlertDialog from 'hooks/useAlertDialog'
 import useAutoLend from 'hooks/useAutoLend'
-import useLocalStorage from 'hooks/useLocalStorage'
 import useStore from 'store'
-import { getDisplayCurrencies } from 'utils/assets'
 import { BN } from 'utils/helpers'
 
 const slippages = [0.02, 0.03]
@@ -26,15 +28,13 @@ const slippages = [0.02, 0.03]
 export default function SettingsModal() {
   const modal = useStore((s) => s.settingsModal)
   const { open: showResetDialog } = useAlertDialog()
-  const displayCurrencies = getDisplayCurrencies()
+  const displayCurrencies = useDisplayCurrencyAssets()
   const { setAutoLendOnAllAccounts } = useAutoLend()
   const [customSlippage, setCustomSlippage] = useState<number>(0)
   const [inputRef, setInputRef] = useState<React.RefObject<HTMLInputElement>>()
   const [isCustom, setIsCustom] = useState(false)
-  const [displayCurrency, setDisplayCurrency] = useLocalStorage<string>(
-    LocalStorageKeys.DISPLAY_CURRENCY,
-    DEFAULT_SETTINGS.displayCurrency,
-  )
+
+  const [displayCurrency, setDisplayCurrency] = useDisplayCurrency()
   const [reduceMotion, setReduceMotion] = useLocalStorage<boolean>(
     LocalStorageKeys.REDUCE_MOTION,
     DEFAULT_SETTINGS.reduceMotion,
@@ -43,14 +43,15 @@ export default function SettingsModal() {
     LocalStorageKeys.TUTORIAL,
     DEFAULT_SETTINGS.tutorial,
   )
-  const [lendAssets, setLendAssets] = useLocalStorage<boolean>(
-    LocalStorageKeys.LEND_ASSETS,
-    DEFAULT_SETTINGS.lendAssets,
-  )
+  const [enableAutoLendGlobal, setLendAssets] = useEnableAutoLendGlobal()
   const [slippage, setSlippage] = useLocalStorage<number>(
     LocalStorageKeys.SLIPPAGE,
     DEFAULT_SETTINGS.slippage,
   )
+  const [updateOracle, setUpdateOracle] = useLocalStorage<boolean>(
+    LocalStorageKeys.UPDATE_ORACLE,
+    DEFAULT_SETTINGS.updateOracle,
+  )
 
   const displayCurrenciesOptions = useMemo(
     () =>
@@ -148,9 +149,16 @@ export default function SettingsModal() {
     handleDisplayCurrency(DEFAULT_SETTINGS.displayCurrency)
     handleSlippage(DEFAULT_SETTINGS.slippage)
     handleReduceMotion(DEFAULT_SETTINGS.reduceMotion)
-    handleLendAssets(DEFAULT_SETTINGS.lendAssets)
+    handleLendAssets(DEFAULT_SETTINGS.enableAutoLendGlobal)
   }, [handleDisplayCurrency, handleReduceMotion, handleLendAssets, handleSlippage])
 
+  const handleUpdateOracle = useCallback(
+    (value: boolean) => {
+      setUpdateOracle(value)
+    },
+    [setUpdateOracle],
+  )
+
   const showResetModal = useCallback(() => {
     showResetDialog({
       icon: (
@@ -193,12 +201,21 @@ export default function SettingsModal() {
     >
       <SettingsSwitch
         onChange={handleLendAssets}
-        name='lendAssets'
-        value={lendAssets}
+        name='enableAutoLendGlobal'
+        value={enableAutoLendGlobal}
         label='Lend assets in Credit Accounts'
         description='By turning this on you will automatically lend out all the assets you deposit into your Credit Accounts to earn yield.'
         withStatus
       />
+
+      <SettingsSwitch
+        onChange={handleUpdateOracle}
+        name='updateOracle'
+        value={updateOracle}
+        label='Update Pyth Oracles on transactions'
+        description={`When this setting is on, your Mars transactions will automatically trigger an update of Pyth's price oracles. This increases the accuracy of the prices shown in the UI. In some instances, this could cause your transactions to fail when using a Ledger hardware wallet. If you encounter transaction failures with Ledger, please turn this setting off.`}
+        withStatus
+      />
       <SettingsSwitch
         onChange={handleReduceMotion}
         name='reduceMotion'
diff --git a/src/components/Modals/Unlock/UnlockModalContent.tsx b/src/components/Modals/Unlock/UnlockModalContent.tsx
index a42205b4..7d06a391 100644
--- a/src/components/Modals/Unlock/UnlockModalContent.tsx
+++ b/src/components/Modals/Unlock/UnlockModalContent.tsx
@@ -1,6 +1,6 @@
-import Button from 'components/Button'
+import Button from 'components/common/Button'
 import { NoIcon, YesIcon } from 'components/Modals/AlertDialog/ButtonIcons'
-import Text from 'components/Text'
+import Text from 'components/common/Text'
 import useAccountId from 'hooks/useAccountId'
 import useStore from 'store'
 
diff --git a/src/components/Modals/Unlock/index.tsx b/src/components/Modals/Unlock/index.tsx
index 591acda8..d5ef9ded 100644
--- a/src/components/Modals/Unlock/index.tsx
+++ b/src/components/Modals/Unlock/index.tsx
@@ -1,5 +1,5 @@
-import { LockUnlocked } from 'components/Icons'
-import Modal from 'components/Modal'
+import { LockUnlocked } from 'components/common/Icons'
+import Modal from 'components/Modals/Modal'
 import UnlockModalContent from 'components/Modals/Unlock/UnlockModalContent'
 import useStore from 'store'
 
diff --git a/src/components/Modals/Vault/VaultBorrowings.tsx b/src/components/Modals/Vault/VaultBorrowings.tsx
index d2ae0736..9ba691c1 100644
--- a/src/components/Modals/Vault/VaultBorrowings.tsx
+++ b/src/components/Modals/Vault/VaultBorrowings.tsx
@@ -1,24 +1,25 @@
 import BigNumber from 'bignumber.js'
 import React, { useEffect, useMemo, useState } from 'react'
 
-import Button from 'components/Button'
-import DepositCapMessage from 'components/DepositCapMessage'
-import DisplayCurrency from 'components/DisplayCurrency'
-import Divider from 'components/Divider'
-import { ArrowRight, ExclamationMarkCircled } from 'components/Icons'
-import Index from 'components/Slider'
-import Text from 'components/Text'
-import TokenInput from 'components/TokenInput'
+import Button from 'components/common/Button'
+import DepositCapMessage from 'components/common/DepositCapMessage'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import Divider from 'components/common/Divider'
+import { ArrowRight, ExclamationMarkCircled } from 'components/common/Icons'
+import Index from 'components/common/Slider'
+import Text from 'components/common/Text'
+import TokenInput from 'components/common/TokenInput'
 import { BN_ZERO } from 'constants/math'
 import { ORACLE_DENOM } from 'constants/oracle'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import useMarketAssets from 'hooks/markets/useMarketAssets'
 import useHealthComputer from 'hooks/useHealthComputer'
-import useMarketAssets from 'hooks/useMarketAssets'
 import usePrices from 'hooks/usePrices'
 import useStore from 'store'
 import { BNCoin } from 'types/classes/BNCoin'
 import { Action } from 'types/generated/mars-credit-manager/MarsCreditManager.types'
 import { byDenom } from 'utils/array'
-import { findCoinByDenom, getAssetByDenom } from 'utils/assets'
+import { findCoinByDenom } from 'utils/assets'
 import { formatPercent } from 'utils/formatters'
 import { getValueFromBNCoins, mergeBNCoinArrays } from 'utils/helpers'
 
@@ -36,6 +37,7 @@ export interface VaultBorrowingsProps {
 }
 
 export default function VaultBorrowings(props: VaultBorrowingsProps) {
+  const assets = useAllAssets()
   const { borrowings, onChangeBorrowings } = props
   const { data: marketAssets } = useMarketAssets()
   const { data: prices } = usePrices()
@@ -85,8 +87,8 @@ export default function VaultBorrowings(props: VaultBorrowingsProps) {
   }, [maxBorrowAmountsRaw, props.borrowings])
 
   const totalValue = useMemo(
-    () => getValueFromBNCoins(mergeBNCoinArrays(props.deposits, props.borrowings), prices),
-    [props.borrowings, props.deposits, prices],
+    () => getValueFromBNCoins(mergeBNCoinArrays(props.deposits, props.borrowings), prices, assets),
+    [props.deposits, props.borrowings, prices, assets],
   )
 
   useEffect(() => {
@@ -176,7 +178,7 @@ export default function VaultBorrowings(props: VaultBorrowingsProps) {
   return (
     <div className='flex flex-col flex-1 gap-4 p-4'>
       {props.borrowings.map((coin) => {
-        const asset = getAssetByDenom(coin.denom)
+        const asset = assets.find(byDenom(coin.denom))
         const maxAmount = maxBorrowAmounts.find(byDenom(coin.denom))?.amount
         if (!asset || !maxAmount)
           return <React.Fragment key={`input-${coin.denom}`}></React.Fragment>
@@ -224,7 +226,7 @@ export default function VaultBorrowings(props: VaultBorrowingsProps) {
           />
         </div>
         {props.borrowings.map((coin) => {
-          const asset = getAssetByDenom(coin.denom)
+          const asset = assets.find(byDenom(coin.denom))
           const borrowRate = marketAssets?.find((market) => market.denom === coin.denom)?.apy.borrow
 
           if (!asset || !borrowRate)
diff --git a/src/components/Modals/Vault/VaultBorrowingsSubTitle.tsx b/src/components/Modals/Vault/VaultBorrowingsSubTitle.tsx
index 409cb1c6..76b1588a 100644
--- a/src/components/Modals/Vault/VaultBorrowingsSubTitle.tsx
+++ b/src/components/Modals/Vault/VaultBorrowingsSubTitle.tsx
@@ -1,13 +1,14 @@
 import classNames from 'classnames'
 import { useMemo } from 'react'
 
-import DisplayCurrency from 'components/DisplayCurrency'
-import Text from 'components/Text'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import Text from 'components/common/Text'
 import { BN_ZERO } from 'constants/math'
+import { ORACLE_DENOM } from 'constants/oracle'
+import useAllAssets from 'hooks/assets/useAllAssets'
 import usePrices from 'hooks/usePrices'
 import { BNCoin } from 'types/classes/BNCoin'
 import { formatAmountWithSymbol, getCoinValue } from 'utils/formatters'
-import { ORACLE_DENOM } from 'constants/oracle'
 
 interface Props {
   borrowings: BNCoin[]
@@ -16,16 +17,16 @@ interface Props {
 
 export default function VaultBorrowingsSubTitle(props: Props) {
   const { data: prices } = usePrices()
-
+  const assets = useAllAssets()
   const borrowingValue = useMemo(() => {
     let borrowingValue = BN_ZERO
     props.borrowings.map((coin) => {
       const price = prices.find((p) => p.denom === coin.denom)?.amount
       if (!price || coin.amount.isZero()) return
-      borrowingValue = getCoinValue(coin, prices)
+      borrowingValue = getCoinValue(coin, prices, assets)
     })
     return borrowingValue
-  }, [props.borrowings, prices])
+  }, [props.borrowings, prices, assets])
 
   const borrowingTexts = useMemo(
     () =>
@@ -38,10 +39,10 @@ export default function VaultBorrowingsSubTitle(props: Props) {
             index !== 0 && 'ml-1 before:pr-1 before:content-["+"]',
           )}
         >
-          {formatAmountWithSymbol(borrowing.toCoin())}
+          {formatAmountWithSymbol(borrowing.toCoin(), assets)}
         </Text>
       )),
-    [props.borrowings],
+    [assets, props.borrowings],
   )
 
   return (
diff --git a/src/components/Modals/Vault/VaultDeposits.tsx b/src/components/Modals/Vault/VaultDeposits.tsx
index 571f19c7..2bc4eb91 100644
--- a/src/components/Modals/Vault/VaultDeposits.tsx
+++ b/src/components/Modals/Vault/VaultDeposits.tsx
@@ -1,18 +1,19 @@
 import BigNumber from 'bignumber.js'
 import { useMemo, useState } from 'react'
 
-import Button from 'components/Button'
-import DepositCapMessage from 'components/DepositCapMessage'
-import DisplayCurrency from 'components/DisplayCurrency'
-import Divider from 'components/Divider'
-import { Gauge } from 'components/Gauge'
-import { ArrowRight, ExclamationMarkCircled } from 'components/Icons'
-import Slider from 'components/Slider'
-import Switch from 'components/Switch'
-import Text from 'components/Text'
-import TokenInput from 'components/TokenInput'
+import Button from 'components/common/Button'
+import DepositCapMessage from 'components/common/DepositCapMessage'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import Divider from 'components/common/Divider'
+import { Gauge } from 'components/common/Gauge'
+import { ArrowRight, ExclamationMarkCircled } from 'components/common/Icons'
+import Slider from 'components/common/Slider'
+import Switch from 'components/common/Switch'
+import Text from 'components/common/Text'
+import TokenInput from 'components/common/TokenInput'
 import { BN_ZERO } from 'constants/math'
 import { ORACLE_DENOM } from 'constants/oracle'
+import useAllAssets from 'hooks/assets/useAllAssets'
 import usePrices from 'hooks/usePrices'
 import { BNCoin } from 'types/classes/BNCoin'
 import { accumulateAmounts } from 'utils/accounts'
@@ -41,6 +42,7 @@ export default function VaultDeposit(props: Props) {
     [account.deposits, account.lends, primaryAsset.denom, secondaryAsset.denom],
   )
   const { data: prices } = usePrices()
+  const assets = useAllAssets()
   const primaryPrice = prices.find(byDenom(primaryAsset.denom))?.amount ?? BN_ZERO
   const secondaryPrice = prices.find(byDenom(secondaryAsset.denom))?.amount ?? BN_ZERO
 
@@ -55,13 +57,13 @@ export default function VaultDeposit(props: Props) {
   }, [deposits, secondaryAsset.denom])
 
   const primaryValue = useMemo(
-    () => getValueFromBNCoins([primaryCoin], prices),
-    [primaryCoin, prices],
+    () => getValueFromBNCoins([primaryCoin], prices, assets),
+    [primaryCoin, prices, assets],
   )
 
   const totalValue = useMemo(
-    () => getValueFromBNCoins([primaryCoin, secondaryCoin], prices),
-    [primaryCoin, secondaryCoin, prices],
+    () => getValueFromBNCoins([primaryCoin, secondaryCoin], prices, assets),
+    [primaryCoin, secondaryCoin, prices, assets],
   )
 
   const primaryValuePercentage = useMemo(() => {
diff --git a/src/components/Modals/Vault/VaultDepositsSubTitle.tsx b/src/components/Modals/Vault/VaultDepositsSubTitle.tsx
index 46477b08..78f61c55 100644
--- a/src/components/Modals/Vault/VaultDepositsSubTitle.tsx
+++ b/src/components/Modals/Vault/VaultDepositsSubTitle.tsx
@@ -2,13 +2,14 @@ import BigNumber from 'bignumber.js'
 import classNames from 'classnames'
 import { useMemo } from 'react'
 
-import DisplayCurrency from 'components/DisplayCurrency'
-import Text from 'components/Text'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import Text from 'components/common/Text'
+import { ORACLE_DENOM } from 'constants/oracle'
+import useAllAssets from 'hooks/assets/useAllAssets'
 import usePrices from 'hooks/usePrices'
 import { BNCoin } from 'types/classes/BNCoin'
 import { formatAmountWithSymbol } from 'utils/formatters'
 import { getValueFromBNCoins } from 'utils/helpers'
-import { ORACLE_DENOM } from 'constants/oracle'
 
 interface Props {
   primaryAmount: BigNumber
@@ -20,28 +21,35 @@ interface Props {
 
 export default function VaultDepositSubTitle(props: Props) {
   const { data: prices } = usePrices()
+  const assets = useAllAssets()
   const primaryText = useMemo(
     () => (
       <Text size='xs' className='inline mt-1 text-white/60'>
-        {formatAmountWithSymbol({
-          denom: props.primaryAsset.denom,
-          amount: props.primaryAmount.toString(),
-        })}
+        {formatAmountWithSymbol(
+          {
+            denom: props.primaryAsset.denom,
+            amount: props.primaryAmount.toString(),
+          },
+          assets,
+        )}
       </Text>
     ),
-    [props.primaryAmount, props.primaryAsset.denom],
+    [assets, props.primaryAmount, props.primaryAsset.denom],
   )
 
   const secondaryText = useMemo(
     () => (
       <Text size='xs' className='inline mt-1 text-white/60 ml-1 before:pr-1 before:content-["+"]'>
-        {formatAmountWithSymbol({
-          denom: props.secondaryAsset.denom,
-          amount: props.secondaryAmount.toString(),
-        })}
+        {formatAmountWithSymbol(
+          {
+            denom: props.secondaryAsset.denom,
+            amount: props.secondaryAmount.toString(),
+          },
+          assets,
+        )}
       </Text>
     ),
-    [props.secondaryAmount, props.secondaryAsset.denom],
+    [assets, props.secondaryAmount, props.secondaryAsset.denom],
   )
 
   const positionValue = getValueFromBNCoins(
@@ -50,6 +58,7 @@ export default function VaultDepositSubTitle(props: Props) {
       BNCoin.fromDenomAndBigNumber(props.secondaryAsset.denom, props.secondaryAmount),
     ],
     prices,
+    assets,
   )
 
   const showPrimaryText = !props.primaryAmount.isZero()
diff --git a/src/components/Modals/Vault/VaultModalContent.tsx b/src/components/Modals/Vault/VaultModalContent.tsx
index b307d24a..4a11fb10 100644
--- a/src/components/Modals/Vault/VaultModalContent.tsx
+++ b/src/components/Modals/Vault/VaultModalContent.tsx
@@ -1,19 +1,18 @@
 import { useCallback, useMemo, useState } from 'react'
 
-import Accordion from 'components/Accordion'
-import AccountSummary from 'components/Account/AccountSummary'
+import Accordion from 'components/common/Accordion'
+import AccountSummary from 'components/account/AccountSummary'
 import VaultBorrowings from 'components/Modals/Vault/VaultBorrowings'
 import VaultBorrowingsSubTitle from 'components/Modals/Vault/VaultBorrowingsSubTitle'
 import VaultDeposit from 'components/Modals/Vault/VaultDeposits'
 import VaultDepositSubTitle from 'components/Modals/Vault/VaultDepositsSubTitle'
-import Text from 'components/Text'
-import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
-import { LocalStorageKeys } from 'constants/localStorageKeys'
+import Text from 'components/common/Text'
 import { BN_ZERO } from 'constants/math'
+import useAllAssets from 'hooks/assets/useAllAssets'
 import useDepositVault from 'hooks/broadcast/useDepositVault'
+import useDisplayCurrency from 'hooks/localStorage/useDisplayCurrency'
 import useDisplayAsset from 'hooks/useDisplayAsset'
 import useIsOpenArray from 'hooks/useIsOpenArray'
-import useLocalStorage from 'hooks/useLocalStorage'
 import usePrices from 'hooks/usePrices'
 import { useUpdatedAccount } from 'hooks/useUpdatedAccount'
 import { BNCoin } from 'types/classes/BNCoin'
@@ -33,12 +32,10 @@ export default function VaultModalContent(props: Props) {
   const { addedDebts, removedDeposits, removedLends, simulateVaultDeposit } = useUpdatedAccount(
     props.account,
   )
+  const assets = useAllAssets()
 
   const { data: prices } = usePrices()
-  const [displayCurrency] = useLocalStorage<string>(
-    LocalStorageKeys.DISPLAY_CURRENCY,
-    DEFAULT_SETTINGS.displayCurrency,
-  )
+  const [displayCurrency] = useDisplayCurrency()
   const [isOpen, toggleOpen] = useIsOpenArray(2, false)
   const [isCustomRatio, setIsCustomRatio] = useState(false)
   const [depositCoins, setDepositCoins] = useState<BNCoin[]>([])
@@ -60,6 +57,7 @@ export default function VaultModalContent(props: Props) {
         getCoinValue(
           BNCoin.fromDenomAndBigNumber(props.vault.cap.denom, capLeft),
           prices,
+          assets,
         ).toString(),
         displayAsset,
       )
@@ -67,7 +65,7 @@ export default function VaultModalContent(props: Props) {
       return [BNCoin.fromDenomAndBigNumber(displayAsset.denom, amount)]
     }
     return []
-  }, [displayAsset, prices, props.vault.cap, totalValue])
+  }, [assets, displayAsset, prices, props.vault.cap, totalValue])
 
   const onChangeIsCustomRatio = useCallback(
     (isCustomRatio: boolean) => setIsCustomRatio(isCustomRatio),
diff --git a/src/components/Modals/Vault/VaultModalContentHeader.tsx b/src/components/Modals/Vault/VaultModalContentHeader.tsx
index b0b3352f..8a422527 100644
--- a/src/components/Modals/Vault/VaultModalContentHeader.tsx
+++ b/src/components/Modals/Vault/VaultModalContentHeader.tsx
@@ -1,8 +1,8 @@
 import { useMemo } from 'react'
 
-import DisplayCurrency from 'components/DisplayCurrency'
-import { FormattedNumber } from 'components/FormattedNumber'
-import TitleAndSubCell from 'components/TitleAndSubCell'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import TitleAndSubCell from 'components/common/TitleAndSubCell'
 import { BN_ZERO } from 'constants/math'
 import { PRICE_ORACLE_DECIMALS } from 'constants/query'
 import { BNCoin } from 'types/classes/BNCoin'
diff --git a/src/components/Modals/Vault/index.tsx b/src/components/Modals/Vault/index.tsx
index 337b7799..f10c9753 100644
--- a/src/components/Modals/Vault/index.tsx
+++ b/src/components/Modals/Vault/index.tsx
@@ -1,22 +1,23 @@
 import moment from 'moment'
 import { useCallback, useMemo } from 'react'
 
-import DoubleLogo from 'components/DoubleLogo'
-import { InfoCircle } from 'components/Icons'
-import Modal from 'components/Modal'
+import DoubleLogo from 'components/common/DoubleLogo'
+import { InfoCircle } from 'components/common/Icons'
+import Text from 'components/common/Text'
+import { Tooltip } from 'components/common/Tooltip'
+import Modal from 'components/Modals/Modal'
 import VaultModalContent from 'components/Modals/Vault/VaultModalContent'
 import VaultModalContentHeader from 'components/Modals/Vault/VaultModalContentHeader'
-import Text from 'components/Text'
-import { Tooltip } from 'components/Tooltip'
-import { ASSETS } from 'constants/assets'
-import useCurrentAccount from 'hooks/useCurrentAccount'
+import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
+import useAsset from 'hooks/assets/useAsset'
 import useStore from 'store'
 
 export default function VaultModalController() {
   const currentAccount = useCurrentAccount()
   const modal = useStore((s) => s.vaultModal)
-  const primaryAsset = ASSETS.find((asset) => asset.denom === modal?.vault.denoms.primary)
-  const secondaryAsset = ASSETS.find((asset) => asset.denom === modal?.vault.denoms.secondary)
+
+  const primaryAsset = useAsset(modal?.vault.denoms.primary || '')
+  const secondaryAsset = useAsset(modal?.vault.denoms.secondary || '')
 
   if (!modal || !currentAccount || !primaryAsset || !secondaryAsset) return null
 
diff --git a/src/components/Modals/WalletAssets/WalletAssetsModalContent.tsx b/src/components/Modals/WalletAssets/WalletAssetsModalContent.tsx
index 95309aa0..1b6222b9 100644
--- a/src/components/Modals/WalletAssets/WalletAssetsModalContent.tsx
+++ b/src/components/Modals/WalletAssets/WalletAssetsModalContent.tsx
@@ -1,10 +1,10 @@
 import { useCallback, useMemo, useState } from 'react'
 
-import AssetSelectTable from 'components/Modals/AssetsSelect/AssetSelectTable'
-import SearchBar from 'components/SearchBar'
+import AssetsSelect from 'components/Modals/AssetsSelect'
+import SearchBar from 'components/common/SearchBar'
+import useAllAssets from 'hooks/assets/useAllAssets'
 import useStore from 'store'
 import { byDenom } from 'utils/array'
-import { getAssetByDenom } from 'utils/assets'
 
 interface Props {
   onChangeDenoms: (denoms: string[]) => void
@@ -14,25 +14,26 @@ export default function WalletAssetsModalContent(props: Props) {
   const { onChangeDenoms } = props
   const [searchString, setSearchString] = useState<string>('')
   const balances = useStore((s) => s.balances)
+  const assets = useAllAssets()
 
-  const assets = useMemo(() => {
-    const assetsInWallet: Asset[] = []
+  const assetsInWallet = useMemo(() => {
+    const assetsInWalletInWallet: Asset[] = []
     balances.forEach((balance) => {
-      const asset = getAssetByDenom(balance.denom)
-      if (asset && asset.isMarket) assetsInWallet.push(asset)
+      const asset = assets.find(byDenom(balance.denom))
+      if (asset && asset.isMarket) assetsInWalletInWallet.push(asset)
     })
 
-    return assetsInWallet
-  }, [balances])
+    return assetsInWalletInWallet
+  }, [assets, balances])
 
   const filteredAssets: Asset[] = useMemo(() => {
-    return assets.filter(
+    return assetsInWallet.filter(
       (asset) =>
         asset.name.toLowerCase().includes(searchString.toLowerCase()) ||
         asset.denom.toLowerCase().includes(searchString.toLowerCase()) ||
         asset.symbol.toLowerCase().includes(searchString.toLowerCase()),
     )
-  }, [assets, searchString])
+  }, [assetsInWallet, searchString])
 
   const isBorrow = useStore((s) => s.walletAssetsModal?.isBorrow ?? false)
   const currentSelectedDenom = useStore((s) => s.walletAssetsModal?.selectedDenoms ?? [])
@@ -58,8 +59,7 @@ export default function WalletAssetsModalContent(props: Props) {
         />
       </div>
       <div className='max-h-[446px] overflow-y-scroll scrollbar-hide'>
-        <AssetSelectTable
-          isBorrow={isBorrow}
+        <AssetsSelect
           assets={filteredAssets}
           onChangeSelected={onChangeSelect}
           selectedDenoms={selectedDenoms}
diff --git a/src/components/Modals/WalletAssets/index.tsx b/src/components/Modals/WalletAssets/index.tsx
index ec805db7..cd5c6c4a 100644
--- a/src/components/Modals/WalletAssets/index.tsx
+++ b/src/components/Modals/WalletAssets/index.tsx
@@ -1,9 +1,9 @@
 import { useCallback, useState } from 'react'
 
-import Button from 'components/Button'
-import Modal from 'components/Modal'
+import Button from 'components/common/Button'
+import Modal from 'components/Modals/Modal'
 import WalletAssetsModalContent from 'components/Modals/WalletAssets/WalletAssetsModalContent'
-import Text from 'components/Text'
+import Text from 'components/common/Text'
 import useStore from 'store'
 
 export default function WalletAssetsModal() {
diff --git a/src/components/Modals/WithdrawFromVaultsModal.tsx b/src/components/Modals/WithdrawFromVaultsModal.tsx
index 18994c7c..bef4bbf9 100644
--- a/src/components/Modals/WithdrawFromVaultsModal.tsx
+++ b/src/components/Modals/WithdrawFromVaultsModal.tsx
@@ -1,20 +1,20 @@
-import Button from 'components/Button'
-import { CircularProgress } from 'components/CircularProgress'
-import DisplayCurrency from 'components/DisplayCurrency'
-import DoubleLogo from 'components/DoubleLogo'
-import { FormattedNumber } from 'components/FormattedNumber'
-import Modal from 'components/Modal'
-import Text from 'components/Text'
+import Modal from 'components/Modals/Modal'
+import Button from 'components/common/Button'
+import { CircularProgress } from 'components/common/CircularProgress'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import DoubleLogo from 'components/common/DoubleLogo'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Text from 'components/common/Text'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
 import { ORACLE_DENOM } from 'constants/oracle'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import useAccountId from 'hooks/useAccountId'
-import useLocalStorage from 'hooks/useLocalStorage'
 import usePrices from 'hooks/usePrices'
 import useStore from 'store'
 import { BNCoin } from 'types/classes/BNCoin'
 import { byDenom } from 'utils/array'
-import { getAssetByDenom } from 'utils/assets'
 
 export default function WithdrawFromVaultsModal() {
   const modal = useStore((s) => s.withdrawFromVaultsModal)
@@ -22,6 +22,7 @@ export default function WithdrawFromVaultsModal() {
   const { data: prices } = usePrices()
   const withdrawFromVaults = useStore((s) => s.withdrawFromVaults)
   const [slippage] = useLocalStorage<number>(LocalStorageKeys.SLIPPAGE, DEFAULT_SETTINGS.slippage)
+  const assets = useAllAssets()
 
   function onClose() {
     useStore.setState({ withdrawFromVaultsModal: null })
@@ -56,8 +57,8 @@ export default function WithdrawFromVaultsModal() {
           {modal.map((vault) => {
             const positionValue = vault.values.unlocking
             const coin = BNCoin.fromDenomAndBigNumber(ORACLE_DENOM, positionValue)
-            const primaryAsset = getAssetByDenom(vault.denoms.primary)
-            const secondaryAsset = getAssetByDenom(vault.denoms.secondary)
+            const primaryAsset = assets.find(byDenom(vault.denoms.primary))
+            const secondaryAsset = assets.find(byDenom(vault.denoms.secondary))
 
             if (!primaryAsset || !secondaryAsset) return null
             const primaryAssetPrice = prices.find(byDenom(primaryAsset.denom))?.amount ?? 1
@@ -72,17 +73,19 @@ export default function WithdrawFromVaultsModal() {
                   primaryDenom={vault.denoms.primary}
                   secondaryDenom={vault.denoms.secondary}
                 />
-                <div className='flex flex-wrap flex-1'>
-                  <Text className='w-full'>{vault.name}</Text>
-                  <Text size='sm' className='w-full text-white/50'>
+                <div className='flex flex-wrap flex-grow'>
+                  <Text size='sm' className='w-full'>
+                    {vault.name}
+                  </Text>
+                  <Text size='xs' className='w-full text-white/50'>
                     Unlocked
                   </Text>
                 </div>
-                <div className='flex flex-wrap'>
-                  <DisplayCurrency coin={coin} className='w-full text-right' />
+                <div className='flex flex-wrap flex-shrink max-w-1/2'>
+                  <DisplayCurrency coin={coin} className='w-full text-sm text-right' />
                   <FormattedNumber
                     amount={Number(primaryAssetAmount.toPrecision(4))}
-                    className='w-full text-sm text-right text-white/50'
+                    className='w-full text-xs text-right text-white/50'
                     options={{
                       suffix: ` ${vault.symbols.primary}`,
                       maxDecimals: primaryAsset.decimals,
@@ -91,7 +94,7 @@ export default function WithdrawFromVaultsModal() {
                   />
                   <FormattedNumber
                     amount={Number(secondaryAssetAmount.toPrecision(4))}
-                    className='w-full text-sm text-right text-white/50'
+                    className='w-full text-xs text-right text-white/50'
                     options={{
                       suffix: ` ${vault.symbols.secondary}`,
                       maxDecimals: secondaryAsset.decimals,
diff --git a/src/components/Navigation/NavMenu.tsx b/src/components/Navigation/NavMenu.tsx
deleted file mode 100644
index d8eccbb5..00000000
--- a/src/components/Navigation/NavMenu.tsx
+++ /dev/null
@@ -1,80 +0,0 @@
-import classNames from 'classnames'
-
-import Button from 'components/Button'
-import Divider from 'components/Divider'
-import { ChevronDown } from 'components/Icons'
-import { NavLink } from 'components/Navigation//NavLink'
-import { getIsActive } from 'components/Navigation/DesktopNavigation'
-import Text from 'components/Text'
-import useToggle from 'hooks/useToggle'
-
-interface Props {
-  item: MenuTreeEntry
-}
-
-export const NavMenu = (props: Props) => {
-  const { item } = props
-  const [showMenu, setShowMenu] = useToggle()
-
-  if (!item.submenu) return null
-
-  return (
-    <div className='relative flex items-center'>
-      <Button
-        rightIcon={<ChevronDown className='w-3' />}
-        color='quaternary'
-        variant='transparent'
-        onClick={() => setShowMenu(!showMenu)}
-        text={item.label}
-        className={classNames(
-          '!text-base !p-0 !min-h-0',
-          (getIsActive(item.pages) || showMenu) && '!text-white',
-        )}
-      />
-      {showMenu && (
-        <>
-          <div className='absolute left-0 top-[calc(100%+4px)] z-50'>
-            <ul
-              className={classNames(
-                'py-4 list-none flex flex-wrap gap-2 bg-white/10 backdrop-blur-lg',
-                'relative isolate max-w-full overflow-hidden rounded-sm',
-                'before:content-[" "] before:absolute before:inset-0 before:-z-1 before:rounded-sm before:p-[1px] before:border-glas',
-              )}
-            >
-              {item.submenu.map((submenuitem, index) => (
-                <li className='w-full m-0 group/submenuitem' key={index}>
-                  {index !== 0 && <Divider className='mb-2' />}
-                  <NavLink
-                    item={{ pages: [submenuitem.page], label: submenuitem.label }}
-                    onClick={() => setShowMenu(false)}
-                    className='flex items-center w-full gap-4 px-4 whitespace-nowrap'
-                  >
-                    {submenuitem.icon && <div className='w-6'>{submenuitem.icon}</div>}
-                    <Text className='flex flex-wrap'>
-                      {submenuitem.label}
-                      {submenuitem.subtitle && (
-                        <span
-                          className={classNames(
-                            'w-full text-sm group-hover/submenuitem:text-white',
-                            getIsActive([submenuitem.page]) ? 'text-white' : 'text-white/40',
-                          )}
-                        >
-                          {submenuitem.subtitle}
-                        </span>
-                      )}
-                    </Text>
-                  </NavLink>
-                </li>
-              ))}
-            </ul>
-          </div>
-          <div
-            className='fixed -top-6 -left-[55px] z-40 w-screen h-screen hover:cursor-pointer'
-            onClick={() => setShowMenu(false)}
-            role='button'
-          />
-        </>
-      )}
-    </div>
-  )
-}
diff --git a/src/components/Perps/Module/PerpsModule.tsx b/src/components/Perps/Module/PerpsModule.tsx
deleted file mode 100644
index 54491b57..00000000
--- a/src/components/Perps/Module/PerpsModule.tsx
+++ /dev/null
@@ -1,59 +0,0 @@
-import { useState } from 'react'
-
-import Button from 'components/Button'
-import Card from 'components/Card'
-import { DirectionSelect } from 'components/DirectionSelect'
-import { ChevronDown } from 'components/Icons'
-import { LeverageButtons } from 'components/Perps/Module/LeverageButtons'
-import { Or } from 'components/Perps/Module/Or'
-import RangeInput from 'components/RangeInput'
-import { Spacer } from 'components/Spacer'
-import Text from 'components/Text'
-import AssetAmountInput from 'components/Trade/TradeModule/SwapForm/AssetAmountInput'
-import OrderTypeSelector from 'components/Trade/TradeModule/SwapForm/OrderTypeSelector'
-import { AvailableOrderType } from 'components/Trade/TradeModule/SwapForm/OrderTypeSelector/types'
-import { ASSETS } from 'constants/assets'
-import { BN_ZERO } from 'constants/math'
-
-export function PerpsModule() {
-  const [selectedOrderType, setSelectedOrderType] = useState<AvailableOrderType>('Market')
-  const [selectedOrderDirection, setSelectedOrderDirection] = useState<OrderDirection>('long')
-
-  return (
-    <Card
-      contentClassName='px-4 gap-5 flex flex-col'
-      title={
-        <div className='flex items-center justify-between py-4 pl-4 pr-2 bg-white/10'>
-          <Text>
-            ETH<span className='text-white/60'>/USD</span>
-          </Text>
-          <Button color='quaternary' variant='transparent' rightIcon={<ChevronDown />}>
-            All Markets
-          </Button>
-        </div>
-      }
-      className='mb-4'
-    >
-      <OrderTypeSelector selected={selectedOrderType} onChange={setSelectedOrderType} />
-      <DirectionSelect
-        direction={selectedOrderDirection}
-        onChangeDirection={setSelectedOrderDirection}
-      />
-      <AssetAmountInput
-        label='Amount'
-        max={BN_ZERO}
-        amount={BN_ZERO}
-        setAmount={() => {}}
-        asset={ASSETS[0]}
-        maxButtonLabel='Max:'
-        disabled={false}
-      />
-      <Or />
-      <Text size='sm'>Position Leverage</Text>
-      <RangeInput max={0} value={0} onChange={() => {}} />
-      <LeverageButtons />
-      <Spacer />
-      <Button>{selectedOrderDirection} ETH</Button>
-    </Card>
-  )
-}
diff --git a/src/components/Perps/PerpsChart.tsx b/src/components/Perps/PerpsChart.tsx
deleted file mode 100644
index f6d52fae..00000000
--- a/src/components/Perps/PerpsChart.tsx
+++ /dev/null
@@ -1,12 +0,0 @@
-import React from 'react'
-
-import TradeChart from 'components/Trade/TradeChart'
-import { ASSETS } from 'constants/assets'
-
-export function PerpsChart() {
-  return (
-    <div className='h-full'>
-      <TradeChart buyAsset={ASSETS[0]} sellAsset={ASSETS[1]} />
-    </div>
-  )
-}
diff --git a/src/components/Perps/PerpsInfo.tsx b/src/components/Perps/PerpsInfo.tsx
deleted file mode 100644
index ec93a67f..00000000
--- a/src/components/Perps/PerpsInfo.tsx
+++ /dev/null
@@ -1,99 +0,0 @@
-import React, { useMemo } from 'react'
-
-import AssetSymbol from 'components/Asset/AssetSymbol'
-import Card from 'components/Card'
-import DisplayCurrency from 'components/DisplayCurrency'
-import Divider from 'components/Divider'
-import { FormattedNumber } from 'components/FormattedNumber'
-import Loading from 'components/Loading'
-import Text from 'components/Text'
-import usePerpsMarket from 'hooks/perps/usePerpsMarket'
-import usePrice from 'hooks/usePrice'
-import { BNCoin } from 'types/classes/BNCoin'
-
-export function PerpsInfo() {
-  const { data: market } = usePerpsMarket()
-  const assetPrice = usePrice(market?.asset.denom || '')
-
-  const items = useMemo(
-    () => [
-      ...(!assetPrice.isZero()
-        ? [<DisplayCurrency key='price' coin={BNCoin.fromDenomAndBigNumber('usd', assetPrice)} />]
-        : [<Loading key='price' className='w-14 h-4' />]),
-      <InfoItem
-        key='openInterestLong'
-        label='Open Interest (L)'
-        item={<InterestItem market={market} type='long' />}
-      />,
-      <InfoItem
-        key='openInterestShort'
-        label='Open Interest (S)'
-        item={<InterestItem market={market} type='short' />}
-      />,
-      <InfoItem
-        key='fundingRate'
-        label='Funding rate'
-        item={
-          market ? (
-            <FormattedNumber
-              className='text-sm inline'
-              amount={market.fundingRate.toNumber()}
-              options={{ minDecimals: 6, maxDecimals: 6, suffix: '%' }}
-            />
-          ) : (
-            <Loading />
-          )
-        }
-      />,
-    ],
-    [assetPrice, market],
-  )
-
-  return (
-    <Card contentClassName='bg-white/10 py-3.5 px-4'>
-      <div className='flex gap-4 items-center'>
-        {items.map((item, index) => (
-          <React.Fragment key={index}>
-            {item}
-            {index !== items.length - 1 && <Divider orientation='vertical' className='h-9' />}
-          </React.Fragment>
-        ))}
-      </div>
-    </Card>
-  )
-}
-
-interface InfoItemProps {
-  item: React.ReactNode
-  label: string
-}
-
-function InfoItem(props: InfoItemProps) {
-  return (
-    <div className='flex flex-col gap-1'>
-      <Text size='xs' className='text-white/40'>
-        {props.label}
-      </Text>
-      {props.item}
-    </div>
-  )
-}
-
-interface InterestItemProps {
-  market: PerpsMarket | null
-  type: 'long' | 'short'
-}
-function InterestItem(props: InterestItemProps) {
-  if (!props.market) return <Loading />
-
-  return (
-    <div className='flex gap-1 items-center'>
-      <FormattedNumber
-        className='text-sm inline'
-        amount={props.market.openInterest[props.type].toNumber()}
-        options={{ decimals: props.market.asset.decimals }}
-      />
-      <AssetSymbol symbol={props.market.asset.symbol} />
-    </div>
-  )
-}
diff --git a/src/components/Perps/PerpsPositions.tsx b/src/components/Perps/PerpsPositions.tsx
deleted file mode 100644
index 03cb490e..00000000
--- a/src/components/Perps/PerpsPositions.tsx
+++ /dev/null
@@ -1,5 +0,0 @@
-import AccountDetailsCard from 'components/Trade/AccountDetailsCard'
-
-export function PerpsPositions() {
-  return <AccountDetailsCard />
-}
diff --git a/src/components/Table/Row.tsx b/src/components/Table/Row.tsx
deleted file mode 100644
index ae0e35ca..00000000
--- a/src/components/Table/Row.tsx
+++ /dev/null
@@ -1,63 +0,0 @@
-import { flexRender, Row as TanstackRow, Table as TanstackTable } from '@tanstack/react-table'
-import classNames from 'classnames'
-
-interface Props<T> {
-  row: TanstackRow<T>
-  table: TanstackTable<T>
-  renderExpanded?: (row: TanstackRow<T>, table: TanstackTable<T>) => JSX.Element
-  rowClassName?: string
-  rowClickHandler?: () => void
-  spacingClassName?: string
-  isBalancesTable?: boolean
-  className?: string
-}
-
-function getBorderColor(row: AccountBalanceRow) {
-  return row.type === 'borrowing' ? 'border-loss' : 'border-profit'
-}
-
-export default function Row<T>(props: Props<T>) {
-  const canExpand = !!props.renderExpanded
-  return (
-    <>
-      <tr
-        key={`${props.row.id}-row`}
-        className={classNames(
-          'group/row transition-bg',
-          props.renderExpanded && 'hover:cursor-pointer',
-          canExpand && props.row.getIsExpanded() ? 'is-expanded bg-black/20' : 'hover:bg-white/5',
-        )}
-        onClick={(e) => {
-          e.preventDefault()
-          const isExpanded = props.row.getIsExpanded()
-          props.table.resetExpanded()
-          !isExpanded && props.row.toggleExpanded()
-        }}
-      >
-        {props.row.getVisibleCells().map((cell) => {
-          const isSymbolOrName = cell.column.id === 'symbol' || cell.column.id === 'name'
-          const borderClasses =
-            props.isBalancesTable && isSymbolOrName
-              ? classNames('border-l', getBorderColor(cell.row.original as AccountBalanceRow))
-              : ''
-          return (
-            <td
-              key={cell.id}
-              className={classNames(
-                isSymbolOrName ? 'text-left' : 'text-right',
-                props.spacingClassName ?? 'px-3 py-4',
-                borderClasses,
-                cell.column.columnDef.meta?.className,
-              )}
-            >
-              {flexRender(cell.column.columnDef.cell, cell.getContext())}
-            </td>
-          )
-        })}
-      </tr>
-      {props.row.getIsExpanded() &&
-        props.renderExpanded &&
-        props.renderExpanded(props.row, props.table)}
-    </>
-  )
-}
diff --git a/src/components/Trade/TradeChart/DataFeed.ts b/src/components/Trade/TradeChart/DataFeed.ts
deleted file mode 100644
index f07acda1..00000000
--- a/src/components/Trade/TradeChart/DataFeed.ts
+++ /dev/null
@@ -1,500 +0,0 @@
-import { defaultSymbolInfo } from 'components/Trade/TradeChart/constants'
-import { ASSETS } from 'constants/assets'
-import { ENV } from 'constants/env'
-import { MILLISECONDS_PER_MINUTE } from 'constants/math'
-import { byDenom } from 'utils/array'
-import { getAssetByDenom, getEnabledMarketAssets } from 'utils/assets'
-import {
-  Bar,
-  ErrorCallback,
-  HistoryCallback,
-  IDatafeedChartApi,
-  LibrarySymbolInfo,
-  OnReadyCallback,
-  PeriodParams,
-  ResolutionString,
-  ResolveCallback,
-} from 'utils/charting_library'
-import { BN } from 'utils/helpers'
-import { devideByPotentiallyZero } from 'utils/math'
-
-interface PythBarQueryData {
-  s: string
-  t: number[]
-  o: number[]
-  h: number[]
-  l: number[]
-  c: number[]
-  v: number[]
-}
-
-interface TheGraphBarQueryData {
-  close: string
-  high: string
-  low: string
-  open: string
-  timestamp: string
-  volume: string
-}
-
-export const PAIR_SEPARATOR = '<>'
-
-export class DataFeed implements IDatafeedChartApi {
-  candlesEndpoint = ENV.CANDLES_ENDPOINT_PYTH
-  candlesEndpointTheGraph = ENV.CANDLES_ENDPOINT_THE_GRAPH
-  debug = false
-  enabledMarketAssetDenoms: string[] = []
-  batchSize = 1000
-  baseDecimals: number = 6
-  baseDenom: string = 'uosmo'
-  intervalsTheGraph: { [key: string]: string } = {
-    '15': '15m',
-    '30': '30m',
-    '60': '1h',
-    '240': '4h',
-    '1D': '1d',
-  }
-  millisecondsPerInterval: { [key: string]: number } = {
-    '1': MILLISECONDS_PER_MINUTE * 1,
-    '5': MILLISECONDS_PER_MINUTE * 5,
-    '15': MILLISECONDS_PER_MINUTE * 15,
-    '30': MILLISECONDS_PER_MINUTE * 30,
-    '60': MILLISECONDS_PER_MINUTE * 60,
-    '240': MILLISECONDS_PER_MINUTE * 240,
-    '1D': MILLISECONDS_PER_MINUTE * 1440,
-  }
-  pairs: { baseAsset: string; quoteAsset: string }[] = []
-  pairsWithData: string[] = []
-  supportedPools: string[] = []
-  supportedResolutions = ['1', '5', '15', '30', '60', '240', 'D'] as ResolutionString[]
-
-  constructor(debug = false, baseDecimals: number, baseDenom: string) {
-    if (debug) console.log('Start charting library datafeed')
-    this.debug = debug
-    this.baseDecimals = baseDecimals
-    this.baseDenom = baseDenom
-    const enabledMarketAssets = getEnabledMarketAssets()
-    this.enabledMarketAssetDenoms = enabledMarketAssets.map((asset) => asset.denom)
-    this.supportedPools = enabledMarketAssets
-      .map((asset) => asset.poolId?.toString())
-      .filter((poolId) => typeof poolId === 'string') as string[]
-  }
-
-  getDescription(pairName: string, inverted: boolean) {
-    const [denom1, denom2] = pairName.split(PAIR_SEPARATOR)
-    const asset1 = ASSETS.find(byDenom(denom1))
-    const asset2 = ASSETS.find(byDenom(denom2))
-    return inverted ? `${asset2?.symbol}/${asset1?.symbol}` : `${asset1?.symbol}/${asset2?.symbol}`
-  }
-
-  async getPairsWithData() {
-    const query = `
-      {
-        pairs(first: ${this.batchSize}, 
-            orderBy: symbol, 
-            orderDirection: asc, 
-            where: {
-              baseAsset_in: ${JSON.stringify(this.enabledMarketAssetDenoms)}, 
-              quoteAsset_in: ${JSON.stringify(this.enabledMarketAssetDenoms)}, 
-              poolId_in: ${JSON.stringify(this.supportedPools)}
-            }
-        ) {
-          baseAsset
-          quoteAsset
-        }
-      }`
-
-    return fetch(this.candlesEndpointTheGraph, {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ query }),
-    })
-      .then((res) => res.json())
-      .then((json) => {
-        this.pairs = json.data.pairs
-
-        this.pairsWithData = json.data.pairs.map(
-          (pair: { baseAsset: string; quoteAsset: string }) => {
-            return `${pair.quoteAsset}${PAIR_SEPARATOR}${pair.baseAsset}`
-          },
-        )
-      })
-      .catch((err) => {
-        if (this.debug) console.error(err)
-        throw err
-      })
-  }
-
-  onReady(callback: OnReadyCallback) {
-    const configurationData = {
-      supported_resolutions: this.supportedResolutions,
-    }
-
-    setTimeout(async () => {
-      await this.getPairsWithData()
-    })
-    callback(configurationData)
-  }
-
-  resolveSymbol(pairName: string, onResolve: ResolveCallback, onError: ErrorCallback) {
-    pairName = this.getPairName(pairName)
-    setTimeout(() => {
-      const info: LibrarySymbolInfo = {
-        ...defaultSymbolInfo,
-        name: this.getDescription(pairName, false),
-        full_name: this.getDescription(pairName, true),
-        description: this.getDescription(pairName, true),
-        ticker: this.getDescription(pairName, false),
-        exchange: this.getExchangeName(pairName),
-        listed_exchange: this.getExchangeName(pairName),
-        supported_resolutions: this.supportedResolutions,
-        base_name: [this.getDescription(pairName, false)],
-        pricescale: this.getPriceScale(pairName),
-      } as LibrarySymbolInfo
-      onResolve(info)
-    })
-  }
-
-  async getBars(
-    symbolInfo: LibrarySymbolInfo,
-    resolution: ResolutionString,
-    periodParams: PeriodParams,
-    onResult: HistoryCallback,
-  ): Promise<void> {
-    try {
-      let bars = [] as Bar[]
-      const pythFeedIds = this.getPythFeedIds(symbolInfo.full_name)
-      const now = new Date().getTime()
-      const to = BN(now).dividedBy(1000).integerValue().toNumber()
-      const from = BN(now)
-        .minus(this.batchSize * this.millisecondsPerInterval[resolution])
-        .dividedBy(1000)
-        .integerValue()
-        .toNumber()
-      const pythFeedId1 = pythFeedIds[0]
-      const pythFeedId2 = pythFeedIds[1]
-
-      if (pythFeedId1 && pythFeedId2) {
-        const asset1Bars = this.queryBarData(pythFeedId1, resolution, from, to)
-        const asset2Bars = this.queryBarData(pythFeedId2, resolution, from, to)
-
-        await Promise.all([asset1Bars, asset2Bars]).then(([asset1Bars, asset2Bars]) => {
-          bars = this.combineBars(asset1Bars, asset2Bars)
-          onResult(bars)
-        })
-      } else {
-        //await this.getBarsFromTheGraph(symbolInfo, resolution, to).then((bars) => onResult(bars))
-        onResult([], { noData: true })
-      }
-    } catch (error) {
-      console.error(error)
-      return onResult([], { noData: true })
-    }
-  }
-
-  async getBarsFromTheGraph(
-    symbolInfo: LibrarySymbolInfo,
-    resolution: ResolutionString,
-    to: number,
-  ) {
-    let pair1 = this.getPairName(symbolInfo.full_name)
-    let pair2: string = ''
-    let pair3: string = ''
-    let theGraphBars = [] as Bar[]
-
-    if (!this.pairsWithData.includes(pair1)) {
-      if (this.debug) console.log('Pair does not have data, need to combine with other pairs')
-
-      const [buyAssetDenom, sellAssetDenom] = pair1.split(PAIR_SEPARATOR)
-
-      const pair1Pools = this.pairs.filter((pair) => pair.baseAsset === buyAssetDenom)
-      const pair2Pools = this.pairs.filter((pair) => pair.quoteAsset === sellAssetDenom)
-
-      const matchedPools = pair1Pools.filter((pool) => {
-        const asset = pool.quoteAsset
-        return !!pair2Pools.find((pool) => pool.baseAsset === asset)
-      })
-
-      if (matchedPools.length) {
-        pair1 = `${buyAssetDenom}${PAIR_SEPARATOR}${matchedPools[0].quoteAsset}`
-        pair2 = `${matchedPools[0].quoteAsset}${PAIR_SEPARATOR}${sellAssetDenom}`
-      } else {
-        const middlePair = this.pairs.filter(
-          (pair) =>
-            pair1Pools.map((pairs) => pairs.quoteAsset).includes(pair.baseAsset) &&
-            pair2Pools.map((pairs) => pairs.baseAsset).includes(pair.quoteAsset),
-        )
-
-        pair1 = `${buyAssetDenom}${PAIR_SEPARATOR}${middlePair[0].baseAsset}`
-        pair2 = `${middlePair[0].baseAsset}${PAIR_SEPARATOR}${middlePair[0].quoteAsset}`
-        pair3 = `${middlePair[0].quoteAsset}${PAIR_SEPARATOR}${sellAssetDenom}`
-      }
-    }
-
-    const pair1Bars = this.queryBarDataTheGraph(
-      pair1.split(PAIR_SEPARATOR)[0],
-      pair1.split(PAIR_SEPARATOR)[1],
-      resolution,
-      to,
-    )
-
-    let pair2Bars: Promise<Bar[]> | null = null
-
-    if (pair2) {
-      pair2Bars = this.queryBarDataTheGraph(
-        pair2.split(PAIR_SEPARATOR)[0],
-        pair2.split(PAIR_SEPARATOR)[1],
-        resolution,
-        to,
-      )
-    }
-
-    let pair3Bars: Promise<Bar[]> | null = null
-
-    if (pair3) {
-      pair3Bars = this.queryBarDataTheGraph(
-        pair3.split(PAIR_SEPARATOR)[0],
-        pair3.split(PAIR_SEPARATOR)[1],
-        resolution,
-        to,
-      )
-    }
-
-    await Promise.all([pair1Bars, pair2Bars, pair3Bars]).then(
-      ([pair1Bars, pair2Bars, pair3Bars]) => {
-        let bars = pair1Bars
-
-        if (!bars.length) {
-          return
-        }
-
-        if (pair2Bars) {
-          bars = this.combineBars(pair1Bars, pair2Bars)
-        }
-        if (pair3Bars) {
-          bars = this.combineBars(bars, pair3Bars)
-        }
-
-        const filler = Array.from({ length: this.batchSize - bars.length }).map((_, index) => ({
-          time:
-            (bars[0]?.time || new Date().getTime()) -
-            (index * this.millisecondsPerInterval[resolution]) / 1000,
-          close: 0,
-          open: 0,
-          high: 0,
-          low: 0,
-          volume: 0,
-        }))
-        theGraphBars = [...filler, ...bars]
-      },
-    )
-
-    return theGraphBars
-  }
-
-  async queryBarData(
-    feedSymbol: string,
-    resolution: ResolutionString,
-    from: PeriodParams['from'],
-    to: PeriodParams['to'],
-  ): Promise<Bar[]> {
-    const URI = new URL('/v1/shims/tradingview/history', this.candlesEndpoint)
-    const params = new URLSearchParams(URI.search)
-
-    params.append('to', to.toString())
-    params.append('from', from.toString())
-    params.append('resolution', resolution)
-    params.append('symbol', feedSymbol)
-    URI.search = params.toString()
-
-    return fetch(URI)
-      .then((res) => res.json())
-      .then((json) => {
-        return this.resolveBarData(json, resolution, to)
-      })
-      .catch((err) => {
-        if (this.debug) console.error(err)
-        throw err
-      })
-  }
-
-  async queryBarDataTheGraph(
-    quote: string,
-    base: string,
-    resolution: ResolutionString,
-    to: PeriodParams['to'],
-  ): Promise<Bar[]> {
-    const interval = this.intervalsTheGraph[resolution]
-
-    const query = `
-        {
-            candles(
-            first: ${this.batchSize},
-            orderBy: "timestamp",
-            orderDirection: "desc",
-                where: {
-                  interval: "${interval}",
-                  quote: "${quote}",
-                  base: "${base}"
-                  poolId_in: ${JSON.stringify(this.supportedPools)}
-                  }
-                ) {
-                    timestamp
-                    open
-                    high
-                    low
-                    close
-                    volume
-            }
-        }
-    `
-
-    return fetch(this.candlesEndpointTheGraph, {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ query }),
-    })
-      .then((res) => res.json())
-      .then((json: { data?: { candles: TheGraphBarQueryData[] } }) => {
-        return this.resolveBarDataTheGraph(
-          json.data?.candles.reverse() || [],
-          base,
-          quote,
-          resolution,
-          to,
-        )
-      })
-      .catch((err) => {
-        if (this.debug) console.error(err)
-        throw err
-      })
-  }
-
-  resolveBarData(data: PythBarQueryData, resolution: ResolutionString, to: number) {
-    let barData = [] as Bar[]
-
-    if (data['s'] === 'ok') {
-      barData = data['t'].map((timestamp, index) => ({
-        time: timestamp * 1000,
-        close: data['c'][index],
-        open: data['o'][index],
-        high: data['h'][index],
-        low: data['l'][index],
-      }))
-    }
-
-    return this.fillBarData(barData, resolution, to)
-  }
-
-  resolveBarDataTheGraph(
-    bars: TheGraphBarQueryData[],
-    toDenom: string,
-    fromDenom: string,
-    resolution: ResolutionString,
-    to: number,
-  ) {
-    let barData = [] as Bar[]
-    const toDecimals = getAssetByDenom(toDenom)?.decimals || 6
-    const fromDecimals = getAssetByDenom(fromDenom)?.decimals || 6
-    const additionalDecimals = toDecimals - fromDecimals
-
-    barData = bars.map((bar) => ({
-      time: BN(bar.timestamp).multipliedBy(1000).toNumber(),
-      close: BN(bar.close).shiftedBy(additionalDecimals).toNumber(),
-      open: BN(bar.open).shiftedBy(additionalDecimals).toNumber(),
-      high: BN(bar.high).shiftedBy(additionalDecimals).toNumber(),
-      low: BN(bar.low).shiftedBy(additionalDecimals).toNumber(),
-      volume: BN(bar.volume).shiftedBy(additionalDecimals).toNumber(),
-    }))
-
-    return this.fillBarData(barData, resolution, to)
-  }
-
-  fillBarData(barData: Bar[], resolution: ResolutionString, to: number) {
-    if (barData.length < this.batchSize) {
-      const filler = Array.from({ length: this.batchSize - barData.length }).map((_, index) => ({
-        time: (barData[0]?.time || to) - index * this.millisecondsPerInterval[resolution],
-        close: 0,
-        open: 0,
-        high: 0,
-        low: 0,
-        volume: 0,
-      }))
-
-      barData = [...filler, ...barData]
-    }
-
-    return barData.length > this.batchSize ? barData.slice(0, this.batchSize) : barData
-  }
-
-  combineBars(pair1Bars: Bar[], pair2Bars: Bar[]): Bar[] {
-    const bars: Bar[] = []
-
-    pair1Bars.forEach((pair1Bar, index) => {
-      const pair2Bar = pair2Bars[index]
-
-      bars.push({
-        time: pair1Bar.time,
-        open: devideByPotentiallyZero(pair1Bar.open, pair2Bar.open),
-        close: devideByPotentiallyZero(pair1Bar.close, pair2Bar.close),
-        high: devideByPotentiallyZero(pair1Bar.high, pair2Bar.high),
-        low: devideByPotentiallyZero(pair1Bar.low, pair2Bar.low),
-      })
-    })
-    return bars
-  }
-
-  getPairName(name: string) {
-    if (name.includes(PAIR_SEPARATOR)) return name
-
-    const [symbol1, symbol2] = name.split('/')
-
-    const asset1 = ASSETS.find((asset) => asset.symbol === symbol1)
-    const asset2 = ASSETS.find((asset) => asset.symbol === symbol2)
-    return `${asset1?.denom}${PAIR_SEPARATOR}${asset2?.denom}`
-  }
-
-  getPriceScale(name: string) {
-    const denoms = name.split(PAIR_SEPARATOR)
-    const asset2 = ASSETS.find(byDenom(denoms[1]))
-    const decimalsOut = asset2?.decimals ?? 6
-    return BN(1)
-      .shiftedBy(decimalsOut > 8 ? 8 : decimalsOut)
-      .toNumber()
-  }
-
-  getExchangeName(name: string) {
-    const denoms = name.split(PAIR_SEPARATOR)
-    const pythFeedId1 = ASSETS.find(byDenom(denoms[0]))?.pythHistoryFeedId
-    const pythFeedId2 = ASSETS.find(byDenom(denoms[1]))?.pythHistoryFeedId
-    //if (!pythFeedId1 || !pythFeedId2) return 'Osmosis'
-    return 'Pyth Oracle'
-  }
-
-  getPythFeedIds(name: string) {
-    if (name.includes(PAIR_SEPARATOR)) {
-      const [denom1, denom2] = name.split(PAIR_SEPARATOR)
-      const denomFeedId1 = ASSETS.find((asset) => asset.denom === denom1)?.pythHistoryFeedId
-      const denomFeedId2 = ASSETS.find((asset) => asset.denom === denom2)?.pythHistoryFeedId
-      return [denomFeedId1, denomFeedId2]
-    }
-
-    const [symbol1, symbol2] = name.split('/')
-    const feedId1 = ASSETS.find((asset) => asset.symbol === symbol1)?.pythHistoryFeedId
-    const feedId2 = ASSETS.find((asset) => asset.symbol === symbol2)?.pythHistoryFeedId
-
-    return [feedId1, feedId2]
-  }
-
-  searchSymbols(): void {
-    // Don't allow to search for symbols
-  }
-
-  subscribeBars(): void {
-    // TheGraph doesn't support websockets yet
-  }
-
-  unsubscribeBars(listenerGuid: string): void {
-    // TheGraph doesn't support websockets yet
-  }
-}
diff --git a/src/components/Trade/TradeChart/TVChartContainer.tsx b/src/components/Trade/TradeChart/TVChartContainer.tsx
deleted file mode 100644
index a64dc1e7..00000000
--- a/src/components/Trade/TradeChart/TVChartContainer.tsx
+++ /dev/null
@@ -1,166 +0,0 @@
-import { useEffect, useMemo, useRef } from 'react'
-
-import Card from 'components/Card'
-import DisplayCurrency from 'components/DisplayCurrency'
-import { FormattedNumber } from 'components/FormattedNumber'
-import Loading from 'components/Loading'
-import Text from 'components/Text'
-import { DataFeed, PAIR_SEPARATOR } from 'components/Trade/TradeChart/DataFeed'
-import PoweredByPyth from 'components/Trade/TradeChart/PoweredByPyth'
-import { disabledFeatures, enabledFeatures, overrides } from 'components/Trade/TradeChart/constants'
-import { BN_ZERO } from 'constants/math'
-import usePrices from 'hooks/usePrices'
-import useStore from 'store'
-import { BNCoin } from 'types/classes/BNCoin'
-import { byDenom } from 'utils/array'
-import {
-  ChartingLibraryWidgetOptions,
-  IChartingLibraryWidget,
-  ResolutionString,
-  Timezone,
-  widget,
-} from 'utils/charting_library'
-import { magnify } from 'utils/formatters'
-
-interface Props {
-  buyAsset: Asset
-  sellAsset: Asset
-}
-
-export const TVChartContainer = (props: Props) => {
-  const chartContainerRef = useRef<HTMLDivElement>() as React.MutableRefObject<HTMLInputElement>
-  const widgetRef = useRef<IChartingLibraryWidget>()
-  const defaultSymbol = useRef<string>(
-    `${props.sellAsset.denom}${PAIR_SEPARATOR}${props.buyAsset.denom}`,
-  )
-  const baseCurrency = useStore((s) => s.baseCurrency)
-  const dataFeed = useMemo(
-    () => new DataFeed(false, baseCurrency.decimals, baseCurrency.denom),
-    [baseCurrency],
-  )
-  const { data: prices, isLoading } = usePrices()
-  const ratio = useMemo(() => {
-    const priceBuyAsset = prices.find(byDenom(props.buyAsset.denom))?.amount
-    const priceSellAsset = prices.find(byDenom(props.sellAsset.denom))?.amount
-
-    if (!priceBuyAsset || !priceSellAsset) return BN_ZERO
-    return priceBuyAsset.dividedBy(priceSellAsset)
-  }, [prices, props.buyAsset.denom, props.sellAsset.denom])
-
-  useEffect(() => {
-    const widgetOptions: ChartingLibraryWidgetOptions = {
-      symbol: defaultSymbol.current,
-      datafeed: dataFeed,
-      interval: '1h' as ResolutionString,
-      library_path: '/charting_library/',
-      locale: 'en',
-      time_scale: {
-        min_bar_spacing: 12,
-      },
-      toolbar_bg: '#220E1D',
-      disabled_features: disabledFeatures,
-      enabled_features: enabledFeatures,
-      charts_storage_api_version: '1.1',
-      client_id: 'sample-implementation',
-      timezone: 'Etc/UTC' as Timezone,
-      user_id: 'not-set',
-      fullscreen: false,
-      autosize: true,
-      container: chartContainerRef.current,
-      custom_css_url: '/tradingview.css',
-      settings_overrides: {
-        'paneProperties.background': '#220E1D',
-        'paneProperties.backgroundType': 'solid',
-        'paneProperties.vertGridProperties.color': '#220E1D',
-        'paneProperties.horzGridProperties.color': '#220E1D',
-        'mainSeriesProperties.candleStyle.upColor': '#3DAE9A',
-        'mainSeriesProperties.candleStyle.downColor': '#AE3D3D',
-        'mainSeriesProperties.candleStyle.borderColor': '#232834',
-        'mainSeriesProperties.candleStyle.borderUpColor': '#3DAE9A',
-        'mainSeriesProperties.candleStyle.borderDownColor': '#AE3D3D',
-        'mainSeriesProperties.candleStyle.wickUpColor': '#3DAE9A',
-        'mainSeriesProperties.candleStyle.wickDownColor': '#AE3D3D',
-        'mainSeriesProperties.candleStyle.barColorsOnPrevClose': false,
-        'scalesProperties.textColor': 'rgba(255, 255, 255, 0.7)',
-        'paneProperties.legendProperties.showSeriesTitle': true,
-        'paneProperties.legendProperties.showVolume': false,
-        'paneProperties.legendProperties.showStudyValues': false,
-        'paneProperties.legendProperties.showStudyTitles': false,
-        'scalesProperties.axisHighlightColor': '#381730',
-        'linetooltrendline.color': '#3DAE9A',
-        'linetooltrendline.linewidth': 10,
-      },
-      overrides,
-      loading_screen: {
-        backgroundColor: '#220E1D',
-        foregroundColor: 'rgba(255, 255, 255, 0.3)',
-      },
-      theme: 'dark',
-    }
-
-    const tvWidget = new widget(widgetOptions)
-
-    tvWidget.onChartReady(() => {
-      widgetRef.current = tvWidget
-    })
-
-    return () => {
-      tvWidget.remove()
-    }
-  }, [dataFeed, defaultSymbol])
-
-  useEffect(() => {
-    if (widgetRef?.current) {
-      widgetRef.current.setSymbol(
-        `${props.sellAsset.denom}${PAIR_SEPARATOR}${props.buyAsset.denom}`,
-        widgetRef.current.chart().resolution() || ('1h' as ResolutionString),
-        () => {},
-      )
-    }
-  }, [props.buyAsset.denom, props.sellAsset.denom])
-
-  return (
-    <Card
-      title={
-        <div className='flex items-center w-full bg-white/10'>
-          <Text size='lg' className='flex items-center flex-1 p-4 font-semibold'>
-            Trading Chart
-          </Text>
-          {ratio.isZero() || isLoading ? (
-            <Loading className='h-4 mr-4 w-60' />
-          ) : (
-            <div className='flex items-center gap-1 p-4'>
-              <Text size='sm'>1 {props.buyAsset.symbol}</Text>
-              <FormattedNumber
-                className='text-sm'
-                amount={Number(ratio.toPrecision(6))}
-                options={{
-                  prefix: '= ',
-                  suffix: ` ${props.sellAsset.symbol}`,
-                  abbreviated: false,
-                  maxDecimals: props.sellAsset.decimals,
-                }}
-              />
-              <DisplayCurrency
-                parentheses
-                options={{ abbreviated: false }}
-                className='justify-end pl-2 text-sm text-white/50'
-                coin={
-                  new BNCoin({
-                    denom: props.buyAsset.denom,
-                    amount: magnify(1, props.buyAsset).toString(),
-                  })
-                }
-              />
-            </div>
-          )}
-        </div>
-      }
-      contentClassName='px-0.5 pb-0.5 h-full bg-chart'
-      className='h-[70dvh] max-h-[980px] min-h-[560px]'
-    >
-      <div ref={chartContainerRef} className='h-[calc(100%-32px)] overflow-hidden' />
-      <PoweredByPyth />
-    </Card>
-  )
-}
diff --git a/src/components/Trade/TradeChart/index.tsx b/src/components/Trade/TradeChart/index.tsx
deleted file mode 100644
index 77ad2c0f..00000000
--- a/src/components/Trade/TradeChart/index.tsx
+++ /dev/null
@@ -1,59 +0,0 @@
-import dynamic from 'next/dynamic'
-import Script from 'next/script'
-import { useState } from 'react'
-
-import Card from 'components/Card'
-import { CircularProgress } from 'components/CircularProgress'
-import Loading from 'components/Loading'
-import Text from 'components/Text'
-import PoweredByPyth from 'components/Trade/TradeChart/PoweredByPyth'
-
-const TVChartContainer = dynamic(
-  () => import('components/Trade/TradeChart/TVChartContainer').then((mod) => mod.TVChartContainer),
-  { ssr: false },
-)
-
-interface Props {
-  buyAsset: Asset
-  sellAsset: Asset
-}
-
-export default function TradeChart(props: Props) {
-  const [isScriptReady, setIsScriptReady] = useState(false)
-
-  return (
-    <>
-      <Script
-        src='/datafeeds/udf/dist/bundle.js'
-        strategy='lazyOnload'
-        onReady={() => {
-          setIsScriptReady(true)
-        }}
-        onLoad={() => {
-          setIsScriptReady(true)
-        }}
-      />
-      {isScriptReady ? (
-        <TVChartContainer buyAsset={props.buyAsset} sellAsset={props.sellAsset} />
-      ) : (
-        <Card
-          title={
-            <div className='flex items-center w-full bg-white/10'>
-              <Text size='lg' className='flex items-center flex-1 p-4 font-semibold'>
-                Trading Chart
-              </Text>
-              <Loading className='h-4 mr-4 w-60' />
-            </div>
-          }
-          contentClassName='px-0.5 pb-0.5 h-full'
-          className='h-[70dvh] max-h-[980px] min-h-[560px]'
-        >
-          <div className='flex items-center justify-center w-full h-[calc(100%-32px)] rounded-b-base bg-chart'>
-            <CircularProgress size={60} className='opacity-50' />
-          </div>
-          <PoweredByPyth />
-        </Card>
-      )}
-    </>
-  )
-}
diff --git a/src/components/Trade/TradeModule/AssetSelector/AssetOverlay.tsx b/src/components/Trade/TradeModule/AssetSelector/AssetOverlay.tsx
deleted file mode 100644
index 06267405..00000000
--- a/src/components/Trade/TradeModule/AssetSelector/AssetOverlay.tsx
+++ /dev/null
@@ -1,161 +0,0 @@
-import { useCallback, useMemo, useState } from 'react'
-
-import Button from 'components/Button'
-import EscButton from 'components/Button/EscButton'
-import Divider from 'components/Divider'
-import Overlay from 'components/Overlay'
-import SearchBar from 'components/SearchBar'
-import Text from 'components/Text'
-import AssetList from 'components/Trade/TradeModule/AssetSelector/AssetList'
-import PairsList from 'components/Trade/TradeModule/AssetSelector/PairsList'
-import useFilteredAssets from 'hooks/useFilteredAssets'
-import { getAllAssets } from 'utils/assets'
-
-interface Props {
-  state: OverlayState
-  buyAsset: Asset
-  sellAsset: Asset
-  onChangeBuyAsset?: (asset: Asset) => void
-  onChangeSellAsset?: (asset: Asset) => void
-  onChangeTradingPair?: (tradingPair: TradingPair) => void
-  onChangeState: (state: OverlayState) => void
-}
-
-interface StablesFilterProps {
-  stables: Asset[]
-  selectedStables: Asset[]
-  onFilter: (stables: Asset[]) => void
-}
-
-function StablesFilter(props: StablesFilterProps) {
-  const { stables, selectedStables, onFilter } = props
-  const isAllSelected = selectedStables.length > 1
-  return (
-    <>
-      <Divider />
-      <div className='flex items-center w-full py-2 justify-evenly'>
-        <Button
-          onClick={() => onFilter(stables)}
-          text='All'
-          color={isAllSelected ? 'secondary' : 'quaternary'}
-          variant='transparent'
-          className={isAllSelected ? '!text-white !bg-white/10 border-white' : ''}
-        />
-        {stables.map((stable) => {
-          const isCurrent = !isAllSelected && selectedStables[0].denom === stable.denom
-          return (
-            <Button
-              key={stable.symbol}
-              onClick={() => onFilter([stable])}
-              text={stable.symbol}
-              color={isCurrent ? 'secondary' : 'quaternary'}
-              variant='transparent'
-              className={isCurrent ? '!text-white !bg-white/10 border-white' : ''}
-            />
-          )
-        })}
-      </div>
-    </>
-  )
-}
-
-export default function AssetOverlay(props: Props) {
-  const isPairSelector = !!props.onChangeTradingPair
-  const { assets, searchString, onChangeSearch } = useFilteredAssets()
-  const allAssets = getAllAssets()
-  const stableAssets = useMemo(() => allAssets.filter((asset) => asset.isStable), [allAssets])
-  const handleClose = useCallback(() => props.onChangeState('closed'), [props])
-  const handleToggle = useCallback(() => props.onChangeState(props.state), [props])
-  const [selectedStables, setSelectedStables] = useState<Asset[]>([stableAssets[0]])
-
-  const buyAssets = useMemo(
-    () =>
-      isPairSelector ? assets : assets.filter((asset) => asset.denom !== props.sellAsset.denom),
-    [assets, props.sellAsset, isPairSelector],
-  )
-
-  const sellAssets = useMemo(
-    () => assets.filter((asset) => asset.denom !== props.buyAsset.denom),
-    [assets, props.buyAsset],
-  )
-
-  function onChangeBuyAsset(asset: AssetPair | Asset) {
-    const selectedAsset = asset as Asset
-    if (!props.onChangeBuyAsset) return
-    props.onChangeBuyAsset(selectedAsset)
-    props.onChangeState('sell')
-    onChangeSearch('')
-  }
-
-  function onChangeSellAsset(asset: AssetPair | Asset) {
-    const selectedAsset = asset as Asset
-    if (!props.onChangeSellAsset) return
-    props.onChangeSellAsset(selectedAsset)
-    onChangeSearch('')
-  }
-
-  function onChangeAssetPair(assetPair: AssetPair | Asset) {
-    const selectedPair = assetPair as AssetPair
-    if (!props.onChangeTradingPair) return
-    props.onChangeTradingPair({ buy: selectedPair.buy.denom, sell: selectedPair.sell.denom })
-    props.onChangeState('closed')
-    onChangeSearch('')
-  }
-
-  return (
-    <Overlay
-      className='inset-0 w-full overflow-y-scroll scrollbar-hide'
-      show={props.state !== 'closed'}
-      setShow={handleClose}
-    >
-      <div className='flex justify-between p-4 overflow-hidden'>
-        <Text>{isPairSelector ? 'Select a market' : 'Select asset'}</Text>
-        <EscButton onClick={handleClose} enableKeyPress />
-      </div>
-      {isPairSelector && (
-        <StablesFilter
-          stables={stableAssets}
-          selectedStables={selectedStables}
-          onFilter={setSelectedStables}
-        />
-      )}
-      <Divider />
-      <div className='p-4'>
-        <SearchBar
-          key={props.state}
-          value={searchString}
-          onChange={onChangeSearch}
-          placeholder='Search for e.g. "ETH" or "Ethereum"'
-          autoFocus
-        />
-      </div>
-      <Divider />
-      {isPairSelector ? (
-        <PairsList
-          assets={buyAssets}
-          stables={selectedStables}
-          isOpen={props.state === 'pair'}
-          toggleOpen={handleToggle}
-          onChangeAssetPair={onChangeAssetPair}
-        />
-      ) : (
-        <>
-          <AssetList
-            type='buy'
-            assets={buyAssets}
-            isOpen={props.state === 'buy'}
-            toggleOpen={handleToggle}
-            onChangeAsset={onChangeBuyAsset}
-          />
-          <AssetList
-            type='sell'
-            assets={sellAssets}
-            isOpen={props.state === 'sell'}
-            toggleOpen={handleToggle}
-            onChangeAsset={onChangeSellAsset}
-          />
-        </>
-      )}
-    </Overlay>
-  )
-}
diff --git a/src/components/Wallet/RecentTransactions.tsx b/src/components/Wallet/RecentTransactions.tsx
index 081e6ce8..5dfe2cd3 100644
--- a/src/components/Wallet/RecentTransactions.tsx
+++ b/src/components/Wallet/RecentTransactions.tsx
@@ -1,24 +1,18 @@
 import classNames from 'classnames'
 import moment from 'moment'
 
-import Card from 'components/Card'
-import Divider from 'components/Divider'
-import Text from 'components/Text'
-import { TextLink } from 'components/TextLink'
-import { generateToastContent } from 'components/Toaster'
-import { EXPLORER_TX_URL } from 'constants/explorer'
-import { LocalStorageKeys } from 'constants/localStorageKeys'
-import useLocalStorage from 'hooks/useLocalStorage'
+import Card from 'components/common/Card'
+import Divider from 'components/common/Divider'
+import Text from 'components/common/Text'
+import { TextLink } from 'components/common/TextLink'
+import { generateToastContent } from 'components/common/Toaster'
+import useTransactions from 'hooks/localStorage/useTransactions'
 import useStore from 'store'
 
 export default function RecentTransactions() {
   const address = useStore((s) => s.address)
-  const [transactions, setTransactions] = useLocalStorage<ToastStore>(
-    LocalStorageKeys.TRANSACTIONS,
-    {
-      recent: [],
-    },
-  )
+  const [transactions, setTransactions] = useTransactions()
+  const chainConfig = useStore((s) => s.chainConfig)
   const recentTransactions = transactions.recent
     .filter((tx) => tx.address === address)
     .sort((a, b) => (a.timestamp > b.timestamp ? -1 : 1))
@@ -47,7 +41,7 @@ export default function RecentTransactions() {
                     )}
                     contentClassName='p-4'
                     onClick={() => {
-                      if (hash) window.open(`${EXPLORER_TX_URL}${hash}`, '_blank')
+                      if (hash) window.open(`${chainConfig.endpoints.explorer}${hash}`, '_blank')
                     }}
                     key={hash}
                   >
@@ -62,7 +56,7 @@ export default function RecentTransactions() {
                         {message}
                       </Text>
                     )}
-                    {content?.length > 0 && generateToastContent(content)}
+                    {content?.length > 0 && generateToastContent(content, chainConfig.assets)}
                   </Card>
                 )
               })}
diff --git a/src/components/Wallet/WalletBridges.tsx b/src/components/Wallet/WalletBridges.tsx
index b29f6589..25f35999 100644
--- a/src/components/Wallet/WalletBridges.tsx
+++ b/src/components/Wallet/WalletBridges.tsx
@@ -2,28 +2,22 @@ import { useShuttle } from '@delphi-labs/shuttle-react'
 import Image from 'next/image'
 import { useCallback, useEffect, useMemo } from 'react'
 
-import Button from 'components/Button'
-import FullOverlayContent from 'components/FullOverlayContent'
-import { ChevronRight } from 'components/Icons'
-import Text from 'components/Text'
+import Button from 'components/common/Button'
+import FullOverlayContent from 'components/common/FullOverlayContent'
+import { ChevronRight } from 'components/common/Icons'
+import Text from 'components/common/Text'
 import WalletFetchBalancesAndAccounts from 'components/Wallet/WalletFetchBalancesAndAccounts'
 import WalletSelect from 'components/Wallet/WalletSelect'
 import { BRIDGES } from 'constants/bridges'
-import { CHAINS } from 'constants/chains'
-import { ENV } from 'constants/env'
+import useBaseAsset from 'hooks/assets/useBasetAsset'
 import useCurrentWallet from 'hooks/useCurrentWallet'
 import useToggle from 'hooks/useToggle'
 import useWalletBalances from 'hooks/useWalletBalances'
 import useStore from 'store'
-import { NETWORK } from 'types/enums/network'
 import { byDenom } from 'utils/array'
-import { getBaseAsset } from 'utils/assets'
 import { defaultFee } from 'utils/constants'
 import { BN } from 'utils/helpers'
 
-const currentChainId = ENV.CHAIN_ID
-const currentChain = CHAINS[currentChainId]
-
 function Bridge({ name, url, image }: Bridge) {
   return (
     <Button
@@ -41,11 +35,13 @@ function Bridge({ name, url, image }: Bridge) {
 }
 
 export default function WalletBridges() {
+  const chainConfig = useStore((s) => s.chainConfig)
+
   const address = useStore((s) => s.address)
   const currentWallet = useCurrentWallet()
   const { disconnectWallet } = useShuttle()
   const { data: walletBalances, isLoading } = useWalletBalances(address)
-  const baseAsset = getBaseAsset()
+  const baseAsset = useBaseAsset()
   const [hasFunds, setHasFunds] = useToggle(false)
 
   const baseBalance = useMemo(
@@ -71,9 +67,9 @@ export default function WalletBridges() {
 
   return (
     <FullOverlayContent
-      title={`${currentChain.defaultCurrency?.coinDenom ?? 'Gas token'} required!`}
+      title={`${chainConfig.defaultCurrency?.coinDenom ?? 'Gas token'} required!`}
       copy={`To get started, you'll need at least a small amount of ${
-        currentChain.defaultCurrency?.coinDenom ?? 'the current chains gas token'
+        chainConfig.defaultCurrency?.coinDenom ?? 'the current chains gas token'
       } to cover transaction fees on Mars. Fund your wallet or bridge some in from another chain.`}
       button={{
         className: 'w-full mt-4',
@@ -89,23 +85,6 @@ export default function WalletBridges() {
           <Bridge key={bridge.name} {...bridge} />
         ))}
       </div>
-      {ENV.NETWORK !== NETWORK.MAINNET && (
-        <div className='flex flex-wrap w-full gap-3'>
-          <Text size='lg' className='mt-4 text-white'>
-            Need Testnet Funds?
-          </Text>
-          <Bridge
-            key='osmosis-faucet'
-            name='Osmosis Testnet Faucet'
-            url={
-              ENV.NETWORK === NETWORK.TESTNET
-                ? 'https://faucet.osmotest5.osmosis.zone/'
-                : 'https://faucet.devnet.osmosis.zone/'
-            }
-            image='/images/tokens/osmo.svg'
-          />
-        </div>
-      )}
     </FullOverlayContent>
   )
 }
diff --git a/src/components/Wallet/WalletConnectButton.tsx b/src/components/Wallet/WalletConnectButton.tsx
index 1b603492..54c71755 100644
--- a/src/components/Wallet/WalletConnectButton.tsx
+++ b/src/components/Wallet/WalletConnectButton.tsx
@@ -1,11 +1,11 @@
 import { ReactNode, useCallback } from 'react'
 
-import Button from 'components/Button'
-import { Wallet } from 'components/Icons'
-import TermsOfService from 'components/TermsOfService'
+import Button from 'components/common/Button'
+import { Wallet } from 'components/common/Icons'
+import TermsOfService from 'components/common/TermsOfService'
 import WalletSelect from 'components/Wallet/WalletSelect'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import useStore from 'store'
 
 interface Props {
diff --git a/src/components/Wallet/WalletConnectProvider.tsx b/src/components/Wallet/WalletConnectProvider.tsx
index 7b2a1c7f..4345a2c4 100644
--- a/src/components/Wallet/WalletConnectProvider.tsx
+++ b/src/components/Wallet/WalletConnectProvider.tsx
@@ -8,29 +8,59 @@ import {
   LeapMetamaskCosmosSnapExtensionProvider,
   ShuttleProvider,
   StationExtensionProvider,
+  VectisCosmosExtensionProvider,
   WalletExtensionProvider,
   WalletMobileProvider,
   XDEFICosmosExtensionProvider,
 } from '@delphi-labs/shuttle-react'
 import { FC } from 'react'
 
-import { CHAINS } from 'constants/chains'
-import { ENV } from 'constants/env'
+import chains from 'configs/chains'
 import { WALLETS } from 'constants/wallets'
-import { WalletID } from 'types/enums/wallet'
+import { ChainInfoID, WalletID } from 'types/enums/wallet'
 
 type Props = {
   children?: React.ReactNode
 }
 
+function mapChainConfigToChainInfo(chainConfig: ChainConfig): ChainInfo {
+  const chainInfo: ChainInfo = {
+    rpc: chainConfig.endpoints.rpc,
+    rest: chainConfig.endpoints.rest,
+    explorer: chainConfig.endpoints.explorer,
+    explorerName: chainConfig.explorerName,
+    chainId: chainConfig.id,
+    name: chainConfig.name,
+    gasPrice: chainConfig.gasPrice,
+    bech32Config: chainConfig.bech32Config,
+    defaultCurrency: chainConfig.defaultCurrency,
+    features: ['ibc-transfer', 'ibc-go'],
+  }
+
+  switch (chainConfig.id) {
+    case ChainInfoID.Osmosis1:
+      chainInfo.rpc = process.env.NEXT_PUBLIC_OSMOSIS_RPC ?? chainInfo.rpc
+      chainInfo.rest = process.env.NEXT_PUBLIC_OSMOSIS_REST ?? chainInfo.rpc
+      break
+
+    case ChainInfoID.OsmosisDevnet:
+      chainInfo.rpc = process.env.NEXT_PUBLIC_OSMOSIS_TEST_RPC ?? chainInfo.rpc
+      chainInfo.rest = process.env.NEXT_PUBLIC_OSMOSIS_TEST_REST ?? chainInfo.rpc
+      break
+
+    case ChainInfoID.Pion1:
+      chainInfo.rpc = process.env.NEXT_PUBLIC_NEUTRON_TEST_RPC ?? chainInfo.rpc
+      chainInfo.rest = process.env.NEXT_PUBLIC_NEUTRON_TEST_REST ?? chainInfo.rpc
+      break
+  }
+
+  return chainInfo
+}
+
 function getSupportedChainsInfos(walletId: WalletID) {
   return WALLETS[walletId].supportedChains.map((chain) => {
-    const chainInfo: ChainInfo = CHAINS[chain]
-    // Check if supported chain equals current chain
-    if (ENV.CHAIN_ID !== chainInfo.chainId) return chainInfo
-    // Override rpc and rest urls for the current chain if they are defined in .env
-    if (ENV.URL_RPC) chainInfo.rpc = ENV.URL_RPC
-    if (ENV.URL_REST) chainInfo.rest = ENV.URL_REST
+    const chainInfo = mapChainConfigToChainInfo(chains[chain])
+
     return chainInfo
   })
 }
@@ -56,12 +86,13 @@ const extensionProviders: WalletExtensionProvider[] = [
   new CosmostationExtensionProvider({ networks: getSupportedChainsInfos(WalletID.Cosmostation) }),
   new XDEFICosmosExtensionProvider({ networks: getSupportedChainsInfos(WalletID.Xdefi) }),
   new StationExtensionProvider({ networks: getSupportedChainsInfos(WalletID.Station) }),
+  new VectisCosmosExtensionProvider({ networks: getSupportedChainsInfos(WalletID.Vectis) }),
 ]
 
 export const WalletConnectProvider: FC<Props> = ({ children }) => {
   return (
     <ShuttleProvider
-      walletConnectProjectId={ENV.WALLET_CONNECT_ID}
+      walletConnectProjectId={process.env.NEXT_PUBLIC_WALLET_CONNECT_ID}
       mobileProviders={mobileProviders}
       extensionProviders={extensionProviders}
       persistent
diff --git a/src/components/Wallet/WalletConnectedButton.tsx b/src/components/Wallet/WalletConnectedButton.tsx
index 26288b8f..00ffdf03 100644
--- a/src/components/Wallet/WalletConnectedButton.tsx
+++ b/src/components/Wallet/WalletConnectedButton.tsx
@@ -6,17 +6,18 @@ import { useCallback, useEffect, useState } from 'react'
 import { useLocation, useNavigate, useSearchParams } from 'react-router-dom'
 import useClipboard from 'react-use-clipboard'
 
-import Button from 'components/Button'
-import { CircularProgress } from 'components/CircularProgress'
-import { FormattedNumber } from 'components/FormattedNumber'
-import { Check, Copy, ExternalLink, Osmo } from 'components/Icons'
-import Overlay from 'components/Overlay'
-import Text from 'components/Text'
+import Button from 'components/common/Button'
+import { CircularProgress } from 'components/common/CircularProgress'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import { Check, Copy, ExternalLink, Wallet } from 'components/common/Icons'
+import Overlay from 'components/common/Overlay'
+import Text from 'components/common/Text'
 import RecentTransactions from 'components/Wallet/RecentTransactions'
 import WalletSelect from 'components/Wallet/WalletSelect'
-import { CHAINS } from 'constants/chains'
-import { ENV } from 'constants/env'
+import chains from 'configs/chains'
 import { BN_ZERO } from 'constants/math'
+import useBaseAsset from 'hooks/assets/useBasetAsset'
+import useMarketEnabledAssets from 'hooks/assets/useMarketEnabledAssets'
 import useCurrentWallet from 'hooks/useCurrentWallet'
 import useICNSDomain from 'hooks/useICNSDomain'
 import useToggle from 'hooks/useToggle'
@@ -24,7 +25,6 @@ import useWalletBalances from 'hooks/useWalletBalances'
 import useStore from 'store'
 import { NETWORK } from 'types/enums/network'
 import { ChainInfoID } from 'types/enums/wallet'
-import { getBaseAsset, getEnabledMarketAssets } from 'utils/assets'
 import { truncate } from 'utils/formatters'
 import { getPage, getRoute } from 'utils/route'
 
@@ -32,14 +32,16 @@ export default function WalletConnectedButton() {
   // ---------------
   // EXTERNAL HOOKS
   // ---------------
-  const marketAssets = getEnabledMarketAssets()
+
+  const marketAssets = useMarketEnabledAssets()
   const currentWallet = useCurrentWallet()
   const { disconnectWallet } = useShuttle()
-  const address = useStore((s) => s.address)
+  const address = currentWallet?.account.address
   const userDomain = useStore((s) => s.userDomain)
   const focusComponent = useStore((s) => s.focusComponent)
   const network = useStore((s) => s.client?.connectedWallet.network)
-  const baseAsset = getBaseAsset()
+  const chainConfig = useStore((s) => s.chainConfig)
+  const baseAsset = useBaseAsset()
   const { data: walletBalances, isLoading } = useWalletBalances(address)
   const { data: icnsData, isLoading: isLoadingICNS } = useICNSDomain(address)
   const navigate = useNavigate()
@@ -57,10 +59,10 @@ export default function WalletConnectedButton() {
   // ---------------
   // VARIABLES
   // ---------------
-  const explorerName = network && CHAINS[network.chainId as ChainInfoID].explorerName
+  const explorerName = network && chains[network.chainId as ChainInfoID].explorerName
 
   const viewOnFinder = useCallback(() => {
-    const explorerUrl = network && CHAINS[network.chainId as ChainInfoID].explorer
+    const explorerUrl = network && chains[network.chainId as ChainInfoID].endpoints.explorer
 
     window.open(`${explorerUrl}/account/${address}`, '_blank')
   }, [network, address])
@@ -72,7 +74,6 @@ export default function WalletConnectedButton() {
       client: undefined,
       address: undefined,
       userDomain: undefined,
-      accounts: null,
       balances: [],
       focusComponent: null,
     })
@@ -128,21 +129,21 @@ export default function WalletConnectedButton() {
   }, [walletBalances, baseAsset.denom, baseAsset.decimals, marketAssets, walletAmount])
 
   return (
-    <div className={'relative'}>
-      {ENV.NETWORK !== NETWORK.MAINNET && (
+    <div className='relative'>
+      {chainConfig.network !== NETWORK.MAINNET && (
         <Text
           className='absolute -right-2 -top-2.5 z-10 rounded-sm p-0.5 px-2 gradient-primary-to-secondary'
           size='3xs'
           uppercase
         >
-          {network?.chainId}
+          {chainConfig.id}
         </Text>
       )}
 
       <Button
         variant='solid'
+        leftIcon={<Wallet />}
         color='tertiary'
-        leftIcon={<Osmo />}
         onClick={() => {
           setShowDetails(!showDetails)
         }}
diff --git a/src/components/Wallet/WalletConnecting.tsx b/src/components/Wallet/WalletConnecting.tsx
index ce370881..e9a3e5fa 100644
--- a/src/components/Wallet/WalletConnecting.tsx
+++ b/src/components/Wallet/WalletConnecting.tsx
@@ -1,32 +1,24 @@
 import { CosmWasmClient } from '@cosmjs/cosmwasm-stargate'
-import {
-  useShuttle,
-  WalletExtensionProvider,
-  WalletMobileProvider,
-} from '@delphi-labs/shuttle-react'
-import { useCallback, useEffect, useMemo, useRef } from 'react'
+import { useShuttle } from '@delphi-labs/shuttle-react'
+import { useCallback, useEffect, useMemo } from 'react'
 
-import { CircularProgress } from 'components/CircularProgress'
-import FullOverlayContent from 'components/FullOverlayContent'
+import { CircularProgress } from 'components/common/CircularProgress'
+import FullOverlayContent from 'components/common/FullOverlayContent'
 import WalletSelect from 'components/Wallet//WalletSelect'
 import WalletFetchBalancesAndAccounts from 'components/Wallet/WalletFetchBalancesAndAccounts'
-import { CHAINS } from 'constants/chains'
-import { ENV } from 'constants/env'
+import useChainConfig from 'hooks/useChainConfig'
+import useCurrentWallet from 'hooks/useCurrentWallet'
 import useToggle from 'hooks/useToggle'
 import useStore from 'store'
 
 interface Props {
-  autoConnect?: boolean
   providerId?: string
 }
 
-const currentChainId = ENV.CHAIN_ID
-const currentChain = CHAINS[currentChainId]
-
-const mapErrorMessages = (providerId: string, errorMessage: string) => {
+const mapErrorMessages = (providerId: string, errorMessage: string, name: string) => {
   if (providerId === 'station') {
     if (errorMessage.match('Wallet not connected to the network with chainId')) {
-      return `Your wallet is not connected to the correct network. Please switch your wallet to the ${currentChain.name} network`
+      return `Your wallet is not connected to the correct network. Please switch your wallet to the ${name} network`
     }
   }
 
@@ -34,32 +26,26 @@ const mapErrorMessages = (providerId: string, errorMessage: string) => {
 }
 
 export default function WalletConnecting(props: Props) {
-  const { recentWallet, connect, simulate, sign, broadcast, mobileProviders, extensionProviders } =
+  const { connect, mobileConnect, simulate, sign, broadcast, mobileProviders, extensionProviders } =
     useShuttle()
   const providers = useMemo(
     () => [...mobileProviders, ...extensionProviders],
     [mobileProviders, extensionProviders],
   )
+  const chainConfig = useChainConfig()
   const [isConnecting, setIsConnecting] = useToggle()
+  const recentWallet = useCurrentWallet()
   const providerId = props.providerId ?? recentWallet?.providerId
-  const refTimer = useRef<number | null>(null)
-  const isAutoConnect = props.autoConnect
   const client = useStore((s) => s.client)
-  const address = useStore((s) => s.address)
-
-  const clearTimer = useCallback(() => {
-    if (refTimer.current !== null) window.clearTimeout(refTimer.current)
-  }, [refTimer])
 
   const handleConnect = useCallback(
     (extensionProviderId: string) => {
       async function handleConnectAsync() {
         if (client || isConnecting) return
         setIsConnecting(true)
-        clearTimer()
         try {
-          const response = await connect({ extensionProviderId, chainId: currentChainId })
-          const cosmClient = await CosmWasmClient.connect(response.network.rpc)
+          const response = await connect({ extensionProviderId, chainId: chainConfig.id })
+          const cosmClient = await CosmWasmClient.connect(chainConfig.endpoints.rpc)
           const walletClient: WalletClient = {
             broadcast,
             cosmWasmClient: cosmClient,
@@ -71,6 +57,7 @@ export default function WalletConnecting(props: Props) {
           useStore.setState({
             client: walletClient,
             address: response.account.address,
+            chainConfig: chainConfig,
             focusComponent: {
               component: <WalletFetchBalancesAndAccounts />,
               onClose: () => {
@@ -85,13 +72,16 @@ export default function WalletConnecting(props: Props) {
               client: undefined,
               address: undefined,
               userDomain: undefined,
-              accounts: null,
               focusComponent: {
                 component: (
                   <WalletSelect
                     error={{
                       title: 'Failed to connect to wallet',
-                      message: mapErrorMessages(extensionProviderId, error.message),
+                      message: mapErrorMessages(
+                        extensionProviderId,
+                        error.message,
+                        chainConfig.name,
+                      ),
                     }}
                   />
                 ),
@@ -102,43 +92,103 @@ export default function WalletConnecting(props: Props) {
       }
       if (!isConnecting) handleConnectAsync()
     },
-    [broadcast, connect, client, isConnecting, setIsConnecting, sign, simulate, clearTimer],
+    [isConnecting, client, setIsConnecting, connect, chainConfig, broadcast, sign, simulate],
   )
 
-  const startTimer = useCallback(
-    (provider?: WalletMobileProvider | WalletExtensionProvider) => {
-      if (refTimer.current !== null || !window) return
-      refTimer.current = window.setTimeout(() => handleConnect(provider?.id ?? ''), 5000)
+  const handleMobileConnect = useCallback(
+    (mobileProviderId: string) => {
+      async function handleMobileConnectAsync() {
+        if (!recentWallet) {
+          useStore.setState({
+            client: undefined,
+            address: undefined,
+            userDomain: undefined,
+            focusComponent: {
+              component: <WalletSelect />,
+            },
+          })
+          return
+        }
+        if (client || isConnecting) return
+        setIsConnecting(true)
+        try {
+          await mobileConnect({ mobileProviderId, chainId: chainConfig.id })
+          const cosmClient = await CosmWasmClient.connect(chainConfig.endpoints.rpc)
+          const walletClient: WalletClient = {
+            broadcast,
+            cosmWasmClient: cosmClient,
+            connectedWallet: recentWallet,
+            sign,
+            simulate,
+          }
+          setIsConnecting(false)
+          useStore.setState({
+            client: walletClient,
+            address: recentWallet.account.address,
+            userDomain: undefined,
+            chainConfig: chainConfig,
+          })
+        } catch (error) {
+          setIsConnecting(false)
+          if (error instanceof Error) {
+            useStore.setState({
+              client: undefined,
+              address: undefined,
+              userDomain: undefined,
+              focusComponent: {
+                component: (
+                  <WalletSelect
+                    error={{
+                      title: 'Failed to connect to wallet',
+                      message: mapErrorMessages(mobileProviderId, error.message, chainConfig.name),
+                    }}
+                  />
+                ),
+              },
+            })
+          }
+        }
+      }
+      if (!isConnecting) handleMobileConnectAsync()
     },
-    [refTimer, handleConnect],
+    [
+      isConnecting,
+      client,
+      recentWallet,
+      setIsConnecting,
+      mobileConnect,
+      chainConfig,
+      broadcast,
+      sign,
+      simulate,
+    ],
   )
 
   useEffect(() => {
+    if (!providerId) {
+      useStore.setState({
+        client: undefined,
+        address: undefined,
+        userDomain: undefined,
+        focusComponent: {
+          component: <WalletSelect />,
+        },
+      })
+      return
+    }
     const provider = providers.find((p) => p.id === providerId)
-    if (
-      !provider ||
-      !provider.initialized ||
-      isConnecting ||
-      (recentWallet && recentWallet.account.address === address)
-    ) {
-      if (isAutoConnect) startTimer(provider)
+
+    if (!provider || provider.initializing || !provider.initialized || isConnecting) {
       return
     }
 
+    const isMobileProvider = provider.id.split('-')[0] === 'mobile'
+    if (isMobileProvider) {
+      handleMobileConnect(provider.id)
+      return
+    }
     handleConnect(provider.id)
-
-    return () => clearTimer()
-  }, [
-    handleConnect,
-    isConnecting,
-    providerId,
-    providers,
-    recentWallet,
-    address,
-    isAutoConnect,
-    startTimer,
-    clearTimer,
-  ])
+  }, [handleConnect, isConnecting, providerId, providers, handleMobileConnect])
 
   return (
     <FullOverlayContent
diff --git a/src/components/Wallet/WalletFetchBalancesAndAccounts.tsx b/src/components/Wallet/WalletFetchBalancesAndAccounts.tsx
index 411f6bbd..162a60f8 100644
--- a/src/components/Wallet/WalletFetchBalancesAndAccounts.tsx
+++ b/src/components/Wallet/WalletFetchBalancesAndAccounts.tsx
@@ -1,16 +1,16 @@
 import { Suspense, useEffect, useMemo } from 'react'
 import { useLocation, useNavigate, useParams, useSearchParams } from 'react-router-dom'
 
-import AccountCreateFirst from 'components/Account/AccountCreateFirst'
-import { CircularProgress } from 'components/CircularProgress'
-import FullOverlayContent from 'components/FullOverlayContent'
+import AccountCreateFirst from 'components/account/AccountCreateFirst'
+import { CircularProgress } from 'components/common/CircularProgress'
+import FullOverlayContent from 'components/common/FullOverlayContent'
 import WalletBridges from 'components/Wallet/WalletBridges'
+import useAccountIds from 'hooks/accounts/useAccountIds'
+import useBaseAsset from 'hooks/assets/useBasetAsset'
 import useAccountId from 'hooks/useAccountId'
-import useAccountIds from 'hooks/useAccountIds'
 import useWalletBalances from 'hooks/useWalletBalances'
 import useStore from 'store'
 import { byDenom } from 'utils/array'
-import { getBaseAsset } from 'utils/assets'
 import { defaultFee } from 'utils/constants'
 import { BN } from 'utils/helpers'
 import { getPage, getRoute } from 'utils/route'
@@ -19,7 +19,7 @@ function FetchLoading() {
   return (
     <FullOverlayContent
       title='Fetching Wallet Data'
-      copy='Please wait, while your wallet balances and accounts are beeing analyzed'
+      copy='Please wait, while your wallet balances and accounts are being analyzed'
     >
       <CircularProgress size={40} />
     </FullOverlayContent>
@@ -40,7 +40,7 @@ function Content() {
     true,
   )
   const { data: walletBalances, isLoading: isLoadingBalances } = useWalletBalances(address)
-  const baseAsset = getBaseAsset()
+  const baseAsset = useBaseAsset()
 
   const baseBalance = useMemo(
     () => walletBalances.find(byDenom(baseAsset.denom))?.amount ?? '0',
diff --git a/src/components/Wallet/WalletSelect.tsx b/src/components/Wallet/WalletSelect.tsx
index 90bd5268..91be68a0 100644
--- a/src/components/Wallet/WalletSelect.tsx
+++ b/src/components/Wallet/WalletSelect.tsx
@@ -1,16 +1,14 @@
 import { useShuttle } from '@delphi-labs/shuttle-react'
+import moment from 'moment'
 import Image from 'next/image'
 import React, { useEffect, useState } from 'react'
 import QRCode from 'react-qr-code'
-import moment from 'moment'
 
-import Button from 'components/Button'
-import FullOverlayContent from 'components/FullOverlayContent'
-import { ChevronLeft, ChevronRight } from 'components/Icons'
-import Text from 'components/Text'
+import Button from 'components/common/Button'
+import FullOverlayContent from 'components/common/FullOverlayContent'
+import { ChevronLeft, ChevronRight } from 'components/common/Icons'
+import Text from 'components/common/Text'
 import WalletConnecting from 'components/Wallet/WalletConnecting'
-import { CHAINS } from 'constants/chains'
-import { ENV } from 'constants/env'
 import { WALLETS } from 'constants/wallets'
 import useStore from 'store'
 import { WalletID } from 'types/enums/wallet'
@@ -32,9 +30,6 @@ interface WalletOptionProps {
   showLoader?: boolean
 }
 
-const currentChainId = ENV.CHAIN_ID
-const currentChain = CHAINS[currentChainId]
-
 function WalletOption(props: WalletOptionProps) {
   return (
     <Button
@@ -57,6 +52,7 @@ function WalletOption(props: WalletOptionProps) {
 }
 
 export default function WalletSelect(props: Props) {
+  const chainConfig = useStore((s) => s.chainConfig)
   const { extensionProviders, mobileProviders, mobileConnect } = useShuttle()
   const [qrCodeUrl, setQRCodeUrl] = useState('')
   const [error, setError] = useState(props.error)
@@ -138,7 +134,7 @@ export default function WalletSelect(props: Props) {
   return (
     <FullOverlayContent
       title={'Connect your wallet'}
-      copy={`Deposit assets from your ${currentChain.name} address to your Mars Credit Account.`}
+      copy={`Deposit assets from your ${chainConfig.name} address to your Mars Credit Account.`}
       docs='wallet'
     >
       <div className='flex flex-wrap w-full gap-3'>
@@ -149,7 +145,7 @@ export default function WalletSelect(props: Props) {
               return (
                 <React.Fragment key={walletId}>
                   {Array.from(provider.networks.values())
-                    .filter((network) => network.chainId === currentChainId)
+                    .filter((network) => network.chainId === chainConfig.id)
                     .map((network) => {
                       if (!provider.initialized && !provider.initializing) {
                         return (
@@ -169,7 +165,7 @@ export default function WalletSelect(props: Props) {
                           key={`${walletId}-${network.chainId}`}
                           handleClick={() => handleConnectClick(walletId)}
                           imageSrc={WALLETS[walletId].imageURL}
-                          name={WALLETS[walletId].name ?? 'Conenct Wallet'}
+                          name={WALLETS[walletId].name ?? 'Connect Wallet'}
                         />
                       )
                     })}
@@ -183,7 +179,7 @@ export default function WalletSelect(props: Props) {
           return (
             <React.Fragment key={walletId}>
               {Array.from(provider.networks.values())
-                .filter((network) => network.chainId === currentChainId)
+                .filter((network) => network.chainId === chainConfig.id)
                 .map((network) => {
                   return (
                     <WalletOption
diff --git a/src/components/Wallet/index.tsx b/src/components/Wallet/index.tsx
index be4dc80b..7b70ca62 100644
--- a/src/components/Wallet/index.tsx
+++ b/src/components/Wallet/index.tsx
@@ -13,26 +13,26 @@ export default function Wallet() {
   const address = useStore((s) => s.address)
 
   useEffect(() => {
-    if (!currentWallet) return
-    if (currentWallet.account.address === address) return
+    if (address) return
     useStore.setState({
       address: undefined,
       userDomain: undefined,
       client: undefined,
-      focusComponent: {
-        component: <WalletConnecting autoConnect />,
-        onClose: () => {
-          disconnectWallet(currentWallet)
-          useStore.setState({
-            client: undefined,
-            address: undefined,
-            userDomain: undefined,
-            accounts: null,
-            balances: [],
-            focusComponent: null,
-          })
-        },
-      },
+      focusComponent: currentWallet
+        ? {
+            component: <WalletConnecting />,
+            onClose: () => {
+              disconnectWallet(currentWallet)
+              useStore.setState({
+                client: undefined,
+                address: undefined,
+                userDomain: undefined,
+                balances: [],
+                focusComponent: null,
+              })
+            },
+          }
+        : null,
     })
   }, [currentWallet, address, disconnectWallet])
 
diff --git a/src/components/Account/AccountBalancesTable/Columns/Apy.tsx b/src/components/account/AccountBalancesTable/Columns/Apy.tsx
similarity index 78%
rename from src/components/Account/AccountBalancesTable/Columns/Apy.tsx
rename to src/components/account/AccountBalancesTable/Columns/Apy.tsx
index b210fd2d..68e40cf0 100644
--- a/src/components/Account/AccountBalancesTable/Columns/Apy.tsx
+++ b/src/components/account/AccountBalancesTable/Columns/Apy.tsx
@@ -1,4 +1,4 @@
-import AssetRate from 'components/Asset/AssetRate'
+import AssetRate from 'components/common/assets/AssetRate'
 import { byDenom } from 'utils/array'
 
 export const APY_META = { accessorKey: 'apy', header: 'APY', meta: { className: 'w-30' } }
@@ -7,7 +7,7 @@ interface Props {
   apy: number
   markets: Market[]
   denom: string
-  type: 'deposits' | 'borrowing' | 'lending' | 'vault'
+  type: PositionType
 }
 
 export default function Apr(props: Props) {
@@ -20,7 +20,7 @@ export default function Apr(props: Props) {
     <AssetRate
       className='justify-end text-xs'
       rate={apy}
-      isEnabled={type !== 'lending' || isEnabled}
+      isEnabled={type !== 'lend' || isEnabled}
       type='apy'
       orientation='ltr'
     />
diff --git a/src/components/account/AccountBalancesTable/Columns/Asset.tsx b/src/components/account/AccountBalancesTable/Columns/Asset.tsx
new file mode 100644
index 00000000..75314b1c
--- /dev/null
+++ b/src/components/account/AccountBalancesTable/Columns/Asset.tsx
@@ -0,0 +1,19 @@
+import Text from 'components/common/Text'
+export const ASSET_META = { accessorKey: 'symbol', header: 'Asset', id: 'symbol' }
+
+interface Props {
+  symbol: string
+  type: PositionType
+}
+
+export default function Asset(props: Props) {
+  const { symbol, type } = props
+  return (
+    <Text size='xs'>
+      {symbol}
+      {type === 'borrow' && <span className='ml-1 text-loss'>(debt)</span>}
+      {type === 'lend' && <span className='ml-1 text-profit'>(lent)</span>}
+      {type === 'vault' && <span className='ml-1 text-profit'>(farm)</span>}
+    </Text>
+  )
+}
diff --git a/src/components/Account/AccountBalancesTable/Columns/LiqPrice.tsx b/src/components/account/AccountBalancesTable/Columns/LiqPrice.tsx
similarity index 87%
rename from src/components/Account/AccountBalancesTable/Columns/LiqPrice.tsx
rename to src/components/account/AccountBalancesTable/Columns/LiqPrice.tsx
index f82bc914..5ab28ef2 100644
--- a/src/components/Account/AccountBalancesTable/Columns/LiqPrice.tsx
+++ b/src/components/account/AccountBalancesTable/Columns/LiqPrice.tsx
@@ -1,9 +1,9 @@
 import { useEffect, useMemo, useState } from 'react'
 
-import DisplayCurrency from 'components/DisplayCurrency'
-import { InfoCircle } from 'components/Icons'
-import Text from 'components/Text'
-import { Tooltip } from 'components/Tooltip'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import { InfoCircle } from 'components/common/Icons'
+import Text from 'components/common/Text'
+import { Tooltip } from 'components/common/Tooltip'
 import useLiquidationPrice from 'hooks/useLiquidationPrice'
 import { BNCoin } from 'types/classes/BNCoin'
 import { LiquidationPriceKind } from 'utils/health_computer'
@@ -20,7 +20,7 @@ interface Props {
   amount: number
   computeLiquidationPrice: (denom: string, kind: LiquidationPriceKind) => number | null
   denom: string
-  type: 'deposits' | 'borrowing' | 'lending' | 'vault'
+  type: PositionType
   account: Account
 }
 
@@ -31,7 +31,7 @@ export default function LiqPrice(props: Props) {
 
   const liqPrice = useMemo(() => {
     if (type === 'vault' || amount === 0) return 0
-    return computeLiquidationPrice(denom, type === 'borrowing' ? 'debt' : 'asset')
+    return computeLiquidationPrice(denom, type === 'borrow' ? 'debt' : 'asset')
   }, [amount, computeLiquidationPrice, denom, type])
 
   const { liquidationPrice } = useLiquidationPrice(liqPrice)
diff --git a/src/components/Account/AccountBalancesTable/Columns/Price.tsx b/src/components/account/AccountBalancesTable/Columns/Price.tsx
similarity index 84%
rename from src/components/Account/AccountBalancesTable/Columns/Price.tsx
rename to src/components/account/AccountBalancesTable/Columns/Price.tsx
index c45c9465..63b09bca 100644
--- a/src/components/Account/AccountBalancesTable/Columns/Price.tsx
+++ b/src/components/account/AccountBalancesTable/Columns/Price.tsx
@@ -1,4 +1,4 @@
-import DisplayCurrency from 'components/DisplayCurrency'
+import DisplayCurrency from 'components/common/DisplayCurrency'
 import usePrice from 'hooks/usePrice'
 import { BNCoin } from 'types/classes/BNCoin'
 import { BN } from 'utils/helpers'
@@ -8,7 +8,7 @@ export const PRICE_META = { id: 'price', header: 'Price', meta: { className: 'w-
 interface Props {
   amount: number
   denom: string
-  type: 'deposits' | 'borrowing' | 'lending' | 'vault'
+  type: PositionType
 }
 
 export default function Price(props: Props) {
diff --git a/src/components/Account/AccountBalancesTable/Columns/Size.tsx b/src/components/account/AccountBalancesTable/Columns/Size.tsx
similarity index 90%
rename from src/components/Account/AccountBalancesTable/Columns/Size.tsx
rename to src/components/account/AccountBalancesTable/Columns/Size.tsx
index 00514636..329444bb 100644
--- a/src/components/Account/AccountBalancesTable/Columns/Size.tsx
+++ b/src/components/account/AccountBalancesTable/Columns/Size.tsx
@@ -1,8 +1,8 @@
 import { Row } from '@tanstack/react-table'
 import classNames from 'classnames'
 
-import { getAmountChangeColor } from 'components/Account/AccountBalancesTable/functions'
-import { FormattedNumber } from 'components/FormattedNumber'
+import { getAmountChangeColor } from 'components/account/AccountBalancesTable/functions'
+import { FormattedNumber } from 'components/common/FormattedNumber'
 import { MAX_AMOUNT_DECIMALS, MIN_AMOUNT } from 'constants/math'
 import { formatAmountToPrecision } from 'utils/formatters'
 
@@ -12,7 +12,7 @@ interface Props {
   size: number
   amountChange: BigNumber
   denom: string
-  type: 'deposits' | 'borrowing' | 'lending' | 'vault'
+  type: PositionType
 }
 
 export const sizeSortingFn = (a: Row<AccountBalanceRow>, b: Row<AccountBalanceRow>): number => {
diff --git a/src/components/Account/AccountBalancesTable/Columns/Value.tsx b/src/components/account/AccountBalancesTable/Columns/Value.tsx
similarity index 56%
rename from src/components/Account/AccountBalancesTable/Columns/Value.tsx
rename to src/components/account/AccountBalancesTable/Columns/Value.tsx
index 918fdf8a..b1f36d03 100644
--- a/src/components/Account/AccountBalancesTable/Columns/Value.tsx
+++ b/src/components/account/AccountBalancesTable/Columns/Value.tsx
@@ -1,8 +1,8 @@
 import { Row } from '@tanstack/react-table'
 import classNames from 'classnames'
 
-import { getAmountChangeColor } from 'components/Account/AccountBalancesTable/functions'
-import DisplayCurrency from 'components/DisplayCurrency'
+import { getAmountChangeColor } from 'components/account/AccountBalancesTable/functions'
+import DisplayCurrency from 'components/common/DisplayCurrency'
 import { ORACLE_DENOM } from 'constants/oracle'
 import { BNCoin } from 'types/classes/BNCoin'
 import { BN } from 'utils/helpers'
@@ -12,10 +12,19 @@ export const VALUE_META = { accessorKey: 'value', header: 'Value' }
 interface Props {
   amountChange: BigNumber
   value: string
-  type: 'deposits' | 'borrowing' | 'lending' | 'vault'
+  type: PositionType
 }
 
-export const valueSortingFn = (a: Row<AccountBalanceRow>, b: Row<AccountBalanceRow>): number => {
+export const valueBalancesSortingFn = (
+  a: Row<AccountBalanceRow>,
+  b: Row<AccountBalanceRow>,
+): number => {
+  const valueA = BN(a.original.value)
+  const valueB = BN(b.original.value)
+  return valueA.minus(valueB).toNumber()
+}
+
+export const valuePerpSortingFn = (a: Row<AccountPerpRow>, b: Row<AccountPerpRow>): number => {
   const valueA = BN(a.original.value)
   const valueB = BN(b.original.value)
   return valueA.minus(valueB).toNumber()
@@ -24,17 +33,12 @@ export const valueSortingFn = (a: Row<AccountBalanceRow>, b: Row<AccountBalanceR
 export default function Value(props: Props) {
   const { amountChange, type, value } = props
   const color = getAmountChangeColor(type, amountChange)
-  const allowZero = !amountChange.isZero()
   const coin = new BNCoin({
     denom: ORACLE_DENOM,
     amount: value,
   })
 
   return (
-    <DisplayCurrency
-      coin={coin}
-      className={classNames('text-xs text-right', color)}
-      showZero={!allowZero}
-    />
+    <DisplayCurrency coin={coin} className={classNames('text-xs text-right', color)} showZero />
   )
 }
diff --git a/src/components/Account/AccountBalancesTable/Columns/useAccountBalancesColumns.tsx b/src/components/account/AccountBalancesTable/Columns/useAccountBalancesColumns.tsx
similarity index 84%
rename from src/components/Account/AccountBalancesTable/Columns/useAccountBalancesColumns.tsx
rename to src/components/account/AccountBalancesTable/Columns/useAccountBalancesColumns.tsx
index e05cfcb8..5f488a1e 100644
--- a/src/components/Account/AccountBalancesTable/Columns/useAccountBalancesColumns.tsx
+++ b/src/components/account/AccountBalancesTable/Columns/useAccountBalancesColumns.tsx
@@ -1,20 +1,20 @@
 import { ColumnDef, Row } from '@tanstack/react-table'
 import { useMemo } from 'react'
 
-import Apy, { APY_META } from 'components/Account/AccountBalancesTable/Columns/Apy'
-import Asset, { ASSET_META } from 'components/Account/AccountBalancesTable/Columns/Asset'
-import LiqPrice, { LIQ_META } from 'components/Account/AccountBalancesTable/Columns/LiqPrice'
-import Price, { PRICE_META } from 'components/Account/AccountBalancesTable/Columns/Price'
+import Apy, { APY_META } from 'components/account/AccountBalancesTable/Columns/Apy'
+import Asset, { ASSET_META } from 'components/account/AccountBalancesTable/Columns/Asset'
+import LiqPrice, { LIQ_META } from 'components/account/AccountBalancesTable/Columns/LiqPrice'
+import Price, { PRICE_META } from 'components/account/AccountBalancesTable/Columns/Price'
 import Size, {
   SIZE_META,
   sizeSortingFn,
-} from 'components/Account/AccountBalancesTable/Columns/Size'
+} from 'components/account/AccountBalancesTable/Columns/Size'
 import Value, {
   VALUE_META,
-  valueSortingFn,
-} from 'components/Account/AccountBalancesTable/Columns/Value'
+  valueBalancesSortingFn,
+} from 'components/account/AccountBalancesTable/Columns/Value'
+import useMarketAssets from 'hooks/markets/useMarketAssets'
 import useHealthComputer from 'hooks/useHealthComputer'
-import useMarketAssets from 'hooks/useMarketAssets'
 import useStore from 'store'
 
 export default function useAccountBalancesColumns(
@@ -41,8 +41,7 @@ export default function useAccountBalancesColumns(
             type={row.original.type}
           />
         ),
-
-        sortingFn: valueSortingFn,
+        sortingFn: valueBalancesSortingFn,
       },
       {
         ...SIZE_META,
diff --git a/src/components/Account/AccountBalancesTable/functions.ts b/src/components/account/AccountBalancesTable/functions.ts
similarity index 88%
rename from src/components/Account/AccountBalancesTable/functions.ts
rename to src/components/account/AccountBalancesTable/functions.ts
index f5b875bb..b523cb4d 100644
--- a/src/components/Account/AccountBalancesTable/functions.ts
+++ b/src/components/account/AccountBalancesTable/functions.ts
@@ -3,9 +3,10 @@ import { BNCoin } from 'types/classes/BNCoin'
 import { demagnify, getCoinValue } from 'utils/formatters'
 
 export function getAssetAccountBalanceRow(
-  type: 'deposits' | 'borrowing' | 'lending',
+  type: 'deposit' | 'borrow' | 'lend',
   asset: Asset,
   prices: BNCoin[],
+  assets: Asset[],
   position: BNCoin,
   apy: number,
   prev?: BNCoin,
@@ -17,7 +18,7 @@ export function getAssetAccountBalanceRow(
     type,
     symbol: asset.symbol,
     size: demagnify(amount, asset),
-    value: getCoinValue(BNCoin.fromDenomAndBigNumber(denom, amount), prices).toString(),
+    value: getCoinValue(BNCoin.fromDenomAndBigNumber(denom, amount), prices, assets).toString(),
     denom,
     amount,
     apy,
@@ -56,11 +57,9 @@ export function getVaultAccountBalanceRow(
   }
 }
 
-export function getAmountChangeColor(
-  type: 'deposits' | 'borrowing' | 'lending' | 'vault',
-  amount: BigNumber,
-) {
-  if (type === 'borrowing') {
+export function getAmountChangeColor(type: PositionType, amount: BigNumber) {
+  if (type === 'perp') return ''
+  if (type === 'borrow') {
     if (amount.isGreaterThan(0)) return 'text-loss'
     if (amount.isLessThan(0)) return 'text-profit'
   }
diff --git a/src/components/Account/AccountBalancesTable/index.tsx b/src/components/account/AccountBalancesTable/index.tsx
similarity index 85%
rename from src/components/Account/AccountBalancesTable/index.tsx
rename to src/components/account/AccountBalancesTable/index.tsx
index 591aadbc..a3e00be6 100644
--- a/src/components/Account/AccountBalancesTable/index.tsx
+++ b/src/components/account/AccountBalancesTable/index.tsx
@@ -1,14 +1,14 @@
 import classNames from 'classnames'
 import { useLocation, useNavigate, useSearchParams } from 'react-router-dom'
 
-import useAccountBalancesColumns from 'components/Account/AccountBalancesTable/Columns/useAccountBalancesColumns'
-import useAccountBalanceData from 'components/Account/AccountBalancesTable/useAccountBalanceData'
-import AccountFundFullPage from 'components/Account/AccountFund/AccountFundFullPage'
-import ActionButton from 'components/Button/ActionButton'
-import Card from 'components/Card'
-import Table from 'components/Table'
+import useAccountBalancesColumns from 'components/account/AccountBalancesTable/Columns/useAccountBalancesColumns'
+import useAccountBalanceData from 'components/account/AccountBalancesTable/useAccountBalanceData'
+import AccountFundFullPage from 'components/account/AccountFund/AccountFundFullPage'
+import ActionButton from 'components/common/Button/ActionButton'
+import Card from 'components/common/Card'
+import Table from 'components/common/Table'
 import ConditionalWrapper from 'hocs/ConditionalWrapper'
-import useCurrentAccount from 'hooks/useCurrentAccount'
+import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
 import useStore from 'store'
 import { getPage, getRoute } from 'utils/route'
 
@@ -89,7 +89,7 @@ export default function AccountBalancesTable(props: Props) {
       initialSorting={[]}
       spacingClassName='p-2'
       hideCard={hideCard}
-      isBalancesTable
+      type='balances'
     />
   )
 }
diff --git a/src/components/Account/AccountBalancesTable/useAccountBalanceData.tsx b/src/components/account/AccountBalancesTable/useAccountBalanceData.tsx
similarity index 73%
rename from src/components/Account/AccountBalancesTable/useAccountBalanceData.tsx
rename to src/components/account/AccountBalancesTable/useAccountBalanceData.tsx
index 6fd9b350..73391524 100644
--- a/src/components/Account/AccountBalancesTable/useAccountBalanceData.tsx
+++ b/src/components/account/AccountBalancesTable/useAccountBalanceData.tsx
@@ -3,8 +3,8 @@ import { useMemo } from 'react'
 import {
   getAssetAccountBalanceRow,
   getVaultAccountBalanceRow,
-} from 'components/Account/AccountBalancesTable/functions'
-import { ASSETS } from 'constants/assets'
+} from 'components/account/AccountBalancesTable/functions'
+import useAllAssets from 'hooks/assets/useAllAssets'
 import useHLSStakingAssets from 'hooks/useHLSStakingAssets'
 import usePrices from 'hooks/usePrices'
 import { byDenom } from 'utils/array'
@@ -19,10 +19,9 @@ interface Props {
 
 export default function useAccountBalanceData(props: Props) {
   const { account, updatedAccount, lendingData, borrowingData } = props
-
   const { data: hlsStrategies } = useHLSStakingAssets()
   const { data: prices } = usePrices()
-
+  const assets = useAllAssets()
   return useMemo<AccountBalanceRow[]>(() => {
     const usedAccount = updatedAccount ?? account
     const accountDeposits = usedAccount?.deposits ?? []
@@ -32,24 +31,26 @@ export default function useAccountBalanceData(props: Props) {
 
     const deposits: AccountBalanceRow[] = []
     accountDeposits.forEach((deposit) => {
-      const asset = ASSETS.find(byDenom(deposit.denom))
+      const asset = assets.find(byDenom(deposit.denom))
       if (!asset) return
       const apy = props.isHls
         ? hlsStrategies.find((strategy) => strategy.denoms.deposit === asset.denom)?.apy ?? 0
         : 0
       const prevDeposit = updatedAccount ? account?.deposits.find(byDenom(deposit.denom)) : deposit
-      deposits.push(getAssetAccountBalanceRow('deposits', asset, prices, deposit, apy, prevDeposit))
+      deposits.push(
+        getAssetAccountBalanceRow('deposit', asset, prices, assets, deposit, apy, prevDeposit),
+      )
     })
 
     const lends = accountLends.map((lending) => {
-      const asset = ASSETS.find(byDenom(lending.denom)) ?? ASSETS[0]
+      const asset = assets.find(byDenom(lending.denom)) ?? assets[0]
       const apy =
         lendingData.find((market) => market.asset.denom === lending.denom)?.apy.deposit ?? 0
 
       const prevLending = updatedAccount
         ? account?.lends.find((position) => position.denom === lending.denom)
         : lending
-      return getAssetAccountBalanceRow('lending', asset, prices, lending, apy, prevLending)
+      return getAssetAccountBalanceRow('lend', asset, prices, assets, lending, apy, prevLending)
     })
 
     const vaults = accountVaults.map((vault) => {
@@ -61,13 +62,22 @@ export default function useAccountBalanceData(props: Props) {
     })
 
     const debts = accountDebts.map((debt) => {
-      const asset = ASSETS.find(byDenom(debt.denom)) ?? ASSETS[0]
+      const asset = assets.find(byDenom(debt.denom)) ?? assets[0]
       const apy = borrowingData.find((market) => market.asset.denom === debt.denom)?.apy.borrow ?? 0
       const prevDebt = updatedAccount
         ? account?.debts.find((position) => position.denom === debt.denom)
         : debt
-      return getAssetAccountBalanceRow('borrowing', asset, prices, debt, apy, prevDebt)
+      return getAssetAccountBalanceRow('borrow', asset, prices, assets, debt, apy, prevDebt)
     })
     return [...deposits, ...lends, ...vaults, ...debts]
-  }, [updatedAccount, account, props.isHls, hlsStrategies, prices, lendingData, borrowingData])
+  }, [
+    updatedAccount,
+    account,
+    props.isHls,
+    hlsStrategies,
+    prices,
+    assets,
+    lendingData,
+    borrowingData,
+  ])
 }
diff --git a/src/components/Account/AccountComposition.tsx b/src/components/account/AccountComposition.tsx
similarity index 83%
rename from src/components/Account/AccountComposition.tsx
rename to src/components/account/AccountComposition.tsx
index 5133d2e7..3a791f48 100644
--- a/src/components/Account/AccountComposition.tsx
+++ b/src/components/account/AccountComposition.tsx
@@ -2,12 +2,13 @@ import BigNumber from 'bignumber.js'
 import classNames from 'classnames'
 import { useMemo } from 'react'
 
-import DisplayCurrency from 'components/DisplayCurrency'
-import { FormattedNumber } from 'components/FormattedNumber'
-import { ArrowRight } from 'components/Icons'
-import Text from 'components/Text'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import { ArrowRight } from 'components/common/Icons'
+import Text from 'components/common/Text'
 import { BN_ZERO, MAX_AMOUNT_DECIMALS } from 'constants/math'
 import { ORACLE_DENOM } from 'constants/oracle'
+import useAllAssets from 'hooks/assets/useAllAssets'
 import useBorrowMarketAssetsTableData from 'hooks/useBorrowMarketAssetsTableData'
 import useHLSStakingAssets from 'hooks/useHLSStakingAssets'
 import useLendingMarketAssetsTableData from 'hooks/useLendingMarketAssetsTableData'
@@ -40,7 +41,8 @@ export default function AccountComposition(props: Props) {
   const hasChanged = !!updatedAccount
   const { data: prices } = usePrices()
   const { data: hlsStrategies } = useHLSStakingAssets()
-  const { data } = useBorrowMarketAssetsTableData(false)
+  const assets = useAllAssets()
+  const data = useBorrowMarketAssetsTableData()
   const borrowAssetsData = useMemo(() => data?.allAssets || [], [data])
   const { availableAssets: lendingAvailableAssets, accountLentAssets } =
     useLendingMarketAssetsTableData()
@@ -50,15 +52,15 @@ export default function AccountComposition(props: Props) {
   )
 
   const [depositsBalance, lendsBalance, debtsBalance, vaultsBalance] = useMemo(
-    () => getAccountPositionValues(account, prices),
-    [account, prices],
+    () => getAccountPositionValues(account, prices, assets),
+    [account, assets, prices],
   )
   const totalBalance = depositsBalance.plus(lendsBalance).plus(vaultsBalance)
 
   const [updatedPositionValue, updatedDebtsBalance] = useMemo(() => {
     const [updatedDepositsBalance, updatedLendsBalance, updatedDebtsBalance, updatedVaultsBalance] =
       updatedAccount
-        ? getAccountPositionValues(updatedAccount, prices)
+        ? getAccountPositionValues(updatedAccount, prices, assets)
         : [BN_ZERO, BN_ZERO, BN_ZERO]
 
     const updatedPositionValue = updatedDepositsBalance
@@ -66,12 +68,15 @@ export default function AccountComposition(props: Props) {
       .plus(updatedVaultsBalance)
 
     return [updatedPositionValue, updatedDebtsBalance]
-  }, [updatedAccount, prices])
+  }, [updatedAccount, prices, assets])
 
-  const netWorth = useMemo(() => calculateAccountBalanceValue(account, prices), [account, prices])
+  const netWorth = useMemo(
+    () => calculateAccountBalanceValue(account, prices, assets),
+    [account, assets, prices],
+  )
   const updatedTotalBalance = useMemo(
-    () => (updatedAccount ? calculateAccountBalanceValue(updatedAccount, prices) : BN_ZERO),
-    [updatedAccount, prices],
+    () => (updatedAccount ? calculateAccountBalanceValue(updatedAccount, prices, assets) : BN_ZERO),
+    [updatedAccount, prices, assets],
   )
 
   const apr = useMemo(
@@ -82,9 +87,10 @@ export default function AccountComposition(props: Props) {
         lendingAssetsData,
         prices,
         hlsStrategies,
+        assets,
         props.isHls,
       ),
-    [account, borrowAssetsData, hlsStrategies, lendingAssetsData, prices, props.isHls],
+    [account, assets, borrowAssetsData, hlsStrategies, lendingAssetsData, prices, props.isHls],
   )
   const updatedApr = useMemo(
     () =>
@@ -95,10 +101,19 @@ export default function AccountComposition(props: Props) {
             lendingAssetsData,
             prices,
             hlsStrategies,
+            assets,
             props.isHls,
           )
         : BN_ZERO,
-    [updatedAccount, borrowAssetsData, lendingAssetsData, prices, hlsStrategies, props.isHls],
+    [
+      updatedAccount,
+      borrowAssetsData,
+      lendingAssetsData,
+      prices,
+      hlsStrategies,
+      assets,
+      props.isHls,
+    ],
   )
 
   return (
diff --git a/src/components/Account/AccountCreateFirst.tsx b/src/components/account/AccountCreateFirst.tsx
similarity index 92%
rename from src/components/Account/AccountCreateFirst.tsx
rename to src/components/account/AccountCreateFirst.tsx
index e2ea005e..dda50671 100644
--- a/src/components/Account/AccountCreateFirst.tsx
+++ b/src/components/account/AccountCreateFirst.tsx
@@ -1,8 +1,8 @@
 import { useCallback, useEffect } from 'react'
 import { useLocation, useNavigate, useSearchParams } from 'react-router-dom'
 
-import AccountFundFullPage from 'components/Account/AccountFund/AccountFundFullPage'
-import FullOverlayContent from 'components/FullOverlayContent'
+import AccountFundFullPage from 'components/account/AccountFund/AccountFundFullPage'
+import FullOverlayContent from 'components/common/FullOverlayContent'
 import WalletSelect from 'components/Wallet/WalletSelect'
 import useToggle from 'hooks/useToggle'
 import useStore from 'store'
diff --git a/src/components/Account/AccountDetails/AccountDetailsLeverage.tsx b/src/components/account/AccountDetails/AccountDetailsLeverage.tsx
similarity index 91%
rename from src/components/Account/AccountDetails/AccountDetailsLeverage.tsx
rename to src/components/account/AccountDetails/AccountDetailsLeverage.tsx
index 98b25ff3..e9771eea 100644
--- a/src/components/Account/AccountDetails/AccountDetailsLeverage.tsx
+++ b/src/components/account/AccountDetails/AccountDetailsLeverage.tsx
@@ -1,7 +1,7 @@
 import classNames from 'classnames'
 
-import { FormattedNumber } from 'components/FormattedNumber'
-import { ArrowRight } from 'components/Icons'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import { ArrowRight } from 'components/common/Icons'
 
 interface Props {
   leverage: number
diff --git a/src/components/Account/AccountDetails/Skeleton.tsx b/src/components/account/AccountDetails/Skeleton.tsx
similarity index 89%
rename from src/components/Account/AccountDetails/Skeleton.tsx
rename to src/components/account/AccountDetails/Skeleton.tsx
index 59a124c6..d4dc5202 100644
--- a/src/components/Account/AccountDetails/Skeleton.tsx
+++ b/src/components/account/AccountDetails/Skeleton.tsx
@@ -1,6 +1,6 @@
-import { HealthGauge } from 'components/Account/Health/HealthGauge'
-import Loading from 'components/Loading'
-import Text from 'components/Text'
+import { HealthGauge } from 'components/account/Health/HealthGauge'
+import Loading from 'components/common/Loading'
+import Text from 'components/common/Text'
 
 export default function Skeleton() {
   return (
diff --git a/src/components/Account/AccountDetails/index.tsx b/src/components/account/AccountDetails/index.tsx
similarity index 78%
rename from src/components/Account/AccountDetails/index.tsx
rename to src/components/account/AccountDetails/index.tsx
index cadf4de6..79d0ff8b 100644
--- a/src/components/Account/AccountDetails/index.tsx
+++ b/src/components/account/AccountDetails/index.tsx
@@ -2,30 +2,32 @@ import classNames from 'classnames'
 import { useCallback, useMemo } from 'react'
 import { useLocation } from 'react-router-dom'
 
-import AccountBalancesTable from 'components/Account/AccountBalancesTable'
-import AccountComposition from 'components/Account/AccountComposition'
-import AccountDetailsLeverage from 'components/Account/AccountDetails/AccountDetailsLeverage'
-import Skeleton from 'components/Account/AccountDetails/Skeleton'
-import { HealthGauge } from 'components/Account/Health/HealthGauge'
-import EscButton from 'components/Button/EscButton'
-import { glowElement } from 'components/Button/utils'
-import Card from 'components/Card'
-import DisplayCurrency from 'components/DisplayCurrency'
-import { FormattedNumber } from 'components/FormattedNumber'
-import { ThreeDots } from 'components/Icons'
-import Text from 'components/Text'
+import AccountBalancesTable from 'components/account/AccountBalancesTable'
+import AccountComposition from 'components/account/AccountComposition'
+import AccountDetailsLeverage from 'components/account/AccountDetails/AccountDetailsLeverage'
+import Skeleton from 'components/account/AccountDetails/Skeleton'
+import AccountPerpPositionTable from 'components/account/AccountPerpPositionTable'
+import { HealthGauge } from 'components/account/Health/HealthGauge'
+import EscButton from 'components/common/Button/EscButton'
+import { glowElement } from 'components/common/Button/utils'
+import Card from 'components/common/Card'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import { ThreeDots } from 'components/common/Icons'
+import Text from 'components/common/Text'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
 import { ORACLE_DENOM } from 'constants/oracle'
+import useAccountIds from 'hooks/accounts/useAccountIds'
+import useAccounts from 'hooks/accounts/useAccounts'
+import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import useAccountId from 'hooks/useAccountId'
-import useAccountIds from 'hooks/useAccountIds'
-import useAccounts from 'hooks/useAccounts'
 import useBorrowMarketAssetsTableData from 'hooks/useBorrowMarketAssetsTableData'
-import useCurrentAccount from 'hooks/useCurrentAccount'
-import useHealthComputer from 'hooks/useHealthComputer'
 import useHLSStakingAssets from 'hooks/useHLSStakingAssets'
+import useHealthComputer from 'hooks/useHealthComputer'
 import useLendingMarketAssetsTableData from 'hooks/useLendingMarketAssetsTableData'
-import useLocalStorage from 'hooks/useLocalStorage'
 import usePrices from 'hooks/usePrices'
 import useStore from 'store'
 import { BNCoin } from 'types/classes/BNCoin'
@@ -72,21 +74,25 @@ function AccountDetails(props: Props) {
     updatedAccount || account,
   )
   const { data: prices } = usePrices()
+  const assets = useAllAssets()
   const accountBalanceValue = useMemo(
-    () => calculateAccountBalanceValue(updatedAccount ?? account, prices),
-    [updatedAccount, account, prices],
+    () => calculateAccountBalanceValue(updatedAccount ?? account, prices, assets),
+    [updatedAccount, account, prices, assets],
   )
   const coin = BNCoin.fromDenomAndBigNumber(ORACLE_DENOM, accountBalanceValue)
-  const leverage = useMemo(() => calculateAccountLeverage(account, prices), [account, prices])
+  const leverage = useMemo(
+    () => calculateAccountLeverage(account, prices, assets),
+    [account, assets, prices],
+  )
   const updatedLeverage = useMemo(() => {
     if (!updatedAccount) return null
-    const updatedLeverage = calculateAccountLeverage(updatedAccount, prices)
+    const updatedLeverage = calculateAccountLeverage(updatedAccount, prices, assets)
 
     if (updatedLeverage.eq(leverage)) return null
     return updatedLeverage
-  }, [updatedAccount, prices, leverage])
+  }, [updatedAccount, prices, leverage, assets])
 
-  const { data } = useBorrowMarketAssetsTableData(false)
+  const data = useBorrowMarketAssetsTableData()
   const borrowAssetsData = useMemo(() => data?.allAssets || [], [data])
 
   const { availableAssets: lendingAvailableAssets, accountLentAssets } =
@@ -104,11 +110,15 @@ function AccountDetails(props: Props) {
         lendingAssetsData,
         prices,
         hlsStrategies,
+        assets,
         account.kind === 'high_levered_strategy',
       ),
-    [account, borrowAssetsData, hlsStrategies, lendingAssetsData, prices, updatedAccount],
+    [account, assets, borrowAssetsData, hlsStrategies, lendingAssetsData, prices, updatedAccount],
   )
-  const isFullWidth = location.pathname.includes('trade') || location.pathname === '/'
+  const isFullWidth =
+    location.pathname.includes('trade') ||
+    location.pathname === '/' ||
+    location.pathname.includes('perps')
 
   function AccountDetailsHeader() {
     const onClose = useCallback(() => useStore.setState({ accountDetailsExpanded: false }), [])
@@ -209,6 +219,12 @@ function AccountDetails(props: Props) {
               lendingData={lendingAssetsData}
               hideCard
             />
+            {account.perps.length > 0 && (
+              <>
+                <Text className='w-full px-4 py-2 text-white bg-white/10'>Perp Positions</Text>
+                <AccountPerpPositionTable account={account} hideCard />
+              </>
+            )}
           </Card>
         </div>
       </div>
diff --git a/src/components/Account/AccountFund/AccountFundContent.tsx b/src/components/account/AccountFund/AccountFundContent.tsx
similarity index 80%
rename from src/components/Account/AccountFund/AccountFundContent.tsx
rename to src/components/account/AccountFund/AccountFundContent.tsx
index ac009ee0..b28a2734 100644
--- a/src/components/Account/AccountFund/AccountFundContent.tsx
+++ b/src/components/account/AccountFund/AccountFundContent.tsx
@@ -1,25 +1,22 @@
 import classNames from 'classnames'
 import { useCallback, useEffect, useMemo, useState } from 'react'
 
-import Button from 'components/Button'
-import DepositCapMessage from 'components/DepositCapMessage'
-import { ArrowRight, Plus } from 'components/Icons'
-import SwitchAutoLend from 'components/Switch/SwitchAutoLend'
-import Text from 'components/Text'
-import TokenInputWithSlider from 'components/TokenInput/TokenInputWithSlider'
+import AccountFundRow from 'components/account/AccountFund/AccountFundRow'
+import Button from 'components/common/Button'
+import DepositCapMessage from 'components/common/DepositCapMessage'
+import { ArrowRight, Plus } from 'components/common/Icons'
+import SwitchAutoLend from 'components/common/Switch/SwitchAutoLend'
+import Text from 'components/common/Text'
 import WalletBridges from 'components/Wallet/WalletBridges'
-import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
-import { LocalStorageKeys } from 'constants/localStorageKeys'
 import { BN_ZERO } from 'constants/math'
-import useLocalStorage from 'hooks/useLocalStorage'
-import useMarketAssets from 'hooks/useMarketAssets'
-import useToggle from 'hooks/useToggle'
+import useBaseAsset from 'hooks/assets/useBasetAsset'
+import useMarketAssets from 'hooks/markets/useMarketAssets'
+import useAutoLend from 'hooks/useAutoLend'
 import { useUpdatedAccount } from 'hooks/useUpdatedAccount'
 import useWalletBalances from 'hooks/useWalletBalances'
 import useStore from 'store'
 import { BNCoin } from 'types/classes/BNCoin'
 import { byDenom } from 'utils/array'
-import { getAssetByDenom, getBaseAsset } from 'utils/assets'
 import { defaultFee } from 'utils/constants'
 import { getCapLeftWithBuffer } from 'utils/generic'
 import { BN } from 'utils/helpers'
@@ -35,16 +32,13 @@ export default function AccountFundContent(props: Props) {
   const deposit = useStore((s) => s.deposit)
   const walletAssetModal = useStore((s) => s.walletAssetsModal)
   const [isConfirming, setIsConfirming] = useState(false)
-  const [lendAssets] = useLocalStorage<boolean>(
-    LocalStorageKeys.LEND_ASSETS,
-    DEFAULT_SETTINGS.lendAssets,
-  )
+  const { autoLendEnabledAccountIds } = useAutoLend()
+  const isLending = autoLendEnabledAccountIds.includes(props.accountId)
   const [fundingAssets, setFundingAssets] = useState<BNCoin[]>([])
   const { data: marketAssets } = useMarketAssets()
   const { data: walletBalances } = useWalletBalances(props.address)
-  const [isLending, toggleIsLending] = useToggle(lendAssets)
   const { simulateDeposits } = useUpdatedAccount(props.account)
-  const baseAsset = getBaseAsset()
+  const baseAsset = useBaseAsset()
 
   const hasAssetSelected = fundingAssets.length > 0
   const hasFundingAssets =
@@ -150,26 +144,20 @@ export default function AccountFundContent(props: Props) {
       <div>
         {!hasAssetSelected && <Text>Please select an asset.</Text>}
         {fundingAssets.map((coin) => {
-          const asset = getAssetByDenom(coin.denom) as Asset
-
-          const balance = balances.find(byDenom(coin.denom))?.amount ?? BN_ZERO
           return (
             <div
-              key={asset.symbol}
+              key={coin.denom}
               className={classNames(
                 'w-full mb-4',
                 props.isFullPage && 'w-full p-4 border rounded-base border-white/20 bg-white/5',
               )}
             >
-              <TokenInputWithSlider
-                asset={asset}
-                onChange={(amount) => updateFundingAssets(amount, asset.denom)}
-                amount={coin.amount ?? BN_ZERO}
-                max={balance}
+              <AccountFundRow
+                denom={coin.denom}
                 balances={balances}
-                maxText='Max'
-                disabled={isConfirming}
-                warningMessages={[]}
+                amount={coin.amount ?? BN_ZERO}
+                isConfirming={isConfirming}
+                updateFundingAssets={updateFundingAssets}
               />
             </div>
           )
@@ -177,7 +165,7 @@ export default function AccountFundContent(props: Props) {
 
         <Button
           className='w-full mt-4'
-          text='Select assets'
+          text='Select Assets'
           color='tertiary'
           rightIcon={<Plus />}
           iconClassName='w-3'
diff --git a/src/components/Account/AccountFund/AccountFundFullPage.tsx b/src/components/account/AccountFund/AccountFundFullPage.tsx
similarity index 78%
rename from src/components/Account/AccountFund/AccountFundFullPage.tsx
rename to src/components/account/AccountFund/AccountFundFullPage.tsx
index 4abcf655..cd5e7f61 100644
--- a/src/components/Account/AccountFund/AccountFundFullPage.tsx
+++ b/src/components/account/AccountFund/AccountFundFullPage.tsx
@@ -1,12 +1,12 @@
 import { useEffect, useState } from 'react'
 
-import AccountFundContent from 'components/Account/AccountFund/AccountFundContent'
-import Card from 'components/Card'
-import { CircularProgress } from 'components/CircularProgress'
-import FullOverlayContent from 'components/FullOverlayContent'
+import AccountFundContent from 'components/account/AccountFund/AccountFundContent'
+import Card from 'components/common/Card'
+import { CircularProgress } from 'components/common/CircularProgress'
+import FullOverlayContent from 'components/common/FullOverlayContent'
+import useAccounts from 'hooks/accounts/useAccounts'
+import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
 import useAccountId from 'hooks/useAccountId'
-import useAccounts from 'hooks/useAccounts'
-import useCurrentAccount from 'hooks/useCurrentAccount'
 import useStore from 'store'
 
 export default function AccountFundFullPage() {
diff --git a/src/components/account/AccountFund/AccountFundRow.tsx b/src/components/account/AccountFund/AccountFundRow.tsx
new file mode 100644
index 00000000..a5a37a26
--- /dev/null
+++ b/src/components/account/AccountFund/AccountFundRow.tsx
@@ -0,0 +1,34 @@
+import TokenInputWithSlider from 'components/common/TokenInput/TokenInputWithSlider'
+import { BN_ZERO } from 'constants/math'
+import useAsset from 'hooks/assets/useAsset'
+import { BNCoin } from 'types/classes/BNCoin'
+import { byDenom } from 'utils/array'
+
+interface Props {
+  amount: BigNumber
+  balances: BNCoin[]
+  denom: string
+  isConfirming: boolean
+  updateFundingAssets: (amount: BigNumber, denom: string) => void
+}
+
+export default function AccountFundRow(props: Props) {
+  const asset = useAsset(props.denom)
+
+  if (!asset) return null
+
+  const balance = props.balances.find(byDenom(props.denom))?.amount ?? BN_ZERO
+
+  return (
+    <TokenInputWithSlider
+      asset={asset}
+      onChange={(amount) => props.updateFundingAssets(amount, asset.denom)}
+      amount={props.amount}
+      max={balance}
+      balances={props.balances}
+      maxText='Max'
+      disabled={props.isConfirming}
+      warningMessages={[]}
+    />
+  )
+}
diff --git a/src/components/Account/AccountList/AccountStats.tsx b/src/components/account/AccountList/AccountStats.tsx
similarity index 86%
rename from src/components/Account/AccountList/AccountStats.tsx
rename to src/components/account/AccountList/AccountStats.tsx
index bdf09a8c..4cc73228 100644
--- a/src/components/Account/AccountList/AccountStats.tsx
+++ b/src/components/account/AccountList/AccountStats.tsx
@@ -1,11 +1,12 @@
 import { useCallback, useMemo } from 'react'
 
-import AccountFundFullPage from 'components/Account/AccountFund/AccountFundFullPage'
-import Skeleton from 'components/Account/AccountList/Skeleton'
-import Button from 'components/Button'
-import { ArrowDownLine, ArrowUpLine, TrashBin } from 'components/Icons'
-import SwitchAutoLend from 'components/Switch/SwitchAutoLend'
-import useAccount from 'hooks/useAccount'
+import AccountFundFullPage from 'components/account/AccountFund/AccountFundFullPage'
+import Skeleton from 'components/account/AccountList/Skeleton'
+import Button from 'components/common/Button'
+import { ArrowDownLine, ArrowUpLine, TrashBin } from 'components/common/Icons'
+import SwitchAutoLend from 'components/common/Switch/SwitchAutoLend'
+import useAccount from 'hooks/accounts/useAccount'
+import useAllAssets from 'hooks/assets/useAllAssets'
 import useBorrowMarketAssetsTableData from 'hooks/useBorrowMarketAssetsTableData'
 import useHealthComputer from 'hooks/useHealthComputer'
 import useHLSStakingAssets from 'hooks/useHLSStakingAssets'
@@ -22,16 +23,17 @@ interface Props {
 
 export default function AccountStats(props: Props) {
   const { accountId, isActive, setShowMenu } = props
+  const assets = useAllAssets()
   const { data: account } = useAccount(accountId)
   const { data: prices } = usePrices()
   const { data: hlsStrategies } = useHLSStakingAssets()
 
   const positionBalance = useMemo(
-    () => (!account ? null : calculateAccountBalanceValue(account, prices)),
-    [account, prices],
+    () => (!account ? null : calculateAccountBalanceValue(account, prices, assets)),
+    [account, assets, prices],
   )
   const { health, healthFactor } = useHealthComputer(account)
-  const { data } = useBorrowMarketAssetsTableData(false)
+  const data = useBorrowMarketAssetsTableData()
   const borrowAssetsData = useMemo(() => data?.allAssets || [], [data])
   const { availableAssets: lendingAvailableAssets, accountLentAssets } =
     useLendingMarketAssetsTableData()
@@ -49,9 +51,10 @@ export default function AccountStats(props: Props) {
             lendingAssetsData,
             prices,
             hlsStrategies,
+            assets,
             account.kind === 'high_levered_strategy',
           ),
-    [account, borrowAssetsData, hlsStrategies, lendingAssetsData, prices],
+    [account, assets, borrowAssetsData, hlsStrategies, lendingAssetsData, prices],
   )
 
   const deleteAccountHandler = useCallback(() => {
diff --git a/src/components/Account/AccountList/Skeleton.tsx b/src/components/account/AccountList/Skeleton.tsx
similarity index 79%
rename from src/components/Account/AccountList/Skeleton.tsx
rename to src/components/account/AccountList/Skeleton.tsx
index 57caef23..9cdae6e6 100644
--- a/src/components/Account/AccountList/Skeleton.tsx
+++ b/src/components/account/AccountList/Skeleton.tsx
@@ -1,10 +1,10 @@
-import HealthBar from 'components/Account/Health/HealthBar'
-import HealthIcon from 'components/Account/Health/HealthIcon'
-import DisplayCurrency from 'components/DisplayCurrency'
-import { FormattedNumber } from 'components/FormattedNumber'
-import { ArrowChartLineUp } from 'components/Icons'
-import Loading from 'components/Loading'
-import Text from 'components/Text'
+import HealthBar from 'components/account/Health/HealthBar'
+import HealthIcon from 'components/account/Health/HealthIcon'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import { ArrowChartLineUp } from 'components/common/Icons'
+import Loading from 'components/common/Loading'
+import Text from 'components/common/Text'
 import { ORACLE_DENOM } from 'constants/oracle'
 import { BNCoin } from 'types/classes/BNCoin'
 
diff --git a/src/components/Account/AccountList/index.tsx b/src/components/account/AccountList/index.tsx
similarity index 91%
rename from src/components/Account/AccountList/index.tsx
rename to src/components/account/AccountList/index.tsx
index a60cc5c4..65bad2a0 100644
--- a/src/components/Account/AccountList/index.tsx
+++ b/src/components/account/AccountList/index.tsx
@@ -2,12 +2,12 @@ import classNames from 'classnames'
 import { useEffect } from 'react'
 import { useLocation, useNavigate, useSearchParams } from 'react-router-dom'
 
-import AccountStats from 'components/Account/AccountList/AccountStats'
-import Card from 'components/Card'
-import Radio from 'components/Radio'
-import Text from 'components/Text'
+import AccountStats from 'components/account/AccountList/AccountStats'
+import Card from 'components/common/Card'
+import Radio from 'components/common/Radio'
+import Text from 'components/common/Text'
+import useAccountIds from 'hooks/accounts/useAccountIds'
 import useAccountId from 'hooks/useAccountId'
-import useAccountIds from 'hooks/useAccountIds'
 import useStore from 'store'
 import { getPage, getRoute } from 'utils/route'
 
diff --git a/src/components/Account/AccountMenu.tsx b/src/components/account/AccountMenu.tsx
similarity index 73%
rename from src/components/Account/AccountMenu.tsx
rename to src/components/account/AccountMenu.tsx
index 91bb2b0c..5495fae9 100644
--- a/src/components/Account/AccountMenu.tsx
+++ b/src/components/account/AccountMenu.tsx
@@ -1,8 +1,8 @@
 import { Suspense } from 'react'
 
-import AccountMenuContent from 'components/Account/AccountMenuContent'
-import Loading from 'components/Loading'
-import useAccountIds from 'hooks/useAccountIds'
+import AccountMenuContent from 'components/account/AccountMenuContent'
+import Loading from 'components/common/Loading'
+import useAccountIds from 'hooks/accounts/useAccountIds'
 import useStore from 'store'
 
 function Content() {
diff --git a/src/components/Account/AccountMenuContent.tsx b/src/components/account/AccountMenuContent.tsx
similarity index 84%
rename from src/components/Account/AccountMenuContent.tsx
rename to src/components/account/AccountMenuContent.tsx
index 8265ef55..3bf03670 100644
--- a/src/components/Account/AccountMenuContent.tsx
+++ b/src/components/account/AccountMenuContent.tsx
@@ -2,21 +2,20 @@ import classNames from 'classnames'
 import { useCallback } from 'react'
 import { useLocation, useNavigate, useSearchParams } from 'react-router-dom'
 
-import AccountCreateFirst from 'components/Account/AccountCreateFirst'
-import AccountFund from 'components/Account/AccountFund/AccountFundFullPage'
-import AccountList from 'components/Account/AccountList'
-import Button from 'components/Button'
-import { Account, Plus, PlusCircled } from 'components/Icons'
-import Overlay from 'components/Overlay'
-import Text from 'components/Text'
+import AccountCreateFirst from 'components/account/AccountCreateFirst'
+import AccountFund from 'components/account/AccountFund/AccountFundFullPage'
+import AccountList from 'components/account/AccountList'
+import Button from 'components/common/Button'
+import { Account, Plus, PlusCircled } from 'components/common/Icons'
+import Overlay from 'components/common/Overlay'
+import Text from 'components/common/Text'
 import WalletBridges from 'components/Wallet/WalletBridges'
-import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
-import { LocalStorageKeys } from 'constants/localStorageKeys'
+import useAccountIds from 'hooks/accounts/useAccountIds'
+import useBaseAsset from 'hooks/assets/useBasetAsset'
+import useEnableAutoLendGlobal from 'hooks/localStorage/useEnableAutoLendGlobal'
 import useAccountId from 'hooks/useAccountId'
-import useAccountIds from 'hooks/useAccountIds'
 import useAutoLend from 'hooks/useAutoLend'
 import useCurrentWalletBalance from 'hooks/useCurrentWalletBalance'
-import useLocalStorage from 'hooks/useLocalStorage'
 import useToggle from 'hooks/useToggle'
 import useStore from 'store'
 import { defaultFee } from 'utils/constants'
@@ -36,14 +35,11 @@ export default function AccountMenuContent() {
   const [searchParams] = useSearchParams()
 
   const createAccount = useStore((s) => s.createAccount)
-  const baseCurrency = useStore((s) => s.baseCurrency)
+  const baseAsset = useBaseAsset()
   const [showMenu, setShowMenu] = useToggle()
   const [isCreating, setIsCreating] = useToggle()
-  const transactionFeeCoinBalance = useCurrentWalletBalance(baseCurrency.denom)
-  const [lendAssets] = useLocalStorage<boolean>(
-    LocalStorageKeys.LEND_ASSETS,
-    DEFAULT_SETTINGS.lendAssets,
-  )
+  const transactionFeeCoinBalance = useCurrentWalletBalance(baseAsset.denom)
+  const [enableAutoLendGlobal] = useEnableAutoLendGlobal()
   const { enableAutoLendAccountId } = useAutoLend()
 
   const hasCreditAccounts = !!accountIds?.length
@@ -65,7 +61,7 @@ export default function AccountMenuContent() {
 
     if (accountId) {
       navigate(getRoute(getPage(pathname), searchParams, address, accountId))
-      if (lendAssets) enableAutoLendAccountId(accountId)
+      if (enableAutoLendGlobal) enableAutoLendAccountId(accountId)
       useStore.setState({
         focusComponent: {
           component: <AccountFund />,
@@ -83,7 +79,7 @@ export default function AccountMenuContent() {
     pathname,
     searchParams,
     address,
-    lendAssets,
+    enableAutoLendGlobal,
     enableAutoLendAccountId,
   ])
 
diff --git a/src/components/account/AccountPerpPositionTable/Columns/Asset.tsx b/src/components/account/AccountPerpPositionTable/Columns/Asset.tsx
new file mode 100644
index 00000000..4294f544
--- /dev/null
+++ b/src/components/account/AccountPerpPositionTable/Columns/Asset.tsx
@@ -0,0 +1,71 @@
+import { ReactNode } from 'react'
+
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Text from 'components/common/Text'
+import { Tooltip } from 'components/common/Tooltip'
+import TradeDirection from 'components/perps/BalancesTable/Columns/TradeDirection'
+import { BN_ZERO } from 'constants/math'
+import usePerpsEnabledAssets from 'hooks/assets/usePerpsEnabledAssets'
+import { BNCoin } from 'types/classes/BNCoin'
+import { demagnify } from 'utils/formatters'
+export const ASSET_META = { accessorKey: 'symbol', header: 'Asset', id: 'symbol' }
+
+interface Props {
+  row: AccountPerpRow
+}
+
+function LabelAndValue(props: { label: string; children: ReactNode; className?: string }) {
+  const { label, children, className } = props
+
+  return (
+    <div className='flex items-center justify-between'>
+      <Text size='sm' className='text-white/60'>
+        {label}
+      </Text>
+      {children}
+    </div>
+  )
+}
+
+function TooltipContent(props: Props) {
+  const { row } = props
+  const assets = usePerpsEnabledAssets()
+  const asset = assets.find((asset) => asset.symbol === row.symbol)
+  if (!asset) return null
+
+  return (
+    <div className='flex flex-col flex-wrap gap-1 w-50'>
+      <LabelAndValue label='Entry Price'>
+        <FormattedNumber amount={row.entryPrice.toNumber()} options={{ prefix: '$' }} />
+      </LabelAndValue>
+      <LabelAndValue label='Size'>
+        <Text size='sm'>{demagnify(row.amount, asset)}</Text>
+      </LabelAndValue>
+      <LabelAndValue label='Realized PnL'>
+        <DisplayCurrency
+          className='text-sm text-right number'
+          coin={BNCoin.fromDenomAndBigNumber('usd', BN_ZERO)}
+          showZero
+        />
+      </LabelAndValue>
+      <LabelAndValue label='Unrealized PnL'>
+        <DisplayCurrency coin={row.pnl} options={{ abbreviated: false }} showZero isProfitOrLoss />
+      </LabelAndValue>
+    </div>
+  )
+}
+
+export default function Asset(props: Props) {
+  const { row } = props
+  return (
+    <Tooltip content={<TooltipContent row={row} />} type='info'>
+      <Text size='xs' className='flex items-center gap-1 no-wrap group/asset hover:cursor-help'>
+        <span className='pb-[1px] border-b border-white/20 border-dashed group-hover/asset:border-transparent'>
+          {row.symbol}
+        </span>
+        <TradeDirection tradeDirection={row.tradeDirection} />
+      </Text>
+    </Tooltip>
+  )
+}
diff --git a/src/components/account/AccountPerpPositionTable/Columns/TotalPnL.tsx b/src/components/account/AccountPerpPositionTable/Columns/TotalPnL.tsx
new file mode 100644
index 00000000..10632fd9
--- /dev/null
+++ b/src/components/account/AccountPerpPositionTable/Columns/TotalPnL.tsx
@@ -0,0 +1,22 @@
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import { BNCoin } from 'types/classes/BNCoin'
+
+export const PNL_META = { id: 'pnl', header: 'Total PnL', meta: { className: 'w-30' } }
+
+interface Props {
+  pnl: BNCoin
+}
+
+export default function TotalPnL(props: Props) {
+  const { pnl } = props
+
+  return (
+    <DisplayCurrency
+      className='text-xs text-right number'
+      coin={pnl}
+      options={{ abbreviated: false }}
+      isProfitOrLoss
+      showZero
+    />
+  )
+}
diff --git a/src/components/account/AccountPerpPositionTable/Columns/useAccountPerpsColumns.tsx b/src/components/account/AccountPerpPositionTable/Columns/useAccountPerpsColumns.tsx
new file mode 100644
index 00000000..ad409f4f
--- /dev/null
+++ b/src/components/account/AccountPerpPositionTable/Columns/useAccountPerpsColumns.tsx
@@ -0,0 +1,52 @@
+import { ColumnDef } from '@tanstack/react-table'
+import { useMemo } from 'react'
+
+import LiqPrice, { LIQ_META } from 'components/account/AccountBalancesTable/Columns/LiqPrice'
+import Value, {
+  VALUE_META,
+  valuePerpSortingFn,
+} from 'components/account/AccountBalancesTable/Columns/Value'
+import Asset, { ASSET_META } from 'components/account/AccountPerpPositionTable/Columns/Asset'
+import TotalPnL, { PNL_META } from 'components/account/AccountPerpPositionTable/Columns/TotalPnL'
+import useHealthComputer from 'hooks/useHealthComputer'
+import useStore from 'store'
+
+export default function useAccountPerpsColumns(account: Account, showLiquidationPrice?: boolean) {
+  const updatedAccount = useStore((s) => s.updatedAccount)
+
+  const { computeLiquidationPrice } = useHealthComputer(updatedAccount ?? account)
+
+  return useMemo<ColumnDef<AccountPerpRow>[]>(() => {
+    return [
+      {
+        ...ASSET_META,
+        cell: ({ row }) => <Asset row={row.original} />,
+      },
+      {
+        ...VALUE_META,
+        cell: ({ row }) => (
+          <Value amountChange={row.original.amountChange} value={row.original.value} type='perp' />
+        ),
+        sortingFn: valuePerpSortingFn,
+      },
+      {
+        ...LIQ_META,
+        header: 'Liq. Price',
+        enableSorting: false,
+        cell: ({ row }) => (
+          <LiqPrice
+            denom={row.original.denom}
+            computeLiquidationPrice={computeLiquidationPrice}
+            type='perp'
+            amount={row.original.amount.toNumber()}
+            account={updatedAccount ?? account}
+          />
+        ),
+      },
+      {
+        ...PNL_META,
+        cell: ({ row }) => <TotalPnL pnl={row.original.pnl} />,
+      },
+    ]
+  }, [computeLiquidationPrice, account, updatedAccount])
+}
diff --git a/src/components/account/AccountPerpPositionTable/functions.ts b/src/components/account/AccountPerpPositionTable/functions.ts
new file mode 100644
index 00000000..bd34577c
--- /dev/null
+++ b/src/components/account/AccountPerpPositionTable/functions.ts
@@ -0,0 +1,20 @@
+import { BNCoin } from 'types/classes/BNCoin'
+import { getCoinValue } from 'utils/formatters'
+
+export function getAssetAccountPerpRow(
+  asset: Asset,
+  prices: BNCoin[],
+  position: PerpsPosition,
+  assets: Asset[],
+  prev?: BNCoin,
+): AccountPerpRow {
+  const { denom, amount } = position
+  const amountChange = !prev ? position.amount : position.amount.minus(prev.amount)
+
+  return {
+    symbol: asset.symbol,
+    value: getCoinValue(BNCoin.fromDenomAndBigNumber(denom, amount), prices, assets).toString(),
+    amountChange,
+    ...position,
+  }
+}
diff --git a/src/components/account/AccountPerpPositionTable/index.tsx b/src/components/account/AccountPerpPositionTable/index.tsx
new file mode 100644
index 00000000..6cbffd34
--- /dev/null
+++ b/src/components/account/AccountPerpPositionTable/index.tsx
@@ -0,0 +1,37 @@
+import classNames from 'classnames'
+
+import useAccountPerpsColumns from 'components/account/AccountPerpPositionTable/Columns/useAccountPerpsColumns'
+import useAccountPerpData from 'components/account/AccountPerpPositionTable/useAccountPerpData'
+import Table from 'components/common/Table'
+import useStore from 'store'
+
+interface Props {
+  account: Account
+  tableBodyClassName?: string
+  showLiquidationPrice?: boolean
+  hideCard?: boolean
+}
+
+export default function AccountPerpPositionTable(props: Props) {
+  const { account, tableBodyClassName, showLiquidationPrice, hideCard } = props
+  const updatedAccount = useStore((s) => s.updatedAccount)
+  const accountPerpData = useAccountPerpData({
+    account,
+    updatedAccount,
+  })
+
+  const columns = useAccountPerpsColumns(account, showLiquidationPrice)
+
+  return (
+    <Table
+      title='Perp Positions'
+      columns={columns}
+      data={accountPerpData}
+      tableBodyClassName={classNames(tableBodyClassName, 'text-white/60')}
+      initialSorting={[]}
+      spacingClassName='p-2'
+      hideCard={hideCard}
+      type='perps'
+    />
+  )
+}
diff --git a/src/components/account/AccountPerpPositionTable/useAccountPerpData.tsx b/src/components/account/AccountPerpPositionTable/useAccountPerpData.tsx
new file mode 100644
index 00000000..5ace49e5
--- /dev/null
+++ b/src/components/account/AccountPerpPositionTable/useAccountPerpData.tsx
@@ -0,0 +1,30 @@
+import { useMemo } from 'react'
+
+import { getAssetAccountPerpRow } from 'components/account/AccountPerpPositionTable/functions'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import usePrices from 'hooks/usePrices'
+import { byDenom } from 'utils/array'
+
+interface Props {
+  account: Account
+  updatedAccount?: Account
+}
+
+export default function useAccountPerpData(props: Props) {
+  const { account, updatedAccount } = props
+  const { data: prices } = usePrices()
+  const assets = useAllAssets()
+
+  return useMemo<AccountPerpRow[]>(() => {
+    const usedAccount = updatedAccount ?? account
+    const accountPerps = usedAccount?.perps ?? []
+
+    return accountPerps.map((perp) => {
+      const asset = assets.find(byDenom(perp.denom)) ?? assets[0]
+      const prevPerp = updatedAccount
+        ? account?.perps.find((position) => position.denom === perp.denom)
+        : perp
+      return getAssetAccountPerpRow(asset, prices, perp, assets, prevPerp)
+    })
+  }, [updatedAccount, account, prices, assets])
+}
diff --git a/src/components/Account/AccountSummary.tsx b/src/components/account/AccountSummary.tsx
similarity index 63%
rename from src/components/Account/AccountSummary.tsx
rename to src/components/account/AccountSummary.tsx
index ffd61f1a..38e39a58 100644
--- a/src/components/Account/AccountSummary.tsx
+++ b/src/components/account/AccountSummary.tsx
@@ -1,23 +1,25 @@
 import classNames from 'classnames'
 import { HTMLAttributes, useCallback, useMemo } from 'react'
 
-import Accordion from 'components/Accordion'
-import AccountBalancesTable from 'components/Account/AccountBalancesTable'
-import AccountComposition from 'components/Account/AccountComposition'
-import HealthBar from 'components/Account/Health/HealthBar'
-import Card from 'components/Card'
-import DisplayCurrency from 'components/DisplayCurrency'
-import { FormattedNumber } from 'components/FormattedNumber'
-import { ArrowRight } from 'components/Icons'
-import Text from 'components/Text'
+import AccountBalancesTable from 'components/account/AccountBalancesTable'
+import AccountComposition from 'components/account/AccountComposition'
+import AccountPerpPositionTable from 'components/account/AccountPerpPositionTable'
+import HealthBar from 'components/account/Health/HealthBar'
+import Accordion from 'components/common/Accordion'
+import Card from 'components/common/Card'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import { ArrowRight } from 'components/common/Icons'
+import Text from 'components/common/Text'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
 import { BN_ZERO } from 'constants/math'
 import { ORACLE_DENOM } from 'constants/oracle'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import useBorrowMarketAssetsTableData from 'hooks/useBorrowMarketAssetsTableData'
 import useHealthComputer from 'hooks/useHealthComputer'
 import useLendingMarketAssetsTableData from 'hooks/useLendingMarketAssetsTableData'
-import useLocalStorage from 'hooks/useLocalStorage'
 import usePrices from 'hooks/usePrices'
 import useStore from 'store'
 import { BNCoin } from 'types/classes/BNCoin'
@@ -34,15 +36,17 @@ export default function AccountSummary(props: Props) {
     DEFAULT_SETTINGS.accountSummaryTabs,
   )
   const { data: prices } = usePrices()
+  const assets = useAllAssets()
   const updatedAccount = useStore((s) => s.updatedAccount)
+  const chainConfig = useStore((s) => s.chainConfig)
   const accountBalance = useMemo(
     () =>
       props.account
-        ? calculateAccountBalanceValue(updatedAccount ?? props.account, prices)
+        ? calculateAccountBalanceValue(updatedAccount ?? props.account, prices, assets)
         : BN_ZERO,
-    [props.account, updatedAccount, prices],
+    [props.account, updatedAccount, prices, assets],
   )
-  const { data } = useBorrowMarketAssetsTableData(false)
+  const data = useBorrowMarketAssetsTableData()
   const borrowAssetsData = useMemo(() => data?.allAssets || [], [data])
   const { availableAssets: lendingAvailableAssets, accountLentAssets } =
     useLendingMarketAssetsTableData()
@@ -55,16 +59,16 @@ export default function AccountSummary(props: Props) {
   const { health: updatedHealth, healthFactor: updatedHealthFactor } =
     useHealthComputer(updatedAccount)
   const leverage = useMemo(
-    () => (props.account ? calculateAccountLeverage(props.account, prices) : BN_ZERO),
-    [props.account, prices],
+    () => (props.account ? calculateAccountLeverage(props.account, prices, assets) : BN_ZERO),
+    [props.account, prices, assets],
   )
   const updatedLeverage = useMemo(() => {
     if (!updatedAccount) return null
-    const updatedLeverage = calculateAccountLeverage(updatedAccount, prices)
+    const updatedLeverage = calculateAccountLeverage(updatedAccount, prices, assets)
 
     if (updatedLeverage.eq(leverage)) return null
     return updatedLeverage
-  }, [updatedAccount, prices, leverage])
+  }, [updatedAccount, prices, assets, leverage])
 
   const handleToggle = useCallback(
     (index: number) => {
@@ -73,6 +77,56 @@ export default function AccountSummary(props: Props) {
     [accountSummaryTabs, setAccountSummaryTabs],
   )
 
+  const items = useMemo(() => {
+    const itemsArray = [
+      {
+        title: `Credit Account ${props.account.id} Composition`,
+        renderContent: () =>
+          props.account ? <AccountComposition account={props.account} isHls={props.isHls} /> : null,
+        isOpen: accountSummaryTabs[0],
+        toggleOpen: (index: number) => handleToggle(index),
+        renderSubTitle: () => <></>,
+      },
+      {
+        title: 'Balances',
+        renderContent: () =>
+          props.account ? (
+            <AccountBalancesTable
+              account={props.account}
+              borrowingData={borrowAssetsData}
+              lendingData={lendingAssetsData}
+              hideCard
+              isHls={props.isHls}
+            />
+          ) : null,
+        isOpen: accountSummaryTabs[1],
+        toggleOpen: (index: number) => handleToggle(index),
+        renderSubTitle: () => <></>,
+      },
+    ]
+    if (chainConfig.perps)
+      itemsArray.push({
+        title: 'Perp Positions',
+        renderContent: () =>
+          props.account && props.account.perps.length > 0 ? (
+            <AccountPerpPositionTable account={props.account} hideCard />
+          ) : null,
+        isOpen: accountSummaryTabs[2] ?? false,
+        toggleOpen: (index: number) => handleToggle(index),
+        renderSubTitle: () => <></>,
+      })
+
+    return itemsArray
+  }, [
+    props.account,
+    borrowAssetsData,
+    lendingAssetsData,
+    props.isHls,
+    chainConfig.perps,
+    handleToggle,
+    accountSummaryTabs,
+  ])
+
   if (!props.account) return null
   return (
     <div className='h-[546px] max-w-screen overflow-y-scroll scrollbar-hide w-93.5'>
@@ -120,37 +174,7 @@ export default function AccountSummary(props: Props) {
           />
         </Item>
       </Card>
-      <Accordion
-        items={[
-          {
-            title: `Credit Account ${props.account.id} Composition`,
-            renderContent: () =>
-              props.account ? (
-                <AccountComposition account={props.account} isHls={props.isHls} />
-              ) : null,
-            isOpen: accountSummaryTabs[0],
-            toggleOpen: (index: number) => handleToggle(index),
-            renderSubTitle: () => <></>,
-          },
-          {
-            title: 'Balances',
-            renderContent: () =>
-              props.account ? (
-                <AccountBalancesTable
-                  account={props.account}
-                  borrowingData={borrowAssetsData}
-                  lendingData={lendingAssetsData}
-                  hideCard
-                  isHls={props.isHls}
-                />
-              ) : null,
-            isOpen: accountSummaryTabs[1],
-            toggleOpen: (index: number) => handleToggle(index),
-            renderSubTitle: () => <></>,
-          },
-        ]}
-        allowMultipleOpen
-      />
+      <Accordion items={items} allowMultipleOpen />
     </div>
   )
 }
diff --git a/src/components/Account/CurrentAccountSummary.tsx b/src/components/account/CurrentAccountSummary.tsx
similarity index 58%
rename from src/components/Account/CurrentAccountSummary.tsx
rename to src/components/account/CurrentAccountSummary.tsx
index 6bab7c22..0601eaa3 100644
--- a/src/components/Account/CurrentAccountSummary.tsx
+++ b/src/components/account/CurrentAccountSummary.tsx
@@ -1,5 +1,5 @@
-import AccountSummary from 'components/Account/AccountSummary'
-import useCurrentAccount from 'hooks/useCurrentAccount'
+import AccountSummary from 'components/account/AccountSummary'
+import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
 
 function CurrentAccountSummary() {
   const account = useCurrentAccount()
diff --git a/src/components/Account/Health/HealthBar.tsx b/src/components/account/Health/HealthBar.tsx
similarity index 97%
rename from src/components/Account/Health/HealthBar.tsx
rename to src/components/account/Health/HealthBar.tsx
index c87600d1..d0a186d3 100644
--- a/src/components/Account/Health/HealthBar.tsx
+++ b/src/components/account/Health/HealthBar.tsx
@@ -1,12 +1,12 @@
 import classNames from 'classnames'
 import { useMemo } from 'react'
 
-import HealthIcon from 'components/Account/Health/HealthIcon'
-import HealthTooltip from 'components/Account/Health/HealthTooltip'
+import HealthIcon from 'components/account/Health/HealthIcon'
+import HealthTooltip from 'components/account/Health/HealthTooltip'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import useHealthColor from 'hooks/useHealthColor'
-import useLocalStorage from 'hooks/useLocalStorage'
 import { getHealthIndicatorColors } from 'utils/healthIndicator'
 
 interface Props {
diff --git a/src/components/Account/Health/HealthGauge.tsx b/src/components/account/Health/HealthGauge.tsx
similarity index 98%
rename from src/components/Account/Health/HealthGauge.tsx
rename to src/components/account/Health/HealthGauge.tsx
index 4261496d..dcbee855 100644
--- a/src/components/Account/Health/HealthGauge.tsx
+++ b/src/components/account/Health/HealthGauge.tsx
@@ -1,12 +1,12 @@
 import classNames from 'classnames'
 import { useMemo } from 'react'
 
-import HealthIcon from 'components/Account/Health/HealthIcon'
-import HealthTooltip from 'components/Account/Health/HealthTooltip'
+import HealthIcon from 'components/account/Health/HealthIcon'
+import HealthTooltip from 'components/account/Health/HealthTooltip'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import useHealthColorAndLabel from 'hooks/useHealthColor'
-import useLocalStorage from 'hooks/useLocalStorage'
 import { computeHealthGaugePercentage } from 'utils/accounts'
 import { getHealthIndicatorColors } from 'utils/healthIndicator'
 
diff --git a/src/components/Account/Health/HealthIcon.tsx b/src/components/account/Health/HealthIcon.tsx
similarity index 90%
rename from src/components/Account/Health/HealthIcon.tsx
rename to src/components/account/Health/HealthIcon.tsx
index 0a6e6631..858cb0bf 100644
--- a/src/components/Account/Health/HealthIcon.tsx
+++ b/src/components/account/Health/HealthIcon.tsx
@@ -1,6 +1,6 @@
 import classNames from 'classnames'
 
-import { ExclamationMarkCircled, Heart } from 'components/Icons'
+import { ExclamationMarkCircled, Heart } from 'components/common/Icons'
 
 interface Props {
   isLoading: boolean
diff --git a/src/components/Account/Health/HealthTooltip.tsx b/src/components/account/Health/HealthTooltip.tsx
similarity index 89%
rename from src/components/Account/Health/HealthTooltip.tsx
rename to src/components/account/Health/HealthTooltip.tsx
index 14a84dff..6328f941 100644
--- a/src/components/Account/Health/HealthTooltip.tsx
+++ b/src/components/account/Health/HealthTooltip.tsx
@@ -1,8 +1,8 @@
-import React, { ReactElement, useMemo } from 'react'
+import { ReactElement, useMemo } from 'react'
 
-import { CircularProgress } from 'components/CircularProgress'
-import Text from 'components/Text'
-import { Tooltip } from 'components/Tooltip'
+import { CircularProgress } from 'components/common/CircularProgress'
+import Text from 'components/common/Text'
+import { Tooltip } from 'components/common/Tooltip'
 import { BN } from 'utils/helpers'
 
 interface Props {
diff --git a/src/components/Account/RiskChart.tsx b/src/components/account/RiskChart.tsx
similarity index 94%
rename from src/components/Account/RiskChart.tsx
rename to src/components/account/RiskChart.tsx
index 21e5d2c0..08bd53bf 100644
--- a/src/components/Account/RiskChart.tsx
+++ b/src/components/account/RiskChart.tsx
@@ -9,12 +9,12 @@ import {
   YAxis,
 } from 'recharts'
 
-import { FormattedNumber } from 'components/FormattedNumber'
-import Text from 'components/Text'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Text from 'components/common/Text'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
 import { BN_ZERO } from 'constants/math'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import { formatValue } from 'utils/formatters'
 
 export const RiskChart = ({ data }: RiskChartProps) => {
diff --git a/src/components/Borrow/BorrowActionButtons.tsx b/src/components/borrow/BorrowActionButtons.tsx
similarity index 79%
rename from src/components/Borrow/BorrowActionButtons.tsx
rename to src/components/borrow/BorrowActionButtons.tsx
index 5d7c0c25..51ec2a5e 100644
--- a/src/components/Borrow/BorrowActionButtons.tsx
+++ b/src/components/borrow/BorrowActionButtons.tsx
@@ -1,10 +1,10 @@
 import { useCallback } from 'react'
 
-import Button from 'components/Button'
-import ActionButton from 'components/Button/ActionButton'
-import { HandCoins, Plus } from 'components/Icons'
+import Button from 'components/common/Button'
+import ActionButton from 'components/common/Button/ActionButton'
+import { HandCoins, Plus } from 'components/common/Icons'
+import useMarketEnabledAssets from 'hooks/assets/useMarketEnabledAssets'
 import useStore from 'store'
-import { getEnabledMarketAssets } from 'utils/assets'
 
 interface Props {
   data: BorrowMarketTableData
@@ -12,7 +12,7 @@ interface Props {
 
 export default function BorrowActionButtons(props: Props) {
   const { asset, debt } = props.data
-  const marketAssets = getEnabledMarketAssets()
+  const marketAssets = useMarketEnabledAssets()
   const currentAsset = marketAssets.find((a) => a.denom === asset.denom)
 
   const borrowHandler = useCallback(() => {
diff --git a/src/components/Borrow/BorrowIntro.tsx b/src/components/borrow/BorrowIntro.tsx
similarity index 88%
rename from src/components/Borrow/BorrowIntro.tsx
rename to src/components/borrow/BorrowIntro.tsx
index 6be0f92b..9bd808be 100644
--- a/src/components/Borrow/BorrowIntro.tsx
+++ b/src/components/borrow/BorrowIntro.tsx
@@ -1,4 +1,4 @@
-import Intro from 'components/Intro'
+import Intro from 'components/common/Intro'
 
 export default function BorrowIntro() {
   return (
diff --git a/src/components/Borrow/Borrowings.tsx b/src/components/borrow/Borrowings.tsx
similarity index 74%
rename from src/components/Borrow/Borrowings.tsx
rename to src/components/borrow/Borrowings.tsx
index 82535c55..9f896c3b 100644
--- a/src/components/Borrow/Borrowings.tsx
+++ b/src/components/borrow/Borrowings.tsx
@@ -1,11 +1,11 @@
-import AvailableBorrowingsTable from 'components/Borrow/Table/AvailableBorrowingsTable'
-import DepositedBorrowingsTable from 'components/Borrow/Table/DepositedBorrowingsTable'
+import AvailableBorrowingsTable from 'components/borrow/Table/AvailableBorrowingsTable'
+import DepositedBorrowingsTable from 'components/borrow/Table/DepositedBorrowingsTable'
 import { BN_ZERO } from 'constants/math'
+import useBorrowEnabledAssets from 'hooks/assets/useBorrowEnabledAssets'
 import useBorrowMarketAssetsTableData from 'hooks/useBorrowMarketAssetsTableData'
-import { getBorrowEnabledAssets } from 'utils/assets'
 
 export default function Borrowings() {
-  const { data } = useBorrowMarketAssetsTableData()
+  const data = useBorrowMarketAssetsTableData()
 
   if (!data?.allAssets?.length) {
     return <Fallback />
@@ -19,7 +19,7 @@ export default function Borrowings() {
 }
 
 function Fallback() {
-  const assets = getBorrowEnabledAssets()
+  const assets = useBorrowEnabledAssets()
   const data: BorrowMarketTableData[] = assets.map((asset) => ({
     asset,
     apy: {
diff --git a/src/components/Borrow/Table/AvailableBorrowingsTable.tsx b/src/components/borrow/Table/AvailableBorrowingsTable.tsx
similarity index 74%
rename from src/components/Borrow/Table/AvailableBorrowingsTable.tsx
rename to src/components/borrow/Table/AvailableBorrowingsTable.tsx
index 05d91c60..652baaeb 100644
--- a/src/components/Borrow/Table/AvailableBorrowingsTable.tsx
+++ b/src/components/borrow/Table/AvailableBorrowingsTable.tsx
@@ -2,12 +2,12 @@ import { Row } from '@tanstack/react-table'
 import { Table as TanstackTable } from '@tanstack/table-core/build/lib/types'
 import { useCallback } from 'react'
 
-import BorrowActionButtons from 'components/Borrow/BorrowActionButtons'
-import { NAME_META } from 'components/Borrow/Table/Columns/Name'
-import useAvailableColumns from 'components/Borrow/Table/Columns/useAvailableColumns'
-import MarketDetails from 'components/MarketDetails'
-import Table from 'components/Table'
-import ActionButtonRow from 'components/Table/ActionButtonRow'
+import BorrowActionButtons from 'components/borrow/BorrowActionButtons'
+import { NAME_META } from 'components/borrow/Table/Columns/Name'
+import useAvailableColumns from 'components/borrow/Table/Columns/useAvailableColumns'
+import MarketDetails from 'components/common/MarketDetails'
+import Table from 'components/common/Table'
+import ActionButtonRow from 'components/common/Table/ActionButtonRow'
 
 type Props = {
   data: BorrowMarketTableData[]
diff --git a/src/components/Borrow/Table/Columns/BorrowRate.tsx b/src/components/borrow/Table/Columns/BorrowRate.tsx
similarity index 80%
rename from src/components/Borrow/Table/Columns/BorrowRate.tsx
rename to src/components/borrow/Table/Columns/BorrowRate.tsx
index 9652c4e2..b0b88d50 100644
--- a/src/components/Borrow/Table/Columns/BorrowRate.tsx
+++ b/src/components/borrow/Table/Columns/BorrowRate.tsx
@@ -1,5 +1,5 @@
-import { FormattedNumber } from 'components/FormattedNumber'
-import Loading from 'components/Loading'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Loading from 'components/common/Loading'
 
 export const BORROW_RATE_META = {
   accessorKey: 'borrowRate',
diff --git a/src/components/Borrow/Table/Columns/Debt.tsx b/src/components/borrow/Table/Columns/Debt.tsx
similarity index 86%
rename from src/components/Borrow/Table/Columns/Debt.tsx
rename to src/components/borrow/Table/Columns/Debt.tsx
index 35ccf42b..ebf827b7 100644
--- a/src/components/Borrow/Table/Columns/Debt.tsx
+++ b/src/components/borrow/Table/Columns/Debt.tsx
@@ -1,9 +1,9 @@
 import { Row } from '@tanstack/react-table'
 
-import AmountAndValue from 'components/AmountAndValue'
+import AmountAndValue from 'components/common/AmountAndValue'
 import { BN_ZERO } from 'constants/math'
+import useMarketEnabledAssets from 'hooks/assets/useMarketEnabledAssets'
 import { byDenom } from 'utils/array'
-import { getEnabledMarketAssets } from 'utils/assets'
 
 export const DEBT_META = {
   accessorKey: 'debt',
@@ -33,7 +33,7 @@ interface Props {
 }
 
 export default function Debt(props: Props) {
-  const marketAssets = getEnabledMarketAssets()
+  const marketAssets = useMarketEnabledAssets()
   const asset = marketAssets.find(byDenom(props.data.asset.denom))
 
   if (!asset) return null
diff --git a/src/components/Borrow/Table/Columns/Liquidity.tsx b/src/components/borrow/Table/Columns/Liquidity.tsx
similarity index 76%
rename from src/components/Borrow/Table/Columns/Liquidity.tsx
rename to src/components/borrow/Table/Columns/Liquidity.tsx
index 0f057909..78353068 100644
--- a/src/components/Borrow/Table/Columns/Liquidity.tsx
+++ b/src/components/borrow/Table/Columns/Liquidity.tsx
@@ -1,10 +1,9 @@
 import { Row } from '@tanstack/react-table'
 
-import AmountAndValue from 'components/AmountAndValue'
-import Loading from 'components/Loading'
+import AmountAndValue from 'components/common/AmountAndValue'
+import Loading from 'components/common/Loading'
 import { BN_ZERO } from 'constants/math'
-import { byDenom } from 'utils/array'
-import { getEnabledMarketAssets } from 'utils/assets'
+import useAsset from 'hooks/assets/useAsset'
 import { demagnify } from 'utils/formatters'
 
 export const LIQUIDITY_META = {
@@ -32,8 +31,7 @@ interface Props {
 
 export default function Liquidity(props: Props) {
   const { liquidity, asset: borrowAsset } = props.data
-  const marketAssets = getEnabledMarketAssets()
-  const asset = marketAssets.find(byDenom(borrowAsset.denom))
+  const asset = useAsset(borrowAsset.denom)
 
   if (!asset) return null
 
diff --git a/src/components/Borrow/Table/Columns/Manage.tsx b/src/components/borrow/Table/Columns/Manage.tsx
similarity index 85%
rename from src/components/Borrow/Table/Columns/Manage.tsx
rename to src/components/borrow/Table/Columns/Manage.tsx
index 8af2ea79..f6515b14 100644
--- a/src/components/Borrow/Table/Columns/Manage.tsx
+++ b/src/components/borrow/Table/Columns/Manage.tsx
@@ -1,4 +1,4 @@
-import { ChevronDown, ChevronUp } from 'components/Icons'
+import { ChevronDown, ChevronUp } from 'components/common/Icons'
 
 export const MANAGE_META = {
   accessorKey: 'manage',
diff --git a/src/components/Borrow/Table/Columns/Name.tsx b/src/components/borrow/Table/Columns/Name.tsx
similarity index 77%
rename from src/components/Borrow/Table/Columns/Name.tsx
rename to src/components/borrow/Table/Columns/Name.tsx
index 352a61bb..6ec22845 100644
--- a/src/components/Borrow/Table/Columns/Name.tsx
+++ b/src/components/borrow/Table/Columns/Name.tsx
@@ -1,5 +1,5 @@
-import AssetImage from 'components/Asset/AssetImage'
-import TitleAndSubCell from 'components/TitleAndSubCell'
+import AssetImage from 'components/common/assets/AssetImage'
+import TitleAndSubCell from 'components/common/TitleAndSubCell'
 
 export const NAME_META = { accessorKey: 'asset.symbol', header: 'Asset', id: 'symbol' }
 
diff --git a/src/components/Borrow/Table/Columns/useAvailableColumns.tsx b/src/components/borrow/Table/Columns/useAvailableColumns.tsx
similarity index 76%
rename from src/components/Borrow/Table/Columns/useAvailableColumns.tsx
rename to src/components/borrow/Table/Columns/useAvailableColumns.tsx
index 72822f67..16eb04d1 100644
--- a/src/components/Borrow/Table/Columns/useAvailableColumns.tsx
+++ b/src/components/borrow/Table/Columns/useAvailableColumns.tsx
@@ -1,13 +1,13 @@
 import { ColumnDef } from '@tanstack/react-table'
 import { useMemo } from 'react'
 
-import BorrowRate, { BORROW_RATE_META } from 'components/Borrow/Table/Columns/BorrowRate'
+import BorrowRate, { BORROW_RATE_META } from 'components/borrow/Table/Columns/BorrowRate'
 import Liquidity, {
   LIQUIDITY_META,
   liquiditySortingFn,
-} from 'components/Borrow/Table/Columns/Liquidity'
-import Manage, { MANAGE_META } from 'components/Borrow/Table/Columns/Manage'
-import Name, { NAME_META } from 'components/Borrow/Table/Columns/Name'
+} from 'components/borrow/Table/Columns/Liquidity'
+import Manage, { MANAGE_META } from 'components/borrow/Table/Columns/Manage'
+import Name, { NAME_META } from 'components/borrow/Table/Columns/Name'
 
 export default function useAvailableColumns() {
   return useMemo<ColumnDef<BorrowMarketTableData>[]>(() => {
diff --git a/src/components/Borrow/Table/Columns/useDepositedColumns.tsx b/src/components/borrow/Table/Columns/useDepositedColumns.tsx
similarity index 75%
rename from src/components/Borrow/Table/Columns/useDepositedColumns.tsx
rename to src/components/borrow/Table/Columns/useDepositedColumns.tsx
index 1fe2e63b..fa657241 100644
--- a/src/components/Borrow/Table/Columns/useDepositedColumns.tsx
+++ b/src/components/borrow/Table/Columns/useDepositedColumns.tsx
@@ -1,14 +1,14 @@
 import { ColumnDef } from '@tanstack/react-table'
 import { useMemo } from 'react'
 
-import BorrowRate, { BORROW_RATE_META } from 'components/Borrow/Table/Columns/BorrowRate'
-import Debt, { DEBT_META, debtSortingFn } from 'components/Borrow/Table/Columns/Debt'
+import BorrowRate, { BORROW_RATE_META } from 'components/borrow/Table/Columns/BorrowRate'
+import Debt, { DEBT_META, debtSortingFn } from 'components/borrow/Table/Columns/Debt'
 import Liquidity, {
   LIQUIDITY_META,
   liquiditySortingFn,
-} from 'components/Borrow/Table/Columns/Liquidity'
-import Manage, { MANAGE_META } from 'components/Borrow/Table/Columns/Manage'
-import Name, { NAME_META } from 'components/Borrow/Table/Columns/Name'
+} from 'components/borrow/Table/Columns/Liquidity'
+import Manage, { MANAGE_META } from 'components/borrow/Table/Columns/Manage'
+import Name, { NAME_META } from 'components/borrow/Table/Columns/Name'
 
 export default function useDepositedColumns() {
   return useMemo<ColumnDef<BorrowMarketTableData>[]>(() => {
diff --git a/src/components/Borrow/Table/DepositedBorrowingsTable.tsx b/src/components/borrow/Table/DepositedBorrowingsTable.tsx
similarity index 70%
rename from src/components/Borrow/Table/DepositedBorrowingsTable.tsx
rename to src/components/borrow/Table/DepositedBorrowingsTable.tsx
index f37b4e31..85b6fa96 100644
--- a/src/components/Borrow/Table/DepositedBorrowingsTable.tsx
+++ b/src/components/borrow/Table/DepositedBorrowingsTable.tsx
@@ -1,12 +1,12 @@
 import { Row } from '@tanstack/react-table'
 import { useCallback } from 'react'
 
-import BorrowActionButtons from 'components/Borrow/BorrowActionButtons'
-import { NAME_META } from 'components/Borrow/Table/Columns/Name'
-import useDepositedColumns from 'components/Borrow/Table/Columns/useDepositedColumns'
-import MarketDetails from 'components/MarketDetails'
-import Table from 'components/Table'
-import ActionButtonRow from 'components/Table/ActionButtonRow'
+import BorrowActionButtons from 'components/borrow/BorrowActionButtons'
+import { NAME_META } from 'components/borrow/Table/Columns/Name'
+import useDepositedColumns from 'components/borrow/Table/Columns/useDepositedColumns'
+import MarketDetails from 'components/common/MarketDetails'
+import Table from 'components/common/Table'
+import ActionButtonRow from 'components/common/Table/ActionButtonRow'
 
 type Props = {
   data: BorrowMarketTableData[]
diff --git a/src/components/Accordion.tsx b/src/components/common/Accordion.tsx
similarity index 84%
rename from src/components/Accordion.tsx
rename to src/components/common/Accordion.tsx
index f358a925..78fcff17 100644
--- a/src/components/Accordion.tsx
+++ b/src/components/common/Accordion.tsx
@@ -1,7 +1,7 @@
 import classNames from 'classnames'
 
-import AccordionContent, { Item } from 'components/AccordionContent'
-import Card from 'components/Card'
+import AccordionContent, { Item } from 'components/common/AccordionContent'
+import Card from 'components/common/Card'
 
 interface Props {
   items: Item[]
diff --git a/src/components/AccordionContent.tsx b/src/components/common/AccordionContent.tsx
similarity index 91%
rename from src/components/AccordionContent.tsx
rename to src/components/common/AccordionContent.tsx
index d20afeff..42bf067a 100644
--- a/src/components/AccordionContent.tsx
+++ b/src/components/common/AccordionContent.tsx
@@ -1,7 +1,7 @@
 import classNames from 'classnames'
 
-import { ChevronDown, ChevronRight } from 'components/Icons'
-import Text from 'components/Text'
+import { ChevronDown, ChevronRight } from 'components/common/Icons'
+import Text from 'components/common/Text'
 
 interface Props {
   item: Item
diff --git a/src/components/AmountAndValue.tsx b/src/components/common/AmountAndValue.tsx
similarity index 88%
rename from src/components/AmountAndValue.tsx
rename to src/components/common/AmountAndValue.tsx
index d00c47c9..60f634fc 100644
--- a/src/components/AmountAndValue.tsx
+++ b/src/components/common/AmountAndValue.tsx
@@ -1,5 +1,5 @@
-import DisplayCurrency from 'components/DisplayCurrency'
-import { FormattedNumber } from 'components/FormattedNumber'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import { FormattedNumber } from 'components/common/FormattedNumber'
 import { MAX_AMOUNT_DECIMALS, MIN_AMOUNT } from 'constants/math'
 import { BNCoin } from 'types/classes/BNCoin'
 import { demagnify } from 'utils/formatters'
diff --git a/src/components/AvailableLiquidityMessage.tsx b/src/components/common/AvailableLiquidityMessage.tsx
similarity index 89%
rename from src/components/AvailableLiquidityMessage.tsx
rename to src/components/common/AvailableLiquidityMessage.tsx
index 6d57ab70..78c891e4 100644
--- a/src/components/AvailableLiquidityMessage.tsx
+++ b/src/components/common/AvailableLiquidityMessage.tsx
@@ -1,5 +1,5 @@
-import { FormattedNumber } from 'components/FormattedNumber'
-import Text from 'components/Text'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Text from 'components/common/Text'
 
 interface Props {
   availableLiquidity: BigNumber
diff --git a/src/components/Background.tsx b/src/components/common/Background.tsx
similarity index 97%
rename from src/components/Background.tsx
rename to src/components/common/Background.tsx
index d6db98d0..54ef2924 100644
--- a/src/components/Background.tsx
+++ b/src/components/common/Background.tsx
@@ -1,10 +1,10 @@
 import classNames from 'classnames'
-import { useLocation } from 'react-router-dom'
 import { useEffect, useMemo } from 'react'
+import { useLocation } from 'react-router-dom'
 
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import useStore from 'store'
 import { getPage } from 'utils/route'
 
diff --git a/src/components/BorrowCapacity.tsx b/src/components/common/BorrowCapacity.tsx
similarity index 95%
rename from src/components/BorrowCapacity.tsx
rename to src/components/common/BorrowCapacity.tsx
index 93f9c306..c715e50e 100644
--- a/src/components/BorrowCapacity.tsx
+++ b/src/components/common/BorrowCapacity.tsx
@@ -1,12 +1,12 @@
 import classNames from 'classnames'
 import { useEffect, useState } from 'react'
 
-import { FormattedNumber } from 'components/FormattedNumber'
-import Text from 'components/Text'
-import { Tooltip } from 'components/Tooltip'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Text from 'components/common/Text'
+import { Tooltip } from 'components/common/Tooltip'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 
 interface Props {
   balance: number
diff --git a/src/components/Button/ActionButton.tsx b/src/components/common/Button/ActionButton.tsx
similarity index 80%
rename from src/components/Button/ActionButton.tsx
rename to src/components/common/Button/ActionButton.tsx
index 4b240d7b..7cf580df 100644
--- a/src/components/Button/ActionButton.tsx
+++ b/src/components/common/Button/ActionButton.tsx
@@ -1,12 +1,12 @@
 import { useCallback } from 'react'
 
-import AccountCreateFirst from 'components/Account/AccountCreateFirst'
-import { ACCOUNT_MENU_BUTTON_ID } from 'components/Account/AccountMenuContent'
-import Button from 'components/Button'
-import { Account, PlusCircled } from 'components/Icons'
+import AccountCreateFirst from 'components/account/AccountCreateFirst'
+import { ACCOUNT_MENU_BUTTON_ID } from 'components/account/AccountMenuContent'
+import Button from 'components/common/Button/index'
+import { Account, PlusCircled } from 'components/common/Icons'
 import WalletConnectButton from 'components/Wallet/WalletConnectButton'
+import useAccountIds from 'hooks/accounts/useAccountIds'
 import useAccountId from 'hooks/useAccountId'
-import useAccountIds from 'hooks/useAccountIds'
 import useStore from 'store'
 
 export default function ActionButton(props: ButtonProps) {
diff --git a/src/components/Button/DropDownButton.tsx b/src/components/common/Button/DropDownButton.tsx
similarity index 58%
rename from src/components/Button/DropDownButton.tsx
rename to src/components/common/Button/DropDownButton.tsx
index d7fad7e2..60bd189a 100644
--- a/src/components/Button/DropDownButton.tsx
+++ b/src/components/common/Button/DropDownButton.tsx
@@ -1,7 +1,7 @@
-import Button from 'components/Button'
-import { ChevronDown } from 'components/Icons'
-import Text from 'components/Text'
-import { Tooltip } from 'components/Tooltip'
+import Button from 'components/common/Button/index'
+import { ChevronDown } from 'components/common/Icons'
+import Text from 'components/common/Text'
+import { Tooltip } from 'components/common/Tooltip'
 import useToggle from 'hooks/useToggle'
 
 interface Props extends ButtonProps {
@@ -13,7 +13,7 @@ export default function DropDownButton(props: Props) {
   const [isOpen, toggleIsOpen] = useToggle(false)
   return (
     <Tooltip
-      content={<DropDown {...props} />}
+      content={<DropDown closeMenu={() => toggleIsOpen(false)} {...props} />}
       type='info'
       placement='bottom'
       contentClassName='!bg-white/10 border border-white/20 backdrop-blur-xl !p-0'
@@ -34,26 +34,35 @@ export default function DropDownButton(props: Props) {
 
 interface DropDownProps {
   items: DropDownItem[]
+  closeMenu: () => void
 }
 
 function DropDown(props: DropDownProps) {
   return (
     <div>
       {props.items.map((item) => (
-        <DropDownItem key={item.text} {...item} />
+        <DropDownItem key={item.text} item={item} closeMenu={props.closeMenu} />
       ))}
     </div>
   )
 }
 
-function DropDownItem(props: DropDownItem) {
+interface DropDownItemProps {
+  closeMenu: () => void
+  item: DropDownItem
+}
+
+function DropDownItem(props: DropDownItemProps) {
   return (
     <button
-      onClick={props.onClick}
+      onClick={() => {
+        props.item.onClick()
+        props.closeMenu()
+      }}
       className=' px-4 py-3 flex gap-2 items-center hover:bg-white/5 w-full [&:not(:last-child)]:border-b border-white/10'
     >
-      <div className='flex justify-center w-5 h-5'>{props.icon}</div>
-      <Text size='sm'>{props.text}</Text>
+      <div className='flex justify-center w-5 h-5'>{props.item.icon}</div>
+      <Text size='sm'>{props.item.text}</Text>
     </button>
   )
 }
diff --git a/src/components/Button/EscButton.tsx b/src/components/common/Button/EscButton.tsx
similarity index 89%
rename from src/components/Button/EscButton.tsx
rename to src/components/common/Button/EscButton.tsx
index 45dbf401..737576fb 100644
--- a/src/components/Button/EscButton.tsx
+++ b/src/components/common/Button/EscButton.tsx
@@ -1,7 +1,7 @@
 import { useCallback, useEffect } from 'react'
 
-import Button from 'components/Button'
-import { Cross } from 'components/Icons'
+import Button from 'components/common/Button/index'
+import { Cross } from 'components/common/Icons'
 
 interface Props {
   enableKeyPress?: boolean
diff --git a/src/components/Button/constants.ts b/src/components/common/Button/constants.ts
similarity index 100%
rename from src/components/Button/constants.ts
rename to src/components/common/Button/constants.ts
diff --git a/src/components/Button/index.tsx b/src/components/common/Button/index.tsx
similarity index 90%
rename from src/components/Button/index.tsx
rename to src/components/common/Button/index.tsx
index 63a7eab1..97b66920 100644
--- a/src/components/Button/index.tsx
+++ b/src/components/common/Button/index.tsx
@@ -12,13 +12,13 @@ import {
   buttonVariantClasses,
   circularProgressSize,
   focusClasses,
-} from 'components/Button/constants'
-import { glowElement } from 'components/Button/utils'
-import { CircularProgress } from 'components/CircularProgress'
-import { ChevronDown } from 'components/Icons'
+} from 'components/common/Button/constants'
+import { glowElement } from 'components/common/Button/utils'
+import { CircularProgress } from 'components/common/CircularProgress'
+import { ChevronDown } from 'components/common/Icons'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 
 const Button = React.forwardRef(function Button(
   {
@@ -33,6 +33,7 @@ const Button = React.forwardRef(function Button(
     text,
     variant = 'solid',
     onClick,
+    onMouseOver,
     leftIcon,
     rightIcon,
     iconClassName,
@@ -97,6 +98,7 @@ const Button = React.forwardRef(function Button(
       id={id}
       ref={ref as LegacyRef<HTMLButtonElement>}
       onClick={isDisabled ? () => {} : onClick}
+      onMouseOver={isDisabled ? () => {} : onMouseOver}
       tabIndex={tabIndex}
       autoFocus={autoFocus}
     >
diff --git a/src/components/Button/utils.tsx b/src/components/common/Button/utils.tsx
similarity index 100%
rename from src/components/Button/utils.tsx
rename to src/components/common/Button/utils.tsx
diff --git a/src/components/Card.tsx b/src/components/common/Card.tsx
similarity index 96%
rename from src/components/Card.tsx
rename to src/components/common/Card.tsx
index 1c3df37a..451c2033 100644
--- a/src/components/Card.tsx
+++ b/src/components/common/Card.tsx
@@ -1,7 +1,7 @@
 import classNames from 'classnames'
 import { ReactElement, ReactNode } from 'react'
 
-import Text from 'components/Text'
+import Text from 'components/common/Text'
 
 interface Props {
   children: ReactNode
diff --git a/src/components/CheckMark.tsx b/src/components/common/CheckMark.tsx
similarity index 92%
rename from src/components/CheckMark.tsx
rename to src/components/common/CheckMark.tsx
index 7d6ee4ce..b4af3bc9 100644
--- a/src/components/CheckMark.tsx
+++ b/src/components/common/CheckMark.tsx
@@ -1,9 +1,9 @@
 import classNames from 'classnames'
 
-import { CheckCircled } from 'components/Icons'
+import { CheckCircled } from 'components/common/Icons'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 
 interface Props {
   color?: string
diff --git a/src/components/Checkbox.tsx b/src/components/common/Checkbox.tsx
similarity index 93%
rename from src/components/Checkbox.tsx
rename to src/components/common/Checkbox.tsx
index f065edb1..13bafc59 100644
--- a/src/components/Checkbox.tsx
+++ b/src/components/common/Checkbox.tsx
@@ -1,7 +1,7 @@
 import classNames from 'classnames'
 
-import { Check } from 'components/Icons'
-import Text from 'components/Text'
+import { Check } from 'components/common/Icons'
+import Text from 'components/common/Text'
 
 interface Props {
   checked: boolean
diff --git a/src/components/CircularProgress.tsx b/src/components/common/CircularProgress.tsx
similarity index 96%
rename from src/components/CircularProgress.tsx
rename to src/components/common/CircularProgress.tsx
index 2aa318e6..6a2bbc26 100644
--- a/src/components/CircularProgress.tsx
+++ b/src/components/common/CircularProgress.tsx
@@ -2,7 +2,7 @@ import classNames from 'classnames'
 
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 
 interface Props {
   color?: string
diff --git a/src/components/DefaultPageHead.tsx b/src/components/common/DefaultPageHead.tsx
similarity index 100%
rename from src/components/DefaultPageHead.tsx
rename to src/components/common/DefaultPageHead.tsx
diff --git a/src/components/DepositCapCell.tsx b/src/components/common/DepositCapCell.tsx
similarity index 64%
rename from src/components/DepositCapCell.tsx
rename to src/components/common/DepositCapCell.tsx
index feffa34c..cd8946d9 100644
--- a/src/components/DepositCapCell.tsx
+++ b/src/components/common/DepositCapCell.tsx
@@ -1,7 +1,9 @@
-import { FormattedNumber } from 'components/FormattedNumber'
-import TitleAndSubCell from 'components/TitleAndSubCell'
+import classNames from 'classnames'
+
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import TitleAndSubCell from 'components/common/TitleAndSubCell'
 import { VAULT_DEPOSIT_BUFFER } from 'constants/vaults'
-import { getAssetByDenom } from 'utils/assets'
+import useAsset from 'hooks/assets/useAsset'
 
 interface Props {
   depositCap: DepositCap
@@ -13,7 +15,7 @@ export default function DepositCapCell(props: Props) {
     .multipliedBy(100)
     .integerValue()
   const depositCapUsed = Math.min(percent.toNumber(), 100)
-  const decimals = getAssetByDenom(props.depositCap.denom)?.decimals ?? 6
+  const decimals = useAsset(props.depositCap.denom)?.decimals ?? 6
 
   return (
     <TitleAndSubCell
@@ -29,7 +31,10 @@ export default function DepositCapCell(props: Props) {
         <FormattedNumber
           amount={depositCapUsed}
           options={{ minDecimals: 2, maxDecimals: 2, suffix: '% Filled' }}
-          className='text-xs'
+          className={classNames(
+            'text-xs',
+            depositCapUsed >= 100 ? 'text-loss/60' : depositCapUsed > 90 ? 'text-info/60' : '',
+          )}
           animate
         />
       }
diff --git a/src/components/common/DepositCapMessage.tsx b/src/components/common/DepositCapMessage.tsx
new file mode 100644
index 00000000..1182e5f8
--- /dev/null
+++ b/src/components/common/DepositCapMessage.tsx
@@ -0,0 +1,56 @@
+import classNames from 'classnames'
+import { HTMLAttributes } from 'react'
+
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import { InfoCircle } from 'components/common/Icons'
+import Text from 'components/common/Text'
+import useAsset from 'hooks/assets/useAsset'
+import { BNCoin } from 'types/classes/BNCoin'
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  action: 'buy' | 'deposit' | 'fund'
+  coins: BNCoin[]
+  showIcon?: boolean
+}
+
+export default function DepositCapMessage(props: Props) {
+  if (!props.coins.length) return null
+
+  return (
+    <div className={classNames('flex items-start', props.className)}>
+      {props.showIcon && <InfoCircle width={26} className='mr-5' />}
+      <div className='flex flex-col gap-2'>
+        <Text size='sm'>Deposit Cap Reached!</Text>
+        <Text size='xs' className='text-white/40'>{`Unfortunately you're not able to ${
+          props.action
+        } more than the following amount${props.coins.length > 1 ? 's' : ''}:`}</Text>
+        {props.coins.map((coin) => (
+          <AmountMessage key={coin.denom} coin={coin} />
+        ))}
+      </div>
+    </div>
+  )
+}
+
+interface AmountMessageProps {
+  coin: BNCoin
+}
+function AmountMessage(props: AmountMessageProps) {
+  const asset = useAsset(props.coin.denom)
+  if (!asset) return null
+
+  return (
+    <div key={props.coin.denom} className='flex gap-1'>
+      <Text size='xs'>Cap Left:</Text>
+      <FormattedNumber
+        amount={Math.max(0, props.coin.amount.toNumber())}
+        options={{
+          decimals: asset.decimals,
+          maxDecimals: asset.decimals,
+          suffix: ` ${asset.symbol}`,
+        }}
+        className='text-xs text-white/60'
+      />
+    </div>
+  )
+}
diff --git a/src/components/common/DisplayCurrency.tsx b/src/components/common/DisplayCurrency.tsx
new file mode 100644
index 00000000..d2b43796
--- /dev/null
+++ b/src/components/common/DisplayCurrency.tsx
@@ -0,0 +1,101 @@
+import classNames from 'classnames'
+import { useMemo } from 'react'
+
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import { ORACLE_DENOM } from 'constants/oracle'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import useDisplayCurrencyAssets from 'hooks/assets/useDisplayCurrencyAssets'
+import useDisplayCurrency from 'hooks/localStorage/useDisplayCurrency'
+import usePrices from 'hooks/usePrices'
+import { BNCoin } from 'types/classes/BNCoin'
+import { getCoinValue } from 'utils/formatters'
+import { BN } from 'utils/helpers'
+
+interface Props {
+  coin: BNCoin
+  className?: string
+  isApproximation?: boolean
+  parentheses?: boolean
+  showZero?: boolean
+  options?: FormatOptions
+  isProfitOrLoss?: boolean
+}
+
+export default function DisplayCurrency(props: Props) {
+  const { coin, className, isApproximation, parentheses, showZero, options, isProfitOrLoss } = props
+  const displayCurrencies = useDisplayCurrencyAssets()
+  const assets = useAllAssets()
+  const [displayCurrency] = useDisplayCurrency()
+  const { data: prices } = usePrices()
+
+  const displayCurrencyAsset = useMemo(
+    () =>
+      displayCurrencies.find((asset) => asset.denom === displayCurrency) ?? displayCurrencies[0],
+    [displayCurrency, displayCurrencies],
+  )
+
+  const isUSD = displayCurrencyAsset.id === 'USD'
+
+  const [amount, absoluteAmount] = useMemo(() => {
+    const coinValue = getCoinValue(coin, prices, assets)
+
+    if (displayCurrency === ORACLE_DENOM) return [coinValue.toNumber(), coinValue.abs().toNumber()]
+
+    const displayDecimals = displayCurrencyAsset.decimals
+    const displayPrice = getCoinValue(
+      BNCoin.fromDenomAndBigNumber(displayCurrency, BN(1).shiftedBy(displayDecimals)),
+      prices,
+      assets,
+    )
+
+    const amount = coinValue.div(displayPrice).toNumber()
+
+    return [amount, Math.abs(amount)]
+  }, [assets, displayCurrency, displayCurrencyAsset.decimals, prices, coin])
+
+  const isLessThanACent = useMemo(
+    () => isUSD && absoluteAmount < 0.01 && absoluteAmount > 0,
+    [absoluteAmount, isUSD],
+  )
+
+  const prefix = useMemo(() => {
+    const positiveOrNegativePrefix = isProfitOrLoss
+      ? amount > 0
+        ? '+'
+        : amount < 0
+        ? '-'
+        : ''
+      : ''
+    const approximationPrefix = isApproximation ? '~ ' : ''
+    const smallerThanPrefix = isLessThanACent && !showZero ? '< ' : ''
+
+    return isUSD
+      ? `${approximationPrefix}${smallerThanPrefix}${positiveOrNegativePrefix}$`
+      : `${approximationPrefix}${smallerThanPrefix}${positiveOrNegativePrefix}`
+  }, [isUSD, isApproximation, showZero, isProfitOrLoss, amount, isLessThanACent])
+
+  const suffix = isUSD
+    ? ''
+    : ` ${displayCurrencyAsset.symbol ? ` ${displayCurrencyAsset.symbol}` : ''}`
+
+  return (
+    <FormattedNumber
+      className={classNames(
+        className,
+        parentheses && 'before:content-["("] after:content-[")"]',
+        isProfitOrLoss && amount < 0 && 'text-loss',
+        isProfitOrLoss && amount > 0 && 'text-profit',
+      )}
+      amount={isLessThanACent ? 0.01 : absoluteAmount}
+      options={{
+        minDecimals: isUSD ? 2 : 0,
+        maxDecimals: 2,
+        abbreviated: true,
+        suffix,
+        ...options,
+        prefix,
+      }}
+      animate
+    />
+  )
+}
diff --git a/src/components/Divider.tsx b/src/components/common/Divider.tsx
similarity index 100%
rename from src/components/Divider.tsx
rename to src/components/common/Divider.tsx
diff --git a/src/components/DocsLink.tsx b/src/components/common/DocsLink.tsx
similarity index 88%
rename from src/components/DocsLink.tsx
rename to src/components/common/DocsLink.tsx
index e7ac87ec..3122e8ef 100644
--- a/src/components/DocsLink.tsx
+++ b/src/components/common/DocsLink.tsx
@@ -1,8 +1,8 @@
 import classNames from 'classnames'
 
-import { ExternalLink } from 'components/Icons'
-import Text from 'components/Text'
-import { TextLink } from 'components/TextLink'
+import { ExternalLink } from 'components/common/Icons'
+import Text from 'components/common/Text'
+import { TextLink } from 'components/common/TextLink'
 import { DocURL } from 'types/enums/docURL'
 
 interface Props {
diff --git a/src/components/DoubleLogo.tsx b/src/components/common/DoubleLogo.tsx
similarity index 64%
rename from src/components/DoubleLogo.tsx
rename to src/components/common/DoubleLogo.tsx
index 115cd004..116f67e6 100644
--- a/src/components/DoubleLogo.tsx
+++ b/src/components/common/DoubleLogo.tsx
@@ -1,5 +1,7 @@
-import AssetImage from 'components/Asset/AssetImage'
-import { getAssetByDenom } from 'utils/assets'
+import classNames from 'classnames'
+
+import AssetImage from 'components/common/assets/AssetImage'
+import useAsset from 'hooks/assets/useAsset'
 
 interface Props {
   primaryDenom: string
@@ -7,8 +9,8 @@ interface Props {
 }
 
 export default function DoubleLogo(props: Props) {
-  const primaryAsset = getAssetByDenom(props.primaryDenom)
-  const secondaryAsset = getAssetByDenom(props.secondaryDenom)
+  const primaryAsset = useAsset(props.primaryDenom)
+  const secondaryAsset = useAsset(props.secondaryDenom)
 
   if (!primaryAsset || !secondaryAsset) return null
 
@@ -18,7 +20,7 @@ export default function DoubleLogo(props: Props) {
         <AssetImage asset={primaryAsset} size={24} />
       </div>
       <div className='absolute'>
-        <AssetImage asset={secondaryAsset} size={16} className='ml-5 mt-5' />
+        <AssetImage asset={secondaryAsset} size={16} className='mt-5 ml-5' />
       </div>
     </div>
   )
diff --git a/src/components/Footer.tsx b/src/components/common/Footer.tsx
similarity index 86%
rename from src/components/Footer.tsx
rename to src/components/common/Footer.tsx
index a885838f..babd3af8 100644
--- a/src/components/Footer.tsx
+++ b/src/components/common/Footer.tsx
@@ -1,7 +1,7 @@
-import { TextLink } from 'components/TextLink'
+import { TextLink } from 'components/common/TextLink'
 import { DocURL } from 'types/enums/docURL'
 
-import packageInfo from '../../package.json'
+import packageInfo from '../../../package.json'
 
 export default function Footer() {
   const version = `v${packageInfo.version}`
diff --git a/src/components/FormattedNumber.tsx b/src/components/common/FormattedNumber.tsx
similarity index 97%
rename from src/components/FormattedNumber.tsx
rename to src/components/common/FormattedNumber.tsx
index 964c49f8..be26ddb5 100644
--- a/src/components/FormattedNumber.tsx
+++ b/src/components/common/FormattedNumber.tsx
@@ -4,7 +4,7 @@ import { animated, useSpring } from 'react-spring'
 
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import { formatValue } from 'utils/formatters'
 
 interface Props {
diff --git a/src/components/FullOverlayContent.tsx b/src/components/common/FullOverlayContent.tsx
similarity index 86%
rename from src/components/FullOverlayContent.tsx
rename to src/components/common/FullOverlayContent.tsx
index 9f56263e..5fbd990f 100644
--- a/src/components/FullOverlayContent.tsx
+++ b/src/components/common/FullOverlayContent.tsx
@@ -1,8 +1,8 @@
 import classNames from 'classnames'
 
-import Button from 'components/Button'
-import DocsLink from 'components/DocsLink'
-import Text from 'components/Text'
+import Button from 'components/common/Button'
+import DocsLink from 'components/common/DocsLink'
+import Text from 'components/common/Text'
 
 interface Props {
   title: string
diff --git a/src/components/Gauge.tsx b/src/components/common/Gauge.tsx
similarity index 95%
rename from src/components/Gauge.tsx
rename to src/components/common/Gauge.tsx
index cd677414..b9b035c6 100644
--- a/src/components/Gauge.tsx
+++ b/src/components/common/Gauge.tsx
@@ -1,10 +1,10 @@
 import classNames from 'classnames'
 import { ReactElement, ReactNode } from 'react'
 
-import { Tooltip } from 'components/Tooltip'
+import { Tooltip } from 'components/common/Tooltip'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 
 interface Props {
   tooltip: string | ReactNode
diff --git a/src/components/Icons/Account.svg b/src/components/common/Icons/Account.svg
similarity index 100%
rename from src/components/Icons/Account.svg
rename to src/components/common/Icons/Account.svg
diff --git a/src/components/Icons/AccountArrowDown.svg b/src/components/common/Icons/AccountArrowDown.svg
similarity index 100%
rename from src/components/Icons/AccountArrowDown.svg
rename to src/components/common/Icons/AccountArrowDown.svg
diff --git a/src/components/Icons/ArrowChartLineUp.svg b/src/components/common/Icons/ArrowChartLineUp.svg
similarity index 100%
rename from src/components/Icons/ArrowChartLineUp.svg
rename to src/components/common/Icons/ArrowChartLineUp.svg
diff --git a/src/components/Icons/ArrowCircle.svg b/src/components/common/Icons/ArrowCircle.svg
similarity index 100%
rename from src/components/Icons/ArrowCircle.svg
rename to src/components/common/Icons/ArrowCircle.svg
diff --git a/src/components/Icons/ArrowCircledTopRight.svg b/src/components/common/Icons/ArrowCircledTopRight.svg
similarity index 100%
rename from src/components/Icons/ArrowCircledTopRight.svg
rename to src/components/common/Icons/ArrowCircledTopRight.svg
diff --git a/src/components/Icons/ArrowDownLine.svg b/src/components/common/Icons/ArrowDownLine.svg
similarity index 100%
rename from src/components/Icons/ArrowDownLine.svg
rename to src/components/common/Icons/ArrowDownLine.svg
diff --git a/src/components/common/Icons/ArrowRight.svg b/src/components/common/Icons/ArrowRight.svg
new file mode 100644
index 00000000..08f15f60
--- /dev/null
+++ b/src/components/common/Icons/ArrowRight.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M3.33337 8.00065H12.6667M12.6667 8.00065L8.00004 3.33398M12.6667 8.00065L8.00004 12.6673" stroke="currentColor" stroke-width="0.666667" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/src/components/Icons/ArrowUpLine.svg b/src/components/common/Icons/ArrowUpLine.svg
similarity index 100%
rename from src/components/Icons/ArrowUpLine.svg
rename to src/components/common/Icons/ArrowUpLine.svg
diff --git a/src/components/Icons/Chain.svg b/src/components/common/Icons/Chain.svg
similarity index 100%
rename from src/components/Icons/Chain.svg
rename to src/components/common/Icons/Chain.svg
diff --git a/src/components/Icons/Check.svg b/src/components/common/Icons/Check.svg
similarity index 100%
rename from src/components/Icons/Check.svg
rename to src/components/common/Icons/Check.svg
diff --git a/src/components/Icons/CheckCircled.svg b/src/components/common/Icons/CheckCircled.svg
similarity index 100%
rename from src/components/Icons/CheckCircled.svg
rename to src/components/common/Icons/CheckCircled.svg
diff --git a/src/components/Icons/ChevronDown.svg b/src/components/common/Icons/ChevronDown.svg
similarity index 100%
rename from src/components/Icons/ChevronDown.svg
rename to src/components/common/Icons/ChevronDown.svg
diff --git a/src/components/Icons/ChevronLeft.svg b/src/components/common/Icons/ChevronLeft.svg
similarity index 100%
rename from src/components/Icons/ChevronLeft.svg
rename to src/components/common/Icons/ChevronLeft.svg
diff --git a/src/components/Icons/ChevronRight.svg b/src/components/common/Icons/ChevronRight.svg
similarity index 100%
rename from src/components/Icons/ChevronRight.svg
rename to src/components/common/Icons/ChevronRight.svg
diff --git a/src/components/Icons/ChevronUp.svg b/src/components/common/Icons/ChevronUp.svg
similarity index 100%
rename from src/components/Icons/ChevronUp.svg
rename to src/components/common/Icons/ChevronUp.svg
diff --git a/src/components/Icons/Circle.svg b/src/components/common/Icons/Circle.svg
similarity index 100%
rename from src/components/Icons/Circle.svg
rename to src/components/common/Icons/Circle.svg
diff --git a/src/components/Icons/Coins.svg b/src/components/common/Icons/Coins.svg
similarity index 100%
rename from src/components/Icons/Coins.svg
rename to src/components/common/Icons/Coins.svg
diff --git a/src/components/Icons/CoinsSwap.svg b/src/components/common/Icons/CoinsSwap.svg
similarity index 100%
rename from src/components/Icons/CoinsSwap.svg
rename to src/components/common/Icons/CoinsSwap.svg
diff --git a/src/components/Icons/Compass.svg b/src/components/common/Icons/Compass.svg
similarity index 100%
rename from src/components/Icons/Compass.svg
rename to src/components/common/Icons/Compass.svg
diff --git a/src/components/Icons/Copy.svg b/src/components/common/Icons/Copy.svg
similarity index 100%
rename from src/components/Icons/Copy.svg
rename to src/components/common/Icons/Copy.svg
diff --git a/src/components/Icons/Cross.svg b/src/components/common/Icons/Cross.svg
similarity index 100%
rename from src/components/Icons/Cross.svg
rename to src/components/common/Icons/Cross.svg
diff --git a/src/components/Icons/CrossCircled.svg b/src/components/common/Icons/CrossCircled.svg
similarity index 100%
rename from src/components/Icons/CrossCircled.svg
rename to src/components/common/Icons/CrossCircled.svg
diff --git a/src/components/common/Icons/Edit.svg b/src/components/common/Icons/Edit.svg
new file mode 100644
index 00000000..1bf4c959
--- /dev/null
+++ b/src/components/common/Icons/Edit.svg
@@ -0,0 +1,8 @@
+<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M14.9999 8.33424L11.6666 5.0009M2.08325 17.9176L4.90356 17.6042C5.24813 17.5659 5.42042 17.5468 5.58146 17.4946C5.72433 17.4484 5.86029 17.383 5.98566 17.3004C6.12696 17.2072 6.24954 17.0846 6.49469 16.8395L17.4999 5.83424C18.4204 4.91376 18.4204 3.42138 17.4999 2.5009C16.5795 1.58043 15.0871 1.58043 14.1666 2.5009L3.16136 13.5061C2.91621 13.7513 2.79363 13.8739 2.70045 14.0152C2.61778 14.1405 2.55243 14.2765 2.50618 14.4194C2.45405 14.5804 2.43491 14.7527 2.39662 15.0973L2.08325 17.9176Z"
+    stroke="currentColor"
+    stroke-linecap="round"
+    stroke-linejoin="round"
+  />
+</svg>
diff --git a/src/components/Icons/Enter.svg b/src/components/common/Icons/Enter.svg
similarity index 100%
rename from src/components/Icons/Enter.svg
rename to src/components/common/Icons/Enter.svg
diff --git a/src/components/Icons/ExclamationMarkCircled.svg b/src/components/common/Icons/ExclamationMarkCircled.svg
similarity index 100%
rename from src/components/Icons/ExclamationMarkCircled.svg
rename to src/components/common/Icons/ExclamationMarkCircled.svg
diff --git a/src/components/Icons/ExclamationMarkTriangle.svg b/src/components/common/Icons/ExclamationMarkTriangle.svg
similarity index 100%
rename from src/components/Icons/ExclamationMarkTriangle.svg
rename to src/components/common/Icons/ExclamationMarkTriangle.svg
diff --git a/src/components/Icons/ExternalLink.svg b/src/components/common/Icons/ExternalLink.svg
similarity index 100%
rename from src/components/Icons/ExternalLink.svg
rename to src/components/common/Icons/ExternalLink.svg
diff --git a/src/components/Icons/Flag.svg b/src/components/common/Icons/Flag.svg
similarity index 100%
rename from src/components/Icons/Flag.svg
rename to src/components/common/Icons/Flag.svg
diff --git a/src/components/Icons/Gear.svg b/src/components/common/Icons/Gear.svg
similarity index 100%
rename from src/components/Icons/Gear.svg
rename to src/components/common/Icons/Gear.svg
diff --git a/src/components/Icons/GridGlobe.svg b/src/components/common/Icons/GridGlobe.svg
similarity index 100%
rename from src/components/Icons/GridGlobe.svg
rename to src/components/common/Icons/GridGlobe.svg
diff --git a/src/components/Icons/GridHole.svg b/src/components/common/Icons/GridHole.svg
similarity index 100%
rename from src/components/Icons/GridHole.svg
rename to src/components/common/Icons/GridHole.svg
diff --git a/src/components/Icons/GridLandscape.svg b/src/components/common/Icons/GridLandscape.svg
similarity index 100%
rename from src/components/Icons/GridLandscape.svg
rename to src/components/common/Icons/GridLandscape.svg
diff --git a/src/components/Icons/GridPlanet.svg b/src/components/common/Icons/GridPlanet.svg
similarity index 100%
rename from src/components/Icons/GridPlanet.svg
rename to src/components/common/Icons/GridPlanet.svg
diff --git a/src/components/Icons/GridTire.svg b/src/components/common/Icons/GridTire.svg
similarity index 100%
rename from src/components/Icons/GridTire.svg
rename to src/components/common/Icons/GridTire.svg
diff --git a/src/components/Icons/GridWeb.svg b/src/components/common/Icons/GridWeb.svg
similarity index 100%
rename from src/components/Icons/GridWeb.svg
rename to src/components/common/Icons/GridWeb.svg
diff --git a/src/components/Icons/HandCoins.svg b/src/components/common/Icons/HandCoins.svg
similarity index 100%
rename from src/components/Icons/HandCoins.svg
rename to src/components/common/Icons/HandCoins.svg
diff --git a/src/components/Icons/Heart.svg b/src/components/common/Icons/Heart.svg
similarity index 100%
rename from src/components/Icons/Heart.svg
rename to src/components/common/Icons/Heart.svg
diff --git a/src/components/Icons/InfoCircle.svg b/src/components/common/Icons/InfoCircle.svg
similarity index 100%
rename from src/components/Icons/InfoCircle.svg
rename to src/components/common/Icons/InfoCircle.svg
diff --git a/src/components/Icons/LockLocked.svg b/src/components/common/Icons/LockLocked.svg
similarity index 100%
rename from src/components/Icons/LockLocked.svg
rename to src/components/common/Icons/LockLocked.svg
diff --git a/src/components/Icons/LockUnlocked.svg b/src/components/common/Icons/LockUnlocked.svg
similarity index 100%
rename from src/components/Icons/LockUnlocked.svg
rename to src/components/common/Icons/LockUnlocked.svg
diff --git a/src/components/Icons/Logo.svg b/src/components/common/Icons/Logo.svg
similarity index 100%
rename from src/components/Icons/Logo.svg
rename to src/components/common/Icons/Logo.svg
diff --git a/src/components/Icons/Luggage.svg b/src/components/common/Icons/Luggage.svg
similarity index 100%
rename from src/components/Icons/Luggage.svg
rename to src/components/common/Icons/Luggage.svg
diff --git a/src/components/Icons/MarsProtocol.svg b/src/components/common/Icons/MarsProtocol.svg
similarity index 100%
rename from src/components/Icons/MarsProtocol.svg
rename to src/components/common/Icons/MarsProtocol.svg
diff --git a/src/components/common/Icons/Neutron.svg b/src/components/common/Icons/Neutron.svg
new file mode 100644
index 00000000..c353466b
--- /dev/null
+++ b/src/components/common/Icons/Neutron.svg
@@ -0,0 +1,16 @@
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 24 24">
+  <path
+    fill="#FFF"
+    d="M23.6,14.9C22,21.3,15.5,25.2,9,23.6C2.6,22-1.3,15.5,0.3,9.1S8.4-1.2,14.8,0.4C21.3,2,25.2,8.5,23.6,14.9
+      L23.6,14.9L23.6,14.9z"
+  />
+  <path
+    fill="#000"
+    d="M12,15.1c-1.7,0-3.1-1.4-3.1-3.1c0-0.6,0.2-1.2,0.5-1.6L5.4,7.1v11.5h11.5l-3.3-3.9C13.1,15,12.5,15.1,12,15.1z
+      "
+  />
+  <path
+    fill="#000"
+    d="M6.4,5.4l3.5,4.2c0.5-0.5,1.3-0.8,2-0.8c1.7,0,3.1,1.4,3.1,3.1c0,0.7-0.3,1.4-0.7,2l4.1,3.6V5.4H6.4z"
+  />
+</svg>
diff --git a/src/components/Icons/Osmo.svg b/src/components/common/Icons/Osmo.svg
similarity index 100%
rename from src/components/Icons/Osmo.svg
rename to src/components/common/Icons/Osmo.svg
diff --git a/src/components/Icons/OverlayMark.svg b/src/components/common/Icons/OverlayMark.svg
similarity index 100%
rename from src/components/Icons/OverlayMark.svg
rename to src/components/common/Icons/OverlayMark.svg
diff --git a/src/components/Icons/Plus.svg b/src/components/common/Icons/Plus.svg
similarity index 100%
rename from src/components/Icons/Plus.svg
rename to src/components/common/Icons/Plus.svg
diff --git a/src/components/Icons/PlusCircled.svg b/src/components/common/Icons/PlusCircled.svg
similarity index 100%
rename from src/components/Icons/PlusCircled.svg
rename to src/components/common/Icons/PlusCircled.svg
diff --git a/src/components/Icons/PlusSquared.svg b/src/components/common/Icons/PlusSquared.svg
similarity index 100%
rename from src/components/Icons/PlusSquared.svg
rename to src/components/common/Icons/PlusSquared.svg
diff --git a/src/components/Icons/PythLogoType.svg b/src/components/common/Icons/PythLogoType.svg
similarity index 100%
rename from src/components/Icons/PythLogoType.svg
rename to src/components/common/Icons/PythLogoType.svg
diff --git a/src/components/Icons/Questionmark.svg b/src/components/common/Icons/Questionmark.svg
similarity index 100%
rename from src/components/Icons/Questionmark.svg
rename to src/components/common/Icons/Questionmark.svg
diff --git a/src/components/Icons/ReceiptCheck.svg b/src/components/common/Icons/ReceiptCheck.svg
similarity index 100%
rename from src/components/Icons/ReceiptCheck.svg
rename to src/components/common/Icons/ReceiptCheck.svg
diff --git a/src/components/Icons/Scale.svg b/src/components/common/Icons/Scale.svg
similarity index 100%
rename from src/components/Icons/Scale.svg
rename to src/components/common/Icons/Scale.svg
diff --git a/src/components/Icons/Search.svg b/src/components/common/Icons/Search.svg
similarity index 100%
rename from src/components/Icons/Search.svg
rename to src/components/common/Icons/Search.svg
diff --git a/src/components/Icons/Shield.svg b/src/components/common/Icons/Shield.svg
similarity index 100%
rename from src/components/Icons/Shield.svg
rename to src/components/common/Icons/Shield.svg
diff --git a/src/components/Icons/SortAsc.svg b/src/components/common/Icons/SortAsc.svg
similarity index 100%
rename from src/components/Icons/SortAsc.svg
rename to src/components/common/Icons/SortAsc.svg
diff --git a/src/components/Icons/SortDesc.svg b/src/components/common/Icons/SortDesc.svg
similarity index 100%
rename from src/components/Icons/SortDesc.svg
rename to src/components/common/Icons/SortDesc.svg
diff --git a/src/components/Icons/SortNone.svg b/src/components/common/Icons/SortNone.svg
similarity index 100%
rename from src/components/Icons/SortNone.svg
rename to src/components/common/Icons/SortNone.svg
diff --git a/src/components/Icons/StarFilled.svg b/src/components/common/Icons/StarFilled.svg
similarity index 100%
rename from src/components/Icons/StarFilled.svg
rename to src/components/common/Icons/StarFilled.svg
diff --git a/src/components/Icons/StarOutlined.svg b/src/components/common/Icons/StarOutlined.svg
similarity index 100%
rename from src/components/Icons/StarOutlined.svg
rename to src/components/common/Icons/StarOutlined.svg
diff --git a/src/components/Icons/Subtract.svg b/src/components/common/Icons/Subtract.svg
similarity index 100%
rename from src/components/Icons/Subtract.svg
rename to src/components/common/Icons/Subtract.svg
diff --git a/src/components/Icons/SwapIcon.svg b/src/components/common/Icons/SwapIcon.svg
similarity index 100%
rename from src/components/Icons/SwapIcon.svg
rename to src/components/common/Icons/SwapIcon.svg
diff --git a/src/components/Icons/ThreeDots.svg b/src/components/common/Icons/ThreeDots.svg
similarity index 100%
rename from src/components/Icons/ThreeDots.svg
rename to src/components/common/Icons/ThreeDots.svg
diff --git a/src/components/Icons/TooltipArrow.svg b/src/components/common/Icons/TooltipArrow.svg
similarity index 100%
rename from src/components/Icons/TooltipArrow.svg
rename to src/components/common/Icons/TooltipArrow.svg
diff --git a/src/components/Icons/TrashBin.svg b/src/components/common/Icons/TrashBin.svg
similarity index 100%
rename from src/components/Icons/TrashBin.svg
rename to src/components/common/Icons/TrashBin.svg
diff --git a/src/components/Icons/Twitter.svg b/src/components/common/Icons/Twitter.svg
similarity index 100%
rename from src/components/Icons/Twitter.svg
rename to src/components/common/Icons/Twitter.svg
diff --git a/src/components/Icons/VerticalThreeLine.svg b/src/components/common/Icons/VerticalThreeLine.svg
similarity index 100%
rename from src/components/Icons/VerticalThreeLine.svg
rename to src/components/common/Icons/VerticalThreeLine.svg
diff --git a/src/components/Icons/Wallet.svg b/src/components/common/Icons/Wallet.svg
similarity index 100%
rename from src/components/Icons/Wallet.svg
rename to src/components/common/Icons/Wallet.svg
diff --git a/src/components/common/Icons/index.ts b/src/components/common/Icons/index.ts
new file mode 100644
index 00000000..48da3587
--- /dev/null
+++ b/src/components/common/Icons/index.ts
@@ -0,0 +1,70 @@
+// @index(['./*.svg'], f => `export { default as ${f.name} } from 'components/Icons/${f.name}.svg'`)
+export { default as Account } from 'components/common/Icons/Account.svg'
+export { default as AccountArrowDown } from 'components/common/Icons/AccountArrowDown.svg'
+export { default as ArrowChartLineUp } from 'components/common/Icons/ArrowChartLineUp.svg'
+export { default as ArrowCircle } from 'components/common/Icons/ArrowCircle.svg'
+export { default as ArrowCircledTopRight } from 'components/common/Icons/ArrowCircledTopRight.svg'
+export { default as ArrowDownLine } from 'components/common/Icons/ArrowDownLine.svg'
+export { default as ArrowRight } from 'components/common/Icons/ArrowRight.svg'
+export { default as ArrowUpLine } from 'components/common/Icons/ArrowUpLine.svg'
+export { default as Chain } from 'components/common/Icons/Chain.svg'
+export { default as Check } from 'components/common/Icons/Check.svg'
+export { default as CheckCircled } from 'components/common/Icons/CheckCircled.svg'
+export { default as ChevronDown } from 'components/common/Icons/ChevronDown.svg'
+export { default as ChevronLeft } from 'components/common/Icons/ChevronLeft.svg'
+export { default as ChevronRight } from 'components/common/Icons/ChevronRight.svg'
+export { default as ChevronUp } from 'components/common/Icons/ChevronUp.svg'
+export { default as Circle } from 'components/common/Icons/Circle.svg'
+export { default as Coins } from 'components/common/Icons/Coins.svg'
+export { default as CoinsSwap } from 'components/common/Icons/CoinsSwap.svg'
+export { default as Compass } from 'components/common/Icons/Compass.svg'
+export { default as Copy } from 'components/common/Icons/Copy.svg'
+export { default as Cross } from 'components/common/Icons/Cross.svg'
+export { default as CrossCircled } from 'components/common/Icons/CrossCircled.svg'
+export { default as Edit } from 'components/common/Icons/Edit.svg'
+export { default as Enter } from 'components/common/Icons/Enter.svg'
+export { default as ExclamationMarkCircled } from 'components/common/Icons/ExclamationMarkCircled.svg'
+export { default as ExclamationMarkTriangle } from 'components/common/Icons/ExclamationMarkTriangle.svg'
+export { default as ExternalLink } from 'components/common/Icons/ExternalLink.svg'
+export { default as Flag } from 'components/common/Icons/Flag.svg'
+export { default as Gear } from 'components/common/Icons/Gear.svg'
+export { default as GridGlobe } from 'components/common/Icons/GridGlobe.svg'
+export { default as GridHole } from 'components/common/Icons/GridHole.svg'
+export { default as GridLandscape } from 'components/common/Icons/GridLandscape.svg'
+export { default as GridPlanet } from 'components/common/Icons/GridPlanet.svg'
+export { default as GridTire } from 'components/common/Icons/GridTire.svg'
+export { default as GridWeb } from 'components/common/Icons/GridWeb.svg'
+export { default as HandCoins } from 'components/common/Icons/HandCoins.svg'
+export { default as Heart } from 'components/common/Icons/Heart.svg'
+export { default as InfoCircle } from 'components/common/Icons/InfoCircle.svg'
+export { default as LockLocked } from 'components/common/Icons/LockLocked.svg'
+export { default as LockUnlocked } from 'components/common/Icons/LockUnlocked.svg'
+export { default as Logo } from 'components/common/Icons/Logo.svg'
+export { default as Luggage } from 'components/common/Icons/Luggage.svg'
+export { default as MarsProtocol } from 'components/common/Icons/MarsProtocol.svg'
+export { default as Neutron } from 'components/common/Icons/Neutron.svg'
+export { default as Osmo } from 'components/common/Icons/Osmo.svg'
+export { default as OverlayMark } from 'components/common/Icons/OverlayMark.svg'
+export { default as Plus } from 'components/common/Icons/Plus.svg'
+export { default as PlusCircled } from 'components/common/Icons/PlusCircled.svg'
+export { default as PlusSquared } from 'components/common/Icons/PlusSquared.svg'
+export { default as PythLogoType } from 'components/common/Icons/PythLogoType.svg'
+export { default as Questionmark } from 'components/common/Icons/Questionmark.svg'
+export { default as ReceiptCheck } from 'components/common/Icons/ReceiptCheck.svg'
+export { default as Scale } from 'components/common/Icons/Scale.svg'
+export { default as Search } from 'components/common/Icons/Search.svg'
+export { default as Shield } from 'components/common/Icons/Shield.svg'
+export { default as SortAsc } from 'components/common/Icons/SortAsc.svg'
+export { default as SortDesc } from 'components/common/Icons/SortDesc.svg'
+export { default as SortNone } from 'components/common/Icons/SortNone.svg'
+export { default as StarFilled } from 'components/common/Icons/StarFilled.svg'
+export { default as StarOutlined } from 'components/common/Icons/StarOutlined.svg'
+export { default as Subtract } from 'components/common/Icons/Subtract.svg'
+export { default as SwapIcon } from 'components/common/Icons/SwapIcon.svg'
+export { default as ThreeDots } from 'components/common/Icons/ThreeDots.svg'
+export { default as TooltipArrow } from 'components/common/Icons/TooltipArrow.svg'
+export { default as TrashBin } from 'components/common/Icons/TrashBin.svg'
+export { default as Twitter } from 'components/common/Icons/Twitter.svg'
+export { default as VerticalThreeLine } from 'components/common/Icons/VerticalThreeLine.svg'
+export { default as Wallet } from 'components/common/Icons/Wallet.svg'
+// @endindex
diff --git a/src/components/Intro.tsx b/src/components/common/Intro.tsx
similarity index 87%
rename from src/components/Intro.tsx
rename to src/components/common/Intro.tsx
index 9b38b6de..b4dff3c1 100644
--- a/src/components/Intro.tsx
+++ b/src/components/common/Intro.tsx
@@ -1,10 +1,17 @@
 import classNames from 'classnames'
 import { ReactNode } from 'react'
 
-import Card from 'components/Card'
-import { GridGlobe, GridHole, GridLandscape, GridPlanet, GridTire, GridWeb } from 'components/Icons'
-import Text from 'components/Text'
-import { Tooltip } from 'components/Tooltip'
+import Card from 'components/common/Card'
+import {
+  GridGlobe,
+  GridHole,
+  GridLandscape,
+  GridPlanet,
+  GridTire,
+  GridWeb,
+} from 'components/common/Icons'
+import Text from 'components/common/Text'
+import { Tooltip } from 'components/common/Tooltip'
 import useStore from 'store'
 
 interface Props {
diff --git a/src/components/LabelValuePair.tsx b/src/components/common/LabelValuePair.tsx
similarity index 86%
rename from src/components/LabelValuePair.tsx
rename to src/components/common/LabelValuePair.tsx
index 70bde7a6..9a2bcbba 100644
--- a/src/components/LabelValuePair.tsx
+++ b/src/components/common/LabelValuePair.tsx
@@ -1,7 +1,7 @@
 import classNames from 'classnames'
 
-import { FormattedNumber } from 'components/FormattedNumber'
-import Text from 'components/Text'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Text from 'components/common/Text'
 import { BN } from 'utils/helpers'
 
 interface ValueData extends FormattedNumberProps {
diff --git a/src/components/RangeInput/InputOverlay.tsx b/src/components/common/LeverageSlider/InputOverlay.tsx
similarity index 53%
rename from src/components/RangeInput/InputOverlay.tsx
rename to src/components/common/LeverageSlider/InputOverlay.tsx
index f68cce2c..b6d34665 100644
--- a/src/components/RangeInput/InputOverlay.tsx
+++ b/src/components/common/LeverageSlider/InputOverlay.tsx
@@ -1,18 +1,21 @@
 import classNames from 'classnames'
 
-import { VerticalThreeLine } from 'components/Icons'
+import { VerticalThreeLine } from 'components/common/Icons'
+import { LeverageSliderType } from 'components/common/LeverageSlider'
 import { formatValue } from 'utils/formatters'
 
 interface Props {
   value: number
   marginThreshold?: number
   max: number
+  type: LeverageSliderType
+  min: number
 }
 
 const THUMB_WIDTH = 33
 
-function InputOverlay({ max, value, marginThreshold }: Props) {
-  const thumbPosPercent = max === 0 ? 0 : 100 / (max / value)
+function InputOverlay({ max, value, marginThreshold, type, min }: Props) {
+  const thumbPosPercent = max === 0 ? 0 : 100 / ((max - min) / (value - min))
   const thumbPadRight = (thumbPosPercent / 100) * THUMB_WIDTH
   const markPosPercent = 100 / (max / (marginThreshold ?? 1))
   const markPadRight = (markPosPercent / 100) * THUMB_WIDTH
@@ -21,12 +24,16 @@ function InputOverlay({ max, value, marginThreshold }: Props) {
   return (
     <>
       <div
-        className='absolute flex-1 flex w-full justify-evenly bg-no-repeat top-[8.5px] pointer-events-none pt-[2.5px] pb-[2.5px] rounded-lg'
-        style={{
-          backgroundImage:
-            'linear-gradient(270deg, rgba(255, 97, 141, 0.89) 0%, rgba(66, 58, 70, 0.05) 100%)',
-          backgroundSize: `${thumbPosPercent}%`,
-        }}
+        className={classNames(
+          'absolute flex-1 flex w-full justify-evenly  top-[8.5px] pointer-events-none pt-[2.5px] pb-[2.5px] rounded-lg',
+          'before:absolute',
+          'before:top-0 before:bottom-0 before:right-0 before:left-0',
+          'slider-mask',
+          type === 'long' && 'before:gradient-slider-green',
+          type === 'short' && 'before:gradient-slider-red',
+          type === 'margin' && 'before:gradient-slider-pink',
+        )}
+        style={{ width: `${thumbPosPercent}%` }}
       >
         {Array.from(Array(9).keys()).map((i) => (
           <div key={`mark-${i}`} className='w-1 h-1 bg-black rounded-full bg-opacity-30' />
@@ -47,14 +54,22 @@ function InputOverlay({ max, value, marginThreshold }: Props) {
       </div>
       <div
         className={classNames(
-          'w-[33px] h-4 absolute text-[10px] top-[5px]',
+          'w-[36px] h-4.5 absolute text-[10px] top-[3.5px]',
           'pointer-events-none text-center font-bold',
-          'bg-pink shadow-md border-b-0 border-1',
-          'border-solid rounded-sm backdrop-blur-sm border-white/10',
+          'border rounded-sm border-white/20',
+          type === 'long' && 'bg-green',
+          type === 'short' && 'bg-error',
+          type === 'margin' && 'bg-pink',
         )}
         style={{ left: `calc(${thumbPosPercent}% - ${thumbPadRight}px)` }}
       >
-        {formatValue(value, { maxDecimals: 2, abbreviated: true, rounded: true })}
+        {formatValue(value, {
+          minDecimals: type !== 'margin' ? 1 : 2,
+          maxDecimals: type !== 'margin' ? 1 : 2,
+          abbreviated: true,
+          rounded: true,
+          suffix: type !== 'margin' ? 'x' : '',
+        })}
       </div>
     </>
   )
diff --git a/src/components/RangeInput/index.tsx b/src/components/common/LeverageSlider/index.tsx
similarity index 75%
rename from src/components/RangeInput/index.tsx
rename to src/components/common/LeverageSlider/index.tsx
index b5872152..e8b83a04 100644
--- a/src/components/RangeInput/index.tsx
+++ b/src/components/common/LeverageSlider/index.tsx
@@ -1,11 +1,12 @@
 import classNames from 'classnames'
 import { ChangeEvent, useCallback } from 'react'
 
-import InputOverlay from 'components/RangeInput/InputOverlay'
+import InputOverlay from 'components/common/LeverageSlider/InputOverlay'
 
 const LEFT_MARGIN = 5
 
 type Props = {
+  min?: number
   max: number
   value: number
   disabled?: boolean
@@ -13,10 +14,13 @@ type Props = {
   wrapperClassName?: string
   onChange: (value: number) => void
   onBlur?: () => void
+  type: LeverageSliderType
 }
 
-function RangeInput(props: Props) {
-  const { value, max, onChange, wrapperClassName, disabled, marginThreshold, onBlur } = props
+export type LeverageSliderType = 'margin' | 'long' | 'short'
+function LeverageSlider(props: Props) {
+  const { value, max, onChange, wrapperClassName, disabled, marginThreshold, onBlur, type } = props
+  const min = props.min ?? 0
 
   const handleOnChange = useCallback(
     (event: ChangeEvent<HTMLInputElement>) => {
@@ -26,7 +30,6 @@ function RangeInput(props: Props) {
   )
 
   const markPosPercent = 100 / (max / (marginThreshold ?? 1))
-
   return (
     <div
       className={classNames(
@@ -47,19 +50,25 @@ function RangeInput(props: Props) {
           type='range'
           value={value.toFixed(2)}
           step={max / 101}
-          min={0}
+          min={min}
           max={max}
           onChange={handleOnChange}
           onBlur={onBlur}
         />
-        <InputOverlay max={max} marginThreshold={marginThreshold} value={value} />
+        <InputOverlay
+          max={max}
+          marginThreshold={marginThreshold}
+          value={value}
+          type={type}
+          min={min}
+        />
       </div>
       <div className={'flex w-full justify-between text-xs text-opacity-50 text-white font-bold'}>
-        <span>{markPosPercent > LEFT_MARGIN ? 0 : ''}</span>
-        <span>{max.toFixed(2)}</span>
+        <span>{markPosPercent > LEFT_MARGIN ? min : ''}</span>
+        <span>{max.toFixed(type !== 'margin' ? 0 : 2)}</span>
       </div>
     </div>
   )
 }
 
-export default RangeInput
+export default LeverageSlider
diff --git a/src/components/Loading.tsx b/src/components/common/Loading.tsx
similarity index 100%
rename from src/components/Loading.tsx
rename to src/components/common/Loading.tsx
diff --git a/src/components/MarketDetails.tsx b/src/components/common/MarketDetails.tsx
similarity index 96%
rename from src/components/MarketDetails.tsx
rename to src/components/common/MarketDetails.tsx
index 0fb17a5c..269e2a70 100644
--- a/src/components/MarketDetails.tsx
+++ b/src/components/common/MarketDetails.tsx
@@ -1,8 +1,8 @@
 import { Row } from '@tanstack/react-table'
 import { useMemo } from 'react'
 
-import { FormattedNumber } from 'components/FormattedNumber'
-import TitleAndSubCell from 'components/TitleAndSubCell'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import TitleAndSubCell from 'components/common/TitleAndSubCell'
 import useDisplayCurrencyPrice from 'hooks/useDisplayCurrencyPrice'
 
 interface Props {
diff --git a/src/components/MigrationBanner.tsx b/src/components/common/MigrationBanner.tsx
similarity index 83%
rename from src/components/MigrationBanner.tsx
rename to src/components/common/MigrationBanner.tsx
index 6397aef1..65ca6205 100644
--- a/src/components/MigrationBanner.tsx
+++ b/src/components/common/MigrationBanner.tsx
@@ -1,10 +1,10 @@
-import Card from 'components/Card'
-import { Cross, ExclamationMarkCircled } from 'components/Icons'
-import Text from 'components/Text'
-import { TextLink } from 'components/TextLink'
+import Card from 'components/common/Card'
+import { Cross, ExclamationMarkCircled } from 'components/common/Icons'
+import Text from 'components/common/Text'
+import { TextLink } from 'components/common/TextLink'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import useStore from 'store'
 import { DocURL } from 'types/enums/docURL'
 
diff --git a/src/components/MobileNotSupported.tsx b/src/components/common/MobileNotSupported.tsx
similarity index 92%
rename from src/components/MobileNotSupported.tsx
rename to src/components/common/MobileNotSupported.tsx
index 4f242aed..b2c9dcae 100644
--- a/src/components/MobileNotSupported.tsx
+++ b/src/components/common/MobileNotSupported.tsx
@@ -1,7 +1,7 @@
 import Spline from '@splinetool/react-spline'
 
-import Button from 'components/Button'
-import Text from 'components/Text'
+import Button from 'components/common/Button'
+import Text from 'components/common/Text'
 import { DocURL } from 'types/enums/docURL'
 
 export default function MobileNotSupported() {
diff --git a/src/components/NotificationBanner.tsx b/src/components/common/NotificationBanner.tsx
similarity index 95%
rename from src/components/NotificationBanner.tsx
rename to src/components/common/NotificationBanner.tsx
index 62873eda..03223abc 100644
--- a/src/components/NotificationBanner.tsx
+++ b/src/components/common/NotificationBanner.tsx
@@ -1,8 +1,8 @@
 import classNames from 'classnames'
 import { useMemo } from 'react'
 
-import { CheckCircled, CrossCircled, ExclamationMarkTriangle } from 'components/Icons'
-import Text from 'components/Text'
+import { CheckCircled, CrossCircled, ExclamationMarkTriangle } from 'components/common/Icons'
+import Text from 'components/common/Text'
 
 interface Props {
   type: 'success' | 'error' | 'warning' | 'info'
diff --git a/src/components/NumberInput.tsx b/src/components/common/NumberInput.tsx
similarity index 100%
rename from src/components/NumberInput.tsx
rename to src/components/common/NumberInput.tsx
diff --git a/src/components/Overlay.tsx b/src/components/common/Overlay.tsx
similarity index 91%
rename from src/components/Overlay.tsx
rename to src/components/common/Overlay.tsx
index f682b51d..426ba90d 100644
--- a/src/components/Overlay.tsx
+++ b/src/components/common/Overlay.tsx
@@ -28,7 +28,7 @@ export default function Overlay(props: Props) {
         {props.children ? props.children : props.content}
       </div>
       <div
-        className='fixed top-0 left-0 z-40 block w-full h-full hover:cursor-pointer'
+        className='fixed inset-0 z-40 block w-full h-full hover:cursor-pointer'
         onClick={onClickAway}
         role='button'
       />
diff --git a/src/components/PageMetadata.tsx b/src/components/common/PageMetadata.tsx
similarity index 100%
rename from src/components/PageMetadata.tsx
rename to src/components/common/PageMetadata.tsx
diff --git a/src/components/ProgressBar.tsx b/src/components/common/ProgressBar.tsx
similarity index 100%
rename from src/components/ProgressBar.tsx
rename to src/components/common/ProgressBar.tsx
diff --git a/src/components/Radio.tsx b/src/components/common/Radio.tsx
similarity index 100%
rename from src/components/Radio.tsx
rename to src/components/common/Radio.tsx
diff --git a/src/components/SearchBar.tsx b/src/components/common/SearchBar.tsx
similarity index 95%
rename from src/components/SearchBar.tsx
rename to src/components/common/SearchBar.tsx
index 6d0e430c..b8e74b5a 100644
--- a/src/components/SearchBar.tsx
+++ b/src/components/common/SearchBar.tsx
@@ -1,7 +1,7 @@
 import classNames from 'classnames'
 import React, { ChangeEvent, LegacyRef } from 'react'
 
-import { Search } from 'components/Icons'
+import { Search } from 'components/common/Icons'
 
 interface Props {
   value: string
diff --git a/src/components/Select/Option.tsx b/src/components/common/Select/Option.tsx
similarity index 85%
rename from src/components/Select/Option.tsx
rename to src/components/common/Select/Option.tsx
index 1162d9ac..89fe8e25 100644
--- a/src/components/Select/Option.tsx
+++ b/src/components/common/Select/Option.tsx
@@ -1,13 +1,13 @@
 import classNames from 'classnames'
 
-import AssetImage from 'components/Asset/AssetImage'
-import AssetRate from 'components/Asset/AssetRate'
-import DisplayCurrency from 'components/DisplayCurrency'
-import { ChevronDown, ChevronRight } from 'components/Icons'
-import Text from 'components/Text'
-import { ASSETS } from 'constants/assets'
+import AssetImage from 'components/common/assets/AssetImage'
+import AssetRate from 'components/common/assets/AssetRate'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import { ChevronDown, ChevronRight } from 'components/common/Icons'
+import Text from 'components/common/Text'
 import { BN_ZERO } from 'constants/math'
-import useMarketAssets from 'hooks/useMarketAssets'
+import useAsset from 'hooks/assets/useAsset'
+import useMarketAssets from 'hooks/markets/useMarketAssets'
 import { BNCoin } from 'types/classes/BNCoin'
 import { byDenom } from 'utils/array'
 import { formatValue } from 'utils/formatters'
@@ -23,6 +23,7 @@ interface Props extends SelectOption {
 export default function Option(props: Props) {
   const isCoin = !!props.denom
   const { data: marketAssets } = useMarketAssets()
+  const asset = useAsset(props.denom || '')
 
   function handleOnClick(value: string | undefined) {
     if (!props.onClick || !value) return
@@ -30,9 +31,10 @@ export default function Option(props: Props) {
   }
 
   if (isCoin) {
-    const asset = ASSETS.find((asset) => asset.denom === props.denom) ?? ASSETS[0]
     const balance = props.amount ?? BN_ZERO
-    const marketAsset = marketAssets.find(byDenom(asset.denom))
+    const marketAsset = marketAssets.find(byDenom(props.denom || ''))
+
+    if (!asset || !marketAsset) return null
 
     if (props.isDisplay) {
       return (
diff --git a/src/components/Select/index.tsx b/src/components/common/Select/index.tsx
similarity index 95%
rename from src/components/Select/index.tsx
rename to src/components/common/Select/index.tsx
index 1cd90599..762ebb8c 100644
--- a/src/components/Select/index.tsx
+++ b/src/components/common/Select/index.tsx
@@ -1,10 +1,10 @@
 import classNames from 'classnames'
 import { useEffect, useState } from 'react'
 
-import { ChevronDown } from 'components/Icons'
-import Overlay from 'components/Overlay'
-import Option from 'components/Select/Option'
-import Text from 'components/Text'
+import { ChevronDown } from 'components/common/Icons'
+import Overlay from 'components/common/Overlay'
+import Option from 'components/common/Select/Option'
+import Text from 'components/common/Text'
 import useToggle from 'hooks/useToggle'
 
 interface Props {
diff --git a/src/components/Settings.tsx b/src/components/common/Settings.tsx
similarity index 73%
rename from src/components/Settings.tsx
rename to src/components/common/Settings.tsx
index e02fdbe1..403fe1b0 100644
--- a/src/components/Settings.tsx
+++ b/src/components/common/Settings.tsx
@@ -1,5 +1,5 @@
-import Button from 'components/Button'
-import { Gear } from 'components/Icons'
+import Button from 'components/common/Button'
+import { Gear } from 'components/common/Icons'
 import useStore from 'store'
 
 export default function Settings() {
diff --git a/src/components/ShareBar.tsx b/src/components/common/ShareBar.tsx
similarity index 87%
rename from src/components/ShareBar.tsx
rename to src/components/common/ShareBar.tsx
index 9cea8d2e..e0f84443 100644
--- a/src/components/ShareBar.tsx
+++ b/src/components/common/ShareBar.tsx
@@ -2,10 +2,10 @@ import classNames from 'classnames'
 import { useLocation, useParams } from 'react-router-dom'
 import useClipboard from 'react-use-clipboard'
 
-import Button from 'components/Button'
-import { Chain, Check, Twitter } from 'components/Icons'
-import Text from 'components/Text'
-import { Tooltip } from 'components/Tooltip'
+import Button from 'components/common/Button'
+import { Chain, Check, Twitter } from 'components/common/Icons'
+import Text from 'components/common/Text'
+import { Tooltip } from 'components/common/Tooltip'
 import ConditionalWrapper from 'hocs/ConditionalWrapper'
 import { DocURL } from 'types/enums/docURL'
 
diff --git a/src/components/Slider/LeverageLabel.tsx b/src/components/common/Slider/LeverageLabel.tsx
similarity index 93%
rename from src/components/Slider/LeverageLabel.tsx
rename to src/components/common/Slider/LeverageLabel.tsx
index 3611429f..d2e1c3a7 100644
--- a/src/components/Slider/LeverageLabel.tsx
+++ b/src/components/common/Slider/LeverageLabel.tsx
@@ -1,6 +1,6 @@
 import classNames from 'classnames'
 
-import Text from 'components/Text'
+import Text from 'components/common/Text'
 
 interface Props {
   className?: string
diff --git a/src/components/Slider/Mark.tsx b/src/components/common/Slider/Mark.tsx
similarity index 100%
rename from src/components/Slider/Mark.tsx
rename to src/components/common/Slider/Mark.tsx
diff --git a/src/components/Slider/Track.tsx b/src/components/common/Slider/Track.tsx
similarity index 100%
rename from src/components/Slider/Track.tsx
rename to src/components/common/Slider/Track.tsx
diff --git a/src/components/Slider/index.tsx b/src/components/common/Slider/index.tsx
similarity index 96%
rename from src/components/Slider/index.tsx
rename to src/components/common/Slider/index.tsx
index 047d8e19..eafb45a1 100644
--- a/src/components/Slider/index.tsx
+++ b/src/components/common/Slider/index.tsx
@@ -2,10 +2,10 @@ import classNames from 'classnames'
 import { ChangeEvent, useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import Draggable from 'react-draggable'
 
-import { OverlayMark } from 'components/Icons'
-import LeverageLabel from 'components/Slider/LeverageLabel'
-import Mark from 'components/Slider/Mark'
-import Track from 'components/Slider/Track'
+import { OverlayMark } from 'components/common/Icons'
+import LeverageLabel from 'components/common/Slider/LeverageLabel'
+import Mark from 'components/common/Slider/Mark'
+import Track from 'components/common/Slider/Track'
 import useToggle from 'hooks/useToggle'
 
 const colors = {
diff --git a/src/components/Spacer.tsx b/src/components/common/Spacer.tsx
similarity index 100%
rename from src/components/Spacer.tsx
rename to src/components/common/Spacer.tsx
diff --git a/src/components/SummaryItems.tsx b/src/components/common/SummaryItems.tsx
similarity index 82%
rename from src/components/SummaryItems.tsx
rename to src/components/common/SummaryItems.tsx
index f5a66488..b0742161 100644
--- a/src/components/SummaryItems.tsx
+++ b/src/components/common/SummaryItems.tsx
@@ -1,9 +1,9 @@
 import classNames from 'classnames'
 import React from 'react'
 
-import { FormattedNumber } from 'components/FormattedNumber'
-import Text from 'components/Text'
-import WarningMessages from 'components/WarningMessages'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Text from 'components/common/Text'
+import WarningMessages from 'components/common/WarningMessages'
 
 interface Props {
   items: SummaryItem[]
diff --git a/src/components/common/SummaryLine.tsx b/src/components/common/SummaryLine.tsx
new file mode 100644
index 00000000..c9cbb3bf
--- /dev/null
+++ b/src/components/common/SummaryLine.tsx
@@ -0,0 +1,19 @@
+import classNames from 'classnames'
+import React from 'react'
+
+const infoLineClasses = 'flex flex-row justify-between flex-1 mb-1 text-xs text-white'
+
+interface SummaryLineProps {
+  children: React.ReactNode
+  className?: string
+  contentClassName?: string
+  label: string
+}
+export default function SummaryLine(props: SummaryLineProps) {
+  return (
+    <div className={classNames(infoLineClasses, props.className)}>
+      <span className='opacity-40'>{props.label}</span>
+      <span className={props.contentClassName}>{props.children}</span>
+    </div>
+  )
+}
diff --git a/src/components/Switch/SwitchAutoLend.tsx b/src/components/common/Switch/SwitchAutoLend.tsx
similarity index 76%
rename from src/components/Switch/SwitchAutoLend.tsx
rename to src/components/common/Switch/SwitchAutoLend.tsx
index 7d711701..c53f24b2 100644
--- a/src/components/Switch/SwitchAutoLend.tsx
+++ b/src/components/common/Switch/SwitchAutoLend.tsx
@@ -1,11 +1,9 @@
 import classNames from 'classnames'
 import { useCallback } from 'react'
 
-import SwitchWithLabel from 'components/Switch/SwitchWithLabel'
-import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
-import { LocalStorageKeys } from 'constants/localStorageKeys'
+import SwitchWithLabel from 'components/common/Switch/SwitchWithLabel'
+import useEnableAutoLendGlobal from 'hooks/localStorage/useEnableAutoLendGlobal'
 import useAutoLend from 'hooks/useAutoLend'
-import useLocalStorage from 'hooks/useLocalStorage'
 
 interface Props {
   accountId: string
@@ -16,10 +14,7 @@ export default function SwitchAutoLend(props: Props) {
   const { accountId, className } = props
   const { autoLendEnabledAccountIds, disableAutoLend, enableAutoLend } = useAutoLend()
   const isAutoLendEnabledForAccount = autoLendEnabledAccountIds.includes(accountId)
-  const [isAutoLendEnabled, setIsAutoLendEnabled] = useLocalStorage<boolean>(
-    LocalStorageKeys.LEND_ASSETS,
-    DEFAULT_SETTINGS.lendAssets,
-  )
+  const [_, setIsAutoLendEnabled] = useEnableAutoLendGlobal()
 
   const handleToggle = useCallback(() => {
     if (!isAutoLendEnabledForAccount) {
diff --git a/src/components/Switch/SwitchWithLabel.tsx b/src/components/common/Switch/SwitchWithLabel.tsx
similarity index 85%
rename from src/components/Switch/SwitchWithLabel.tsx
rename to src/components/common/Switch/SwitchWithLabel.tsx
index 7ecc216b..63714416 100644
--- a/src/components/Switch/SwitchWithLabel.tsx
+++ b/src/components/common/Switch/SwitchWithLabel.tsx
@@ -1,8 +1,8 @@
 import classNames from 'classnames'
 
-import Switch from 'components/Switch'
-import Text from 'components/Text'
-import { Tooltip } from 'components/Tooltip'
+import Switch from 'components/common/Switch/index'
+import Text from 'components/common/Text'
+import { Tooltip } from 'components/common/Tooltip'
 
 interface Props {
   name: string
diff --git a/src/components/Switch/index.tsx b/src/components/common/Switch/index.tsx
similarity index 100%
rename from src/components/Switch/index.tsx
rename to src/components/common/Switch/index.tsx
diff --git a/src/components/Table/ActionButtonRow.tsx b/src/components/common/Table/ActionButtonRow.tsx
similarity index 93%
rename from src/components/Table/ActionButtonRow.tsx
rename to src/components/common/Table/ActionButtonRow.tsx
index 16faf1af..5d791752 100644
--- a/src/components/Table/ActionButtonRow.tsx
+++ b/src/components/common/Table/ActionButtonRow.tsx
@@ -1,7 +1,7 @@
 import { Row as TanstackRow } from '@tanstack/react-table'
 import { ReactNode } from 'react'
 
-import Text from 'components/Text'
+import Text from 'components/common/Text'
 
 interface Props<T> {
   row: TanstackRow<T>
diff --git a/src/components/common/Table/Row.tsx b/src/components/common/Table/Row.tsx
new file mode 100644
index 00000000..c7f44d3e
--- /dev/null
+++ b/src/components/common/Table/Row.tsx
@@ -0,0 +1,71 @@
+import { flexRender, Row as TanstackRow, Table as TanstackTable } from '@tanstack/react-table'
+import classNames from 'classnames'
+
+interface Props<T> {
+  row: TanstackRow<T>
+  table: TanstackTable<T>
+  renderExpanded?: (row: TanstackRow<T>, table: TanstackTable<T>) => JSX.Element
+  rowClassName?: string
+  spacingClassName?: string
+  className?: string
+  isSelectable?: boolean
+  type?: TableType
+}
+
+function getBorderColor(type: TableType, row: AccountBalanceRow | AccountPerpRow) {
+  if (type === 'balances') {
+    const balancesRow = row as AccountBalanceRow
+    return balancesRow.type === 'borrow' ? 'border-loss' : 'border-profit'
+  }
+
+  const perpRow = row as AccountPerpRow
+  return perpRow.tradeDirection === 'short' ? 'border-loss' : 'border-profit'
+}
+
+export default function Row<T>(props: Props<T>) {
+  const { renderExpanded, table, row, type, spacingClassName, isSelectable } = props
+  const canExpand = !!renderExpanded
+
+  return (
+    <>
+      <tr
+        key={`${row.id}-row`}
+        className={classNames(
+          'group/row transition-bg',
+          (renderExpanded || isSelectable) && 'hover:cursor-pointer',
+          canExpand && row.getIsExpanded() ? 'is-expanded bg-black/20' : 'hover:bg-white/5',
+        )}
+        onClick={(e) => {
+          e.preventDefault()
+          if (isSelectable) {
+            row.toggleSelected()
+          }
+          if (canExpand) {
+            const isExpanded = row.getIsExpanded()
+            table.resetExpanded()
+            !isExpanded && row.toggleExpanded()
+          }
+        }}
+      >
+        {row.getVisibleCells().map((cell) => {
+          const isSymbolOrName = cell.column.id === 'symbol' || cell.column.id === 'name'
+          return (
+            <td
+              key={cell.id}
+              className={classNames(
+                isSymbolOrName ? 'text-left' : 'text-right',
+                spacingClassName ?? 'px-3 py-4',
+                type && isSymbolOrName && 'border-l',
+                type && getBorderColor(type, cell.row.original as any),
+                cell.column.columnDef.meta?.className,
+              )}
+            >
+              {flexRender(cell.column.columnDef.cell, cell.getContext())}
+            </td>
+          )
+        })}
+      </tr>
+      {row.getIsExpanded() && renderExpanded && renderExpanded(row, table)}
+    </>
+  )
+}
diff --git a/src/components/TableSkeleton.tsx b/src/components/common/Table/TableSkeleton.tsx
similarity index 93%
rename from src/components/TableSkeleton.tsx
rename to src/components/common/Table/TableSkeleton.tsx
index 68b27e8f..0dea9670 100644
--- a/src/components/TableSkeleton.tsx
+++ b/src/components/common/Table/TableSkeleton.tsx
@@ -1,8 +1,8 @@
 import classNames from 'classnames'
 
-import { SortNone } from 'components/Icons'
-import Loading from 'components/Loading'
-import Text from 'components/Text'
+import { SortNone } from 'components/common/Icons'
+import Loading from 'components/common/Loading'
+import Text from 'components/common/Text'
 
 interface Props {
   labels: string[]
diff --git a/src/components/Table/index.tsx b/src/components/common/Table/index.tsx
similarity index 83%
rename from src/components/Table/index.tsx
rename to src/components/common/Table/index.tsx
index 2502f372..660d2fdc 100644
--- a/src/components/Table/index.tsx
+++ b/src/components/common/Table/index.tsx
@@ -3,6 +3,8 @@ import {
   flexRender,
   getCoreRowModel,
   getSortedRowModel,
+  OnChangeFn,
+  RowSelectionState,
   SortingState,
   Row as TanstackRow,
   Table as TanstackTable,
@@ -11,10 +13,10 @@ import {
 import classNames from 'classnames'
 import React from 'react'
 
-import Card from 'components/Card'
-import { SortAsc, SortDesc, SortNone } from 'components/Icons'
-import Row from 'components/Table/Row'
-import Text from 'components/Text'
+import Card from 'components/common/Card'
+import { SortAsc, SortDesc, SortNone } from 'components/common/Icons'
+import Row from 'components/common/Table/Row'
+import Text from 'components/common/Text'
 import ConditionalWrapper from 'hocs/ConditionalWrapper'
 
 interface Props<T> {
@@ -25,8 +27,10 @@ interface Props<T> {
   renderExpanded?: (row: TanstackRow<T>, table: TanstackTable<T>) => JSX.Element
   tableBodyClassName?: string
   spacingClassName?: string
-  isBalancesTable?: boolean
+  type?: TableType
   hideCard?: boolean
+  setRowSelection?: OnChangeFn<RowSelectionState>
+  selectedRows?: RowSelectionState
 }
 
 export default function Table<T>(props: Props<T>) {
@@ -37,7 +41,10 @@ export default function Table<T>(props: Props<T>) {
     columns: props.columns,
     state: {
       sorting,
+      rowSelection: props.selectedRows,
     },
+    enableRowSelection: true,
+    onRowSelectionChange: props.setRowSelection,
     onSortingChange: setSorting,
     getCoreRowModel: getCoreRowModel(),
     getSortedRowModel: getSortedRowModel(),
@@ -48,7 +55,7 @@ export default function Table<T>(props: Props<T>) {
       condition={!props.hideCard}
       wrapper={(children) => (
         <Card
-          className={classNames('w-full', !props.isBalancesTable && 'h-fit bg-white/5')}
+          className={classNames('w-full', props.type !== 'balances' && 'h-fit bg-white/5')}
           title={props.title}
         >
           {children}
@@ -80,7 +87,7 @@ export default function Table<T>(props: Props<T>) {
                         'align-center',
                       )}
                     >
-                      <span className='w-5 h-5 text-white'>
+                      <span className='w-5 h-5 my-auto text-white'>
                         {header.column.getCanSort()
                           ? {
                               asc: <SortAsc size={16} />,
@@ -111,7 +118,8 @@ export default function Table<T>(props: Props<T>) {
               table={table}
               renderExpanded={props.renderExpanded}
               spacingClassName={props.spacingClassName}
-              isBalancesTable={props.isBalancesTable}
+              isSelectable={!!props.setRowSelection}
+              type={props.type}
             />
           ))}
         </tbody>
diff --git a/src/components/TermsOfService.tsx b/src/components/common/TermsOfService.tsx
similarity index 89%
rename from src/components/TermsOfService.tsx
rename to src/components/common/TermsOfService.tsx
index eb3d96cc..0dadc568 100644
--- a/src/components/TermsOfService.tsx
+++ b/src/components/common/TermsOfService.tsx
@@ -1,12 +1,12 @@
 import classNames from 'classnames'
 import { useCallback } from 'react'
 
-import FullOverlayContent from 'components/FullOverlayContent'
-import { Check } from 'components/Icons'
-import Text from 'components/Text'
+import FullOverlayContent from 'components/common/FullOverlayContent'
+import { Check } from 'components/common/Icons'
+import Text from 'components/common/Text'
 import WalletSelect from 'components/Wallet/WalletSelect'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import useStore from 'store'
 
 interface BenefitsProps {
diff --git a/src/components/Text.tsx b/src/components/common/Text.tsx
similarity index 100%
rename from src/components/Text.tsx
rename to src/components/common/Text.tsx
diff --git a/src/components/TextLink.tsx b/src/components/common/TextLink.tsx
similarity index 100%
rename from src/components/TextLink.tsx
rename to src/components/common/TextLink.tsx
diff --git a/src/components/TitleAndSubCell.tsx b/src/components/common/TitleAndSubCell.tsx
similarity index 93%
rename from src/components/TitleAndSubCell.tsx
rename to src/components/common/TitleAndSubCell.tsx
index 638468aa..80ab2fcd 100644
--- a/src/components/TitleAndSubCell.tsx
+++ b/src/components/common/TitleAndSubCell.tsx
@@ -1,6 +1,6 @@
 import classNames from 'classnames'
 
-import Text from 'components/Text'
+import Text from 'components/common/Text'
 
 interface Props {
   title: string | React.ReactNode
diff --git a/src/components/Toaster/index.tsx b/src/components/common/Toaster/index.tsx
similarity index 89%
rename from src/components/Toaster/index.tsx
rename to src/components/common/Toaster/index.tsx
index 8680a861..9e27b26d 100644
--- a/src/components/Toaster/index.tsx
+++ b/src/components/common/Toaster/index.tsx
@@ -3,15 +3,14 @@ import { ReactNode } from 'react'
 import { Slide, ToastContainer, toast as toastify } from 'react-toastify'
 import { mutate } from 'swr'
 
-import { CheckMark } from 'components/CheckMark'
-import { CircularProgress } from 'components/CircularProgress'
-import { ChevronDown, Cross, CrossCircled, ExternalLink } from 'components/Icons'
-import Text from 'components/Text'
-import { TextLink } from 'components/TextLink'
+import { CheckMark } from 'components/common/CheckMark'
+import { CircularProgress } from 'components/common/CircularProgress'
+import { ChevronDown, Cross, CrossCircled, ExternalLink } from 'components/common/Icons'
+import Text from 'components/common/Text'
+import { TextLink } from 'components/common/TextLink'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
-import { EXPLORER_NAME, EXPLORER_TX_URL } from 'constants/explorer'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import useTransactionStore from 'hooks/useTransactionStore'
 import useStore from 'store'
 import { formatAmountWithSymbol } from 'utils/formatters'
@@ -28,7 +27,7 @@ function isPromise(object?: any): object is ToastPending {
   return 'promise' in object
 }
 
-export function generateToastContent(content: ToastSuccess['content']): ReactNode {
+export function generateToastContent(content: ToastSuccess['content'], assets: Asset[]): ReactNode {
   return content.map((item, index) => (
     <div className='flex flex-wrap w-full mb-1' key={index}>
       {item.text && (
@@ -44,7 +43,7 @@ export function generateToastContent(content: ToastSuccess['content']): ReactNod
 
                 return BN(coin.amount).isZero() ? null : (
                   <li className='w-full p-0 text-sm text-white' key={coin.denom}>
-                    {`${prefix}${formatAmountWithSymbol(coin)}`}
+                    {`${prefix}${formatAmountWithSymbol(coin, assets)}`}
                   </li>
                 )
               })}
@@ -61,6 +60,8 @@ export default function Toaster() {
     LocalStorageKeys.REDUCE_MOTION,
     DEFAULT_SETTINGS.reduceMotion,
   )
+  const chainConfig = useStore((s) => s.chainConfig)
+
   const toast = useStore((s) => s.toast)
   const { addTransaction } = useTransactionStore()
 
@@ -146,19 +147,21 @@ export default function Toaster() {
               {toast.message}
             </Text>
           )}
-          {!isError && toast.content?.length > 0 && generateToastContent(toast.content)}
+          {!isError &&
+            toast.content?.length > 0 &&
+            generateToastContent(toast.content, chainConfig.assets)}
           {toast.hash && (
             <div className='w-full'>
               <TextLink
-                href={`${EXPLORER_TX_URL}${toast.hash}`}
+                href={`${chainConfig.endpoints.explorer}${toast.hash}`}
                 target='_blank'
                 className={classNames(
                   'leading-4 underline mt-4 hover:no-underline hover:text-white',
                   isError ? 'text-error' : 'text-success',
                 )}
-                title={`View on ${EXPLORER_NAME}`}
+                title={`View on ${chainConfig.explorerName}`}
               >
-                {`View on ${EXPLORER_NAME}`}
+                {`View on ${chainConfig.explorerName}`}
                 <ExternalLink className='-mt-0.5 ml-2 inline w-3.5' />
               </TextLink>
             </div>
diff --git a/src/components/TokenInput/TokenInputWithSlider.tsx b/src/components/common/TokenInput/TokenInputWithSlider.tsx
similarity index 95%
rename from src/components/TokenInput/TokenInputWithSlider.tsx
rename to src/components/common/TokenInput/TokenInputWithSlider.tsx
index 7519597b..ee8b8813 100644
--- a/src/components/TokenInput/TokenInputWithSlider.tsx
+++ b/src/components/common/TokenInput/TokenInputWithSlider.tsx
@@ -1,8 +1,8 @@
 import BigNumber from 'bignumber.js'
 import { useEffect, useState } from 'react'
 
-import Slider from 'components/Slider'
-import TokenInput from 'components/TokenInput'
+import Slider from 'components/common/Slider'
+import TokenInput from 'components/common/TokenInput/index'
 import { BN_ZERO } from 'constants/math'
 import { BNCoin } from 'types/classes/BNCoin'
 import { BN } from 'utils/helpers'
diff --git a/src/components/TokenInput/index.tsx b/src/components/common/TokenInput/index.tsx
similarity index 82%
rename from src/components/TokenInput/index.tsx
rename to src/components/common/TokenInput/index.tsx
index 1cf511a1..b88619b3 100644
--- a/src/components/TokenInput/index.tsx
+++ b/src/components/common/TokenInput/index.tsx
@@ -1,17 +1,17 @@
 import BigNumber from 'bignumber.js'
 import classNames from 'classnames'
 
-import AssetImage from 'components/Asset/AssetImage'
-import Button from 'components/Button'
-import DisplayCurrency from 'components/DisplayCurrency'
-import { FormattedNumber } from 'components/FormattedNumber'
-import { TrashBin } from 'components/Icons'
-import NumberInput from 'components/NumberInput'
-import Select from 'components/Select'
-import Text from 'components/Text'
-import WarningMessages from 'components/WarningMessages'
-import { ASSETS } from 'constants/assets'
-import useStore from 'store'
+import AssetImage from 'components/common/assets/AssetImage'
+import Button from 'components/common/Button'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import { TrashBin } from 'components/common/Icons'
+import NumberInput from 'components/common/NumberInput'
+import Select from 'components/common/Select'
+import Text from 'components/common/Text'
+import WarningMessages from 'components/common/WarningMessages'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import useBaseAsset from 'hooks/assets/useBasetAsset'
 import { BNCoin } from 'types/classes/BNCoin'
 import { BN } from 'utils/helpers'
 
@@ -32,15 +32,15 @@ interface Props {
 }
 
 export default function TokenInput(props: Props) {
-  const baseCurrency = useStore((s) => s.baseCurrency)
-
+  const baseAsset = useBaseAsset()
+  const assets = useAllAssets()
   function onMaxBtnClick() {
     props.onChange(BN(props.max))
   }
 
   function onChangeAsset(denom: string) {
     if (!props.onChangeAsset) return
-    const newAsset = ASSETS.find((asset) => asset.denom === denom) ?? baseCurrency
+    const newAsset = assets.find((asset) => asset.denom === denom) ?? baseAsset
     props.onChangeAsset(newAsset)
   }
 
diff --git a/src/components/Tooltip/TooltipContent.tsx b/src/components/common/Tooltip/TooltipContent.tsx
similarity index 83%
rename from src/components/Tooltip/TooltipContent.tsx
rename to src/components/common/Tooltip/TooltipContent.tsx
index b2832bc8..b72af6b9 100644
--- a/src/components/Tooltip/TooltipContent.tsx
+++ b/src/components/common/Tooltip/TooltipContent.tsx
@@ -1,8 +1,8 @@
 import classNames from 'classnames'
 import { ReactNode } from 'react'
 
-import { TooltipArrow } from 'components/Icons'
-import Text from 'components/Text'
+import { TooltipArrow } from 'components/common/Icons'
+import Text from 'components/common/Text'
 
 interface Props {
   content: ReactNode | string
@@ -16,7 +16,7 @@ export default function TooltipContent(props: Props) {
     <div>
       <div
         className={classNames(
-          'flex max-w-[320px] flex-1 gap-2 rounded-sm py-1 px-2 text-sm shadow-tooltip backdrop-blur-lg',
+          'flex max-w-[320px] flex-1 gap-2 rounded-sm p-3 text-sm shadow-tooltip backdrop-blur-lg',
           props.type === 'info' && 'bg-white/20',
           props.type === 'warning' && 'bg-warning',
           props.type === 'error' && 'bg-error',
diff --git a/src/components/Tooltip/index.tsx b/src/components/common/Tooltip/index.tsx
similarity index 88%
rename from src/components/Tooltip/index.tsx
rename to src/components/common/Tooltip/index.tsx
index 0ff1acc0..c5260681 100644
--- a/src/components/Tooltip/index.tsx
+++ b/src/components/common/Tooltip/index.tsx
@@ -2,11 +2,11 @@ import Tippy, { TippyProps } from '@tippyjs/react'
 import classNames from 'classnames'
 import { ReactNode } from 'react'
 
-import { Questionmark } from 'components/Icons'
-import TooltipContent from 'components/Tooltip/TooltipContent'
+import { Questionmark } from 'components/common/Icons'
+import TooltipContent from 'components/common/Tooltip/TooltipContent'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 
 interface Props extends TippyProps {
   content: ReactNode | string
@@ -51,7 +51,7 @@ export const Tooltip = (props: Props) => {
         <span
           className={classNames(
             props.underline &&
-              'border-b-1 hover:cursor-pointer border border-x-0 border-t-0 border-dashed border-white/50 hover:border-transparent',
+              'border-b-1 hover:cursor-pointer border border-x-0 border-t-0 border-dashed border-white/20 pb-1',
             !reduceMotion && 'transition-all',
             props.className,
           )}
diff --git a/src/components/common/TradeDirectionSelector.tsx b/src/components/common/TradeDirectionSelector.tsx
new file mode 100644
index 00000000..577515d1
--- /dev/null
+++ b/src/components/common/TradeDirectionSelector.tsx
@@ -0,0 +1,67 @@
+import classNames from 'classnames'
+import { useMemo } from 'react'
+
+import Text from 'components/common/Text'
+
+interface Props {
+  direction: TradeDirection
+  onChangeDirection: (direction: TradeDirection) => void
+  asset?: Asset
+}
+
+export function TradeDirectionSelector(props: Props) {
+  return (
+    <div className='flex rounded-sm bg-black/20'>
+      <Direction
+        onClick={() => props.onChangeDirection('long')}
+        direction={'long'}
+        isActive={props.direction === 'long'}
+        asset={props.asset}
+      />
+      <Direction
+        onClick={() => props.onChangeDirection('short')}
+        direction={'short'}
+        isActive={props.direction === 'short'}
+        asset={props.asset}
+      />
+    </div>
+  )
+}
+
+interface DirectionProps {
+  direction: TradeDirection
+  isActive: boolean
+  onClick: () => void
+  asset?: Asset
+}
+function Direction(props: DirectionProps) {
+  const classString = props.direction === 'long' ? 'success' : 'error'
+
+  const label = useMemo(() => {
+    if (props.asset) {
+      return props.direction === 'long' ? `Buy ${props.asset.symbol}` : `Sell ${props.asset.symbol}`
+    } else {
+      return props.direction === 'long' ? 'Long' : 'Short'
+    }
+  }, [props.asset, props.direction])
+
+  return (
+    <button
+      className={classNames(
+        'px-4 py-3 rounded-sm flex-1',
+        props.isActive && 'border bg-white/10',
+        `border-${classString}`,
+      )}
+      onClick={props.onClick}
+    >
+      <Text
+        className={classNames(
+          'text-center first-letter:uppercase',
+          props.isActive ? `text-${classString}` : 'text-white/20',
+        )}
+      >
+        {label}
+      </Text>
+    </button>
+  )
+}
diff --git a/src/components/WarningMessages.tsx b/src/components/common/WarningMessages.tsx
similarity index 86%
rename from src/components/WarningMessages.tsx
rename to src/components/common/WarningMessages.tsx
index c8923db4..c90920b3 100644
--- a/src/components/WarningMessages.tsx
+++ b/src/components/common/WarningMessages.tsx
@@ -1,7 +1,7 @@
-import Divider from 'components/Divider'
-import { ExclamationMarkTriangle, InfoCircle } from 'components/Icons'
-import Text from 'components/Text'
-import { Tooltip } from 'components/Tooltip'
+import Divider from 'components/common/Divider'
+import { ExclamationMarkTriangle, InfoCircle } from 'components/common/Icons'
+import Text from 'components/common/Text'
+import { Tooltip } from 'components/common/Tooltip'
 
 interface Props {
   messages: string[]
diff --git a/src/components/common/assets/AssetAmount.tsx b/src/components/common/assets/AssetAmount.tsx
new file mode 100644
index 00000000..38168c1f
--- /dev/null
+++ b/src/components/common/assets/AssetAmount.tsx
@@ -0,0 +1,18 @@
+import { FormattedNumber } from 'components/common/FormattedNumber'
+
+type Props = {
+  asset: Asset
+  amount: number
+}
+export default function AssetAmount(props: Props) {
+  return (
+    <FormattedNumber
+      amount={props.amount}
+      options={{
+        decimals: props.asset.decimals,
+        maxDecimals: props.asset.decimals,
+        suffix: props.asset.symbol,
+      }}
+    />
+  )
+}
diff --git a/src/components/Asset/AssetBalanceRow.tsx b/src/components/common/assets/AssetBalanceRow.tsx
similarity index 79%
rename from src/components/Asset/AssetBalanceRow.tsx
rename to src/components/common/assets/AssetBalanceRow.tsx
index 29a73b3e..5d2554af 100644
--- a/src/components/Asset/AssetBalanceRow.tsx
+++ b/src/components/common/assets/AssetBalanceRow.tsx
@@ -1,7 +1,7 @@
-import AssetImage from 'components/Asset/AssetImage'
-import DisplayCurrency from 'components/DisplayCurrency'
-import { FormattedNumber } from 'components/FormattedNumber'
-import Text from 'components/Text'
+import AssetImage from 'components/common/assets/AssetImage'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Text from 'components/common/Text'
 import { BNCoin } from 'types/classes/BNCoin'
 import { demagnify } from 'utils/formatters'
 
diff --git a/src/components/Asset/AssetImage.tsx b/src/components/common/assets/AssetImage.tsx
similarity index 100%
rename from src/components/Asset/AssetImage.tsx
rename to src/components/common/assets/AssetImage.tsx
diff --git a/src/components/Asset/AssetRate.tsx b/src/components/common/assets/AssetRate.tsx
similarity index 84%
rename from src/components/Asset/AssetRate.tsx
rename to src/components/common/assets/AssetRate.tsx
index b40e8ae0..1bcc4526 100644
--- a/src/components/Asset/AssetRate.tsx
+++ b/src/components/common/assets/AssetRate.tsx
@@ -1,9 +1,9 @@
 import classNames from 'classnames'
 
-import { FormattedNumber } from 'components/FormattedNumber'
-import { InfoCircle } from 'components/Icons'
-import Text from 'components/Text'
-import { Tooltip } from 'components/Tooltip'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import { InfoCircle } from 'components/common/Icons'
+import Text from 'components/common/Text'
+import { Tooltip } from 'components/common/Tooltip'
 
 interface Props {
   rate: number
diff --git a/src/components/Asset/AssetSymbol.tsx b/src/components/common/assets/AssetSymbol.tsx
similarity index 86%
rename from src/components/Asset/AssetSymbol.tsx
rename to src/components/common/assets/AssetSymbol.tsx
index becc4d71..3d7837db 100644
--- a/src/components/Asset/AssetSymbol.tsx
+++ b/src/components/common/assets/AssetSymbol.tsx
@@ -1,4 +1,4 @@
-import Text from 'components/Text'
+import Text from 'components/common/Text'
 
 interface Props {
   symbol: string
diff --git a/src/components/common/chain/ChainLogo.tsx b/src/components/common/chain/ChainLogo.tsx
new file mode 100644
index 00000000..8a2a8382
--- /dev/null
+++ b/src/components/common/chain/ChainLogo.tsx
@@ -0,0 +1,20 @@
+import { Neutron, Osmo } from 'components/common/Icons'
+import { ChainInfoID } from 'types/enums/wallet'
+
+interface Props {
+  chainID: ChainInfoID
+  className?: string
+}
+
+export default function ChainLogo(props: Props) {
+  const { chainID, className } = props
+
+  switch (chainID) {
+    case ChainInfoID.Pion1:
+    case ChainInfoID.Neutron1:
+      return <Neutron className={className} />
+
+    default:
+      return <Osmo className={className} />
+  }
+}
diff --git a/src/components/Earn/Tab.tsx b/src/components/earn/Tab.tsx
similarity index 100%
rename from src/components/Earn/Tab.tsx
rename to src/components/earn/Tab.tsx
diff --git a/src/components/Earn/Farm/FarmIntro.tsx b/src/components/earn/farm/FarmIntro.tsx
similarity index 84%
rename from src/components/Earn/Farm/FarmIntro.tsx
rename to src/components/earn/farm/FarmIntro.tsx
index 7b7b48bc..6edbab6a 100644
--- a/src/components/Earn/Farm/FarmIntro.tsx
+++ b/src/components/earn/farm/FarmIntro.tsx
@@ -1,6 +1,6 @@
-import Button from 'components/Button'
-import { PlusSquared } from 'components/Icons'
-import Intro from 'components/Intro'
+import Button from 'components/common/Button'
+import { PlusSquared } from 'components/common/Icons'
+import Intro from 'components/common/Intro'
 import { DocURL } from 'types/enums/docURL'
 
 export default function FarmIntro() {
diff --git a/src/components/Earn/Farm/Table/AvailableVaultsTable.tsx b/src/components/earn/farm/Table/AvailableVaultsTable.tsx
similarity index 78%
rename from src/components/Earn/Farm/Table/AvailableVaultsTable.tsx
rename to src/components/earn/farm/Table/AvailableVaultsTable.tsx
index 6107929f..8765c260 100644
--- a/src/components/Earn/Farm/Table/AvailableVaultsTable.tsx
+++ b/src/components/earn/farm/Table/AvailableVaultsTable.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 
-import useAvailableColumns from 'components/Earn/Farm/Table/Columns/useAvailableColumns'
-import Table from 'components/Table'
+import useAvailableColumns from 'components/earn/farm/Table/Columns/useAvailableColumns'
+import Table from 'components/common/Table'
 
 type Props = {
   data: Vault[]
diff --git a/src/components/Earn/Farm/Table/Columns/Apy.tsx b/src/components/earn/farm/Table/Columns/Apy.tsx
similarity index 79%
rename from src/components/Earn/Farm/Table/Columns/Apy.tsx
rename to src/components/earn/farm/Table/Columns/Apy.tsx
index e1000ed6..c27d0e7e 100644
--- a/src/components/Earn/Farm/Table/Columns/Apy.tsx
+++ b/src/components/earn/farm/Table/Columns/Apy.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 
-import { FormattedNumber } from 'components/FormattedNumber'
-import Loading from 'components/Loading'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Loading from 'components/common/Loading'
 
 export const APY_META = { accessorKey: 'apy', header: 'APY' }
 
diff --git a/src/components/Earn/Farm/Table/Columns/Deposit.tsx b/src/components/earn/farm/Table/Columns/Deposit.tsx
similarity index 84%
rename from src/components/Earn/Farm/Table/Columns/Deposit.tsx
rename to src/components/earn/farm/Table/Columns/Deposit.tsx
index 207b21ca..5160ac6f 100644
--- a/src/components/Earn/Farm/Table/Columns/Deposit.tsx
+++ b/src/components/earn/farm/Table/Columns/Deposit.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 
-import ActionButton from 'components/Button/ActionButton'
-import Loading from 'components/Loading'
+import ActionButton from 'components/common/Button/ActionButton'
+import Loading from 'components/common/Loading'
 import useStore from 'store'
 
 interface Props {
diff --git a/src/components/Earn/Farm/Table/Columns/DepositCap.tsx b/src/components/earn/farm/Table/Columns/DepositCap.tsx
similarity index 85%
rename from src/components/Earn/Farm/Table/Columns/DepositCap.tsx
rename to src/components/earn/farm/Table/Columns/DepositCap.tsx
index e12c47ff..2e12c69e 100644
--- a/src/components/Earn/Farm/Table/Columns/DepositCap.tsx
+++ b/src/components/earn/farm/Table/Columns/DepositCap.tsx
@@ -1,7 +1,7 @@
 import { Row } from '@tanstack/react-table'
 
-import DepositCapCell from 'components/DepositCapCell'
-import Loading from 'components/Loading'
+import DepositCapCell from 'components/common/DepositCapCell'
+import Loading from 'components/common/Loading'
 
 export const DEPOSIT_CAP_META = { accessorKey: 'cap', header: 'Deposit Cap' }
 
diff --git a/src/components/Earn/Farm/Table/Columns/Details.tsx b/src/components/earn/farm/Table/Columns/Details.tsx
similarity index 83%
rename from src/components/Earn/Farm/Table/Columns/Details.tsx
rename to src/components/earn/farm/Table/Columns/Details.tsx
index 65e920c5..644a6058 100644
--- a/src/components/Earn/Farm/Table/Columns/Details.tsx
+++ b/src/components/earn/farm/Table/Columns/Details.tsx
@@ -1,8 +1,8 @@
 import classNames from 'classnames'
 import React from 'react'
 
-import { ChevronDown } from 'components/Icons'
-import Loading from 'components/Loading'
+import { ChevronDown } from 'components/common/Icons'
+import Loading from 'components/common/Loading'
 
 export const DETAILS_META = { accessorKey: 'details', enableSorting: false, header: 'Deposit' }
 
diff --git a/src/components/Earn/Farm/Table/Columns/MaxLTV.tsx b/src/components/earn/farm/Table/Columns/MaxLTV.tsx
similarity index 80%
rename from src/components/Earn/Farm/Table/Columns/MaxLTV.tsx
rename to src/components/earn/farm/Table/Columns/MaxLTV.tsx
index 7d90c756..909f3717 100644
--- a/src/components/Earn/Farm/Table/Columns/MaxLTV.tsx
+++ b/src/components/earn/farm/Table/Columns/MaxLTV.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 
-import { FormattedNumber } from 'components/FormattedNumber'
-import Loading from 'components/Loading'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Loading from 'components/common/Loading'
 
 export const LTV_MAX_META = { accessorKey: 'ltv.max', header: 'Max LTV' }
 
diff --git a/src/components/Earn/Farm/Table/Columns/Name.tsx b/src/components/earn/farm/Table/Columns/Name.tsx
similarity index 93%
rename from src/components/Earn/Farm/Table/Columns/Name.tsx
rename to src/components/earn/farm/Table/Columns/Name.tsx
index f8b4a64c..1f190fa8 100644
--- a/src/components/Earn/Farm/Table/Columns/Name.tsx
+++ b/src/components/earn/farm/Table/Columns/Name.tsx
@@ -1,9 +1,9 @@
 import classNames from 'classnames'
 import React from 'react'
 
-import DoubleLogo from 'components/DoubleLogo'
-import Text from 'components/Text'
-import TitleAndSubCell from 'components/TitleAndSubCell'
+import DoubleLogo from 'components/common/DoubleLogo'
+import Text from 'components/common/Text'
+import TitleAndSubCell from 'components/common/TitleAndSubCell'
 import { VaultStatus } from 'types/enums/vault'
 import { produceCountdown } from 'utils/formatters'
 
diff --git a/src/components/Earn/Farm/Table/Columns/PositionValue.tsx b/src/components/earn/farm/Table/Columns/PositionValue.tsx
similarity index 90%
rename from src/components/Earn/Farm/Table/Columns/PositionValue.tsx
rename to src/components/earn/farm/Table/Columns/PositionValue.tsx
index b3e4590d..9209ac59 100644
--- a/src/components/Earn/Farm/Table/Columns/PositionValue.tsx
+++ b/src/components/earn/farm/Table/Columns/PositionValue.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-import DisplayCurrency from 'components/DisplayCurrency'
+import DisplayCurrency from 'components/common/DisplayCurrency'
 import { ORACLE_DENOM } from 'constants/oracle'
 import { BNCoin } from 'types/classes/BNCoin'
 
diff --git a/src/components/Earn/Farm/Table/Columns/TVL.tsx b/src/components/earn/farm/Table/Columns/TVL.tsx
similarity index 80%
rename from src/components/Earn/Farm/Table/Columns/TVL.tsx
rename to src/components/earn/farm/Table/Columns/TVL.tsx
index 8b9e1b9b..3ef3d2b4 100644
--- a/src/components/Earn/Farm/Table/Columns/TVL.tsx
+++ b/src/components/earn/farm/Table/Columns/TVL.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 
-import DisplayCurrency from 'components/DisplayCurrency'
-import Loading from 'components/Loading'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import Loading from 'components/common/Loading'
 import { BNCoin } from 'types/classes/BNCoin'
 
 export const TVL_META = { accessorKey: 'tvl', header: 'TVL' }
diff --git a/src/components/Earn/Farm/Table/Columns/useAvailableColumns.tsx b/src/components/earn/farm/Table/Columns/useAvailableColumns.tsx
similarity index 73%
rename from src/components/Earn/Farm/Table/Columns/useAvailableColumns.tsx
rename to src/components/earn/farm/Table/Columns/useAvailableColumns.tsx
index dc81f9cc..7b155b2c 100644
--- a/src/components/Earn/Farm/Table/Columns/useAvailableColumns.tsx
+++ b/src/components/earn/farm/Table/Columns/useAvailableColumns.tsx
@@ -1,16 +1,16 @@
 import { ColumnDef } from '@tanstack/react-table'
 import { useMemo } from 'react'
 
-import Apy, { APY_META } from 'components/Earn/Farm/Table/Columns/Apy'
-import { Deposit } from 'components/Earn/Farm/Table/Columns/Deposit'
+import Apy, { APY_META } from 'components/earn/farm/Table/Columns/Apy'
+import { Deposit } from 'components/earn/farm/Table/Columns/Deposit'
 import DepositCap, {
   DEPOSIT_CAP_META,
   depositCapSortingFn,
-} from 'components/Earn/Farm/Table/Columns/DepositCap'
-import MaxLTV, { LTV_MAX_META } from 'components/Earn/Farm/Table/Columns/MaxLTV'
-import Name, { NAME_META } from 'components/Earn/Farm/Table/Columns/Name'
-import TVL, { TVL_META } from 'components/Earn/Farm/Table/Columns/TVL'
-import { DETAILS_META } from 'components/Earn/Farm/Table/Columns/Details'
+} from 'components/earn/farm/Table/Columns/DepositCap'
+import MaxLTV, { LTV_MAX_META } from 'components/earn/farm/Table/Columns/MaxLTV'
+import Name, { NAME_META } from 'components/earn/farm/Table/Columns/Name'
+import TVL, { TVL_META } from 'components/earn/farm/Table/Columns/TVL'
+import { DETAILS_META } from 'components/earn/farm/Table/Columns/Details'
 
 interface Props {
   isLoading: boolean
diff --git a/src/components/Earn/Farm/Table/Columns/useDepositedColumns.tsx b/src/components/earn/farm/Table/Columns/useDepositedColumns.tsx
similarity index 78%
rename from src/components/Earn/Farm/Table/Columns/useDepositedColumns.tsx
rename to src/components/earn/farm/Table/Columns/useDepositedColumns.tsx
index 44a6559a..56e62b91 100644
--- a/src/components/Earn/Farm/Table/Columns/useDepositedColumns.tsx
+++ b/src/components/earn/farm/Table/Columns/useDepositedColumns.tsx
@@ -1,18 +1,18 @@
 import { ColumnDef, Row } from '@tanstack/react-table'
 import { useMemo } from 'react'
 
-import Apy, { APY_META } from 'components/Earn/Farm/Table/Columns/Apy'
+import Apy, { APY_META } from 'components/earn/farm/Table/Columns/Apy'
 import DepositCap, {
   DEPOSIT_CAP_META,
   depositCapSortingFn,
-} from 'components/Earn/Farm/Table/Columns/DepositCap'
-import Details, { DETAILS_META } from 'components/Earn/Farm/Table/Columns/Details'
-import MaxLTV, { LTV_MAX_META } from 'components/Earn/Farm/Table/Columns/MaxLTV'
-import Name, { NAME_META } from 'components/Earn/Farm/Table/Columns/Name'
+} from 'components/earn/farm/Table/Columns/DepositCap'
+import Details, { DETAILS_META } from 'components/earn/farm/Table/Columns/Details'
+import MaxLTV, { LTV_MAX_META } from 'components/earn/farm/Table/Columns/MaxLTV'
+import Name, { NAME_META } from 'components/earn/farm/Table/Columns/Name'
 import PositionValue, {
   POSITION_VALUE_META,
-} from 'components/Earn/Farm/Table/Columns/PositionValue'
-import TVL, { TVL_META } from 'components/Earn/Farm/Table/Columns/TVL'
+} from 'components/earn/farm/Table/Columns/PositionValue'
+import TVL, { TVL_META } from 'components/earn/farm/Table/Columns/TVL'
 
 interface Props {
   isLoading: boolean
diff --git a/src/components/Earn/Farm/Table/DepositedVaultsTable.tsx b/src/components/earn/farm/Table/DepositedVaultsTable.tsx
similarity index 82%
rename from src/components/Earn/Farm/Table/DepositedVaultsTable.tsx
rename to src/components/earn/farm/Table/DepositedVaultsTable.tsx
index 4d6e23c2..3b7caeef 100644
--- a/src/components/Earn/Farm/Table/DepositedVaultsTable.tsx
+++ b/src/components/earn/farm/Table/DepositedVaultsTable.tsx
@@ -2,9 +2,9 @@ import { Row } from '@tanstack/react-table'
 import { Table as TanStackTable } from '@tanstack/table-core/build/lib/types'
 import React, { useCallback } from 'react'
 
-import useDepositedColumns from 'components/Earn/Farm/Table/Columns/useDepositedColumns'
-import VaultExpanded from 'components/Earn/Farm/VaultExpanded'
-import Table from 'components/Table'
+import useDepositedColumns from 'components/earn/farm/Table/Columns/useDepositedColumns'
+import VaultExpanded from 'components/earn/farm/VaultExpanded'
+import Table from 'components/common/Table'
 
 type Props = {
   data: DepositedVault[]
diff --git a/src/components/Earn/Farm/VaultExpanded.tsx b/src/components/earn/farm/VaultExpanded.tsx
similarity index 94%
rename from src/components/Earn/Farm/VaultExpanded.tsx
rename to src/components/earn/farm/VaultExpanded.tsx
index b9f70292..2dbc04dc 100644
--- a/src/components/Earn/Farm/VaultExpanded.tsx
+++ b/src/components/earn/farm/VaultExpanded.tsx
@@ -2,13 +2,13 @@ import { Row } from '@tanstack/react-table'
 import moment from 'moment'
 import { useState } from 'react'
 
-import Button from 'components/Button'
-import { AccountArrowDown, LockLocked, LockUnlocked, Plus } from 'components/Icons'
-import { Tooltip } from 'components/Tooltip'
+import Button from 'components/common/Button'
+import { AccountArrowDown, LockLocked, LockUnlocked, Plus } from 'components/common/Icons'
+import { Tooltip } from 'components/common/Tooltip'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import useAccountId from 'hooks/useAccountId'
-import useLocalStorage from 'hooks/useLocalStorage'
 import useStore from 'store'
 import { VaultStatus } from 'types/enums/vault'
 
diff --git a/src/components/Earn/Farm/VaultRow.tsx b/src/components/earn/farm/VaultRow.tsx
similarity index 100%
rename from src/components/Earn/Farm/VaultRow.tsx
rename to src/components/earn/farm/VaultRow.tsx
diff --git a/src/components/Earn/Farm/VaultUnlockBanner.tsx b/src/components/earn/farm/VaultUnlockBanner.tsx
similarity index 88%
rename from src/components/Earn/Farm/VaultUnlockBanner.tsx
rename to src/components/earn/farm/VaultUnlockBanner.tsx
index 84e57c64..d6f833f9 100644
--- a/src/components/Earn/Farm/VaultUnlockBanner.tsx
+++ b/src/components/earn/farm/VaultUnlockBanner.tsx
@@ -1,12 +1,12 @@
 import { useState } from 'react'
 
-import Button from 'components/Button'
-import { ChevronRight } from 'components/Icons'
-import NotificationBanner from 'components/NotificationBanner'
+import Button from 'components/common/Button'
+import { ChevronRight } from 'components/common/Icons'
+import NotificationBanner from 'components/common/NotificationBanner'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import useAccountId from 'hooks/useAccountId'
-import useLocalStorage from 'hooks/useLocalStorage'
 import useStore from 'store'
 
 interface Props {
diff --git a/src/components/Earn/Farm/Vaults.tsx b/src/components/earn/farm/Vaults.tsx
similarity index 76%
rename from src/components/Earn/Farm/Vaults.tsx
rename to src/components/earn/farm/Vaults.tsx
index ac51534d..be0a2d20 100644
--- a/src/components/Earn/Farm/Vaults.tsx
+++ b/src/components/earn/farm/Vaults.tsx
@@ -1,15 +1,13 @@
 import { Suspense, useMemo } from 'react'
 
-import AvailableVaultsTable from 'components/Earn/Farm/Table/AvailableVaultsTable'
-import DepositedVaultsTable from 'components/Earn/Farm/Table/DepositedVaultsTable'
-import VaultUnlockBanner from 'components/Earn/Farm/VaultUnlockBanner'
-import { ENV } from 'constants/env'
+import AvailableVaultsTable from 'components/earn/farm/Table/AvailableVaultsTable'
+import DepositedVaultsTable from 'components/earn/farm/Table/DepositedVaultsTable'
+import VaultUnlockBanner from 'components/earn/farm/VaultUnlockBanner'
 import { BN_ZERO } from 'constants/math'
-import { TESTNET_VAULTS_META_DATA, VAULTS_META_DATA } from 'constants/vaults'
 import useAccountId from 'hooks/useAccountId'
 import useDepositedVaults from 'hooks/useDepositedVaults'
 import useVaults from 'hooks/useVaults'
-import { NETWORK } from 'types/enums/network'
+import useStore from 'store'
 import { VaultStatus } from 'types/enums/vault'
 
 function Content() {
@@ -17,11 +15,10 @@ function Content() {
   const { data: vaults } = useVaults()
   const { data: depositedVaults } = useDepositedVaults(accountId || '')
 
-  const vaultsMetaData =
-    ENV.NETWORK === NETWORK.TESTNET ? TESTNET_VAULTS_META_DATA : VAULTS_META_DATA
+  const vaultMetaData = useStore((s) => s.chainConfig.vaults)
 
   const { deposited, available } = useMemo(() => {
-    return vaultsMetaData.reduce(
+    return vaultMetaData.reduce(
       (prev: { deposited: DepositedVault[]; available: Vault[] }, curr) => {
         if (!vaults) return prev
         const vault = vaults.find((vault) => vault.address === curr.address)
@@ -37,7 +34,7 @@ function Content() {
       },
       { deposited: [], available: [] },
     )
-  }, [vaults, depositedVaults, vaultsMetaData])
+  }, [vaults, depositedVaults, vaultMetaData])
 
   const unlockedVaults: DepositedVault[] = []
 
@@ -63,7 +60,7 @@ function Content() {
 }
 
 function Fallback() {
-  const vaults = ENV.NETWORK === NETWORK.TESTNET ? TESTNET_VAULTS_META_DATA : VAULTS_META_DATA
+  const vaults = useStore((s) => s.chainConfig.vaults)
   const mockVaults: Vault[] = vaults.map((vault) => ({
     ...vault,
     apy: null,
diff --git a/src/components/Earn/Lend/LendIntro.tsx b/src/components/earn/lend/LendIntro.tsx
similarity index 80%
rename from src/components/Earn/Lend/LendIntro.tsx
rename to src/components/earn/lend/LendIntro.tsx
index b783b5d7..bbe32d45 100644
--- a/src/components/Earn/Lend/LendIntro.tsx
+++ b/src/components/earn/lend/LendIntro.tsx
@@ -1,6 +1,6 @@
-import ActionButton from 'components/Button/ActionButton'
-import { ArrowUpLine } from 'components/Icons'
-import Intro from 'components/Intro'
+import ActionButton from 'components/common/Button/ActionButton'
+import { ArrowUpLine } from 'components/common/Icons'
+import Intro from 'components/common/Intro'
 import useStore from 'store'
 
 export default function LendIntro() {
diff --git a/src/components/Earn/Lend/LendingActionButtons.tsx b/src/components/earn/lend/LendingActionButtons.tsx
similarity index 91%
rename from src/components/Earn/Lend/LendingActionButtons.tsx
rename to src/components/earn/lend/LendingActionButtons.tsx
index 01cc1870..4fc28613 100644
--- a/src/components/Earn/Lend/LendingActionButtons.tsx
+++ b/src/components/earn/lend/LendingActionButtons.tsx
@@ -1,11 +1,11 @@
 import { useCallback } from 'react'
 
-import { ACCOUNT_MENU_BUTTON_ID } from 'components/Account/AccountMenuContent'
-import Button from 'components/Button'
-import ActionButton from 'components/Button/ActionButton'
-import { ArrowDownLine, ArrowUpLine, Enter, ExclamationMarkCircled } from 'components/Icons'
-import Text from 'components/Text'
-import { Tooltip } from 'components/Tooltip'
+import { ACCOUNT_MENU_BUTTON_ID } from 'components/account/AccountMenuContent'
+import Button from 'components/common/Button'
+import ActionButton from 'components/common/Button/ActionButton'
+import { ArrowDownLine, ArrowUpLine, Enter, ExclamationMarkCircled } from 'components/common/Icons'
+import Text from 'components/common/Text'
+import { Tooltip } from 'components/common/Tooltip'
 import ConditionalWrapper from 'hocs/ConditionalWrapper'
 import useAccountId from 'hooks/useAccountId'
 import useAlertDialog from 'hooks/useAlertDialog'
diff --git a/src/components/Earn/Lend/Lends.tsx b/src/components/earn/lend/Lends.tsx
similarity index 80%
rename from src/components/Earn/Lend/Lends.tsx
rename to src/components/earn/lend/Lends.tsx
index 5d58d7dc..e169f385 100644
--- a/src/components/Earn/Lend/Lends.tsx
+++ b/src/components/earn/lend/Lends.tsx
@@ -1,8 +1,8 @@
-import AvailableLendsTable from 'components/Earn/Lend/Table/AvailableLendsTable'
-import DepositedLendsTable from 'components/Earn/Lend/Table/DepositedLendsTable'
+import AvailableLendsTable from 'components/earn/lend/Table/AvailableLendsTable'
+import DepositedLendsTable from 'components/earn/lend/Table/DepositedLendsTable'
 import { BN_ZERO } from 'constants/math'
+import useLendEnabledAssets from 'hooks/assets/useLendEnabledAssets'
 import useLendingMarketAssetsTableData from 'hooks/useLendingMarketAssetsTableData'
-import { getLendEnabledAssets } from 'utils/assets'
 
 export default function Lends() {
   const { accountLentAssets, availableAssets, allAssets } = useLendingMarketAssetsTableData()
@@ -19,7 +19,8 @@ export default function Lends() {
 }
 
 function Fallback() {
-  const assets = getLendEnabledAssets()
+  const assets = useLendEnabledAssets()
+
   const data: LendingMarketTableData[] = assets.map((asset) => ({
     asset,
     marketDepositCap: BN_ZERO,
diff --git a/src/components/Earn/Lend/Table/AvailableLendsTable.tsx b/src/components/earn/lend/Table/AvailableLendsTable.tsx
similarity index 70%
rename from src/components/Earn/Lend/Table/AvailableLendsTable.tsx
rename to src/components/earn/lend/Table/AvailableLendsTable.tsx
index e93d83b6..a8b10b5b 100644
--- a/src/components/Earn/Lend/Table/AvailableLendsTable.tsx
+++ b/src/components/earn/lend/Table/AvailableLendsTable.tsx
@@ -1,12 +1,12 @@
 import { Row } from '@tanstack/react-table'
 import { useCallback } from 'react'
 
-import LendingActionButtons from 'components/Earn/Lend/LendingActionButtons'
-import { NAME_META } from 'components/Earn/Lend/Table/Columns/Name'
-import useAvailableColumns from 'components/Earn/Lend/Table/Columns/useAvailableColumns'
-import MarketDetails from 'components/MarketDetails'
-import Table from 'components/Table'
-import ActionButtonRow from 'components/Table/ActionButtonRow'
+import LendingActionButtons from 'components/earn/lend/LendingActionButtons'
+import { NAME_META } from 'components/earn/lend/Table/Columns/Name'
+import useAvailableColumns from 'components/earn/lend/Table/Columns/useAvailableColumns'
+import MarketDetails from 'components/common/MarketDetails'
+import Table from 'components/common/Table'
+import ActionButtonRow from 'components/common/Table/ActionButtonRow'
 
 type Props = {
   data: LendingMarketTableData[]
diff --git a/src/components/Earn/Lend/Table/Columns/Apy.tsx b/src/components/earn/lend/Table/Columns/Apy.tsx
similarity index 80%
rename from src/components/Earn/Lend/Table/Columns/Apy.tsx
rename to src/components/earn/lend/Table/Columns/Apy.tsx
index 9525d895..1292c53e 100644
--- a/src/components/Earn/Lend/Table/Columns/Apy.tsx
+++ b/src/components/earn/lend/Table/Columns/Apy.tsx
@@ -1,5 +1,5 @@
-import AssetRate from 'components/Asset/AssetRate'
-import Loading from 'components/Loading'
+import AssetRate from 'components/common/assets/AssetRate'
+import Loading from 'components/common/Loading'
 
 export const APY_META = { accessorKey: 'apy.deposit', header: 'APY', meta: { className: 'w-40' } }
 
diff --git a/src/components/Earn/Lend/Table/Columns/DepositCap.tsx b/src/components/earn/lend/Table/Columns/DepositCap.tsx
similarity index 80%
rename from src/components/Earn/Lend/Table/Columns/DepositCap.tsx
rename to src/components/earn/lend/Table/Columns/DepositCap.tsx
index 896c6048..efd92d05 100644
--- a/src/components/Earn/Lend/Table/Columns/DepositCap.tsx
+++ b/src/components/earn/lend/Table/Columns/DepositCap.tsx
@@ -1,8 +1,9 @@
 import { Row } from '@tanstack/react-table'
+import classNames from 'classnames'
 
-import { FormattedNumber } from 'components/FormattedNumber'
-import Loading from 'components/Loading'
-import TitleAndSubCell from 'components/TitleAndSubCell'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Loading from 'components/common/Loading'
+import TitleAndSubCell from 'components/common/TitleAndSubCell'
 import { demagnify } from 'utils/formatters'
 
 export const DEPOSIT_CAP_META = {
@@ -50,6 +51,9 @@ export default function DepositCap(props: Props) {
           amount={depositCapUsed}
           options={{ minDecimals: 2, maxDecimals: 2, suffix: '% used' }}
           animate
+          className={classNames(
+            depositCapUsed >= 100 ? 'text-loss/60' : depositCapUsed > 90 ? 'text-info/60' : '',
+          )}
         />
       }
     />
diff --git a/src/components/Earn/Lend/Table/Columns/DepositValue.tsx b/src/components/earn/lend/Table/Columns/DepositValue.tsx
similarity index 76%
rename from src/components/Earn/Lend/Table/Columns/DepositValue.tsx
rename to src/components/earn/lend/Table/Columns/DepositValue.tsx
index 3d895ed8..54f5d33b 100644
--- a/src/components/Earn/Lend/Table/Columns/DepositValue.tsx
+++ b/src/components/earn/lend/Table/Columns/DepositValue.tsx
@@ -1,6 +1,6 @@
 import { Row } from '@tanstack/react-table'
 
-import AmountAndValue from 'components/AmountAndValue'
+import AmountAndValue from 'components/common/AmountAndValue'
 import { BN_ZERO } from 'constants/math'
 import { BN } from 'utils/helpers'
 
@@ -20,13 +20,10 @@ export const depositedSortingFn = (
 
 interface Props {
   asset: Asset
-  lentAmount?: string
+  lentAmount?: BigNumber
 }
 export default function DepositValue(props: Props) {
   return (
-    <AmountAndValue
-      asset={props.asset}
-      amount={props.lentAmount ? BN(props.lentAmount) : BN_ZERO}
-    />
+    <AmountAndValue asset={props.asset} amount={props.lentAmount ? props.lentAmount : BN_ZERO} />
   )
 }
diff --git a/src/components/Earn/Lend/Table/Columns/Manage.tsx b/src/components/earn/lend/Table/Columns/Manage.tsx
similarity index 85%
rename from src/components/Earn/Lend/Table/Columns/Manage.tsx
rename to src/components/earn/lend/Table/Columns/Manage.tsx
index 7da716f0..863c2084 100644
--- a/src/components/Earn/Lend/Table/Columns/Manage.tsx
+++ b/src/components/earn/lend/Table/Columns/Manage.tsx
@@ -1,4 +1,4 @@
-import { ChevronDown, ChevronUp } from 'components/Icons'
+import { ChevronDown, ChevronUp } from 'components/common/Icons'
 
 export const MANAGE_META = {
   accessorKey: 'manage',
diff --git a/src/components/Earn/Lend/Table/Columns/Name.tsx b/src/components/earn/lend/Table/Columns/Name.tsx
similarity index 76%
rename from src/components/Earn/Lend/Table/Columns/Name.tsx
rename to src/components/earn/lend/Table/Columns/Name.tsx
index 965b0513..a2f5db0c 100644
--- a/src/components/Earn/Lend/Table/Columns/Name.tsx
+++ b/src/components/earn/lend/Table/Columns/Name.tsx
@@ -1,5 +1,5 @@
-import AssetImage from 'components/Asset/AssetImage'
-import TitleAndSubCell from 'components/TitleAndSubCell'
+import AssetImage from 'components/common/assets/AssetImage'
+import TitleAndSubCell from 'components/common/TitleAndSubCell'
 
 export const NAME_META = { accessorKey: 'asset.symbol', header: 'Asset', id: 'symbol' }
 interface Props {
diff --git a/src/components/Earn/Lend/Table/Columns/useAvailableColumns.tsx b/src/components/earn/lend/Table/Columns/useAvailableColumns.tsx
similarity index 80%
rename from src/components/Earn/Lend/Table/Columns/useAvailableColumns.tsx
rename to src/components/earn/lend/Table/Columns/useAvailableColumns.tsx
index 43811b6f..c066a1a7 100644
--- a/src/components/Earn/Lend/Table/Columns/useAvailableColumns.tsx
+++ b/src/components/earn/lend/Table/Columns/useAvailableColumns.tsx
@@ -1,13 +1,13 @@
 import { ColumnDef } from '@tanstack/react-table'
 import { useMemo } from 'react'
 
-import Apy, { APY_META } from 'components/Earn/Lend/Table/Columns/Apy'
+import Apy, { APY_META } from 'components/earn/lend/Table/Columns/Apy'
 import DepositCap, {
   DEPOSIT_CAP_META,
   marketDepositCapSortingFn,
-} from 'components/Earn/Lend/Table/Columns/DepositCap'
-import Manage, { MANAGE_META } from 'components/Earn/Lend/Table/Columns/Manage'
-import Name, { NAME_META } from 'components/Earn/Lend/Table/Columns/Name'
+} from 'components/earn/lend/Table/Columns/DepositCap'
+import Manage, { MANAGE_META } from 'components/earn/lend/Table/Columns/Manage'
+import Name, { NAME_META } from 'components/earn/lend/Table/Columns/Name'
 
 interface Props {
   isLoading: boolean
diff --git a/src/components/Earn/Lend/Table/Columns/useDepositedColumns.tsx b/src/components/earn/lend/Table/Columns/useDepositedColumns.tsx
similarity index 81%
rename from src/components/Earn/Lend/Table/Columns/useDepositedColumns.tsx
rename to src/components/earn/lend/Table/Columns/useDepositedColumns.tsx
index c6ea5d50..6274f09e 100644
--- a/src/components/Earn/Lend/Table/Columns/useDepositedColumns.tsx
+++ b/src/components/earn/lend/Table/Columns/useDepositedColumns.tsx
@@ -1,17 +1,17 @@
 import { ColumnDef } from '@tanstack/react-table'
 import { useMemo } from 'react'
 
-import Apy, { APY_META } from 'components/Earn/Lend/Table/Columns/Apy'
+import Apy, { APY_META } from 'components/earn/lend/Table/Columns/Apy'
 import DepositCap, {
   DEPOSIT_CAP_META,
   marketDepositCapSortingFn,
-} from 'components/Earn/Lend/Table/Columns/DepositCap'
+} from 'components/earn/lend/Table/Columns/DepositCap'
 import DepositValue, {
   DEPOSIT_VALUE_META,
   depositedSortingFn,
-} from 'components/Earn/Lend/Table/Columns/DepositValue'
-import Manage, { MANAGE_META } from 'components/Earn/Lend/Table/Columns/Manage'
-import Name, { NAME_META } from 'components/Earn/Lend/Table/Columns/Name'
+} from 'components/earn/lend/Table/Columns/DepositValue'
+import Manage, { MANAGE_META } from 'components/earn/lend/Table/Columns/Manage'
+import Name, { NAME_META } from 'components/earn/lend/Table/Columns/Name'
 
 interface Props {
   isLoading: boolean
diff --git a/src/components/Earn/Lend/Table/DepositedLendsTable.tsx b/src/components/earn/lend/Table/DepositedLendsTable.tsx
similarity index 70%
rename from src/components/Earn/Lend/Table/DepositedLendsTable.tsx
rename to src/components/earn/lend/Table/DepositedLendsTable.tsx
index ff355480..42d37ade 100644
--- a/src/components/Earn/Lend/Table/DepositedLendsTable.tsx
+++ b/src/components/earn/lend/Table/DepositedLendsTable.tsx
@@ -1,12 +1,12 @@
 import { Row } from '@tanstack/react-table'
 import { useCallback } from 'react'
 
-import LendingActionButtons from 'components/Earn/Lend/LendingActionButtons'
-import { NAME_META } from 'components/Earn/Lend/Table/Columns/Name'
-import useDepositedColumns from 'components/Earn/Lend/Table/Columns/useDepositedColumns'
-import MarketDetails from 'components/MarketDetails'
-import Table from 'components/Table'
-import ActionButtonRow from 'components/Table/ActionButtonRow'
+import LendingActionButtons from 'components/earn/lend/LendingActionButtons'
+import { NAME_META } from 'components/earn/lend/Table/Columns/Name'
+import useDepositedColumns from 'components/earn/lend/Table/Columns/useDepositedColumns'
+import MarketDetails from 'components/common/MarketDetails'
+import Table from 'components/common/Table'
+import ActionButtonRow from 'components/common/Table/ActionButtonRow'
 
 type Props = {
   data: LendingMarketTableData[]
diff --git a/src/components/header/ChainSelect.tsx b/src/components/header/ChainSelect.tsx
new file mode 100644
index 00000000..7d69bfcb
--- /dev/null
+++ b/src/components/header/ChainSelect.tsx
@@ -0,0 +1,128 @@
+import classNames from 'classnames'
+import { useCallback, useMemo } from 'react'
+import { useLocation, useNavigate, useSearchParams } from 'react-router-dom'
+import { useSWRConfig } from 'swr'
+
+import Button from 'components/common/Button'
+import { ExternalLink } from 'components/common/Icons'
+import Overlay from 'components/common/Overlay'
+import Text from 'components/common/Text'
+import ChainLogo from 'components/common/chain/ChainLogo'
+import chains from 'configs/chains'
+import useCurrentChainId from 'hooks/localStorage/useCurrentChainId'
+import useChainConfig from 'hooks/useChainConfig'
+import useToggle from 'hooks/useToggle'
+import useStore from 'store'
+import { NETWORK } from 'types/enums/network'
+import { ChainInfoID } from 'types/enums/wallet'
+import { getPage, getRoute } from 'utils/route'
+
+const v1Outposts = [
+  { chainId: ChainInfoID.Neutron1, name: 'Neutron', url: 'https://neutron.marsprotocol.io' },
+  { chainId: ChainInfoID.Osmosis1, name: 'Osmosis', url: 'https://v1.marsprotocol.io' },
+]
+
+export default function ChainSelect() {
+  const [showMenu, setShowMenu] = useToggle()
+  const chainConfig = useChainConfig()
+  const { mutate } = useSWRConfig()
+  const navigate = useNavigate()
+  const { pathname } = useLocation()
+  const [searchParams] = useSearchParams()
+
+  const [_, setCurrentChainId] = useCurrentChainId()
+
+  const selectChain = useCallback(
+    async (chainConfig: ChainConfig) => {
+      setShowMenu(false)
+      setCurrentChainId(chainConfig.id)
+      mutate(() => true)
+      useStore.setState({
+        chainConfig,
+        client: undefined,
+        address: undefined,
+        userDomain: undefined,
+        balances: [],
+      })
+      navigate(getRoute(getPage(pathname), searchParams))
+    },
+    [setCurrentChainId, setShowMenu, mutate, navigate, pathname, searchParams],
+  )
+
+  const currentChains = useMemo(() => {
+    const currentNetworkType = process.env.NEXT_PUBLIC_NETWORK ?? NETWORK.TESTNET
+
+    return Object.entries(chains).filter(([_, chain]) => chain.network === currentNetworkType)
+  }, [])
+
+  return (
+    <div className='relative'>
+      <Button
+        leftIcon={<ChainLogo chainID={chainConfig.id} className='w-4' />}
+        iconClassName='w-5 h-5'
+        color='tertiary'
+        onClick={() => setShowMenu()}
+        className={classNames('!p-0 w-8 flex items-center justify-center')}
+      ></Button>
+      <Overlay show={showMenu} setShow={setShowMenu} className='right-0 w-[180px] mt-2'>
+        <div
+          className={classNames(
+            'flex w-full items-center bg-white/5 px-4 py-3',
+            'border border-transparent border-b-white/10',
+          )}
+        >
+          <Text size='lg' className='font-bold'>
+            Select Chain
+          </Text>
+        </div>
+        <ul className='w-full px-4 py-3 list-none'>
+          {currentChains.map(([name, chain]) => (
+            <li
+              className={classNames(
+                'w-full py-2 flex gap-3 group/chain text-white items-center',
+                chainConfig.name === chain.name
+                  ? 'pointer-events-none'
+                  : 'opacity-60 hover:opacity-100',
+              )}
+              role='button'
+              key={name}
+              onClick={() => selectChain(chain)}
+            >
+              <ChainLogo chainID={chain.id} className='w-6' />
+              <Text size='sm'>{chain.name}</Text>
+            </li>
+          ))}
+        </ul>
+        {process.env.NEXT_PUBLIC_NETWORK === NETWORK.MAINNET && (
+          <>
+            <div
+              className={classNames(
+                'flex w-full items-center bg-white/5 px-4 py-3',
+                'border border-transparent border-y-white/10',
+              )}
+            >
+              <Text size='lg' className='font-bold'>
+                V1 Outposts
+              </Text>
+            </div>
+            <ul className='w-full px-4 py-3 list-none'>
+              {v1Outposts.map((outpost) => (
+                <li
+                  className='flex items-center w-full gap-3 py-2 text-white group/chain opacity-60 hover:opacity-100'
+                  role='button'
+                  onClick={() => window.open(outpost.url, '_blank')}
+                  key={outpost.name}
+                >
+                  <ChainLogo chainID={outpost.chainId} className='w-6' />
+                  <Text size='sm'>
+                    {outpost.name} <ExternalLink className='w-4 ml-1 mb-0.5 inline' />
+                  </Text>
+                </li>
+              ))}
+            </ul>
+          </>
+        )}
+      </Overlay>
+    </div>
+  )
+}
diff --git a/src/components/Header/DesktopHeader.tsx b/src/components/header/DesktopHeader.tsx
similarity index 65%
rename from src/components/Header/DesktopHeader.tsx
rename to src/components/header/DesktopHeader.tsx
index 981512f7..2a3448f0 100644
--- a/src/components/Header/DesktopHeader.tsx
+++ b/src/components/header/DesktopHeader.tsx
@@ -1,21 +1,22 @@
 import classNames from 'classnames'
 import { isDesktop } from 'react-device-detect'
+import { useMemo } from 'react'
 
-import AccountMenu from 'components/Account/AccountMenu'
-import EscButton from 'components/Button/EscButton'
-import OracleResyncButton from 'components/Header/OracleResyncButton'
-import { Coins, CoinsSwap } from 'components/Icons'
-import DesktopNavigation from 'components/Navigation/DesktopNavigation'
-import RewardsCenter from 'components/RewardsCenter'
-import Settings from 'components/Settings'
+import AccountMenu from 'components/account/AccountMenu'
+import EscButton from 'components/common/Button/EscButton'
+import ChainSelect from 'components/header/ChainSelect'
+import OracleResyncButton from 'components/header/OracleResyncButton'
+import { Coins, CoinsSwap } from 'components/common/Icons'
+import DesktopNavigation from 'components/header/navigation/DesktopNavigation'
+import RewardsCenter from 'components/header/RewardsCenter'
+import Settings from 'components/common/Settings'
 import Wallet from 'components/Wallet'
 import useAccountId from 'hooks/useAccountId'
 import useStore from 'store'
 import { WalletID } from 'types/enums/wallet'
-import { ENABLE_HLS, ENABLE_PERPS } from 'utils/constants'
 import { getGovernanceUrl } from 'utils/helpers'
 
-export const menuTree = (walletId: WalletID): MenuTreeEntry[] => [
+export const menuTree = (walletId: WalletID, chainConfig: ChainConfig): MenuTreeEntry[] => [
   {
     pages: ['trade', 'trade-advanced'],
     label: 'Trade',
@@ -34,10 +35,10 @@ export const menuTree = (walletId: WalletID): MenuTreeEntry[] => [
       },
     ],
   },
-  ...(ENABLE_PERPS ? [{ pages: ['perps'] as Page[], label: 'Perps' }] : []),
-  { pages: ['lend', 'farm'], label: 'Earn' },
+  ...(chainConfig.perps ? [{ pages: ['perps'] as Page[], label: 'Perps' }] : []),
+  { pages: chainConfig.farm ? ['lend', 'farm'] : ['lend'], label: 'Earn' },
   { pages: ['borrow'], label: 'Borrow' },
-  ...(ENABLE_HLS ? [{ pages: ['hls-staking'] as Page[], label: 'High Leverage' }] : []),
+  ...(chainConfig.hls ? [{ pages: ['hls-staking'] as Page[], label: 'High Leverage' }] : []),
   { pages: ['portfolio'], label: 'Portfolio' },
   { pages: ['governance'], label: 'Governance', externalUrl: getGovernanceUrl(walletId) },
 ]
@@ -54,6 +55,8 @@ export default function DesktopHeader() {
     useStore.setState({ focusComponent: null })
   }
 
+  const showStaleOracle = useMemo(() => isOracleStale && address, [isOracleStale, address])
+
   if (!isDesktop) return null
 
   return (
@@ -74,15 +77,21 @@ export default function DesktopHeader() {
         {focusComponent ? (
           <div className='flex justify-between w-full'>
             <div className='flex h-5 w-13' />
-            {address && <Wallet />}
+            {address && (
+              <div className='flex gap-4'>
+                <Wallet />
+                <ChainSelect />
+              </div>
+            )}
             <EscButton onClick={handleCloseFocusMode} />
           </div>
         ) : (
           <div className='flex gap-4'>
-            {address && isOracleStale && <OracleResyncButton />}
+            {showStaleOracle && <OracleResyncButton />}
             {accountId && <RewardsCenter />}
             {address && !isHLS && <AccountMenu />}
             <Wallet />
+            <ChainSelect />
             <Settings />
           </div>
         )}
diff --git a/src/components/Header/OracleResyncButton.tsx b/src/components/header/OracleResyncButton.tsx
similarity index 66%
rename from src/components/Header/OracleResyncButton.tsx
rename to src/components/header/OracleResyncButton.tsx
index 4aa5b6aa..f1f53825 100644
--- a/src/components/Header/OracleResyncButton.tsx
+++ b/src/components/header/OracleResyncButton.tsx
@@ -1,16 +1,13 @@
 import { useCallback } from 'react'
 
-import Button from 'components/Button'
-import { ExclamationMarkCircled } from 'components/Icons'
-import { Tooltip } from 'components/Tooltip'
-import usePricesData from 'hooks/usePriceData'
+import Button from 'components/common/Button'
+import { ExclamationMarkCircled } from 'components/common/Icons'
+import { Tooltip } from 'components/common/Tooltip'
 import useStore from 'store'
 
 export default function OracleResyncButton() {
-  const { data: pricesData } = usePricesData()
   const updateOracle = useStore((s) => s.updateOracle)
-
-  const updatePythOracle = useCallback(() => updateOracle(pricesData), [pricesData, updateOracle])
+  const updatePythOracle = useCallback(() => updateOracle(), [updateOracle])
 
   return (
     <Tooltip
diff --git a/src/components/RewardsCenter.tsx b/src/components/header/RewardsCenter.tsx
similarity index 81%
rename from src/components/RewardsCenter.tsx
rename to src/components/header/RewardsCenter.tsx
index 649a4abb..f2df0e7f 100644
--- a/src/components/RewardsCenter.tsx
+++ b/src/components/header/RewardsCenter.tsx
@@ -1,14 +1,14 @@
 import { useCallback, useEffect, useMemo, useState } from 'react'
 
-import AssetBalanceRow from 'components/Asset/AssetBalanceRow'
-import Button from 'components/Button'
-import DisplayCurrency from 'components/DisplayCurrency'
-import Divider from 'components/Divider'
-import { Logo } from 'components/Icons'
-import Overlay from 'components/Overlay'
-import Text from 'components/Text'
-import { ASSETS } from 'constants/assets'
+import AssetBalanceRow from 'components/common/assets/AssetBalanceRow'
+import Button from 'components/common/Button'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import Divider from 'components/common/Divider'
+import { Logo } from 'components/common/Icons'
+import Overlay from 'components/common/Overlay'
+import Text from 'components/common/Text'
 import { ORACLE_DENOM } from 'constants/oracle'
+import useAllAssets from 'hooks/assets/useAllAssets'
 import useAccountId from 'hooks/useAccountId'
 import usePrices from 'hooks/usePrices'
 import useToggle from 'hooks/useToggle'
@@ -19,7 +19,7 @@ import { byDenom } from 'utils/array'
 import { defaultFee } from 'utils/constants'
 import { formatAmountWithSymbol, getCoinValue } from 'utils/formatters'
 
-const renderIncentives = (unclaimedRewards: BNCoin[]) => {
+const renderIncentives = (assets: Asset[], unclaimedRewards: BNCoin[]) => {
   if (unclaimedRewards.length === 0)
     return (
       <Text className='w-full px-4 text-center' size='sm'>
@@ -28,7 +28,7 @@ const renderIncentives = (unclaimedRewards: BNCoin[]) => {
     )
 
   return unclaimedRewards.map((reward, index) => {
-    const asset = ASSETS.find(byDenom(reward.denom))
+    const asset = assets.find(byDenom(reward.denom))
     if (!asset) return null
     return (
       <div className='w-full' key={index}>
@@ -47,18 +47,18 @@ export default function RewardsCenter() {
   const claimRewards = useStore((s) => s.claimRewards)
   const { data: prices } = usePrices()
   const { data: unclaimedRewards } = useUnclaimedRewards()
-
+  const assets = useAllAssets()
   const totalRewardsCoin = useMemo(() => {
     let total = 0
     unclaimedRewards.forEach((reward) => {
-      total = total + getCoinValue(reward, prices).toNumber()
+      total = total + getCoinValue(reward, prices, assets).toNumber()
     })
 
     return new BNCoin({
       denom: ORACLE_DENOM,
       amount: total.toString(),
     })
-  }, [prices, unclaimedRewards])
+  }, [assets, prices, unclaimedRewards])
 
   const hasIncentives = unclaimedRewards.length > 0
 
@@ -103,7 +103,7 @@ export default function RewardsCenter() {
           </Text>
           <div className='w-full p-4'>
             <div className='flex flex-wrap w-full gap-4 pb-4'>
-              {renderIncentives(unclaimedRewards)}
+              {renderIncentives(assets, unclaimedRewards)}
             </div>
             {hasIncentives && (
               <>
@@ -116,7 +116,7 @@ export default function RewardsCenter() {
                   onClick={handleClaim}
                 />
                 <Text className='w-full py-4 text-center text-white/50' size='sm'>
-                  Tx Fee: {formatAmountWithSymbol(estimatedFee.amount[0])}
+                  Tx Fee: {formatAmountWithSymbol(estimatedFee.amount[0], assets)}
                 </Text>
               </>
             )}
diff --git a/src/components/Navigation/DesktopNavigation.tsx b/src/components/header/navigation/DesktopNavigation.tsx
similarity index 87%
rename from src/components/Navigation/DesktopNavigation.tsx
rename to src/components/header/navigation/DesktopNavigation.tsx
index 73cd1a8a..f194e1d1 100644
--- a/src/components/Navigation/DesktopNavigation.tsx
+++ b/src/components/header/navigation/DesktopNavigation.tsx
@@ -2,11 +2,11 @@ import { useShuttle } from '@delphi-labs/shuttle-react'
 import classNames from 'classnames'
 import { useMemo } from 'react'
 
-import Button from 'components/Button'
-import { menuTree } from 'components/Header/DesktopHeader'
-import { ChevronDown, Logo } from 'components/Icons'
-import { NavLink } from 'components/Navigation/NavLink'
-import { NavMenu } from 'components/Navigation/NavMenu'
+import Button from 'components/common/Button'
+import { menuTree } from 'components/header/DesktopHeader'
+import { ChevronDown, Logo } from 'components/common/Icons'
+import { NavLink } from 'components/header/navigation/NavLink'
+import { NavMenu } from 'components/header/navigation/NavMenu'
 import useToggle from 'hooks/useToggle'
 import useStore from 'store'
 import { WalletID } from 'types/enums/wallet'
@@ -19,10 +19,11 @@ export function getIsActive(pages: string[]) {
 export default function DesktopNavigation() {
   const [showMenu, setShowMenu] = useToggle()
   const { recentWallet } = useShuttle()
+  const chainConfig = useStore((s) => s.chainConfig)
   const walletId = (recentWallet?.providerId as WalletID) ?? WalletID.Keplr
   const focusComponent = useStore((s) => s.focusComponent)
 
-  const menu = useMemo(() => menuTree(walletId), [walletId])
+  const menu = useMemo(() => menuTree(walletId, chainConfig), [walletId, chainConfig])
 
   return (
     <div
@@ -41,7 +42,7 @@ export default function DesktopNavigation() {
         <div className='flex gap-8 px-6 h-6 @container/navigation relative flex-1'>
           {menu.map((item, index) =>
             item.submenu ? (
-              <NavMenu key={index} item={item} />
+              <NavMenu key={index} item={item} index={index} />
             ) : (
               <NavLink
                 key={index}
diff --git a/src/components/Navigation/NavLink.tsx b/src/components/header/navigation/NavLink.tsx
similarity index 74%
rename from src/components/Navigation/NavLink.tsx
rename to src/components/header/navigation/NavLink.tsx
index 2e9e5327..9c420293 100644
--- a/src/components/Navigation/NavLink.tsx
+++ b/src/components/header/navigation/NavLink.tsx
@@ -2,7 +2,8 @@ import classNames from 'classnames'
 import { ReactNode } from 'react'
 import { NavLink as Link, useSearchParams } from 'react-router-dom'
 
-import { getIsActive } from 'components/Navigation/DesktopNavigation'
+import { ExternalLink } from 'components/common/Icons'
+import { getIsActive } from 'components/header/navigation/DesktopNavigation'
 import useAccountId from 'hooks/useAccountId'
 import useStore from 'store'
 import { getRoute } from 'utils/route'
@@ -13,6 +14,7 @@ interface Props {
   isHome?: boolean
   className?: string
   onClick?: () => void
+  onMouseOver?: () => void
 }
 
 export const NavLink = (props: Props) => {
@@ -32,12 +34,15 @@ export const NavLink = (props: Props) => {
       onClick={onClick ? onClick : undefined}
       className={classNames(
         className,
-        'font-semibold hover:text-white active:text-white',
+        'font-semibold hover:text-white active:text-white group-hover/submenuitem:text-white',
         getIsActive(item.pages) ? 'pointer-events-none text-white' : 'text-white/60',
       )}
       target={item.externalUrl ? '_blank' : undefined}
     >
-      {props.children}
+      <>
+        {props.children}
+        {item.externalUrl && <ExternalLink className='inline-block w-4 ml-1 mb-0.5' />}
+      </>
     </Link>
   )
 }
diff --git a/src/components/header/navigation/NavMenu.tsx b/src/components/header/navigation/NavMenu.tsx
new file mode 100644
index 00000000..e1bab8c3
--- /dev/null
+++ b/src/components/header/navigation/NavMenu.tsx
@@ -0,0 +1,90 @@
+import classNames from 'classnames'
+
+import Divider from 'components/common/Divider'
+import { ChevronDown } from 'components/common/Icons'
+import { NavLink } from 'components/header/navigation/NavLink'
+import { getIsActive } from 'components/header/navigation/DesktopNavigation'
+import Text from 'components/common/Text'
+import useToggle from 'hooks/useToggle'
+
+interface Props {
+  item: MenuTreeEntry
+  index: number
+}
+
+export const NavMenu = (props: Props) => {
+  const { item, index } = props
+  const [showMenu, setShowMenu] = useToggle()
+
+  if (!item.submenu) return null
+
+  return (
+    <div className='relative flex items-center pb-2 -mb-2' onMouseLeave={() => setShowMenu(false)}>
+      <div
+        onMouseOver={() => {
+          if (!showMenu) setShowMenu(true)
+        }}
+        className={classNames('text-base p-0 flex gap-2', showMenu && '!text-white')}
+        onClick={() => setShowMenu(false)}
+      >
+        <NavLink
+          key={index}
+          item={{ pages: [item.pages[0]], label: item.label }}
+          className={classNames(
+            `@nav-${index}/navigation:inline-block hidden whitespace-nowrap`,
+            (getIsActive(item.pages) || showMenu) && '!text-white',
+          )}
+        >
+          {item.label}
+        </NavLink>
+        <ChevronDown className='w-3' />
+      </div>
+      {showMenu && (
+        <>
+          <div
+            className='absolute left-0 z-50 top-full'
+            onMouseLeave={() => {
+              if (showMenu) setShowMenu(false)
+            }}
+          >
+            <ul
+              className={classNames(
+                'list-none flex flex-wrap  bg-white/10 backdrop-blur-lg',
+                'relative isolate max-w-full overflow-hidden rounded-sm',
+                'before:content-[" "] before:absolute before:inset-0 before:-z-1 before:rounded-sm before:p-[1px] before:border-glas',
+              )}
+            >
+              {item.submenu.map((submenuitem, index) => (
+                <li className='w-full p-0 m-0 group/submenuitem' key={index}>
+                  {index !== 0 && <Divider />}
+                  <NavLink
+                    item={{ pages: [submenuitem.page], label: submenuitem.label }}
+                    onClick={() => {
+                      if (showMenu) setShowMenu(false)
+                    }}
+                    className='flex items-center w-full gap-4 p-4 whitespace-nowrap'
+                  >
+                    {submenuitem.icon && <div className='w-6'>{submenuitem.icon}</div>}
+                    <Text className='flex flex-wrap'>
+                      {submenuitem.label}
+                      {submenuitem.subtitle && (
+                        <span
+                          className={classNames(
+                            'w-full text-sm group-hover/submenuitem:text-white',
+                            getIsActive([submenuitem.page]) ? 'text-white' : 'text-white/40',
+                          )}
+                        >
+                          {submenuitem.subtitle}
+                        </span>
+                      )}
+                    </Text>
+                  </NavLink>
+                </li>
+              ))}
+            </ul>
+          </div>
+        </>
+      )}
+    </div>
+  )
+}
diff --git a/src/components/Routes.tsx b/src/components/header/navigation/Routes.tsx
similarity index 72%
rename from src/components/Routes.tsx
rename to src/components/header/navigation/Routes.tsx
index 4196b49e..0794a61e 100644
--- a/src/components/Routes.tsx
+++ b/src/components/header/navigation/Routes.tsx
@@ -12,9 +12,10 @@ import PerpsPage from 'pages/PerpsPage'
 import PortfolioAccountPage from 'pages/PortfolioAccountPage'
 import PortfolioPage from 'pages/PortfolioPage'
 import TradePage from 'pages/TradePage'
-import { ENABLE_HLS, ENABLE_PERPS } from 'utils/constants'
+import useStore from 'store'
 
 export default function Routes() {
+  const chainConfig = useStore((s) => s.chainConfig)
   return (
     <RoutesWrapper>
       <Route
@@ -26,26 +27,26 @@ export default function Routes() {
       >
         <Route path='/trade' element={<TradePage />} />
         <Route path='/trade-advanced' element={<TradePage />} />
-        {ENABLE_PERPS && <Route path='/perps' element={<PerpsPage />} />}
-        <Route path='/farm' element={<FarmPage />} />
+        {chainConfig.perps && <Route path='/perps' element={<PerpsPage />} />}
+        {chainConfig.farm && <Route path='/farm' element={<FarmPage />} />}
         <Route path='/lend' element={<LendPage />} />
         <Route path='/borrow' element={<BorrowPage />} />
         <Route path='/portfolio' element={<PortfolioPage />} />
         <Route path='/mobile' element={<MobilePage />} />
-        {ENABLE_HLS && <Route path='/hls-staking' element={<HLSStakingPage />} />}
-        {ENABLE_HLS && <Route path='/hls-farm' element={<HLSFarmPage />} />}
+        {chainConfig.hls && <Route path='/hls-staking' element={<HLSStakingPage />} />}
+        {chainConfig.hls && <Route path='/hls-farm' element={<HLSFarmPage />} />}
         <Route path='/' element={<TradePage />} />
         <Route path='/wallets/:address'>
           <Route path='execute' element={<ExecuteMessagePage />} />
           <Route path='trade' element={<TradePage />} />
           <Route path='trade-advanced' element={<TradePage />} />
-          {ENABLE_PERPS && <Route path='perps' element={<PerpsPage />} />}
-          <Route path='farm' element={<FarmPage />} />
+          {chainConfig.perps && <Route path='perps' element={<PerpsPage />} />}
+          {chainConfig.farm && <Route path='farm' element={<FarmPage />} />}
           <Route path='lend' element={<LendPage />} />
           <Route path='borrow' element={<BorrowPage />} />
           <Route path='portfolio' element={<PortfolioPage />} />
-          {ENABLE_HLS && <Route path='hls-staking' element={<HLSStakingPage />} />}
-          {ENABLE_HLS && <Route path='hls-farm' element={<HLSFarmPage />} />}
+          {chainConfig.hls && <Route path='hls-staking' element={<HLSStakingPage />} />}
+          {chainConfig.hls && <Route path='hls-farm' element={<HLSFarmPage />} />}
           <Route path='portfolio/:accountId'>
             <Route path='' element={<PortfolioAccountPage />} />
           </Route>
diff --git a/src/components/HLS/Farm/AvailableHLSVaults.tsx b/src/components/hls/Farm/AvailableHLSVaults.tsx
similarity index 74%
rename from src/components/HLS/Farm/AvailableHLSVaults.tsx
rename to src/components/hls/Farm/AvailableHLSVaults.tsx
index 6a4be563..b6255052 100644
--- a/src/components/HLS/Farm/AvailableHLSVaults.tsx
+++ b/src/components/hls/Farm/AvailableHLSVaults.tsx
@@ -1,13 +1,11 @@
 import { Suspense, useMemo } from 'react'
 
-import { NAME_META } from 'components/HLS/Farm/Table/Columns/Name'
-import useAvailableColumns from 'components/HLS/Farm/Table/Columns/useAvailableColumns'
-import Table from 'components/Table'
-import { ENV } from 'constants/env'
+import { NAME_META } from 'components/hls/Farm/Table/Columns/Name'
+import useAvailableColumns from 'components/hls/Farm/Table/Columns/useAvailableColumns'
+import Table from 'components/common/Table'
 import { BN_ZERO } from 'constants/math'
-import { TESTNET_VAULTS_META_DATA, VAULTS_META_DATA } from 'constants/vaults'
 import useVaults from 'hooks/useVaults'
-import { NETWORK } from 'types/enums/network'
+import useStore from 'store'
 
 const title = 'Available HLS Vaults'
 
@@ -36,8 +34,7 @@ export default function AvailableHlsVaults() {
 
 function Fallback() {
   const columns = useAvailableColumns({ isLoading: true })
-
-  const vaults = ENV.NETWORK === NETWORK.TESTNET ? TESTNET_VAULTS_META_DATA : VAULTS_META_DATA
+  const vaults = useStore((s) => s.chainConfig.vaults)
   const mockVaults: Vault[] = vaults
     .filter((v) => v.isHls)
     .map((vault) => ({
diff --git a/src/components/HLS/Farm/HLSFarmIntro.tsx b/src/components/hls/Farm/HLSFarmIntro.tsx
similarity index 82%
rename from src/components/HLS/Farm/HLSFarmIntro.tsx
rename to src/components/hls/Farm/HLSFarmIntro.tsx
index 67137ef5..5612bebf 100644
--- a/src/components/HLS/Farm/HLSFarmIntro.tsx
+++ b/src/components/hls/Farm/HLSFarmIntro.tsx
@@ -1,8 +1,8 @@
 import React from 'react'
 
-import Button from 'components/Button'
-import { PlusSquared } from 'components/Icons'
-import Intro from 'components/Intro'
+import Button from 'components/common/Button'
+import { PlusSquared } from 'components/common/Icons'
+import Intro from 'components/common/Intro'
 import { DocURL } from 'types/enums/docURL'
 
 export default function HlsFarmIntro() {
diff --git a/src/components/HLS/Farm/Table/Columns/APY.tsx b/src/components/hls/Farm/Table/Columns/APY.tsx
similarity index 83%
rename from src/components/HLS/Farm/Table/Columns/APY.tsx
rename to src/components/hls/Farm/Table/Columns/APY.tsx
index 2622ee8c..0ccea4aa 100644
--- a/src/components/HLS/Farm/Table/Columns/APY.tsx
+++ b/src/components/hls/Farm/Table/Columns/APY.tsx
@@ -1,8 +1,8 @@
 import React from 'react'
 
-import { FormattedNumber } from 'components/FormattedNumber'
-import Loading from 'components/Loading'
-import useMarketBorrowings from 'hooks/useMarketBorrowings'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Loading from 'components/common/Loading'
+import useMarketBorrowings from 'hooks/markets/useMarketBorrowings'
 
 export const APY_META = { accessorKey: 'apy', header: 'APY Range' }
 
diff --git a/src/components/HLS/Farm/Table/Columns/Deposit.tsx b/src/components/hls/Farm/Table/Columns/Deposit.tsx
similarity index 91%
rename from src/components/HLS/Farm/Table/Columns/Deposit.tsx
rename to src/components/hls/Farm/Table/Columns/Deposit.tsx
index e72f178a..bdde5356 100644
--- a/src/components/HLS/Farm/Table/Columns/Deposit.tsx
+++ b/src/components/hls/Farm/Table/Columns/Deposit.tsx
@@ -1,13 +1,13 @@
 import classNames from 'classnames'
 import { useCallback } from 'react'
 
-import Button from 'components/Button'
-import { Circle, Enter, TrashBin, Wallet } from 'components/Icons'
-import Loading from 'components/Loading'
-import Text from 'components/Text'
+import Button from 'components/common/Button'
+import { Circle, Enter, TrashBin, Wallet } from 'components/common/Icons'
+import Loading from 'components/common/Loading'
+import Text from 'components/common/Text'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import useAlertDialog from 'hooks/useAlertDialog'
-import useLocalStorage from 'hooks/useLocalStorage'
 import useStore from 'store'
 
 export const DEPOSIT_META = { accessorKey: 'deposit', header: 'Deposit' }
diff --git a/src/components/HLS/Farm/Table/Columns/MaxLeverage.tsx b/src/components/hls/Farm/Table/Columns/MaxLeverage.tsx
similarity index 85%
rename from src/components/HLS/Farm/Table/Columns/MaxLeverage.tsx
rename to src/components/hls/Farm/Table/Columns/MaxLeverage.tsx
index e501c6ed..503a3c5d 100644
--- a/src/components/HLS/Farm/Table/Columns/MaxLeverage.tsx
+++ b/src/components/hls/Farm/Table/Columns/MaxLeverage.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-import { FormattedNumber } from 'components/FormattedNumber'
+import { FormattedNumber } from 'components/common/FormattedNumber'
 
 export const MAX_LEV_META = { accessorKey: 'hls.maxLeverage', header: 'Max Leverage' }
 interface Props {
diff --git a/src/components/HLS/Farm/Table/Columns/Name.tsx b/src/components/hls/Farm/Table/Columns/Name.tsx
similarity index 87%
rename from src/components/HLS/Farm/Table/Columns/Name.tsx
rename to src/components/hls/Farm/Table/Columns/Name.tsx
index 36c6d658..05edf58c 100644
--- a/src/components/HLS/Farm/Table/Columns/Name.tsx
+++ b/src/components/hls/Farm/Table/Columns/Name.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-import TitleAndSubCell from 'components/TitleAndSubCell'
+import TitleAndSubCell from 'components/common/TitleAndSubCell'
 
 export const NAME_META = { id: 'name', accessorKey: 'denoms.primary', header: 'Name' }
 
diff --git a/src/components/HLS/Farm/Table/Columns/useAvailableColumns.tsx b/src/components/hls/Farm/Table/Columns/useAvailableColumns.tsx
similarity index 74%
rename from src/components/HLS/Farm/Table/Columns/useAvailableColumns.tsx
rename to src/components/hls/Farm/Table/Columns/useAvailableColumns.tsx
index 67ade00c..07298930 100644
--- a/src/components/HLS/Farm/Table/Columns/useAvailableColumns.tsx
+++ b/src/components/hls/Farm/Table/Columns/useAvailableColumns.tsx
@@ -1,13 +1,13 @@
 import { ColumnDef } from '@tanstack/react-table'
 import React, { useMemo } from 'react'
 
-import DepositCap, { DEPOSIT_CAP_META } from 'components/Earn/Farm/Table/Columns/DepositCap'
-import MaxLTV, { LTV_MAX_META } from 'components/Earn/Farm/Table/Columns/MaxLTV'
-import Name, { NAME_META } from 'components/Earn/Farm/Table/Columns/Name'
-import TVL, { TVL_META } from 'components/Earn/Farm/Table/Columns/TVL'
-import Apy, { APY_META } from 'components/HLS/Farm/Table/Columns/APY'
-import Deposit, { DEPOSIT_META } from 'components/HLS/Farm/Table/Columns/Deposit'
-import MaxLeverage, { MAX_LEV_META } from 'components/HLS/Farm/Table/Columns/MaxLeverage'
+import DepositCap, { DEPOSIT_CAP_META } from 'components/earn/farm/Table/Columns/DepositCap'
+import MaxLTV, { LTV_MAX_META } from 'components/earn/farm/Table/Columns/MaxLTV'
+import Name, { NAME_META } from 'components/earn/farm/Table/Columns/Name'
+import TVL, { TVL_META } from 'components/earn/farm/Table/Columns/TVL'
+import Apy, { APY_META } from 'components/hls/Farm/Table/Columns/APY'
+import Deposit, { DEPOSIT_META } from 'components/hls/Farm/Table/Columns/Deposit'
+import MaxLeverage, { MAX_LEV_META } from 'components/hls/Farm/Table/Columns/MaxLeverage'
 
 interface Props {
   isLoading: boolean
diff --git a/src/components/HLS/Farm/Table/index.tsx b/src/components/hls/Farm/Table/index.tsx
similarity index 100%
rename from src/components/HLS/Farm/Table/index.tsx
rename to src/components/hls/Farm/Table/index.tsx
diff --git a/src/components/HLS/HLSTag.tsx b/src/components/hls/HLSTag.tsx
similarity index 82%
rename from src/components/HLS/HLSTag.tsx
rename to src/components/hls/HLSTag.tsx
index 5a6ef552..0ec1b8d9 100644
--- a/src/components/HLS/HLSTag.tsx
+++ b/src/components/hls/HLSTag.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-import Text from 'components/Text'
+import Text from 'components/common/Text'
 
 export default function HLSTag() {
   return (
diff --git a/src/components/HLS/Staking/ActiveStakingAccounts.tsx b/src/components/hls/Staking/ActiveStakingAccounts.tsx
similarity index 77%
rename from src/components/HLS/Staking/ActiveStakingAccounts.tsx
rename to src/components/hls/Staking/ActiveStakingAccounts.tsx
index 5a52b011..9d87a5e0 100644
--- a/src/components/HLS/Staking/ActiveStakingAccounts.tsx
+++ b/src/components/hls/Staking/ActiveStakingAccounts.tsx
@@ -1,6 +1,6 @@
-import { NAME_META } from 'components/HLS/Farm/Table/Columns/Name'
-import useDepositedColumns from 'components/HLS/Staking/Table/Columns/useDepositedColumns'
-import Table from 'components/Table'
+import { NAME_META } from 'components/hls/Farm/Table/Columns/Name'
+import useDepositedColumns from 'components/hls/Staking/Table/Columns/useDepositedColumns'
+import Table from 'components/common/Table'
 import useHLSStakingAccounts from 'hooks/useHLSStakingAccounts'
 import useStore from 'store'
 
diff --git a/src/components/HLS/Staking/AvailableHLSStakingAssets.tsx b/src/components/hls/Staking/AvailableHLSStakingAssets.tsx
similarity index 76%
rename from src/components/HLS/Staking/AvailableHLSStakingAssets.tsx
rename to src/components/hls/Staking/AvailableHLSStakingAssets.tsx
index c74b1d3c..3706e305 100644
--- a/src/components/HLS/Staking/AvailableHLSStakingAssets.tsx
+++ b/src/components/hls/Staking/AvailableHLSStakingAssets.tsx
@@ -1,15 +1,13 @@
 import { Suspense } from 'react'
 
-import { NAME_META } from 'components/HLS/Farm/Table/Columns/Name'
-import useAvailableColumns from 'components/HLS/Staking/Table/Columns/useAvailableColumns'
-import Table from 'components/Table'
+import { NAME_META } from 'components/hls/Farm/Table/Columns/Name'
+import useAvailableColumns from 'components/hls/Staking/Table/Columns/useAvailableColumns'
+import Table from 'components/common/Table'
 import useHLSStakingAssets from 'hooks/useHLSStakingAssets'
-import { getEnabledMarketAssets } from 'utils/assets'
 
 const title = 'Available Strategies'
 
 function Content() {
-  const assets = getEnabledMarketAssets()
   const { data: hlsStrategies } = useHLSStakingAssets()
   const columns = useAvailableColumns({ isLoading: false })
 
diff --git a/src/components/HLS/Staking/HLSStakingIntro.tsx b/src/components/hls/Staking/HLSStakingIntro.tsx
similarity index 82%
rename from src/components/HLS/Staking/HLSStakingIntro.tsx
rename to src/components/hls/Staking/HLSStakingIntro.tsx
index 8ce9e1be..7b04bc54 100644
--- a/src/components/HLS/Staking/HLSStakingIntro.tsx
+++ b/src/components/hls/Staking/HLSStakingIntro.tsx
@@ -1,6 +1,6 @@
-import Button from 'components/Button'
-import { PlusSquared } from 'components/Icons'
-import Intro from 'components/Intro'
+import Button from 'components/common/Button'
+import { PlusSquared } from 'components/common/Icons'
+import Intro from 'components/common/Intro'
 import { DocURL } from 'types/enums/docURL'
 
 export default function HLSStakingIntro() {
diff --git a/src/components/HLS/Staking/Table/Columns/Account.tsx b/src/components/hls/Staking/Table/Columns/Account.tsx
similarity index 84%
rename from src/components/HLS/Staking/Table/Columns/Account.tsx
rename to src/components/hls/Staking/Table/Columns/Account.tsx
index 73e475eb..3166747b 100644
--- a/src/components/HLS/Staking/Table/Columns/Account.tsx
+++ b/src/components/hls/Staking/Table/Columns/Account.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 
-import HealthBar from 'components/Account/Health/HealthBar'
-import TitleAndSubCell from 'components/TitleAndSubCell'
+import HealthBar from 'components/account/Health/HealthBar'
+import TitleAndSubCell from 'components/common/TitleAndSubCell'
 import useHealthComputer from 'hooks/useHealthComputer'
 
 export const ACCOUNT_META = { id: 'account', header: 'Account', accessorKey: 'id' }
diff --git a/src/components/HLS/Staking/Table/Columns/ActiveApy.tsx b/src/components/hls/Staking/Table/Columns/ActiveApy.tsx
similarity index 78%
rename from src/components/HLS/Staking/Table/Columns/ActiveApy.tsx
rename to src/components/hls/Staking/Table/Columns/ActiveApy.tsx
index 287ca69a..0118c1e6 100644
--- a/src/components/HLS/Staking/Table/Columns/ActiveApy.tsx
+++ b/src/components/hls/Staking/Table/Columns/ActiveApy.tsx
@@ -1,9 +1,10 @@
 import { Row } from '@tanstack/react-table'
 import React, { useMemo } from 'react'
 
-import { FormattedNumber } from 'components/FormattedNumber'
-import Loading from 'components/Loading'
-import TitleAndSubCell from 'components/TitleAndSubCell'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Loading from 'components/common/Loading'
+import TitleAndSubCell from 'components/common/TitleAndSubCell'
+import useAllAssets from 'hooks/assets/useAllAssets'
 import useBorrowAsset from 'hooks/useBorrowAsset'
 import usePrices from 'hooks/usePrices'
 import { calculateAccountLeverage } from 'utils/accounts'
@@ -25,11 +26,12 @@ interface Props {
 
 export default function ActiveAPY(props: Props) {
   const { data: prices } = usePrices()
+  const assets = useAllAssets()
   const borrowRate = useBorrowAsset(props.account.strategy.denoms.borrow)?.borrowRate
 
   const leverage = useMemo(
-    () => calculateAccountLeverage(props.account, prices),
-    [prices, props.account],
+    () => calculateAccountLeverage(props.account, prices, assets),
+    [assets, prices, props.account],
   )
 
   const leveragedApy = useMemo(() => {
diff --git a/src/components/HLS/Staking/Table/Columns/ApyRange.tsx b/src/components/hls/Staking/Table/Columns/ApyRange.tsx
similarity index 88%
rename from src/components/HLS/Staking/Table/Columns/ApyRange.tsx
rename to src/components/hls/Staking/Table/Columns/ApyRange.tsx
index c6d1b73f..6bc154b8 100644
--- a/src/components/HLS/Staking/Table/Columns/ApyRange.tsx
+++ b/src/components/hls/Staking/Table/Columns/ApyRange.tsx
@@ -1,8 +1,8 @@
 import { Row } from '@tanstack/react-table'
 
-import { FormattedNumber } from 'components/FormattedNumber'
-import Loading from 'components/Loading'
-import TitleAndSubCell from 'components/TitleAndSubCell'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Loading from 'components/common/Loading'
+import TitleAndSubCell from 'components/common/TitleAndSubCell'
 import useBorrowAsset from 'hooks/useBorrowAsset'
 import { getLeveragedApy } from 'utils/math'
 
diff --git a/src/components/HLS/Staking/Table/Columns/DebtValue.tsx b/src/components/hls/Staking/Table/Columns/DebtValue.tsx
similarity index 90%
rename from src/components/HLS/Staking/Table/Columns/DebtValue.tsx
rename to src/components/hls/Staking/Table/Columns/DebtValue.tsx
index 1f3771a9..2cf54519 100644
--- a/src/components/HLS/Staking/Table/Columns/DebtValue.tsx
+++ b/src/components/hls/Staking/Table/Columns/DebtValue.tsx
@@ -1,6 +1,6 @@
 import { Row } from '@tanstack/react-table'
 
-import DisplayCurrency from 'components/DisplayCurrency'
+import DisplayCurrency from 'components/common/DisplayCurrency'
 import { BNCoin } from 'types/classes/BNCoin'
 
 export const DEBT_VAL_META = { header: 'Debt Value', accessorKey: 'values.debt' }
diff --git a/src/components/HLS/Staking/Table/Columns/DepositCap.tsx b/src/components/hls/Staking/Table/Columns/DepositCap.tsx
similarity index 90%
rename from src/components/HLS/Staking/Table/Columns/DepositCap.tsx
rename to src/components/hls/Staking/Table/Columns/DepositCap.tsx
index 534d0bf5..5d7a3f99 100644
--- a/src/components/HLS/Staking/Table/Columns/DepositCap.tsx
+++ b/src/components/hls/Staking/Table/Columns/DepositCap.tsx
@@ -1,7 +1,7 @@
 import { Row } from '@tanstack/react-table'
 import React from 'react'
 
-import DepositCapCell from 'components/DepositCapCell'
+import DepositCapCell from 'components/common/DepositCapCell'
 
 export const CAP_META = { header: 'Cap', accessorKey: 'strategy.depositCap' }
 
diff --git a/src/components/HLS/Staking/Table/Columns/Leverage.tsx b/src/components/hls/Staking/Table/Columns/Leverage.tsx
similarity index 89%
rename from src/components/HLS/Staking/Table/Columns/Leverage.tsx
rename to src/components/hls/Staking/Table/Columns/Leverage.tsx
index f8f4a686..587f0eb9 100644
--- a/src/components/HLS/Staking/Table/Columns/Leverage.tsx
+++ b/src/components/hls/Staking/Table/Columns/Leverage.tsx
@@ -1,7 +1,7 @@
 import { Row } from '@tanstack/react-table'
 import React from 'react'
 
-import { FormattedNumber } from 'components/FormattedNumber'
+import { FormattedNumber } from 'components/common/FormattedNumber'
 
 export const LEV_META = { accessorKey: 'leverage ', header: 'Leverage' }
 
diff --git a/src/components/HLS/Staking/Table/Columns/Manage.tsx b/src/components/hls/Staking/Table/Columns/Manage.tsx
similarity index 92%
rename from src/components/HLS/Staking/Table/Columns/Manage.tsx
rename to src/components/hls/Staking/Table/Columns/Manage.tsx
index 94141d19..616b996e 100644
--- a/src/components/HLS/Staking/Table/Columns/Manage.tsx
+++ b/src/components/hls/Staking/Table/Columns/Manage.tsx
@@ -1,8 +1,8 @@
 import React, { useCallback, useMemo } from 'react'
 
-import DropDownButton from 'components/Button/DropDownButton'
-import { ArrowDownLine, Cross, HandCoins, Plus, Scale } from 'components/Icons'
-import useCloseHlsStakingPosition from 'hooks/HLS/useClosePositionActions'
+import DropDownButton from 'components/common/Button/DropDownButton'
+import { ArrowDownLine, Cross, HandCoins, Plus, Scale } from 'components/common/Icons'
+import useCloseHlsStakingPosition from 'hooks/hls/useClosePositionActions'
 import useStore from 'store'
 
 export const MANAGE_META = { id: 'manage' }
diff --git a/src/components/HLS/Staking/Table/Columns/MaxLTV.tsx b/src/components/hls/Staking/Table/Columns/MaxLTV.tsx
similarity index 80%
rename from src/components/HLS/Staking/Table/Columns/MaxLTV.tsx
rename to src/components/hls/Staking/Table/Columns/MaxLTV.tsx
index 101f0a46..819d26b9 100644
--- a/src/components/HLS/Staking/Table/Columns/MaxLTV.tsx
+++ b/src/components/hls/Staking/Table/Columns/MaxLTV.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 
-import { FormattedNumber } from 'components/FormattedNumber'
-import Loading from 'components/Loading'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Loading from 'components/common/Loading'
 
 export const LTV_MAX_META = { accessorKey: 'maxLTV', header: 'Max LTV' }
 
diff --git a/src/components/HLS/Staking/Table/Columns/MaxLeverage.tsx b/src/components/hls/Staking/Table/Columns/MaxLeverage.tsx
similarity index 85%
rename from src/components/HLS/Staking/Table/Columns/MaxLeverage.tsx
rename to src/components/hls/Staking/Table/Columns/MaxLeverage.tsx
index 83e69301..9ffcaf26 100644
--- a/src/components/HLS/Staking/Table/Columns/MaxLeverage.tsx
+++ b/src/components/hls/Staking/Table/Columns/MaxLeverage.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 
-import { FormattedNumber } from 'components/FormattedNumber'
+import { FormattedNumber } from 'components/common/FormattedNumber'
 
 export const MAX_LEV_META = { accessorKey: 'maxLeverage', header: 'Max Leverage' }
 
diff --git a/src/components/HLS/Staking/Table/Columns/Name.tsx b/src/components/hls/Staking/Table/Columns/Name.tsx
similarity index 63%
rename from src/components/HLS/Staking/Table/Columns/Name.tsx
rename to src/components/hls/Staking/Table/Columns/Name.tsx
index 41e952f0..e2a609d2 100644
--- a/src/components/HLS/Staking/Table/Columns/Name.tsx
+++ b/src/components/hls/Staking/Table/Columns/Name.tsx
@@ -1,7 +1,7 @@
-import DoubleLogo from 'components/DoubleLogo'
-import Loading from 'components/Loading'
-import TitleAndSubCell from 'components/TitleAndSubCell'
-import { getAssetByDenom } from 'utils/assets'
+import DoubleLogo from 'components/common/DoubleLogo'
+import Loading from 'components/common/Loading'
+import TitleAndSubCell from 'components/common/TitleAndSubCell'
+import useAsset from 'hooks/assets/useAsset'
 
 export const NAME_META = { id: 'name', header: 'Strategy' }
 interface Props {
@@ -10,8 +10,8 @@ interface Props {
 
 export default function Name(props: Props) {
   const { strategy } = props
-  const depositAsset = getAssetByDenom(props.strategy.denoms.deposit)
-  const borrowAsset = getAssetByDenom(props.strategy.denoms.borrow)
+  const depositAsset = useAsset(props.strategy.denoms.deposit)
+  const borrowAsset = useAsset(props.strategy.denoms.borrow)
 
   return (
     <div className='flex'>
diff --git a/src/components/HLS/Staking/Table/Columns/NetValue.tsx b/src/components/hls/Staking/Table/Columns/NetValue.tsx
similarity index 90%
rename from src/components/HLS/Staking/Table/Columns/NetValue.tsx
rename to src/components/hls/Staking/Table/Columns/NetValue.tsx
index 3a4733a1..bf2d135c 100644
--- a/src/components/HLS/Staking/Table/Columns/NetValue.tsx
+++ b/src/components/hls/Staking/Table/Columns/NetValue.tsx
@@ -1,6 +1,6 @@
 import { Row } from '@tanstack/react-table'
 
-import DisplayCurrency from 'components/DisplayCurrency'
+import DisplayCurrency from 'components/common/DisplayCurrency'
 import { BNCoin } from 'types/classes/BNCoin'
 
 export const NET_VAL_META = { header: 'Net Value', accessorKey: 'values.net' }
diff --git a/src/components/HLS/Staking/Table/Columns/PositionValue.tsx b/src/components/hls/Staking/Table/Columns/PositionValue.tsx
similarity index 90%
rename from src/components/HLS/Staking/Table/Columns/PositionValue.tsx
rename to src/components/hls/Staking/Table/Columns/PositionValue.tsx
index dd38baf9..da4730fa 100644
--- a/src/components/HLS/Staking/Table/Columns/PositionValue.tsx
+++ b/src/components/hls/Staking/Table/Columns/PositionValue.tsx
@@ -1,6 +1,6 @@
 import { Row } from '@tanstack/react-table'
 
-import DisplayCurrency from 'components/DisplayCurrency'
+import DisplayCurrency from 'components/common/DisplayCurrency'
 import { BNCoin } from 'types/classes/BNCoin'
 
 export const POS_VAL_META = { header: 'Pos. Value', accessorKey: 'values.total' }
diff --git a/src/components/HLS/Staking/Table/Columns/useAvailableColumns.tsx b/src/components/hls/Staking/Table/Columns/useAvailableColumns.tsx
similarity index 78%
rename from src/components/HLS/Staking/Table/Columns/useAvailableColumns.tsx
rename to src/components/hls/Staking/Table/Columns/useAvailableColumns.tsx
index 3c609012..add36700 100644
--- a/src/components/HLS/Staking/Table/Columns/useAvailableColumns.tsx
+++ b/src/components/hls/Staking/Table/Columns/useAvailableColumns.tsx
@@ -1,15 +1,15 @@
 import { ColumnDef } from '@tanstack/react-table'
 import React, { useMemo } from 'react'
 
-import Deposit, { DEPOSIT_META } from 'components/HLS/Farm/Table/Columns/Deposit'
+import Deposit, { DEPOSIT_META } from 'components/hls/Farm/Table/Columns/Deposit'
 import ApyRange, {
   APY_RANGE_META,
   apyRangeSortingFn,
-} from 'components/HLS/Staking/Table/Columns/ApyRange'
-import DepositCap, { CAP_META } from 'components/HLS/Staking/Table/Columns/DepositCap'
-import MaxLeverage, { MAX_LEV_META } from 'components/HLS/Staking/Table/Columns/MaxLeverage'
-import MaxLTV, { LTV_MAX_META } from 'components/HLS/Staking/Table/Columns/MaxLTV'
-import Name, { NAME_META } from 'components/HLS/Staking/Table/Columns/Name'
+} from 'components/hls/Staking/Table/Columns/ApyRange'
+import DepositCap, { CAP_META } from 'components/hls/Staking/Table/Columns/DepositCap'
+import MaxLeverage, { MAX_LEV_META } from 'components/hls/Staking/Table/Columns/MaxLeverage'
+import MaxLTV, { LTV_MAX_META } from 'components/hls/Staking/Table/Columns/MaxLTV'
+import Name, { NAME_META } from 'components/hls/Staking/Table/Columns/Name'
 
 interface Props {
   isLoading: boolean
diff --git a/src/components/HLS/Staking/Table/Columns/useDepositedColumns.tsx b/src/components/hls/Staking/Table/Columns/useDepositedColumns.tsx
similarity index 77%
rename from src/components/HLS/Staking/Table/Columns/useDepositedColumns.tsx
rename to src/components/hls/Staking/Table/Columns/useDepositedColumns.tsx
index 5e58ec30..3b7f0d17 100644
--- a/src/components/HLS/Staking/Table/Columns/useDepositedColumns.tsx
+++ b/src/components/hls/Staking/Table/Columns/useDepositedColumns.tsx
@@ -1,29 +1,29 @@
 import { ColumnDef } from '@tanstack/react-table'
 import { useMemo } from 'react'
 
-import Account, { ACCOUNT_META } from 'components/HLS/Staking/Table/Columns/Account'
+import Account, { ACCOUNT_META } from 'components/hls/Staking/Table/Columns/Account'
 import ActiveApy, {
   ACTIVE_APY_META,
   activeApySortingFn,
-} from 'components/HLS/Staking/Table/Columns/ActiveApy'
+} from 'components/hls/Staking/Table/Columns/ActiveApy'
 import DepositCap, {
   CAP_META,
   depositCapSortingFn,
-} from 'components/HLS/Staking/Table/Columns/DepositCap'
+} from 'components/hls/Staking/Table/Columns/DepositCap'
 import Leverage, {
   LEV_META,
   leverageSortingFn,
-} from 'components/HLS/Staking/Table/Columns/Leverage'
-import Manage, { MANAGE_META } from 'components/HLS/Staking/Table/Columns/Manage'
-import Name, { NAME_META } from 'components/HLS/Staking/Table/Columns/Name'
+} from 'components/hls/Staking/Table/Columns/Leverage'
+import Manage, { MANAGE_META } from 'components/hls/Staking/Table/Columns/Manage'
+import Name, { NAME_META } from 'components/hls/Staking/Table/Columns/Name'
 import NetValue, {
   NET_VAL_META,
   netValueSorting,
-} from 'components/HLS/Staking/Table/Columns/NetValue'
+} from 'components/hls/Staking/Table/Columns/NetValue'
 import PositionValue, {
   POS_VAL_META,
   positionValueSorting,
-} from 'components/HLS/Staking/Table/Columns/PositionValue'
+} from 'components/hls/Staking/Table/Columns/PositionValue'
 
 interface Props {
   isLoading: boolean
diff --git a/src/components/perps/BalancesTable/Columns/EntryPrice.tsx b/src/components/perps/BalancesTable/Columns/EntryPrice.tsx
new file mode 100644
index 00000000..ec6d6699
--- /dev/null
+++ b/src/components/perps/BalancesTable/Columns/EntryPrice.tsx
@@ -0,0 +1,32 @@
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Text from 'components/common/Text'
+import TitleAndSubCell from 'components/common/TitleAndSubCell'
+import usePrice from 'hooks/usePrice'
+
+export const ENTRY_PRICE_META = {
+  accessorKey: 'entryPrice',
+  header: () => (
+    <div className='flex flex-col gap-1'>
+      <Text size='xs'>Entry Price</Text>
+      <Text size='xs' className='text-white/40'>
+        Current Price
+      </Text>
+    </div>
+  ),
+}
+
+type Props = {
+  entryPrice: BigNumber
+  asset: Asset
+}
+
+export default function EntryPrice(props: Props) {
+  const price = usePrice(props.asset.denom)
+
+  return (
+    <TitleAndSubCell
+      title={<FormattedNumber amount={props.entryPrice.toNumber()} options={{ prefix: '$' }} />}
+      sub={<FormattedNumber amount={price.toNumber()} options={{ prefix: '$' }} />}
+    />
+  )
+}
diff --git a/src/components/perps/BalancesTable/Columns/Leverage.tsx b/src/components/perps/BalancesTable/Columns/Leverage.tsx
new file mode 100644
index 00000000..8043e973
--- /dev/null
+++ b/src/components/perps/BalancesTable/Columns/Leverage.tsx
@@ -0,0 +1,31 @@
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Text from 'components/common/Text'
+import TitleAndSubCell from 'components/common/TitleAndSubCell'
+
+export const LEVERAGE_META = {
+  accessorKey: 'leverage',
+  header: () => (
+    <div className='flex flex-col gap-1'>
+      <Text size='xs'>Liquidation Price</Text>
+      <Text size='xs' className='text-white/40'>
+        Leverage
+      </Text>
+    </div>
+  ),
+}
+
+type Props = {
+  liquidationPrice: BigNumber
+  leverage: number
+}
+
+export default function Leverage(props: Props) {
+  return (
+    <TitleAndSubCell
+      title={
+        <FormattedNumber amount={props.liquidationPrice.toNumber()} options={{ prefix: '$' }} />
+      }
+      sub={<FormattedNumber amount={props.leverage} options={{ suffix: 'x' }} />}
+    />
+  )
+}
diff --git a/src/components/perps/BalancesTable/Columns/Manage.tsx b/src/components/perps/BalancesTable/Columns/Manage.tsx
new file mode 100644
index 00000000..c005a9aa
--- /dev/null
+++ b/src/components/perps/BalancesTable/Columns/Manage.tsx
@@ -0,0 +1,62 @@
+import { useMemo } from 'react'
+import { useSearchParams } from 'react-router-dom'
+
+import DropDownButton from 'components/common/Button/DropDownButton'
+import { Cross, Edit } from 'components/common/Icons'
+import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
+import useStore from 'store'
+import { SearchParams } from 'types/enums/searchParams'
+import { getSearchParamsObject } from 'utils/route'
+
+export const MANAGE_META = { id: 'manage', header: 'Manage' }
+
+interface Props {
+  perpPosition: PerpPositionRow
+}
+
+export default function Manage(props: Props) {
+  const currentAccount = useCurrentAccount()
+  const [searchParams, setSearchParams] = useSearchParams()
+
+  const closePerpPosition = useStore((s) => s.closePerpPosition)
+  const ITEMS: DropDownItem[] = useMemo(
+    () => [
+      {
+        icon: <Edit />,
+        text: 'Edit Position Size',
+        onClick: () => {
+          const params = getSearchParamsObject(searchParams)
+          setSearchParams({
+            ...params,
+            [SearchParams.PERPS_MARKET]: props.perpPosition.asset.denom,
+            [SearchParams.PERPS_MANAGE]: 'true',
+          })
+        },
+      },
+      {
+        icon: <Cross width={16} />,
+        text: 'Close Position',
+        onClick: async () => {
+          if (!currentAccount) return
+          await closePerpPosition({
+            accountId: currentAccount.id,
+            denom: props.perpPosition.asset.denom,
+          })
+        },
+      },
+    ],
+    [
+      closePerpPosition,
+      currentAccount,
+      props.perpPosition.asset.denom,
+      searchParams,
+      setSearchParams,
+    ],
+  )
+
+  return (
+    <div className='flex justify-end'>
+      <DropDownButton items={ITEMS} text='Manage' color='tertiary' />
+    </div>
+  )
+}
diff --git a/src/components/perps/BalancesTable/Columns/PerpName.tsx b/src/components/perps/BalancesTable/Columns/PerpName.tsx
new file mode 100644
index 00000000..d9ee4797
--- /dev/null
+++ b/src/components/perps/BalancesTable/Columns/PerpName.tsx
@@ -0,0 +1,16 @@
+import AssetImage from 'components/common/assets/AssetImage'
+import TitleAndSubCell from 'components/common/TitleAndSubCell'
+
+export const PERP_NAME_META = { accessorKey: 'asset.symbol', header: 'Asset', id: 'symbol' }
+
+type Props = {
+  asset: Asset
+}
+export function PerpName(props: Props) {
+  return (
+    <div className='flex gap-3'>
+      <AssetImage asset={props.asset} size={32} />
+      <TitleAndSubCell title={props.asset.name} sub={`${props.asset.symbol}-USD`} />
+    </div>
+  )
+}
diff --git a/src/components/perps/BalancesTable/Columns/PnL.tsx b/src/components/perps/BalancesTable/Columns/PnL.tsx
new file mode 100644
index 00000000..18a8fd91
--- /dev/null
+++ b/src/components/perps/BalancesTable/Columns/PnL.tsx
@@ -0,0 +1,53 @@
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import Text from 'components/common/Text'
+import { Tooltip } from 'components/common/Tooltip'
+import { BN_ZERO } from 'constants/math'
+import { BNCoin } from 'types/classes/BNCoin'
+
+export const PNL_META = { accessorKey: 'pnl', header: 'Total PnL', id: 'pnl' }
+
+type Props = {
+  pnl: BNCoin
+}
+
+export default function PnL(props: Props) {
+  return (
+    <Tooltip
+      content={
+        <PnLTooltip
+          realized={BNCoin.fromDenomAndBigNumber('uusd', BN_ZERO)}
+          unrealized={props.pnl}
+        />
+      }
+      type='info'
+      underline
+    >
+      <DisplayCurrency className='inline text-xs' coin={props.pnl} isProfitOrLoss showZero />
+    </Tooltip>
+  )
+}
+
+type PnLTooltipProps = {
+  realized: BNCoin
+  unrealized: BNCoin
+}
+
+function PnLTooltip(props: PnLTooltipProps) {
+  return (
+    <div className='flex flex-col w-full gap-2'>
+      {[props.realized, props.unrealized].map((coin, i) => (
+        <div key={i} className='flex items-center w-full gap-8 space-between'>
+          <Text className='mr-auto text-white/60' size='sm'>
+            {i === 0 ? 'Realized' : 'Unrealized'} PnL
+          </Text>
+          <DisplayCurrency
+            coin={coin}
+            className='self-end text-sm text-end'
+            isProfitOrLoss
+            showZero
+          />
+        </div>
+      ))}
+    </div>
+  )
+}
diff --git a/src/components/perps/BalancesTable/Columns/Size.tsx b/src/components/perps/BalancesTable/Columns/Size.tsx
new file mode 100644
index 00000000..06b61bd9
--- /dev/null
+++ b/src/components/perps/BalancesTable/Columns/Size.tsx
@@ -0,0 +1,45 @@
+import { useMemo } from 'react'
+
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Text from 'components/common/Text'
+import TitleAndSubCell from 'components/common/TitleAndSubCell'
+import usePrice from 'hooks/usePrice'
+import { demagnify } from 'utils/formatters'
+
+export const SIZE_META = {
+  accessorKey: 'size',
+  header: () => (
+    <div className='flex flex-col gap-1'>
+      <Text size='xs'>Size</Text>
+      <Text size='xs' className='text-white/40'>
+        Value
+      </Text>
+    </div>
+  ),
+}
+
+type Props = {
+  amount: BigNumber
+  asset: Asset
+}
+
+export default function Size(props: Props) {
+  const price = usePrice(props.asset.denom)
+
+  const amount = useMemo(
+    () => demagnify(props.amount.toString(), props.asset),
+    [props.asset, props.amount],
+  )
+  const value = useMemo(() => price.times(amount).toNumber(), [amount, price])
+  return (
+    <TitleAndSubCell
+      title={
+        <FormattedNumber
+          amount={amount}
+          options={{ maxDecimals: amount < 0.0001 ? props.asset.decimals : 4 }}
+        />
+      }
+      sub={<FormattedNumber amount={value} options={{ prefix: '$' }} />}
+    />
+  )
+}
diff --git a/src/components/perps/BalancesTable/Columns/TradeDirection.tsx b/src/components/perps/BalancesTable/Columns/TradeDirection.tsx
new file mode 100644
index 00000000..24223075
--- /dev/null
+++ b/src/components/perps/BalancesTable/Columns/TradeDirection.tsx
@@ -0,0 +1,24 @@
+import classNames from 'classnames'
+
+export const PERP_TYPE_META = { accessorKey: 'tradeDirection', header: 'Side' }
+
+type Props = {
+  tradeDirection: TradeDirection
+  className?: string
+}
+
+export default function TradeDirection(props: Props) {
+  const { tradeDirection, className } = props
+  return (
+    <span
+      className={classNames(
+        'capitalize px-1 py-0.5 rounded-sm inline-block text-xs',
+        tradeDirection === 'short' && 'text-error bg-error/20',
+        tradeDirection === 'long' && 'text-success bg-success/20',
+        className,
+      )}
+    >
+      {tradeDirection}
+    </span>
+  )
+}
diff --git a/src/components/perps/BalancesTable/Columns/usePerpsBalancesColumns.tsx b/src/components/perps/BalancesTable/Columns/usePerpsBalancesColumns.tsx
new file mode 100644
index 00000000..84b25d04
--- /dev/null
+++ b/src/components/perps/BalancesTable/Columns/usePerpsBalancesColumns.tsx
@@ -0,0 +1,54 @@
+import { ColumnDef } from '@tanstack/react-table'
+import { useMemo } from 'react'
+
+import EntryPrice, { ENTRY_PRICE_META } from 'components/perps/BalancesTable/Columns/EntryPrice'
+import Leverage, { LEVERAGE_META } from 'components/perps/BalancesTable/Columns/Leverage'
+import Manage, { MANAGE_META } from 'components/perps/BalancesTable/Columns/Manage'
+import { PERP_NAME_META, PerpName } from 'components/perps/BalancesTable/Columns/PerpName'
+import PnL, { PNL_META } from 'components/perps/BalancesTable/Columns/PnL'
+import Size, { SIZE_META } from 'components/perps/BalancesTable/Columns/Size'
+import TradeDirection, {
+  PERP_TYPE_META,
+} from 'components/perps/BalancesTable/Columns/TradeDirection'
+
+export default function usePerpsBalancesTable() {
+  return useMemo<ColumnDef<PerpPositionRow>[]>(() => {
+    return [
+      {
+        ...PERP_NAME_META,
+        cell: ({ row }) => <PerpName asset={row.original.asset} />,
+      },
+      {
+        ...PERP_TYPE_META,
+        cell: ({ row }) => <TradeDirection tradeDirection={row.original.tradeDirection} />,
+      },
+      {
+        ...SIZE_META,
+        cell: ({ row }) => <Size amount={row.original.amount} asset={row.original.asset} />,
+      },
+      {
+        ...LEVERAGE_META,
+        cell: ({ row }) => (
+          <Leverage
+            liquidationPrice={row.original.liquidationPrice}
+            leverage={row.original.leverage}
+          />
+        ),
+      },
+      {
+        ...ENTRY_PRICE_META,
+        cell: ({ row }) => (
+          <EntryPrice entryPrice={row.original.entryPrice} asset={row.original.asset} />
+        ),
+      },
+      {
+        ...PNL_META,
+        cell: ({ row }) => <PnL pnl={row.original.pnl} />,
+      },
+      {
+        ...MANAGE_META,
+        cell: ({ row }) => <Manage perpPosition={row.original} />,
+      },
+    ]
+  }, [])
+}
diff --git a/src/components/perps/BalancesTable/index.tsx b/src/components/perps/BalancesTable/index.tsx
new file mode 100644
index 00000000..6e643172
--- /dev/null
+++ b/src/components/perps/BalancesTable/index.tsx
@@ -0,0 +1,10 @@
+import usePerpsBalancesColumns from 'components/perps/BalancesTable/Columns/usePerpsBalancesColumns'
+import usePerpsBalancesData from 'components/perps/BalancesTable/usePerpsBalancesData'
+import Table from 'components/common/Table'
+
+export default function PerpsBalancesTable() {
+  const data = usePerpsBalancesData()
+  const columns = usePerpsBalancesColumns()
+
+  return <Table title='Perp Positions' columns={columns} data={data} initialSorting={[]} />
+}
diff --git a/src/components/perps/BalancesTable/usePerpsBalancesData.ts b/src/components/perps/BalancesTable/usePerpsBalancesData.ts
new file mode 100644
index 00000000..de9e7d0b
--- /dev/null
+++ b/src/components/perps/BalancesTable/usePerpsBalancesData.ts
@@ -0,0 +1,38 @@
+import { useMemo } from 'react'
+
+import { BN_ZERO } from 'constants/math'
+import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import usePerpsEnabledAssets from 'hooks/assets/usePerpsEnabledAssets'
+import usePrices from 'hooks/usePrices'
+import { getAccountNetValue } from 'utils/accounts'
+import { byDenom } from 'utils/array'
+import { demagnify } from 'utils/formatters'
+
+export default function usePerpsBalancesTable() {
+  const currentAccount = useCurrentAccount()
+  const perpAssets = usePerpsEnabledAssets()
+  const allAssets = useAllAssets()
+  const { data: prices } = usePrices()
+
+  return useMemo<PerpPositionRow[]>(() => {
+    if (!currentAccount) return []
+
+    const netValue = getAccountNetValue(currentAccount, prices, allAssets)
+
+    return currentAccount.perps.map((position) => {
+      const price = prices.find(byDenom(position.denom))?.amount ?? BN_ZERO
+      const asset = perpAssets.find(byDenom(position.denom))!
+
+      return {
+        asset,
+        tradeDirection: position.tradeDirection,
+        amount: position.amount,
+        pnl: position.pnl,
+        entryPrice: position.entryPrice,
+        liquidationPrice: position.entryPrice, // TODO: 📈 Get actual liquidation price from HC
+        leverage: price.times(demagnify(position.amount, asset)).div(netValue).plus(1).toNumber(),
+      } as PerpPositionRow
+    })
+  }, [allAssets, currentAccount, perpAssets, prices])
+}
diff --git a/src/components/Perps/Module/LeverageButtons.tsx b/src/components/perps/Module/LeverageButtons.tsx
similarity index 58%
rename from src/components/Perps/Module/LeverageButtons.tsx
rename to src/components/perps/Module/LeverageButtons.tsx
index 66a61bb9..e1df98f7 100644
--- a/src/components/Perps/Module/LeverageButtons.tsx
+++ b/src/components/perps/Module/LeverageButtons.tsx
@@ -1,14 +1,15 @@
-import Button from 'components/Button'
-
 const LEVERAGE_PRESETS = [1, 2, 3, 5, 10]
 
 export function LeverageButtons() {
   return (
     <div className='flex justify-between'>
       {LEVERAGE_PRESETS.map((leverage) => (
-        <Button key={leverage} color='tertiary' className='w-12'>
+        <button
+          key={leverage}
+          className='w-12 !border:none bg-white/10 rounded-sm py-1 text-xs hover:bg-white/20'
+        >
           {leverage}x
-        </Button>
+        </button>
       ))}
     </div>
   )
diff --git a/src/components/perps/Module/OpeningFee.tsx b/src/components/perps/Module/OpeningFee.tsx
new file mode 100644
index 00000000..c56beb62
--- /dev/null
+++ b/src/components/perps/Module/OpeningFee.tsx
@@ -0,0 +1,19 @@
+import BigNumber from 'bignumber.js'
+
+import { CircularProgress } from 'components/common/CircularProgress'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import useOpeningFee from 'hooks/perps/useOpeningFee'
+
+type Props = {
+  denom: string
+  amount: BigNumber
+}
+
+export default function OpeningFee(props: Props) {
+  const { data: openingFee, isLoading } = useOpeningFee(props.denom, props.amount)
+
+  if (isLoading) return <CircularProgress className='h-full' size={12} />
+  if (props.amount.isZero() || !openingFee) return '-'
+
+  return <DisplayCurrency coin={openingFee} />
+}
diff --git a/src/components/Perps/Module/Or.tsx b/src/components/perps/Module/Or.tsx
similarity index 69%
rename from src/components/Perps/Module/Or.tsx
rename to src/components/perps/Module/Or.tsx
index cb5fb5d6..5f3e6878 100644
--- a/src/components/Perps/Module/Or.tsx
+++ b/src/components/perps/Module/Or.tsx
@@ -1,5 +1,5 @@
-import Divider from 'components/Divider'
-import Text from 'components/Text'
+import Divider from 'components/common/Divider'
+import Text from 'components/common/Text'
 
 export function Or() {
   return (
diff --git a/src/components/perps/Module/PerpsManageModule/index.tsx b/src/components/perps/Module/PerpsManageModule/index.tsx
new file mode 100644
index 00000000..0712df18
--- /dev/null
+++ b/src/components/perps/Module/PerpsManageModule/index.tsx
@@ -0,0 +1,74 @@
+import classNames from 'classnames'
+import { useState } from 'react'
+
+import { Cross } from 'components/common/Icons'
+import LeverageSlider from 'components/common/LeverageSlider'
+import { Spacer } from 'components/common/Spacer'
+import Text from 'components/common/Text'
+import { TradeDirectionSelector } from 'components/common/TradeDirectionSelector'
+import { LeverageButtons } from 'components/perps/Module/LeverageButtons'
+import { Or } from 'components/perps/Module/Or'
+import usePerpsManageModule from 'components/perps/Module/PerpsManageModule/usePerpsManageModule'
+import PerpsSummary from 'components/perps/Module/Summary'
+import AssetAmountInput from 'components/trade/TradeModule/SwapForm/AssetAmountInput'
+import { BN } from 'utils/helpers'
+
+export function PerpsManageModule() {
+  const [tradeDirection, setTradeDirection] = useState<TradeDirection | null>(null)
+  const [amount, setAmount] = useState<BigNumber | null>(null)
+
+  const {
+    closeManagePerpModule,
+    previousAmount,
+    previousTradeDirection,
+    previousLeverage,
+    leverage,
+    asset,
+  } = usePerpsManageModule(amount)
+
+  if (!asset) return null
+
+  return (
+    <div
+      className={classNames(
+        'px-4 gap-5 flex flex-col h-full pt-6 pb-4 w-full bg-white/5 absolute rounded-base isolate',
+        'before:content-[" "] before:absolute before:inset-0 before:-z-1 before:rounded-base before:p-[1px] before:border-glas',
+      )}
+    >
+      <div className='flex justify-between mb-3'>
+        <Text>Manage Position</Text>
+        <button onClick={closeManagePerpModule} className='mr-1.5'>
+          <Cross width={16} />
+        </button>
+      </div>
+      <TradeDirectionSelector
+        direction={tradeDirection ?? previousTradeDirection}
+        onChangeDirection={setTradeDirection}
+      />
+      <AssetAmountInput
+        label='Amount'
+        max={BN(100000)} // TODO: Implement max calculation
+        amount={amount ?? previousAmount}
+        setAmount={setAmount}
+        asset={asset}
+        maxButtonLabel='Max:'
+        disabled={false}
+      />
+      <Or />
+      <Text size='sm'>Position Leverage</Text>
+      <LeverageSlider max={0} value={0} onChange={() => {}} type={tradeDirection || 'long'} />
+      <LeverageButtons />
+      <Spacer />
+      <PerpsSummary
+        changeTradeDirection
+        amount={amount ?? previousAmount}
+        tradeDirection={tradeDirection ?? previousTradeDirection}
+        asset={asset}
+        leverage={leverage}
+        previousAmount={previousAmount}
+        previousTradeDirection={previousTradeDirection}
+        previousLeverage={previousLeverage}
+      />
+    </div>
+  )
+}
diff --git a/src/components/perps/Module/PerpsManageModule/usePerpsManageModule.ts b/src/components/perps/Module/PerpsManageModule/usePerpsManageModule.ts
new file mode 100644
index 00000000..25ecd7d4
--- /dev/null
+++ b/src/components/perps/Module/PerpsManageModule/usePerpsManageModule.ts
@@ -0,0 +1,68 @@
+import { useCallback, useMemo } from 'react'
+import { useSearchParams } from 'react-router-dom'
+
+import { BN_ZERO } from 'constants/math'
+import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import usePerpPosition from 'hooks/perps/usePerpPosition'
+import usePerpsAsset from 'hooks/perps/usePerpsAsset'
+import usePrice from 'hooks/usePrice'
+import usePrices from 'hooks/usePrices'
+import { SearchParams } from 'types/enums/searchParams'
+import { getAccountNetValue } from 'utils/accounts'
+import { demagnify } from 'utils/formatters'
+import { getSearchParamsObject } from 'utils/route'
+
+export default function usePerpsManageModule(amount: BigNumber | null) {
+  const { perpsAsset } = usePerpsAsset()
+  const [searchParams, setSearchParams] = useSearchParams()
+  const perpPosition = usePerpPosition(perpsAsset.denom)
+  const { data: prices } = usePrices()
+  const assets = useAllAssets()
+  const account = useCurrentAccount()
+  const price = usePrice(perpsAsset.denom)
+
+  const accountNetValue = useMemo(() => {
+    if (!account || !prices || !assets) return BN_ZERO
+    return getAccountNetValue(account, prices, assets)
+  }, [account, assets, prices])
+
+  const closeManagePerpModule = useCallback(() => {
+    const params = getSearchParamsObject(searchParams)
+    delete params[SearchParams.PERPS_MANAGE]
+    setSearchParams({
+      ...params,
+    })
+  }, [searchParams, setSearchParams])
+
+  const previousAmount = useMemo(() => perpPosition?.amount ?? BN_ZERO, [perpPosition?.amount])
+  const previousTradeDirection = useMemo(
+    () => perpPosition?.tradeDirection || 'long',
+    [perpPosition?.tradeDirection],
+  )
+
+  const previousLeverage = useMemo(
+    () =>
+      price.times(demagnify(previousAmount, perpsAsset)).div(accountNetValue).plus(1).toNumber(),
+    [accountNetValue, perpsAsset, previousAmount, price],
+  )
+
+  const leverage = useMemo(
+    () =>
+      price
+        .times(demagnify(amount ?? BN_ZERO, perpsAsset))
+        .div(accountNetValue)
+        .plus(1)
+        .toNumber(),
+    [accountNetValue, amount, perpsAsset, price],
+  )
+
+  return {
+    closeManagePerpModule,
+    previousAmount,
+    previousTradeDirection,
+    previousLeverage,
+    leverage,
+    asset: perpsAsset,
+  }
+}
diff --git a/src/components/perps/Module/PerpsModule.tsx b/src/components/perps/Module/PerpsModule.tsx
new file mode 100644
index 00000000..056ec025
--- /dev/null
+++ b/src/components/perps/Module/PerpsModule.tsx
@@ -0,0 +1,66 @@
+import { useState } from 'react'
+
+import Card from 'components/common/Card'
+import LeverageSlider from 'components/common/LeverageSlider'
+import { Spacer } from 'components/common/Spacer'
+import Text from 'components/common/Text'
+import { TradeDirectionSelector } from 'components/common/TradeDirectionSelector'
+import { LeverageButtons } from 'components/perps/Module/LeverageButtons'
+import { Or } from 'components/perps/Module/Or'
+import PerpsSummary from 'components/perps/Module/Summary'
+import AssetSelectorPerps from 'components/trade/TradeModule/AssetSelector/AssetSelectorPerps'
+import AssetAmountInput from 'components/trade/TradeModule/SwapForm/AssetAmountInput'
+import OrderTypeSelector from 'components/trade/TradeModule/SwapForm/OrderTypeSelector'
+import { AvailableOrderType } from 'components/trade/TradeModule/SwapForm/OrderTypeSelector/types'
+import { BN_ZERO } from 'constants/math'
+import usePerpsAsset from 'hooks/perps/usePerpsAsset'
+import { BN } from 'utils/helpers'
+
+export function PerpsModule() {
+  const [selectedOrderType, setSelectedOrderType] = useState<AvailableOrderType>('Market')
+  const [tradeDirection, setTradeDirection] = useState<TradeDirection>('long')
+  const { perpsAsset } = usePerpsAsset()
+  const [leverage, setLeverage] = useState<number>(1)
+
+  const [amount, setAmount] = useState<BigNumber>(BN_ZERO)
+
+  if (!perpsAsset) return null
+
+  return (
+    <Card
+      contentClassName='px-4 gap-5 flex flex-col h-full pb-4'
+      title={<AssetSelectorPerps asset={perpsAsset} />}
+      className='mb-4 h-full'
+    >
+      <OrderTypeSelector selected={selectedOrderType} onChange={setSelectedOrderType} />
+
+      <TradeDirectionSelector direction={tradeDirection} onChangeDirection={setTradeDirection} />
+      <AssetAmountInput
+        label='Amount'
+        max={BN(1000)} // TODO: Implement max calculation
+        amount={amount}
+        setAmount={setAmount}
+        asset={perpsAsset}
+        maxButtonLabel='Max:'
+        disabled={false}
+      />
+      <Or />
+      <Text size='sm'>Position Leverage</Text>
+      <LeverageSlider
+        min={1}
+        max={10}
+        value={leverage}
+        onChange={setLeverage}
+        type={tradeDirection}
+      />
+      <LeverageButtons />
+      <Spacer />
+      <PerpsSummary
+        amount={amount}
+        tradeDirection={tradeDirection}
+        asset={perpsAsset}
+        leverage={leverage}
+      />
+    </Card>
+  )
+}
diff --git a/src/components/perps/Module/Summary.tsx b/src/components/perps/Module/Summary.tsx
new file mode 100644
index 00000000..3c2ba493
--- /dev/null
+++ b/src/components/perps/Module/Summary.tsx
@@ -0,0 +1,123 @@
+import classNames from 'classnames'
+import { useCallback, useMemo } from 'react'
+
+import AssetAmount from 'components/common/assets/AssetAmount'
+import ActionButton from 'components/common/Button/ActionButton'
+import { ArrowRight } from 'components/common/Icons'
+import SummaryLine from 'components/common/SummaryLine'
+import Text from 'components/common/Text'
+import TradeDirection from 'components/perps/BalancesTable/Columns/TradeDirection'
+import OpeningFee from 'components/perps/Module/OpeningFee'
+import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
+import useStore from 'store'
+import { BNCoin } from 'types/classes/BNCoin'
+import { formatLeverage } from 'utils/formatters'
+
+type Props = {
+  leverage: number
+  amount: BigNumber
+  tradeDirection: TradeDirection
+  asset: Asset
+  changeTradeDirection?: boolean
+  previousAmount?: BigNumber
+  previousTradeDirection?: 'long' | 'short'
+  previousLeverage?: number
+}
+
+export default function PerpsSummary(props: Props) {
+  const openPerpPosition = useStore((s) => s.openPerpPosition)
+  const currentAccount = useCurrentAccount()
+
+  const onConfirm = useCallback(async () => {
+    if (!currentAccount) return
+    await openPerpPosition({
+      accountId: currentAccount.id,
+      coin: BNCoin.fromDenomAndBigNumber(
+        props.asset.denom,
+        props.amount.times(props.tradeDirection === 'short' ? -1 : 1),
+      ),
+    })
+  }, [currentAccount, openPerpPosition, props.amount, props.asset.denom, props.tradeDirection])
+
+  const disabled = useMemo(
+    () =>
+      (props.previousAmount && props.previousAmount.isEqualTo(props.amount)) ||
+      props.amount.isZero(),
+    [props.amount, props.previousAmount],
+  )
+
+  return (
+    <div className='border border-white/10 rounded-sm bg-white/5'>
+      <ManageSummary {...props} />
+      <div className='py-4 px-3 flex flex-col gap-1'>
+        <Text size='xs' className='font-bold mb-2'>
+          Summary
+        </Text>
+        <SummaryLine label='Expected Price'>-</SummaryLine>
+        <SummaryLine label='Fees'>
+          <OpeningFee denom={props.asset.denom} amount={props.amount} />
+        </SummaryLine>
+        <SummaryLine label='Total'>-</SummaryLine>
+      </div>
+      <ActionButton onClick={onConfirm} disabled={disabled} className='w-full py-2.5'>
+        <span className='capitalize mr-1'>{props.tradeDirection}</span>
+        {props.asset.symbol}
+      </ActionButton>
+    </div>
+  )
+}
+
+function ManageSummary(props: Props) {
+  const showTradeDirection =
+    props.previousTradeDirection && props.previousTradeDirection !== props.tradeDirection
+  const showAmount =
+    props.previousAmount && props.amount && !props.previousAmount.isEqualTo(props.amount)
+  const showLeverage =
+    props.previousLeverage &&
+    props.leverage &&
+    props.previousLeverage.toFixed(2) !== props.leverage.toFixed(2)
+
+  if (!showTradeDirection && !showLeverage && !showAmount) return null
+
+  return (
+    <div className='pt-4 px-3 flex flex-col gap-1'>
+      <Text size='xs' className='font-bold mb-2'>
+        Your new position
+      </Text>
+
+      {showTradeDirection && props.previousTradeDirection && (
+        <SummaryLine label='Side' contentClassName='flex gap-1'>
+          <TradeDirection tradeDirection={props.previousTradeDirection} />
+          <ArrowRight width={16} />
+          <TradeDirection tradeDirection={props.tradeDirection} />
+        </SummaryLine>
+      )}
+
+      {showAmount && props.previousAmount && (
+        <SummaryLine label='Size' contentClassName='flex gap-1'>
+          <AssetAmount asset={props.asset} amount={props.previousAmount.toNumber()} />
+          <ArrowRight
+            width={16}
+            className={classNames(
+              props.previousAmount.isGreaterThan(props.amount) ? 'text-error' : 'text-success',
+            )}
+          />
+          <AssetAmount asset={props.asset} amount={props.amount.toNumber()} />
+        </SummaryLine>
+      )}
+
+      {showLeverage && props.previousLeverage && (
+        <SummaryLine label='Leverage' contentClassName='flex gap-1'>
+          <span>{formatLeverage(props.previousLeverage)}</span>
+          <ArrowRight
+            width={16}
+            className={classNames(
+              props.leverage > props.previousLeverage ? 'text-error' : 'text-success',
+            )}
+          />
+          <span>{formatLeverage(props.leverage)}</span>
+        </SummaryLine>
+      )}
+    </div>
+  )
+}
diff --git a/src/components/perps/PerpsChart.tsx b/src/components/perps/PerpsChart.tsx
new file mode 100644
index 00000000..e2591795
--- /dev/null
+++ b/src/components/perps/PerpsChart.tsx
@@ -0,0 +1,16 @@
+import React from 'react'
+
+import TradeChart from 'components/trade/TradeChart'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import usePerpsAsset from 'hooks/perps/usePerpsAsset'
+
+export function PerpsChart() {
+  const assets = useAllAssets()
+  const { perpsAsset } = usePerpsAsset()
+
+  return (
+    <div className='h-full'>
+      <TradeChart buyAsset={perpsAsset} sellAsset={assets[1]} />
+    </div>
+  )
+}
diff --git a/src/components/perps/PerpsInfo/FundingRate.tsx b/src/components/perps/PerpsInfo/FundingRate.tsx
new file mode 100644
index 00000000..da1c167a
--- /dev/null
+++ b/src/components/perps/PerpsInfo/FundingRate.tsx
@@ -0,0 +1,77 @@
+import { useMemo, useState } from 'react'
+
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import { ChevronDown } from 'components/common/Icons'
+import Loading from 'components/common/Loading'
+import { Tooltip } from 'components/common/Tooltip'
+import { BN_ZERO } from 'constants/math'
+import usePerpsMarket from 'hooks/perps/usePerpsMarket'
+import useToggle from 'hooks/useToggle'
+
+type Interval = '1H' | '1D' | '1W' | '1M' | '1Y'
+
+enum Intervals {
+  '1H' = 365 * 24,
+  '1D' = 365,
+  '1W' = 52,
+  '1M' = 12,
+  '1Y' = 1,
+}
+
+export default function FundingRate() {
+  const { data: market, isLoading } = usePerpsMarket()
+  const [interval, setInterval] = useState<Interval>('1H')
+  const [show, toggleShow] = useToggle(false)
+
+  const fundingRate = useMemo(() => {
+    return market?.fundingRate.div(Intervals[interval]) ?? BN_ZERO
+  }, [interval, market?.fundingRate])
+
+  if (isLoading) return <Loading className='w-14 h-4' />
+  if (!market) return '-'
+
+  return (
+    <div className='flex gap-1 items-center'>
+      <FormattedNumber
+        className='text-xs inline'
+        amount={fundingRate.toNumber()}
+        options={{ minDecimals: 6, maxDecimals: 6, suffix: '%' }}
+      />
+      <Tooltip
+        content={
+          <div>
+            {Object.keys(Intervals)
+              .filter((key) => isNaN(Number(key)))
+              .map((key) => (
+                <button
+                  key={key}
+                  onClick={() => {
+                    setInterval(key as Interval)
+                    toggleShow(false)
+                  }}
+                  className='w-full text-center px-3 py-1.5 flex gap-2 items-center hover:bg-white/5 text-[10px]'
+                >
+                  {key}
+                </button>
+              ))}
+          </div>
+        }
+        type='info'
+        placement='bottom'
+        contentClassName='!bg-white/10 border border-white/20 backdrop-blur-xl !p-0'
+        interactive
+        hideArrow
+        visible={show}
+        onClickOutside={() => toggleShow(false)}
+      >
+        <button
+          onClick={() => toggleShow()}
+          className='flex gap-1 bg-white/10 rounded-sm items-center text-[10px] px-1.5 py-0.5'
+        >
+          {interval}
+          <ChevronDown className='h-2 w-2' />
+        </button>
+      </Tooltip>
+    </div>
+  )
+}
diff --git a/src/components/perps/PerpsInfo/InterestItem.tsx b/src/components/perps/PerpsInfo/InterestItem.tsx
new file mode 100644
index 00000000..5e8611b3
--- /dev/null
+++ b/src/components/perps/PerpsInfo/InterestItem.tsx
@@ -0,0 +1,27 @@
+import React from 'react'
+
+import AssetSymbol from 'components/common/assets/AssetSymbol'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Loading from 'components/common/Loading'
+import usePerpsMarket from 'hooks/perps/usePerpsMarket'
+
+interface InterestItemProps {
+  type: 'long' | 'short'
+}
+export default function InterestItem(props: InterestItemProps) {
+  const { data: market, isLoading } = usePerpsMarket()
+
+  if (isLoading) return <Loading />
+  if (!market) return null
+
+  return (
+    <div className='flex gap-1 items-center'>
+      <FormattedNumber
+        className='text-sm inline'
+        amount={market.openInterest[props.type].toNumber()}
+        options={{ decimals: market.asset.decimals }}
+      />
+      <AssetSymbol symbol={market.asset.symbol} />
+    </div>
+  )
+}
diff --git a/src/components/perps/PerpsInfo/index.tsx b/src/components/perps/PerpsInfo/index.tsx
new file mode 100644
index 00000000..3cda2238
--- /dev/null
+++ b/src/components/perps/PerpsInfo/index.tsx
@@ -0,0 +1,69 @@
+import React, { useMemo } from 'react'
+
+import Card from 'components/common/Card'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import Divider from 'components/common/Divider'
+import Loading from 'components/common/Loading'
+import FundingRate from 'components/perps/PerpsInfo/FundingRate'
+import InterestItem from 'components/perps/PerpsInfo/InterestItem'
+import Text from 'components/common/Text'
+import usePerpsMarket from 'hooks/perps/usePerpsMarket'
+import usePrice from 'hooks/usePrice'
+import { BNCoin } from 'types/classes/BNCoin'
+
+export function PerpsInfo() {
+  const { data: market } = usePerpsMarket()
+  const assetPrice = usePrice(market?.asset.denom || '')
+
+  const items = useMemo(() => {
+    if (!market) return []
+
+    return [
+      ...(!assetPrice.isZero()
+        ? [<DisplayCurrency key='price' coin={BNCoin.fromDenomAndBigNumber('usd', assetPrice)} />]
+        : [<Loading key='price' className='w-14 h-4' />]),
+      <InfoItem
+        key='openInterestLong'
+        label='Open Interest (L)'
+        item={<InterestItem type='long' />}
+      />,
+      <InfoItem
+        key='openInterestShort'
+        label='Open Interest (S)'
+        item={<InterestItem type='short' />}
+      />,
+      <InfoItem key='fundingRate' label='Funding rate' item={<FundingRate />} />,
+    ]
+  }, [assetPrice, market])
+
+  if (!market) return null
+
+  return (
+    <Card contentClassName='bg-white/10 py-3.5 px-4'>
+      <div className='flex gap-4 items-center'>
+        {items.map((item, index) => (
+          <React.Fragment key={index}>
+            {item}
+            {index !== items.length - 1 && <Divider orientation='vertical' className='h-9' />}
+          </React.Fragment>
+        ))}
+      </div>
+    </Card>
+  )
+}
+
+interface InfoItemProps {
+  item: React.ReactNode
+  label: string
+}
+
+function InfoItem(props: InfoItemProps) {
+  return (
+    <div className='flex flex-col gap-1'>
+      <Text size='xs' className='text-white/40'>
+        {props.label}
+      </Text>
+      {props.item}
+    </div>
+  )
+}
diff --git a/src/components/perps/PerpsPositions.tsx b/src/components/perps/PerpsPositions.tsx
new file mode 100644
index 00000000..b97d16e9
--- /dev/null
+++ b/src/components/perps/PerpsPositions.tsx
@@ -0,0 +1,5 @@
+import PerpsBalancesTable from 'components/perps/BalancesTable'
+
+export function PerpsPositions() {
+  return <PerpsBalancesTable />
+}
diff --git a/src/components/Portfolio/Account/Balances.tsx b/src/components/portfolio/Account/Balances.tsx
similarity index 82%
rename from src/components/Portfolio/Account/Balances.tsx
rename to src/components/portfolio/Account/Balances.tsx
index 07f11970..c39fbbb5 100644
--- a/src/components/Portfolio/Account/Balances.tsx
+++ b/src/components/portfolio/Account/Balances.tsx
@@ -1,10 +1,10 @@
 import React, { Suspense, useMemo } from 'react'
 
-import AccountBalancesTable from 'components/Account/AccountBalancesTable'
-import Card from 'components/Card'
-import TableSkeleton from 'components/TableSkeleton'
-import Text from 'components/Text'
-import useAccount from 'hooks/useAccount'
+import AccountBalancesTable from 'components/account/AccountBalancesTable'
+import Card from 'components/common/Card'
+import TableSkeleton from 'components/common/Table/TableSkeleton'
+import Text from 'components/common/Text'
+import useAccount from 'hooks/accounts/useAccount'
 import useBorrowMarketAssetsTableData from 'hooks/useBorrowMarketAssetsTableData'
 import useLendingMarketAssetsTableData from 'hooks/useLendingMarketAssetsTableData'
 
@@ -15,7 +15,7 @@ interface Props {
 function Content(props: Props) {
   const { data: account } = useAccount(props.accountId, true)
 
-  const { data } = useBorrowMarketAssetsTableData(false)
+  const data = useBorrowMarketAssetsTableData()
   const borrowAssets = useMemo(() => data?.allAssets || [], [data])
   const { allAssets: lendingAssets } = useLendingMarketAssetsTableData()
 
diff --git a/src/components/Portfolio/Account/BreadCrumbs.tsx b/src/components/portfolio/Account/BreadCrumbs.tsx
similarity index 89%
rename from src/components/Portfolio/Account/BreadCrumbs.tsx
rename to src/components/portfolio/Account/BreadCrumbs.tsx
index db43314a..536d648e 100644
--- a/src/components/Portfolio/Account/BreadCrumbs.tsx
+++ b/src/components/portfolio/Account/BreadCrumbs.tsx
@@ -1,7 +1,7 @@
 import { NavLink, useParams, useSearchParams } from 'react-router-dom'
 
-import { ArrowRight } from 'components/Icons'
-import Text from 'components/Text'
+import { ArrowRight } from 'components/common/Icons'
+import Text from 'components/common/Text'
 import useAccountId from 'hooks/useAccountId'
 import { getRoute } from 'utils/route'
 
diff --git a/src/components/portfolio/Account/PerpPositions.tsx b/src/components/portfolio/Account/PerpPositions.tsx
new file mode 100644
index 00000000..d33c9f89
--- /dev/null
+++ b/src/components/portfolio/Account/PerpPositions.tsx
@@ -0,0 +1,50 @@
+import React, { Suspense } from 'react'
+
+import AccountPerpPositionTable from 'components/account/AccountPerpPositionTable'
+import Card from 'components/common/Card'
+import TableSkeleton from 'components/common/Table/TableSkeleton'
+import Text from 'components/common/Text'
+import useAccount from 'hooks/accounts/useAccount'
+
+interface Props {
+  accountId: string
+}
+
+function Content(props: Props) {
+  const { data: account } = useAccount(props.accountId, true)
+
+  if (!account || account.perps.length === 0) return null
+
+  return (
+    <Skeleton>
+      <AccountPerpPositionTable account={account} showLiquidationPrice hideCard />
+    </Skeleton>
+  )
+}
+
+export default function PerpPositions(props: Props) {
+  return (
+    <Suspense fallback={<Skeleton />}>
+      <Content {...props} />
+    </Suspense>
+  )
+}
+
+interface SkeletonProps {
+  children?: React.ReactNode
+}
+
+function Skeleton(props: SkeletonProps) {
+  return (
+    <div className='flex flex-wrap w-full gap-4'>
+      <Text size='2xl'>Perp Positions</Text>
+      <Card className='w-full bg-white/5'>
+        {props.children ? (
+          props.children
+        ) : (
+          <TableSkeleton labels={['Asset', 'Value', 'Liq. Price', 'Total PnL']} rowCount={3} />
+        )}
+      </Card>
+    </div>
+  )
+}
diff --git a/src/components/Portfolio/Account/Summary.tsx b/src/components/portfolio/Account/Summary.tsx
similarity index 86%
rename from src/components/Portfolio/Account/Summary.tsx
rename to src/components/portfolio/Account/Summary.tsx
index 43fb3f07..1728d0d2 100644
--- a/src/components/Portfolio/Account/Summary.tsx
+++ b/src/components/portfolio/Account/Summary.tsx
@@ -1,10 +1,11 @@
 import { Suspense, useMemo } from 'react'
 
-import DisplayCurrency from 'components/DisplayCurrency'
-import { FormattedNumber } from 'components/FormattedNumber'
-import Skeleton from 'components/Portfolio/SummarySkeleton'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Skeleton from 'components/portfolio/SummarySkeleton'
 import { MAX_AMOUNT_DECIMALS } from 'constants/math'
-import useAccount from 'hooks/useAccount'
+import useAccount from 'hooks/accounts/useAccount'
+import useAllAssets from 'hooks/assets/useAllAssets'
 import useBorrowMarketAssetsTableData from 'hooks/useBorrowMarketAssetsTableData'
 import useHealthComputer from 'hooks/useHealthComputer'
 import useHLSStakingAssets from 'hooks/useHLSStakingAssets'
@@ -21,11 +22,11 @@ function Content(props: Props) {
   const { data: account } = useAccount(props.accountId, true)
   const { data: prices } = usePrices()
   const { health, healthFactor } = useHealthComputer(account)
-  const { data } = useBorrowMarketAssetsTableData(false)
+  const data = useBorrowMarketAssetsTableData()
   const borrowAssets = useMemo(() => data?.allAssets || [], [data])
   const { allAssets: lendingAssets } = useLendingMarketAssetsTableData()
   const { data: hlsStrategies } = useHLSStakingAssets()
-
+  const assets = useAllAssets()
   const stats = useMemo(() => {
     if (!account || !borrowAssets.length || !lendingAssets.length) return DEFAULT_PORTFOLIO_STATS
 
@@ -35,6 +36,7 @@ function Content(props: Props) {
       borrowAssets,
       lendingAssets,
       hlsStrategies,
+      assets,
       account.kind === 'high_levered_strategy',
     )
 
@@ -76,7 +78,7 @@ function Content(props: Props) {
         sub: DEFAULT_PORTFOLIO_STATS[4].sub,
       },
     ]
-  }, [account, borrowAssets, hlsStrategies, lendingAssets, prices])
+  }, [account, assets, borrowAssets, hlsStrategies, lendingAssets, prices])
 
   return (
     <Skeleton
diff --git a/src/components/Portfolio/Card/Skeleton.tsx b/src/components/portfolio/Card/Skeleton.tsx
similarity index 79%
rename from src/components/Portfolio/Card/Skeleton.tsx
rename to src/components/portfolio/Card/Skeleton.tsx
index 85ba4452..3fb0e2e6 100644
--- a/src/components/Portfolio/Card/Skeleton.tsx
+++ b/src/components/portfolio/Card/Skeleton.tsx
@@ -1,10 +1,10 @@
 import React from 'react'
 
-import HealthBar from 'components/Account/Health/HealthBar'
-import Card from 'components/Card'
-import HLSTag from 'components/HLS/HLSTag'
-import Text from 'components/Text'
-import TitleAndSubCell from 'components/TitleAndSubCell'
+import HealthBar from 'components/account/Health/HealthBar'
+import Card from 'components/common/Card'
+import HLSTag from 'components/hls/HLSTag'
+import Text from 'components/common/Text'
+import TitleAndSubCell from 'components/common/TitleAndSubCell'
 
 interface Props {
   stats: { title: React.ReactNode; sub: string }[]
diff --git a/src/components/Portfolio/Card/index.tsx b/src/components/portfolio/Card/index.tsx
similarity index 85%
rename from src/components/Portfolio/Card/index.tsx
rename to src/components/portfolio/Card/index.tsx
index 7a233b61..600864e2 100644
--- a/src/components/Portfolio/Card/index.tsx
+++ b/src/components/portfolio/Card/index.tsx
@@ -2,19 +2,20 @@ import classNames from 'classnames'
 import { ReactNode, useMemo } from 'react'
 import { NavLink, useParams, useSearchParams } from 'react-router-dom'
 
-import { FormattedNumber } from 'components/FormattedNumber'
-import Loading from 'components/Loading'
-import Skeleton from 'components/Portfolio/Card/Skeleton'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Loading from 'components/common/Loading'
+import Skeleton from 'components/portfolio/Card/Skeleton'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
 import { BN_ZERO } from 'constants/math'
-import useAccount from 'hooks/useAccount'
+import useAccount from 'hooks/accounts/useAccount'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import useAccountId from 'hooks/useAccountId'
 import useBorrowMarketAssetsTableData from 'hooks/useBorrowMarketAssetsTableData'
 import useHealthComputer from 'hooks/useHealthComputer'
 import useHLSStakingAssets from 'hooks/useHLSStakingAssets'
 import useLendingMarketAssetsTableData from 'hooks/useLendingMarketAssetsTableData'
-import useLocalStorage from 'hooks/useLocalStorage'
 import usePrices from 'hooks/usePrices'
 import {
   calculateAccountApr,
@@ -34,10 +35,10 @@ export default function PortfolioCard(props: Props) {
   const { data: prices } = usePrices()
   const currentAccountId = useAccountId()
   const { allAssets: lendingAssets } = useLendingMarketAssetsTableData()
-  const { data } = useBorrowMarketAssetsTableData(false)
+  const data = useBorrowMarketAssetsTableData()
   const { data: hlsStrategies } = useHLSStakingAssets()
   const [searchParams] = useSearchParams()
-
+  const assets = useAllAssets()
   const borrowAssets = useMemo(() => data?.allAssets || [], [data])
   const [reduceMotion] = useLocalStorage<boolean>(
     LocalStorageKeys.REDUCE_MOTION,
@@ -46,13 +47,13 @@ export default function PortfolioCard(props: Props) {
 
   const [deposits, lends, debts, vaults] = useMemo(() => {
     if (!prices.length || !account) return Array(4).fill(BN_ZERO)
-    return getAccountPositionValues(account, prices)
-  }, [prices, account])
+    return getAccountPositionValues(account, prices, assets)
+  }, [prices, account, assets])
 
   const leverage = useMemo(() => {
     if (!prices.length || !account) return BN_ZERO
-    return calculateAccountLeverage(account, prices)
-  }, [account, prices])
+    return calculateAccountLeverage(account, prices, assets)
+  }, [account, assets, prices])
 
   const apr = useMemo(() => {
     if (!lendingAssets.length || !borrowAssets.length || !prices.length || !account) return null
@@ -62,9 +63,10 @@ export default function PortfolioCard(props: Props) {
       lendingAssets,
       prices,
       hlsStrategies,
+      assets,
       account.kind === 'high_levered_strategy',
     )
-  }, [lendingAssets, borrowAssets, prices, account, hlsStrategies])
+  }, [lendingAssets, borrowAssets, prices, account, hlsStrategies, assets])
 
   const stats: { title: ReactNode; sub: string }[] = useMemo(() => {
     const isLoaded = account && prices.length && apr !== null
diff --git a/src/components/Portfolio/Overview/ConnectInfo.tsx b/src/components/portfolio/Overview/ConnectInfo.tsx
similarity index 84%
rename from src/components/Portfolio/Overview/ConnectInfo.tsx
rename to src/components/portfolio/Overview/ConnectInfo.tsx
index c555dce3..9c1902cb 100644
--- a/src/components/Portfolio/Overview/ConnectInfo.tsx
+++ b/src/components/portfolio/Overview/ConnectInfo.tsx
@@ -1,5 +1,5 @@
-import Card from 'components/Card'
-import Text from 'components/Text'
+import Card from 'components/common/Card'
+import Text from 'components/common/Text'
 import WalletConnectButton from 'components/Wallet/WalletConnectButton'
 
 export default function ConnectInfo() {
diff --git a/src/components/Portfolio/Overview/Summary.tsx b/src/components/portfolio/Overview/Summary.tsx
similarity index 85%
rename from src/components/Portfolio/Overview/Summary.tsx
rename to src/components/portfolio/Overview/Summary.tsx
index 729471c7..c4ec66fd 100644
--- a/src/components/Portfolio/Overview/Summary.tsx
+++ b/src/components/portfolio/Overview/Summary.tsx
@@ -1,11 +1,12 @@
 import { useMemo } from 'react'
 import { useParams } from 'react-router-dom'
 
-import DisplayCurrency from 'components/DisplayCurrency'
-import { FormattedNumber } from 'components/FormattedNumber'
-import SummarySkeleton from 'components/Portfolio/SummarySkeleton'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import SummarySkeleton from 'components/portfolio/SummarySkeleton'
 import { MAX_AMOUNT_DECIMALS } from 'constants/math'
-import useAccounts from 'hooks/useAccounts'
+import useAccounts from 'hooks/accounts/useAccounts'
+import useAllAssets from 'hooks/assets/useAllAssets'
 import useBorrowMarketAssetsTableData from 'hooks/useBorrowMarketAssetsTableData'
 import useHLSStakingAssets from 'hooks/useHLSStakingAssets'
 import useLendingMarketAssetsTableData from 'hooks/useLendingMarketAssetsTableData'
@@ -18,12 +19,12 @@ export default function PortfolioSummary() {
   const { address: urlAddress } = useParams()
   const walletAddress = useStore((s) => s.address)
   const { data: prices } = usePrices()
-  const { data } = useBorrowMarketAssetsTableData(false)
+  const data = useBorrowMarketAssetsTableData()
   const borrowAssets = useMemo(() => data?.allAssets || [], [data])
   const { allAssets: lendingAssets } = useLendingMarketAssetsTableData()
   const { data: accounts } = useAccounts('default', urlAddress || walletAddress)
   const { data: hlsStrategies } = useHLSStakingAssets()
-
+  const assets = useAllAssets()
   const stats = useMemo(() => {
     if (!accounts?.length) return
     const combinedAccount = accounts.reduce(
@@ -40,6 +41,7 @@ export default function PortfolioSummary() {
         lends: [],
         debts: [],
         vaults: [],
+        perps: [],
         kind: 'default',
       } as Account,
     )
@@ -50,6 +52,7 @@ export default function PortfolioSummary() {
       borrowAssets,
       lendingAssets,
       hlsStrategies,
+      assets,
     )
 
     return [
@@ -90,7 +93,7 @@ export default function PortfolioSummary() {
         sub: 'Combined leverage',
       },
     ]
-  }, [accounts, borrowAssets, hlsStrategies, lendingAssets, prices])
+  }, [accounts, assets, borrowAssets, hlsStrategies, lendingAssets, prices])
 
   if (!walletAddress && !urlAddress) return null
 
diff --git a/src/components/Portfolio/Overview/index.tsx b/src/components/portfolio/Overview/index.tsx
similarity index 80%
rename from src/components/Portfolio/Overview/index.tsx
rename to src/components/portfolio/Overview/index.tsx
index df96df64..e0208dde 100644
--- a/src/components/Portfolio/Overview/index.tsx
+++ b/src/components/portfolio/Overview/index.tsx
@@ -2,15 +2,16 @@ import classNames from 'classnames'
 import { useCallback } from 'react'
 import { useParams } from 'react-router-dom'
 
-import AccountCreateFirst from 'components/Account/AccountCreateFirst'
-import Button from 'components/Button'
-import Card from 'components/Card'
-import { PlusCircled } from 'components/Icons'
-import PortfolioCard from 'components/Portfolio/Card'
-import ConnectInfo from 'components/Portfolio/Overview/ConnectInfo'
-import Text from 'components/Text'
+import AccountCreateFirst from 'components/account/AccountCreateFirst'
+import Button from 'components/common/Button'
+import Card from 'components/common/Card'
+import { PlusCircled } from 'components/common/Icons'
+import PortfolioCard from 'components/portfolio/Card'
+import ConnectInfo from 'components/portfolio/Overview/ConnectInfo'
+import Text from 'components/common/Text'
 import WalletBridges from 'components/Wallet/WalletBridges'
-import useAccountIds from 'hooks/useAccountIds'
+import useAccountIds from 'hooks/accounts/useAccountIds'
+import useBaseAsset from 'hooks/assets/useBasetAsset'
 import useCurrentWalletBalance from 'hooks/useCurrentWalletBalance'
 import useStore from 'store'
 import { defaultFee } from 'utils/constants'
@@ -21,8 +22,8 @@ export default function AccountSummary() {
   const walletAddress = useStore((s) => s.address)
   const { data: accountIds, isLoading } = useAccountIds(urlAddress)
 
-  const baseCurrency = useStore((s) => s.baseCurrency)
-  const transactionFeeCoinBalance = useCurrentWalletBalance(baseCurrency.denom)
+  const baseAsset = useBaseAsset()
+  const transactionFeeCoinBalance = useCurrentWalletBalance(baseAsset.denom)
 
   const checkHasFunds = useCallback(() => {
     return (
diff --git a/src/components/Portfolio/PortfolioIntro.tsx b/src/components/portfolio/PortfolioIntro.tsx
similarity index 95%
rename from src/components/Portfolio/PortfolioIntro.tsx
rename to src/components/portfolio/PortfolioIntro.tsx
index e359527a..850d1355 100644
--- a/src/components/Portfolio/PortfolioIntro.tsx
+++ b/src/components/portfolio/PortfolioIntro.tsx
@@ -1,6 +1,6 @@
 import { useParams } from 'react-router-dom'
 
-import Intro from 'components/Intro'
+import Intro from 'components/common/Intro'
 import useStore from 'store'
 
 export default function PortfolioIntro() {
diff --git a/src/components/Portfolio/SummarySkeleton.tsx b/src/components/portfolio/SummarySkeleton.tsx
similarity index 78%
rename from src/components/Portfolio/SummarySkeleton.tsx
rename to src/components/portfolio/SummarySkeleton.tsx
index 11cc14d3..a8aa1adc 100644
--- a/src/components/Portfolio/SummarySkeleton.tsx
+++ b/src/components/portfolio/SummarySkeleton.tsx
@@ -1,13 +1,13 @@
 import React from 'react'
 
-import HealthBar from 'components/Account/Health/HealthBar'
-import HealthIcon from 'components/Account/Health/HealthIcon'
-import Card from 'components/Card'
-import HLSTag from 'components/HLS/HLSTag'
-import Loading from 'components/Loading'
-import Text from 'components/Text'
-import TitleAndSubCell from 'components/TitleAndSubCell'
-import useAccount from 'hooks/useAccount'
+import HealthBar from 'components/account/Health/HealthBar'
+import HealthIcon from 'components/account/Health/HealthIcon'
+import Card from 'components/common/Card'
+import HLSTag from 'components/hls/HLSTag'
+import Loading from 'components/common/Loading'
+import Text from 'components/common/Text'
+import TitleAndSubCell from 'components/common/TitleAndSubCell'
+import useAccount from 'hooks/accounts/useAccount'
 import { DEFAULT_PORTFOLIO_STATS } from 'utils/constants'
 
 interface Props {
diff --git a/src/components/Trade/AccountDetailsCard.tsx b/src/components/trade/AccountDetailsCard.tsx
similarity index 84%
rename from src/components/Trade/AccountDetailsCard.tsx
rename to src/components/trade/AccountDetailsCard.tsx
index 3f153243..49e7bb5e 100644
--- a/src/components/Trade/AccountDetailsCard.tsx
+++ b/src/components/trade/AccountDetailsCard.tsx
@@ -1,13 +1,13 @@
 import { useMemo } from 'react'
 
-import AccountBalancesTable from 'components/Account/AccountBalancesTable'
+import AccountBalancesTable from 'components/account/AccountBalancesTable'
+import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
 import useBorrowMarketAssetsTableData from 'hooks/useBorrowMarketAssetsTableData'
-import useCurrentAccount from 'hooks/useCurrentAccount'
 import useLendingMarketAssetsTableData from 'hooks/useLendingMarketAssetsTableData'
 
 export default function AccountDetailsCard() {
   const account = useCurrentAccount()
-  const { data } = useBorrowMarketAssetsTableData(false)
+  const data = useBorrowMarketAssetsTableData()
   const borrowAssetsData = useMemo(() => data?.allAssets || [], [data])
   const { availableAssets: lendingAvailableAssets, accountLentAssets } =
     useLendingMarketAssetsTableData()
diff --git a/src/components/trade/TradeChart/DataFeed.ts b/src/components/trade/TradeChart/DataFeed.ts
new file mode 100644
index 00000000..78ff9290
--- /dev/null
+++ b/src/components/trade/TradeChart/DataFeed.ts
@@ -0,0 +1,142 @@
+import { subscribeOnStream, unsubscribeFromStream } from 'components/trade/TradeChart/streaming'
+import { pythEndpoints } from 'constants/pyth'
+import {
+  ErrorCallback,
+  HistoryCallback,
+  LibrarySymbolInfo,
+  OnReadyCallback,
+  PeriodParams,
+  ResolutionString,
+  ResolveCallback,
+  SearchSymbolsCallback,
+  SubscribeBarsCallback,
+  SymbolResolveExtension,
+} from 'utils/charting_library'
+
+const lastBarsCache = new Map()
+
+export const datafeed = {
+  onReady: (callback: OnReadyCallback) => {
+    callback({
+      supported_resolutions: [
+        '1',
+        '2',
+        '5',
+        '15',
+        '30',
+        '60',
+        '120',
+        '240',
+        '360',
+        '720',
+        'D',
+        '1D',
+        'W',
+        '1W',
+        'M',
+        '1M',
+      ] as ResolutionString[],
+      supports_marks: true,
+      supports_timescale_marks: false,
+    })
+  },
+  getBars: (
+    symbolInfo: LibrarySymbolInfo,
+    resolution: ResolutionString,
+    periodParams: PeriodParams,
+    onHistoryCallback: HistoryCallback,
+    onErrorCallback: ErrorCallback,
+  ) => {
+    const { from, to, firstDataRequest } = periodParams
+    fetch(
+      `${pythEndpoints.candles}/history?symbol=${symbolInfo.ticker}&from=${from}&to=${to}&resolution=${resolution}`,
+    ).then((response) => {
+      response
+        .json()
+        .then((data) => {
+          if (data.errmsg) {
+            onHistoryCallback([], { noData: true })
+            return
+          }
+          if (data.t.length === 0) {
+            onHistoryCallback([], { noData: true })
+            return
+          }
+          const bars = []
+          for (let i = 0; i < data.t.length; ++i) {
+            bars.push({
+              time: data.t[i] * 1000,
+              low: data.l[i],
+              high: data.h[i],
+              open: data.o[i],
+              close: data.c[i],
+            })
+          }
+          if (firstDataRequest) {
+            lastBarsCache.set(symbolInfo.ticker, {
+              ...bars[bars.length - 1],
+            })
+          }
+          onHistoryCallback(bars, { noData: false })
+        })
+        .catch((error) => {
+          onErrorCallback(error)
+        })
+    })
+  },
+  subscribeBars(
+    symbolInfo: LibrarySymbolInfo,
+    resolution: ResolutionString,
+    onRealtimeCallback: SubscribeBarsCallback,
+    subscriberUID: string,
+    onResetCacheNeededCallback: () => void,
+  ): void {
+    subscribeOnStream(
+      symbolInfo,
+      resolution,
+      onRealtimeCallback,
+      subscriberUID,
+      onResetCacheNeededCallback,
+      lastBarsCache.get(symbolInfo.ticker),
+    )
+  },
+  unsubscribeBars(subscriberUID: string) {
+    unsubscribeFromStream(subscriberUID)
+  },
+  searchSymbols: (
+    userInput: string,
+    exchange: string,
+    symbolType: string,
+    onResult: SearchSymbolsCallback,
+  ) => {
+    return
+  },
+  resolveSymbol: (
+    symbolName: string,
+    onResolve: ResolveCallback,
+    onError: ErrorCallback,
+    extension?: SymbolResolveExtension,
+  ) => {
+    try {
+      fetch(`${pythEndpoints.candles}/symbols?symbol=${symbolName}`).then((response) => {
+        response
+          .json()
+          .then((symbolInfo) => {
+            if (symbolInfo.errmsg) {
+              symbolInfo.description = symbolName
+            } else {
+              symbolInfo.description = symbolInfo.ticker.split('Crypto.')[1]
+            }
+            onResolve(symbolInfo)
+          })
+          .catch((error) => {
+            console.error(error)
+            return
+          })
+      })
+    } catch (error) {
+      console.error(error)
+      return
+    }
+  },
+}
diff --git a/src/components/Trade/TradeChart/PoweredByPyth.tsx b/src/components/trade/TradeChart/PoweredByPyth.tsx
similarity index 71%
rename from src/components/Trade/TradeChart/PoweredByPyth.tsx
rename to src/components/trade/TradeChart/PoweredByPyth.tsx
index c743bf56..31897bd0 100644
--- a/src/components/Trade/TradeChart/PoweredByPyth.tsx
+++ b/src/components/trade/TradeChart/PoweredByPyth.tsx
@@ -1,5 +1,5 @@
-import { PythLogoType } from 'components/Icons'
-import Text from 'components/Text'
+import { PythLogoType } from 'components/common/Icons'
+import Text from 'components/common/Text'
 
 export default function PoweredByPyth() {
   return (
diff --git a/src/components/Trade/TradeChart/constants.ts b/src/components/trade/TradeChart/constants.ts
similarity index 92%
rename from src/components/Trade/TradeChart/constants.ts
rename to src/components/trade/TradeChart/constants.ts
index 8b2689d4..0a4a4c2a 100644
--- a/src/components/Trade/TradeChart/constants.ts
+++ b/src/components/trade/TradeChart/constants.ts
@@ -1,7 +1,6 @@
 import {
   ChartingLibraryFeatureset,
   LibrarySymbolInfo,
-  ResolutionString,
   SeriesFormat,
   Timezone,
 } from 'utils/charting_library/charting_library'
@@ -20,6 +19,7 @@ export const enabledFeatures: ChartingLibraryFeatureset[] = [
   'timezone_menu',
   'header_settings',
   'use_localstorage_for_settings',
+  'chart_zoom',
 ]
 
 export const overrides = {
@@ -38,5 +38,4 @@ export const defaultSymbolInfo: Partial<LibrarySymbolInfo> = {
   has_daily: true,
   has_weekly_and_monthly: false,
   format: 'price' as SeriesFormat,
-  supported_resolutions: ['15'] as ResolutionString[],
 }
diff --git a/src/components/trade/TradeChart/index.tsx b/src/components/trade/TradeChart/index.tsx
new file mode 100644
index 00000000..b3554d5f
--- /dev/null
+++ b/src/components/trade/TradeChart/index.tsx
@@ -0,0 +1,127 @@
+import { useEffect, useMemo, useRef } from 'react'
+
+import Card from 'components/common/Card'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import Loading from 'components/common/Loading'
+import Text from 'components/common/Text'
+import { datafeed } from 'components/trade/TradeChart/DataFeed'
+import PoweredByPyth from 'components/trade/TradeChart/PoweredByPyth'
+import { disabledFeatures, enabledFeatures } from 'components/trade/TradeChart/constants'
+import { BN_ZERO } from 'constants/math'
+import usePrices from 'hooks/usePrices'
+import { BNCoin } from 'types/classes/BNCoin'
+import { byDenom } from 'utils/array'
+import { ChartingLibraryWidgetOptions, ResolutionString, widget } from 'utils/charting_library'
+import { magnify } from 'utils/formatters'
+interface Props {
+  buyAsset: Asset
+  sellAsset: Asset
+}
+export default function TradeChart(props: Props) {
+  const { data: prices, isLoading } = usePrices()
+  const ratio = useMemo(() => {
+    const priceBuyAsset = prices.find(byDenom(props.buyAsset.denom))?.amount
+    const priceSellAsset = prices.find(byDenom(props.sellAsset.denom))?.amount
+
+    if (!priceBuyAsset || !priceSellAsset) return BN_ZERO
+    return priceBuyAsset.dividedBy(priceSellAsset)
+  }, [prices, props.buyAsset.denom, props.sellAsset.denom])
+
+  const chartContainerRef = useRef<HTMLDivElement>() as React.MutableRefObject<HTMLInputElement>
+
+  useEffect(() => {
+    if (typeof window !== 'undefined' && window.TradingView) {
+      const widgetOptions: ChartingLibraryWidgetOptions = {
+        symbol: props.buyAsset.pythFeedName ?? `${props.buyAsset.symbol}/USD`,
+        datafeed: datafeed,
+        interval: '1h' as ResolutionString,
+        library_path: '/charting_library/',
+        locale: 'en',
+        time_scale: {
+          min_bar_spacing: 12,
+        },
+        toolbar_bg: '#220E1D',
+        disabled_features: disabledFeatures,
+        enabled_features: enabledFeatures,
+        fullscreen: false,
+        autosize: true,
+        container: chartContainerRef.current,
+        theme: 'dark',
+        overrides: {
+          'paneProperties.background': '#220E1D',
+          'paneProperties.backgroundType': 'solid',
+          'paneProperties.backgroundGradientStartColor': '#220E1D',
+          'paneProperties.backgroundGradientEndColor': '#220E1D',
+          'linetooltrendline.linecolor': 'rgba(255, 255, 255, 0.8)',
+          'linetooltrendline.linewidth': 2,
+        },
+        loading_screen: {
+          backgroundColor: '#220E1D',
+          foregroundColor: 'rgba(255, 255, 255, 0.3)',
+        },
+        custom_css_url: '/tradingview.css',
+      }
+
+      const tvWidget = new widget(widgetOptions)
+      tvWidget.onChartReady(() => {
+        const chart = tvWidget.chart()
+        chart.getSeries().setChartStyleProperties(1, {
+          upColor: '#3DAE9A',
+          downColor: '#AE3D3D',
+          borderColor: '#232834',
+          borderUpColor: '#3DAE9A',
+          borderDownColor: '#AE3D3D',
+          wickUpColor: '#3DAE9A',
+          wickDownColor: '#AE3D3D',
+          barColorsOnPrevClose: false,
+        })
+      })
+    }
+  }, [props.buyAsset.pythFeedName, props.buyAsset.symbol])
+
+  return (
+    <Card
+      title={
+        <div className='flex items-center w-full bg-white/10'>
+          <Text size='lg' className='flex items-center flex-1 p-4 font-semibold'>
+            Trading Chart
+          </Text>
+          {ratio.isZero() || isLoading ? (
+            <Loading className='h-4 mr-4 w-60' />
+          ) : (
+            <div className='flex items-center gap-1 p-4'>
+              <Text size='sm'>1 {props.buyAsset.symbol}</Text>
+              <FormattedNumber
+                className='text-sm'
+                amount={Number(ratio.toPrecision(6))}
+                options={{
+                  prefix: '= ',
+                  suffix: ` ${props.sellAsset.symbol}`,
+                  abbreviated: false,
+                  maxDecimals: props.sellAsset.decimals,
+                }}
+              />
+              <DisplayCurrency
+                parentheses
+                options={{ abbreviated: false }}
+                className='justify-end pl-2 text-sm text-white/50'
+                coin={
+                  new BNCoin({
+                    denom: props.buyAsset.denom,
+                    amount: magnify(1, props.buyAsset).toString(),
+                  })
+                }
+              />
+            </div>
+          )}
+        </div>
+      }
+      contentClassName='px-0.5 pb-0.5 h-full bg-chart w-[calc(100%-2px)] ml-[1px]'
+      className='h-[70dvh] max-h-[980px] min-h-[560px]'
+    >
+      <div ref={chartContainerRef} className='h-[calc(100%-32px)] overflow-hidden' />
+      <PoweredByPyth />
+    </Card>
+  )
+}
diff --git a/src/components/trade/TradeChart/streaming.ts b/src/components/trade/TradeChart/streaming.ts
new file mode 100644
index 00000000..2750f5a5
--- /dev/null
+++ b/src/components/trade/TradeChart/streaming.ts
@@ -0,0 +1,148 @@
+import { pythEndpoints } from 'constants/pyth'
+import {
+  LibrarySymbolInfo,
+  ResolutionString,
+  SubscribeBarsCallback,
+} from 'utils/charting_library/charting_library'
+
+const streamingUrl = `${pythEndpoints.candles}/streaming`
+const channelToSubscription = new Map()
+
+function handleStreamingData(data: StreamData) {
+  const { id, p, t } = data
+
+  const tradePrice = p
+  const tradeTime = t * 1000 // Multiplying by 1000 to get milliseconds
+
+  const channelString = id
+  const subscriptionItem = channelToSubscription.get(channelString)
+
+  if (!subscriptionItem) {
+    return
+  }
+
+  const lastDailyBar = subscriptionItem.lastDailyBar
+  const nextDailyBarTime = getNextDailyBarTime(lastDailyBar.time)
+
+  let bar: Bar
+  if (tradeTime >= nextDailyBarTime) {
+    bar = {
+      time: nextDailyBarTime,
+      open: tradePrice,
+      high: tradePrice,
+      low: tradePrice,
+      close: tradePrice,
+    }
+  } else {
+    bar = {
+      ...lastDailyBar,
+      high: Math.max(lastDailyBar.high, tradePrice),
+      low: Math.min(lastDailyBar.low, tradePrice),
+      close: tradePrice,
+    }
+  }
+
+  subscriptionItem.lastDailyBar = bar
+
+  // Send data to every subscriber of that symbol
+  subscriptionItem.handlers.forEach((handler: any) => handler.callback(bar))
+  channelToSubscription.set(channelString, subscriptionItem)
+}
+
+function startStreaming(retries = 3, delay = 3000) {
+  fetch(streamingUrl)
+    .then((response) => {
+      if (response.body === null) return
+      const reader = response.body.getReader()
+
+      function streamData() {
+        reader
+          .read()
+          .then(({ value, done }) => {
+            if (done) {
+              // console.error('Streaming ended.')
+              return
+            }
+
+            const dataStrings = new TextDecoder().decode(value).split('\n')
+            dataStrings.forEach((dataString) => {
+              const trimmedDataString = dataString.trim()
+              if (trimmedDataString) {
+                try {
+                  var jsonData = JSON.parse(trimmedDataString)
+                  handleStreamingData(jsonData)
+                } catch (e) {
+                  if (e instanceof Error) {
+                    // console.error('Error parsing JSON:', e.message)
+                  }
+                }
+              }
+            })
+
+            streamData()
+          })
+          .catch((error) => {
+            // console.error('Error reading from stream:', error)
+            attemptReconnect(retries, delay)
+          })
+      }
+
+      streamData()
+    })
+    .catch((error) => {
+      // console.error('Error fetching from the streaming endpoint:', error)
+    })
+  function attemptReconnect(retriesLeft: number, delay: number) {
+    if (retriesLeft > 0) {
+      setTimeout(() => {
+        startStreaming(retriesLeft - 1, delay)
+      }, delay)
+    } else {
+      // console.error('Maximum reconnection attempts reached.')
+    }
+  }
+}
+
+function getNextDailyBarTime(barTime: number) {
+  const date = new Date(barTime * 1000)
+  date.setDate(date.getDate() + 1)
+  return date.getTime() / 1000
+}
+
+export function subscribeOnStream(
+  symbolInfo: LibrarySymbolInfo,
+  resolution: ResolutionString,
+  onRealtimeCallback: SubscribeBarsCallback,
+  subscriberUID: string,
+  onResetCacheNeededCallback: () => void,
+  lastDailyBar: Bar,
+) {
+  const channelString = symbolInfo.ticker
+  const handler = {
+    id: subscriberUID,
+    callback: onRealtimeCallback,
+  }
+  let subscriptionItem = channelToSubscription.get(channelString)
+  subscriptionItem = {
+    subscriberUID,
+    resolution,
+    lastDailyBar,
+    handlers: [handler],
+  }
+  channelToSubscription.set(channelString, subscriptionItem)
+  startStreaming()
+}
+
+export function unsubscribeFromStream(subscriberUID: string) {
+  for (const channelString of channelToSubscription.keys()) {
+    const subscriptionItem = channelToSubscription.get(channelString)
+    const handlerIndex = subscriptionItem.handlers.findIndex(
+      (handler: any) => handler.id === subscriberUID,
+    )
+
+    if (handlerIndex !== -1) {
+      channelToSubscription.delete(channelString)
+      break
+    }
+  }
+}
diff --git a/src/components/Trade/TradeModule/AssetSelector/AssetButton.tsx b/src/components/trade/TradeModule/AssetSelector/AssetButton.tsx
similarity index 79%
rename from src/components/Trade/TradeModule/AssetSelector/AssetButton.tsx
rename to src/components/trade/TradeModule/AssetSelector/AssetButton.tsx
index 9ed9adbf..53b064e2 100644
--- a/src/components/Trade/TradeModule/AssetSelector/AssetButton.tsx
+++ b/src/components/trade/TradeModule/AssetSelector/AssetButton.tsx
@@ -1,5 +1,5 @@
-import AssetImage from 'components/Asset/AssetImage'
-import Button from 'components/Button'
+import AssetImage from 'components/common/assets/AssetImage'
+import Button from 'components/common/Button'
 
 interface Props {
   asset: Asset
diff --git a/src/components/Trade/TradeModule/AssetSelector/AssetItem.tsx b/src/components/trade/TradeModule/AssetSelector/AssetItem.tsx
similarity index 87%
rename from src/components/Trade/TradeModule/AssetSelector/AssetItem.tsx
rename to src/components/trade/TradeModule/AssetSelector/AssetItem.tsx
index b3aa58bc..f793a2ce 100644
--- a/src/components/Trade/TradeModule/AssetSelector/AssetItem.tsx
+++ b/src/components/trade/TradeModule/AssetSelector/AssetItem.tsx
@@ -1,14 +1,13 @@
 import { useMemo } from 'react'
 
-import AssetImage from 'components/Asset/AssetImage'
-import AssetSymbol from 'components/Asset/AssetSymbol'
-import DisplayCurrency from 'components/DisplayCurrency'
-import { FormattedNumber } from 'components/FormattedNumber'
-import { StarFilled, StarOutlined } from 'components/Icons'
-import Text from 'components/Text'
-import { LocalStorageKeys } from 'constants/localStorageKeys'
+import AssetImage from 'components/common/assets/AssetImage'
+import AssetSymbol from 'components/common/assets/AssetSymbol'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import { StarFilled, StarOutlined } from 'components/common/Icons'
+import Text from 'components/common/Text'
 import { BN_ONE, BN_ZERO, MAX_AMOUNT_DECIMALS, MIN_AMOUNT } from 'constants/math'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useFavoriteAssets from 'hooks/localStorage/useFavoriteAssets'
 import { BNCoin } from 'types/classes/BNCoin'
 import { byDenom } from 'utils/array'
 import { demagnify, formatAmountToPrecision } from 'utils/formatters'
@@ -22,10 +21,7 @@ interface Props {
 
 export default function AssetItem(props: Props) {
   const asset = props.asset
-  const [favoriteAssetsDenoms, setFavoriteAssetsDenoms] = useLocalStorage<string[]>(
-    LocalStorageKeys.FAVORITE_ASSETS,
-    [],
-  )
+  const [favoriteAssetsDenoms, setFavoriteAssetsDenoms] = useFavoriteAssets()
   const amount = demagnify(props.balances.find(byDenom(asset.denom))?.amount ?? BN_ZERO, asset)
   const formattedAmount = formatAmountToPrecision(amount, MAX_AMOUNT_DECIMALS)
   const lowAmount = formattedAmount === 0 ? 0 : Math.max(formattedAmount, MIN_AMOUNT)
diff --git a/src/components/Trade/TradeModule/AssetSelector/AssetList.tsx b/src/components/trade/TradeModule/AssetSelector/AssetList.tsx
similarity index 56%
rename from src/components/Trade/TradeModule/AssetSelector/AssetList.tsx
rename to src/components/trade/TradeModule/AssetSelector/AssetList.tsx
index 27675f15..7f21e07b 100644
--- a/src/components/Trade/TradeModule/AssetSelector/AssetList.tsx
+++ b/src/components/trade/TradeModule/AssetSelector/AssetList.tsx
@@ -1,53 +1,56 @@
 import classNames from 'classnames'
 import { useMemo } from 'react'
 
-import { ChevronDown } from 'components/Icons'
-import Text from 'components/Text'
-import { ASSETS } from 'constants/assets'
-import useCurrentAccount from 'hooks/useCurrentAccount'
-import useMarketAssets from 'hooks/useMarketAssets'
-import useMarketDeposits from 'hooks/useMarketDeposits'
+import { ChevronDown } from 'components/common/Icons'
+import Text from 'components/common/Text'
+import AssetSelectorItem from 'components/trade/TradeModule/AssetSelector/AssetSelectorItem'
+import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
+import useMarketEnabledAssets from 'hooks/assets/useMarketEnabledAssets'
+import useMarketAssets from 'hooks/markets/useMarketAssets'
+import useMarketDeposits from 'hooks/markets/useMarketDeposits'
 import usePrices from 'hooks/usePrices'
+import useStore from 'store'
 import { getMergedBalancesForAsset } from 'utils/accounts'
 import { byDenom } from 'utils/array'
-import { getEnabledMarketAssets, sortAssetsOrPairs } from 'utils/assets'
-import AssetSelectorItem from 'components/Trade/TradeModule/AssetSelector/AssetSelectorItem'
+import { sortAssetsOrPairs } from 'utils/assets'
 
 interface Props {
-  type: 'buy' | 'sell'
+  type: 'buy' | 'sell' | 'perps'
   assets: Asset[]
   isOpen: boolean
   toggleOpen: () => void
   onChangeAsset: (asset: Asset | AssetPair) => void
 }
 
-const baseDenom = ASSETS[0].denom
-
 export default function AssetList(props: Props) {
+  const baseDenom = useStore((s) => s.chainConfig.assets[0].denom)
   const { assets, type, isOpen, toggleOpen, onChangeAsset } = props
   const account = useCurrentAccount()
   const { data: marketAssets } = useMarketAssets()
   const { data: marketDeposits } = useMarketDeposits()
   const { data: prices } = usePrices()
+  const marketEnabledAssets = useMarketEnabledAssets()
   const balances = useMemo(() => {
     if (!account) return []
-    return getMergedBalancesForAsset(account, getEnabledMarketAssets())
-  }, [account])
+    return getMergedBalancesForAsset(account, marketEnabledAssets)
+  }, [account, marketEnabledAssets])
 
   const sortedAssets = useMemo(
     () => sortAssetsOrPairs(assets, prices, marketDeposits, balances, baseDenom) as Asset[],
-    [balances, prices, assets, marketDeposits],
+    [assets, prices, marketDeposits, balances, baseDenom],
   )
 
   return (
     <section>
-      <button
-        className='flex items-center justify-between w-full p-4 bg-black/20'
-        onClick={toggleOpen}
-      >
-        <Text>{type === 'buy' ? 'Buy asset' : 'Sell asset'}</Text>
-        <ChevronDown className={classNames(isOpen && '-rotate-180', 'w-4')} />
-      </button>
+      {type !== 'perps' && (
+        <button
+          className='flex items-center justify-between w-full p-4 bg-black/20'
+          onClick={toggleOpen}
+        >
+          <Text>{type === 'buy' ? 'Buy asset' : 'Sell asset'}</Text>
+          <ChevronDown className={classNames(isOpen && '-rotate-180', 'w-4')} />
+        </button>
+      )}
       {isOpen &&
         (sortedAssets.length === 0 ? (
           <Text size='xs' className='p-4'>
diff --git a/src/components/trade/TradeModule/AssetSelector/AssetOverlay/StablesFilter.tsx b/src/components/trade/TradeModule/AssetSelector/AssetOverlay/StablesFilter.tsx
new file mode 100644
index 00000000..4787eafb
--- /dev/null
+++ b/src/components/trade/TradeModule/AssetSelector/AssetOverlay/StablesFilter.tsx
@@ -0,0 +1,33 @@
+import Button from 'components/common/Button'
+import Divider from 'components/common/Divider'
+
+interface StablesFilterProps {
+  onFilter: (stables: Asset[]) => void
+  selectedStables: Asset[]
+  stables: Asset[]
+}
+
+export default function StablesFilter(props: StablesFilterProps) {
+  const { stables, selectedStables, onFilter } = props
+  const isAllSelected = selectedStables.length > 1
+  return (
+    <>
+      <Divider />
+      <div className='flex items-center w-full gap-2 p-2'>
+        {stables.map((stable) => {
+          const isCurrent = !isAllSelected && selectedStables[0].denom === stable.denom
+          return (
+            <Button
+              key={stable.symbol}
+              onClick={() => onFilter([stable])}
+              text={stable.symbol}
+              color={isCurrent ? 'secondary' : 'quaternary'}
+              variant='transparent'
+              className={isCurrent ? '!text-white !bg-white/10 border-white' : ''}
+            />
+          )
+        })}
+      </div>
+    </>
+  )
+}
diff --git a/src/components/trade/TradeModule/AssetSelector/AssetOverlay/index.tsx b/src/components/trade/TradeModule/AssetSelector/AssetOverlay/index.tsx
new file mode 100644
index 00000000..b0aea29f
--- /dev/null
+++ b/src/components/trade/TradeModule/AssetSelector/AssetOverlay/index.tsx
@@ -0,0 +1,147 @@
+import { useCallback, useMemo, useState } from 'react'
+
+import EscButton from 'components/common/Button/EscButton'
+import Divider from 'components/common/Divider'
+import Overlay from 'components/common/Overlay'
+import SearchBar from 'components/common/SearchBar'
+import Text from 'components/common/Text'
+import AssetList from 'components/trade/TradeModule/AssetSelector/AssetList'
+import StablesFilter from 'components/trade/TradeModule/AssetSelector/AssetOverlay/StablesFilter'
+import PairsList from 'components/trade/TradeModule/AssetSelector/PairsList'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import useFilteredAssets from 'hooks/useFilteredAssets'
+
+interface Props {
+  state: OverlayState
+  buyAsset: Asset
+  sellAsset: Asset
+  buyAssets: Asset[]
+  onChangeBuyAsset?: (asset: Asset) => void
+  onChangeSellAsset?: (asset: Asset) => void
+  onChangeTradingPair?: (tradingPair: TradingPair) => void
+  onChangeState: (state: OverlayState) => void
+  type: 'pair' | 'single' | 'perps'
+}
+
+export default function AssetOverlay(props: Props) {
+  const { assets, searchString, onChangeSearch } = useFilteredAssets(props.buyAssets)
+  const allAssets = useAllAssets()
+  const stableAssets = useMemo(() => allAssets.filter((asset) => asset.isStable), [allAssets])
+  const handleClose = useCallback(() => props.onChangeState('closed'), [props])
+  const handleToggle = useCallback(() => props.onChangeState(props.state), [props])
+  const [selectedStables, setSelectedStables] = useState<Asset[]>([stableAssets[0]])
+
+  const buyAssets = useMemo(
+    () =>
+      props.type === 'pair'
+        ? assets
+        : assets.filter((asset) => asset.denom !== props.sellAsset.denom),
+    [assets, props.sellAsset, props.type],
+  )
+
+  const sellAssets = useMemo(
+    () => assets.filter((asset) => asset.denom !== props.buyAsset.denom),
+    [assets, props.buyAsset],
+  )
+
+  const onChangeBuyAsset = useCallback(
+    (asset: AssetPair | Asset) => {
+      const selectedAsset = asset as Asset
+      if (!props.onChangeBuyAsset) return
+      props.onChangeBuyAsset(selectedAsset)
+      props.onChangeState('sell')
+      onChangeSearch('')
+    },
+    [onChangeSearch, props],
+  )
+
+  const onChangeSellAsset = useCallback(
+    (asset: AssetPair | Asset) => {
+      const selectedAsset = asset as Asset
+      if (!props.onChangeSellAsset) return
+      props.onChangeSellAsset(selectedAsset)
+      onChangeSearch('')
+    },
+    [onChangeSearch, props],
+  )
+
+  const onChangeAssetPair = useCallback(
+    (assetPair: AssetPair | Asset) => {
+      const selectedPair = assetPair as AssetPair
+      if (!props.onChangeTradingPair) return
+      props.onChangeTradingPair({ buy: selectedPair.buy.denom, sell: selectedPair.sell.denom })
+      props.onChangeState('closed')
+      onChangeSearch('')
+    },
+    [onChangeSearch, props],
+  )
+
+  return (
+    <Overlay
+      className='inset-0 w-full overflow-y-scroll scrollbar-hide'
+      show={props.state !== 'closed'}
+      setShow={handleClose}
+    >
+      <div className='flex justify-between p-4 overflow-hidden'>
+        <Text>{props.type !== 'single' ? 'Select a market' : 'Select asset'}</Text>
+        <EscButton onClick={handleClose} enableKeyPress />
+      </div>
+      {props.type === 'pair' && (
+        <StablesFilter
+          stables={stableAssets}
+          selectedStables={selectedStables}
+          onFilter={setSelectedStables}
+        />
+      )}
+      <Divider />
+      <div className='p-4'>
+        <SearchBar
+          key={props.state}
+          value={searchString}
+          onChange={onChangeSearch}
+          placeholder='Search for e.g. "ETH" or "Ethereum"'
+          autoFocus
+        />
+      </div>
+      <Divider />
+      {props.type === 'perps' && (
+        <AssetList
+          assets={props.buyAssets}
+          type='perps'
+          onChangeAsset={onChangeBuyAsset}
+          isOpen
+          toggleOpen={() => {}}
+        />
+      )}
+
+      {props.type === 'pair' && (
+        <PairsList
+          assets={buyAssets}
+          stables={selectedStables}
+          isOpen={props.state === 'pair'}
+          toggleOpen={handleToggle}
+          onChangeAssetPair={onChangeAssetPair}
+        />
+      )}
+
+      {props.type === 'single' && (
+        <>
+          <AssetList
+            type='buy'
+            assets={buyAssets}
+            isOpen={props.state === 'buy'}
+            toggleOpen={handleToggle}
+            onChangeAsset={onChangeBuyAsset}
+          />
+          <AssetList
+            type='sell'
+            assets={sellAssets}
+            isOpen={props.state === 'sell'}
+            toggleOpen={handleToggle}
+            onChangeAsset={onChangeSellAsset}
+          />
+        </>
+      )}
+    </Overlay>
+  )
+}
diff --git a/src/components/Trade/TradeModule/AssetSelector/AssetSelectorItem.tsx b/src/components/trade/TradeModule/AssetSelector/AssetSelectorItem.tsx
similarity index 88%
rename from src/components/Trade/TradeModule/AssetSelector/AssetSelectorItem.tsx
rename to src/components/trade/TradeModule/AssetSelector/AssetSelectorItem.tsx
index 32f49129..9c11bfa9 100644
--- a/src/components/Trade/TradeModule/AssetSelector/AssetSelectorItem.tsx
+++ b/src/components/trade/TradeModule/AssetSelector/AssetSelectorItem.tsx
@@ -1,14 +1,13 @@
 import { useMemo } from 'react'
 
-import AssetImage from 'components/Asset/AssetImage'
-import AssetSymbol from 'components/Asset/AssetSymbol'
-import DisplayCurrency from 'components/DisplayCurrency'
-import { FormattedNumber } from 'components/FormattedNumber'
-import { StarFilled, StarOutlined } from 'components/Icons'
-import Text from 'components/Text'
-import { LocalStorageKeys } from 'constants/localStorageKeys'
+import AssetImage from 'components/common/assets/AssetImage'
+import AssetSymbol from 'components/common/assets/AssetSymbol'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import { StarFilled, StarOutlined } from 'components/common/Icons'
+import Text from 'components/common/Text'
 import { BN_ONE, BN_ZERO, MAX_AMOUNT_DECIMALS, MIN_AMOUNT } from 'constants/math'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useFavoriteAssets from 'hooks/localStorage/useFavoriteAssets'
 import { BNCoin } from 'types/classes/BNCoin'
 import { byDenom } from 'utils/array'
 import { demagnify, formatAmountToPrecision } from 'utils/formatters'
@@ -26,10 +25,7 @@ export default function AssetSelectorItem(props: Props) {
 
   const amount = demagnify(props.balances.find(byDenom(asset.denom))?.amount ?? BN_ZERO, asset)
 
-  const [favoriteAssetsDenoms, setFavoriteAssetsDenoms] = useLocalStorage<string[]>(
-    LocalStorageKeys.FAVORITE_ASSETS,
-    [],
-  )
+  const [favoriteAssetsDenoms, setFavoriteAssetsDenoms] = useFavoriteAssets()
 
   function handleToggleFavorite(event: React.MouseEvent<HTMLDivElement, MouseEvent>) {
     event.stopPropagation()
diff --git a/src/components/Trade/TradeModule/AssetSelector/AssetSelectorPair.tsx b/src/components/trade/TradeModule/AssetSelector/AssetSelectorPair.tsx
similarity index 72%
rename from src/components/Trade/TradeModule/AssetSelector/AssetSelectorPair.tsx
rename to src/components/trade/TradeModule/AssetSelector/AssetSelectorPair.tsx
index 912b6d47..d6176157 100644
--- a/src/components/Trade/TradeModule/AssetSelector/AssetSelectorPair.tsx
+++ b/src/components/trade/TradeModule/AssetSelector/AssetSelectorPair.tsx
@@ -1,27 +1,29 @@
 import { useCallback } from 'react'
 
-import Button from 'components/Button'
-import { ChevronDown } from 'components/Icons'
-import Text from 'components/Text'
-import AssetOverlay from 'components/Trade/TradeModule/AssetSelector/AssetOverlay'
+import Button from 'components/common/Button'
+import { ChevronDown } from 'components/common/Icons'
+import Text from 'components/common/Text'
+import AssetOverlay from 'components/trade/TradeModule/AssetSelector/AssetOverlay'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
+import useChainConfig from 'hooks/useChainConfig'
 import useStore from 'store'
 
 interface Props {
   buyAsset: Asset
   sellAsset: Asset
+  assets: Asset[]
 }
 
 export default function AssetSelectorPair(props: Props) {
-  const [tradingPairSimple, setTradingPairSimple] = useLocalStorage<Settings['tradingPairSimple']>(
-    LocalStorageKeys.TRADING_PAIR_SIMPLE,
+  const chainConfig = useChainConfig()
+  const [_, setTradingPairSimple] = useLocalStorage<Settings['tradingPairSimple']>(
+    chainConfig.id + '/' + LocalStorageKeys.TRADING_PAIR_SIMPLE,
     DEFAULT_SETTINGS.tradingPairSimple,
   )
   const { buyAsset, sellAsset } = props
   const assetOverlayState = useStore((s) => s.assetOverlayState)
-
   const onChangeTradingPair = useCallback(
     (tradingPair: TradingPair) => {
       setTradingPairSimple(tradingPair)
@@ -55,6 +57,8 @@ export default function AssetSelectorPair(props: Props) {
         buyAsset={buyAsset}
         sellAsset={sellAsset}
         onChangeTradingPair={onChangeTradingPair}
+        buyAssets={props.assets}
+        type='pair'
       />
     </>
   )
diff --git a/src/components/trade/TradeModule/AssetSelector/AssetSelectorPerps.tsx b/src/components/trade/TradeModule/AssetSelector/AssetSelectorPerps.tsx
new file mode 100644
index 00000000..02b59e86
--- /dev/null
+++ b/src/components/trade/TradeModule/AssetSelector/AssetSelectorPerps.tsx
@@ -0,0 +1,59 @@
+import { useCallback } from 'react'
+
+import Button from 'components/common/Button'
+import { ChevronDown } from 'components/common/Icons'
+import Text from 'components/common/Text'
+import AssetOverlay from 'components/trade/TradeModule/AssetSelector/AssetOverlay'
+import usePerpsEnabledAssets from 'hooks/assets/usePerpsEnabledAssets'
+import usePerpsAsset from 'hooks/perps/usePerpsAsset'
+import useStore from 'store'
+
+interface Props {
+  asset: Asset
+}
+
+export default function AssetSelectorPerps(props: Props) {
+  const assetOverlayState = useStore((s) => s.assetOverlayState)
+  const { perpsAsset, updatePerpsAsset } = usePerpsAsset()
+
+  const perpAssets = usePerpsEnabledAssets()
+
+  const onChangePerpsAsset = useCallback(
+    (asset: Asset) => {
+      updatePerpsAsset(asset.denom)
+    },
+    [updatePerpsAsset],
+  )
+
+  const handleChangeState = useCallback(() => {
+    useStore.setState({ assetOverlayState: 'closed' })
+  }, [])
+
+  return (
+    <>
+      <Button
+        color='quaternary'
+        variant='transparent'
+        onClick={() => useStore.setState({ assetOverlayState: 'pair' })}
+        className='flex items-center justify-between w-full py-5 bg-white/5'
+      >
+        <Text size='sm' className='text-white/60'>
+          <span className='text-white'>{perpsAsset.symbol}</span>/USD
+        </Text>
+        <div className='flex items-center gap-2'>
+          <Text>All markets</Text>
+          <ChevronDown className='w-3 h-3' />
+        </div>
+      </Button>
+      <AssetOverlay
+        buyAssets={perpAssets}
+        state={assetOverlayState}
+        onChangeState={handleChangeState}
+        buyAsset={props.asset}
+        sellAsset={props.asset}
+        onChangeBuyAsset={onChangePerpsAsset}
+        type='perps'
+      />
+    </>
+  )
+}
diff --git a/src/components/Trade/TradeModule/AssetSelector/AssetSelectorSingle.tsx b/src/components/trade/TradeModule/AssetSelector/AssetSelectorSingle.tsx
similarity index 62%
rename from src/components/Trade/TradeModule/AssetSelector/AssetSelectorSingle.tsx
rename to src/components/trade/TradeModule/AssetSelector/AssetSelectorSingle.tsx
index 89b3aa1a..7cf7edfa 100644
--- a/src/components/Trade/TradeModule/AssetSelector/AssetSelectorSingle.tsx
+++ b/src/components/trade/TradeModule/AssetSelector/AssetSelectorSingle.tsx
@@ -1,12 +1,14 @@
 import { useCallback } from 'react'
 
-import { SwapIcon } from 'components/Icons'
-import Text from 'components/Text'
-import AssetButton from 'components/Trade/TradeModule/AssetSelector/AssetButton'
-import AssetOverlay from 'components/Trade/TradeModule/AssetSelector/AssetOverlay'
+import { SwapIcon } from 'components/common/Icons'
+import Text from 'components/common/Text'
+import AssetButton from 'components/trade/TradeModule/AssetSelector/AssetButton'
+import AssetOverlay from 'components/trade/TradeModule/AssetSelector/AssetOverlay'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useMarketEnabledAssets from 'hooks/assets/useMarketEnabledAssets'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
+import useChainConfig from 'hooks/useChainConfig'
 import useStore from 'store'
 
 interface Props {
@@ -15,30 +17,33 @@ interface Props {
 }
 
 export default function AssetSelectorSingle(props: Props) {
-  const [tradingPairAdvanced, settradingPairAdvanced] = useLocalStorage<
-    Settings['tradingPairAdvanced']
-  >(LocalStorageKeys.TRADING_PAIR_ADVANCED, DEFAULT_SETTINGS.tradingPairAdvanced)
+  const chainConfig = useChainConfig()
+  const [_, setTradingPairAdvanced] = useLocalStorage<Settings['tradingPairAdvanced']>(
+    chainConfig.id + '/' + LocalStorageKeys.TRADING_PAIR_ADVANCED,
+    DEFAULT_SETTINGS.tradingPairAdvanced,
+  )
   const { buyAsset, sellAsset } = props
   const assetOverlayState = useStore((s) => s.assetOverlayState)
+  const allAssets = useMarketEnabledAssets()
 
   const handleSwapAssets = useCallback(() => {
-    settradingPairAdvanced({ buy: sellAsset.denom, sell: buyAsset.denom })
-  }, [settradingPairAdvanced, sellAsset, buyAsset])
+    setTradingPairAdvanced({ buy: sellAsset.denom, sell: buyAsset.denom })
+  }, [setTradingPairAdvanced, sellAsset, buyAsset])
 
   const handleChangeBuyAsset = useCallback(
     (asset: Asset) => {
-      settradingPairAdvanced({ buy: asset.denom, sell: sellAsset.denom })
+      setTradingPairAdvanced({ buy: asset.denom, sell: sellAsset.denom })
       useStore.setState({ assetOverlayState: 'sell' })
     },
-    [settradingPairAdvanced, sellAsset],
+    [setTradingPairAdvanced, sellAsset],
   )
 
   const handleChangeSellAsset = useCallback(
     (asset: Asset) => {
-      settradingPairAdvanced({ buy: buyAsset.denom, sell: asset.denom })
+      setTradingPairAdvanced({ buy: buyAsset.denom, sell: asset.denom })
       useStore.setState({ assetOverlayState: 'closed' })
     },
-    [settradingPairAdvanced, buyAsset],
+    [setTradingPairAdvanced, buyAsset],
   )
 
   const handleChangeState = useCallback((state: OverlayState) => {
@@ -69,6 +74,8 @@ export default function AssetSelectorSingle(props: Props) {
         sellAsset={sellAsset}
         onChangeBuyAsset={handleChangeBuyAsset}
         onChangeSellAsset={handleChangeSellAsset}
+        buyAssets={allAssets}
+        type='single'
       />
     </div>
   )
diff --git a/src/components/Trade/TradeModule/AssetSelector/PairsList.tsx b/src/components/trade/TradeModule/AssetSelector/PairsList.tsx
similarity index 71%
rename from src/components/Trade/TradeModule/AssetSelector/PairsList.tsx
rename to src/components/trade/TradeModule/AssetSelector/PairsList.tsx
index 301fb243..ea738b40 100644
--- a/src/components/Trade/TradeModule/AssetSelector/PairsList.tsx
+++ b/src/components/trade/TradeModule/AssetSelector/PairsList.tsx
@@ -1,15 +1,16 @@
 import { useMemo } from 'react'
 
-import Text from 'components/Text'
-import AssetSelectorItem from 'components/Trade/TradeModule/AssetSelector/AssetSelectorItem'
-import { ASSETS } from 'constants/assets'
-import useCurrentAccount from 'hooks/useCurrentAccount'
-import useMarketAssets from 'hooks/useMarketAssets'
-import useMarketDeposits from 'hooks/useMarketDeposits'
+import Text from 'components/common/Text'
+import AssetSelectorItem from 'components/trade/TradeModule/AssetSelector/AssetSelectorItem'
+import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
+import useBaseAsset from 'hooks/assets/useBasetAsset'
+import useMarketEnabledAssets from 'hooks/assets/useMarketEnabledAssets'
+import useMarketAssets from 'hooks/markets/useMarketAssets'
+import useMarketDeposits from 'hooks/markets/useMarketDeposits'
 import usePrices from 'hooks/usePrices'
 import { getMergedBalancesForAsset } from 'utils/accounts'
 import { byDenom } from 'utils/array'
-import { getEnabledMarketAssets, sortAssetsOrPairs } from 'utils/assets'
+import { sortAssetsOrPairs } from 'utils/assets'
 
 interface Props {
   assets: Asset[]
@@ -19,17 +20,17 @@ interface Props {
   onChangeAssetPair: (assetPair: AssetPair | Asset) => void
 }
 
-const baseDenom = ASSETS[0].denom
-
 export default function PairsList(props: Props) {
   const account = useCurrentAccount()
   const { data: marketAssets } = useMarketAssets()
   const { data: marketDeposits } = useMarketDeposits()
   const { data: prices } = usePrices()
+  const baseDenom = useBaseAsset().denom
+  const marketEnabledAssets = useMarketEnabledAssets()
   const balances = useMemo(() => {
     if (!account) return []
-    return getMergedBalancesForAsset(account, getEnabledMarketAssets())
-  }, [account])
+    return getMergedBalancesForAsset(account, marketEnabledAssets)
+  }, [account, marketEnabledAssets])
 
   const pairs = useMemo(() => {
     const tradingPairs: AssetPair[] = []
@@ -44,7 +45,7 @@ export default function PairsList(props: Props) {
 
   const sortedPairs = useMemo(
     () => sortAssetsOrPairs(pairs, prices, marketDeposits, balances, baseDenom) as AssetPair[],
-    [balances, prices, pairs, marketDeposits],
+    [pairs, prices, marketDeposits, balances, baseDenom],
   )
 
   return (
diff --git a/src/components/Trade/TradeModule/SwapForm/AssetAmountInput.tsx b/src/components/trade/TradeModule/SwapForm/AssetAmountInput.tsx
similarity index 94%
rename from src/components/Trade/TradeModule/SwapForm/AssetAmountInput.tsx
rename to src/components/trade/TradeModule/SwapForm/AssetAmountInput.tsx
index 87a082c9..8bb496c3 100644
--- a/src/components/Trade/TradeModule/SwapForm/AssetAmountInput.tsx
+++ b/src/components/trade/TradeModule/SwapForm/AssetAmountInput.tsx
@@ -1,7 +1,7 @@
 import { useCallback, useMemo } from 'react'
 
-import DisplayCurrency from 'components/DisplayCurrency'
-import NumberInput from 'components/NumberInput'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import NumberInput from 'components/common/NumberInput'
 import { BNCoin } from 'types/classes/BNCoin'
 
 interface Props {
diff --git a/src/components/Trade/TradeModule/SwapForm/AutoRepayToggle.tsx b/src/components/trade/TradeModule/SwapForm/AutoRepayToggle.tsx
similarity index 83%
rename from src/components/Trade/TradeModule/SwapForm/AutoRepayToggle.tsx
rename to src/components/trade/TradeModule/SwapForm/AutoRepayToggle.tsx
index 399ab758..9d4f7741 100644
--- a/src/components/Trade/TradeModule/SwapForm/AutoRepayToggle.tsx
+++ b/src/components/trade/TradeModule/SwapForm/AutoRepayToggle.tsx
@@ -1,6 +1,6 @@
-import Switch from 'components/Switch'
-import Text from 'components/Text'
-import { Tooltip } from 'components/Tooltip'
+import Switch from 'components/common/Switch'
+import Text from 'components/common/Text'
+import { Tooltip } from 'components/common/Tooltip'
 
 interface Props {
   checked: boolean
diff --git a/src/components/Trade/TradeModule/SwapForm/MarginToggle.tsx b/src/components/trade/TradeModule/SwapForm/MarginToggle.tsx
similarity index 87%
rename from src/components/Trade/TradeModule/SwapForm/MarginToggle.tsx
rename to src/components/trade/TradeModule/SwapForm/MarginToggle.tsx
index 4580ea3b..7f6349fd 100644
--- a/src/components/Trade/TradeModule/SwapForm/MarginToggle.tsx
+++ b/src/components/trade/TradeModule/SwapForm/MarginToggle.tsx
@@ -1,6 +1,6 @@
-import Switch from 'components/Switch'
-import Text from 'components/Text'
-import { Tooltip } from 'components/Tooltip'
+import Switch from 'components/common/Switch'
+import Text from 'components/common/Text'
+import { Tooltip } from 'components/common/Tooltip'
 import ConditionalWrapper from 'hocs/ConditionalWrapper'
 
 interface Props {
diff --git a/src/components/Trade/TradeModule/SwapForm/OrderTypeSelector/constants.ts b/src/components/trade/TradeModule/SwapForm/OrderTypeSelector/constants.ts
similarity index 87%
rename from src/components/Trade/TradeModule/SwapForm/OrderTypeSelector/constants.ts
rename to src/components/trade/TradeModule/SwapForm/OrderTypeSelector/constants.ts
index c7f93f3f..d4d64d12 100644
--- a/src/components/Trade/TradeModule/SwapForm/OrderTypeSelector/constants.ts
+++ b/src/components/trade/TradeModule/SwapForm/OrderTypeSelector/constants.ts
@@ -1,4 +1,4 @@
-import { OrderTab } from 'components/Trade/TradeModule/SwapForm/OrderTypeSelector/types'
+import { OrderTab } from 'components/trade/TradeModule/SwapForm/OrderTypeSelector/types'
 
 const ORDER_TYPE_UNAVAILABLE_MESSAGE =
   'This type of order is currently unavailable and is coming soon.'
diff --git a/src/components/Trade/TradeModule/SwapForm/OrderTypeSelector/index.tsx b/src/components/trade/TradeModule/SwapForm/OrderTypeSelector/index.tsx
similarity index 83%
rename from src/components/Trade/TradeModule/SwapForm/OrderTypeSelector/index.tsx
rename to src/components/trade/TradeModule/SwapForm/OrderTypeSelector/index.tsx
index c5527818..31ce6239 100644
--- a/src/components/Trade/TradeModule/SwapForm/OrderTypeSelector/index.tsx
+++ b/src/components/trade/TradeModule/SwapForm/OrderTypeSelector/index.tsx
@@ -1,10 +1,10 @@
 import classNames from 'classnames'
 
-import { InfoCircle } from 'components/Icons'
-import Text from 'components/Text'
-import { Tooltip } from 'components/Tooltip'
-import { ORDER_TYPE_TABS } from 'components/Trade/TradeModule/SwapForm/OrderTypeSelector/constants'
-import { AvailableOrderType } from 'components/Trade/TradeModule/SwapForm/OrderTypeSelector/types'
+import { InfoCircle } from 'components/common/Icons'
+import Text from 'components/common/Text'
+import { Tooltip } from 'components/common/Tooltip'
+import { ORDER_TYPE_TABS } from 'components/trade/TradeModule/SwapForm/OrderTypeSelector/constants'
+import { AvailableOrderType } from 'components/trade/TradeModule/SwapForm/OrderTypeSelector/types'
 import ConditionalWrapper from 'hocs/ConditionalWrapper'
 
 interface Props {
diff --git a/src/components/Trade/TradeModule/SwapForm/OrderTypeSelector/types.ts b/src/components/trade/TradeModule/SwapForm/OrderTypeSelector/types.ts
similarity index 100%
rename from src/components/Trade/TradeModule/SwapForm/OrderTypeSelector/types.ts
rename to src/components/trade/TradeModule/SwapForm/OrderTypeSelector/types.ts
diff --git a/src/components/Trade/TradeModule/SwapForm/TradeSummary.tsx b/src/components/trade/TradeModule/SwapForm/TradeSummary.tsx
similarity index 82%
rename from src/components/Trade/TradeModule/SwapForm/TradeSummary.tsx
rename to src/components/trade/TradeModule/SwapForm/TradeSummary.tsx
index 43cbd80a..247cf1dc 100644
--- a/src/components/Trade/TradeModule/SwapForm/TradeSummary.tsx
+++ b/src/components/trade/TradeModule/SwapForm/TradeSummary.tsx
@@ -1,22 +1,24 @@
 import classNames from 'classnames'
 import React, { useMemo } from 'react'
 
-import ActionButton from 'components/Button/ActionButton'
-import { CircularProgress } from 'components/CircularProgress'
-import DisplayCurrency from 'components/DisplayCurrency'
-import Divider from 'components/Divider'
-import { FormattedNumber } from 'components/FormattedNumber'
-import { ChevronDown } from 'components/Icons'
-import Text from 'components/Text'
+import ActionButton from 'components/common/Button/ActionButton'
+import { CircularProgress } from 'components/common/CircularProgress'
+import DisplayCurrency from 'components/common/DisplayCurrency'
+import Divider from 'components/common/Divider'
+import { FormattedNumber } from 'components/common/FormattedNumber'
+import { ChevronDown } from 'components/common/Icons'
+import SummaryLine from 'components/common/SummaryLine'
+import Text from 'components/common/Text'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import useLiquidationPrice from 'hooks/useLiquidationPrice'
-import useLocalStorage from 'hooks/useLocalStorage'
 import usePrice from 'hooks/usePrice'
 import useSwapFee from 'hooks/useSwapFee'
 import useToggle from 'hooks/useToggle'
 import { BNCoin } from 'types/classes/BNCoin'
-import { getAssetByDenom } from 'utils/assets'
+import { byDenom } from 'utils/array'
 import { formatAmountWithSymbol, formatPercent } from 'utils/formatters'
 
 interface Props {
@@ -35,11 +37,9 @@ interface Props {
   sellAsset: Asset
   showProgressIndicator: boolean
   isAdvanced?: boolean
-  direction?: OrderDirection
+  direction?: TradeDirection
 }
 
-const infoLineClasses = 'flex flex-row justify-between flex-1 mb-1 text-xs text-white'
-
 export default function TradeSummary(props: Props) {
   const {
     buyAsset,
@@ -59,9 +59,10 @@ export default function TradeSummary(props: Props) {
     direction,
   } = props
   const [slippage] = useLocalStorage<number>(LocalStorageKeys.SLIPPAGE, DEFAULT_SETTINGS.slippage)
-
+  const assets = useAllAssets()
   const sellAssetPrice = usePrice(sellAsset.denom)
-  const swapFee = useSwapFee(route.map((r) => r.pool_id))
+  // FIXME: ⛓️ Swap fee needs to be chainagnostic!
+  const swapFee = useSwapFee(route.map((route) => route.pool_id))
   const [showSummary, setShowSummary] = useToggle()
   const { liquidationPrice, isUpdatingLiquidationPrice } = useLiquidationPrice(
     props.liquidationPrice,
@@ -78,14 +79,14 @@ export default function TradeSummary(props: Props) {
   const parsedRoutes = useMemo(() => {
     if (!route.length) return '-'
 
-    const routeSymbols = route.map((r) => getAssetByDenom(r.token_out_denom)?.symbol)
+    const routeSymbols = route.map((r) => assets.find(byDenom(r.token_out_denom))?.symbol)
     routeSymbols.unshift(sellAsset.symbol)
 
     return routeSymbols.join(' -> ')
-  }, [route, sellAsset.symbol])
+  }, [assets, route, sellAsset.symbol])
 
   const buttonText = useMemo(() => {
-    if (!isAdvanced && direction === 'sell') return `Sell ${sellAsset.symbol}`
+    if (!isAdvanced && direction === 'short') return `Sell ${sellAsset.symbol}`
     return route.length ? `Buy ${buyAsset.symbol}` : 'No route found'
   }, [buyAsset.symbol, route, sellAsset.symbol, isAdvanced, direction])
 
@@ -158,7 +159,7 @@ export default function TradeSummary(props: Props) {
               <DisplayCurrency coin={BNCoin.fromDenomAndBigNumber(sellAsset.denom, swapFeeValue)} />
             </SummaryLine>
             <SummaryLine label='Transaction fees'>
-              <span>{formatAmountWithSymbol(estimatedFee.amount[0])}</span>
+              <span>{formatAmountWithSymbol(estimatedFee.amount[0], assets)}</span>
             </SummaryLine>
             <SummaryLine label={`Min receive (${slippage * 100}% slippage)`}>
               <FormattedNumber
@@ -187,17 +188,3 @@ export default function TradeSummary(props: Props) {
     </div>
   )
 }
-
-interface SummaryLineProps {
-  children: React.ReactNode
-  label: string
-  className?: string
-}
-function SummaryLine(props: SummaryLineProps) {
-  return (
-    <div className={classNames(infoLineClasses, props.className)}>
-      <span className='opacity-40'>{props.label}</span>
-      <span>{props.children}</span>
-    </div>
-  )
-}
diff --git a/src/components/Trade/TradeModule/SwapForm/index.tsx b/src/components/trade/TradeModule/SwapForm/index.tsx
similarity index 86%
rename from src/components/Trade/TradeModule/SwapForm/index.tsx
rename to src/components/trade/TradeModule/SwapForm/index.tsx
index 0a2e223f..5e97ac61 100644
--- a/src/components/Trade/TradeModule/SwapForm/index.tsx
+++ b/src/components/trade/TradeModule/SwapForm/index.tsx
@@ -2,29 +2,31 @@ import debounce from 'lodash.debounce'
 import { useCallback, useEffect, useMemo, useState } from 'react'
 
 import estimateExactIn from 'api/swap/estimateExactIn'
-import AvailableLiquidityMessage from 'components/AvailableLiquidityMessage'
-import DepositCapMessage from 'components/DepositCapMessage'
-import { DirectionSelect } from 'components/DirectionSelect'
-import Divider from 'components/Divider'
-import RangeInput from 'components/RangeInput'
-import Text from 'components/Text'
-import AssetSelectorPair from 'components/Trade/TradeModule/AssetSelector/AssetSelectorPair'
-import AssetSelectorSingle from 'components/Trade/TradeModule/AssetSelector/AssetSelectorSingle'
-import AssetAmountInput from 'components/Trade/TradeModule/SwapForm/AssetAmountInput'
-import AutoRepayToggle from 'components/Trade/TradeModule/SwapForm/AutoRepayToggle'
-import MarginToggle from 'components/Trade/TradeModule/SwapForm/MarginToggle'
-import OrderTypeSelector from 'components/Trade/TradeModule/SwapForm/OrderTypeSelector'
-import { AvailableOrderType } from 'components/Trade/TradeModule/SwapForm/OrderTypeSelector/types'
-import TradeSummary from 'components/Trade/TradeModule/SwapForm/TradeSummary'
+import AvailableLiquidityMessage from 'components/common/AvailableLiquidityMessage'
+import DepositCapMessage from 'components/common/DepositCapMessage'
+import Divider from 'components/common/Divider'
+import LeverageSlider from 'components/common/LeverageSlider'
+import Text from 'components/common/Text'
+import { TradeDirectionSelector } from 'components/common/TradeDirectionSelector'
+import AssetSelectorPair from 'components/trade/TradeModule/AssetSelector/AssetSelectorPair'
+import AssetSelectorSingle from 'components/trade/TradeModule/AssetSelector/AssetSelectorSingle'
+import AssetAmountInput from 'components/trade/TradeModule/SwapForm/AssetAmountInput'
+import AutoRepayToggle from 'components/trade/TradeModule/SwapForm/AutoRepayToggle'
+import MarginToggle from 'components/trade/TradeModule/SwapForm/MarginToggle'
+import OrderTypeSelector from 'components/trade/TradeModule/SwapForm/OrderTypeSelector'
+import { AvailableOrderType } from 'components/trade/TradeModule/SwapForm/OrderTypeSelector/types'
+import TradeSummary from 'components/trade/TradeModule/SwapForm/TradeSummary'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
 import { BN_ZERO } from 'constants/math'
+import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
+import useMarketEnabledAssets from 'hooks/assets/useMarketEnabledAssets'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
+import useMarketAssets from 'hooks/markets/useMarketAssets'
+import useMarketBorrowings from 'hooks/markets/useMarketBorrowings'
 import useAutoLend from 'hooks/useAutoLend'
-import useCurrentAccount from 'hooks/useCurrentAccount'
+import useChainConfig from 'hooks/useChainConfig'
 import useHealthComputer from 'hooks/useHealthComputer'
-import useLocalStorage from 'hooks/useLocalStorage'
-import useMarketAssets from 'hooks/useMarketAssets'
-import useMarketBorrowings from 'hooks/useMarketBorrowings'
 import useSwapRoute from 'hooks/useSwapRoute'
 import useToggle from 'hooks/useToggle'
 import { useUpdatedAccount } from 'hooks/useUpdatedAccount'
@@ -50,14 +52,15 @@ export default function SwapForm(props: Props) {
   const swap = useStore((s) => s.swap)
   const [slippage] = useLocalStorage(LocalStorageKeys.SLIPPAGE, DEFAULT_SETTINGS.slippage)
   const { computeMaxSwapAmount } = useHealthComputer(account)
-  const [orderDirection, setOrderDirection] = useState<OrderDirection>('buy')
+  const [tradeDirection, setTradeDirection] = useState<TradeDirection>('long')
   const { data: borrowAssets } = useMarketBorrowings()
   const { data: marketAssets } = useMarketAssets()
+
   const [inputAsset, outputAsset] = useMemo(() => {
     if (isAdvanced) return [sellAsset, buyAsset]
-    if (orderDirection === 'buy') return [sellAsset, buyAsset]
+    if (tradeDirection === 'long') return [sellAsset, buyAsset]
     return [buyAsset, sellAsset]
-  }, [buyAsset, sellAsset, orderDirection, isAdvanced])
+  }, [buyAsset, sellAsset, tradeDirection, isAdvanced])
   const { data: route, isLoading: isRouteLoading } = useSwapRoute(
     inputAsset.denom,
     outputAsset.denom,
@@ -80,6 +83,8 @@ export default function SwapForm(props: Props) {
   const { simulateTrade, removedLends, updatedAccount } = useUpdatedAccount(account)
   const throttledEstimateExactIn = useMemo(() => asyncThrottle(estimateExactIn, 250), [])
   const { computeLiquidationPrice } = useHealthComputer(updatedAccount)
+  const chainConfig = useChainConfig()
+  const assets = useMarketEnabledAssets()
 
   const depositCapReachedCoins: BNCoin[] = useMemo(() => {
     const outputMarketAsset = marketAssets.find(byDenom(outputAsset.denom))
@@ -98,9 +103,9 @@ export default function SwapForm(props: Props) {
     (amount: BigNumber) => {
       setInputAssetAmount(amount)
       const swapTo = { denom: inputAsset.denom, amount: amount.toString() }
-      throttledEstimateExactIn(swapTo, outputAsset.denom).then(setOutputAssetAmount)
+      throttledEstimateExactIn(chainConfig, swapTo, outputAsset.denom).then(setOutputAssetAmount)
     },
-    [inputAsset.denom, throttledEstimateExactIn, outputAsset.denom],
+    [inputAsset.denom, throttledEstimateExactIn, chainConfig, outputAsset.denom],
   )
 
   const onChangeOutputAmount = useCallback(
@@ -110,9 +115,9 @@ export default function SwapForm(props: Props) {
         denom: outputAsset.denom,
         amount: amount.toString(),
       }
-      throttledEstimateExactIn(swapFrom, inputAsset.denom).then(setInputAssetAmount)
+      throttledEstimateExactIn(chainConfig, swapFrom, inputAsset.denom).then(setInputAssetAmount)
     },
-    [outputAsset.denom, throttledEstimateExactIn, inputAsset.denom],
+    [outputAsset.denom, throttledEstimateExactIn, chainConfig, inputAsset.denom],
   )
 
   const handleRangeInputChange = useCallback(
@@ -132,6 +137,7 @@ export default function SwapForm(props: Props) {
     const marginRatio = maxAmount.dividedBy(maxAmountOnMargin)
 
     estimateExactIn(
+      chainConfig,
       {
         denom: inputAsset.denom,
         amount: (isMarginChecked ? maxAmountOnMargin : maxAmount).toString(),
@@ -148,9 +154,10 @@ export default function SwapForm(props: Props) {
     computeMaxSwapAmount,
     inputAsset.denom,
     outputAsset.denom,
+    chainConfig,
     isMarginChecked,
-    onChangeInputAmount,
     inputAssetAmount,
+    onChangeInputAmount,
   ])
 
   const outputSideMarginThreshold = useMemo(() => {
@@ -240,7 +247,7 @@ export default function SwapForm(props: Props) {
   useEffect(() => {
     onChangeOutputAmount(BN_ZERO)
     onChangeInputAmount(BN_ZERO)
-  }, [orderDirection, onChangeOutputAmount, onChangeInputAmount])
+  }, [tradeDirection, onChangeOutputAmount, onChangeInputAmount])
 
   useEffect(() => {
     setOutputAssetAmount(BN_ZERO)
@@ -336,7 +343,7 @@ export default function SwapForm(props: Props) {
         {isAdvanced ? (
           <AssetSelectorSingle buyAsset={outputAsset} sellAsset={inputAsset} />
         ) : (
-          <AssetSelectorPair buyAsset={buyAsset} sellAsset={sellAsset} />
+          <AssetSelectorPair buyAsset={buyAsset} sellAsset={sellAsset} assets={assets} />
         )}
         <Divider />
         <MarginToggle
@@ -369,9 +376,9 @@ export default function SwapForm(props: Props) {
             />
           ) : (
             <>
-              <DirectionSelect
-                direction={orderDirection}
-                onChangeDirection={setOrderDirection}
+              <TradeDirectionSelector
+                direction={tradeDirection}
+                onChangeDirection={setTradeDirection}
                 asset={buyAsset}
               />
               <AssetAmountInput
@@ -386,11 +393,12 @@ export default function SwapForm(props: Props) {
           )}
 
           {!isAdvanced && <Divider />}
-          <RangeInput
+          <LeverageSlider
             disabled={isConfirming || maxOutputAmountEstimation.isZero()}
             onChange={handleRangeInputChange}
             value={outputAssetAmount.shiftedBy(-outputAsset.decimals).toNumber()}
             max={maxOutputAmountEstimation.shiftedBy(-outputAsset.decimals).toNumber()}
+            type='margin'
             marginThreshold={
               isMarginChecked
                 ? outputSideMarginThreshold.shiftedBy(-outputAsset.decimals).toNumber()
@@ -454,7 +462,7 @@ export default function SwapForm(props: Props) {
           sellAmount={inputAssetAmount}
           buyAmount={outputAssetAmount}
           isAdvanced={isAdvanced}
-          direction={orderDirection}
+          direction={tradeDirection}
         />
       </div>
     </>
diff --git a/src/components/Trade/TradeModule/index.tsx b/src/components/trade/TradeModule/index.tsx
similarity index 92%
rename from src/components/Trade/TradeModule/index.tsx
rename to src/components/trade/TradeModule/index.tsx
index 5e8b916f..db6d1257 100644
--- a/src/components/Trade/TradeModule/index.tsx
+++ b/src/components/trade/TradeModule/index.tsx
@@ -1,6 +1,6 @@
 import classNames from 'classnames'
 
-import SwapForm from 'components/Trade/TradeModule/SwapForm'
+import SwapForm from 'components/trade/TradeModule/SwapForm'
 
 interface Props {
   buyAsset: Asset
diff --git a/src/configs/assets/AKT.ts b/src/configs/assets/AKT.ts
new file mode 100644
index 00000000..684cb66e
--- /dev/null
+++ b/src/configs/assets/AKT.ts
@@ -0,0 +1,18 @@
+const AKT: AssetMetaData = {
+  symbol: 'AKT',
+  id: 'AKT',
+  name: 'Akash',
+  color: '#F34C2D',
+  logo: '/images/tokens/akt.svg',
+  decimals: 6,
+  hasOraclePrice: true,
+  isEnabled: true,
+  isMarket: true,
+  isDisplayCurrency: true,
+  isAutoLendEnabled: true,
+  isBorrowEnabled: true,
+  pythPriceFeedId: '4ea5bb4d2f5900cc2e97ba534240950740b4d3b89fe712a94a7304fd2fd92702',
+  pythFeedName: 'AKTUSD',
+}
+
+export default AKT
diff --git a/src/configs/assets/ATOM.ts b/src/configs/assets/ATOM.ts
new file mode 100644
index 00000000..f97e177b
--- /dev/null
+++ b/src/configs/assets/ATOM.ts
@@ -0,0 +1,19 @@
+const ATOM: AssetMetaData = {
+  symbol: 'ATOM',
+  name: 'Atom',
+  id: 'ATOM',
+
+  color: '#6f7390',
+  logo: '/images/tokens/atom.svg',
+  decimals: 6,
+  hasOraclePrice: true,
+  isEnabled: true,
+  isMarket: true,
+  isDisplayCurrency: true,
+  isAutoLendEnabled: true,
+  isBorrowEnabled: true,
+  pythPriceFeedId: 'b00b60f88b03a6a625a8d1c048c3f66653edf217439983d037e7222c4e612819',
+  pythFeedName: 'ATOMUSD',
+}
+
+export default ATOM
diff --git a/src/configs/assets/AXL.ts b/src/configs/assets/AXL.ts
new file mode 100644
index 00000000..b268e478
--- /dev/null
+++ b/src/configs/assets/AXL.ts
@@ -0,0 +1,17 @@
+const AXL: AssetMetaData = {
+  symbol: 'AXL',
+  name: 'Axelar',
+  id: 'AXL',
+  color: '#FFF',
+  logo: '/images/tokens/axl.svg',
+  decimals: 6,
+  hasOraclePrice: true,
+  isEnabled: true,
+  isMarket: true,
+  isDisplayCurrency: true,
+  isAutoLendEnabled: false,
+  pythPriceFeedId: '60144b1d5c9e9851732ad1d9760e3485ef80be39b984f6bf60f82b28a2b7f126',
+  pythFeedName: 'AXLUSD',
+}
+
+export default AXL
diff --git a/src/configs/assets/DYDX.ts b/src/configs/assets/DYDX.ts
new file mode 100644
index 00000000..d9117144
--- /dev/null
+++ b/src/configs/assets/DYDX.ts
@@ -0,0 +1,18 @@
+const DYDX: AssetMetaData = {
+  symbol: 'DYDX',
+  id: 'DYDX',
+  name: 'dYdX',
+  color: '#6966ff',
+  logo: '/images/tokens/dydx.svg',
+  decimals: 18,
+  hasOraclePrice: true,
+  isEnabled: true,
+  isMarket: true,
+  isDisplayCurrency: true,
+  isAutoLendEnabled: true,
+  isBorrowEnabled: true,
+  pythPriceFeedId: '6489800bb8974169adfe35937bf6736507097d13c190d760c557108c7e93a81b',
+  pythFeedName: 'DYDXUSD',
+}
+
+export default DYDX
diff --git a/src/configs/assets/INJ.ts b/src/configs/assets/INJ.ts
new file mode 100644
index 00000000..bd831740
--- /dev/null
+++ b/src/configs/assets/INJ.ts
@@ -0,0 +1,18 @@
+const INJ: AssetMetaData = {
+  symbol: 'INJ',
+  id: 'INJ',
+  name: 'Injective',
+  color: '#00F2FE',
+  logo: '/images/tokens/inj.svg',
+  decimals: 18,
+  hasOraclePrice: true,
+  isEnabled: true,
+  isMarket: true,
+  isDisplayCurrency: true,
+  isAutoLendEnabled: true,
+  isBorrowEnabled: true,
+  pythPriceFeedId: '7a5bc1d2b56ad029048cd63964b3ad2776eadf812edc1a43a31406cb54bff592',
+  pythFeedName: 'INJUSD',
+}
+
+export default INJ
diff --git a/src/configs/assets/MARS.ts b/src/configs/assets/MARS.ts
new file mode 100644
index 00000000..c3c9a739
--- /dev/null
+++ b/src/configs/assets/MARS.ts
@@ -0,0 +1,14 @@
+const MARS: AssetMetaData = {
+  symbol: 'MARS',
+  name: 'Mars',
+  id: 'MARS',
+  color: '#a03b45',
+  logo: '/images/tokens/mars.svg',
+  decimals: 6,
+  hasOraclePrice: false,
+  isMarket: false,
+  isEnabled: true,
+  forceFetchPrice: true,
+}
+
+export default MARS
diff --git a/src/configs/assets/NTRN.ts b/src/configs/assets/NTRN.ts
new file mode 100644
index 00000000..ae61bbfd
--- /dev/null
+++ b/src/configs/assets/NTRN.ts
@@ -0,0 +1,17 @@
+const NTRN: AssetMetaData = {
+  symbol: 'NTRN',
+  name: 'Neutron',
+  id: 'NTRN',
+  color: '#FFFFFF',
+  logo: '/images/tokens/ntrn.svg',
+  decimals: 6,
+  pythPriceFeedId: 'a8e6517966a52cb1df864b2764f3629fde3f21d2b640b5c572fcd654cbccd65e',
+  hasOraclePrice: true,
+  isEnabled: true,
+  isMarket: true,
+  isBorrowEnabled: true,
+  isAutoLendEnabled: true,
+  pythFeedName: 'NTRNUSD',
+}
+
+export default NTRN
diff --git a/src/configs/assets/OSMO.ts b/src/configs/assets/OSMO.ts
new file mode 100644
index 00000000..9d100edd
--- /dev/null
+++ b/src/configs/assets/OSMO.ts
@@ -0,0 +1,18 @@
+const OSMO: AssetMetaData = {
+  symbol: 'OSMO',
+  name: 'Osmosis',
+  id: 'OSMO',
+  color: '#9f1ab9',
+  decimals: 6,
+  hasOraclePrice: true,
+  logo: '/images/tokens/osmo.svg',
+  isEnabled: true,
+  isMarket: true,
+  isBorrowEnabled: true,
+  isDisplayCurrency: true,
+  isAutoLendEnabled: true,
+  pythPriceFeedId: '5867f5683c757393a0670ef0f701490950fe93fdb006d181c8265a831ac0c5c6',
+  pythFeedName: 'OSMOUSD',
+}
+
+export default OSMO
diff --git a/src/configs/assets/TIA.ts b/src/configs/assets/TIA.ts
new file mode 100644
index 00000000..83e7e295
--- /dev/null
+++ b/src/configs/assets/TIA.ts
@@ -0,0 +1,18 @@
+const TIA: AssetMetaData = {
+  symbol: 'TIA',
+  id: 'TIA',
+  name: 'Celestia',
+  color: '#8623ff',
+  logo: '/images/tokens/tia.svg',
+  decimals: 6,
+  hasOraclePrice: true,
+  isEnabled: true,
+  isMarket: true,
+  isDisplayCurrency: true,
+  isAutoLendEnabled: true,
+  isBorrowEnabled: true,
+  pythPriceFeedId: '09f7c1d7dfbb7df2b8fe3d3d87ee94a2259d212da4f30c1f0540d066dfa44723',
+  pythFeedName: 'TIAUSD',
+}
+
+export default TIA
diff --git a/src/configs/assets/USDC.axl.ts b/src/configs/assets/USDC.axl.ts
new file mode 100644
index 00000000..a409cb58
--- /dev/null
+++ b/src/configs/assets/USDC.axl.ts
@@ -0,0 +1,19 @@
+const USDCaxl: AssetMetaData = {
+  symbol: 'USDC.axl',
+  name: 'Axelar USDC',
+  id: 'axlUSDC',
+  color: '#478edc',
+  logo: '/images/tokens/axlusdc.svg',
+  decimals: 6,
+  hasOraclePrice: true,
+  isEnabled: true,
+  isMarket: true,
+  isDisplayCurrency: true,
+  isStable: true,
+  isBorrowEnabled: true,
+  isAutoLendEnabled: true,
+  pythPriceFeedId: 'eaa020c61cc479712813461ce153894a96a6c00b21ed0cfc2798d1f9a9e9c94a',
+  pythFeedName: 'USDCUSD',
+}
+
+export default USDCaxl
diff --git a/src/configs/assets/USDC.ts b/src/configs/assets/USDC.ts
new file mode 100644
index 00000000..cebb236a
--- /dev/null
+++ b/src/configs/assets/USDC.ts
@@ -0,0 +1,19 @@
+const USDC: AssetMetaData = {
+  symbol: 'USDC',
+  name: 'Noble',
+  id: 'USDC',
+  color: '#478edc',
+  logo: '/images/tokens/usdc.svg',
+  decimals: 6,
+  hasOraclePrice: true,
+  isEnabled: true,
+  isMarket: true,
+  isDisplayCurrency: true,
+  isStable: true,
+  isBorrowEnabled: true,
+  isAutoLendEnabled: true,
+  pythPriceFeedId: 'eaa020c61cc479712813461ce153894a96a6c00b21ed0cfc2798d1f9a9e9c94a',
+  pythFeedName: 'USDCUSD',
+}
+
+export default USDC
diff --git a/src/configs/assets/USDT.ts b/src/configs/assets/USDT.ts
new file mode 100644
index 00000000..52fcbda4
--- /dev/null
+++ b/src/configs/assets/USDT.ts
@@ -0,0 +1,19 @@
+const USDT: AssetMetaData = {
+  symbol: 'USDT',
+  id: 'USDT',
+  name: 'Tether',
+  color: '#50af95',
+  logo: '/images/tokens/usdt.svg',
+  decimals: 6,
+  hasOraclePrice: true,
+  isEnabled: true,
+  isMarket: true,
+  isDisplayCurrency: true,
+  isStable: true,
+  isAutoLendEnabled: true,
+  isBorrowEnabled: true,
+  pythPriceFeedId: '2b89b9dc8fdf9f34709a5b106b472f0f39bb6ca9ce04b0fd7f2e971688e2e53b',
+  pythFeedName: 'USDTUSD',
+}
+
+export default USDT
diff --git a/src/configs/assets/USDollar.ts b/src/configs/assets/USDollar.ts
new file mode 100644
index 00000000..175ab6ea
--- /dev/null
+++ b/src/configs/assets/USDollar.ts
@@ -0,0 +1,17 @@
+const USD: Asset = {
+  symbol: '$',
+  name: 'US Dollar',
+  id: 'USD',
+  denom: 'usd',
+  color: '',
+  logo: '',
+  decimals: 2,
+  hasOraclePrice: false,
+  isEnabled: false,
+  isMarket: false,
+  isDisplayCurrency: true,
+  isStable: false,
+  forceFetchPrice: false,
+}
+
+export default USD
diff --git a/src/configs/assets/WBTC.axl.ts b/src/configs/assets/WBTC.axl.ts
new file mode 100644
index 00000000..874aa4e0
--- /dev/null
+++ b/src/configs/assets/WBTC.axl.ts
@@ -0,0 +1,18 @@
+const WBTCaxl: AssetMetaData = {
+  symbol: 'WBTC.axl',
+  id: 'axlWBTC',
+  name: 'Axelar Wrapped Bitcoin',
+  color: '#f09242',
+  logo: '/images/tokens/axlwbtc.svg',
+  decimals: 8,
+  hasOraclePrice: true,
+  isEnabled: true,
+  isMarket: true,
+  isDisplayCurrency: true,
+  isAutoLendEnabled: true,
+  isBorrowEnabled: true,
+  pythPriceFeedId: 'c9d8b075a5c69303365ae23633d4e085199bf5c520a3b90fed1322a0342ffc33',
+  pythFeedName: 'WBTCUSD',
+}
+
+export default WBTCaxl
diff --git a/src/configs/assets/WETH.xal.ts b/src/configs/assets/WETH.xal.ts
new file mode 100644
index 00000000..b613fa71
--- /dev/null
+++ b/src/configs/assets/WETH.xal.ts
@@ -0,0 +1,18 @@
+const WETHaxl: AssetMetaData = {
+  symbol: 'WETH.axl',
+  id: 'axlWETH',
+  name: 'Axelar Wrapped Ethereum',
+  color: '#343434',
+  logo: '/images/tokens/axlweth.svg',
+  decimals: 18,
+  hasOraclePrice: true,
+  isEnabled: true,
+  isMarket: true,
+  isDisplayCurrency: true,
+  isAutoLendEnabled: true,
+  isBorrowEnabled: true,
+  pythPriceFeedId: 'ff61491a931112ddf1bd8147cd1b641375f79f5825126d665480874634fd0ace',
+  pythFeedName: 'ETHUSD',
+}
+
+export default WETHaxl
diff --git a/src/configs/assets/lp/OSMO-ATOM.ts b/src/configs/assets/lp/OSMO-ATOM.ts
new file mode 100644
index 00000000..3aca7d10
--- /dev/null
+++ b/src/configs/assets/lp/OSMO-ATOM.ts
@@ -0,0 +1,15 @@
+const OSMO_ATOM: Asset = {
+  symbol: 'OSMO-ATOM',
+  name: 'OSMO-ATOM LP',
+  id: 'gamm/pool/1',
+  denom: 'gamm/pool/1',
+  color: '',
+  logo: '',
+  decimals: 6,
+  isEnabled: false,
+  isMarket: false,
+  hasOraclePrice: true,
+  forceFetchPrice: true,
+}
+
+export default OSMO_ATOM
diff --git a/src/configs/assets/lp/OSMO_USDC.ts b/src/configs/assets/lp/OSMO_USDC.ts
new file mode 100644
index 00000000..cfc5c470
--- /dev/null
+++ b/src/configs/assets/lp/OSMO_USDC.ts
@@ -0,0 +1,15 @@
+const OSMO_USDC: Asset = {
+  symbol: 'OSMO-USDC.axl',
+  name: 'OSMO-USDC.axl LP',
+  id: 'gamm/pool/678',
+  denom: 'gamm/pool/678',
+  color: '',
+  logo: '',
+  decimals: 6,
+  isEnabled: false,
+  isMarket: false,
+  hasOraclePrice: true,
+  forceFetchPrice: true,
+}
+
+export default OSMO_USDC
diff --git a/src/configs/assets/lp/OSMO_WBTC.ts b/src/configs/assets/lp/OSMO_WBTC.ts
new file mode 100644
index 00000000..5fe474ba
--- /dev/null
+++ b/src/configs/assets/lp/OSMO_WBTC.ts
@@ -0,0 +1,15 @@
+const OSMO_WBTC: Asset = {
+  symbol: 'OSMO-WBTC.axl',
+  name: 'OSMO-WBTC.axl LP',
+  id: 'gamm/pool/712',
+  denom: 'gamm/pool/712',
+  color: '',
+  logo: '',
+  decimals: 6,
+  isEnabled: false,
+  isMarket: false,
+  hasOraclePrice: true,
+  forceFetchPrice: true,
+}
+
+export default OSMO_WBTC
diff --git a/src/configs/assets/lp/OSMO_WETH.ts b/src/configs/assets/lp/OSMO_WETH.ts
new file mode 100644
index 00000000..f2133b60
--- /dev/null
+++ b/src/configs/assets/lp/OSMO_WETH.ts
@@ -0,0 +1,15 @@
+const OSMO_WETH: Asset = {
+  symbol: 'OSMO-WETH.axl',
+  name: 'OSMO-WETH.axl LP',
+  id: 'gamm/pool/704',
+  denom: 'gamm/pool/704',
+  color: '',
+  logo: '',
+  decimals: 6,
+  isEnabled: false,
+  isMarket: false,
+  hasOraclePrice: true,
+  forceFetchPrice: true,
+}
+
+export default OSMO_WETH
diff --git a/src/configs/assets/lp/stATOM_ATOM.ts b/src/configs/assets/lp/stATOM_ATOM.ts
new file mode 100644
index 00000000..84ccd3b4
--- /dev/null
+++ b/src/configs/assets/lp/stATOM_ATOM.ts
@@ -0,0 +1,15 @@
+const stATOM_ATOM: Asset = {
+  symbol: 'stATOM-ATOM',
+  name: 'stATOM-ATOM LP',
+  id: 'gamm/pool/803',
+  denom: 'gamm/pool/803',
+  color: '',
+  logo: '',
+  decimals: 6,
+  isEnabled: false,
+  isMarket: false,
+  hasOraclePrice: true,
+  forceFetchPrice: true,
+}
+
+export default stATOM_ATOM
diff --git a/src/configs/assets/stATOM.ts b/src/configs/assets/stATOM.ts
new file mode 100644
index 00000000..4d7e8f88
--- /dev/null
+++ b/src/configs/assets/stATOM.ts
@@ -0,0 +1,16 @@
+const stATOM: AssetMetaData = {
+  symbol: 'stATOM',
+  name: 'Stride Atom',
+  id: 'stATOM',
+  color: '#e50571',
+  logo: '/images/tokens/statom.svg',
+  decimals: 6,
+  hasOraclePrice: true,
+  isEnabled: true,
+  isMarket: true,
+  isDisplayCurrency: true,
+  isAutoLendEnabled: false,
+  isStaking: true,
+}
+
+export default stATOM
diff --git a/src/configs/assets/stOSMO.ts b/src/configs/assets/stOSMO.ts
new file mode 100644
index 00000000..3d66619a
--- /dev/null
+++ b/src/configs/assets/stOSMO.ts
@@ -0,0 +1,16 @@
+const stOSMO: AssetMetaData = {
+  symbol: 'stOSMO',
+  name: 'Stride Osmosis',
+  id: 'stOSMO',
+  color: '#e50571',
+  logo: '/images/tokens/stosmo.svg',
+  decimals: 6,
+  hasOraclePrice: true,
+  isEnabled: true,
+  isMarket: true,
+  isDisplayCurrency: true,
+  isAutoLendEnabled: false,
+  isStaking: true,
+}
+
+export default stOSMO
diff --git a/src/configs/chains/index.ts b/src/configs/chains/index.ts
new file mode 100644
index 00000000..4d220adc
--- /dev/null
+++ b/src/configs/chains/index.ts
@@ -0,0 +1,12 @@
+import Pion1 from 'configs/chains/neutron/pion-1'
+import Devnet from 'configs/chains/osmosis/devnet'
+import Osmosis1 from 'configs/chains/osmosis/osmosis-1'
+import { ChainInfoID } from 'types/enums/wallet'
+
+const chains: { [key: string]: ChainConfig } = {
+  [ChainInfoID.OsmosisDevnet]: Devnet,
+  [ChainInfoID.Osmosis1]: Osmosis1,
+  [ChainInfoID.Pion1]: Pion1,
+}
+
+export default chains
diff --git a/src/configs/chains/neutron/pion-1.ts b/src/configs/chains/neutron/pion-1.ts
new file mode 100644
index 00000000..8e425b96
--- /dev/null
+++ b/src/configs/chains/neutron/pion-1.ts
@@ -0,0 +1,68 @@
+import { Bech32Address } from '@keplr-wallet/cosmos'
+
+import ATOM from 'configs/assets/ATOM'
+import NTRN from 'configs/assets/NTRN'
+import USDCaxl from 'configs/assets/USDC.axl'
+import USDollar from 'configs/assets/USDollar'
+import { NETWORK } from 'types/enums/network'
+import { ChainInfoID } from 'types/enums/wallet'
+
+const Pion1: ChainConfig = {
+  assets: [
+    { ...NTRN, denom: 'untrn', isPerpsEnabled: true },
+    { ...USDCaxl, denom: 'ibc/F91EA2C0A23697A1048E08C2F787E3A58AC6F706A1CD2257A504925158CFC0F3' },
+    {
+      ...ATOM,
+      denom: 'ibc/C4CFF46FD6DE35CA4CF4CE031E643C8FDC9BA4B99AE598E9B0ED98FE3A2319F9',
+      isPerpsEnabled: true,
+    },
+    USDollar,
+  ],
+  id: ChainInfoID.Pion1,
+  name: 'Neutron Testnet',
+  contracts: {
+    redBank: 'neutron1u3fmnnd3q9dkx2sccjgs2hfdp7sndkw5f37ug64zj0zgdm6dgjxq4njrnc',
+    incentives: 'neutron18ere5chtsdswna8re75sldzhw0ccrmuff57cfh63060dnvflqswsxpzlm9',
+    oracle: 'neutron1nua7c2esr5d8f6jfkylsd4pjywwlf0snj8gtxkp6k6f5jxa32hxqq2lcm7',
+    swapper: 'neutron1me0pspfhkphe2mw7ja2f2fqnh0z5x30jj5t80jgd7p6y9swwk06snh7mun',
+    params: 'neutron1ku3eccj8a49atmgkv4g8r2zgy62l93xy224ls44lfvdexh5xfqds97rrz3',
+    creditManager: 'neutron1zjuschuar2e9cugj84hmun4r93mzkan6qy4x4ee5geguh3lmrdnsnq5s9z',
+    accountNft: 'neutron12wrdnp0edn7xqleak4khn265xrtkk732ext4d3yeyfz2gcup3e4scmmrj3',
+    perps: 'neutron1zlj4l4h55wmrctm3ete6sqjvucujgcpa7r9m0ex6pcgdngaqa0pss93jla',
+    pyth: 'neutron15ldst8t80982akgr8w8ekcytejzkmfpgdkeq4xgtge48qs7435jqp87u3t',
+  },
+  endpoints: {
+    routes: 'https://app.astroport.fi/api/routes',
+    rest: 'https://rest-palvus.pion-1.ntrn.tech/',
+    rpc: 'https://rpc-palvus.pion-1.ntrn.tech/',
+    swap: 'https://testnet-neutron.astroport.fi/swap',
+    pools: '', //TODO: ⛓️ Implement this
+    explorer: 'https://testnet.mintscan.io/neutron-testnet',
+    aprs: {
+      vaults: 'https://api.marsprotocol.io/v1/vaults/neutron',
+      stride: 'https://edge.stride.zone/api/stake-stats',
+    },
+  },
+  network: NETWORK.TESTNET,
+  vaults: [],
+  explorerName: 'Mintscan',
+  bech32Config: Bech32Address.defaultBech32Config('neutron'),
+  defaultCurrency: {
+    coinDenom: 'NTRN',
+    coinMinimalDenom: 'untrn',
+    coinDecimals: 6,
+    coinGeckoId: 'neutron',
+    gasPriceStep: {
+      low: 0,
+      average: 0.025,
+      high: 0.04,
+    },
+  },
+  features: ['ibc-transfer', 'ibc-go'],
+  gasPrice: '0.025untrn',
+  hls: false,
+  perps: true,
+  farm: false,
+}
+
+export default Pion1
diff --git a/src/configs/chains/osmosis/devnet.ts b/src/configs/chains/osmosis/devnet.ts
new file mode 100644
index 00000000..540a840e
--- /dev/null
+++ b/src/configs/chains/osmosis/devnet.ts
@@ -0,0 +1,19 @@
+import { NETWORK } from 'types/enums/network'
+import { ChainInfoID } from 'types/enums/wallet'
+
+import Osmosis1 from './osmosis-1'
+
+const Devnet: ChainConfig = {
+  ...Osmosis1,
+  id: ChainInfoID.OsmosisDevnet,
+  network: NETWORK.TESTNET,
+  name: 'Osmosis Devnet',
+  endpoints: {
+    ...Osmosis1.endpoints,
+    rpc: 'https://rpc.devnet.osmosis.zone/',
+    rest: 'https://lcd.devnet.osmosis.zone/',
+    swap: 'https://testnet.osmosis.zone',
+  },
+}
+
+export default Devnet
diff --git a/src/configs/chains/osmosis/osmosis-1.ts b/src/configs/chains/osmosis/osmosis-1.ts
new file mode 100644
index 00000000..ff6600f0
--- /dev/null
+++ b/src/configs/chains/osmosis/osmosis-1.ts
@@ -0,0 +1,160 @@
+import { Bech32Address } from '@keplr-wallet/cosmos'
+
+import AKT from 'configs/assets/AKT'
+import ATOM from 'configs/assets/ATOM'
+import AXL from 'configs/assets/AXL'
+import DYDX from 'configs/assets/DYDX'
+import INJ from 'configs/assets/INJ'
+import OSMO_ATOM from 'configs/assets/lp/OSMO-ATOM'
+import OSMO_USDC from 'configs/assets/lp/OSMO_USDC'
+import OSMO_WBTC from 'configs/assets/lp/OSMO_WBTC'
+import OSMO_WETH from 'configs/assets/lp/OSMO_WETH'
+import stATOM_ATOM from 'configs/assets/lp/stATOM_ATOM'
+import MARS from 'configs/assets/MARS'
+import OSMO from 'configs/assets/OSMO'
+import stATOM from 'configs/assets/stATOM'
+import stOSMO from 'configs/assets/stOSMO'
+import TIA from 'configs/assets/TIA'
+import USDC from 'configs/assets/USDC'
+import USDCaxl from 'configs/assets/USDC.axl'
+import USDollar from 'configs/assets/USDollar'
+import USDT from 'configs/assets/USDT'
+import WBTCaxl from 'configs/assets/WBTC.axl'
+import WETHaxl from 'configs/assets/WETH.xal'
+import { VAULTS_META_DATA } from 'constants/vaults'
+import { NETWORK } from 'types/enums/network'
+import { ChainInfoID } from 'types/enums/wallet'
+
+const ASSETS = [
+  { ...OSMO, denom: 'uosmo' },
+  USDollar,
+  {
+    ...USDC,
+    poolId: 1221,
+    denom: 'ibc/498A0751C798A0D9A389AA3691123DADA57DAA4FE165D5C75894505B876BA6E4',
+  },
+  {
+    ...ATOM,
+    poolId: 1,
+    denom: 'ibc/27394FB092D2ECCD56123C74F36E4C1F926001CEADA9CA97EA622B25F41E5EB2',
+  },
+  {
+    ...WBTCaxl,
+    poolId: 712,
+    denom: 'ibc/D1542AA8762DB13087D8364F3EA6509FD6F009A34F00426AF9E4F9FA85CBBF1F',
+  },
+  {
+    ...stOSMO,
+    poolId: 833,
+    denom: 'ibc/D176154B0C63D1F9C6DCFB4F70349EBF2E2B5A87A05902F57A6AE92B863E9AEC',
+  },
+  {
+    ...stATOM,
+    poolId: 803,
+    denom: 'ibc/C140AFD542AE77BD7DCC83F13FDD8C5E5BB8C4929785E6EC2F4C636F98F17901',
+  },
+  {
+    ...USDCaxl,
+    poolId: 678,
+    denom: 'ibc/D189335C6E4A68B513C10AB227BF1C1D38C746766278BA3EEB4FB14124F1D858',
+  },
+  {
+    ...WETHaxl,
+    poolId: 704,
+    denom: 'ibc/EA1D43981D5C9A1C4AAEA9C23BB1D4FA126BA9BC7020A25E0AE4AA841EA25DC5',
+  },
+  {
+    ...AKT,
+    poolId: 1093,
+    denom: 'ibc/1480B8FD20AD5FCAE81EA87584D269547DD4D436843C1D20F15E00EB64743EF4',
+  },
+  {
+    ...MARS,
+    poolId: 907,
+    denom: 'ibc/573FCD90FACEE750F55A8864EF7D38265F07E5A9273FA0E8DAFD39951332B580',
+  },
+  {
+    ...USDT,
+    poolId: 1077,
+    denom: 'ibc/4ABBEF4C8926DDDB320AE5188CFD63267ABBCEFC0583E4AE05D6E5AA2401DDAB',
+  },
+  {
+    ...AXL,
+    poolId: 812,
+    denom: 'ibc/903A61A498756EA560B85A85132D3AEE21B5DEDD41213725D22ABF276EA6945E',
+  },
+  {
+    ...INJ,
+    poolId: 725,
+    denom: 'ibc/64BA6E31FE887D66C6F8F31C7B1A80C7CA179239677B4088BB55F5EA07DBE273',
+  },
+  {
+    ...TIA,
+    poolId: 1249,
+    denom: 'ibc/D79E7D83AB399BFFF93433E54FAA480C191248FC556924A2A8351AE2638B3877',
+  },
+  {
+    ...DYDX,
+    poolId: 1245,
+    denom: 'ibc/831F0B1BBB1D08A2B75311892876D71565478C532967545476DF4C2D7492E48C',
+  },
+  OSMO_ATOM,
+  OSMO_USDC,
+  OSMO_WETH,
+  OSMO_WBTC,
+  stATOM_ATOM,
+]
+
+const Osmosis1: ChainConfig = {
+  assets: ASSETS,
+  bech32Config: Bech32Address.defaultBech32Config('osmo'),
+  contracts: {
+    redBank: 'osmo1c3ljch9dfw5kf52nfwpxd2zmj2ese7agnx0p9tenkrryasrle5sqf3ftpg',
+    accountNft: 'osmo1450hrg6dv2l58c0rvdwx8ec2a0r6dd50hn4frk370tpvqjhy8khqw7sw09',
+    oracle: 'osmo1mhznfr60vjdp2gejhyv2gax9nvyyzhd3z0qcwseyetkfustjauzqycsy2g',
+    creditManager: 'osmo1f2m24wktq0sw3c0lexlg7fv4kngwyttvzws3a3r3al9ld2s2pvds87jqvf',
+    incentives: 'osmo1nkahswfr8shg8rlxqwup0vgahp0dk4x8w6tkv3rra8rratnut36sk22vrm',
+    swapper: 'osmo1wee0z8c7tcawyl647eapqs4a88q8jpa7ddy6nn2nrs7t47p2zhxswetwla',
+    params: 'osmo1nlmdxt9ctql2jr47qd4fpgzg84cjswxyw6q99u4y4u4q6c2f5ksq7ysent',
+    pyth: 'osmo13ge29x4e2s63a8ytz2px8gurtyznmue4a69n5275692v3qn3ks8q7cwck7',
+    perps: '',
+  },
+  defaultCurrency: {
+    coinDenom: 'OSMO',
+    coinMinimalDenom: 'uosmo',
+    coinDecimals: 6,
+    coinGeckoId: 'osmosis',
+    gasPriceStep: {
+      low: 0,
+      average: 0.025,
+      high: 0.04,
+    },
+  },
+  endpoints: {
+    rpc: 'https://osmosis-node.marsprotocol.io/GGSFGSFGFG34/osmosis-rpc-front/',
+    rest: 'https://osmosis-node.marsprotocol.io/GGSFGSFGFG34/osmosis-lcd-front/',
+    swap: 'https://app.osmosis.zone',
+    explorer: 'https://www.mintscan.io/osmosis/transactions/',
+    routes: 'https://sqs.osmosis.zone/router',
+    pools:
+      (process.env.NEXT_PUBLIC_OSMOSIS_REST ||
+        'https://osmosis-node.marsprotocol.io/GGSFGSFGFG34/osmosis-lcd-front/') +
+      'osmosis/gamm/v1beta1/pools/POOL_ID',
+    aprs: {
+      vaults: 'https://api.marsprotocol.io/v1/vaults/osmosis',
+      stride: 'https://edge.stride.zone/api/stake-stats',
+    },
+  },
+  explorerName: 'Mintscan',
+  features: ['ibc-transfer', 'ibc-go'],
+  gasPrice: '0.025uosmo',
+  id: ChainInfoID.Osmosis1,
+  name: 'Osmosis',
+  network: NETWORK.MAINNET,
+  vaults: VAULTS_META_DATA,
+  hls: true,
+  perps: false,
+  farm: true,
+}
+
+export default Osmosis1
diff --git a/src/constants/accounts.ts b/src/constants/accounts.ts
index bb9d6d69..0a8bca09 100644
--- a/src/constants/accounts.ts
+++ b/src/constants/accounts.ts
@@ -5,6 +5,7 @@ export const EMPTY_ACCOUNT: Account = {
   deposits: [],
   lends: [],
   vaults: [],
+  perps: [],
 }
 
 export const EMPTY_ACCOUNT_HLS: Account = {
diff --git a/src/constants/assets.ts b/src/constants/assets.ts
deleted file mode 100644
index 983883b5..00000000
--- a/src/constants/assets.ts
+++ /dev/null
@@ -1,348 +0,0 @@
-import { ENV } from 'constants/env'
-import { NETWORK } from 'types/enums/network'
-
-export const ASSETS: Asset[] = [
-  {
-    symbol: 'OSMO',
-    name: 'Osmosis',
-    id: 'OSMO',
-    denom: 'uosmo',
-    color: '#9f1ab9',
-    decimals: 6,
-    hasOraclePrice: true,
-    logo: '/images/tokens/osmo.svg',
-    isEnabled: true,
-    isMarket: true,
-    isBorrowEnabled: true,
-    isDisplayCurrency: true,
-    isAutoLendEnabled: true,
-    pythPriceFeedId: '5867f5683c757393a0670ef0f701490950fe93fdb006d181c8265a831ac0c5c6',
-    pythHistoryFeedId: 'Crypto.OSMO/USD',
-  },
-  {
-    symbol: 'USDC.axl',
-    name: 'Axelar USDC',
-    id: 'axlUSDC',
-    denom: 'ibc/D189335C6E4A68B513C10AB227BF1C1D38C746766278BA3EEB4FB14124F1D858',
-    color: '#478edc',
-    logo: '/images/tokens/axlusdc.svg',
-    decimals: 6,
-    hasOraclePrice: true,
-    isEnabled: true,
-    isMarket: true,
-    isDisplayCurrency: true,
-    isStable: true,
-    isBorrowEnabled: true,
-    isAutoLendEnabled: true,
-    pythPriceFeedId: 'eaa020c61cc479712813461ce153894a96a6c00b21ed0cfc2798d1f9a9e9c94a',
-    pythHistoryFeedId: 'Crypto.USDC/USD',
-    poolId: 678,
-  },
-  {
-    symbol: 'USDC',
-    name: 'Noble',
-    id: 'USDC',
-    denom: 'ibc/498A0751C798A0D9A389AA3691123DADA57DAA4FE165D5C75894505B876BA6E4',
-    color: '#478edc',
-    logo: '/images/tokens/usdc.svg',
-    decimals: 6,
-    hasOraclePrice: true,
-    isEnabled: true,
-    isMarket: true,
-    isDisplayCurrency: true,
-    isStable: true,
-    isBorrowEnabled: true,
-    isAutoLendEnabled: true,
-    pythPriceFeedId: 'eaa020c61cc479712813461ce153894a96a6c00b21ed0cfc2798d1f9a9e9c94a',
-    pythHistoryFeedId: 'Crypto.USDC/USD',
-    poolId: ENV.NETWORK === NETWORK.DEVNET ? 678 : 1221,
-  },
-  {
-    symbol: 'ATOM',
-    name: 'Atom',
-    id: 'ATOM',
-    denom: 'ibc/27394FB092D2ECCD56123C74F36E4C1F926001CEADA9CA97EA622B25F41E5EB2',
-    color: '#6f7390',
-    logo: '/images/tokens/atom.svg',
-    decimals: 6,
-    hasOraclePrice: true,
-    isEnabled: true,
-    isMarket: true,
-    isDisplayCurrency: true,
-    isAutoLendEnabled: true,
-    isBorrowEnabled: true,
-    pythPriceFeedId: 'b00b60f88b03a6a625a8d1c048c3f66653edf217439983d037e7222c4e612819',
-    poolId: 1,
-    pythHistoryFeedId: 'Crypto.ATOM/USD',
-  },
-  {
-    symbol: 'stATOM',
-    name: 'Stride Atom',
-    id: 'stATOM',
-    denom: 'ibc/C140AFD542AE77BD7DCC83F13FDD8C5E5BB8C4929785E6EC2F4C636F98F17901',
-    color: '#e50571',
-    logo: '/images/tokens/statom.svg',
-    decimals: 6,
-    hasOraclePrice: true,
-    isEnabled: true,
-    isMarket: true,
-    isDisplayCurrency: true,
-    isAutoLendEnabled: false,
-    poolId: 803,
-    isStaking: true,
-  },
-  {
-    symbol: 'stOSMO',
-    name: 'Stride Osmosis',
-    id: 'stOSMO',
-    denom: 'ibc/D176154B0C63D1F9C6DCFB4F70349EBF2E2B5A87A05902F57A6AE92B863E9AEC',
-    color: '#e50571',
-    logo: '/images/tokens/stosmo.svg',
-    decimals: 6,
-    hasOraclePrice: true,
-    isEnabled: true,
-    isMarket: true,
-    isDisplayCurrency: true,
-    isAutoLendEnabled: false,
-    poolId: 833,
-    isStaking: true,
-  },
-  {
-    symbol: 'WBTC.axl',
-    id: 'axlWBTC',
-    name: 'Axelar Wrapped Bitcoin',
-    denom: 'ibc/D1542AA8762DB13087D8364F3EA6509FD6F009A34F00426AF9E4F9FA85CBBF1F',
-    color: '#f09242',
-    logo: '/images/tokens/axlwbtc.svg',
-    decimals: 8,
-    hasOraclePrice: true,
-    isEnabled: true,
-    isMarket: true,
-    isDisplayCurrency: true,
-    isAutoLendEnabled: true,
-    isBorrowEnabled: true,
-    pythPriceFeedId: 'c9d8b075a5c69303365ae23633d4e085199bf5c520a3b90fed1322a0342ffc33',
-    pythHistoryFeedId: 'Crypto.WBTC/USD',
-    poolId: 712,
-  },
-  {
-    symbol: 'WETH.axl',
-    id: 'axlWETH',
-    name: 'Axelar Wrapped Ethereum',
-    denom: 'ibc/EA1D43981D5C9A1C4AAEA9C23BB1D4FA126BA9BC7020A25E0AE4AA841EA25DC5',
-    color: '#343434',
-    logo: '/images/tokens/axlweth.svg',
-    decimals: 18,
-    hasOraclePrice: true,
-    isEnabled: true,
-    isMarket: true,
-    isDisplayCurrency: true,
-    isAutoLendEnabled: true,
-    isBorrowEnabled: true,
-    pythPriceFeedId: 'ff61491a931112ddf1bd8147cd1b641375f79f5825126d665480874634fd0ace',
-    pythHistoryFeedId: 'Crypto.ETH/USD',
-    poolId: 704,
-  },
-  {
-    symbol: 'MARS',
-    name: 'Mars',
-    id: 'MARS',
-    denom: 'ibc/573FCD90FACEE750F55A8864EF7D38265F07E5A9273FA0E8DAFD39951332B580',
-    color: '#a03b45',
-    logo: '/images/tokens/mars.svg',
-    decimals: 6,
-    poolId: 907,
-    hasOraclePrice: false,
-    isMarket: false,
-    isEnabled: true,
-    forceFetchPrice: true,
-  },
-  {
-    symbol: 'USDT',
-    id: 'USDT',
-    name: 'Tether',
-    denom: 'ibc/4ABBEF4C8926DDDB320AE5188CFD63267ABBCEFC0583E4AE05D6E5AA2401DDAB',
-    color: '#50af95',
-    logo: '/images/tokens/usdt.svg',
-    decimals: 6,
-    hasOraclePrice: true,
-    isEnabled: true,
-    isMarket: true,
-    isDisplayCurrency: true,
-    isStable: true,
-    isAutoLendEnabled: true,
-    isBorrowEnabled: true,
-    pythPriceFeedId: '2b89b9dc8fdf9f34709a5b106b472f0f39bb6ca9ce04b0fd7f2e971688e2e53b',
-    poolId: 1077,
-    pythHistoryFeedId: 'Crypto.USDT/USD',
-  },
-  {
-    symbol: 'AXL',
-    name: 'Axelar',
-    id: 'AXL',
-    denom: 'ibc/903A61A498756EA560B85A85132D3AEE21B5DEDD41213725D22ABF276EA6945E',
-    color: '#FFF',
-    logo: '/images/tokens/axl.svg',
-    decimals: 6,
-    hasOraclePrice: true,
-    isEnabled: true,
-    isMarket: true,
-    isDisplayCurrency: true,
-    isAutoLendEnabled: false,
-    pythPriceFeedId: '60144b1d5c9e9851732ad1d9760e3485ef80be39b984f6bf60f82b28a2b7f126',
-    pythHistoryFeedId: 'Crypto.AXL/USD',
-    poolId: 812,
-  },
-  {
-    symbol: 'INJ',
-    id: 'INJ',
-    name: 'Injective',
-    denom: 'ibc/64BA6E31FE887D66C6F8F31C7B1A80C7CA179239677B4088BB55F5EA07DBE273',
-    color: '#00F2FE',
-    logo: '/images/tokens/inj.svg',
-    decimals: 18,
-    hasOraclePrice: true,
-    isEnabled: true,
-    isMarket: true,
-    isDisplayCurrency: true,
-    isAutoLendEnabled: true,
-    isBorrowEnabled: true,
-    pythPriceFeedId: '7a5bc1d2b56ad029048cd63964b3ad2776eadf812edc1a43a31406cb54bff592',
-    poolId: 725,
-    pythHistoryFeedId: 'Crypto.INJ/USD',
-  },
-  {
-    symbol: 'TIA',
-    id: 'TIA',
-    name: 'Celestia',
-    denom: 'ibc/D79E7D83AB399BFFF93433E54FAA480C191248FC556924A2A8351AE2638B3877',
-    color: '#8623ff',
-    logo: '/images/tokens/tia.svg',
-    decimals: 6,
-    hasOraclePrice: true,
-    isEnabled: true,
-    isMarket: true,
-    isDisplayCurrency: true,
-    isAutoLendEnabled: true,
-    isBorrowEnabled: true,
-    pythPriceFeedId: '09f7c1d7dfbb7df2b8fe3d3d87ee94a2259d212da4f30c1f0540d066dfa44723',
-    poolId: 1249,
-    pythHistoryFeedId: 'Crypto.TIA/USD',
-  },
-  {
-    symbol: 'AKT',
-    id: 'AKT',
-    name: 'Akash',
-    denom: 'ibc/1480B8FD20AD5FCAE81EA87584D269547DD4D436843C1D20F15E00EB64743EF4',
-    color: '#F34C2D',
-    logo: '/images/tokens/akt.svg',
-    decimals: 6,
-    hasOraclePrice: true,
-    isEnabled: true,
-    isMarket: true,
-    isDisplayCurrency: true,
-    isAutoLendEnabled: true,
-    isBorrowEnabled: true,
-    pythPriceFeedId: '4ea5bb4d2f5900cc2e97ba534240950740b4d3b89fe712a94a7304fd2fd92702',
-    poolId: 1093,
-    pythHistoryFeedId: 'Crypto.AKT/USD',
-  },
-  {
-    symbol: 'DYDX',
-    id: 'DYDX',
-    name: 'dYdX',
-    denom: 'ibc/831F0B1BBB1D08A2B75311892876D71565478C532967545476DF4C2D7492E48C',
-    color: '#6966ff',
-    logo: '/images/tokens/dydx.svg',
-    decimals: 18,
-    hasOraclePrice: true,
-    isEnabled: true,
-    isMarket: true,
-    isDisplayCurrency: true,
-    isAutoLendEnabled: true,
-    isBorrowEnabled: true,
-    pythPriceFeedId: '6489800bb8974169adfe35937bf6736507097d13c190d760c557108c7e93a81b',
-    poolId: 1245,
-    pythHistoryFeedId: 'Crypto.DYDX/USD',
-  },
-  {
-    symbol: '$',
-    name: 'US Dollar',
-    id: 'USD',
-    denom: 'usd',
-    color: '',
-    logo: '',
-    decimals: 2,
-    hasOraclePrice: false,
-    isEnabled: false,
-    isMarket: false,
-    isDisplayCurrency: true,
-    isStable: false,
-    forceFetchPrice: false,
-  },
-  {
-    symbol: 'OSMO-ATOM',
-    name: 'OSMO-ATOM LP',
-    id: 'gamm/pool/1',
-    denom: 'gamm/pool/1',
-    color: '',
-    logo: '',
-    decimals: 6,
-    isEnabled: false,
-    isMarket: false,
-    hasOraclePrice: true,
-    forceFetchPrice: true,
-  },
-  {
-    symbol: 'OSMO-USDC.axl',
-    name: 'OSMO-USDC.axl LP',
-    id: 'gamm/pool/678',
-    denom: 'gamm/pool/678',
-    color: '',
-    logo: '',
-    decimals: 6,
-    isEnabled: false,
-    isMarket: false,
-    hasOraclePrice: true,
-    forceFetchPrice: true,
-  },
-  {
-    symbol: 'OSMO-WETH.axl',
-    name: 'OSMO-WETH.axl LP',
-    id: 'gamm/pool/704',
-    denom: 'gamm/pool/704',
-    color: '',
-    logo: '',
-    decimals: 6,
-    isEnabled: false,
-    isMarket: false,
-    hasOraclePrice: true,
-    forceFetchPrice: true,
-  },
-  {
-    symbol: 'OSMO-WBTC.axl',
-    name: 'OSMO-WBTC.axl LP',
-    id: 'gamm/pool/712',
-    denom: 'gamm/pool/712',
-    color: '',
-    logo: '',
-    decimals: 6,
-    isEnabled: false,
-    isMarket: false,
-    hasOraclePrice: true,
-    forceFetchPrice: true,
-  },
-  {
-    symbol: 'stATOM-ATOM',
-    name: 'stATOM-ATOM LP',
-    id: 'gamm/pool/803',
-    denom: 'gamm/pool/803',
-    color: '',
-    logo: '',
-    decimals: 6,
-    isEnabled: false,
-    isMarket: false,
-    hasOraclePrice: true,
-    forceFetchPrice: true,
-  },
-]
diff --git a/src/constants/chains.ts b/src/constants/chains.ts
deleted file mode 100644
index fa84e8c4..00000000
--- a/src/constants/chains.ts
+++ /dev/null
@@ -1,72 +0,0 @@
-import { Bech32Address } from '@keplr-wallet/cosmos'
-
-import { ChainInfoID } from 'types/enums/wallet'
-
-export const CHAINS: ChainInfos = {
-  [ChainInfoID.Osmosis1]: {
-    rpc: 'https://rpc.osmosis.zone',
-    rest: 'https://lcd.osmosis.zone',
-    explorer: 'https://www.mintscan.io/osmosis',
-    explorerName: 'Mintscan',
-    chainId: ChainInfoID.Osmosis1,
-    name: 'Osmosis',
-    gasPrice: '0.025uosmo',
-    bech32Config: Bech32Address.defaultBech32Config('osmo'),
-    defaultCurrency: {
-      coinDenom: 'OSMO',
-      coinMinimalDenom: 'uosmo',
-      coinDecimals: 6,
-      coinGeckoId: 'osmosis',
-      gasPriceStep: {
-        low: 0,
-        average: 0.025,
-        high: 0.04,
-      },
-    },
-    features: ['ibc-transfer', 'ibc-go'],
-  },
-  [ChainInfoID.OsmosisDevnet]: {
-    rpc: 'https://rpc.devnet.osmosis.zone',
-    rest: '	https://lcd.devnet.osmosis.zone',
-    explorer: 'https://www.mintscan.io/osmosis',
-    explorerName: 'Mintscan',
-    chainId: ChainInfoID.OsmosisDevnet,
-    name: 'Osmosis Devnet',
-    gasPrice: '0.025uosmo',
-    bech32Config: Bech32Address.defaultBech32Config('osmo'),
-    defaultCurrency: {
-      coinDenom: 'OSMO',
-      coinMinimalDenom: 'uosmo',
-      coinDecimals: 6,
-      coinGeckoId: 'osmosis',
-      gasPriceStep: {
-        low: 0,
-        average: 0.025,
-        high: 0.04,
-      },
-    },
-    features: ['ibc-transfer', 'ibc-go'],
-  },
-  [ChainInfoID.OsmosisTestnet]: {
-    rpc: 'https://rpc.osmotest5.osmosis.zone',
-    rest: 'https://lcd.osmotest5.osmosis.zone',
-    explorer: 'https://testnet.mintscan.io/osmosis-testnet',
-    explorerName: 'Mintscan',
-    chainId: ChainInfoID.OsmosisTestnet,
-    name: 'Osmosis Testnet',
-    gasPrice: '0.025uosmo',
-    bech32Config: Bech32Address.defaultBech32Config('osmo'),
-    defaultCurrency: {
-      coinDenom: 'OSMO',
-      coinMinimalDenom: 'uosmo',
-      coinDecimals: 6,
-      coinGeckoId: 'osmosis',
-      gasPriceStep: {
-        low: 0,
-        average: 0.025,
-        high: 0.04,
-      },
-    },
-    features: ['ibc-transfer', 'ibc-go'],
-  },
-}
diff --git a/src/constants/defaultSettings.ts b/src/constants/defaultSettings.ts
index 95b4e95e..f47d6d66 100644
--- a/src/constants/defaultSettings.ts
+++ b/src/constants/defaultSettings.ts
@@ -1,16 +1,25 @@
 import { ORACLE_DENOM } from 'constants/oracle'
-import { getEnabledMarketAssets } from 'utils/assets'
+import useStore from 'store'
 
-const enabledMarketAssets = getEnabledMarketAssets()
+// This does not retrigger when chains are switched. Assets might not be present on the new chain, but
+// This scenario is still caught.
+const enabledMarketAssets = useStore
+  .getState()
+  .chainConfig.assets.filter((asset) => asset.isEnabled && asset.isMarket)
 
 export const DEFAULT_SETTINGS: Settings = {
-  accountSummaryTabs: [true, true],
+  accountSummaryTabs: [true, true, false],
   reduceMotion: false,
-  lendAssets: true,
-  tradingPairSimple: { buy: enabledMarketAssets[0].denom, sell: enabledMarketAssets[1].denom },
+  enableAutoLendGlobal: true,
+  tradingPairSimple: {
+    buy: enabledMarketAssets[0].denom,
+    sell: enabledMarketAssets[1].denom,
+  },
   tradingPairAdvanced: { buy: enabledMarketAssets[0].denom, sell: enabledMarketAssets[1].denom },
   displayCurrency: ORACLE_DENOM,
   slippage: 0.02,
   tutorial: true,
   migrationBanner: true,
+  perpsAsset: '',
+  updateOracle: true,
 }
diff --git a/src/constants/env.ts b/src/constants/env.ts
deleted file mode 100644
index 1a3c4b31..00000000
--- a/src/constants/env.ts
+++ /dev/null
@@ -1,47 +0,0 @@
-interface EnvironmentVariables {
-  ADDRESS_ACCOUNT_NFT: string
-  ADDRESS_CREDIT_MANAGER: string
-  ADDRESS_INCENTIVES: string
-  ADDRESS_ORACLE: string
-  ADDRESS_PARAMS: string
-  ADDRESS_PYTH: string
-  ADDRESS_RED_BANK: string
-  ADDRESS_SWAPPER: string
-  ADDRESS_ZAPPER: string
-  CANDLES_ENDPOINT_THE_GRAPH: string
-  CANDLES_ENDPOINT_PYTH: string
-  CHAIN_ID: string
-  NETWORK: string
-  URL_GQL: string
-  URL_REST: string
-  URL_RPC: string
-  URL_VAULT_APR: string
-  PYTH_ENDPOINT: string
-  MAINNET_REST_API: string
-  WALLET_CONNECT_ID: string
-  STRIDE_APRS: string
-}
-
-export const ENV: EnvironmentVariables = {
-  ADDRESS_ACCOUNT_NFT: process.env.NEXT_PUBLIC_ACCOUNT_NFT || '',
-  ADDRESS_CREDIT_MANAGER: process.env.NEXT_PUBLIC_CREDIT_MANAGER || '',
-  ADDRESS_INCENTIVES: process.env.NEXT_PUBLIC_INCENTIVES || '',
-  ADDRESS_ORACLE: process.env.NEXT_PUBLIC_ORACLE || '',
-  ADDRESS_PARAMS: process.env.NEXT_PUBLIC_PARAMS || '',
-  ADDRESS_PYTH: process.env.NEXT_PUBLIC_PYTH || '',
-  ADDRESS_RED_BANK: process.env.NEXT_PUBLIC_RED_BANK || '',
-  ADDRESS_SWAPPER: process.env.NEXT_PUBLIC_SWAPPER || '',
-  ADDRESS_ZAPPER: process.env.NEXT_PUBLIC_ZAPPER || '',
-  CANDLES_ENDPOINT_THE_GRAPH: process.env.NEXT_PUBLIC_CANDLES_ENDPOINT_THE_GRAPH || '',
-  CANDLES_ENDPOINT_PYTH: process.env.NEXT_PUBLIC_CANDLES_ENDPOINT_PYTH || '',
-  CHAIN_ID: process.env.NEXT_PUBLIC_CHAIN_ID || '',
-  NETWORK: process.env.NEXT_PUBLIC_NETWORK || '',
-  URL_GQL: process.env.NEXT_PUBLIC_GQL || '',
-  URL_REST: process.env.NEXT_PUBLIC_REST || '',
-  URL_RPC: process.env.NEXT_PUBLIC_RPC || '',
-  URL_VAULT_APR: process.env.NEXT_PUBLIC_VAULT_APR || '',
-  PYTH_ENDPOINT: process.env.NEXT_PUBLIC_PYTH_ENDPOINT || '',
-  MAINNET_REST_API: process.env.NEXT_PUBLIC_MAINNET_REST || '',
-  WALLET_CONNECT_ID: process.env.NEXT_PUBLIC_WALLET_CONNECT_ID || '',
-  STRIDE_APRS: process.env.NEXT_PUBLIC_STRIDE_APRS || '',
-}
diff --git a/src/constants/explorer.ts b/src/constants/explorer.ts
deleted file mode 100644
index 2d088bd5..00000000
--- a/src/constants/explorer.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-import { ENV } from 'constants/env'
-import { NETWORK } from 'types/enums/network'
-
-export const EXPLORER_NAME = 'Mintscan'
-export const EXPLORER_TX_URL =
-  ENV.NETWORK === NETWORK.TESTNET
-    ? 'https://testnet.mintscan.io/osmosis-testnet/txs/'
-    : 'https://www.mintscan.io/osmosis/transactions/'
diff --git a/src/constants/localStorageKeys.ts b/src/constants/localStorageKeys.ts
index 12f15681..3cc2a559 100644
--- a/src/constants/localStorageKeys.ts
+++ b/src/constants/localStorageKeys.ts
@@ -5,7 +5,7 @@ export enum LocalStorageKeys {
   DISPLAY_CURRENCY = 'displayCurrency',
   REDUCE_MOTION = 'reduceMotion',
   FAVORITE_ASSETS = 'favoriteAssets',
-  LEND_ASSETS = 'lendAssets',
+  ENABLE_AUTO_LEND_GLOBAL = 'enableAutoLendGlobal',
   AUTO_LEND_ENABLED_ACCOUNT_IDS = 'autoLendEnabledAccountIds',
   SLIPPAGE = 'slippage',
   TERMS_OF_SERVICE = 'termsOfService',
@@ -13,4 +13,7 @@ export enum LocalStorageKeys {
   TRANSACTIONS = 'transactions',
   MIGRATION_BANNER = 'migrationBanner',
   HLS_INFORMATION = 'hlsInformation',
+  CURRENT_CHAIN_ID = 'currentChainId',
+  PERPS_ASSET = 'perpsAsset',
+  UPDATE_ORACLE = 'updateOracle',
 }
diff --git a/src/constants/pyth.ts b/src/constants/pyth.ts
new file mode 100644
index 00000000..3887c8d7
--- /dev/null
+++ b/src/constants/pyth.ts
@@ -0,0 +1,4 @@
+export const pythEndpoints = {
+  api: process.env.NEXT_PUBLIC_PYTH_API ?? 'https://hermes.pyth.network/api',
+  candles: 'https://benchmarks.pyth.network/v1/shims/tradingview',
+}
diff --git a/src/constants/wallets.ts b/src/constants/wallets.ts
index 59add501..c641fbf9 100644
--- a/src/constants/wallets.ts
+++ b/src/constants/wallets.ts
@@ -8,21 +8,21 @@ export const WALLETS: WalletInfos = {
       'https://chrome.google.com/webstore/detail/cosmostation-wallet/fpkhgmpbidmiogeglndfbkegfdlnajnf',
     imageURL: '/images/wallets/cosmostation.png',
 
-    supportedChains: [ChainInfoID.Osmosis1, ChainInfoID.OsmosisDevnet, ChainInfoID.OsmosisTestnet],
+    supportedChains: [ChainInfoID.Osmosis1, ChainInfoID.OsmosisDevnet, ChainInfoID.Pion1],
   },
   [WalletID.CosmostationMobile]: {
     name: 'Cosmostation Wallet',
     walletConnect: 'Cosmostation WalletConnect',
     imageURL: '/images/wallets/cosmostation.png',
     mobileImageURL: '/images/wallets/cosmostation-wc.png',
-    supportedChains: [ChainInfoID.Osmosis1, ChainInfoID.OsmosisDevnet, ChainInfoID.OsmosisTestnet],
+    supportedChains: [ChainInfoID.Osmosis1, ChainInfoID.OsmosisDevnet],
   },
   [WalletID.Keplr]: {
     name: 'Keplr Wallet',
     install: 'Install Keplr Wallet',
     installURL: 'https://www.keplr.app/download',
     imageURL: '/images/wallets/keplr.png',
-    supportedChains: [ChainInfoID.Osmosis1, ChainInfoID.OsmosisDevnet, ChainInfoID.OsmosisTestnet],
+    supportedChains: [ChainInfoID.Osmosis1, ChainInfoID.OsmosisDevnet, ChainInfoID.Pion1],
   },
   [WalletID.KeplrMobile]: {
     name: 'Keplr Wallet',
@@ -37,21 +37,21 @@ export const WALLETS: WalletInfos = {
     installURL:
       'https://chrome.google.com/webstore/detail/leap-cosmos-wallet/fcfcfllfndlomdhbehjjcoimbgofdncg',
     imageURL: '/images/wallets/leap.png',
-    supportedChains: [ChainInfoID.Osmosis1, ChainInfoID.OsmosisDevnet, ChainInfoID.OsmosisTestnet],
+    supportedChains: [ChainInfoID.Osmosis1, ChainInfoID.OsmosisDevnet, ChainInfoID.Pion1],
   },
   [WalletID.LeapMobile]: {
     name: 'Leap Wallet',
     walletConnect: 'Leap WalletConnect',
     imageURL: '/images/wallets/leap.png',
     mobileImageURL: '/images/wallets/leap-wc.png',
-    supportedChains: [ChainInfoID.Osmosis1, ChainInfoID.OsmosisDevnet, ChainInfoID.OsmosisTestnet],
+    supportedChains: [ChainInfoID.Osmosis1, ChainInfoID.OsmosisDevnet],
   },
   [WalletID.LeapSnap]: {
     name: 'MetaMask (via Leap Snap)',
     install: 'Install MetaMask',
     installURL: 'https://metamask.io/download/',
     imageURL: '/images/wallets/leap-snap.png',
-    supportedChains: [ChainInfoID.Osmosis1, ChainInfoID.OsmosisDevnet],
+    supportedChains: [ChainInfoID.Osmosis1, ChainInfoID.OsmosisDevnet, ChainInfoID.Pion1],
   },
   [WalletID.Station]: {
     name: 'Station Wallet',
@@ -68,4 +68,11 @@ export const WALLETS: WalletInfos = {
     imageURL: '/images/wallets/xdefi.png',
     supportedChains: [ChainInfoID.Osmosis1],
   },
+  [WalletID.Vectis]: {
+    name: 'Vectis Wallet',
+    install: 'Install Vectis Wallet',
+    installURL: 'https://chrome.google.com/webstore/detail/vectis/cgkaddoglojnmfiblgmlinfaijcdpfjm',
+    imageURL: '/images/wallets/vectis.png',
+    supportedChains: [ChainInfoID.Pion1],
+  },
 }
diff --git a/src/hooks/accounts/useAccount.tsx b/src/hooks/accounts/useAccount.tsx
new file mode 100644
index 00000000..980cc590
--- /dev/null
+++ b/src/hooks/accounts/useAccount.tsx
@@ -0,0 +1,17 @@
+import useSWR from 'swr'
+
+import getAccount from 'api/accounts/getAccount'
+import useChainConfig from 'hooks/useChainConfig'
+
+export default function useAccount(accountId?: string, suspense?: boolean) {
+  const chainConfig = useChainConfig()
+
+  return useSWR(
+    accountId && `chains/${chainConfig.id}/accounts/${accountId}`,
+    () => getAccount(chainConfig, accountId),
+    {
+      suspense: suspense,
+      revalidateOnFocus: false,
+    },
+  )
+}
diff --git a/src/hooks/useAccountIds.tsx b/src/hooks/accounts/useAccountIds.tsx
similarity index 69%
rename from src/hooks/useAccountIds.tsx
rename to src/hooks/accounts/useAccountIds.tsx
index 3acde859..d37bbdbd 100644
--- a/src/hooks/useAccountIds.tsx
+++ b/src/hooks/accounts/useAccountIds.tsx
@@ -1,12 +1,14 @@
 import useSWR from 'swr'
 
 import getAccountIds from 'api/wallets/getAccountIds'
+import useChainConfig from 'hooks/useChainConfig'
 
 export default function useAccountIdsAndKinds(address?: string, suspense = true, noHls = false) {
+  const chainConfig = useChainConfig()
   return useSWR(
-    `wallets/${address}/account-ids${noHls && '-without-hls'}`,
+    `chains/${chainConfig.id}/wallets/${address}/account-ids${noHls && '-without-hls'}`,
     () =>
-      getAccountIds(address).then((accountIdsAndKinds) => {
+      getAccountIds(chainConfig, address).then((accountIdsAndKinds) => {
         if (noHls) {
           return accountIdsAndKinds
             .filter((accountIdAndKind) => accountIdAndKind.kind !== 'high_levered_strategy')
diff --git a/src/hooks/accounts/useAccounts.tsx b/src/hooks/accounts/useAccounts.tsx
new file mode 100644
index 00000000..21027704
--- /dev/null
+++ b/src/hooks/accounts/useAccounts.tsx
@@ -0,0 +1,19 @@
+import useSWR from 'swr'
+
+import getAccounts from 'api/wallets/getAccounts'
+import useChainConfig from 'hooks/useChainConfig'
+import { AccountKind } from 'types/generated/mars-rover-health-computer/MarsRoverHealthComputer.types'
+
+export default function useAccounts(kind: AccountKind, address?: string, suspense = true) {
+  const chainConfig = useChainConfig()
+
+  return useSWR(
+    `chains/${chainConfig.id}/accounts/${kind}`,
+    () => getAccounts(kind, chainConfig, address),
+    {
+      suspense: suspense,
+      fallbackData: [],
+      revalidateOnFocus: false,
+    },
+  )
+}
diff --git a/src/hooks/accounts/useCurrentAccount.tsx b/src/hooks/accounts/useCurrentAccount.tsx
new file mode 100644
index 00000000..4d3944fe
--- /dev/null
+++ b/src/hooks/accounts/useCurrentAccount.tsx
@@ -0,0 +1,11 @@
+import { useMemo } from 'react'
+
+import useAccount from 'hooks/accounts/useAccount'
+import useAccountId from 'hooks/useAccountId'
+
+export default function useCurrentAccount(): Account | undefined {
+  const accountId = useAccountId()
+  const { data: account } = useAccount(accountId || undefined)
+
+  return useMemo(() => account, [account])
+}
diff --git a/src/hooks/assets/useAllAssets.ts b/src/hooks/assets/useAllAssets.ts
new file mode 100644
index 00000000..f50e50cc
--- /dev/null
+++ b/src/hooks/assets/useAllAssets.ts
@@ -0,0 +1,5 @@
+import useStore from 'store'
+
+export default function useAllAssets() {
+  return useStore((s) => s.chainConfig.assets)
+}
diff --git a/src/hooks/assets/useAsset.ts b/src/hooks/assets/useAsset.ts
new file mode 100644
index 00000000..804b4b5c
--- /dev/null
+++ b/src/hooks/assets/useAsset.ts
@@ -0,0 +1,8 @@
+import useStore from 'store'
+import { byDenom, bySymbol } from 'utils/array'
+
+export default function useAsset(denomOrSymbol: string) {
+  const assets = useStore((s) => s.chainConfig.assets)
+
+  return assets.find(byDenom(denomOrSymbol)) ?? assets.find(bySymbol(denomOrSymbol))
+}
diff --git a/src/hooks/assets/useBasetAsset.ts b/src/hooks/assets/useBasetAsset.ts
new file mode 100644
index 00000000..01b2a270
--- /dev/null
+++ b/src/hooks/assets/useBasetAsset.ts
@@ -0,0 +1,7 @@
+import useStore from 'store'
+
+export default function useBaseAsset() {
+  const assets = useStore((s) => s.chainConfig.assets)
+
+  return assets[0]
+}
diff --git a/src/hooks/assets/useBorrowEnabledAssets.ts b/src/hooks/assets/useBorrowEnabledAssets.ts
new file mode 100644
index 00000000..8d6fd680
--- /dev/null
+++ b/src/hooks/assets/useBorrowEnabledAssets.ts
@@ -0,0 +1,7 @@
+import useStore from 'store'
+
+export default function useBorrowEnabledAssets() {
+  const assets = useStore((s) => s.chainConfig.assets)
+
+  return assets.filter((asset) => asset.isBorrowEnabled)
+}
diff --git a/src/hooks/assets/useDisplayCurrencyAssets.ts b/src/hooks/assets/useDisplayCurrencyAssets.ts
new file mode 100644
index 00000000..c3eb2a90
--- /dev/null
+++ b/src/hooks/assets/useDisplayCurrencyAssets.ts
@@ -0,0 +1,7 @@
+import useStore from 'store'
+
+export default function useDisplayCurrencyAssets() {
+  const assets = useStore((s) => s.chainConfig.assets)
+
+  return assets.filter((asset) => asset.isDisplayCurrency)
+}
diff --git a/src/hooks/assets/useGetCoinValue.ts b/src/hooks/assets/useGetCoinValue.ts
new file mode 100644
index 00000000..7c4a7101
--- /dev/null
+++ b/src/hooks/assets/useGetCoinValue.ts
@@ -0,0 +1,25 @@
+import { useCallback } from 'react'
+
+import { BN_ZERO } from 'constants/math'
+import { ORACLE_DENOM } from 'constants/oracle'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import usePrices from 'hooks/usePrices'
+import { BNCoin } from 'types/classes/BNCoin'
+import { byDenom } from 'utils/array'
+
+export default function useGetCoinValue() {
+  const { data: prices } = usePrices()
+  const assets = useAllAssets()
+
+  return useCallback(
+    (coin: BNCoin) => {
+      const asset = assets.find(byDenom(coin.denom))
+      const price = prices.find(byDenom(coin.denom))
+      if (!asset || !price) return BN_ZERO
+
+      const decimals = asset.denom === ORACLE_DENOM ? 0 : asset.decimals * -1
+      return coin.amount.shiftedBy(decimals).multipliedBy(price.amount)
+    },
+    [prices, assets],
+  )
+}
diff --git a/src/hooks/assets/useLendEnabledAssets.ts b/src/hooks/assets/useLendEnabledAssets.ts
new file mode 100644
index 00000000..6839eb19
--- /dev/null
+++ b/src/hooks/assets/useLendEnabledAssets.ts
@@ -0,0 +1,7 @@
+import useStore from 'store'
+
+export default function useLendEnabledAssets() {
+  const assets = useStore((s) => s.chainConfig.assets)
+
+  return assets.filter((asset) => asset.isAutoLendEnabled)
+}
diff --git a/src/hooks/assets/useMarketEnabledAssets.ts b/src/hooks/assets/useMarketEnabledAssets.ts
new file mode 100644
index 00000000..152bd05b
--- /dev/null
+++ b/src/hooks/assets/useMarketEnabledAssets.ts
@@ -0,0 +1,8 @@
+import { useMemo } from 'react'
+
+import useStore from 'store'
+
+export default function useMarketEnabledAssets() {
+  const assets = useStore((s) => s.chainConfig.assets)
+  return useMemo(() => assets.filter((asset) => asset.isEnabled && asset.isMarket), [assets])
+}
diff --git a/src/hooks/assets/usePerpsEnabledAssets.ts b/src/hooks/assets/usePerpsEnabledAssets.ts
new file mode 100644
index 00000000..984c8c9f
--- /dev/null
+++ b/src/hooks/assets/usePerpsEnabledAssets.ts
@@ -0,0 +1,7 @@
+import useStore from 'store'
+
+export default function usePerpsEnabledAssets() {
+  const assets = useStore((s) => s.chainConfig.assets)
+
+  return assets.filter((asset) => asset.isPerpsEnabled)
+}
diff --git a/src/hooks/broadcast/useDepositVault.ts b/src/hooks/broadcast/useDepositVault.ts
index 6849b155..3b2553b5 100644
--- a/src/hooks/broadcast/useDepositVault.ts
+++ b/src/hooks/broadcast/useDepositVault.ts
@@ -2,12 +2,13 @@ import { useMemo } from 'react'
 
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import useLendEnabledAssets from 'hooks/assets/useLendEnabledAssets'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import useAutoLend from 'hooks/useAutoLend'
-import useLocalStorage from 'hooks/useLocalStorage'
 import usePrices from 'hooks/usePrices'
 import { BNCoin } from 'types/classes/BNCoin'
 import { AccountKind, Action } from 'types/generated/mars-credit-manager/MarsCreditManager.types'
-import { getLendEnabledAssets } from 'utils/assets'
 import {
   getEnterVaultActions,
   getVaultDepositCoinsAndValue,
@@ -26,6 +27,8 @@ export default function useDepositVault(props: Props): {
   actions: Action[]
   totalValue: BigNumber
 } {
+  const lendEnabledAssets = useLendEnabledAssets()
+  const assets = useAllAssets()
   const { data: prices } = usePrices()
   const [slippage] = useLocalStorage<number>(LocalStorageKeys.SLIPPAGE, DEFAULT_SETTINGS.slippage)
   const { isAutoLendEnabledForCurrentAccount: isAutoLend } = useAutoLend()
@@ -44,8 +47,16 @@ export default function useDepositVault(props: Props): {
 
   const { primaryCoin, secondaryCoin, totalValue } = useMemo(
     () =>
-      getVaultDepositCoinsAndValue(props.vault, deposits, borrowings, reclaims, prices, slippage),
-    [props.vault, deposits, borrowings, reclaims, prices, slippage],
+      getVaultDepositCoinsAndValue(
+        props.vault,
+        deposits,
+        borrowings,
+        reclaims,
+        prices,
+        slippage,
+        assets,
+      ),
+    [props.vault, deposits, borrowings, reclaims, prices, slippage, assets],
   )
 
   const depositActions: Action[] = useMemo(() => {
@@ -69,8 +80,9 @@ export default function useDepositVault(props: Props): {
   }, [borrowings])
 
   const swapActions: Action[] = useMemo(
-    () => getVaultSwapActions(props.vault, deposits, reclaims, borrowings, prices, slippage),
-    [props.vault, deposits, reclaims, borrowings, prices, slippage],
+    () =>
+      getVaultSwapActions(props.vault, deposits, reclaims, borrowings, prices, assets, slippage),
+    [props.vault, deposits, reclaims, borrowings, prices, assets, slippage],
   )
 
   const enterVaultActions: Action[] = useMemo(() => {
@@ -83,7 +95,7 @@ export default function useDepositVault(props: Props): {
     if (!isAutoLend || props.kind === 'high_levered_strategy') return []
 
     const denoms = [props.vault.denoms.primary, props.vault.denoms.secondary]
-    const denomsForLend = getLendEnabledAssets()
+    const denomsForLend = lendEnabledAssets
       .filter((asset) => denoms.includes(asset.denom))
       .map((asset) => asset.denom)
 
@@ -93,7 +105,13 @@ export default function useDepositVault(props: Props): {
         amount: 'account_balance',
       },
     }))
-  }, [isAutoLend, props.kind, props.vault.denoms.primary, props.vault.denoms.secondary])
+  }, [
+    isAutoLend,
+    lendEnabledAssets,
+    props.kind,
+    props.vault.denoms.primary,
+    props.vault.denoms.secondary,
+  ])
 
   const refundActions: Action[] = useMemo(() => {
     if (props.kind === 'default') return []
diff --git a/src/hooks/HLS/useClosePositionActions.ts b/src/hooks/hls/useClosePositionActions.ts
similarity index 83%
rename from src/hooks/HLS/useClosePositionActions.ts
rename to src/hooks/hls/useClosePositionActions.ts
index 0f9f083b..339ad519 100644
--- a/src/hooks/HLS/useClosePositionActions.ts
+++ b/src/hooks/hls/useClosePositionActions.ts
@@ -4,7 +4,8 @@ import { useMemo } from 'react'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
 import { BN_ZERO } from 'constants/math'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import usePrices from 'hooks/usePrices'
 import useSwapValueLoss from 'hooks/useSwapValueLoss'
 import { BNCoin } from 'types/classes/BNCoin'
@@ -22,7 +23,7 @@ export default function UseClosePositionActions(props: Props): Action[] {
   const collateralDenom = props.account.strategy.denoms.deposit
   const borrowDenom = props.account.strategy.denoms.borrow
   const { data: swapValueLoss } = useSwapValueLoss(collateralDenom, borrowDenom)
-
+  const assets = useAllAssets()
   const debtAmount: BigNumber = useMemo(
     () =>
       props.account.debts.find((debt) => debt.denom === props.account.strategy.denoms.borrow)
@@ -39,14 +40,27 @@ export default function UseClosePositionActions(props: Props): Action[] {
   )
 
   const swapInAmount = useMemo(() => {
-    const targetValue = getCoinValue(BNCoin.fromDenomAndBigNumber(borrowDenom, debtAmount), prices)
+    const targetValue = getCoinValue(
+      BNCoin.fromDenomAndBigNumber(borrowDenom, debtAmount),
+      prices,
+      assets,
+    )
     return BigNumber.max(
-      getCoinAmount(collateralDenom, targetValue, prices)
+      getCoinAmount(collateralDenom, targetValue, prices, assets)
         .times(1 + slippage + SWAP_FEE_BUFFER + swapValueLoss)
         .integerValue(),
       collateralAmount,
     )
-  }, [borrowDenom, debtAmount, prices, slippage, swapValueLoss, collateralDenom, collateralAmount])
+  }, [
+    borrowDenom,
+    debtAmount,
+    prices,
+    assets,
+    collateralDenom,
+    slippage,
+    swapValueLoss,
+    collateralAmount,
+  ])
 
   return useMemo<Action[]>(
     () => [
diff --git a/src/hooks/HLS/useDepositActions.ts b/src/hooks/hls/useDepositActions.ts
similarity index 93%
rename from src/hooks/HLS/useDepositActions.ts
rename to src/hooks/hls/useDepositActions.ts
index 40629b45..c40e6b20 100644
--- a/src/hooks/HLS/useDepositActions.ts
+++ b/src/hooks/hls/useDepositActions.ts
@@ -2,7 +2,7 @@ import { useMemo } from 'react'
 
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import { BNCoin } from 'types/classes/BNCoin'
 
 interface Props {
diff --git a/src/hooks/localStorage/useAutoLendEnabledAccountIds.ts b/src/hooks/localStorage/useAutoLendEnabledAccountIds.ts
new file mode 100644
index 00000000..786de7ec
--- /dev/null
+++ b/src/hooks/localStorage/useAutoLendEnabledAccountIds.ts
@@ -0,0 +1,12 @@
+import { LocalStorageKeys } from 'constants/localStorageKeys'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
+import useChainConfig from 'hooks/useChainConfig'
+
+export default function useAutoLendEnabledAccountIds() {
+  const chainConfig = useChainConfig()
+
+  return useLocalStorage<string[]>(
+    `${chainConfig.id}/${LocalStorageKeys.AUTO_LEND_ENABLED_ACCOUNT_IDS}`,
+    [],
+  )
+}
diff --git a/src/hooks/localStorage/useCurrentChainId.ts b/src/hooks/localStorage/useCurrentChainId.ts
new file mode 100644
index 00000000..3b7cafe5
--- /dev/null
+++ b/src/hooks/localStorage/useCurrentChainId.ts
@@ -0,0 +1,10 @@
+import { LocalStorageKeys } from 'constants/localStorageKeys'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
+import useChainConfig from 'hooks/useChainConfig'
+import { ChainInfoID } from 'types/enums/wallet'
+
+export default function useCurrentChainId() {
+  const chainConfig = useChainConfig()
+
+  return useLocalStorage<ChainInfoID>(LocalStorageKeys.CURRENT_CHAIN_ID, chainConfig.id)
+}
diff --git a/src/hooks/localStorage/useDisplayCurrency.ts b/src/hooks/localStorage/useDisplayCurrency.ts
new file mode 100644
index 00000000..2e810f63
--- /dev/null
+++ b/src/hooks/localStorage/useDisplayCurrency.ts
@@ -0,0 +1,13 @@
+import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
+import { LocalStorageKeys } from 'constants/localStorageKeys'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
+import useChainConfig from 'hooks/useChainConfig'
+
+export default function useDisplayCurrency() {
+  const chainConfig = useChainConfig()
+
+  return useLocalStorage<string>(
+    `${chainConfig.id}/${LocalStorageKeys.DISPLAY_CURRENCY}`,
+    DEFAULT_SETTINGS.displayCurrency,
+  )
+}
diff --git a/src/hooks/localStorage/useEnableAutoLendGlobal.ts b/src/hooks/localStorage/useEnableAutoLendGlobal.ts
new file mode 100644
index 00000000..32ed9524
--- /dev/null
+++ b/src/hooks/localStorage/useEnableAutoLendGlobal.ts
@@ -0,0 +1,13 @@
+import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
+import { LocalStorageKeys } from 'constants/localStorageKeys'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
+import useChainConfig from 'hooks/useChainConfig'
+
+export default function useEnableAutoLendGlobal() {
+  const chainConfig = useChainConfig()
+
+  return useLocalStorage<boolean>(
+    `${chainConfig.id}/${LocalStorageKeys.ENABLE_AUTO_LEND_GLOBAL}`,
+    DEFAULT_SETTINGS.enableAutoLendGlobal,
+  )
+}
diff --git a/src/hooks/localStorage/useFavoriteAssets.ts b/src/hooks/localStorage/useFavoriteAssets.ts
new file mode 100644
index 00000000..6f488463
--- /dev/null
+++ b/src/hooks/localStorage/useFavoriteAssets.ts
@@ -0,0 +1,9 @@
+import { LocalStorageKeys } from 'constants/localStorageKeys'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
+import useChainConfig from 'hooks/useChainConfig'
+
+export default function useFavoriteAssets() {
+  const chainConfig = useChainConfig()
+
+  return useLocalStorage<string[]>(`${chainConfig.id}/${LocalStorageKeys.FAVORITE_ASSETS}`, [])
+}
diff --git a/src/hooks/useLocalStorage.ts b/src/hooks/localStorage/useLocalStorage.ts
similarity index 64%
rename from src/hooks/useLocalStorage.ts
rename to src/hooks/localStorage/useLocalStorage.ts
index 7d032e2c..62034438 100644
--- a/src/hooks/useLocalStorage.ts
+++ b/src/hooks/localStorage/useLocalStorage.ts
@@ -15,17 +15,28 @@ export default function useLocalStorage<T>(key: string, defaultValue: T): [T, (v
   useEffect(() => {
     const savedItem = localStorage.getItem(keyRef.current)
 
+    const isString = typeof defaultValueRef.current === 'string'
     if (!savedItem) {
-      localStorage.setItem(keyRef.current, JSON.stringify(defaultValueRef.current))
+      localStorage.setItem(
+        keyRef.current,
+        isString ? (defaultValueRef.current as string) : JSON.stringify(defaultValueRef.current),
+      )
     }
 
-    updateValue(savedItem ? JSON.parse(savedItem) : defaultValueRef.current)
+    updateValue(
+      savedItem ? (isString ? savedItem : JSON.parse(savedItem)) : defaultValueRef.current,
+    )
 
     function handler(e: StorageEvent) {
       if (e.key !== keyRef.current) return
 
       const item = localStorage.getItem(keyRef.current)
-      updateValue(JSON.parse(item ?? JSON.stringify(defaultValueRef.current)))
+
+      if (isString) {
+        updateValue((item as T) ?? (defaultValueRef.current as T))
+      } else {
+        updateValue(JSON.parse(item ?? JSON.stringify(defaultValueRef.current)))
+      }
     }
 
     window.addEventListener('storage', handler)
@@ -40,7 +51,10 @@ export default function useLocalStorage<T>(key: string, defaultValue: T): [T, (v
       try {
         updateValue(value)
 
-        localStorage.setItem(keyRef.current, JSON.stringify(value))
+        localStorage.setItem(
+          keyRef.current,
+          typeof value === 'string' ? (value as string) : JSON.stringify(value),
+        )
         if (typeof window !== 'undefined') {
           window.dispatchEvent(new StorageEvent('storage', { key: keyRef.current }))
         }
diff --git a/src/hooks/localStorage/useTransactions.ts b/src/hooks/localStorage/useTransactions.ts
new file mode 100644
index 00000000..a90be679
--- /dev/null
+++ b/src/hooks/localStorage/useTransactions.ts
@@ -0,0 +1,11 @@
+import { LocalStorageKeys } from 'constants/localStorageKeys'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
+import useChainConfig from 'hooks/useChainConfig'
+
+export default function useDisplayCurrency() {
+  const chainConfig = useChainConfig()
+
+  return useLocalStorage<ToastStore>(`${chainConfig.id}/${LocalStorageKeys.TRANSACTIONS}`, {
+    recent: [],
+  })
+}
diff --git a/src/hooks/markets/useMarketAssets.ts b/src/hooks/markets/useMarketAssets.ts
new file mode 100644
index 00000000..ec4d24f8
--- /dev/null
+++ b/src/hooks/markets/useMarketAssets.ts
@@ -0,0 +1,14 @@
+import useSWR from 'swr'
+
+import getMarkets from 'api/markets/getMarkets'
+import useChainConfig from 'hooks/useChainConfig'
+
+export default function useMarketAssets() {
+  const chainConfig = useChainConfig()
+  return useSWR(`chains/${chainConfig.id}/markets`, () => getMarkets(chainConfig), {
+    suspense: true,
+    fallbackData: [],
+    revalidateOnFocus: false,
+    keepPreviousData: false,
+  })
+}
diff --git a/src/hooks/markets/useMarketBorrowings.tsx b/src/hooks/markets/useMarketBorrowings.tsx
new file mode 100644
index 00000000..40f33a69
--- /dev/null
+++ b/src/hooks/markets/useMarketBorrowings.tsx
@@ -0,0 +1,17 @@
+import useSWR from 'swr'
+
+import getMarketBorrowings from 'api/markets/getMarketBorrowings'
+import useChainConfig from 'hooks/useChainConfig'
+
+export default function useMarketBorrowings() {
+  const chainConfig = useChainConfig()
+  return useSWR(
+    `chains/${chainConfig.id}/markets/borrowings`,
+    () => getMarketBorrowings(chainConfig),
+    {
+      fallbackData: [],
+      suspense: false,
+      revalidateOnFocus: false,
+    },
+  )
+}
diff --git a/src/hooks/useMarketDeposits.ts b/src/hooks/markets/useMarketDeposits.ts
similarity index 52%
rename from src/hooks/useMarketDeposits.ts
rename to src/hooks/markets/useMarketDeposits.ts
index 32d6e0bb..16f62730 100644
--- a/src/hooks/useMarketDeposits.ts
+++ b/src/hooks/markets/useMarketDeposits.ts
@@ -1,9 +1,11 @@
 import useSWR from 'swr'
 
 import getMarketDeposits from 'api/markets/getMarketDeposits'
+import useChainConfig from 'hooks/useChainConfig'
 
 export default function useMarketDeposits() {
-  return useSWR(`marketDeposits`, getMarketDeposits, {
+  const chainConfig = useChainConfig()
+  return useSWR(`chains/${chainConfig.id}/markets/deposits`, () => getMarketDeposits(chainConfig), {
     suspense: true,
     fallbackData: [],
     revalidateOnFocus: false,
diff --git a/src/hooks/markets/useMarketLiquidities.ts b/src/hooks/markets/useMarketLiquidities.ts
new file mode 100644
index 00000000..db6a4f50
--- /dev/null
+++ b/src/hooks/markets/useMarketLiquidities.ts
@@ -0,0 +1,17 @@
+import useSWR from 'swr'
+
+import getMarketLiquidities from 'api/markets/getMarketLiquidities'
+import useChainConfig from 'hooks/useChainConfig'
+
+export default function useMarketLiquidities() {
+  const chainConfig = useChainConfig()
+  return useSWR(
+    `chains/${chainConfig.id}/markets/liquidities`,
+    () => getMarketLiquidities(chainConfig),
+    {
+      suspense: true,
+      fallbackData: [],
+      revalidateOnFocus: false,
+    },
+  )
+}
diff --git a/src/hooks/useAssetParams.tsx b/src/hooks/params/useAssetParams.tsx
similarity index 50%
rename from src/hooks/useAssetParams.tsx
rename to src/hooks/params/useAssetParams.tsx
index f3bfb9cd..0cabb30b 100644
--- a/src/hooks/useAssetParams.tsx
+++ b/src/hooks/params/useAssetParams.tsx
@@ -1,9 +1,11 @@
 import useSWR from 'swr'
 
 import getAssetParams from 'api/params/getAssetParams'
+import useChainConfig from 'hooks/useChainConfig'
 
 export default function useAssetParams() {
-  return useSWR('assetParams', getAssetParams, {
+  const chainConfig = useChainConfig()
+  return useSWR(`chains/${chainConfig.id}/assets/params`, () => getAssetParams(chainConfig), {
     fallbackData: [],
     revalidateOnFocus: false,
   })
diff --git a/src/hooks/perps/useOpeningFee.ts b/src/hooks/perps/useOpeningFee.ts
new file mode 100644
index 00000000..2499d19d
--- /dev/null
+++ b/src/hooks/perps/useOpeningFee.ts
@@ -0,0 +1,16 @@
+import BigNumber from 'bignumber.js'
+import useSWR from 'swr'
+
+import getOpeningFee from 'api/perps/getOpeningFee'
+import useChainConfig from 'hooks/useChainConfig'
+import useDebounce from 'hooks/useDebounce'
+
+export default function useOpeningFee(denom: string, amount: BigNumber) {
+  const chainConfig = useChainConfig()
+  const debouncedAmount = useDebounce<string>(amount.toString(), 500)
+  const enabled = !amount.isZero()
+
+  return useSWR(enabled && `${chainConfig.id}/perps/${denom}/openingFee/${debouncedAmount}`, () =>
+    getOpeningFee(chainConfig, denom, amount.toString()),
+  )
+}
diff --git a/src/hooks/perps/usePerpPosition.ts b/src/hooks/perps/usePerpPosition.ts
new file mode 100644
index 00000000..69fede15
--- /dev/null
+++ b/src/hooks/perps/usePerpPosition.ts
@@ -0,0 +1,10 @@
+import { useMemo } from 'react'
+
+import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
+import { byDenom } from 'utils/array'
+
+export default function usePerpPosition(denom: string): PerpsPosition | undefined {
+  const account = useCurrentAccount()
+
+  return useMemo(() => account?.perps.find(byDenom(denom)), [account?.perps, denom])
+}
diff --git a/src/hooks/perps/usePerpsAsset.ts b/src/hooks/perps/usePerpsAsset.ts
new file mode 100644
index 00000000..aa9947ac
--- /dev/null
+++ b/src/hooks/perps/usePerpsAsset.ts
@@ -0,0 +1,40 @@
+import { useCallback, useMemo } from 'react'
+import { useSearchParams } from 'react-router-dom'
+
+import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
+import { LocalStorageKeys } from 'constants/localStorageKeys'
+import usePerpsEnabledAssets from 'hooks/assets/usePerpsEnabledAssets'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
+import useChainConfig from 'hooks/useChainConfig'
+import { getSearchParamsObject } from 'utils/route'
+
+export default function usePerpsAsset() {
+  const chainConfig = useChainConfig()
+  const [searchParams, setSearchParams] = useSearchParams()
+  const perpsAssets = usePerpsEnabledAssets()
+  const perpsAssetInParams = searchParams.get('perpsMarket')
+  const [perpsAssetInLocalStorage, setPerpsAssetInLocalStorage] = useLocalStorage<
+    Settings['perpsAsset']
+  >(chainConfig.id + '/' + LocalStorageKeys.PERPS_ASSET, DEFAULT_SETTINGS.perpsAsset)
+
+  const updatePerpsAsset = useCallback(
+    (denom: string) => {
+      const params = getSearchParamsObject(searchParams)
+      params.perpsMarket = denom
+      setSearchParams(params)
+      setPerpsAssetInLocalStorage(denom)
+    },
+    [searchParams, setPerpsAssetInLocalStorage, setSearchParams],
+  )
+
+  return {
+    perpsAsset: useMemo(
+      () =>
+        perpsAssets.find(
+          (asset) => asset.denom === (perpsAssetInParams || perpsAssetInLocalStorage),
+        ) ?? perpsAssets[0],
+      [perpsAssetInLocalStorage, perpsAssetInParams, perpsAssets],
+    ),
+    updatePerpsAsset,
+  }
+}
diff --git a/src/hooks/perps/usePerpsConfig.ts b/src/hooks/perps/usePerpsConfig.ts
new file mode 100644
index 00000000..59476a75
--- /dev/null
+++ b/src/hooks/perps/usePerpsConfig.ts
@@ -0,0 +1,14 @@
+import useSWR from 'swr'
+
+import useChainConfig from 'hooks/useChainConfig'
+import useClients from 'hooks/useClients'
+
+export default function usePerpsConfig() {
+  const chainConfig = useChainConfig()
+  const clients = useClients()
+  return useSWR(clients && `chains/${chainConfig.id}/perps/config`, () => getPerpsConfig(clients!))
+}
+
+async function getPerpsConfig(clients: ContractClients) {
+  return clients.perps.config()
+}
diff --git a/src/hooks/perps/usePerpsMarket.ts b/src/hooks/perps/usePerpsMarket.ts
index 5b0490f0..87f3cbf9 100644
--- a/src/hooks/perps/usePerpsMarket.ts
+++ b/src/hooks/perps/usePerpsMarket.ts
@@ -1,36 +1,34 @@
-import { useSearchParams } from 'react-router-dom'
 import useSWR from 'swr'
 
-import { ASSETS } from 'constants/assets'
-import { getAssetBySymbol } from 'utils/assets'
+import { BN_ZERO } from 'constants/math'
+import usePerpsAsset from 'hooks/perps/usePerpsAsset'
+import useChainConfig from 'hooks/useChainConfig'
+import useClients from 'hooks/useClients'
 import { BN } from 'utils/helpers'
 
 export default function usePerpsMarket() {
-  const [searchParams] = useSearchParams()
-  const perpsMarket = searchParams.get('perpsMarket') || ASSETS[0].symbol
-
-  const asset = getAssetBySymbol(perpsMarket)
+  const chainConfig = useChainConfig()
+  const { perpsAsset } = usePerpsAsset()
+  const clients = useClients()
 
   return useSWR(
-    `perpsMarket/${perpsMarket}`,
-    async () => {
-      await delay(3000)
-      if (!asset) return null
-      return {
-        asset,
-        fundingRate: BN(0.001432),
-        openInterest: {
-          long: BN(92901203),
-          short: BN(129891203),
-        },
-      } as PerpsMarket
-    },
+    clients && perpsAsset && `chains/${chainConfig.id}/perps/${perpsAsset.denom}`,
+    () => getPerpsMarket(clients!, perpsAsset!),
     {
-      fallbackData: null,
+      refreshInterval: 1000,
+      dedupingInterval: 1000,
     },
   )
 }
 
-function delay(ms: number) {
-  return new Promise((resolve) => setTimeout(resolve, ms))
+async function getPerpsMarket(clients: ContractClients, asset: Asset) {
+  const denomState = await clients.perps.perpDenomState({ denom: asset.denom })
+  return {
+    fundingRate: BN(denomState.rate as any),
+    asset: asset,
+    openInterest: {
+      long: BN_ZERO,
+      short: BN_ZERO,
+    },
+  } as PerpsMarket
 }
diff --git a/src/hooks/perps/usePerpsParams.ts b/src/hooks/perps/usePerpsParams.ts
new file mode 100644
index 00000000..8cfc6ea4
--- /dev/null
+++ b/src/hooks/perps/usePerpsParams.ts
@@ -0,0 +1,15 @@
+import useSWR from 'swr'
+
+import useChainConfig from 'hooks/useChainConfig'
+import useClients from 'hooks/useClients'
+import iterateContractQuery from 'utils/iterateContractQuery'
+
+export default function usePerpsParams() {
+  const chainConfig = useChainConfig()
+  const clients = useClients()
+  return useSWR(clients && `chains/${chainConfig.id}/perps/params`, () => getPerpsParams(clients!))
+}
+
+async function getPerpsParams(clients: ContractClients) {
+  return iterateContractQuery(clients.params.allPerpParams, undefined, [])
+}
diff --git a/src/hooks/perps/usePerpsVaultState.ts b/src/hooks/perps/usePerpsVaultState.ts
new file mode 100644
index 00000000..8248baf0
--- /dev/null
+++ b/src/hooks/perps/usePerpsVaultState.ts
@@ -0,0 +1,16 @@
+import useSWR from 'swr'
+
+import useChainConfig from 'hooks/useChainConfig'
+import useClients from 'hooks/useClients'
+
+export default function usePerpsVaultState() {
+  const chainConfig = useChainConfig()
+  const clients = useClients()
+  return useSWR(clients && `chains/${chainConfig.id}/perps/vault-state`, () =>
+    getPerpsVaultState(clients!),
+  )
+}
+
+async function getPerpsVaultState(clients: ContractClients) {
+  return clients.perps.vaultState()
+}
diff --git a/src/hooks/trade/useRoutes.ts b/src/hooks/trade/useRoutes.ts
new file mode 100644
index 00000000..c804fd76
--- /dev/null
+++ b/src/hooks/trade/useRoutes.ts
@@ -0,0 +1,66 @@
+import useSWR from 'swr'
+
+import useChainConfig from 'hooks/useChainConfig'
+import { ChainInfoID } from 'types/enums/wallet'
+import { BN } from 'utils/helpers'
+
+export default function useRoutes(denomIn: string, denomOut: string, amount: BigNumber) {
+  const chainConfig = useChainConfig()
+  const isOsmosis = [ChainInfoID.Osmosis1, ChainInfoID.OsmosisDevnet].includes(chainConfig.id)
+
+  const osmosisRoute = useSWR<SwapRouteInfo | null>(
+    isOsmosis &&
+      `${chainConfig.endpoints.routes}/quote?tokenIn=${denomIn}&tokenOutDenom=${denomOut}&amount=${amount}`,
+    async (url: string) => {
+      try {
+        const resp = await fetch(url)
+        const route = (await resp.json()) as OsmosisRouteResponse
+
+        return {
+          priceImpact: BN(route.price_impact),
+          fee: BN(route.effective_fee),
+          route: {
+            osmo: {
+              swaps: route.route[0].pools.map((pool) => ({
+                pool_id: pool.id.toString(),
+                to: pool.token_out_denom,
+              })),
+            },
+          },
+        }
+      } catch {
+        return null
+      }
+    },
+  )
+
+  const astroportRoute = useSWR<SwapRouteInfo | null>(
+    !isOsmosis &&
+      `${chainConfig.endpoints.routes}?start=${denomIn}&end=${denomOut}&amount=${amount}&chainId=${chainConfig.id}&limit=1`,
+    async (url: string) => {
+      try {
+        const resp = await fetch(url)
+        const route = (await resp.json())[0] as AstroportRouteResponse
+
+        return {
+          priceImpact: BN(route.price_impact),
+          fee: BN(0), // TODO: Fees are not implemented yet on Astroport endpoint
+          route: {
+            astro: {
+              swaps: route.swaps.map((swap) => ({
+                from: swap.from,
+                to: swap.to,
+              })),
+            },
+          },
+        }
+      } catch (e) {
+        return null
+      }
+    },
+  )
+
+  if (isOsmosis) return osmosisRoute
+
+  return astroportRoute
+}
diff --git a/src/hooks/useAccount.tsx b/src/hooks/useAccount.tsx
deleted file mode 100644
index 0a127623..00000000
--- a/src/hooks/useAccount.tsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import useSWR from 'swr'
-
-import getAccount from 'api/accounts/getAccount'
-
-export default function useAccount(accountId?: string, suspense?: boolean) {
-  return useSWR(`account${accountId}`, () => getAccount(accountId), {
-    suspense: suspense,
-    revalidateOnFocus: false,
-  })
-}
diff --git a/src/hooks/useAccounts.tsx b/src/hooks/useAccounts.tsx
deleted file mode 100644
index dda33819..00000000
--- a/src/hooks/useAccounts.tsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import useSWR from 'swr'
-
-import getAccounts from 'api/wallets/getAccounts'
-import useStore from 'store'
-import { AccountKind } from 'types/generated/mars-rover-health-computer/MarsRoverHealthComputer.types'
-
-export default function useAccounts(kind: AccountKind, address?: string, suspense = true) {
-  return useSWR(`accounts/${kind}`, () => getAccounts(kind, address), {
-    suspense: suspense,
-    fallbackData: [],
-    revalidateOnFocus: false,
-    onSuccess: (accounts) => {
-      if (kind === 'high_levered_strategy') {
-        useStore.setState({ hlsAccounts: accounts })
-        return
-      }
-      useStore.setState({ accounts: accounts })
-    },
-  })
-}
diff --git a/src/hooks/useAssetIncentiveApy.ts b/src/hooks/useAssetIncentiveApy.ts
index d2a8c057..54329fa1 100644
--- a/src/hooks/useAssetIncentiveApy.ts
+++ b/src/hooks/useAssetIncentiveApy.ts
@@ -1,9 +1,15 @@
 import useSWR from 'swr'
 
 import calculateAssetIncentivesApy from 'api/incentives/calculateAssetIncentivesApy'
+import useChainConfig from 'hooks/useChainConfig'
 
 export default function useAssetIncentivesApy(denom: string) {
-  return useSWR(`assetIncentiveApy-${denom}`, () => calculateAssetIncentivesApy(denom), {
-    revalidateOnFocus: false,
-  })
+  const chainConfig = useChainConfig()
+  return useSWR(
+    `chains/${chainConfig.id}/assets/${denom}/incentives`,
+    () => calculateAssetIncentivesApy(chainConfig, denom),
+    {
+      revalidateOnFocus: false,
+    },
+  )
 }
diff --git a/src/hooks/useAssets.ts b/src/hooks/useAssets.ts
index fe233593..417cd536 100644
--- a/src/hooks/useAssets.ts
+++ b/src/hooks/useAssets.ts
@@ -1,16 +1,14 @@
 import { useCallback, useEffect, useState } from 'react'
 
-import { ASSETS } from 'constants/assets'
-import { LocalStorageKeys } from 'constants/localStorageKeys'
-import useLocalStorage from 'hooks/useLocalStorage'
-import { getEnabledMarketAssets } from 'utils/assets'
+import useMarketEnabledAssets from 'hooks/assets/useMarketEnabledAssets'
+import useFavoriteAssets from 'hooks/localStorage/useFavoriteAssets'
 
 export default function useAssets() {
-  const [assets, setAssets] = useState<Asset[]>(ASSETS)
-  const [favoriteAssetsDenoms] = useLocalStorage<string[]>(LocalStorageKeys.FAVORITE_ASSETS, [])
-
+  const marketEnabledAssets = useMarketEnabledAssets()
+  const [assets, setAssets] = useState<Asset[]>(marketEnabledAssets)
+  const [favoriteAssetsDenoms] = useFavoriteAssets()
   const getFavoriteAssets = useCallback(() => {
-    const assets = getEnabledMarketAssets()
+    const assets = marketEnabledAssets
       .map((asset) => ({
         ...asset,
         isFavorite: favoriteAssetsDenoms.includes(asset.denom),
@@ -18,7 +16,7 @@ export default function useAssets() {
       .sort((a, b) => +b.isFavorite - +a.isFavorite)
 
     setAssets(assets)
-  }, [favoriteAssetsDenoms])
+  }, [favoriteAssetsDenoms, marketEnabledAssets])
 
   useEffect(() => {
     getFavoriteAssets()
diff --git a/src/hooks/useAutoLend.ts b/src/hooks/useAutoLend.ts
index 8a8e45db..ac5a6d77 100644
--- a/src/hooks/useAutoLend.ts
+++ b/src/hooks/useAutoLend.ts
@@ -1,7 +1,6 @@
-import { LocalStorageKeys } from 'constants/localStorageKeys'
-import useCurrentAccount from 'hooks/useCurrentAccount'
-import useLocalStorage from 'hooks/useLocalStorage'
-import useStore from 'store'
+import useAccounts from 'hooks/accounts/useAccounts'
+import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
+import useAutoLendEnabledAccountIds from 'hooks/localStorage/useAutoLendEnabledAccountIds'
 
 export default function useAutoLend(): {
   autoLendEnabledAccountIds: string[]
@@ -11,12 +10,9 @@ export default function useAutoLend(): {
   setAutoLendOnAllAccounts: (lendAssets: boolean) => void
   enableAutoLendAccountId: (accountId: string) => void
 } {
-  const accounts = useStore((s) => s.accounts)
+  const { data: accounts } = useAccounts('default', undefined, false)
   const currentAccount = useCurrentAccount()
-  const [autoLendEnabledAccountIds, setAutoLendEnabledAccountIds] = useLocalStorage<string[]>(
-    LocalStorageKeys.AUTO_LEND_ENABLED_ACCOUNT_IDS,
-    [],
-  )
+  const [autoLendEnabledAccountIds, setAutoLendEnabledAccountIds] = useAutoLendEnabledAccountIds()
 
   const enableAutoLend = (accountId: string) => {
     const setOfAccountIds = new Set(autoLendEnabledAccountIds)
diff --git a/src/hooks/useBorrowAsset.ts b/src/hooks/useBorrowAsset.ts
index a6f7b9eb..99807ae8 100644
--- a/src/hooks/useBorrowAsset.ts
+++ b/src/hooks/useBorrowAsset.ts
@@ -1,4 +1,4 @@
-import useMarketBorrowings from 'hooks/useMarketBorrowings'
+import useMarketBorrowings from 'hooks/markets/useMarketBorrowings'
 import { byDenom } from 'utils/array'
 
 export default function useBorrowAsset(denom: string) {
diff --git a/src/hooks/useBorrowEnabledMarkets.ts b/src/hooks/useBorrowEnabledMarkets.ts
index 27e1bc09..450fafe6 100644
--- a/src/hooks/useBorrowEnabledMarkets.ts
+++ b/src/hooks/useBorrowEnabledMarkets.ts
@@ -1,6 +1,8 @@
-import useMarketAssets from 'hooks/useMarketAssets'
+import { useMemo } from 'react'
+
+import useMarketAssets from 'hooks/markets/useMarketAssets'
 
 export default function useBorrowEnabledMarkets() {
   const { data: markets } = useMarketAssets()
-  return markets.filter((market) => market.borrowEnabled)
+  return useMemo(() => markets.filter((market) => market.borrowEnabled), [markets])
 }
diff --git a/src/hooks/useBorrowMarketAssetsTableData.ts b/src/hooks/useBorrowMarketAssetsTableData.ts
index a0d0c0a0..b22b4e36 100644
--- a/src/hooks/useBorrowMarketAssetsTableData.ts
+++ b/src/hooks/useBorrowMarketAssetsTableData.ts
@@ -1,60 +1,55 @@
-import useSWR from 'swr'
+import { useMemo } from 'react'
 
+import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import useMarketBorrowings from 'hooks/markets/useMarketBorrowings'
+import useMarketDeposits from 'hooks/markets/useMarketDeposits'
+import useMarketLiquidities from 'hooks/markets/useMarketLiquidities'
 import useBorrowEnabledMarkets from 'hooks/useBorrowEnabledMarkets'
-import useCurrentAccountDebts from 'hooks/useCurrentAccountDebts'
-import useMarketBorrowings from 'hooks/useMarketBorrowings'
-import useMarketDeposits from 'hooks/useMarketDeposits'
-import useMarketLiquidities from 'hooks/useMarketLiquidities'
 import { byDenom } from 'utils/array'
-import { getAssetByDenom } from 'utils/assets'
 import { BN } from 'utils/helpers'
 
-export default function useBorrowMarketAssetsTableData(suspense = true) {
+export default function useBorrowMarketAssetsTableData() {
   const markets = useBorrowEnabledMarkets()
-  const accountDebts = useCurrentAccountDebts()
+  const account = useCurrentAccount()
   const { data: borrowData } = useMarketBorrowings()
   const { data: marketDeposits } = useMarketDeposits()
   const { data: marketLiquidities } = useMarketLiquidities()
+  const assets = useAllAssets()
 
-  return useSWR(
-    'borrowMarketAssetsTableData',
-    async (): Promise<{
-      accountBorrowedAssets: BorrowMarketTableData[]
-      availableAssets: BorrowMarketTableData[]
-      allAssets: BorrowMarketTableData[]
-    }> => {
-      const accountBorrowedAssets: BorrowMarketTableData[] = [],
-        availableAssets: BorrowMarketTableData[] = []
+  return useMemo((): {
+    accountBorrowedAssets: BorrowMarketTableData[]
+    availableAssets: BorrowMarketTableData[]
+    allAssets: BorrowMarketTableData[]
+  } => {
+    const accountBorrowedAssets: BorrowMarketTableData[] = [],
+      availableAssets: BorrowMarketTableData[] = []
 
-      markets.forEach(({ denom, apy, ltv }) => {
-        const asset = getAssetByDenom(denom) as Asset
-        const borrow = borrowData.find((borrow) => borrow.denom === denom)
-        const marketDepositAmount = BN(marketDeposits.find(byDenom(denom))?.amount ?? 0)
-        const marketLiquidityAmount = BN(marketLiquidities.find(byDenom(denom))?.amount ?? 0)
+    markets.forEach(({ denom, apy, ltv }) => {
+      const asset = assets.find(byDenom(denom)) as Asset
+      const borrow = borrowData.find((borrow) => borrow.denom === denom)
+      const marketDepositAmount = BN(marketDeposits.find(byDenom(denom))?.amount ?? 0)
+      const marketLiquidityAmount = BN(marketLiquidities.find(byDenom(denom))?.amount ?? 0)
 
-        const debt = accountDebts?.find((debt) => debt.denom === denom)
-        if (!borrow) return
+      const debt = account?.debts?.find((debt) => debt.denom === denom)
+      if (!borrow) return
 
-        const borrowMarketAsset: BorrowMarketTableData = {
-          ...borrow,
-          asset,
-          debt: debt?.amount,
-          marketDepositAmount,
-          marketLiquidityAmount,
-          apy,
-          ltv,
-        }
-        ;(borrowMarketAsset.debt ? accountBorrowedAssets : availableAssets).push(borrowMarketAsset)
-      })
-
-      return {
-        accountBorrowedAssets,
-        availableAssets,
-        allAssets: [...accountBorrowedAssets, ...availableAssets],
+      const borrowMarketAsset: BorrowMarketTableData = {
+        ...borrow,
+        asset,
+        debt: debt?.amount,
+        marketDepositAmount,
+        marketLiquidityAmount,
+        apy,
+        ltv,
       }
-    },
-    {
-      suspense,
-    },
-  )
+      ;(borrowMarketAsset.debt ? accountBorrowedAssets : availableAssets).push(borrowMarketAsset)
+    })
+
+    return {
+      accountBorrowedAssets,
+      availableAssets,
+      allAssets: [...accountBorrowedAssets, ...availableAssets],
+    }
+  }, [account?.debts, assets, borrowData, marketDeposits, marketLiquidities, markets])
 }
diff --git a/src/hooks/useChainConfig.ts b/src/hooks/useChainConfig.ts
new file mode 100644
index 00000000..dafc59d8
--- /dev/null
+++ b/src/hooks/useChainConfig.ts
@@ -0,0 +1,8 @@
+import chains from 'configs/chains'
+import { getCurrentChainId } from 'utils/getCurrentChainId'
+
+export default function useChainConfig() {
+  const chainId = getCurrentChainId()
+
+  return chains[chainId]
+}
diff --git a/src/hooks/useClients.ts b/src/hooks/useClients.ts
new file mode 100644
index 00000000..7f2e60e9
--- /dev/null
+++ b/src/hooks/useClients.ts
@@ -0,0 +1,42 @@
+import { CosmWasmClient } from '@cosmjs/cosmwasm-stargate'
+import useSWR from 'swr'
+
+import useChainConfig from 'hooks/useChainConfig'
+import { MarsAccountNftQueryClient } from 'types/generated/mars-account-nft/MarsAccountNft.client'
+import { MarsCreditManagerQueryClient } from 'types/generated/mars-credit-manager/MarsCreditManager.client'
+import { MarsIncentivesQueryClient } from 'types/generated/mars-incentives/MarsIncentives.client'
+import { MarsOracleOsmosisQueryClient } from 'types/generated/mars-oracle-osmosis/MarsOracleOsmosis.client'
+import { MarsParamsQueryClient } from 'types/generated/mars-params/MarsParams.client'
+import { MarsPerpsQueryClient } from 'types/generated/mars-perps/MarsPerps.client'
+import { MarsRedBankQueryClient } from 'types/generated/mars-red-bank/MarsRedBank.client'
+import { MarsSwapperOsmosisQueryClient } from 'types/generated/mars-swapper-osmosis/MarsSwapperOsmosis.client'
+
+export default function useClients() {
+  const chainConfig = useChainConfig()
+
+  const swr = useSWR(
+    `chains/${chainConfig.id}/clients`,
+    async () => {
+      const client = await CosmWasmClient.connect(chainConfig.endpoints.rpc)
+
+      return {
+        creditManager: new MarsCreditManagerQueryClient(
+          client,
+          chainConfig.contracts.creditManager,
+        ),
+        accountNft: new MarsAccountNftQueryClient(client, chainConfig.contracts.accountNft),
+        oracle: new MarsOracleOsmosisQueryClient(client, chainConfig.contracts.oracle),
+        params: new MarsParamsQueryClient(client, chainConfig.contracts.params),
+        redBank: new MarsRedBankQueryClient(client, chainConfig.contracts.redBank),
+        swapper: new MarsSwapperOsmosisQueryClient(client, chainConfig.contracts.swapper),
+        incentives: new MarsIncentivesQueryClient(client, chainConfig.contracts.incentives),
+        perps: new MarsPerpsQueryClient(client, chainConfig.contracts.perps),
+      } as ContractClients
+    },
+    {
+      keepPreviousData: false,
+    },
+  )
+
+  return swr.data
+}
diff --git a/src/hooks/useCurrentAccount.tsx b/src/hooks/useCurrentAccount.tsx
deleted file mode 100644
index 0d747ec8..00000000
--- a/src/hooks/useCurrentAccount.tsx
+++ /dev/null
@@ -1,9 +0,0 @@
-import useAccountId from 'hooks/useAccountId'
-import useStore from 'store'
-
-export default function useCurrentAccount(): Account | undefined {
-  const accountId = useAccountId()
-
-  const accounts = useStore((s) => s.accounts)
-  return accounts?.find((account) => account.id === accountId)
-}
diff --git a/src/hooks/useCurrentAccountDebts.ts b/src/hooks/useCurrentAccountDebts.ts
deleted file mode 100644
index 7b741d8d..00000000
--- a/src/hooks/useCurrentAccountDebts.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-import useCurrentAccount from 'hooks/useCurrentAccount'
-
-export default function useCurrentAccountDebts() {
-  const account = useCurrentAccount()
-  return account?.debts ?? []
-}
diff --git a/src/hooks/useCurrentAccountDeposits.ts b/src/hooks/useCurrentAccountDeposits.ts
index 1b8c5c24..1cdd1aee 100644
--- a/src/hooks/useCurrentAccountDeposits.ts
+++ b/src/hooks/useCurrentAccountDeposits.ts
@@ -1,4 +1,4 @@
-import useCurrentAccount from 'hooks/useCurrentAccount'
+import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
 
 export default function useCurrentAccountDeposits() {
   const account = useCurrentAccount()
diff --git a/src/hooks/useCurrentAccountLends.ts b/src/hooks/useCurrentAccountLends.ts
index 548357bb..cc4c6c09 100644
--- a/src/hooks/useCurrentAccountLends.ts
+++ b/src/hooks/useCurrentAccountLends.ts
@@ -1,4 +1,4 @@
-import useCurrentAccount from 'hooks/useCurrentAccount'
+import useCurrentAccount from 'hooks/accounts/useCurrentAccount'
 
 export default function useCurrentAccountLends() {
   const account = useCurrentAccount()
diff --git a/src/hooks/useCurrentWallet.ts b/src/hooks/useCurrentWallet.ts
index af76c2d7..6892218f 100644
--- a/src/hooks/useCurrentWallet.ts
+++ b/src/hooks/useCurrentWallet.ts
@@ -1,11 +1,11 @@
 import { useShuttle } from '@delphi-labs/shuttle-react'
 import { useMemo } from 'react'
 
-import { ENV } from 'constants/env'
+import { getCurrentChainId } from 'utils/getCurrentChainId'
 
 export default function useCurrentWallet() {
   const { wallets } = useShuttle()
-  const chainId = ENV.CHAIN_ID
+  const chainId = getCurrentChainId()
 
   return useMemo(() => {
     return wallets.find((wallet) => wallet.network.chainId === chainId)
diff --git a/src/hooks/useDebounce.ts b/src/hooks/useDebounce.ts
new file mode 100644
index 00000000..7a14a0c2
--- /dev/null
+++ b/src/hooks/useDebounce.ts
@@ -0,0 +1,17 @@
+import { useEffect, useState } from 'react'
+
+export default function useDebounce<T>(value: T, delay: number) {
+  const [debouncedValue, setDebouncedValue] = useState(value)
+
+  useEffect(() => {
+    const handler = setTimeout(() => {
+      setDebouncedValue(value)
+    }, delay)
+
+    return () => {
+      clearTimeout(handler)
+    }
+  }, [value, delay])
+
+  return debouncedValue
+}
diff --git a/src/hooks/useDepositEnabledMarkets.ts b/src/hooks/useDepositEnabledMarkets.ts
index 6a6a7522..5313d41b 100644
--- a/src/hooks/useDepositEnabledMarkets.ts
+++ b/src/hooks/useDepositEnabledMarkets.ts
@@ -1,4 +1,4 @@
-import useMarketAssets from 'hooks/useMarketAssets'
+import useMarketAssets from 'hooks/markets/useMarketAssets'
 
 export default function useDepositEnabledMarkets() {
   const { data: markets } = useMarketAssets()
diff --git a/src/hooks/useDepositHlsVault.ts b/src/hooks/useDepositHlsVault.ts
index 11c145ea..e8353573 100644
--- a/src/hooks/useDepositHlsVault.ts
+++ b/src/hooks/useDepositHlsVault.ts
@@ -3,7 +3,8 @@ import { useMemo, useState } from 'react'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
 import { BN_ZERO } from 'constants/math'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import usePrices from 'hooks/usePrices'
 import useSwapValueLoss from 'hooks/useSwapValueLoss'
 import { BNCoin } from 'types/classes/BNCoin'
@@ -18,7 +19,7 @@ interface Props {
 export default function useDepositHlsVault(props: Props) {
   const { data: prices } = usePrices()
   const [slippage] = useLocalStorage<number>(LocalStorageKeys.SLIPPAGE, DEFAULT_SETTINGS.slippage)
-
+  const assets = useAllAssets()
   const { data: valueLossPercentage } = useSwapValueLoss(props.borrowDenom, props.collateralDenom)
 
   const [depositAmount, setDepositAmount] = useState<BigNumber>(BN_ZERO)
@@ -38,10 +39,12 @@ export default function useDepositHlsVault(props: Props) {
     const collateralValue = getCoinValue(
       BNCoin.fromDenomAndBigNumber(props.collateralDenom, depositAmount),
       prices,
+      assets,
     )
     const borrowValue = getCoinValue(
       BNCoin.fromDenomAndBigNumber(props.borrowDenom, borrowAmount),
       prices,
+      assets,
     )
 
     return {
@@ -61,6 +64,7 @@ export default function useDepositHlsVault(props: Props) {
     props.borrowDenom,
     depositAmount,
     prices,
+    assets,
     borrowAmount,
     valueLossPercentage,
   ])
diff --git a/src/hooks/useDepositedVaults.ts b/src/hooks/useDepositedVaults.ts
index 0d320918..8e52c9b3 100644
--- a/src/hooks/useDepositedVaults.ts
+++ b/src/hooks/useDepositedVaults.ts
@@ -1,10 +1,16 @@
 import useSWR from 'swr'
 
 import getDepositedVaults from 'api/vaults/getDepositedVaults'
+import useChainConfig from 'hooks/useChainConfig'
 
 export default function useDepositedVaults(accountId: string) {
-  return useSWR(`depositedVaultsByAccount-${accountId}`, () => getDepositedVaults(accountId), {
-    suspense: true,
-    revalidateOnFocus: false,
-  })
+  const chainConfig = useChainConfig()
+  return useSWR(
+    `chains/${chainConfig.id}/vaults/${accountId}/deposited`,
+    () => getDepositedVaults(accountId, chainConfig),
+    {
+      suspense: true,
+      revalidateOnFocus: false,
+    },
+  )
 }
diff --git a/src/hooks/useDisplayAsset.tsx b/src/hooks/useDisplayAsset.tsx
index 5a9dd65b..ac74f706 100644
--- a/src/hooks/useDisplayAsset.tsx
+++ b/src/hooks/useDisplayAsset.tsx
@@ -1,14 +1,10 @@
-import { ASSETS } from 'constants/assets'
-import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
-import { LocalStorageKeys } from 'constants/localStorageKeys'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useDisplayCurrencyAssets from 'hooks/assets/useDisplayCurrencyAssets'
+import useDisplayCurrency from 'hooks/localStorage/useDisplayCurrency'
 import { byDenom } from 'utils/array'
 
 export default function useDisplayAsset() {
-  const [displayCurrency] = useLocalStorage<string>(
-    LocalStorageKeys.DISPLAY_CURRENCY,
-    DEFAULT_SETTINGS.displayCurrency,
-  )
+  const assets = useDisplayCurrencyAssets()
+  const [displayCurrency] = useDisplayCurrency()
 
-  return ASSETS.find(byDenom(displayCurrency)) ?? ASSETS[0]
+  return assets.find(byDenom(displayCurrency)) ?? assets[0]
 }
diff --git a/src/hooks/useDisplayCurrencyPrice.ts b/src/hooks/useDisplayCurrencyPrice.ts
index d4b5387f..17bf08bb 100644
--- a/src/hooks/useDisplayCurrencyPrice.ts
+++ b/src/hooks/useDisplayCurrencyPrice.ts
@@ -1,21 +1,16 @@
 import { useCallback, useMemo } from 'react'
 
-import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
-import { LocalStorageKeys } from 'constants/localStorageKeys'
 import { BN_ZERO } from 'constants/math'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useDisplayCurrencyAssets from 'hooks/assets/useDisplayCurrencyAssets'
+import useDisplayCurrency from 'hooks/localStorage/useDisplayCurrency'
 import usePrices from 'hooks/usePrices'
 import { byDenom } from 'utils/array'
-import { getDisplayCurrencies } from 'utils/assets'
 import { BN } from 'utils/helpers'
 
 function useDisplayCurrencyPrice() {
   const { data: prices } = usePrices()
-  const displayCurrencies = getDisplayCurrencies()
-  const [displayCurrency] = useLocalStorage<string>(
-    LocalStorageKeys.DISPLAY_CURRENCY,
-    DEFAULT_SETTINGS.displayCurrency,
-  )
+  const displayCurrencies = useDisplayCurrencyAssets()
+  const [displayCurrency] = useDisplayCurrency()
 
   const displayCurrencyAsset = useMemo(
     () =>
diff --git a/src/hooks/useFilteredAssets.ts b/src/hooks/useFilteredAssets.ts
index 2bf1ec18..cb714ff5 100644
--- a/src/hooks/useFilteredAssets.ts
+++ b/src/hooks/useFilteredAssets.ts
@@ -1,21 +1,17 @@
 import { useCallback, useMemo, useState } from 'react'
 
-import useAssets from 'hooks/useAssets'
-
-export default function useFilteredAssets() {
+export default function useFilteredAssets(assets: Asset[]) {
   const [searchString, setSearchString] = useState('')
 
-  const allAssets = useAssets()
-
-  const assets = useMemo(
+  const filteredAssets = useMemo(
     () =>
-      allAssets.filter(
+      assets.filter(
         (asset) =>
           asset.denom.toLocaleLowerCase().includes(searchString.toLowerCase()) ||
           asset.symbol.toLocaleLowerCase().includes(searchString.toLowerCase()) ||
           asset.name.toLocaleLowerCase().includes(searchString.toLowerCase()),
       ),
-    [searchString, allAssets],
+    [searchString, assets],
   )
 
   const onChangeSearch = useCallback(
@@ -25,5 +21,5 @@ export default function useFilteredAssets() {
     [setSearchString],
   )
 
-  return { assets, searchString, onChangeSearch }
+  return { assets: filteredAssets, searchString, onChangeSearch }
 }
diff --git a/src/hooks/useHLSStakingAccounts.tsx b/src/hooks/useHLSStakingAccounts.tsx
index 7febbed5..5427c670 100644
--- a/src/hooks/useHLSStakingAccounts.tsx
+++ b/src/hooks/useHLSStakingAccounts.tsx
@@ -1,11 +1,18 @@
 import useSWR from 'swr'
 
 import getHLSStakingAccounts from 'api/hls/getHLSStakingAccounts'
+import useChainConfig from 'hooks/useChainConfig'
 
 export default function useHLSStakingAccounts(address?: string) {
-  return useSWR(`${address}/hlsStakingAccounts`, () => getHLSStakingAccounts(address), {
-    fallbackData: [],
-    suspense: true,
-    revalidateOnFocus: false,
-  })
+  const chainConfig = useChainConfig()
+
+  return useSWR(
+    `${address}/hlsStakingAccounts`,
+    () => getHLSStakingAccounts(chainConfig, address),
+    {
+      fallbackData: [],
+      suspense: true,
+      revalidateOnFocus: false,
+    },
+  )
 }
diff --git a/src/hooks/useHLSStakingAssets.ts b/src/hooks/useHLSStakingAssets.ts
index b7e55603..ca57f47a 100644
--- a/src/hooks/useHLSStakingAssets.ts
+++ b/src/hooks/useHLSStakingAssets.ts
@@ -1,9 +1,11 @@
 import useSWR from 'swr'
 
 import getHLSStakingAssets from 'api/hls/getHLSStakingAssets'
+import useChainConfig from 'hooks/useChainConfig'
 
 export default function useHLSStakingAssets() {
-  return useSWR('hls-staking', getHLSStakingAssets, {
+  const chainConfig = useChainConfig()
+  return useSWR('hls-staking', () => getHLSStakingAssets(chainConfig), {
     fallbackData: [],
     revalidateOnFocus: false,
   })
diff --git a/src/hooks/useHLSVaults.ts b/src/hooks/useHLSVaults.ts
index 42106fc6..ed308531 100644
--- a/src/hooks/useHLSVaults.ts
+++ b/src/hooks/useHLSVaults.ts
@@ -1,9 +1,11 @@
 import useSWR from 'swr'
 
 import getHLSVaults from 'api/hls/getHLSVaults'
+import useChainConfig from 'hooks/useChainConfig'
 
 export default function useHLSVaults() {
-  return useSWR('hls-vaults', getHLSVaults, {
+  const chainConfig = useChainConfig()
+  return useSWR('hls-vaults', () => getHLSVaults(chainConfig), {
     fallbackData: [],
     revalidateOnFocus: false,
   })
diff --git a/src/hooks/useHealthComputer.tsx b/src/hooks/useHealthComputer.tsx
index 82835f8e..03a9827d 100644
--- a/src/hooks/useHealthComputer.tsx
+++ b/src/hooks/useHealthComputer.tsx
@@ -4,21 +4,19 @@ import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
 import { BN_ZERO } from 'constants/math'
 import { PRICE_ORACLE_DECIMALS } from 'constants/query'
-import useAssetParams from 'hooks/useAssetParams'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
+import useAssetParams from 'hooks/params/useAssetParams'
 import usePrices from 'hooks/usePrices'
 import useVaultConfigs from 'hooks/useVaultConfigs'
-import {
-  Positions,
-  VaultPositionValue,
-} from 'types/generated/mars-credit-manager/MarsCreditManager.types'
+import { VaultPositionValue } from 'types/generated/mars-credit-manager/MarsCreditManager.types'
 import { VaultConfigBaseForString } from 'types/generated/mars-params/MarsParams.types'
 import {
   AssetParamsBaseForAddr,
   HealthComputer,
 } from 'types/generated/mars-rover-health-computer/MarsRoverHealthComputer.types'
 import { convertAccountToPositions } from 'utils/accounts'
-import { getAssetByDenom } from 'utils/assets'
+import { byDenom } from 'utils/array'
 import { SWAP_FEE_BUFFER } from 'utils/constants'
 import {
   BorrowTarget,
@@ -37,13 +35,14 @@ import { BN } from 'utils/helpers'
 const VALUE_SCALE_FACTOR = 14
 
 export default function useHealthComputer(account?: Account) {
+  const assets = useAllAssets()
   const { data: prices } = usePrices()
   const { data: assetParams } = useAssetParams()
   const { data: vaultConfigs } = useVaultConfigs()
   const [slippage] = useLocalStorage<number>(LocalStorageKeys.SLIPPAGE, DEFAULT_SETTINGS.slippage)
 
   const [healthFactor, setHealthFactor] = useState(0)
-  const positions: Positions | null = useMemo(() => {
+  const positions: PositionsWithoutPerps | null = useMemo(() => {
     if (!account) return null
     return convertAccountToPositions(account)
   }, [account])
@@ -82,7 +81,7 @@ export default function useHealthComputer(account?: Account) {
   const priceData = useMemo(() => {
     return prices.reduce(
       (prev, curr) => {
-        const decimals = getAssetByDenom(curr.denom)?.decimals || 6
+        const decimals = assets.find(byDenom(curr.denom))?.decimals || 6
 
         // The HealthComputer needs prices expressed per 1 amount. So we need to correct here for any additional decimals.
         prev[curr.denom] = curr.amount
@@ -93,7 +92,7 @@ export default function useHealthComputer(account?: Account) {
       },
       {} as { [key: string]: string },
     )
-  }, [prices])
+  }, [assets, prices])
 
   const denomsData = useMemo(
     () =>
@@ -109,7 +108,7 @@ export default function useHealthComputer(account?: Account) {
   )
 
   const vaultConfigsData = useMemo(() => {
-    if (!vaultConfigs.length) return null
+    if (!vaultConfigs.length) return {}
 
     return vaultConfigs.reduce(
       (prev, curr) => {
@@ -133,14 +132,17 @@ export default function useHealthComputer(account?: Account) {
       return null
 
     return {
-      denoms_data: { params: denomsData, prices: priceData },
+      kind: account.kind,
       vaults_data: {
         vault_configs: vaultConfigsData,
         vault_values: vaultPositionValues,
       },
+      denoms_data: {
+        params: denomsData,
+        prices: priceData,
+      },
       positions: positions,
-      kind: account.kind,
-    }
+    } as HealthComputer
   }, [account, positions, vaultPositionValues, vaultConfigsData, denomsData, priceData])
 
   useEffect(() => {
@@ -202,7 +204,7 @@ export default function useHealthComputer(account?: Account) {
     (denom: string, kind: LiquidationPriceKind) => {
       if (!healthComputer) return null
       try {
-        const asset = getAssetByDenom(denom)
+        const asset = assets.find(byDenom(denom))
         if (!asset) return null
         const decimalDiff = asset.decimals - PRICE_ORACLE_DECIMALS
         return BN(liquidation_price_js(healthComputer, denom, kind))
@@ -213,7 +215,7 @@ export default function useHealthComputer(account?: Account) {
         return null
       }
     },
-    [healthComputer],
+    [assets, healthComputer],
   )
 
   const health = useMemo(() => {
diff --git a/src/hooks/useICNSDomain.tsx b/src/hooks/useICNSDomain.tsx
index 5b8d30c6..7080edf2 100644
--- a/src/hooks/useICNSDomain.tsx
+++ b/src/hooks/useICNSDomain.tsx
@@ -1,9 +1,12 @@
 import useSWR from 'swr'
 
 import getICNS from 'api/wallets/getICNS'
+import useChainConfig from 'hooks/useChainConfig'
 
 export default function useICNSDomain(address?: string) {
-  return useSWR(`ICNS-${address}`, () => getICNS(address), {
+  const chainConfig = useChainConfig()
+
+  return useSWR(`ICNS-${address}`, () => getICNS(chainConfig, address), {
     revalidateOnFocus: false,
   })
 }
diff --git a/src/hooks/useLendingMarketAssetsTableData.ts b/src/hooks/useLendingMarketAssetsTableData.ts
index 2d1c6cc5..4badcd68 100644
--- a/src/hooks/useLendingMarketAssetsTableData.ts
+++ b/src/hooks/useLendingMarketAssetsTableData.ts
@@ -1,12 +1,13 @@
 import { useMemo } from 'react'
 
+import { BN_ZERO } from 'constants/math'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import useMarketDeposits from 'hooks/markets/useMarketDeposits'
+import useMarketLiquidities from 'hooks/markets/useMarketLiquidities'
 import useCurrentAccountLends from 'hooks/useCurrentAccountLends'
 import useDepositEnabledMarkets from 'hooks/useDepositEnabledMarkets'
 import useDisplayCurrencyPrice from 'hooks/useDisplayCurrencyPrice'
-import useMarketDeposits from 'hooks/useMarketDeposits'
-import useMarketLiquidities from 'hooks/useMarketLiquidities'
 import { byDenom } from 'utils/array'
-import { getAssetByDenom } from 'utils/assets'
 import { BN } from 'utils/helpers'
 
 function useLendingMarketAssetsTableData(): {
@@ -19,16 +20,17 @@ function useLendingMarketAssetsTableData(): {
   const { data: marketLiquidities } = useMarketLiquidities()
   const { data: marketDeposits } = useMarketDeposits()
   const { convertAmount } = useDisplayCurrencyPrice()
+  const assets = useAllAssets()
 
   return useMemo(() => {
     const accountLentAssets: LendingMarketTableData[] = [],
       availableAssets: LendingMarketTableData[] = []
 
     markets.forEach(({ denom, cap, ltv, apy, borrowEnabled }) => {
-      const asset = getAssetByDenom(denom) as Asset
+      const asset = assets.find(byDenom(denom)) as Asset
       const marketDepositAmount = BN(marketDeposits.find(byDenom(denom))?.amount ?? 0)
       const marketLiquidityAmount = BN(marketLiquidities.find(byDenom(denom))?.amount ?? 0)
-      const accountLentAmount = accountLentAmounts.find(byDenom(denom))?.amount
+      const accountLentAmount = accountLentAmounts.find(byDenom(denom))?.amount ?? BN_ZERO
       const accountLentValue = accountLentAmount
         ? convertAmount(asset, accountLentAmount)
         : undefined
@@ -45,9 +47,11 @@ function useLendingMarketAssetsTableData(): {
         cap,
       }
 
-      ;(lendingMarketAsset.accountLentValue ? accountLentAssets : availableAssets).push(
-        lendingMarketAsset,
-      )
+      if (lendingMarketAsset.accountLentAmount?.isZero()) {
+        availableAssets.push(lendingMarketAsset)
+      } else {
+        accountLentAssets.push(lendingMarketAsset)
+      }
     })
 
     return {
@@ -55,7 +59,7 @@ function useLendingMarketAssetsTableData(): {
       availableAssets,
       allAssets: [...accountLentAssets, ...availableAssets],
     }
-  }, [markets, marketLiquidities, accountLentAmounts, marketDeposits, convertAmount])
+  }, [markets, assets, marketDeposits, marketLiquidities, accountLentAmounts, convertAmount])
 }
 
 export default useLendingMarketAssetsTableData
diff --git a/src/hooks/useMarketAssets.ts b/src/hooks/useMarketAssets.ts
deleted file mode 100644
index ebf4fea6..00000000
--- a/src/hooks/useMarketAssets.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import useSWR from 'swr'
-
-import getMarkets from 'api/markets/getMarkets'
-
-export default function useMarketAssets() {
-  return useSWR(`marketAssets`, getMarkets, {
-    suspense: true,
-    fallbackData: [],
-    revalidateOnFocus: false,
-  })
-}
diff --git a/src/hooks/useMarketBorrowings.tsx b/src/hooks/useMarketBorrowings.tsx
deleted file mode 100644
index b604c549..00000000
--- a/src/hooks/useMarketBorrowings.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import useSWR from 'swr'
-
-import getMarketBorrowings from 'api/markets/getMarketBorrowings'
-
-export default function useMarketBorrowings() {
-  return useSWR(`marketBorrowings`, getMarketBorrowings, {
-    fallbackData: [],
-    suspense: false,
-    revalidateOnFocus: false,
-  })
-}
diff --git a/src/hooks/useMarketLiquidities.ts b/src/hooks/useMarketLiquidities.ts
deleted file mode 100644
index 8bcf8c4f..00000000
--- a/src/hooks/useMarketLiquidities.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import useSWR from 'swr'
-
-import getMarketLiquidities from 'api/markets/getMarketLiquidities'
-
-export default function useMarketLiquidities() {
-  return useSWR(`marketLiquidities`, getMarketLiquidities, {
-    suspense: true,
-    fallbackData: [],
-    revalidateOnFocus: false,
-  })
-}
diff --git a/src/hooks/usePriceData.tsx b/src/hooks/usePriceData.tsx
deleted file mode 100644
index ab362b86..00000000
--- a/src/hooks/usePriceData.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import useSWR from 'swr'
-
-import getPricesData from 'api/prices/getPriceData'
-
-export default function usePricesData() {
-  return useSWR('pricesData', getPricesData, {
-    fallbackData: [],
-    refreshInterval: 30_000,
-    revalidateOnFocus: false,
-  })
-}
diff --git a/src/hooks/usePrices.tsx b/src/hooks/usePrices.tsx
index e816e53a..3ec79b9a 100644
--- a/src/hooks/usePrices.tsx
+++ b/src/hooks/usePrices.tsx
@@ -1,11 +1,15 @@
 import useSWR from 'swr'
 
 import getPrices from 'api/prices/getPrices'
+import useChainConfig from 'hooks/useChainConfig'
 
 export default function usePrices() {
-  return useSWR('prices', getPrices, {
+  const chainConfig = useChainConfig()
+
+  return useSWR(`chains/${chainConfig.id}/prices`, () => getPrices(chainConfig), {
     fallbackData: [],
     refreshInterval: 30_000,
     revalidateOnFocus: false,
+    keepPreviousData: false,
   })
 }
diff --git a/src/hooks/useSwapFee.ts b/src/hooks/useSwapFee.ts
index 15c7c35a..13471f30 100644
--- a/src/hooks/useSwapFee.ts
+++ b/src/hooks/useSwapFee.ts
@@ -1,16 +1,23 @@
 import useSWR from 'swr'
 
-import getSwapFees from 'api/swap/getPools'
-import { BN_ZERO } from 'constants/math'
-
-const STANDARD_SWAP_FEE = 0.002
+import getOsmosisSwapFee from 'api/swap/getOsmosisSwapFee'
+import useChainConfig from 'hooks/useChainConfig'
+import { ChainInfoID } from 'types/enums/wallet'
+import { STANDARD_SWAP_FEE } from 'utils/constants'
 
 export default function useSwapFee(poolIds: string[]) {
-  const { data: pools } = useSWR(`swapFees/${poolIds.join(',')}`, () => getSwapFees(poolIds))
+  const chainConfig = useChainConfig()
+  const { data: swapFee } = useSWR(
+    `chains/${chainConfig.id}/swapFees/${poolIds.join(',')}`,
+    () => {
+      if (chainConfig.id === ChainInfoID.Pion1) {
+        return STANDARD_SWAP_FEE
+      }
 
-  if (!pools?.length) return STANDARD_SWAP_FEE
+      return getOsmosisSwapFee(chainConfig, poolIds)
+    },
+    {},
+  )
 
-  return pools
-    .reduce((acc, pool) => acc.plus(pool?.pool_params?.swap_fee || STANDARD_SWAP_FEE), BN_ZERO)
-    .toNumber()
+  return swapFee ?? STANDARD_SWAP_FEE
 }
diff --git a/src/hooks/useSwapRoute.ts b/src/hooks/useSwapRoute.ts
index 7b8ae3db..5aa8e055 100644
--- a/src/hooks/useSwapRoute.ts
+++ b/src/hooks/useSwapRoute.ts
@@ -1,10 +1,16 @@
 import useSWR from 'swr'
 
 import getSwapRoute from 'api/swap/getSwapRoute'
+import useChainConfig from 'hooks/useChainConfig'
 
 export default function useSwapRoute(denomIn: string, denomOut: string) {
-  return useSWR(`swapRoute-${denomIn}-${denomOut}`, () => getSwapRoute(denomIn, denomOut), {
-    fallbackData: [],
-    revalidateOnFocus: false,
-  })
+  const chainConfig = useChainConfig()
+  return useSWR(
+    `swapRoute-${denomIn}-${denomOut}`,
+    () => getSwapRoute(chainConfig, denomIn, denomOut),
+    {
+      fallbackData: [],
+      revalidateOnFocus: false,
+    },
+  )
 }
diff --git a/src/hooks/useSwapValueLoss.ts b/src/hooks/useSwapValueLoss.ts
index 1e9f2fc0..8367f042 100644
--- a/src/hooks/useSwapValueLoss.ts
+++ b/src/hooks/useSwapValueLoss.ts
@@ -1,6 +1,7 @@
 import useSWR from 'swr'
 
 import estimateExactIn from 'api/swap/estimateExactIn'
+import useChainConfig from 'hooks/useChainConfig'
 import usePrice from 'hooks/usePrice'
 import { BNCoin } from 'types/classes/BNCoin'
 import { SWAP_FEE_BUFFER } from 'utils/constants'
@@ -13,12 +14,14 @@ export default function useSwapValueLoss(
 ) {
   const denomInPrice = usePrice(denomIn)
   const denomOutPrice = usePrice(denomOut)
+  const chainConfig = useChainConfig()
 
   return useSWR(
     `swapValueLoss/${denomIn}/${denomOut}/${amount}`,
     async () => {
       const valueIn = denomInPrice.times(amount)
       const amountOut = await estimateExactIn(
+        chainConfig,
         BNCoin.fromDenomAndBigNumber(denomIn, BN(amount)).toCoin(),
         denomOut,
       )
diff --git a/src/hooks/useTransactionStore.ts b/src/hooks/useTransactionStore.ts
index 8a3cd736..25c075f5 100644
--- a/src/hooks/useTransactionStore.ts
+++ b/src/hooks/useTransactionStore.ts
@@ -1,16 +1,10 @@
-import { LocalStorageKeys } from 'constants/localStorageKeys'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useTransactions from 'hooks/localStorage/useTransactions'
 
 export default function useTransactionStore(): {
   transactions: ToastStore
   addTransaction: (transaction: ToastSuccess) => void
 } {
-  const [transactions, setTransactions] = useLocalStorage<ToastStore>(
-    LocalStorageKeys.TRANSACTIONS,
-    {
-      recent: [],
-    },
-  )
+  const [transactions, setTransactions] = useTransactions()
   const recentTransactions = transactions.recent
   const addTransaction = (transaction: ToastSuccess) => {
     recentTransactions.push(transaction)
diff --git a/src/hooks/useUnclaimedRewards.tsx b/src/hooks/useUnclaimedRewards.tsx
index 50de06c3..ddf9f1cd 100644
--- a/src/hooks/useUnclaimedRewards.tsx
+++ b/src/hooks/useUnclaimedRewards.tsx
@@ -2,14 +2,20 @@ import useSWR from 'swr'
 
 import getUnclaimedRewards from 'api/incentives/getUnclaimedRewards'
 import useAccountId from 'hooks/useAccountId'
+import useChainConfig from 'hooks/useChainConfig'
 import { BNCoin } from 'types/classes/BNCoin'
 
 export default function useUserUnclaimedRewards() {
   const accountId = useAccountId()
+  const chainConfig = useChainConfig()
 
-  return useSWR(`userUnclaimedRewards-${accountId}`, () => getUnclaimedRewards(accountId ?? ''), {
-    fallbackData: [] as BNCoin[],
-    isPaused: () => !accountId,
-    revalidateOnFocus: false,
-  })
+  return useSWR(
+    `chains/${chainConfig.id}/accounts/${accountId}/unclaimed-rewards`,
+    () => getUnclaimedRewards(chainConfig, accountId ?? ''),
+    {
+      fallbackData: [] as BNCoin[],
+      isPaused: () => !accountId,
+      revalidateOnFocus: false,
+    },
+  )
 }
diff --git a/src/hooks/useUpdatedAccount/functions.ts b/src/hooks/useUpdatedAccount/functions.ts
index 9770d750..5c7c9f0d 100644
--- a/src/hooks/useUpdatedAccount/functions.ts
+++ b/src/hooks/useUpdatedAccount/functions.ts
@@ -4,7 +4,6 @@ import { VaultValue } from 'hooks/useUpdatedAccount'
 import { BNCoin } from 'types/classes/BNCoin'
 import { byDenom } from 'utils/array'
 import { BN } from 'utils/helpers'
-import { getVaultMetaData } from 'utils/vaults'
 
 export function addCoins(additionalCoins: BNCoin[], currentCoins: BNCoin[]) {
   const currentDenoms = currentCoins.map((coin) => coin.denom)
@@ -52,14 +51,14 @@ export function addValueToVaults(
       vaults[index].values.primary = BN(vaults[index].values.primary).plus(halfValue)
       vaults[index].values.secondary = BN(vaults[index].values.secondary).plus(halfValue)
     } else {
-      const vaultMetaData = getVaultMetaData(vaultValue.address)
+      const vault = vaults.find((vault) => vault.address)
 
-      if (!vaultMetaData) return
+      if (!vault) return
       const apy = availableVaults.find((vault) => vault.address === vaultValue.address)?.apy ?? null
       const apr = availableVaults.find((vault) => vault.address === vaultValue.address)?.apr ?? null
 
       vaults.push({
-        ...vaultMetaData,
+        ...vault,
         ...MOCK_DEPOSITED_VAULT_POSITION,
         apy,
         apr,
diff --git a/src/hooks/useUpdatedAccount/index.ts b/src/hooks/useUpdatedAccount/index.ts
index 6fdcdc39..1c44e492 100644
--- a/src/hooks/useUpdatedAccount/index.ts
+++ b/src/hooks/useUpdatedAccount/index.ts
@@ -3,7 +3,8 @@ import { useCallback, useEffect, useState } from 'react'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
 import { BN_ZERO } from 'constants/math'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useAllAssets from 'hooks/assets/useAllAssets'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import usePrices from 'hooks/usePrices'
 import {
   addCoins,
@@ -28,6 +29,7 @@ export interface VaultValue {
 export function useUpdatedAccount(account?: Account) {
   const { data: availableVaults } = useVaults(false)
   const { data: prices } = usePrices()
+  const assets = useAllAssets()
   const [updatedAccount, setUpdatedAccount] = useState<Account | undefined>(
     account ? cloneAccount(account) : undefined,
   )
@@ -182,26 +184,35 @@ export function useUpdatedAccount(account?: Account) {
     (depositCoin: BNCoin, borrowCoin: BNCoin) => {
       addDeposits([depositCoin])
       addDebts([borrowCoin])
-      const additionalDebtValue = getCoinValue(borrowCoin, prices)
+      const additionalDebtValue = getCoinValue(borrowCoin, prices, assets)
 
-      const tradeOutputAmount = getCoinAmount(depositCoin.denom, additionalDebtValue, prices)
+      const tradeOutputAmount = getCoinAmount(
+        depositCoin.denom,
+        additionalDebtValue,
+        prices,
+        assets,
+      )
         .times(1 - SWAP_FEE_BUFFER)
         .integerValue()
       addTrades([BNCoin.fromDenomAndBigNumber(depositCoin.denom, tradeOutputAmount)])
     },
-    [prices],
+    [assets, prices],
   )
 
   const simulateHlsStakingWithdraw = useCallback(
     (collateralDenom: string, debtDenom: string, repayAmount: BigNumber) => {
-      const repayValue = getCoinValue(BNCoin.fromDenomAndBigNumber(debtDenom, repayAmount), prices)
-      const removeDepositAmount = getCoinAmount(collateralDenom, repayValue, prices)
+      const repayValue = getCoinValue(
+        BNCoin.fromDenomAndBigNumber(debtDenom, repayAmount),
+        prices,
+        assets,
+      )
+      const removeDepositAmount = getCoinAmount(collateralDenom, repayValue, prices, assets)
         .times(1 + slippage)
         .integerValue()
       removeDeposits([BNCoin.fromDenomAndBigNumber(collateralDenom, removeDepositAmount)])
       removeDebts([BNCoin.fromDenomAndBigNumber(debtDenom, repayAmount)])
     },
-    [prices, slippage],
+    [assets, prices, slippage],
   )
 
   const simulateVaultDeposit = useCallback(
@@ -222,10 +233,12 @@ export function useUpdatedAccount(account?: Account) {
       addDebts(borrowCoins)
 
       // Value has to be adjusted for slippage
-      const value = getValueFromBNCoins([...coins, ...borrowCoins], prices).times(1 - slippage)
+      const value = getValueFromBNCoins([...coins, ...borrowCoins], prices, assets).times(
+        1 - slippage,
+      )
       addVaultValues([{ address, value }])
     },
-    [account, prices, slippage],
+    [account, assets, prices, slippage],
   )
 
   useEffect(() => {
@@ -244,7 +257,7 @@ export function useUpdatedAccount(account?: Account) {
     accountCopy.lends = addCoins(addedLends, [...accountCopy.lends])
     accountCopy.lends = removeCoins(removedLends, [...accountCopy.lends])
     setUpdatedAccount(accountCopy)
-    setLeverage(calculateAccountLeverage(accountCopy, prices).toNumber())
+    setLeverage(calculateAccountLeverage(accountCopy, prices, assets).toNumber())
     useStore.setState({ updatedAccount: accountCopy })
 
     return () => useStore.setState({ updatedAccount: undefined })
@@ -260,6 +273,7 @@ export function useUpdatedAccount(account?: Account) {
     availableVaults,
     prices,
     addedTrades,
+    assets,
   ])
 
   return {
diff --git a/src/hooks/useVaultConfigs.tsx b/src/hooks/useVaultConfigs.tsx
index a3eb88b2..638ea916 100644
--- a/src/hooks/useVaultConfigs.tsx
+++ b/src/hooks/useVaultConfigs.tsx
@@ -1,9 +1,11 @@
 import useSWR from 'swr'
 
 import { getVaultConfigs } from 'api/vaults/getVaultConfigs'
+import useChainConfig from 'hooks/useChainConfig'
 
 export default function useVaultConfigs() {
-  return useSWR('vaultConfigs', getVaultConfigs, {
+  const chainConfig = useChainConfig()
+  return useSWR(`chains/${chainConfig.id}/vaultConfigs`, () => getVaultConfigs(chainConfig), {
     fallbackData: [],
     revalidateOnFocus: false,
   })
diff --git a/src/hooks/useVaults.tsx b/src/hooks/useVaults.tsx
index 544f9c5c..de85fc7b 100644
--- a/src/hooks/useVaults.tsx
+++ b/src/hooks/useVaults.tsx
@@ -1,9 +1,12 @@
 import useSWR from 'swr'
 
 import getVaults from 'api/vaults/getVaults'
+import useChainConfig from 'hooks/useChainConfig'
 
 export default function useVaults(suspense: boolean = true, address?: string) {
-  return useSWR(`vaults${address}`, () => getVaults(), {
+  const chainConfig = useChainConfig()
+
+  return useSWR(`chains/${chainConfig.id}/vaults/${address}`, () => getVaults(chainConfig), {
     suspense,
     revalidateOnFocus: false,
   })
diff --git a/src/hooks/useWalletBalances.tsx b/src/hooks/useWalletBalances.tsx
index b6c3185c..952edc74 100644
--- a/src/hooks/useWalletBalances.tsx
+++ b/src/hooks/useWalletBalances.tsx
@@ -1,10 +1,17 @@
 import useSWR from 'swr'
 
 import getWalletBalances from 'api/wallets/getWalletBalances'
+import useChainConfig from 'hooks/useChainConfig'
 
 export default function useWalletBalances(address?: string) {
-  return useSWR(`walletBalances${address}`, () => getWalletBalances(address || ''), {
-    isPaused: () => !address,
-    fallbackData: [],
-  })
+  const chainConfig = useChainConfig()
+
+  return useSWR(
+    `chains/${chainConfig.id}/wallets/${address}/balances`,
+    () => getWalletBalances(chainConfig, address || ''),
+    {
+      isPaused: () => !address,
+      fallbackData: [],
+    },
+  )
 }
diff --git a/src/pages/BorrowPage.tsx b/src/pages/BorrowPage.tsx
index 58ed4fe7..8eefc851 100644
--- a/src/pages/BorrowPage.tsx
+++ b/src/pages/BorrowPage.tsx
@@ -1,6 +1,6 @@
-import Borrowings from 'components/Borrow/Borrowings'
-import BorrowIntro from 'components/Borrow/BorrowIntro'
-import MigrationBanner from 'components/MigrationBanner'
+import Borrowings from 'components/borrow/Borrowings'
+import BorrowIntro from 'components/borrow/BorrowIntro'
+import MigrationBanner from 'components/common/MigrationBanner'
 
 export default function BorrowPage() {
   return (
diff --git a/src/pages/ExecuteMessagePage.tsx b/src/pages/ExecuteMessagePage.tsx
index 1a1a665f..fec7a5ec 100644
--- a/src/pages/ExecuteMessagePage.tsx
+++ b/src/pages/ExecuteMessagePage.tsx
@@ -1,18 +1,18 @@
 import { useState } from 'react'
 import { useSearchParams } from 'react-router-dom'
 
-import Text from 'components/Text'
-import WarningMessages from 'components/WarningMessages'
-import { ENV } from 'constants/env'
+import ActionButton from 'components/common/Button/ActionButton'
+import Text from 'components/common/Text'
+import WarningMessages from 'components/common/WarningMessages'
+import useChainConfig from 'hooks/useChainConfig'
 import useStore from 'store'
 
-import ActionButton from '../components/Button/ActionButton'
-
 export default function ExecuteMessagePage() {
   const [searchParams] = useSearchParams()
+  const chainConfig = useChainConfig()
 
   const [contract, setContract] = useState<string>(
-    searchParams.get('contract') ?? ENV.ADDRESS_CREDIT_MANAGER,
+    searchParams.get('contract') ?? chainConfig.contracts.creditManager,
   )
   const [message, setMessage] = useState<string>(atob(searchParams.get('msg') ?? ''))
   const [funds, setFunds] = useState<string>(atob(searchParams.get('funds') ?? ''))
diff --git a/src/pages/FarmPage.tsx b/src/pages/FarmPage.tsx
index f86e3e78..4c6bcccd 100644
--- a/src/pages/FarmPage.tsx
+++ b/src/pages/FarmPage.tsx
@@ -1,7 +1,7 @@
-import FarmIntro from 'components/Earn/Farm/FarmIntro'
-import Vaults from 'components/Earn/Farm/Vaults'
-import Tab from 'components/Earn/Tab'
-import MigrationBanner from 'components/MigrationBanner'
+import FarmIntro from 'components/earn/farm/FarmIntro'
+import Vaults from 'components/earn/farm/Vaults'
+import Tab from 'components/earn/Tab'
+import MigrationBanner from 'components/common/MigrationBanner'
 import { EARN_TABS } from 'constants/pages'
 
 export default function FarmPage() {
diff --git a/src/pages/HLSFarmPage.tsx b/src/pages/HLSFarmPage.tsx
index 1e2132b9..40e75b38 100644
--- a/src/pages/HLSFarmPage.tsx
+++ b/src/pages/HLSFarmPage.tsx
@@ -1,7 +1,7 @@
-import Tab from 'components/Earn/Tab'
-import AvailableHLSVaults from 'components/HLS/Farm/AvailableHLSVaults'
-import HlsFarmIntro from 'components/HLS/Farm/HLSFarmIntro'
-import MigrationBanner from 'components/MigrationBanner'
+import Tab from 'components/earn/Tab'
+import AvailableHLSVaults from 'components/hls/Farm/AvailableHLSVaults'
+import HlsFarmIntro from 'components/hls/Farm/HLSFarmIntro'
+import MigrationBanner from 'components/common/MigrationBanner'
 import { HLS_TABS } from 'constants/pages'
 
 export default function HLSFarmPage() {
diff --git a/src/pages/HLSStakingPage.tsx b/src/pages/HLSStakingPage.tsx
index df2229ec..3aeac7c8 100644
--- a/src/pages/HLSStakingPage.tsx
+++ b/src/pages/HLSStakingPage.tsx
@@ -1,8 +1,8 @@
-import Tab from 'components/Earn/Tab'
-import ActiveStakingAccounts from 'components/HLS/Staking/ActiveStakingAccounts'
-import AvailableHlsStakingAssets from 'components/HLS/Staking/AvailableHLSStakingAssets'
-import HLSStakingIntro from 'components/HLS/Staking/HLSStakingIntro'
-import MigrationBanner from 'components/MigrationBanner'
+import Tab from 'components/earn/Tab'
+import ActiveStakingAccounts from 'components/hls/Staking/ActiveStakingAccounts'
+import AvailableHlsStakingAssets from 'components/hls/Staking/AvailableHLSStakingAssets'
+import HLSStakingIntro from 'components/hls/Staking/HLSStakingIntro'
+import MigrationBanner from 'components/common/MigrationBanner'
 import { HLS_TABS } from 'constants/pages'
 
 export default function HLSStakingPage() {
diff --git a/src/pages/LendPage.tsx b/src/pages/LendPage.tsx
index 149ec560..4cb0932e 100644
--- a/src/pages/LendPage.tsx
+++ b/src/pages/LendPage.tsx
@@ -1,14 +1,17 @@
-import LendIntro from 'components/Earn/Lend/LendIntro'
-import Lends from 'components/Earn/Lend/Lends'
-import Tab from 'components/Earn/Tab'
-import MigrationBanner from 'components/MigrationBanner'
+import LendIntro from 'components/earn/lend/LendIntro'
+import Lends from 'components/earn/lend/Lends'
+import Tab from 'components/earn/Tab'
+import MigrationBanner from 'components/common/MigrationBanner'
 import { EARN_TABS } from 'constants/pages'
+import useStore from 'store'
 
 export default function LendPage() {
+  const chainConfig = useStore((s) => s.chainConfig)
+
   return (
     <div className='flex flex-wrap w-full gap-6'>
       <MigrationBanner />
-      <Tab tabs={EARN_TABS} activeTabIdx={0} />
+      {chainConfig.farm && <Tab tabs={EARN_TABS} activeTabIdx={0} />}
       <LendIntro />
       <Lends />
     </div>
diff --git a/src/pages/MobilePage.tsx b/src/pages/MobilePage.tsx
index 50694c47..2e8218c9 100644
--- a/src/pages/MobilePage.tsx
+++ b/src/pages/MobilePage.tsx
@@ -1,4 +1,4 @@
-import MobileNotSupported from 'components/MobileNotSupported'
+import MobileNotSupported from 'components/common/MobileNotSupported'
 
 export default function MobilePage() {
   return <MobileNotSupported />
diff --git a/src/pages/PerpsPage.tsx b/src/pages/PerpsPage.tsx
index 96b85367..10e6fec2 100644
--- a/src/pages/PerpsPage.tsx
+++ b/src/pages/PerpsPage.tsx
@@ -1,19 +1,25 @@
-import { PerpsModule } from 'components/Perps/Module/PerpsModule'
-import { PerpsChart } from 'components/Perps/PerpsChart'
-import { PerpsInfo } from 'components/Perps/PerpsInfo'
-import { PerpsPositions } from 'components/Perps/PerpsPositions'
+import { useSearchParams } from 'react-router-dom'
+
+import { PerpsManageModule } from 'components/perps/Module/PerpsManageModule'
+import { PerpsModule } from 'components/perps/Module/PerpsModule'
+import { PerpsChart } from 'components/perps/PerpsChart'
+import { PerpsInfo } from 'components/perps/PerpsInfo'
+import { PerpsPositions } from 'components/perps/PerpsPositions'
+import { SearchParams } from 'types/enums/searchParams'
 
 export default function PerpsPage() {
+  const [searchParams] = useSearchParams()
+
+  const isManagingPosition = searchParams.get(SearchParams.PERPS_MANAGE) === 'true'
+
   return (
-    <div className='flex flex-col w-full h-full gap-4'>
-      <div className='grid w-full grid-cols-[auto_346px] gap-4 pb-4'>
-        <div className='grid grid-cols-1 grid-rows-[min-content_auto_min-content] gap-4 h-[calc(100dvh-93px)] pb-4'>
-          <PerpsInfo />
-          <PerpsChart />
-          <PerpsPositions />
-        </div>
-        <PerpsModule />
+    <div className='grid grid-cols-[auto_376px] grid-rows-[min-content_auto_auto] w-full gap-4'>
+      <PerpsInfo />
+      <div className='h-full w-[376px] row-span-3 relative'>
+        {isManagingPosition ? <PerpsManageModule /> : <PerpsModule />}
       </div>
+      <PerpsChart />
+      <PerpsPositions />
     </div>
   )
 }
diff --git a/src/pages/PortfolioAccountPage.tsx b/src/pages/PortfolioAccountPage.tsx
index 6759b276..8e2e7275 100644
--- a/src/pages/PortfolioAccountPage.tsx
+++ b/src/pages/PortfolioAccountPage.tsx
@@ -1,14 +1,17 @@
 import { useNavigate, useParams, useSearchParams } from 'react-router-dom'
 
-import MigrationBanner from 'components/MigrationBanner'
-import Balances from 'components/Portfolio/Account/Balances'
-import BreadCrumbs from 'components/Portfolio/Account/BreadCrumbs'
-import Summary from 'components/Portfolio/Account/Summary'
-import ShareBar from 'components/ShareBar'
+import MigrationBanner from 'components/common/MigrationBanner'
+import ShareBar from 'components/common/ShareBar'
+import Balances from 'components/portfolio/Account/Balances'
+import BreadCrumbs from 'components/portfolio/Account/BreadCrumbs'
+import PerpPositions from 'components/portfolio/Account/PerpPositions'
+import Summary from 'components/portfolio/Account/Summary'
 import useAccountId from 'hooks/useAccountId'
+import useStore from 'store'
 import { getRoute } from 'utils/route'
 
 export default function PortfolioAccountPage() {
+  const chainConfig = useStore((s) => s.chainConfig)
   const selectedAccountId = useAccountId()
   const { address, accountId } = useParams()
   const navigate = useNavigate()
@@ -25,6 +28,7 @@ export default function PortfolioAccountPage() {
       <BreadCrumbs accountId={accountId} />
       <Summary accountId={accountId} />
       <Balances accountId={accountId} />
+      {chainConfig.perps && <PerpPositions accountId={accountId} />}
       <ShareBar text={`Have a look at Credit Account ${accountId} on @mars_protocol!`} />
     </div>
   )
diff --git a/src/pages/PortfolioPage.tsx b/src/pages/PortfolioPage.tsx
index e39a71db..6e7269c2 100644
--- a/src/pages/PortfolioPage.tsx
+++ b/src/pages/PortfolioPage.tsx
@@ -1,8 +1,8 @@
-import MigrationBanner from 'components/MigrationBanner'
-import AccountOverview from 'components/Portfolio/Overview'
-import PortfolioSummary from 'components/Portfolio/Overview/Summary'
-import PortfolioIntro from 'components/Portfolio/PortfolioIntro'
-import ShareBar from 'components/ShareBar'
+import MigrationBanner from 'components/common/MigrationBanner'
+import AccountOverview from 'components/portfolio/Overview'
+import PortfolioSummary from 'components/portfolio/Overview/Summary'
+import PortfolioIntro from 'components/portfolio/PortfolioIntro'
+import ShareBar from 'components/common/ShareBar'
 
 export default function PortfolioPage() {
   return (
diff --git a/src/pages/TradePage.tsx b/src/pages/TradePage.tsx
index 9be1e1e1..0a27a128 100644
--- a/src/pages/TradePage.tsx
+++ b/src/pages/TradePage.tsx
@@ -1,35 +1,36 @@
 import { useMemo } from 'react'
 import { useLocation } from 'react-router-dom'
 
-import MigrationBanner from 'components/MigrationBanner'
-import AccountDetailsCard from 'components/Trade/AccountDetailsCard'
-import TradeChart from 'components/Trade/TradeChart'
-import TradeModule from 'components/Trade/TradeModule'
+import MigrationBanner from 'components/common/MigrationBanner'
+import AccountDetailsCard from 'components/trade/AccountDetailsCard'
+import TradeChart from 'components/trade/TradeChart'
+import TradeModule from 'components/trade/TradeModule'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
-import useLocalStorage from 'hooks/useLocalStorage'
+import useMarketEnabledAssets from 'hooks/assets/useMarketEnabledAssets'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
+import useChainConfig from 'hooks/useChainConfig'
 import useStore from 'store'
 import { byDenom } from 'utils/array'
-import { getEnabledMarketAssets } from 'utils/assets'
 import { getPage } from 'utils/route'
 
 export default function TradePage() {
   const { pathname } = useLocation()
+  const chainConfig = useChainConfig()
   const page = getPage(pathname)
   const isAdvanced = useMemo(() => page === 'trade-advanced', [page])
 
   const [tradingPairAdvanced] = useLocalStorage<Settings['tradingPairAdvanced']>(
-    LocalStorageKeys.TRADING_PAIR_ADVANCED,
+    chainConfig.id + '/' + LocalStorageKeys.TRADING_PAIR_ADVANCED,
     DEFAULT_SETTINGS.tradingPairAdvanced,
   )
   const [tradingPairSimple] = useLocalStorage<Settings['tradingPairSimple']>(
-    LocalStorageKeys.TRADING_PAIR_SIMPLE,
+    chainConfig.id + '/' + LocalStorageKeys.TRADING_PAIR_SIMPLE,
     DEFAULT_SETTINGS.tradingPairSimple,
   )
 
-  const enabledMarketAssets = getEnabledMarketAssets()
+  const enabledMarketAssets = useMarketEnabledAssets()
   const assetOverlayState = useStore((s) => s.assetOverlayState)
-
   const buyAsset = useMemo(
     () =>
       enabledMarketAssets.find(
diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx
index e0426492..aae9d73d 100644
--- a/src/pages/_app.tsx
+++ b/src/pages/_app.tsx
@@ -1,7 +1,7 @@
 import { AppProps } from 'next/app'
 import { useEffect, useState } from 'react'
 
-import DefaultPageHead from 'components/DefaultPageHead'
+import DefaultPageHead from 'components/common/DefaultPageHead'
 import init from 'utils/health_computer'
 
 import 'react-toastify/dist/ReactToastify.min.css'
diff --git a/src/pages/_document.tsx b/src/pages/_document.tsx
index 6bfde8ce..3bd31cf6 100644
--- a/src/pages/_document.tsx
+++ b/src/pages/_document.tsx
@@ -3,7 +3,11 @@ import { Head, Html, Main, NextScript } from 'next/document'
 export default function Document() {
   return (
     <Html className='p-0 m-0' lang='en'>
-      <Head />
+      <Head>
+        <script defer src='/charting_library/charting_library.standalone.js' />
+        <script defer src='/datafeeds/udf/dist/bundle.js' />
+        <script defer src='https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.5.4/socket.io.js' />
+      </Head>
       <body className='p-0 m-0 font-sans text-white cursor-default bg-body scrollbar-hide'>
         <Main />
         <NextScript />
diff --git a/src/pages/_layout.tsx b/src/pages/_layout.tsx
index 3ce2afbd..82f212aa 100644
--- a/src/pages/_layout.tsx
+++ b/src/pages/_layout.tsx
@@ -3,17 +3,17 @@ import { Suspense } from 'react'
 import { isMobile } from 'react-device-detect'
 import { useLocation } from 'react-router-dom'
 
-import AccountDetails from 'components/Account/AccountDetails'
-import Background from 'components/Background'
-import Footer from 'components/Footer'
-import DesktopHeader from 'components/Header/DesktopHeader'
+import AccountDetails from 'components/account/AccountDetails'
+import Background from 'components/common/Background'
+import Footer from 'components/common/Footer'
+import DesktopHeader from 'components/header/DesktopHeader'
 import ModalsContainer from 'components/Modals/ModalsContainer'
-import PageMetadata from 'components/PageMetadata'
-import Toaster from 'components/Toaster'
+import PageMetadata from 'components/common/PageMetadata'
+import Toaster from 'components/common/Toaster'
 import { DEFAULT_SETTINGS } from 'constants/defaultSettings'
 import { LocalStorageKeys } from 'constants/localStorageKeys'
+import useLocalStorage from 'hooks/localStorage/useLocalStorage'
 import useAccountId from 'hooks/useAccountId'
-import useLocalStorage from 'hooks/useLocalStorage'
 import useStore from 'store'
 
 interface Props {
@@ -48,11 +48,11 @@ export default function Layout({ children }: { children: React.ReactNode }) {
   const location = useLocation()
   const focusComponent = useStore((s) => s.focusComponent)
   const address = useStore((s) => s.address)
+
   const [reduceMotion] = useLocalStorage<boolean>(
     LocalStorageKeys.REDUCE_MOTION,
     DEFAULT_SETTINGS.reduceMotion,
   )
-
   const accountDetailsExpanded = useStore((s) => s.accountDetailsExpanded)
   const isFullWidth =
     location.pathname.includes('trade') ||
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index a399a649..2f9a970c 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -1,8 +1,8 @@
 import React from 'react'
 import { BrowserRouter } from 'react-router-dom'
 
+import Routes from 'components/header/navigation/Routes'
 import { WalletConnectProvider } from 'components/Wallet/WalletConnectProvider'
-import Routes from 'components/Routes'
 
 export default function Router() {
   return (
diff --git a/src/store/index.ts b/src/store/index.ts
index 50ad5d61..15d43de5 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -3,15 +3,13 @@ import { devtools } from 'zustand/middleware'
 
 import createBroadcastSlice from 'store/slices/broadcast'
 import createCommonSlice from 'store/slices/common'
-import createCurrencySlice from 'store/slices/currency'
 import createModalSlice from 'store/slices/modal'
 
-export interface Store extends CommonSlice, BroadcastSlice, CurrencySlice, ModalSlice {}
+export interface Store extends CommonSlice, BroadcastSlice, ModalSlice {}
 
 const store = (set: SetState<any>, get: GetState<any>) => ({
   ...createCommonSlice(set, get),
   ...createBroadcastSlice(set, get),
-  ...createCurrencySlice(set, get),
   ...createModalSlice(set, get),
 })
 
diff --git a/src/store/slices/broadcast.ts b/src/store/slices/broadcast.ts
index 2909b53d..d4080ac5 100644
--- a/src/store/slices/broadcast.ts
+++ b/src/store/slices/broadcast.ts
@@ -4,7 +4,7 @@ import moment from 'moment'
 import { isMobile } from 'react-device-detect'
 import { GetState, SetState } from 'zustand'
 
-import { ENV } from 'constants/env'
+import getPythPriceData from 'api/prices/getPythPriceData'
 import { BN_ZERO } from 'constants/math'
 import { Store } from 'store'
 import { BNCoin } from 'types/classes/BNCoin'
@@ -17,9 +17,10 @@ import {
   ExecuteMsg,
 } from 'types/generated/mars-credit-manager/MarsCreditManager.types'
 import { AccountKind } from 'types/generated/mars-rover-health-types/MarsRoverHealthTypes.types'
-import { getAssetByDenom, getAssetBySymbol, getPythAssets } from 'utils/assets'
+import { byDenom, bySymbol } from 'utils/array'
 import { generateErrorMessage, getSingleValueFromBroadcastResult } from 'utils/broadcast'
 import checkAutoLendEnabled from 'utils/checkAutoLendEnabled'
+import checkPythUpdateEnabled from 'utils/checkPythUpdateEnabled'
 import { defaultFee } from 'utils/constants'
 import { formatAmountWithSymbol } from 'utils/formatters'
 import getTokenOutFromSwapResponse from 'utils/getTokenOutFromSwapResponse'
@@ -118,6 +119,19 @@ export default function createBroadcastSlice(
         })
         break
 
+      case 'open-perp':
+        toast.content.push({
+          coins: changes.deposits?.map((deposit) => deposit.toCoin()) ?? [],
+          text: 'Market order executed',
+        })
+        break
+      case 'close-perp':
+        toast.content.push({
+          coins: changes.deposits?.map((deposit) => deposit.toCoin()) ?? [],
+          text: 'Closed perp position',
+        })
+        break
+
       case 'swap':
         if (changes.debts) {
           toast.content.push({
@@ -200,11 +214,11 @@ export default function createBroadcastSlice(
         },
       }
 
+      const cmContract = get().chainConfig.contracts.creditManager
+
       const response = get().executeMsg({
         messages: [
-          generateExecutionMessage(get().address, ENV.ADDRESS_CREDIT_MANAGER, msg, [
-            options.depositCoin.toCoin(),
-          ]),
+          generateExecutionMessage(get().address, cmContract, msg, [options.depositCoin.toCoin()]),
         ],
       })
 
@@ -249,22 +263,24 @@ export default function createBroadcastSlice(
 
       if (
         !options.borrowToWallet &&
-        checkAutoLendEnabled(options.accountId) &&
-        getAssetByDenom(options.coin.denom)?.isAutoLendEnabled
+        checkAutoLendEnabled(options.accountId, get().chainConfig.id) &&
+        get().chainConfig.assets.find(byDenom(options.coin.denom))?.isAutoLendEnabled
       ) {
         msg.update_credit_account.actions.push({
           lend: { denom: options.coin.denom, amount: 'account_balance' },
         })
       }
+      const cmContract = get().chainConfig.contracts.creditManager
+
       const response = get().executeMsg({
-        messages: [generateExecutionMessage(get().address, ENV.ADDRESS_CREDIT_MANAGER, msg, [])],
+        messages: [generateExecutionMessage(get().address, cmContract, msg, [])],
       })
 
       get().setToast({
         response,
         options: {
           action: 'borrow',
-          lend: checkAutoLendEnabled(options.accountId),
+          lend: checkAutoLendEnabled(options.accountId, get().chainConfig.id),
           target: options.borrowToWallet ? 'wallet' : 'account',
           accountId: options.accountId,
           changes: { debts: [options.coin] },
@@ -280,9 +296,10 @@ export default function createBroadcastSlice(
           actions: options.actions,
         },
       }
+      const cmContract = get().chainConfig.contracts.creditManager
 
       const response = get().executeMsg({
-        messages: [generateExecutionMessage(get().address, ENV.ADDRESS_CREDIT_MANAGER, msg, [])],
+        messages: [generateExecutionMessage(get().address, cmContract, msg, [])],
       })
 
       get().setToast({
@@ -302,9 +319,10 @@ export default function createBroadcastSlice(
           actions: options.actions,
         },
       }
+      const cmContract = get().chainConfig.contracts.creditManager
 
       const response = get().executeMsg({
-        messages: [generateExecutionMessage(get().address, ENV.ADDRESS_CREDIT_MANAGER, msg, [])],
+        messages: [generateExecutionMessage(get().address, cmContract, msg, [])],
       })
 
       get().setToast({
@@ -322,9 +340,10 @@ export default function createBroadcastSlice(
       const msg: CreditManagerExecuteMsg = {
         create_credit_account: accountKind,
       }
+      const cmContract = get().chainConfig.contracts.creditManager
 
       const response = get().executeMsg({
-        messages: [generateExecutionMessage(get().address, ENV.ADDRESS_CREDIT_MANAGER, msg, [])],
+        messages: [generateExecutionMessage(get().address, cmContract, msg, [])],
       })
 
       get().setToast({
@@ -360,11 +379,13 @@ export default function createBroadcastSlice(
           token_id: options.accountId,
         },
       }
+      const cmContract = get().chainConfig.contracts.creditManager
+      const nftContract = get().chainConfig.contracts.accountNft
 
       const response = get().executeMsg({
         messages: [
-          generateExecutionMessage(get().address, ENV.ADDRESS_CREDIT_MANAGER, refundMessage, []),
-          generateExecutionMessage(get().address, ENV.ADDRESS_ACCOUNT_NFT, burnMessage, []),
+          generateExecutionMessage(get().address, cmContract, refundMessage, []),
+          generateExecutionMessage(get().address, nftContract, burnMessage, []),
         ],
       })
 
@@ -390,10 +411,9 @@ export default function createBroadcastSlice(
           ],
         },
       }
+      const cmContract = get().chainConfig.contracts.creditManager
 
-      const messages = [
-        generateExecutionMessage(get().address, ENV.ADDRESS_CREDIT_MANAGER, msg, []),
-      ]
+      const messages = [generateExecutionMessage(get().address, cmContract, msg, [])]
       const estimateFee = () => getEstimatedFee(messages)
 
       const execute = async () => {
@@ -428,15 +448,16 @@ export default function createBroadcastSlice(
       if (options.lend) {
         msg.update_credit_account.actions.push(
           ...options.coins
-            .filter((coin) => getAssetByDenom(coin.denom)?.isAutoLendEnabled)
+            .filter((coin) => get().chainConfig.assets.find(byDenom(coin.denom))?.isAutoLendEnabled)
             .map((coin) => ({ lend: coin.toActionCoin(options.lend) })),
         )
       }
 
       const funds = options.coins.map((coin) => coin.toCoin())
+      const cmContract = get().chainConfig.contracts.creditManager
 
       const response = get().executeMsg({
-        messages: [generateExecutionMessage(get().address, ENV.ADDRESS_CREDIT_MANAGER, msg, funds)],
+        messages: [generateExecutionMessage(get().address, cmContract, msg, funds)],
       })
 
       get().setToast({
@@ -465,9 +486,10 @@ export default function createBroadcastSlice(
           ],
         },
       }
+      const cmContract = get().chainConfig.contracts.creditManager
 
       const response = get().executeMsg({
-        messages: [generateExecutionMessage(get().address, ENV.ADDRESS_CREDIT_MANAGER, msg, [])],
+        messages: [generateExecutionMessage(get().address, cmContract, msg, [])],
       })
 
       get().setToast({
@@ -511,10 +533,10 @@ export default function createBroadcastSlice(
         },
       }
 
-      if (checkAutoLendEnabled(options.accountId)) {
+      if (checkAutoLendEnabled(options.accountId, get().chainConfig.id)) {
         for (const vault of options.vaults) {
           for (const symbol of Object.values(vault.symbols)) {
-            const asset = getAssetBySymbol(symbol)
+            const asset = get().chainConfig.assets.find(bySymbol(symbol))
             if (asset?.isAutoLendEnabled) {
               msg.update_credit_account.actions.push({
                 lend: { denom: asset.denom, amount: 'account_balance' },
@@ -523,9 +545,10 @@ export default function createBroadcastSlice(
           }
         }
       }
+      const cmContract = get().chainConfig.contracts.creditManager
 
       const response = get().executeMsg({
-        messages: [generateExecutionMessage(get().address, ENV.ADDRESS_CREDIT_MANAGER, msg, [])],
+        messages: [generateExecutionMessage(get().address, cmContract, msg, [])],
       })
 
       const vaultsString = options.vaults.length === 1 ? 'vault' : 'vaults'
@@ -555,12 +578,13 @@ export default function createBroadcastSlice(
           actions: options.actions,
         },
       }
+      const cmContract = get().chainConfig.contracts.creditManager
 
       const response = get().executeMsg({
         messages: [
           generateExecutionMessage(
             get().address,
-            ENV.ADDRESS_CREDIT_MANAGER,
+            cmContract,
             msg,
             options.kind === 'default' ? [] : options.deposits.map((coin) => coin.toCoin()),
           ),
@@ -595,6 +619,7 @@ export default function createBroadcastSlice(
       const borrowActions = options.borrow.map((coin) => ({
         borrow: coin.toCoin(),
       }))
+      const cmContract = get().chainConfig.contracts.creditManager
 
       const msg: CreditManagerExecuteMsg = {
         update_credit_account: {
@@ -604,7 +629,7 @@ export default function createBroadcastSlice(
       }
 
       const response = get().executeMsg({
-        messages: [generateExecutionMessage(get().address, ENV.ADDRESS_CREDIT_MANAGER, msg, [])],
+        messages: [generateExecutionMessage(get().address, cmContract, msg, [])],
       })
 
       get().setToast({
@@ -649,12 +674,13 @@ export default function createBroadcastSlice(
               actions,
             },
           }
+      const cmContract = get().chainConfig.contracts.creditManager
 
       const response = get().executeMsg({
         messages: [
           generateExecutionMessage(
             get().address,
-            ENV.ADDRESS_CREDIT_MANAGER,
+            cmContract,
             msg,
             options.fromWallet ? [options.coin.toCoin()] : [],
           ),
@@ -683,9 +709,10 @@ export default function createBroadcastSlice(
           ],
         },
       }
+      const cmContract = get().chainConfig.contracts.creditManager
 
       const response = get().executeMsg({
-        messages: [generateExecutionMessage(get().address, ENV.ADDRESS_CREDIT_MANAGER, msg, [])],
+        messages: [generateExecutionMessage(get().address, cmContract, msg, [])],
       })
 
       get().setToast({
@@ -710,9 +737,10 @@ export default function createBroadcastSlice(
           ],
         },
       }
+      const cmContract = get().chainConfig.contracts.creditManager
 
       const response = get().executeMsg({
-        messages: [generateExecutionMessage(get().address, ENV.ADDRESS_CREDIT_MANAGER, msg, [])],
+        messages: [generateExecutionMessage(get().address, cmContract, msg, [])],
       })
 
       get().setToast({
@@ -766,18 +794,17 @@ export default function createBroadcastSlice(
       }
 
       if (
-        checkAutoLendEnabled(options.accountId) &&
-        getAssetByDenom(options.denomOut)?.isAutoLendEnabled &&
+        checkAutoLendEnabled(options.accountId, get().chainConfig.id) &&
+        get().chainConfig.assets.find(byDenom(options.denomOut))?.isAutoLendEnabled &&
         !options.repay
       ) {
         msg.update_credit_account.actions.push({
           lend: { denom: options.denomOut, amount: 'account_balance' },
         })
       }
+      const cmContract = get().chainConfig.contracts.creditManager
 
-      const messages = [
-        generateExecutionMessage(get().address, ENV.ADDRESS_CREDIT_MANAGER, msg, []),
-      ]
+      const messages = [generateExecutionMessage(get().address, cmContract, msg, [])]
 
       const estimateFee = () => getEstimatedFee(messages)
 
@@ -807,15 +834,10 @@ export default function createBroadcastSlice(
 
       return { estimateFee, execute }
     },
-    updateOracle: async (pricesData: string[]) => {
-      const msg: PythUpdateExecuteMsg = { update_price_feeds: { data: pricesData } }
-      const pythAssets = getPythAssets()
+    updateOracle: async () => {
       const response = get().executeMsg({
-        messages: [
-          generateExecutionMessage(get().address, ENV.ADDRESS_PYTH, msg, [
-            { denom: get().baseCurrency.denom, amount: String(pythAssets.length) },
-          ]),
-        ],
+        messages: [],
+        isPythUpdate: true,
       })
 
       get().setToast({
@@ -861,7 +883,10 @@ export default function createBroadcastSlice(
               : BN_ZERO
 
             coinOut.amount = depositAmount.plus(coinOut.amount).toFixed(0)
-            toast.options.message = `Added ${formatAmountWithSymbol(coinOut)}`
+            toast.options.message = `Added ${formatAmountWithSymbol(
+              coinOut,
+              get().chainConfig.assets,
+            )}`
           }
         }
 
@@ -872,10 +897,19 @@ export default function createBroadcastSlice(
         })
       })
     },
-    executeMsg: async (options: { messages: MsgExecuteContract[] }): Promise<BroadcastResult> => {
+    executeMsg: async (options: {
+      messages: MsgExecuteContract[]
+      isPythUpdate?: boolean
+    }): Promise<BroadcastResult> => {
       try {
         const client = get().client
-        if (!client) return { error: 'no client detected' }
+        const isLedger = client?.connectedWallet?.account.isLedger
+        if (!client)
+          return { result: undefined, error: 'No client detected. Please reconnect your wallet.' }
+        if ((checkPythUpdateEnabled() || options.isPythUpdate) && !isLedger) {
+          const pythUpdateMsg = await get().getPythVaas()
+          options.messages.unshift(pythUpdateMsg)
+        }
         const fee = await getEstimatedFee(options.messages)
         const broadcastOptions = {
           messages: options.messages,
@@ -900,5 +934,78 @@ export default function createBroadcastSlice(
         return { result: undefined, error: e.message }
       }
     },
+    openPerpPosition: async (options: { accountId: string; coin: BNCoin }) => {
+      const msg: CreditManagerExecuteMsg = {
+        update_credit_account: {
+          account_id: options.accountId,
+          actions: [
+            {
+              open_perp: options.coin.toSignedCoin(),
+            },
+          ],
+        },
+      }
+
+      const cmContract = get().chainConfig.contracts.creditManager
+
+      const response = get().executeMsg({
+        messages: [generateExecutionMessage(get().address, cmContract, msg, [])],
+      })
+
+      get().setToast({
+        response,
+        options: {
+          action: 'open-perp',
+          target: 'account',
+          accountId: options.accountId,
+          changes: { deposits: [options.coin] },
+        },
+      })
+
+      return response.then((response) => !!response.result)
+    },
+    closePerpPosition: async (options: { accountId: string; denom: string }) => {
+      const msg: CreditManagerExecuteMsg = {
+        update_credit_account: {
+          account_id: options.accountId,
+          actions: [
+            {
+              close_perp: { denom: options.denom },
+            },
+          ],
+        },
+      }
+
+      const cmContract = get().chainConfig.contracts.creditManager
+
+      const response = get().executeMsg({
+        messages: [generateExecutionMessage(get().address, cmContract, msg, [])],
+      })
+
+      get().setToast({
+        response,
+        options: {
+          action: 'close-perp',
+          target: 'account',
+          accountId: options.accountId,
+          changes: { deposits: [] },
+        },
+      })
+
+      return response.then((response) => !!response.result)
+    },
+    getPythVaas: async () => {
+      const priceFeedIds = get()
+        .chainConfig.assets.filter((asset) => !!asset.pythPriceFeedId)
+        .map((asset) => asset.pythPriceFeedId as string)
+      const pricesData = await getPythPriceData(priceFeedIds)
+      const msg: PythUpdateExecuteMsg = { update_price_feeds: { data: pricesData } }
+      const pythAssets = get().chainConfig.assets.filter((asset) => !!asset.pythPriceFeedId)
+      const pythContract = get().chainConfig.contracts.pyth
+
+      return generateExecutionMessage(get().address, pythContract, msg, [
+        { denom: get().chainConfig.assets[0].denom, amount: String(pythAssets.length) },
+      ])
+    },
   }
 }
diff --git a/src/store/slices/common.ts b/src/store/slices/common.ts
index 033237b7..eee116cc 100644
--- a/src/store/slices/common.ts
+++ b/src/store/slices/common.ts
@@ -1,9 +1,12 @@
 import { GetState, SetState } from 'zustand'
 
+import Osmosis1 from 'configs/chains/osmosis/osmosis-1'
+
 export default function createCommonSlice(set: SetState<CommonSlice>, get: GetState<CommonSlice>) {
   return {
     accounts: null,
     balances: [],
+    chainConfig: Osmosis1,
     creditAccounts: null,
     hlsAccounts: null,
     isOpen: true,
diff --git a/src/store/slices/currency.ts b/src/store/slices/currency.ts
deleted file mode 100644
index 6ccc6e78..00000000
--- a/src/store/slices/currency.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-import { GetState, SetState } from 'zustand'
-
-import { ASSETS } from 'constants/assets'
-
-export default function createCurrencySlice(
-  set: SetState<CurrencySlice>,
-  get: GetState<CurrencySlice>,
-) {
-  return {
-    baseCurrency: ASSETS[0],
-  }
-}
diff --git a/src/types/classes/BNCoin.ts b/src/types/classes/BNCoin.ts
index 1c34d0cf..bc131b2f 100644
--- a/src/types/classes/BNCoin.ts
+++ b/src/types/classes/BNCoin.ts
@@ -37,4 +37,11 @@ export class BNCoin {
           },
     }
   }
+
+  toSignedCoin(): any {
+    return {
+      denom: this.denom,
+      size: this.amount.toString(),
+    }
+  }
 }
diff --git a/src/types/enums/network.ts b/src/types/enums/network.ts
index 6941ca56..3cdbd331 100644
--- a/src/types/enums/network.ts
+++ b/src/types/enums/network.ts
@@ -1,5 +1,4 @@
 export enum NETWORK {
   MAINNET = 'mainnet',
-  DEVNET = 'devnet',
   TESTNET = 'testnet',
 }
diff --git a/src/types/enums/searchParams.ts b/src/types/enums/searchParams.ts
new file mode 100644
index 00000000..b526bdc3
--- /dev/null
+++ b/src/types/enums/searchParams.ts
@@ -0,0 +1,5 @@
+export enum SearchParams {
+  ACCOUNT_ID = 'accountId',
+  PERPS_MARKET = 'perpsMarket',
+  PERPS_MANAGE = 'perpsManage',
+}
diff --git a/src/types/enums/wallet.ts b/src/types/enums/wallet.ts
index c639c231..a0e5cf4c 100644
--- a/src/types/enums/wallet.ts
+++ b/src/types/enums/wallet.ts
@@ -7,11 +7,13 @@ export enum WalletID {
   LeapMobile = 'mobile-leap-cosmos',
   LeapSnap = 'leap-metamask-cosmos-snap',
   Station = 'station',
+  Vectis = 'vectis-cosmos',
   Xdefi = 'xfi-cosmos',
 }
 
 export enum ChainInfoID {
   Osmosis1 = 'osmosis-1',
   OsmosisDevnet = 'devnet',
-  OsmosisTestnet = 'osmo-test-5',
+  Pion1 = 'pion-1',
+  Neutron1 = 'neutron-1',
 }
diff --git a/src/types/generated.d.ts b/src/types/generated.d.ts
index 664ebf23..80198dce 100644
--- a/src/types/generated.d.ts
+++ b/src/types/generated.d.ts
@@ -1 +1,3 @@
-export { ActionCoin } from 'types/generated/mars-credit-manager/MarsCreditManager.types'
+type ActionCoin = import('types/generated/mars-credit-manager/MarsCreditManager.types').ActionCoin
+
+type BNCoin = import('types/classes/BNCoin').BNCoin
diff --git a/src/types/generated/mars-account-nft/MarsAccountNft.client.ts b/src/types/generated/mars-account-nft/MarsAccountNft.client.ts
index d2c9dce8..334425ee 100644
--- a/src/types/generated/mars-account-nft/MarsAccountNft.client.ts
+++ b/src/types/generated/mars-account-nft/MarsAccountNft.client.ts
@@ -1,6 +1,6 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.33.0.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
@@ -11,6 +11,7 @@ import {
   Uint128,
   InstantiateMsg,
   ExecuteMsg,
+  MigrateV1ToV2,
   Binary,
   Expiration,
   Timestamp,
@@ -306,6 +307,12 @@ export interface MarsAccountNftInterface extends MarsAccountNftReadOnlyInterface
     memo?: string,
     _funds?: Coin[],
   ) => Promise<ExecuteResult>
+  migrate: (
+    migrateV1ToV2: MigrateV1ToV2,
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
   transferNft: (
     {
       recipient,
@@ -403,6 +410,7 @@ export class MarsAccountNftClient
     this.updateConfig = this.updateConfig.bind(this)
     this.mint = this.mint.bind(this)
     this.burn = this.burn.bind(this)
+    this.migrate = this.migrate.bind(this)
     this.transferNft = this.transferNft.bind(this)
     this.sendNft = this.sendNft.bind(this)
     this.approve = this.approve.bind(this)
@@ -481,6 +489,23 @@ export class MarsAccountNftClient
       _funds,
     )
   }
+  migrate = async (
+    migrateV1ToV2: MigrateV1ToV2,
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        migrate: migrateV1ToV2,
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
   transferNft = async (
     {
       recipient,
diff --git a/src/types/generated/mars-account-nft/MarsAccountNft.react-query.ts b/src/types/generated/mars-account-nft/MarsAccountNft.react-query.ts
index ceea0e59..8df2e401 100644
--- a/src/types/generated/mars-account-nft/MarsAccountNft.react-query.ts
+++ b/src/types/generated/mars-account-nft/MarsAccountNft.react-query.ts
@@ -1,6 +1,6 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.33.0.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
@@ -12,6 +12,7 @@ import {
   Uint128,
   InstantiateMsg,
   ExecuteMsg,
+  MigrateV1ToV2,
   Binary,
   Expiration,
   Timestamp,
@@ -526,6 +527,26 @@ export function useMarsAccountNftTransferNftMutation(
     options,
   )
 }
+export interface MarsAccountNftMigrateMutation {
+  client: MarsAccountNftClient
+  msg: MigrateV1ToV2
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsAccountNftMigrateMutation(
+  options?: Omit<
+    UseMutationOptions<ExecuteResult, Error, MarsAccountNftMigrateMutation>,
+    'mutationFn'
+  >,
+) {
+  return useMutation<ExecuteResult, Error, MarsAccountNftMigrateMutation>(
+    ({ client, msg, args: { fee, memo, funds } = {} }) => client.migrate(msg, fee, memo, funds),
+    options,
+  )
+}
 export interface MarsAccountNftBurnMutation {
   client: MarsAccountNftClient
   msg: {
diff --git a/src/types/generated/mars-account-nft/MarsAccountNft.types.ts b/src/types/generated/mars-account-nft/MarsAccountNft.types.ts
index f7ef1687..779ebec0 100644
--- a/src/types/generated/mars-account-nft/MarsAccountNft.types.ts
+++ b/src/types/generated/mars-account-nft/MarsAccountNft.types.ts
@@ -1,12 +1,13 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.33.0.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
 
 export type Uint128 = string
 export interface InstantiateMsg {
+  credit_manager_contract?: string | null
   health_contract?: string | null
   max_value_for_burn: Uint128
   minter: string
@@ -29,6 +30,9 @@ export type ExecuteMsg =
         token_id: string
       }
     }
+  | {
+      migrate: MigrateV1ToV2
+    }
   | {
       transfer_nft: {
         recipient: string
@@ -69,6 +73,11 @@ export type ExecuteMsg =
   | {
       update_ownership: Action
     }
+export type MigrateV1ToV2 = {
+  burn_empty_accounts: {
+    limit?: number | null
+  }
+}
 export type Binary = string
 export type Expiration =
   | {
@@ -92,6 +101,7 @@ export type Action =
   | 'accept_ownership'
   | 'renounce_ownership'
 export interface NftConfigUpdates {
+  credit_manager_contract_addr?: string | null
   health_contract_addr?: string | null
   max_value_for_burn?: Uint128 | null
 }
@@ -197,6 +207,7 @@ export interface ApprovalsResponse {
   approvals: Approval[]
 }
 export interface NftConfigBaseForString {
+  credit_manager_contract_addr?: string | null
   health_contract_addr?: string | null
   max_value_for_burn: Uint128
 }
diff --git a/src/types/generated/mars-account-nft/bundle.ts b/src/types/generated/mars-account-nft/bundle.ts
index b0ca12db..c7a0026c 100644
--- a/src/types/generated/mars-account-nft/bundle.ts
+++ b/src/types/generated/mars-account-nft/bundle.ts
@@ -1,14 +1,13 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.33.0.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
 
 import * as _0 from './MarsAccountNft.types'
 import * as _1 from './MarsAccountNft.client'
-import * as _2 from './MarsAccountNft.message-composer'
-import * as _3 from './MarsAccountNft.react-query'
+import * as _2 from './MarsAccountNft.react-query'
 export namespace contracts {
-  export const MarsAccountNft = { ..._0, ..._1, ..._2, ..._3 }
+  export const MarsAccountNft = { ..._0, ..._1, ..._2 }
 }
diff --git a/src/types/generated/mars-credit-manager/MarsCreditManager.client.ts b/src/types/generated/mars-credit-manager/MarsCreditManager.client.ts
index ae7d52be..17b7ffb0 100644
--- a/src/types/generated/mars-credit-manager/MarsCreditManager.client.ts
+++ b/src/types/generated/mars-credit-manager/MarsCreditManager.client.ts
@@ -1,6 +1,6 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.33.0.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
@@ -25,7 +25,12 @@ import {
   LiquidateRequestForVaultBaseForString,
   VaultPositionType,
   AccountNftBaseForString,
+  PerpsBaseForString,
   OwnerUpdate,
+  Action2,
+  Expiration,
+  Timestamp,
+  Uint64,
   CallbackMsg,
   Addr,
   HealthState,
@@ -33,6 +38,7 @@ import {
   ChangeExpected,
   Coin,
   ActionCoin,
+  SignedDecimal,
   VaultBaseForString,
   ConfigUpdates,
   NftConfigUpdates,
@@ -59,8 +65,13 @@ import {
   OwnerResponse,
   RewardsCollector,
   ArrayOfCoin,
+  PnL,
   Positions,
   DebtAmount,
+  PerpPosition,
+  PositionPnl,
+  PnlCoins,
+  PnlValues,
   VaultPositionValue,
   CoinValue,
   VaultUtilizationResponse,
@@ -338,7 +349,7 @@ export interface MarsCreditManagerInterface extends MarsCreditManagerReadOnlyInt
       ownership,
     }: {
       config?: NftConfigUpdates
-      ownership?: Action
+      ownership?: Action2
     },
     fee?: number | StdFee | 'auto',
     memo?: string,
@@ -484,7 +495,7 @@ export class MarsCreditManagerClient
       ownership,
     }: {
       config?: NftConfigUpdates
-      ownership?: Action
+      ownership?: Action2
     },
     fee: number | StdFee | 'auto' = 'auto',
     memo?: string,
diff --git a/src/types/generated/mars-credit-manager/MarsCreditManager.message-composer.ts b/src/types/generated/mars-credit-manager/MarsCreditManager.message-composer.ts
deleted file mode 100644
index 1321ce03..00000000
--- a/src/types/generated/mars-credit-manager/MarsCreditManager.message-composer.ts
+++ /dev/null
@@ -1,275 +0,0 @@
-// @ts-nocheck
-/**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.33.0.
- * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
- * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
- */
-
-import { MsgExecuteContractEncodeObject } from '@cosmjs/cosmwasm-stargate'
-import { MsgExecuteContract } from 'cosmjs-types/cosmwasm/wasm/v1/tx'
-import { toUtf8 } from '@cosmjs/encoding'
-import {
-  HealthContractBaseForString,
-  IncentivesUnchecked,
-  Decimal,
-  Uint128,
-  OracleBaseForString,
-  ParamsBaseForString,
-  RedBankUnchecked,
-  SwapperBaseForString,
-  ZapperBaseForString,
-  InstantiateMsg,
-  ExecuteMsg,
-  AccountKind,
-  Action,
-  ActionAmount,
-  LiquidateRequestForVaultBaseForString,
-  VaultPositionType,
-  AccountNftBaseForString,
-  OwnerUpdate,
-  CallbackMsg,
-  Addr,
-  HealthState,
-  LiquidateRequestForVaultBaseForAddr,
-  ChangeExpected,
-  Coin,
-  ActionCoin,
-  VaultBaseForString,
-  ConfigUpdates,
-  NftConfigUpdates,
-  VaultBaseForAddr,
-  QueryMsg,
-  VaultPositionAmount,
-  VaultAmount,
-  VaultAmount1,
-  UnlockingPositions,
-  VaultPosition,
-  LockingVaultAmount,
-  VaultUnlockingPosition,
-  ArrayOfAccount,
-  Account,
-  ArrayOfCoinBalanceResponseItem,
-  CoinBalanceResponseItem,
-  ArrayOfSharesResponseItem,
-  SharesResponseItem,
-  ArrayOfDebtShares,
-  DebtShares,
-  ArrayOfVaultPositionResponseItem,
-  VaultPositionResponseItem,
-  ConfigResponse,
-  OwnerResponse,
-  RewardsCollector,
-  ArrayOfCoin,
-  Positions,
-  DebtAmount,
-  VaultPositionValue,
-  CoinValue,
-  VaultUtilizationResponse,
-} from './MarsCreditManager.types'
-export interface MarsCreditManagerMessage {
-  contractAddress: string
-  sender: string
-  createCreditAccount: (_funds?: Coin[]) => MsgExecuteContractEncodeObject
-  updateCreditAccount: (
-    {
-      accountId,
-      actions,
-    }: {
-      accountId: string
-      actions: Action[]
-    },
-    _funds?: Coin[],
-  ) => MsgExecuteContractEncodeObject
-  repayFromWallet: (
-    {
-      accountId,
-    }: {
-      accountId: string
-    },
-    _funds?: Coin[],
-  ) => MsgExecuteContractEncodeObject
-  updateConfig: (
-    {
-      updates,
-    }: {
-      updates: ConfigUpdates
-    },
-    _funds?: Coin[],
-  ) => MsgExecuteContractEncodeObject
-  updateOwner: (ownerUpdate: OwnerUpdate, _funds?: Coin[]) => MsgExecuteContractEncodeObject
-  updateNftConfig: (
-    {
-      config,
-      ownership,
-    }: {
-      config?: NftConfigUpdates
-      ownership?: Action
-    },
-    _funds?: Coin[],
-  ) => MsgExecuteContractEncodeObject
-  callback: (callbackMsg: CallbackMsg, _funds?: Coin[]) => MsgExecuteContractEncodeObject
-}
-export class MarsCreditManagerMessageComposer implements MarsCreditManagerMessage {
-  sender: string
-  contractAddress: string
-
-  constructor(sender: string, contractAddress: string) {
-    this.sender = sender
-    this.contractAddress = contractAddress
-    this.createCreditAccount = this.createCreditAccount.bind(this)
-    this.updateCreditAccount = this.updateCreditAccount.bind(this)
-    this.repayFromWallet = this.repayFromWallet.bind(this)
-    this.updateConfig = this.updateConfig.bind(this)
-    this.updateOwner = this.updateOwner.bind(this)
-    this.updateNftConfig = this.updateNftConfig.bind(this)
-    this.callback = this.callback.bind(this)
-  }
-
-  createCreditAccount = (_funds?: Coin[]): MsgExecuteContractEncodeObject => {
-    return {
-      typeUrl: '/cosmwasm.wasm.v1.MsgExecuteContract',
-      value: MsgExecuteContract.fromPartial({
-        sender: this.sender,
-        contract: this.contractAddress,
-        msg: toUtf8(
-          JSON.stringify({
-            create_credit_account: {},
-          }),
-        ),
-        funds: _funds,
-      }),
-    }
-  }
-  updateCreditAccount = (
-    {
-      accountId,
-      actions,
-    }: {
-      accountId: string
-      actions: Action[]
-    },
-    _funds?: Coin[],
-  ): MsgExecuteContractEncodeObject => {
-    return {
-      typeUrl: '/cosmwasm.wasm.v1.MsgExecuteContract',
-      value: MsgExecuteContract.fromPartial({
-        sender: this.sender,
-        contract: this.contractAddress,
-        msg: toUtf8(
-          JSON.stringify({
-            update_credit_account: {
-              account_id: accountId,
-              actions,
-            },
-          }),
-        ),
-        funds: _funds,
-      }),
-    }
-  }
-  repayFromWallet = (
-    {
-      accountId,
-    }: {
-      accountId: string
-    },
-    _funds?: Coin[],
-  ): MsgExecuteContractEncodeObject => {
-    return {
-      typeUrl: '/cosmwasm.wasm.v1.MsgExecuteContract',
-      value: MsgExecuteContract.fromPartial({
-        sender: this.sender,
-        contract: this.contractAddress,
-        msg: toUtf8(
-          JSON.stringify({
-            repay_from_wallet: {
-              account_id: accountId,
-            },
-          }),
-        ),
-        funds: _funds,
-      }),
-    }
-  }
-  updateConfig = (
-    {
-      updates,
-    }: {
-      updates: ConfigUpdates
-    },
-    _funds?: Coin[],
-  ): MsgExecuteContractEncodeObject => {
-    return {
-      typeUrl: '/cosmwasm.wasm.v1.MsgExecuteContract',
-      value: MsgExecuteContract.fromPartial({
-        sender: this.sender,
-        contract: this.contractAddress,
-        msg: toUtf8(
-          JSON.stringify({
-            update_config: {
-              updates,
-            },
-          }),
-        ),
-        funds: _funds,
-      }),
-    }
-  }
-  updateOwner = (ownerUpdate: OwnerUpdate, _funds?: Coin[]): MsgExecuteContractEncodeObject => {
-    return {
-      typeUrl: '/cosmwasm.wasm.v1.MsgExecuteContract',
-      value: MsgExecuteContract.fromPartial({
-        sender: this.sender,
-        contract: this.contractAddress,
-        msg: toUtf8(
-          JSON.stringify({
-            update_owner: ownerUpdate,
-          }),
-        ),
-        funds: _funds,
-      }),
-    }
-  }
-  updateNftConfig = (
-    {
-      config,
-      ownership,
-    }: {
-      config?: NftConfigUpdates
-      ownership?: Action
-    },
-    _funds?: Coin[],
-  ): MsgExecuteContractEncodeObject => {
-    return {
-      typeUrl: '/cosmwasm.wasm.v1.MsgExecuteContract',
-      value: MsgExecuteContract.fromPartial({
-        sender: this.sender,
-        contract: this.contractAddress,
-        msg: toUtf8(
-          JSON.stringify({
-            update_nft_config: {
-              config,
-              ownership,
-            },
-          }),
-        ),
-        funds: _funds,
-      }),
-    }
-  }
-  callback = (callbackMsg: CallbackMsg, _funds?: Coin[]): MsgExecuteContractEncodeObject => {
-    return {
-      typeUrl: '/cosmwasm.wasm.v1.MsgExecuteContract',
-      value: MsgExecuteContract.fromPartial({
-        sender: this.sender,
-        contract: this.contractAddress,
-        msg: toUtf8(
-          JSON.stringify({
-            callback: callbackMsg,
-          }),
-        ),
-        funds: _funds,
-      }),
-    }
-  }
-}
diff --git a/src/types/generated/mars-credit-manager/MarsCreditManager.react-query.ts b/src/types/generated/mars-credit-manager/MarsCreditManager.react-query.ts
index 81988f5c..3ef53041 100644
--- a/src/types/generated/mars-credit-manager/MarsCreditManager.react-query.ts
+++ b/src/types/generated/mars-credit-manager/MarsCreditManager.react-query.ts
@@ -1,6 +1,6 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.33.0.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
@@ -26,7 +26,12 @@ import {
   LiquidateRequestForVaultBaseForString,
   VaultPositionType,
   AccountNftBaseForString,
+  PerpsBaseForString,
   OwnerUpdate,
+  Action2,
+  Expiration,
+  Timestamp,
+  Uint64,
   CallbackMsg,
   Addr,
   HealthState,
@@ -34,6 +39,7 @@ import {
   ChangeExpected,
   Coin,
   ActionCoin,
+  SignedDecimal,
   VaultBaseForString,
   ConfigUpdates,
   NftConfigUpdates,
@@ -60,8 +66,13 @@ import {
   OwnerResponse,
   RewardsCollector,
   ArrayOfCoin,
+  PnL,
   Positions,
   DebtAmount,
+  PerpPosition,
+  PositionPnl,
+  PnlCoins,
+  PnlValues,
   VaultPositionValue,
   CoinValue,
   VaultUtilizationResponse,
@@ -478,7 +489,7 @@ export interface MarsCreditManagerUpdateNftConfigMutation {
   client: MarsCreditManagerClient
   msg: {
     config?: NftConfigUpdates
-    ownership?: Action
+    ownership?: Action2
   }
   args?: {
     fee?: number | StdFee | 'auto'
diff --git a/src/types/generated/mars-credit-manager/MarsCreditManager.types.ts b/src/types/generated/mars-credit-manager/MarsCreditManager.types.ts
index 4b370f32..ae2ffd95 100644
--- a/src/types/generated/mars-credit-manager/MarsCreditManager.types.ts
+++ b/src/types/generated/mars-credit-manager/MarsCreditManager.types.ts
@@ -1,6 +1,6 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.33.0.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
@@ -52,7 +52,7 @@ export type ExecuteMsg =
   | {
       update_nft_config: {
         config?: NftConfigUpdates | null
-        ownership?: Action | null
+        ownership?: Action2 | null
       }
     }
   | {
@@ -84,6 +84,17 @@ export type Action =
         recipient_account_id?: string | null
       }
     }
+  | {
+      open_perp: {
+        denom: string
+        size: SignedDecimal
+      }
+    }
+  | {
+      close_perp: {
+        denom: string
+      }
+    }
   | {
       enter_vault: {
         coin: ActionCoin
@@ -158,6 +169,7 @@ export type LiquidateRequestForVaultBaseForString =
     }
 export type VaultPositionType = 'u_n_l_o_c_k_e_d' | 'l_o_c_k_e_d' | 'u_n_l_o_c_k_i_n_g'
 export type AccountNftBaseForString = string
+export type PerpsBaseForString = string
 export type OwnerUpdate =
   | {
       propose_new_owner: {
@@ -173,6 +185,27 @@ export type OwnerUpdate =
       }
     }
   | 'clear_emergency_owner'
+export type Action2 =
+  | {
+      transfer_ownership: {
+        expiry?: Expiration | null
+        new_owner: string
+      }
+    }
+  | 'accept_ownership'
+  | 'renounce_ownership'
+export type Expiration =
+  | {
+      at_height: number
+    }
+  | {
+      at_time: Timestamp
+    }
+  | {
+      never: {}
+    }
+export type Timestamp = Uint64
+export type Uint64 = string
 export type CallbackMsg =
   | {
       withdraw: {
@@ -229,6 +262,19 @@ export type CallbackMsg =
         denoms: string[]
       }
     }
+  | {
+      open_perp: {
+        account_id: string
+        denom: string
+        size: SignedDecimal
+      }
+    }
+  | {
+      close_perp: {
+        account_id: string
+        denom: string
+      }
+    }
   | {
       enter_vault: {
         account_id: string
@@ -360,6 +406,11 @@ export interface ActionCoin {
   amount: ActionAmount
   denom: string
 }
+export interface SignedDecimal {
+  abs: Decimal
+  negative: boolean
+  [k: string]: unknown
+}
 export interface VaultBaseForString {
   address: string
 }
@@ -370,6 +421,8 @@ export interface ConfigUpdates {
   max_slippage?: Decimal | null
   max_unlocking_positions?: Uint128 | null
   oracle?: OracleBaseForString | null
+  params?: ParamsBaseForString | null
+  perps?: PerpsBaseForString | null
   red_bank?: RedBankUnchecked | null
   rewards_collector?: string | null
   swapper?: SwapperBaseForString | null
@@ -510,6 +563,7 @@ export interface ConfigResponse {
   oracle: string
   ownership: OwnerResponse
   params: string
+  perps: string
   red_bank: string
   rewards_collector?: RewardsCollector | null
   swapper: string
@@ -527,11 +581,20 @@ export interface RewardsCollector {
   address: string
 }
 export type ArrayOfCoin = Coin[]
+export type PnL =
+  | 'break_even'
+  | {
+      profit: Coin
+    }
+  | {
+      loss: Coin
+    }
 export interface Positions {
   account_id: string
   debts: DebtAmount[]
   deposits: Coin[]
   lends: Coin[]
+  perps: PerpPosition[]
   vaults: VaultPosition[]
 }
 export interface DebtAmount {
@@ -539,6 +602,29 @@ export interface DebtAmount {
   denom: string
   shares: Uint128
 }
+export interface PerpPosition {
+  base_denom: string
+  closing_fee_rate: Decimal
+  current_price: Decimal
+  denom: string
+  entry_price: Decimal
+  pnl: PositionPnl
+  size: SignedDecimal
+}
+export interface PositionPnl {
+  coins: PnlCoins
+  values: PnlValues
+}
+export interface PnlCoins {
+  closing_fee: Coin
+  pnl: PnL
+}
+export interface PnlValues {
+  accrued_funding: SignedDecimal
+  closing_fee: SignedDecimal
+  pnl: SignedDecimal
+  price_pnl: SignedDecimal
+}
 export interface VaultPositionValue {
   base_coin: CoinValue
   vault_coin: CoinValue
diff --git a/src/types/generated/mars-credit-manager/bundle.ts b/src/types/generated/mars-credit-manager/bundle.ts
index ce848a6d..5d5cd8bd 100644
--- a/src/types/generated/mars-credit-manager/bundle.ts
+++ b/src/types/generated/mars-credit-manager/bundle.ts
@@ -1,14 +1,13 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.33.0.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
 
-import * as _4 from './MarsCreditManager.types'
-import * as _5 from './MarsCreditManager.client'
-import * as _6 from './MarsCreditManager.message-composer'
-import * as _7 from './MarsCreditManager.react-query'
+import * as _6 from './MarsCreditManager.types'
+import * as _7 from './MarsCreditManager.client'
+import * as _8 from './MarsCreditManager.react-query'
 export namespace contracts {
-  export const MarsCreditManager = { ..._4, ..._5, ..._6, ..._7 }
+  export const MarsCreditManager = { ..._6, ..._7, ..._8 }
 }
diff --git a/src/types/generated/mars-incentives/MarsIncentives.client.ts b/src/types/generated/mars-incentives/MarsIncentives.client.ts
index 9ac604e3..cf9a37c8 100644
--- a/src/types/generated/mars-incentives/MarsIncentives.client.ts
+++ b/src/types/generated/mars-incentives/MarsIncentives.client.ts
@@ -1,32 +1,32 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.30.1.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
 
-import { CosmWasmClient, ExecuteResult, SigningCosmWasmClient } from '@cosmjs/cosmwasm-stargate'
+import { CosmWasmClient, SigningCosmWasmClient, ExecuteResult } from '@cosmjs/cosmwasm-stargate'
 import { StdFee } from '@cosmjs/amino'
-
 import {
-  ActiveEmission,
-  Addr,
-  ArrayOfActiveEmission,
-  ArrayOfCoin,
-  ArrayOfEmissionResponse,
-  ArrayOfIncentiveStateResponse,
-  ArrayOfWhitelistEntry,
-  Coin,
-  ConfigResponse,
-  Decimal,
-  EmissionResponse,
-  ExecuteMsg,
-  IncentiveStateResponse,
   InstantiateMsg,
-  OwnerUpdate,
-  QueryMsg,
+  ExecuteMsg,
   Uint128,
+  Addr,
+  OwnerUpdate,
+  MigrateV1ToV2,
   WhitelistEntry,
+  QueryMsg,
+  ArrayOfActiveEmission,
+  ActiveEmission,
+  ConfigResponse,
+  ArrayOfEmissionResponse,
+  EmissionResponse,
+  Decimal,
+  IncentiveStateResponse,
+  ArrayOfIncentiveStateResponse,
+  ArrayOfCoin,
+  Coin,
+  ArrayOfWhitelistEntry,
 } from './MarsIncentives.types'
 export interface MarsIncentivesReadOnlyInterface {
   contractAddress: string
@@ -302,6 +302,12 @@ export interface MarsIncentivesInterface extends MarsIncentivesReadOnlyInterface
     memo?: string,
     _funds?: Coin[],
   ) => Promise<ExecuteResult>
+  migrate: (
+    migrateV1ToV2: MigrateV1ToV2,
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
 }
 export class MarsIncentivesClient
   extends MarsIncentivesQueryClient
@@ -322,6 +328,7 @@ export class MarsIncentivesClient
     this.claimRewards = this.claimRewards.bind(this)
     this.updateConfig = this.updateConfig.bind(this)
     this.updateOwner = this.updateOwner.bind(this)
+    this.migrate = this.migrate.bind(this)
   }
 
   updateWhitelist = async (
@@ -495,4 +502,21 @@ export class MarsIncentivesClient
       _funds,
     )
   }
+  migrate = async (
+    migrateV1ToV2: MigrateV1ToV2,
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        migrate: migrateV1ToV2,
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
 }
diff --git a/src/types/generated/mars-incentives/MarsIncentives.react-query.ts b/src/types/generated/mars-incentives/MarsIncentives.react-query.ts
index 5dfad90f..109af6c7 100644
--- a/src/types/generated/mars-incentives/MarsIncentives.react-query.ts
+++ b/src/types/generated/mars-incentives/MarsIncentives.react-query.ts
@@ -1,35 +1,35 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.30.1.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
 
-import { useMutation, UseMutationOptions, useQuery, UseQueryOptions } from '@tanstack/react-query'
+import { UseQueryOptions, useQuery, useMutation, UseMutationOptions } from '@tanstack/react-query'
 import { ExecuteResult } from '@cosmjs/cosmwasm-stargate'
 import { StdFee } from '@cosmjs/amino'
-
 import {
-  ActiveEmission,
-  Addr,
-  ArrayOfActiveEmission,
-  ArrayOfCoin,
-  ArrayOfEmissionResponse,
-  ArrayOfIncentiveStateResponse,
-  ArrayOfWhitelistEntry,
-  Coin,
-  ConfigResponse,
-  Decimal,
-  EmissionResponse,
-  ExecuteMsg,
-  IncentiveStateResponse,
   InstantiateMsg,
-  OwnerUpdate,
-  QueryMsg,
+  ExecuteMsg,
   Uint128,
+  Addr,
+  OwnerUpdate,
+  MigrateV1ToV2,
   WhitelistEntry,
+  QueryMsg,
+  ArrayOfActiveEmission,
+  ActiveEmission,
+  ConfigResponse,
+  ArrayOfEmissionResponse,
+  EmissionResponse,
+  Decimal,
+  IncentiveStateResponse,
+  ArrayOfIncentiveStateResponse,
+  ArrayOfCoin,
+  Coin,
+  ArrayOfWhitelistEntry,
 } from './MarsIncentives.types'
-import { MarsIncentivesClient, MarsIncentivesQueryClient } from './MarsIncentives.client'
+import { MarsIncentivesQueryClient, MarsIncentivesClient } from './MarsIncentives.client'
 export const marsIncentivesQueryKeys = {
   contract: [
     {
@@ -260,6 +260,26 @@ export function useMarsIncentivesActiveEmissionsQuery<TData = ArrayOfActiveEmiss
     { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
   )
 }
+export interface MarsIncentivesMigrateMutation {
+  client: MarsIncentivesClient
+  msg: MigrateV1ToV2
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsIncentivesMigrateMutation(
+  options?: Omit<
+    UseMutationOptions<ExecuteResult, Error, MarsIncentivesMigrateMutation>,
+    'mutationFn'
+  >,
+) {
+  return useMutation<ExecuteResult, Error, MarsIncentivesMigrateMutation>(
+    ({ client, msg, args: { fee, memo, funds } = {} }) => client.migrate(msg, fee, memo, funds),
+    options,
+  )
+}
 export interface MarsIncentivesUpdateOwnerMutation {
   client: MarsIncentivesClient
   msg: OwnerUpdate
diff --git a/src/types/generated/mars-incentives/MarsIncentives.types.ts b/src/types/generated/mars-incentives/MarsIncentives.types.ts
index 1098c5bb..f8fe3c58 100644
--- a/src/types/generated/mars-incentives/MarsIncentives.types.ts
+++ b/src/types/generated/mars-incentives/MarsIncentives.types.ts
@@ -1,6 +1,6 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.30.1.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
@@ -8,6 +8,7 @@
 export interface InstantiateMsg {
   address_provider: string
   epoch_duration: number
+  mars_denom: string
   max_whitelisted_denoms: number
   owner: string
 }
@@ -53,6 +54,9 @@ export type ExecuteMsg =
   | {
       update_owner: OwnerUpdate
     }
+  | {
+      migrate: MigrateV1ToV2
+    }
 export type Uint128 = string
 export type Addr = string
 export type OwnerUpdate =
@@ -70,6 +74,15 @@ export type OwnerUpdate =
       }
     }
   | 'clear_emergency_owner'
+export type MigrateV1ToV2 =
+  | {
+      users_indexes_and_rewards: {
+        limit: number
+      }
+    }
+  | {
+      clear_v1_state: {}
+    }
 export interface WhitelistEntry {
   denom: string
   min_emission_rate: Uint128
@@ -134,6 +147,7 @@ export interface ConfigResponse {
   max_whitelisted_denoms: number
   owner?: string | null
   proposed_new_owner?: string | null
+  whitelist_count: number
 }
 export type ArrayOfEmissionResponse = EmissionResponse[]
 export interface EmissionResponse {
diff --git a/src/types/generated/mars-incentives/bundle.ts b/src/types/generated/mars-incentives/bundle.ts
index 16d22368..da717f0e 100644
--- a/src/types/generated/mars-incentives/bundle.ts
+++ b/src/types/generated/mars-incentives/bundle.ts
@@ -1,13 +1,13 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.30.1.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
 
-import * as _3 from './MarsIncentives.types'
-import * as _4 from './MarsIncentives.client'
-import * as _5 from './MarsIncentives.react-query'
+import * as _9 from './MarsIncentives.types'
+import * as _10 from './MarsIncentives.client'
+import * as _11 from './MarsIncentives.react-query'
 export namespace contracts {
-  export const MarsIncentives = { ..._3, ..._4, ..._5 }
+  export const MarsIncentives = { ..._9, ..._10, ..._11 }
 }
diff --git a/src/types/generated/mars-oracle-osmosis/MarsOracleOsmosis.client.ts b/src/types/generated/mars-oracle-osmosis/MarsOracleOsmosis.client.ts
index c70068b2..48e2533c 100644
--- a/src/types/generated/mars-oracle-osmosis/MarsOracleOsmosis.client.ts
+++ b/src/types/generated/mars-oracle-osmosis/MarsOracleOsmosis.client.ts
@@ -1,6 +1,6 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.30.1.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
@@ -20,6 +20,7 @@ import {
   GeometricTwap,
   RedemptionRateForString,
   QueryMsg,
+  ActionKind,
   ConfigResponse,
   PriceResponse,
   PriceSourceResponseForString,
@@ -37,11 +38,13 @@ export interface MarsOracleOsmosisReadOnlyInterface {
     limit?: number
     startAfter?: string
   }) => Promise<ArrayOfPriceSourceResponseForString>
-  price: ({ denom }: { denom: string }) => Promise<PriceResponse>
+  price: ({ denom, kind }: { denom: string; kind?: ActionKind }) => Promise<PriceResponse>
   prices: ({
+    kind,
     limit,
     startAfter,
   }: {
+    kind?: ActionKind
     limit?: number
     startAfter?: string
   }) => Promise<ArrayOfPriceResponse>
@@ -86,22 +89,26 @@ export class MarsOracleOsmosisQueryClient implements MarsOracleOsmosisReadOnlyIn
       },
     })
   }
-  price = async ({ denom }: { denom: string }): Promise<PriceResponse> => {
+  price = async ({ denom, kind }: { denom: string; kind?: ActionKind }): Promise<PriceResponse> => {
     return this.client.queryContractSmart(this.contractAddress, {
       price: {
         denom,
+        kind,
       },
     })
   }
   prices = async ({
+    kind,
     limit,
     startAfter,
   }: {
+    kind?: ActionKind
     limit?: number
     startAfter?: string
   }): Promise<ArrayOfPriceResponse> => {
     return this.client.queryContractSmart(this.contractAddress, {
       prices: {
+        kind,
         limit,
         start_after: startAfter,
       },
diff --git a/src/types/generated/mars-oracle-osmosis/MarsOracleOsmosis.react-query.ts b/src/types/generated/mars-oracle-osmosis/MarsOracleOsmosis.react-query.ts
index 739c3a02..a1af98a4 100644
--- a/src/types/generated/mars-oracle-osmosis/MarsOracleOsmosis.react-query.ts
+++ b/src/types/generated/mars-oracle-osmosis/MarsOracleOsmosis.react-query.ts
@@ -1,6 +1,6 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.30.1.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
@@ -21,6 +21,7 @@ import {
   GeometricTwap,
   RedemptionRateForString,
   QueryMsg,
+  ActionKind,
   ConfigResponse,
   PriceResponse,
   PriceSourceResponseForString,
@@ -67,6 +68,7 @@ export interface MarsOracleOsmosisReactQuery<TResponse, TData = TResponse> {
 export interface MarsOracleOsmosisPricesQuery<TData>
   extends MarsOracleOsmosisReactQuery<ArrayOfPriceResponse, TData> {
   args: {
+    kind?: ActionKind
     limit?: number
     startAfter?: string
   }
@@ -81,6 +83,7 @@ export function useMarsOracleOsmosisPricesQuery<TData = ArrayOfPriceResponse>({
     () =>
       client
         ? client.prices({
+            kind: args.kind,
             limit: args.limit,
             startAfter: args.startAfter,
           })
@@ -92,6 +95,7 @@ export interface MarsOracleOsmosisPriceQuery<TData>
   extends MarsOracleOsmosisReactQuery<PriceResponse, TData> {
   args: {
     denom: string
+    kind?: ActionKind
   }
 }
 export function useMarsOracleOsmosisPriceQuery<TData = PriceResponse>({
@@ -105,6 +109,7 @@ export function useMarsOracleOsmosisPriceQuery<TData = PriceResponse>({
       client
         ? client.price({
             denom: args.denom,
+            kind: args.kind,
           })
         : Promise.reject(new Error('Invalid client')),
     { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
diff --git a/src/types/generated/mars-oracle-osmosis/MarsOracleOsmosis.types.ts b/src/types/generated/mars-oracle-osmosis/MarsOracleOsmosis.types.ts
index d1ee479f..fa76e70a 100644
--- a/src/types/generated/mars-oracle-osmosis/MarsOracleOsmosis.types.ts
+++ b/src/types/generated/mars-oracle-osmosis/MarsOracleOsmosis.types.ts
@@ -1,6 +1,6 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.30.1.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
@@ -40,13 +40,11 @@ export type OsmosisPriceSourceForString =
   | {
       fixed: {
         price: Decimal
-        [k: string]: unknown
       }
     }
   | {
       spot: {
         pool_id: number
-        [k: string]: unknown
       }
     }
   | {
@@ -54,7 +52,6 @@ export type OsmosisPriceSourceForString =
         downtime_detector?: DowntimeDetector | null
         pool_id: number
         window_size: number
-        [k: string]: unknown
       }
     }
   | {
@@ -62,13 +59,11 @@ export type OsmosisPriceSourceForString =
         downtime_detector?: DowntimeDetector | null
         pool_id: number
         window_size: number
-        [k: string]: unknown
       }
     }
   | {
       xyk_liquidity_token: {
         pool_id: number
-        [k: string]: unknown
       }
     }
   | {
@@ -77,16 +72,16 @@ export type OsmosisPriceSourceForString =
         pool_id: number
         transitive_denom: string
         window_size: number
-        [k: string]: unknown
       }
     }
   | {
       pyth: {
         contract_addr: string
         denom_decimals: number
+        max_confidence: Decimal
+        max_deviation: Decimal
         max_staleness: number
         price_feed_id: Identifier
-        [k: string]: unknown
       }
     }
   | {
@@ -94,36 +89,35 @@ export type OsmosisPriceSourceForString =
         geometric_twap: GeometricTwap
         redemption_rate: RedemptionRateForString
         transitive_denom: string
-        [k: string]: unknown
       }
     }
 export type Decimal = string
 export type Downtime =
-  | 'duration30s'
-  | 'duration1m'
-  | 'duration2m'
-  | 'duration3m'
-  | 'duration4m'
-  | 'duration5m'
-  | 'duration10m'
-  | 'duration20m'
-  | 'duration30m'
-  | 'duration40m'
-  | 'duration50m'
-  | 'duration1h'
-  | 'duration15h'
-  | 'duration2h'
-  | 'duration25h'
-  | 'duration3h'
-  | 'duration4h'
-  | 'duration5h'
-  | 'duration6h'
-  | 'duration9h'
-  | 'duration12h'
-  | 'duration18h'
-  | 'duration24h'
-  | 'duration36h'
-  | 'duration48h'
+  | 'Duration30s'
+  | 'Duration1m'
+  | 'Duration2m'
+  | 'Duration3m'
+  | 'Duration4m'
+  | 'Duration5m'
+  | 'Duration10m'
+  | 'Duration20m'
+  | 'Duration30m'
+  | 'Duration40m'
+  | 'Duration50m'
+  | 'Duration1h'
+  | 'Duration15h'
+  | 'Duration2h'
+  | 'Duration25h'
+  | 'Duration3h'
+  | 'Duration4h'
+  | 'Duration5h'
+  | 'Duration6h'
+  | 'Duration9h'
+  | 'Duration12h'
+  | 'Duration18h'
+  | 'Duration24h'
+  | 'Duration36h'
+  | 'Duration48h'
 export type Identifier = string
 export type OwnerUpdate =
   | {
@@ -143,18 +137,15 @@ export type OwnerUpdate =
 export interface DowntimeDetector {
   downtime: Downtime
   recovery: number
-  [k: string]: unknown
 }
 export interface GeometricTwap {
   downtime_detector?: DowntimeDetector | null
   pool_id: number
   window_size: number
-  [k: string]: unknown
 }
 export interface RedemptionRateForString {
   contract_addr: string
   max_staleness: number
-  [k: string]: unknown
 }
 export type QueryMsg =
   | {
@@ -174,14 +165,17 @@ export type QueryMsg =
   | {
       price: {
         denom: string
+        kind?: ActionKind | null
       }
     }
   | {
       prices: {
+        kind?: ActionKind | null
         limit?: number | null
         start_after?: string | null
       }
     }
+export type ActionKind = 'default' | 'liquidation'
 export interface ConfigResponse {
   base_denom: string
   owner?: string | null
diff --git a/src/types/generated/mars-oracle-osmosis/bundle.ts b/src/types/generated/mars-oracle-osmosis/bundle.ts
index cfdc6968..9428a689 100644
--- a/src/types/generated/mars-oracle-osmosis/bundle.ts
+++ b/src/types/generated/mars-oracle-osmosis/bundle.ts
@@ -1,13 +1,13 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.30.1.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
 
-import * as _6 from './MarsOracleOsmosis.types'
-import * as _7 from './MarsOracleOsmosis.client'
-import * as _8 from './MarsOracleOsmosis.react-query'
+import * as _15 from './MarsOracleOsmosis.types'
+import * as _16 from './MarsOracleOsmosis.client'
+import * as _17 from './MarsOracleOsmosis.react-query'
 export namespace contracts {
-  export const MarsOracleOsmosis = { ..._6, ..._7, ..._8 }
+  export const MarsOracleOsmosis = { ..._15, ..._16, ..._17 }
 }
diff --git a/src/types/generated/mars-params/MarsParams.client.ts b/src/types/generated/mars-params/MarsParams.client.ts
index 68968aa9..9241512e 100644
--- a/src/types/generated/mars-params/MarsParams.client.ts
+++ b/src/types/generated/mars-params/MarsParams.client.ts
@@ -1,6 +1,6 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.33.0.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
@@ -16,6 +16,7 @@ import {
   HlsAssetTypeForString,
   Uint128,
   VaultConfigUpdate,
+  PerpParamsUpdate,
   EmergencyUpdate,
   CmEmergencyUpdate,
   RedBankEmergencyUpdate,
@@ -26,6 +27,7 @@ import {
   RedBankSettings,
   VaultConfigBaseForString,
   Coin,
+  PerpParams,
   QueryMsg,
   HlsAssetTypeForAddr,
   Addr,
@@ -33,14 +35,17 @@ import {
   AssetParamsBaseForAddr,
   CmSettingsForAddr,
   HlsParamsBaseForAddr,
+  ArrayOfPerpParams,
   ArrayOfVaultConfigBaseForAddr,
   VaultConfigBaseForAddr,
+  ConfigResponse,
   OwnerResponse,
   TotalDepositResponse,
 } from './MarsParams.types'
 export interface MarsParamsReadOnlyInterface {
   contractAddress: string
   owner: () => Promise<OwnerResponse>
+  config: () => Promise<ConfigResponse>
   assetParams: ({ denom }: { denom: string }) => Promise<AssetParamsBaseForAddr>
   allAssetParams: ({
     limit,
@@ -57,6 +62,14 @@ export interface MarsParamsReadOnlyInterface {
     limit?: number
     startAfter?: string
   }) => Promise<ArrayOfVaultConfigBaseForAddr>
+  perpParams: ({ denom }: { denom: string }) => Promise<PerpParams>
+  allPerpParams: ({
+    limit,
+    startAfter,
+  }: {
+    limit?: number
+    startAfter?: string
+  }) => Promise<ArrayOfPerpParams>
   targetHealthFactor: () => Promise<Decimal>
   totalDeposit: ({ denom }: { denom: string }) => Promise<TotalDepositResponse>
 }
@@ -68,10 +81,13 @@ export class MarsParamsQueryClient implements MarsParamsReadOnlyInterface {
     this.client = client
     this.contractAddress = contractAddress
     this.owner = this.owner.bind(this)
+    this.config = this.config.bind(this)
     this.assetParams = this.assetParams.bind(this)
     this.allAssetParams = this.allAssetParams.bind(this)
     this.vaultConfig = this.vaultConfig.bind(this)
     this.allVaultConfigs = this.allVaultConfigs.bind(this)
+    this.perpParams = this.perpParams.bind(this)
+    this.allPerpParams = this.allPerpParams.bind(this)
     this.targetHealthFactor = this.targetHealthFactor.bind(this)
     this.totalDeposit = this.totalDeposit.bind(this)
   }
@@ -81,6 +97,11 @@ export class MarsParamsQueryClient implements MarsParamsReadOnlyInterface {
       owner: {},
     })
   }
+  config = async (): Promise<ConfigResponse> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      config: {},
+    })
+  }
   assetParams = async ({ denom }: { denom: string }): Promise<AssetParamsBaseForAddr> => {
     return this.client.queryContractSmart(this.contractAddress, {
       asset_params: {
@@ -123,6 +144,27 @@ export class MarsParamsQueryClient implements MarsParamsReadOnlyInterface {
       },
     })
   }
+  perpParams = async ({ denom }: { denom: string }): Promise<PerpParams> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      perp_params: {
+        denom,
+      },
+    })
+  }
+  allPerpParams = async ({
+    limit,
+    startAfter,
+  }: {
+    limit?: number
+    startAfter?: string
+  }): Promise<ArrayOfPerpParams> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      all_perp_params: {
+        limit,
+        start_after: startAfter,
+      },
+    })
+  }
   targetHealthFactor = async (): Promise<Decimal> => {
     return this.client.queryContractSmart(this.contractAddress, {
       target_health_factor: {},
@@ -145,6 +187,16 @@ export interface MarsParamsInterface extends MarsParamsReadOnlyInterface {
     memo?: string,
     _funds?: Coin[],
   ) => Promise<ExecuteResult>
+  updateConfig: (
+    {
+      addressProvider,
+    }: {
+      addressProvider?: string
+    },
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
   updateTargetHealthFactor: (
     fee?: number | StdFee | 'auto',
     memo?: string,
@@ -162,6 +214,12 @@ export interface MarsParamsInterface extends MarsParamsReadOnlyInterface {
     memo?: string,
     _funds?: Coin[],
   ) => Promise<ExecuteResult>
+  updatePerpParams: (
+    perpParamsUpdate: PerpParamsUpdate,
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
   emergencyUpdate: (
     emergencyUpdate: EmergencyUpdate,
     fee?: number | StdFee | 'auto',
@@ -180,9 +238,11 @@ export class MarsParamsClient extends MarsParamsQueryClient implements MarsParam
     this.sender = sender
     this.contractAddress = contractAddress
     this.updateOwner = this.updateOwner.bind(this)
+    this.updateConfig = this.updateConfig.bind(this)
     this.updateTargetHealthFactor = this.updateTargetHealthFactor.bind(this)
     this.updateAssetParams = this.updateAssetParams.bind(this)
     this.updateVaultConfig = this.updateVaultConfig.bind(this)
+    this.updatePerpParams = this.updatePerpParams.bind(this)
     this.emergencyUpdate = this.emergencyUpdate.bind(this)
   }
 
@@ -203,6 +263,29 @@ export class MarsParamsClient extends MarsParamsQueryClient implements MarsParam
       _funds,
     )
   }
+  updateConfig = async (
+    {
+      addressProvider,
+    }: {
+      addressProvider?: string
+    },
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        update_config: {
+          address_provider: addressProvider,
+        },
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
   updateTargetHealthFactor = async (
     fee: number | StdFee | 'auto' = 'auto',
     memo?: string,
@@ -253,6 +336,23 @@ export class MarsParamsClient extends MarsParamsQueryClient implements MarsParam
       _funds,
     )
   }
+  updatePerpParams = async (
+    perpParamsUpdate: PerpParamsUpdate,
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        update_perp_params: perpParamsUpdate,
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
   emergencyUpdate = async (
     emergencyUpdate: EmergencyUpdate,
     fee: number | StdFee | 'auto' = 'auto',
diff --git a/src/types/generated/mars-params/MarsParams.react-query.ts b/src/types/generated/mars-params/MarsParams.react-query.ts
index 70179ee7..5763834e 100644
--- a/src/types/generated/mars-params/MarsParams.react-query.ts
+++ b/src/types/generated/mars-params/MarsParams.react-query.ts
@@ -1,6 +1,6 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.33.0.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
@@ -17,6 +17,7 @@ import {
   HlsAssetTypeForString,
   Uint128,
   VaultConfigUpdate,
+  PerpParamsUpdate,
   EmergencyUpdate,
   CmEmergencyUpdate,
   RedBankEmergencyUpdate,
@@ -27,6 +28,7 @@ import {
   RedBankSettings,
   VaultConfigBaseForString,
   Coin,
+  PerpParams,
   QueryMsg,
   HlsAssetTypeForAddr,
   Addr,
@@ -34,8 +36,10 @@ import {
   AssetParamsBaseForAddr,
   CmSettingsForAddr,
   HlsParamsBaseForAddr,
+  ArrayOfPerpParams,
   ArrayOfVaultConfigBaseForAddr,
   VaultConfigBaseForAddr,
+  ConfigResponse,
   OwnerResponse,
   TotalDepositResponse,
 } from './MarsParams.types'
@@ -50,6 +54,8 @@ export const marsParamsQueryKeys = {
     [{ ...marsParamsQueryKeys.contract[0], address: contractAddress }] as const,
   owner: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
     [{ ...marsParamsQueryKeys.address(contractAddress)[0], method: 'owner', args }] as const,
+  config: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [{ ...marsParamsQueryKeys.address(contractAddress)[0], method: 'config', args }] as const,
   assetParams: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
     [{ ...marsParamsQueryKeys.address(contractAddress)[0], method: 'asset_params', args }] as const,
   allAssetParams: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
@@ -62,6 +68,12 @@ export const marsParamsQueryKeys = {
     [
       { ...marsParamsQueryKeys.address(contractAddress)[0], method: 'all_vault_configs', args },
     ] as const,
+  perpParams: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [{ ...marsParamsQueryKeys.address(contractAddress)[0], method: 'perp_params', args }] as const,
+  allPerpParams: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [
+      { ...marsParamsQueryKeys.address(contractAddress)[0], method: 'all_perp_params', args },
+    ] as const,
   targetHealthFactor: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
     [
       { ...marsParamsQueryKeys.address(contractAddress)[0], method: 'target_health_factor', args },
@@ -114,6 +126,51 @@ export function useMarsParamsTargetHealthFactorQuery<TData = Decimal>({
     { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
   )
 }
+export interface MarsParamsAllPerpParamsQuery<TData>
+  extends MarsParamsReactQuery<ArrayOfPerpParams, TData> {
+  args: {
+    limit?: number
+    startAfter?: string
+  }
+}
+export function useMarsParamsAllPerpParamsQuery<TData = ArrayOfPerpParams>({
+  client,
+  args,
+  options,
+}: MarsParamsAllPerpParamsQuery<TData>) {
+  return useQuery<ArrayOfPerpParams, Error, TData>(
+    marsParamsQueryKeys.allPerpParams(client?.contractAddress, args),
+    () =>
+      client
+        ? client.allPerpParams({
+            limit: args.limit,
+            startAfter: args.startAfter,
+          })
+        : Promise.reject(new Error('Invalid client')),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsParamsPerpParamsQuery<TData> extends MarsParamsReactQuery<PerpParams, TData> {
+  args: {
+    denom: string
+  }
+}
+export function useMarsParamsPerpParamsQuery<TData = PerpParams>({
+  client,
+  args,
+  options,
+}: MarsParamsPerpParamsQuery<TData>) {
+  return useQuery<PerpParams, Error, TData>(
+    marsParamsQueryKeys.perpParams(client?.contractAddress, args),
+    () =>
+      client
+        ? client.perpParams({
+            denom: args.denom,
+          })
+        : Promise.reject(new Error('Invalid client')),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
 export interface MarsParamsAllVaultConfigsQuery<TData>
   extends MarsParamsReactQuery<ArrayOfVaultConfigBaseForAddr, TData> {
   args: {
@@ -206,6 +263,17 @@ export function useMarsParamsAssetParamsQuery<TData = AssetParamsBaseForAddr>({
     { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
   )
 }
+export interface MarsParamsConfigQuery<TData> extends MarsParamsReactQuery<ConfigResponse, TData> {}
+export function useMarsParamsConfigQuery<TData = ConfigResponse>({
+  client,
+  options,
+}: MarsParamsConfigQuery<TData>) {
+  return useQuery<ConfigResponse, Error, TData>(
+    marsParamsQueryKeys.config(client?.contractAddress),
+    () => (client ? client.config() : Promise.reject(new Error('Invalid client'))),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
 export interface MarsParamsOwnerQuery<TData> extends MarsParamsReactQuery<OwnerResponse, TData> {}
 export function useMarsParamsOwnerQuery<TData = OwnerResponse>({
   client,
@@ -238,6 +306,27 @@ export function useMarsParamsEmergencyUpdateMutation(
     options,
   )
 }
+export interface MarsParamsUpdatePerpParamsMutation {
+  client: MarsParamsClient
+  msg: PerpParamsUpdate
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsParamsUpdatePerpParamsMutation(
+  options?: Omit<
+    UseMutationOptions<ExecuteResult, Error, MarsParamsUpdatePerpParamsMutation>,
+    'mutationFn'
+  >,
+) {
+  return useMutation<ExecuteResult, Error, MarsParamsUpdatePerpParamsMutation>(
+    ({ client, msg, args: { fee, memo, funds } = {} }) =>
+      client.updatePerpParams(msg, fee, memo, funds),
+    options,
+  )
+}
 export interface MarsParamsUpdateVaultConfigMutation {
   client: MarsParamsClient
   msg: VaultConfigUpdate
@@ -300,6 +389,29 @@ export function useMarsParamsUpdateTargetHealthFactorMutation(
     options,
   )
 }
+export interface MarsParamsUpdateConfigMutation {
+  client: MarsParamsClient
+  msg: {
+    addressProvider?: string
+  }
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsParamsUpdateConfigMutation(
+  options?: Omit<
+    UseMutationOptions<ExecuteResult, Error, MarsParamsUpdateConfigMutation>,
+    'mutationFn'
+  >,
+) {
+  return useMutation<ExecuteResult, Error, MarsParamsUpdateConfigMutation>(
+    ({ client, msg, args: { fee, memo, funds } = {} }) =>
+      client.updateConfig(msg, fee, memo, funds),
+    options,
+  )
+}
 export interface MarsParamsUpdateOwnerMutation {
   client: MarsParamsClient
   msg: OwnerUpdate
diff --git a/src/types/generated/mars-params/MarsParams.types.ts b/src/types/generated/mars-params/MarsParams.types.ts
index 04005ce3..c3766a50 100644
--- a/src/types/generated/mars-params/MarsParams.types.ts
+++ b/src/types/generated/mars-params/MarsParams.types.ts
@@ -1,6 +1,6 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.33.0.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
@@ -15,6 +15,11 @@ export type ExecuteMsg =
   | {
       update_owner: OwnerUpdate
     }
+  | {
+      update_config: {
+        address_provider?: string | null
+      }
+    }
   | {
       update_target_health_factor: Decimal
     }
@@ -24,6 +29,9 @@ export type ExecuteMsg =
   | {
       update_vault_config: VaultConfigUpdate
     }
+  | {
+      update_perp_params: PerpParamsUpdate
+    }
   | {
       emergency_update: EmergencyUpdate
     }
@@ -64,6 +72,11 @@ export type VaultConfigUpdate = {
     config: VaultConfigBaseForString
   }
 }
+export type PerpParamsUpdate = {
+  add_or_update: {
+    params: PerpParams
+  }
+}
 export type EmergencyUpdate =
   | {
       credit_manager: CmEmergencyUpdate
@@ -126,10 +139,18 @@ export interface Coin {
   denom: string
   [k: string]: unknown
 }
+export interface PerpParams {
+  denom: string
+  max_long_oi: Uint128
+  max_short_oi: Uint128
+}
 export type QueryMsg =
   | {
       owner: {}
     }
+  | {
+      config: {}
+    }
   | {
       asset_params: {
         denom: string
@@ -152,6 +173,17 @@ export type QueryMsg =
         start_after?: string | null
       }
     }
+  | {
+      perp_params: {
+        denom: string
+      }
+    }
+  | {
+      all_perp_params: {
+        limit?: number | null
+        start_after?: string | null
+      }
+    }
   | {
       target_health_factor: {}
     }
@@ -192,6 +224,7 @@ export interface HlsParamsBaseForAddr {
   liquidation_threshold: Decimal
   max_loan_to_value: Decimal
 }
+export type ArrayOfPerpParams = PerpParams[]
 export type ArrayOfVaultConfigBaseForAddr = VaultConfigBaseForAddr[]
 export interface VaultConfigBaseForAddr {
   addr: Addr
@@ -201,6 +234,9 @@ export interface VaultConfigBaseForAddr {
   max_loan_to_value: Decimal
   whitelisted: boolean
 }
+export interface ConfigResponse {
+  address_provider: string
+}
 export interface OwnerResponse {
   abolished: boolean
   emergency_owner?: string | null
diff --git a/src/types/generated/mars-params/bundle.ts b/src/types/generated/mars-params/bundle.ts
index ff151def..66f5f4a3 100644
--- a/src/types/generated/mars-params/bundle.ts
+++ b/src/types/generated/mars-params/bundle.ts
@@ -1,14 +1,13 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.33.0.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
 
-import * as _24 from './MarsParams.types'
-import * as _25 from './MarsParams.client'
-import * as _26 from './MarsParams.message-composer'
-import * as _27 from './MarsParams.react-query'
+import * as _21 from './MarsParams.types'
+import * as _22 from './MarsParams.client'
+import * as _23 from './MarsParams.react-query'
 export namespace contracts {
-  export const MarsParams = { ..._24, ..._25, ..._26, ..._27 }
+  export const MarsParams = { ..._21, ..._22, ..._23 }
 }
diff --git a/src/types/generated/mars-perps/MarsPerps.client.ts b/src/types/generated/mars-perps/MarsPerps.client.ts
new file mode 100644
index 00000000..e3e32221
--- /dev/null
+++ b/src/types/generated/mars-perps/MarsPerps.client.ts
@@ -0,0 +1,550 @@
+// @ts-nocheck
+/**
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
+ * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
+ */
+
+import { CosmWasmClient, SigningCosmWasmClient, ExecuteResult } from '@cosmjs/cosmwasm-stargate'
+import { StdFee } from '@cosmjs/amino'
+import {
+  Decimal,
+  Uint128,
+  OracleBaseForString,
+  ParamsBaseForString,
+  InstantiateMsg,
+  ExecuteMsg,
+  OwnerUpdate,
+  SignedDecimal,
+  QueryMsg,
+  ConfigForString,
+  DenomStateResponse,
+  Funding,
+  ArrayOfDenomStateResponse,
+  DepositResponse,
+  ArrayOfDepositResponse,
+  TradingFee,
+  Coin,
+  OwnerResponse,
+  PerpDenomState,
+  DenomPnlValues,
+  PnL,
+  PositionResponse,
+  PerpPosition,
+  PositionPnl,
+  PnlCoins,
+  PnlValues,
+  ArrayOfPositionResponse,
+  PositionsByAccountResponse,
+  ArrayOfUnlockState,
+  UnlockState,
+  VaultState,
+} from './MarsPerps.types'
+export interface MarsPerpsReadOnlyInterface {
+  contractAddress: string
+  owner: () => Promise<OwnerResponse>
+  config: () => Promise<ConfigForString>
+  vaultState: () => Promise<VaultState>
+  denomState: ({ denom }: { denom: string }) => Promise<DenomStateResponse>
+  perpDenomState: ({ denom }: { denom: string }) => Promise<PerpDenomState>
+  denomStates: ({
+    limit,
+    startAfter,
+  }: {
+    limit?: number
+    startAfter?: string
+  }) => Promise<ArrayOfDenomStateResponse>
+  deposit: ({ depositor }: { depositor: string }) => Promise<DepositResponse>
+  deposits: ({
+    limit,
+    startAfter,
+  }: {
+    limit?: number
+    startAfter?: string
+  }) => Promise<ArrayOfDepositResponse>
+  unlocks: ({ depositor }: { depositor: string }) => Promise<ArrayOfUnlockState>
+  position: ({
+    accountId,
+    denom,
+  }: {
+    accountId: string
+    denom: string
+  }) => Promise<PositionResponse>
+  positions: ({
+    limit,
+    startAfter,
+  }: {
+    limit?: number
+    startAfter?: string[][]
+  }) => Promise<ArrayOfPositionResponse>
+  positionsByAccount: ({ accountId }: { accountId: string }) => Promise<PositionsByAccountResponse>
+  totalPnl: () => Promise<SignedDecimal>
+  openingFee: ({ denom, size }: { denom: string; size: SignedDecimal }) => Promise<TradingFee>
+}
+export class MarsPerpsQueryClient implements MarsPerpsReadOnlyInterface {
+  client: CosmWasmClient
+  contractAddress: string
+
+  constructor(client: CosmWasmClient, contractAddress: string) {
+    this.client = client
+    this.contractAddress = contractAddress
+    this.owner = this.owner.bind(this)
+    this.config = this.config.bind(this)
+    this.vaultState = this.vaultState.bind(this)
+    this.denomState = this.denomState.bind(this)
+    this.perpDenomState = this.perpDenomState.bind(this)
+    this.denomStates = this.denomStates.bind(this)
+    this.deposit = this.deposit.bind(this)
+    this.deposits = this.deposits.bind(this)
+    this.unlocks = this.unlocks.bind(this)
+    this.position = this.position.bind(this)
+    this.positions = this.positions.bind(this)
+    this.positionsByAccount = this.positionsByAccount.bind(this)
+    this.totalPnl = this.totalPnl.bind(this)
+    this.openingFee = this.openingFee.bind(this)
+  }
+
+  owner = async (): Promise<OwnerResponse> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      owner: {},
+    })
+  }
+  config = async (): Promise<ConfigForString> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      config: {},
+    })
+  }
+  vaultState = async (): Promise<VaultState> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      vault_state: {},
+    })
+  }
+  denomState = async ({ denom }: { denom: string }): Promise<DenomStateResponse> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      denom_state: {
+        denom,
+      },
+    })
+  }
+  perpDenomState = async ({ denom }: { denom: string }): Promise<PerpDenomState> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      perp_denom_state: {
+        denom,
+      },
+    })
+  }
+  denomStates = async ({
+    limit,
+    startAfter,
+  }: {
+    limit?: number
+    startAfter?: string
+  }): Promise<ArrayOfDenomStateResponse> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      denom_states: {
+        limit,
+        start_after: startAfter,
+      },
+    })
+  }
+  deposit = async ({ depositor }: { depositor: string }): Promise<DepositResponse> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      deposit: {
+        depositor,
+      },
+    })
+  }
+  deposits = async ({
+    limit,
+    startAfter,
+  }: {
+    limit?: number
+    startAfter?: string
+  }): Promise<ArrayOfDepositResponse> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      deposits: {
+        limit,
+        start_after: startAfter,
+      },
+    })
+  }
+  unlocks = async ({ depositor }: { depositor: string }): Promise<ArrayOfUnlockState> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      unlocks: {
+        depositor,
+      },
+    })
+  }
+  position = async ({
+    accountId,
+    denom,
+  }: {
+    accountId: string
+    denom: string
+  }): Promise<PositionResponse> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      position: {
+        account_id: accountId,
+        denom,
+      },
+    })
+  }
+  positions = async ({
+    limit,
+    startAfter,
+  }: {
+    limit?: number
+    startAfter?: string[][]
+  }): Promise<ArrayOfPositionResponse> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      positions: {
+        limit,
+        start_after: startAfter,
+      },
+    })
+  }
+  positionsByAccount = async ({
+    accountId,
+  }: {
+    accountId: string
+  }): Promise<PositionsByAccountResponse> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      positions_by_account: {
+        account_id: accountId,
+      },
+    })
+  }
+  totalPnl = async (): Promise<SignedDecimal> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      total_pnl: {},
+    })
+  }
+  openingFee = async ({
+    denom,
+    size,
+  }: {
+    denom: string
+    size: SignedDecimal
+  }): Promise<TradingFee> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      opening_fee: {
+        denom,
+        size,
+      },
+    })
+  }
+}
+export interface MarsPerpsInterface extends MarsPerpsReadOnlyInterface {
+  contractAddress: string
+  sender: string
+  updateOwner: (
+    ownerUpdate: OwnerUpdate,
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
+  initDenom: (
+    {
+      denom,
+      maxFundingVelocity,
+      skewScale,
+    }: {
+      denom: string
+      maxFundingVelocity: Decimal
+      skewScale: Decimal
+    },
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
+  enableDenom: (
+    {
+      denom,
+    }: {
+      denom: string
+    },
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
+  disableDenom: (
+    {
+      denom,
+    }: {
+      denom: string
+    },
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
+  deposit: (
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
+  unlock: (
+    {
+      shares,
+    }: {
+      shares: Uint128
+    },
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
+  withdraw: (
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
+  openPosition: (
+    {
+      accountId,
+      denom,
+      size,
+    }: {
+      accountId: string
+      denom: string
+      size: SignedDecimal
+    },
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
+  closePosition: (
+    {
+      accountId,
+      denom,
+    }: {
+      accountId: string
+      denom: string
+    },
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
+}
+export class MarsPerpsClient extends MarsPerpsQueryClient implements MarsPerpsInterface {
+  client: SigningCosmWasmClient
+  sender: string
+  contractAddress: string
+
+  constructor(client: SigningCosmWasmClient, sender: string, contractAddress: string) {
+    super(client, contractAddress)
+    this.client = client
+    this.sender = sender
+    this.contractAddress = contractAddress
+    this.updateOwner = this.updateOwner.bind(this)
+    this.initDenom = this.initDenom.bind(this)
+    this.enableDenom = this.enableDenom.bind(this)
+    this.disableDenom = this.disableDenom.bind(this)
+    this.deposit = this.deposit.bind(this)
+    this.unlock = this.unlock.bind(this)
+    this.withdraw = this.withdraw.bind(this)
+    this.openPosition = this.openPosition.bind(this)
+    this.closePosition = this.closePosition.bind(this)
+  }
+
+  updateOwner = async (
+    ownerUpdate: OwnerUpdate,
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        update_owner: ownerUpdate,
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
+  initDenom = async (
+    {
+      denom,
+      maxFundingVelocity,
+      skewScale,
+    }: {
+      denom: string
+      maxFundingVelocity: Decimal
+      skewScale: Decimal
+    },
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        init_denom: {
+          denom,
+          max_funding_velocity: maxFundingVelocity,
+          skew_scale: skewScale,
+        },
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
+  enableDenom = async (
+    {
+      denom,
+    }: {
+      denom: string
+    },
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        enable_denom: {
+          denom,
+        },
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
+  disableDenom = async (
+    {
+      denom,
+    }: {
+      denom: string
+    },
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        disable_denom: {
+          denom,
+        },
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
+  deposit = async (
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        deposit: {},
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
+  unlock = async (
+    {
+      shares,
+    }: {
+      shares: Uint128
+    },
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        unlock: {
+          shares,
+        },
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
+  withdraw = async (
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        withdraw: {},
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
+  openPosition = async (
+    {
+      accountId,
+      denom,
+      size,
+    }: {
+      accountId: string
+      denom: string
+      size: SignedDecimal
+    },
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        open_position: {
+          account_id: accountId,
+          denom,
+          size,
+        },
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
+  closePosition = async (
+    {
+      accountId,
+      denom,
+    }: {
+      accountId: string
+      denom: string
+    },
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        close_position: {
+          account_id: accountId,
+          denom,
+        },
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
+}
diff --git a/src/types/generated/mars-perps/MarsPerps.react-query.ts b/src/types/generated/mars-perps/MarsPerps.react-query.ts
new file mode 100644
index 00000000..d7e7c2a0
--- /dev/null
+++ b/src/types/generated/mars-perps/MarsPerps.react-query.ts
@@ -0,0 +1,555 @@
+// @ts-nocheck
+/**
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
+ * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
+ */
+
+import { UseQueryOptions, useQuery, useMutation, UseMutationOptions } from '@tanstack/react-query'
+import { ExecuteResult } from '@cosmjs/cosmwasm-stargate'
+import { StdFee } from '@cosmjs/amino'
+import {
+  Decimal,
+  Uint128,
+  OracleBaseForString,
+  ParamsBaseForString,
+  InstantiateMsg,
+  ExecuteMsg,
+  OwnerUpdate,
+  SignedDecimal,
+  QueryMsg,
+  ConfigForString,
+  DenomStateResponse,
+  Funding,
+  ArrayOfDenomStateResponse,
+  DepositResponse,
+  ArrayOfDepositResponse,
+  TradingFee,
+  Coin,
+  OwnerResponse,
+  PerpDenomState,
+  DenomPnlValues,
+  PnL,
+  PositionResponse,
+  PerpPosition,
+  PositionPnl,
+  PnlCoins,
+  PnlValues,
+  ArrayOfPositionResponse,
+  PositionsByAccountResponse,
+  ArrayOfUnlockState,
+  UnlockState,
+  VaultState,
+} from './MarsPerps.types'
+import { MarsPerpsQueryClient, MarsPerpsClient } from './MarsPerps.client'
+export const marsPerpsQueryKeys = {
+  contract: [
+    {
+      contract: 'marsPerps',
+    },
+  ] as const,
+  address: (contractAddress: string | undefined) =>
+    [{ ...marsPerpsQueryKeys.contract[0], address: contractAddress }] as const,
+  owner: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [{ ...marsPerpsQueryKeys.address(contractAddress)[0], method: 'owner', args }] as const,
+  config: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [{ ...marsPerpsQueryKeys.address(contractAddress)[0], method: 'config', args }] as const,
+  vaultState: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [{ ...marsPerpsQueryKeys.address(contractAddress)[0], method: 'vault_state', args }] as const,
+  denomState: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [{ ...marsPerpsQueryKeys.address(contractAddress)[0], method: 'denom_state', args }] as const,
+  perpDenomState: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [
+      { ...marsPerpsQueryKeys.address(contractAddress)[0], method: 'perp_denom_state', args },
+    ] as const,
+  denomStates: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [{ ...marsPerpsQueryKeys.address(contractAddress)[0], method: 'denom_states', args }] as const,
+  deposit: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [{ ...marsPerpsQueryKeys.address(contractAddress)[0], method: 'deposit', args }] as const,
+  deposits: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [{ ...marsPerpsQueryKeys.address(contractAddress)[0], method: 'deposits', args }] as const,
+  unlocks: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [{ ...marsPerpsQueryKeys.address(contractAddress)[0], method: 'unlocks', args }] as const,
+  position: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [{ ...marsPerpsQueryKeys.address(contractAddress)[0], method: 'position', args }] as const,
+  positions: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [{ ...marsPerpsQueryKeys.address(contractAddress)[0], method: 'positions', args }] as const,
+  positionsByAccount: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [
+      { ...marsPerpsQueryKeys.address(contractAddress)[0], method: 'positions_by_account', args },
+    ] as const,
+  totalPnl: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [{ ...marsPerpsQueryKeys.address(contractAddress)[0], method: 'total_pnl', args }] as const,
+  openingFee: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [{ ...marsPerpsQueryKeys.address(contractAddress)[0], method: 'opening_fee', args }] as const,
+}
+export interface MarsPerpsReactQuery<TResponse, TData = TResponse> {
+  client: MarsPerpsQueryClient | undefined
+  options?: Omit<
+    UseQueryOptions<TResponse, Error, TData>,
+    "'queryKey' | 'queryFn' | 'initialData'"
+  > & {
+    initialData?: undefined
+  }
+}
+export interface MarsPerpsOpeningFeeQuery<TData> extends MarsPerpsReactQuery<TradingFee, TData> {
+  args: {
+    denom: string
+    size: SignedDecimal
+  }
+}
+export function useMarsPerpsOpeningFeeQuery<TData = TradingFee>({
+  client,
+  args,
+  options,
+}: MarsPerpsOpeningFeeQuery<TData>) {
+  return useQuery<TradingFee, Error, TData>(
+    marsPerpsQueryKeys.openingFee(client?.contractAddress, args),
+    () =>
+      client
+        ? client.openingFee({
+            denom: args.denom,
+            size: args.size,
+          })
+        : Promise.reject(new Error('Invalid client')),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsPerpsTotalPnlQuery<TData> extends MarsPerpsReactQuery<SignedDecimal, TData> {}
+export function useMarsPerpsTotalPnlQuery<TData = SignedDecimal>({
+  client,
+  options,
+}: MarsPerpsTotalPnlQuery<TData>) {
+  return useQuery<SignedDecimal, Error, TData>(
+    marsPerpsQueryKeys.totalPnl(client?.contractAddress),
+    () => (client ? client.totalPnl() : Promise.reject(new Error('Invalid client'))),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsPerpsPositionsByAccountQuery<TData>
+  extends MarsPerpsReactQuery<PositionsByAccountResponse, TData> {
+  args: {
+    accountId: string
+  }
+}
+export function useMarsPerpsPositionsByAccountQuery<TData = PositionsByAccountResponse>({
+  client,
+  args,
+  options,
+}: MarsPerpsPositionsByAccountQuery<TData>) {
+  return useQuery<PositionsByAccountResponse, Error, TData>(
+    marsPerpsQueryKeys.positionsByAccount(client?.contractAddress, args),
+    () =>
+      client
+        ? client.positionsByAccount({
+            accountId: args.accountId,
+          })
+        : Promise.reject(new Error('Invalid client')),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsPerpsPositionsQuery<TData>
+  extends MarsPerpsReactQuery<ArrayOfPositionResponse, TData> {
+  args: {
+    limit?: number
+    startAfter?: string[][]
+  }
+}
+export function useMarsPerpsPositionsQuery<TData = ArrayOfPositionResponse>({
+  client,
+  args,
+  options,
+}: MarsPerpsPositionsQuery<TData>) {
+  return useQuery<ArrayOfPositionResponse, Error, TData>(
+    marsPerpsQueryKeys.positions(client?.contractAddress, args),
+    () =>
+      client
+        ? client.positions({
+            limit: args.limit,
+            startAfter: args.startAfter,
+          })
+        : Promise.reject(new Error('Invalid client')),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsPerpsPositionQuery<TData>
+  extends MarsPerpsReactQuery<PositionResponse, TData> {
+  args: {
+    accountId: string
+    denom: string
+  }
+}
+export function useMarsPerpsPositionQuery<TData = PositionResponse>({
+  client,
+  args,
+  options,
+}: MarsPerpsPositionQuery<TData>) {
+  return useQuery<PositionResponse, Error, TData>(
+    marsPerpsQueryKeys.position(client?.contractAddress, args),
+    () =>
+      client
+        ? client.position({
+            accountId: args.accountId,
+            denom: args.denom,
+          })
+        : Promise.reject(new Error('Invalid client')),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsPerpsUnlocksQuery<TData>
+  extends MarsPerpsReactQuery<ArrayOfUnlockState, TData> {
+  args: {
+    depositor: string
+  }
+}
+export function useMarsPerpsUnlocksQuery<TData = ArrayOfUnlockState>({
+  client,
+  args,
+  options,
+}: MarsPerpsUnlocksQuery<TData>) {
+  return useQuery<ArrayOfUnlockState, Error, TData>(
+    marsPerpsQueryKeys.unlocks(client?.contractAddress, args),
+    () =>
+      client
+        ? client.unlocks({
+            depositor: args.depositor,
+          })
+        : Promise.reject(new Error('Invalid client')),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsPerpsDepositsQuery<TData>
+  extends MarsPerpsReactQuery<ArrayOfDepositResponse, TData> {
+  args: {
+    limit?: number
+    startAfter?: string
+  }
+}
+export function useMarsPerpsDepositsQuery<TData = ArrayOfDepositResponse>({
+  client,
+  args,
+  options,
+}: MarsPerpsDepositsQuery<TData>) {
+  return useQuery<ArrayOfDepositResponse, Error, TData>(
+    marsPerpsQueryKeys.deposits(client?.contractAddress, args),
+    () =>
+      client
+        ? client.deposits({
+            limit: args.limit,
+            startAfter: args.startAfter,
+          })
+        : Promise.reject(new Error('Invalid client')),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsPerpsDepositQuery<TData> extends MarsPerpsReactQuery<DepositResponse, TData> {
+  args: {
+    depositor: string
+  }
+}
+export function useMarsPerpsDepositQuery<TData = DepositResponse>({
+  client,
+  args,
+  options,
+}: MarsPerpsDepositQuery<TData>) {
+  return useQuery<DepositResponse, Error, TData>(
+    marsPerpsQueryKeys.deposit(client?.contractAddress, args),
+    () =>
+      client
+        ? client.deposit({
+            depositor: args.depositor,
+          })
+        : Promise.reject(new Error('Invalid client')),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsPerpsDenomStatesQuery<TData>
+  extends MarsPerpsReactQuery<ArrayOfDenomStateResponse, TData> {
+  args: {
+    limit?: number
+    startAfter?: string
+  }
+}
+export function useMarsPerpsDenomStatesQuery<TData = ArrayOfDenomStateResponse>({
+  client,
+  args,
+  options,
+}: MarsPerpsDenomStatesQuery<TData>) {
+  return useQuery<ArrayOfDenomStateResponse, Error, TData>(
+    marsPerpsQueryKeys.denomStates(client?.contractAddress, args),
+    () =>
+      client
+        ? client.denomStates({
+            limit: args.limit,
+            startAfter: args.startAfter,
+          })
+        : Promise.reject(new Error('Invalid client')),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsPerpsPerpDenomStateQuery<TData>
+  extends MarsPerpsReactQuery<PerpDenomState, TData> {
+  args: {
+    denom: string
+  }
+}
+export function useMarsPerpsPerpDenomStateQuery<TData = PerpDenomState>({
+  client,
+  args,
+  options,
+}: MarsPerpsPerpDenomStateQuery<TData>) {
+  return useQuery<PerpDenomState, Error, TData>(
+    marsPerpsQueryKeys.perpDenomState(client?.contractAddress, args),
+    () =>
+      client
+        ? client.perpDenomState({
+            denom: args.denom,
+          })
+        : Promise.reject(new Error('Invalid client')),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsPerpsDenomStateQuery<TData>
+  extends MarsPerpsReactQuery<DenomStateResponse, TData> {
+  args: {
+    denom: string
+  }
+}
+export function useMarsPerpsDenomStateQuery<TData = DenomStateResponse>({
+  client,
+  args,
+  options,
+}: MarsPerpsDenomStateQuery<TData>) {
+  return useQuery<DenomStateResponse, Error, TData>(
+    marsPerpsQueryKeys.denomState(client?.contractAddress, args),
+    () =>
+      client
+        ? client.denomState({
+            denom: args.denom,
+          })
+        : Promise.reject(new Error('Invalid client')),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsPerpsVaultStateQuery<TData> extends MarsPerpsReactQuery<VaultState, TData> {}
+export function useMarsPerpsVaultStateQuery<TData = VaultState>({
+  client,
+  options,
+}: MarsPerpsVaultStateQuery<TData>) {
+  return useQuery<VaultState, Error, TData>(
+    marsPerpsQueryKeys.vaultState(client?.contractAddress),
+    () => (client ? client.vaultState() : Promise.reject(new Error('Invalid client'))),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsPerpsConfigQuery<TData> extends MarsPerpsReactQuery<ConfigForString, TData> {}
+export function useMarsPerpsConfigQuery<TData = ConfigForString>({
+  client,
+  options,
+}: MarsPerpsConfigQuery<TData>) {
+  return useQuery<ConfigForString, Error, TData>(
+    marsPerpsQueryKeys.config(client?.contractAddress),
+    () => (client ? client.config() : Promise.reject(new Error('Invalid client'))),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsPerpsOwnerQuery<TData> extends MarsPerpsReactQuery<OwnerResponse, TData> {}
+export function useMarsPerpsOwnerQuery<TData = OwnerResponse>({
+  client,
+  options,
+}: MarsPerpsOwnerQuery<TData>) {
+  return useQuery<OwnerResponse, Error, TData>(
+    marsPerpsQueryKeys.owner(client?.contractAddress),
+    () => (client ? client.owner() : Promise.reject(new Error('Invalid client'))),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsPerpsClosePositionMutation {
+  client: MarsPerpsClient
+  msg: {
+    accountId: string
+    denom: string
+  }
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsPerpsClosePositionMutation(
+  options?: Omit<
+    UseMutationOptions<ExecuteResult, Error, MarsPerpsClosePositionMutation>,
+    'mutationFn'
+  >,
+) {
+  return useMutation<ExecuteResult, Error, MarsPerpsClosePositionMutation>(
+    ({ client, msg, args: { fee, memo, funds } = {} }) =>
+      client.closePosition(msg, fee, memo, funds),
+    options,
+  )
+}
+export interface MarsPerpsOpenPositionMutation {
+  client: MarsPerpsClient
+  msg: {
+    accountId: string
+    denom: string
+    size: SignedDecimal
+  }
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsPerpsOpenPositionMutation(
+  options?: Omit<
+    UseMutationOptions<ExecuteResult, Error, MarsPerpsOpenPositionMutation>,
+    'mutationFn'
+  >,
+) {
+  return useMutation<ExecuteResult, Error, MarsPerpsOpenPositionMutation>(
+    ({ client, msg, args: { fee, memo, funds } = {} }) =>
+      client.openPosition(msg, fee, memo, funds),
+    options,
+  )
+}
+export interface MarsPerpsWithdrawMutation {
+  client: MarsPerpsClient
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsPerpsWithdrawMutation(
+  options?: Omit<UseMutationOptions<ExecuteResult, Error, MarsPerpsWithdrawMutation>, 'mutationFn'>,
+) {
+  return useMutation<ExecuteResult, Error, MarsPerpsWithdrawMutation>(
+    ({ client, args: { fee, memo, funds } = {} }) => client.withdraw(fee, memo, funds),
+    options,
+  )
+}
+export interface MarsPerpsUnlockMutation {
+  client: MarsPerpsClient
+  msg: {
+    shares: Uint128
+  }
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsPerpsUnlockMutation(
+  options?: Omit<UseMutationOptions<ExecuteResult, Error, MarsPerpsUnlockMutation>, 'mutationFn'>,
+) {
+  return useMutation<ExecuteResult, Error, MarsPerpsUnlockMutation>(
+    ({ client, msg, args: { fee, memo, funds } = {} }) => client.unlock(msg, fee, memo, funds),
+    options,
+  )
+}
+export interface MarsPerpsDepositMutation {
+  client: MarsPerpsClient
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsPerpsDepositMutation(
+  options?: Omit<UseMutationOptions<ExecuteResult, Error, MarsPerpsDepositMutation>, 'mutationFn'>,
+) {
+  return useMutation<ExecuteResult, Error, MarsPerpsDepositMutation>(
+    ({ client, args: { fee, memo, funds } = {} }) => client.deposit(fee, memo, funds),
+    options,
+  )
+}
+export interface MarsPerpsDisableDenomMutation {
+  client: MarsPerpsClient
+  msg: {
+    denom: string
+  }
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsPerpsDisableDenomMutation(
+  options?: Omit<
+    UseMutationOptions<ExecuteResult, Error, MarsPerpsDisableDenomMutation>,
+    'mutationFn'
+  >,
+) {
+  return useMutation<ExecuteResult, Error, MarsPerpsDisableDenomMutation>(
+    ({ client, msg, args: { fee, memo, funds } = {} }) =>
+      client.disableDenom(msg, fee, memo, funds),
+    options,
+  )
+}
+export interface MarsPerpsEnableDenomMutation {
+  client: MarsPerpsClient
+  msg: {
+    denom: string
+  }
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsPerpsEnableDenomMutation(
+  options?: Omit<
+    UseMutationOptions<ExecuteResult, Error, MarsPerpsEnableDenomMutation>,
+    'mutationFn'
+  >,
+) {
+  return useMutation<ExecuteResult, Error, MarsPerpsEnableDenomMutation>(
+    ({ client, msg, args: { fee, memo, funds } = {} }) => client.enableDenom(msg, fee, memo, funds),
+    options,
+  )
+}
+export interface MarsPerpsInitDenomMutation {
+  client: MarsPerpsClient
+  msg: {
+    denom: string
+    maxFundingVelocity: Decimal
+    skewScale: Decimal
+  }
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsPerpsInitDenomMutation(
+  options?: Omit<
+    UseMutationOptions<ExecuteResult, Error, MarsPerpsInitDenomMutation>,
+    'mutationFn'
+  >,
+) {
+  return useMutation<ExecuteResult, Error, MarsPerpsInitDenomMutation>(
+    ({ client, msg, args: { fee, memo, funds } = {} }) => client.initDenom(msg, fee, memo, funds),
+    options,
+  )
+}
+export interface MarsPerpsUpdateOwnerMutation {
+  client: MarsPerpsClient
+  msg: OwnerUpdate
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsPerpsUpdateOwnerMutation(
+  options?: Omit<
+    UseMutationOptions<ExecuteResult, Error, MarsPerpsUpdateOwnerMutation>,
+    'mutationFn'
+  >,
+) {
+  return useMutation<ExecuteResult, Error, MarsPerpsUpdateOwnerMutation>(
+    ({ client, msg, args: { fee, memo, funds } = {} }) => client.updateOwner(msg, fee, memo, funds),
+    options,
+  )
+}
diff --git a/src/types/generated/mars-perps/MarsPerps.types.ts b/src/types/generated/mars-perps/MarsPerps.types.ts
new file mode 100644
index 00000000..e6fcb7bf
--- /dev/null
+++ b/src/types/generated/mars-perps/MarsPerps.types.ts
@@ -0,0 +1,265 @@
+// @ts-nocheck
+/**
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
+ * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
+ */
+
+export type Decimal = string
+export type Uint128 = string
+export type OracleBaseForString = string
+export type ParamsBaseForString = string
+export interface InstantiateMsg {
+  base_denom: string
+  closing_fee_rate: Decimal
+  cooldown_period: number
+  credit_manager: string
+  max_position_in_base_denom?: Uint128 | null
+  min_position_in_base_denom: Uint128
+  opening_fee_rate: Decimal
+  oracle: OracleBaseForString
+  params: ParamsBaseForString
+}
+export type ExecuteMsg =
+  | {
+      update_owner: OwnerUpdate
+    }
+  | {
+      init_denom: {
+        denom: string
+        max_funding_velocity: Decimal
+        skew_scale: Decimal
+      }
+    }
+  | {
+      enable_denom: {
+        denom: string
+      }
+    }
+  | {
+      disable_denom: {
+        denom: string
+      }
+    }
+  | {
+      deposit: {}
+    }
+  | {
+      unlock: {
+        shares: Uint128
+      }
+    }
+  | {
+      withdraw: {}
+    }
+  | {
+      open_position: {
+        account_id: string
+        denom: string
+        size: SignedDecimal
+      }
+    }
+  | {
+      close_position: {
+        account_id: string
+        denom: string
+      }
+    }
+export type OwnerUpdate =
+  | {
+      propose_new_owner: {
+        proposed: string
+      }
+    }
+  | 'clear_proposed'
+  | 'accept_proposed'
+  | 'abolish_owner_role'
+  | {
+      set_emergency_owner: {
+        emergency_owner: string
+      }
+    }
+  | 'clear_emergency_owner'
+export interface SignedDecimal {
+  abs: Decimal
+  negative: boolean
+  [k: string]: unknown
+}
+export type QueryMsg =
+  | {
+      owner: {}
+    }
+  | {
+      config: {}
+    }
+  | {
+      vault_state: {}
+    }
+  | {
+      denom_state: {
+        denom: string
+      }
+    }
+  | {
+      perp_denom_state: {
+        denom: string
+      }
+    }
+  | {
+      denom_states: {
+        limit?: number | null
+        start_after?: string | null
+      }
+    }
+  | {
+      deposit: {
+        depositor: string
+      }
+    }
+  | {
+      deposits: {
+        limit?: number | null
+        start_after?: string | null
+      }
+    }
+  | {
+      unlocks: {
+        depositor: string
+      }
+    }
+  | {
+      position: {
+        account_id: string
+        denom: string
+      }
+    }
+  | {
+      positions: {
+        limit?: number | null
+        start_after?: [string, string] | null
+      }
+    }
+  | {
+      positions_by_account: {
+        account_id: string
+      }
+    }
+  | {
+      total_pnl: {}
+    }
+  | {
+      opening_fee: {
+        denom: string
+        size: SignedDecimal
+      }
+    }
+export interface ConfigForString {
+  base_denom: string
+  closing_fee_rate: Decimal
+  cooldown_period: number
+  credit_manager: string
+  max_position_in_base_denom?: Uint128 | null
+  min_position_in_base_denom: Uint128
+  opening_fee_rate: Decimal
+  oracle: OracleBaseForString
+  params: ParamsBaseForString
+}
+export interface DenomStateResponse {
+  denom: string
+  enabled: boolean
+  funding: Funding
+  last_updated: number
+  total_cost_base: SignedDecimal
+}
+export interface Funding {
+  last_funding_accrued_per_unit_in_base_denom: SignedDecimal
+  last_funding_rate: SignedDecimal
+  max_funding_velocity: Decimal
+  skew_scale: Decimal
+}
+export type ArrayOfDenomStateResponse = DenomStateResponse[]
+export interface DepositResponse {
+  amount: Uint128
+  depositor: string
+  shares: Uint128
+}
+export type ArrayOfDepositResponse = DepositResponse[]
+export interface TradingFee {
+  fee: Coin
+  rate: Decimal
+}
+export interface Coin {
+  amount: Uint128
+  denom: string
+  [k: string]: unknown
+}
+export interface OwnerResponse {
+  abolished: boolean
+  emergency_owner?: string | null
+  initialized: boolean
+  owner?: string | null
+  proposed?: string | null
+}
+export interface PerpDenomState {
+  denom: string
+  enabled: boolean
+  pnl_values: DenomPnlValues
+  rate: SignedDecimal
+  total_entry_cost: SignedDecimal
+  total_entry_funding: SignedDecimal
+}
+export interface DenomPnlValues {
+  accrued_funding: SignedDecimal
+  pnl: SignedDecimal
+  price_pnl: SignedDecimal
+}
+export type PnL =
+  | 'break_even'
+  | {
+      profit: Coin
+    }
+  | {
+      loss: Coin
+    }
+export interface PositionResponse {
+  account_id: string
+  position: PerpPosition
+}
+export interface PerpPosition {
+  base_denom: string
+  closing_fee_rate: Decimal
+  current_price: Decimal
+  denom: string
+  entry_price: Decimal
+  pnl: PositionPnl
+  size: SignedDecimal
+}
+export interface PositionPnl {
+  coins: PnlCoins
+  values: PnlValues
+}
+export interface PnlCoins {
+  closing_fee: Coin
+  pnl: PnL
+}
+export interface PnlValues {
+  accrued_funding: SignedDecimal
+  closing_fee: SignedDecimal
+  pnl: SignedDecimal
+  price_pnl: SignedDecimal
+}
+export type ArrayOfPositionResponse = PositionResponse[]
+export interface PositionsByAccountResponse {
+  account_id: string
+  positions: PerpPosition[]
+}
+export type ArrayOfUnlockState = UnlockState[]
+export interface UnlockState {
+  amount: Uint128
+  cooldown_end: number
+  created_at: number
+}
+export interface VaultState {
+  total_liquidity: Uint128
+  total_shares: Uint128
+}
diff --git a/src/types/generated/mars-perps/bundle.ts b/src/types/generated/mars-perps/bundle.ts
new file mode 100644
index 00000000..2b382bc1
--- /dev/null
+++ b/src/types/generated/mars-perps/bundle.ts
@@ -0,0 +1,13 @@
+// @ts-nocheck
+/**
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
+ * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
+ */
+
+import * as _24 from './MarsPerps.types'
+import * as _25 from './MarsPerps.client'
+import * as _26 from './MarsPerps.react-query'
+export namespace contracts {
+  export const MarsPerps = { ..._24, ..._25, ..._26 }
+}
diff --git a/src/types/generated/mars-red-bank/MarsRedBank.client.ts b/src/types/generated/mars-red-bank/MarsRedBank.client.ts
index a29545a4..7db690bd 100644
--- a/src/types/generated/mars-red-bank/MarsRedBank.client.ts
+++ b/src/types/generated/mars-red-bank/MarsRedBank.client.ts
@@ -1,6 +1,6 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.30.1.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
@@ -8,12 +8,13 @@
 import { CosmWasmClient, SigningCosmWasmClient, ExecuteResult } from '@cosmjs/cosmwasm-stargate'
 import { Coin, StdFee } from '@cosmjs/amino'
 import {
-  Decimal,
   InstantiateMsg,
   CreateOrUpdateConfig,
   ExecuteMsg,
   OwnerUpdate,
+  Decimal,
   Uint128,
+  MigrateV1ToV2,
   InitOrUpdateAssetParams,
   InterestRateModel,
   QueryMsg,
@@ -24,6 +25,8 @@ import {
   ArrayOfUncollateralizedLoanLimitResponse,
   UserCollateralResponse,
   ArrayOfUserCollateralResponse,
+  PaginationResponseForUserCollateralResponse,
+  Metadata,
   UserDebtResponse,
   ArrayOfUserDebtResponse,
   UserHealthStatus,
@@ -67,22 +70,50 @@ export interface MarsRedBankReadOnlyInterface {
     user: string
   }) => Promise<ArrayOfUserDebtResponse>
   userCollateral: ({
+    accountId,
     denom,
     user,
   }: {
+    accountId?: string
     denom: string
     user: string
   }) => Promise<UserCollateralResponse>
   userCollaterals: ({
+    accountId,
     limit,
     startAfter,
     user,
   }: {
+    accountId?: string
     limit?: number
     startAfter?: string
     user: string
   }) => Promise<ArrayOfUserCollateralResponse>
-  userPosition: ({ user }: { user: string }) => Promise<UserPositionResponse>
+  userCollateralsV2: ({
+    accountId,
+    limit,
+    startAfter,
+    user,
+  }: {
+    accountId?: string
+    limit?: number
+    startAfter?: string
+    user: string
+  }) => Promise<PaginationResponseForUserCollateralResponse>
+  userPosition: ({
+    accountId,
+    user,
+  }: {
+    accountId?: string
+    user: string
+  }) => Promise<UserPositionResponse>
+  userPositionLiquidationPricing: ({
+    accountId,
+    user,
+  }: {
+    accountId?: string
+    user: string
+  }) => Promise<UserPositionResponse>
   scaledLiquidityAmount: ({ amount, denom }: { amount: Uint128; denom: string }) => Promise<Uint128>
   scaledDebtAmount: ({ amount, denom }: { amount: Uint128; denom: string }) => Promise<Uint128>
   underlyingLiquidityAmount: ({
@@ -116,7 +147,9 @@ export class MarsRedBankQueryClient implements MarsRedBankReadOnlyInterface {
     this.userDebts = this.userDebts.bind(this)
     this.userCollateral = this.userCollateral.bind(this)
     this.userCollaterals = this.userCollaterals.bind(this)
+    this.userCollateralsV2 = this.userCollateralsV2.bind(this)
     this.userPosition = this.userPosition.bind(this)
+    this.userPositionLiquidationPricing = this.userPositionLiquidationPricing.bind(this)
     this.scaledLiquidityAmount = this.scaledLiquidityAmount.bind(this)
     this.scaledDebtAmount = this.scaledDebtAmount.bind(this)
     this.underlyingLiquidityAmount = this.underlyingLiquidityAmount.bind(this)
@@ -212,39 +245,86 @@ export class MarsRedBankQueryClient implements MarsRedBankReadOnlyInterface {
     })
   }
   userCollateral = async ({
+    accountId,
     denom,
     user,
   }: {
+    accountId?: string
     denom: string
     user: string
   }): Promise<UserCollateralResponse> => {
     return this.client.queryContractSmart(this.contractAddress, {
       user_collateral: {
+        account_id: accountId,
         denom,
         user,
       },
     })
   }
   userCollaterals = async ({
+    accountId,
     limit,
     startAfter,
     user,
   }: {
+    accountId?: string
     limit?: number
     startAfter?: string
     user: string
   }): Promise<ArrayOfUserCollateralResponse> => {
     return this.client.queryContractSmart(this.contractAddress, {
       user_collaterals: {
+        account_id: accountId,
         limit,
         start_after: startAfter,
         user,
       },
     })
   }
-  userPosition = async ({ user }: { user: string }): Promise<UserPositionResponse> => {
+  userCollateralsV2 = async ({
+    accountId,
+    limit,
+    startAfter,
+    user,
+  }: {
+    accountId?: string
+    limit?: number
+    startAfter?: string
+    user: string
+  }): Promise<PaginationResponseForUserCollateralResponse> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      user_collaterals_v2: {
+        account_id: accountId,
+        limit,
+        start_after: startAfter,
+        user,
+      },
+    })
+  }
+  userPosition = async ({
+    accountId,
+    user,
+  }: {
+    accountId?: string
+    user: string
+  }): Promise<UserPositionResponse> => {
     return this.client.queryContractSmart(this.contractAddress, {
       user_position: {
+        account_id: accountId,
+        user,
+      },
+    })
+  }
+  userPositionLiquidationPricing = async ({
+    accountId,
+    user,
+  }: {
+    accountId?: string
+    user: string
+  }): Promise<UserPositionResponse> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      user_position_liquidation_pricing: {
+        account_id: accountId,
         user,
       },
     })
@@ -365,8 +445,10 @@ export interface MarsRedBankInterface extends MarsRedBankReadOnlyInterface {
   ) => Promise<ExecuteResult>
   deposit: (
     {
+      accountId,
       onBehalfOf,
     }: {
+      accountId?: string
       onBehalfOf?: string
     },
     fee?: number | StdFee | 'auto',
@@ -375,12 +457,16 @@ export interface MarsRedBankInterface extends MarsRedBankReadOnlyInterface {
   ) => Promise<ExecuteResult>
   withdraw: (
     {
+      accountId,
       amount,
       denom,
+      liquidationRelated,
       recipient,
     }: {
+      accountId?: string
       amount?: Uint128
       denom: string
+      liquidationRelated?: boolean
       recipient?: string
     },
     fee?: number | StdFee | 'auto',
@@ -437,6 +523,12 @@ export interface MarsRedBankInterface extends MarsRedBankReadOnlyInterface {
     memo?: string,
     _funds?: Coin[],
   ) => Promise<ExecuteResult>
+  migrate: (
+    migrateV1ToV2: MigrateV1ToV2,
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
 }
 export class MarsRedBankClient extends MarsRedBankQueryClient implements MarsRedBankInterface {
   client: SigningCosmWasmClient
@@ -459,6 +551,7 @@ export class MarsRedBankClient extends MarsRedBankQueryClient implements MarsRed
     this.repay = this.repay.bind(this)
     this.liquidate = this.liquidate.bind(this)
     this.updateAssetCollateralStatus = this.updateAssetCollateralStatus.bind(this)
+    this.migrate = this.migrate.bind(this)
   }
 
   updateOwner = async (
@@ -584,8 +677,10 @@ export class MarsRedBankClient extends MarsRedBankQueryClient implements MarsRed
   }
   deposit = async (
     {
+      accountId,
       onBehalfOf,
     }: {
+      accountId?: string
       onBehalfOf?: string
     },
     fee: number | StdFee | 'auto' = 'auto',
@@ -597,6 +692,7 @@ export class MarsRedBankClient extends MarsRedBankQueryClient implements MarsRed
       this.contractAddress,
       {
         deposit: {
+          account_id: accountId,
           on_behalf_of: onBehalfOf,
         },
       },
@@ -607,12 +703,16 @@ export class MarsRedBankClient extends MarsRedBankQueryClient implements MarsRed
   }
   withdraw = async (
     {
+      accountId,
       amount,
       denom,
+      liquidationRelated,
       recipient,
     }: {
+      accountId?: string
       amount?: Uint128
       denom: string
+      liquidationRelated?: boolean
       recipient?: string
     },
     fee: number | StdFee | 'auto' = 'auto',
@@ -624,8 +724,10 @@ export class MarsRedBankClient extends MarsRedBankQueryClient implements MarsRed
       this.contractAddress,
       {
         withdraw: {
+          account_id: accountId,
           amount,
           denom,
+          liquidation_related: liquidationRelated,
           recipient,
         },
       },
@@ -741,4 +843,21 @@ export class MarsRedBankClient extends MarsRedBankQueryClient implements MarsRed
       _funds,
     )
   }
+  migrate = async (
+    migrateV1ToV2: MigrateV1ToV2,
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        migrate: migrateV1ToV2,
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
 }
diff --git a/src/types/generated/mars-red-bank/MarsRedBank.react-query.ts b/src/types/generated/mars-red-bank/MarsRedBank.react-query.ts
index 394377bf..244993df 100644
--- a/src/types/generated/mars-red-bank/MarsRedBank.react-query.ts
+++ b/src/types/generated/mars-red-bank/MarsRedBank.react-query.ts
@@ -1,6 +1,6 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.30.1.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
@@ -9,12 +9,13 @@ import { UseQueryOptions, useQuery, useMutation, UseMutationOptions } from '@tan
 import { ExecuteResult } from '@cosmjs/cosmwasm-stargate'
 import { StdFee, Coin } from '@cosmjs/amino'
 import {
-  Decimal,
   InstantiateMsg,
   CreateOrUpdateConfig,
   ExecuteMsg,
   OwnerUpdate,
+  Decimal,
   Uint128,
+  MigrateV1ToV2,
   InitOrUpdateAssetParams,
   InterestRateModel,
   QueryMsg,
@@ -25,6 +26,8 @@ import {
   ArrayOfUncollateralizedLoanLimitResponse,
   UserCollateralResponse,
   ArrayOfUserCollateralResponse,
+  PaginationResponseForUserCollateralResponse,
+  Metadata,
   UserDebtResponse,
   ArrayOfUserDebtResponse,
   UserHealthStatus,
@@ -79,10 +82,25 @@ export const marsRedBankQueryKeys = {
     [
       { ...marsRedBankQueryKeys.address(contractAddress)[0], method: 'user_collaterals', args },
     ] as const,
+  userCollateralsV2: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [
+      { ...marsRedBankQueryKeys.address(contractAddress)[0], method: 'user_collaterals_v2', args },
+    ] as const,
   userPosition: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
     [
       { ...marsRedBankQueryKeys.address(contractAddress)[0], method: 'user_position', args },
     ] as const,
+  userPositionLiquidationPricing: (
+    contractAddress: string | undefined,
+    args?: Record<string, unknown>,
+  ) =>
+    [
+      {
+        ...marsRedBankQueryKeys.address(contractAddress)[0],
+        method: 'user_position_liquidation_pricing',
+        args,
+      },
+    ] as const,
   scaledLiquidityAmount: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
     [
       {
@@ -220,9 +238,34 @@ export function useMarsRedBankScaledLiquidityAmountQuery<TData = Uint128>({
     { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
   )
 }
+export interface MarsRedBankUserPositionLiquidationPricingQuery<TData>
+  extends MarsRedBankReactQuery<UserPositionResponse, TData> {
+  args: {
+    accountId?: string
+    user: string
+  }
+}
+export function useMarsRedBankUserPositionLiquidationPricingQuery<TData = UserPositionResponse>({
+  client,
+  args,
+  options,
+}: MarsRedBankUserPositionLiquidationPricingQuery<TData>) {
+  return useQuery<UserPositionResponse, Error, TData>(
+    marsRedBankQueryKeys.userPositionLiquidationPricing(client?.contractAddress, args),
+    () =>
+      client
+        ? client.userPositionLiquidationPricing({
+            accountId: args.accountId,
+            user: args.user,
+          })
+        : Promise.reject(new Error('Invalid client')),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
 export interface MarsRedBankUserPositionQuery<TData>
   extends MarsRedBankReactQuery<UserPositionResponse, TData> {
   args: {
+    accountId?: string
     user: string
   }
 }
@@ -236,6 +279,33 @@ export function useMarsRedBankUserPositionQuery<TData = UserPositionResponse>({
     () =>
       client
         ? client.userPosition({
+            accountId: args.accountId,
+            user: args.user,
+          })
+        : Promise.reject(new Error('Invalid client')),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsRedBankUserCollateralsV2Query<TData>
+  extends MarsRedBankReactQuery<PaginationResponseForUserCollateralResponse, TData> {
+  args: {
+    accountId?: string
+    limit?: number
+    startAfter?: string
+    user: string
+  }
+}
+export function useMarsRedBankUserCollateralsV2Query<
+  TData = PaginationResponseForUserCollateralResponse,
+>({ client, args, options }: MarsRedBankUserCollateralsV2Query<TData>) {
+  return useQuery<PaginationResponseForUserCollateralResponse, Error, TData>(
+    marsRedBankQueryKeys.userCollateralsV2(client?.contractAddress, args),
+    () =>
+      client
+        ? client.userCollateralsV2({
+            accountId: args.accountId,
+            limit: args.limit,
+            startAfter: args.startAfter,
             user: args.user,
           })
         : Promise.reject(new Error('Invalid client')),
@@ -245,6 +315,7 @@ export function useMarsRedBankUserPositionQuery<TData = UserPositionResponse>({
 export interface MarsRedBankUserCollateralsQuery<TData>
   extends MarsRedBankReactQuery<ArrayOfUserCollateralResponse, TData> {
   args: {
+    accountId?: string
     limit?: number
     startAfter?: string
     user: string
@@ -260,6 +331,7 @@ export function useMarsRedBankUserCollateralsQuery<TData = ArrayOfUserCollateral
     () =>
       client
         ? client.userCollaterals({
+            accountId: args.accountId,
             limit: args.limit,
             startAfter: args.startAfter,
             user: args.user,
@@ -271,6 +343,7 @@ export function useMarsRedBankUserCollateralsQuery<TData = ArrayOfUserCollateral
 export interface MarsRedBankUserCollateralQuery<TData>
   extends MarsRedBankReactQuery<UserCollateralResponse, TData> {
   args: {
+    accountId?: string
     denom: string
     user: string
   }
@@ -285,6 +358,7 @@ export function useMarsRedBankUserCollateralQuery<TData = UserCollateralResponse
     () =>
       client
         ? client.userCollateral({
+            accountId: args.accountId,
             denom: args.denom,
             user: args.user,
           })
@@ -445,6 +519,26 @@ export function useMarsRedBankConfigQuery<TData = ConfigResponse>({
     { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
   )
 }
+export interface MarsRedBankMigrateMutation {
+  client: MarsRedBankClient
+  msg: MigrateV1ToV2
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsRedBankMigrateMutation(
+  options?: Omit<
+    UseMutationOptions<ExecuteResult, Error, MarsRedBankMigrateMutation>,
+    'mutationFn'
+  >,
+) {
+  return useMutation<ExecuteResult, Error, MarsRedBankMigrateMutation>(
+    ({ client, msg, args: { fee, memo, funds } = {} }) => client.migrate(msg, fee, memo, funds),
+    options,
+  )
+}
 export interface MarsRedBankUpdateAssetCollateralStatusMutation {
   client: MarsRedBankClient
   msg: {
@@ -536,8 +630,10 @@ export function useMarsRedBankBorrowMutation(
 export interface MarsRedBankWithdrawMutation {
   client: MarsRedBankClient
   msg: {
+    accountId?: string
     amount?: Uint128
     denom: string
+    liquidationRelated?: boolean
     recipient?: string
   }
   args?: {
@@ -560,6 +656,7 @@ export function useMarsRedBankWithdrawMutation(
 export interface MarsRedBankDepositMutation {
   client: MarsRedBankClient
   msg: {
+    accountId?: string
     onBehalfOf?: string
   }
   args?: {
diff --git a/src/types/generated/mars-red-bank/MarsRedBank.types.ts b/src/types/generated/mars-red-bank/MarsRedBank.types.ts
index 10a39d40..2b574363 100644
--- a/src/types/generated/mars-red-bank/MarsRedBank.types.ts
+++ b/src/types/generated/mars-red-bank/MarsRedBank.types.ts
@@ -1,18 +1,16 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.30.1.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
 
-export type Decimal = string
 export interface InstantiateMsg {
   config: CreateOrUpdateConfig
   owner: string
 }
 export interface CreateOrUpdateConfig {
   address_provider?: string | null
-  close_factor?: Decimal | null
 }
 export type ExecuteMsg =
   | {
@@ -44,13 +42,16 @@ export type ExecuteMsg =
     }
   | {
       deposit: {
+        account_id?: string | null
         on_behalf_of?: string | null
       }
     }
   | {
       withdraw: {
+        account_id?: string | null
         amount?: Uint128 | null
         denom: string
+        liquidation_related?: boolean | null
         recipient?: string | null
       }
     }
@@ -79,6 +80,9 @@ export type ExecuteMsg =
         enable: boolean
       }
     }
+  | {
+      migrate: MigrateV1ToV2
+    }
 export type OwnerUpdate =
   | {
       propose_new_owner: {
@@ -94,15 +98,19 @@ export type OwnerUpdate =
       }
     }
   | 'clear_emergency_owner'
+export type Decimal = string
 export type Uint128 = string
+export type MigrateV1ToV2 =
+  | {
+      collaterals: {
+        limit: number
+      }
+    }
+  | {
+      clear_v1_state: {}
+    }
 export interface InitOrUpdateAssetParams {
-  borrow_enabled?: boolean | null
-  deposit_cap?: Uint128 | null
-  deposit_enabled?: boolean | null
   interest_rate_model?: InterestRateModel | null
-  liquidation_bonus?: Decimal | null
-  liquidation_threshold?: Decimal | null
-  max_loan_to_value?: Decimal | null
   reserve_factor?: Decimal | null
 }
 export interface InterestRateModel {
@@ -154,12 +162,22 @@ export type QueryMsg =
     }
   | {
       user_collateral: {
+        account_id?: string | null
         denom: string
         user: string
       }
     }
   | {
       user_collaterals: {
+        account_id?: string | null
+        limit?: number | null
+        start_after?: string | null
+        user: string
+      }
+    }
+  | {
+      user_collaterals_v2: {
+        account_id?: string | null
         limit?: number | null
         start_after?: string | null
         user: string
@@ -167,6 +185,13 @@ export type QueryMsg =
     }
   | {
       user_position: {
+        account_id?: string | null
+        user: string
+      }
+    }
+  | {
+      user_position_liquidation_pricing: {
+        account_id?: string | null
         user: string
       }
     }
@@ -196,27 +221,19 @@ export type QueryMsg =
     }
 export interface ConfigResponse {
   address_provider: string
-  close_factor: Decimal
-  emergency_owner?: string | null
   owner?: string | null
   proposed_new_owner?: string | null
 }
 export interface Market {
-  borrow_enabled: boolean
   borrow_index: Decimal
   borrow_rate: Decimal
   collateral_total_scaled: Uint128
   debt_total_scaled: Uint128
   denom: string
-  deposit_cap: Uint128
-  deposit_enabled: boolean
   indexes_last_updated: number
   interest_rate_model: InterestRateModel
-  liquidation_bonus: Decimal
-  liquidation_threshold: Decimal
   liquidity_index: Decimal
   liquidity_rate: Decimal
-  max_loan_to_value: Decimal
   reserve_factor: Decimal
 }
 export type ArrayOfMarket = Market[]
@@ -232,6 +249,13 @@ export interface UserCollateralResponse {
   enabled: boolean
 }
 export type ArrayOfUserCollateralResponse = UserCollateralResponse[]
+export interface PaginationResponseForUserCollateralResponse {
+  data: UserCollateralResponse[]
+  metadata: Metadata
+}
+export interface Metadata {
+  has_more: boolean
+}
 export interface UserDebtResponse {
   amount: Uint128
   amount_scaled: Uint128
@@ -240,7 +264,7 @@ export interface UserDebtResponse {
 }
 export type ArrayOfUserDebtResponse = UserDebtResponse[]
 export type UserHealthStatus =
-  | 'not_borrowing'
+  | 'not_borrow'
   | {
       borrowing: {
         liq_threshold_hf: Decimal
diff --git a/src/types/generated/mars-red-bank/bundle.ts b/src/types/generated/mars-red-bank/bundle.ts
index 1277c55d..6ac9860f 100644
--- a/src/types/generated/mars-red-bank/bundle.ts
+++ b/src/types/generated/mars-red-bank/bundle.ts
@@ -1,13 +1,13 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.30.1.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
 
-import * as _12 from './MarsRedBank.types'
-import * as _13 from './MarsRedBank.client'
-import * as _14 from './MarsRedBank.react-query'
+import * as _27 from './MarsRedBank.types'
+import * as _28 from './MarsRedBank.client'
+import * as _29 from './MarsRedBank.react-query'
 export namespace contracts {
-  export const MarsRedBank = { ..._12, ..._13, ..._14 }
+  export const MarsRedBank = { ..._27, ..._28, ..._29 }
 }
diff --git a/src/types/generated/mars-rover-health-computer/MarsRoverHealthComputer.client.ts b/src/types/generated/mars-rover-health-computer/MarsRoverHealthComputer.client.ts
index 7975e367..03f98468 100644
--- a/src/types/generated/mars-rover-health-computer/MarsRoverHealthComputer.client.ts
+++ b/src/types/generated/mars-rover-health-computer/MarsRoverHealthComputer.client.ts
@@ -1,6 +1,6 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.33.0.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
@@ -11,6 +11,7 @@ import {
   Decimal,
   Uint128,
   AccountKind,
+  PnL,
   VaultPositionAmount,
   VaultAmount,
   VaultAmount1,
@@ -25,6 +26,11 @@ import {
   Positions,
   DebtAmount,
   Coin,
+  PerpPosition,
+  PositionPnl,
+  PnlCoins,
+  PnlValues,
+  SignedDecimal,
   VaultPosition,
   LockingVaultAmount,
   VaultUnlockingPosition,
diff --git a/src/types/generated/mars-rover-health-computer/MarsRoverHealthComputer.react-query.ts b/src/types/generated/mars-rover-health-computer/MarsRoverHealthComputer.react-query.ts
index eac6eec5..12490f8d 100644
--- a/src/types/generated/mars-rover-health-computer/MarsRoverHealthComputer.react-query.ts
+++ b/src/types/generated/mars-rover-health-computer/MarsRoverHealthComputer.react-query.ts
@@ -1,6 +1,6 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.33.0.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
@@ -11,6 +11,7 @@ import {
   Decimal,
   Uint128,
   AccountKind,
+  PnL,
   VaultPositionAmount,
   VaultAmount,
   VaultAmount1,
@@ -25,6 +26,11 @@ import {
   Positions,
   DebtAmount,
   Coin,
+  PerpPosition,
+  PositionPnl,
+  PnlCoins,
+  PnlValues,
+  SignedDecimal,
   VaultPosition,
   LockingVaultAmount,
   VaultUnlockingPosition,
diff --git a/src/types/generated/mars-rover-health-computer/MarsRoverHealthComputer.types.ts b/src/types/generated/mars-rover-health-computer/MarsRoverHealthComputer.types.ts
index 20dadd57..69139e1f 100644
--- a/src/types/generated/mars-rover-health-computer/MarsRoverHealthComputer.types.ts
+++ b/src/types/generated/mars-rover-health-computer/MarsRoverHealthComputer.types.ts
@@ -1,6 +1,6 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.33.0.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
@@ -20,6 +20,14 @@ export type Addr = string
 export type Decimal = string
 export type Uint128 = string
 export type AccountKind = 'default' | 'high_levered_strategy'
+export type PnL =
+  | 'break_even'
+  | {
+      profit: Coin
+    }
+  | {
+      loss: Coin
+    }
 export type VaultPositionAmount =
   | {
       unlocked: VaultAmount
@@ -33,7 +41,7 @@ export type UnlockingPositions = VaultUnlockingPosition[]
 export interface HealthComputer {
   denoms_data: DenomsData
   kind: AccountKind
-  positions: Positions
+  positions: PositionsWithoutPerps
   vaults_data: VaultsData
 }
 export interface DenomsData {
@@ -78,6 +86,7 @@ export interface Positions {
   debts: DebtAmount[]
   deposits: Coin[]
   lends: Coin[]
+  perps: PerpPosition[]
   vaults: VaultPosition[]
 }
 export interface DebtAmount {
@@ -90,6 +99,34 @@ export interface Coin {
   denom: string
   [k: string]: unknown
 }
+export interface PerpPosition {
+  base_denom: string
+  closing_fee_rate: Decimal
+  current_price: Decimal
+  denom: string
+  entry_price: Decimal
+  pnl: PositionPnl
+  size: SignedDecimal
+}
+export interface PositionPnl {
+  coins: PnlCoins
+  values: PnlValues
+}
+export interface PnlCoins {
+  closing_fee: Coin
+  pnl: PnL
+}
+export interface PnlValues {
+  accrued_funding: SignedDecimal
+  closing_fee: SignedDecimal
+  pnl: SignedDecimal
+  price_pnl: SignedDecimal
+}
+export interface SignedDecimal {
+  abs: Decimal
+  negative: boolean
+  [k: string]: unknown
+}
 export interface VaultPosition {
   amount: VaultPositionAmount
   vault: VaultBaseForAddr
diff --git a/src/types/generated/mars-rover-health-computer/bundle.ts b/src/types/generated/mars-rover-health-computer/bundle.ts
index 6293c4bc..4b07b002 100644
--- a/src/types/generated/mars-rover-health-computer/bundle.ts
+++ b/src/types/generated/mars-rover-health-computer/bundle.ts
@@ -1,14 +1,13 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.33.0.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
 
-import * as _32 from './MarsRoverHealthComputer.types'
-import * as _33 from './MarsRoverHealthComputer.client'
-import * as _34 from './MarsRoverHealthComputer.message-composer'
-import * as _35 from './MarsRoverHealthComputer.react-query'
+import * as _36 from './MarsRoverHealthComputer.types'
+import * as _37 from './MarsRoverHealthComputer.client'
+import * as _38 from './MarsRoverHealthComputer.react-query'
 export namespace contracts {
-  export const MarsRoverHealthComputer = { ..._32, ..._33, ..._34, ..._35 }
+  export const MarsRoverHealthComputer = { ..._36, ..._37, ..._38 }
 }
diff --git a/src/types/generated/mars-swapper-astroport/MarsSwapperAstroport.client.ts b/src/types/generated/mars-swapper-astroport/MarsSwapperAstroport.client.ts
new file mode 100644
index 00000000..5ab66f89
--- /dev/null
+++ b/src/types/generated/mars-swapper-astroport/MarsSwapperAstroport.client.ts
@@ -0,0 +1,289 @@
+// @ts-nocheck
+/**
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
+ * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
+ */
+
+import { CosmWasmClient, SigningCosmWasmClient, ExecuteResult } from '@cosmjs/cosmwasm-stargate'
+import { StdFee } from '@cosmjs/amino'
+import {
+  InstantiateMsg,
+  ExecuteMsg,
+  OwnerUpdate,
+  SwapOperation,
+  AssetInfo,
+  Addr,
+  Uint128,
+  Decimal,
+  AstroportRoute,
+  Coin,
+  QueryMsg,
+  EstimateExactInSwapResponse,
+  OwnerResponse,
+  RouteResponseForEmpty,
+  Empty,
+  ArrayOfRouteResponseForEmpty,
+} from './MarsSwapperAstroport.types'
+export interface MarsSwapperAstroportReadOnlyInterface {
+  contractAddress: string
+  owner: () => Promise<OwnerResponse>
+  route: ({
+    denomIn,
+    denomOut,
+  }: {
+    denomIn: string
+    denomOut: string
+  }) => Promise<RouteResponseForEmpty>
+  routes: ({
+    limit,
+    startAfter,
+  }: {
+    limit?: number
+    startAfter?: string[][]
+  }) => Promise<ArrayOfRouteResponseForEmpty>
+  estimateExactInSwap: ({
+    coinIn,
+    denomOut,
+  }: {
+    coinIn: Coin
+    denomOut: string
+  }) => Promise<EstimateExactInSwapResponse>
+}
+export class MarsSwapperAstroportQueryClient implements MarsSwapperAstroportReadOnlyInterface {
+  client: CosmWasmClient
+  contractAddress: string
+
+  constructor(client: CosmWasmClient, contractAddress: string) {
+    this.client = client
+    this.contractAddress = contractAddress
+    this.owner = this.owner.bind(this)
+    this.route = this.route.bind(this)
+    this.routes = this.routes.bind(this)
+    this.estimateExactInSwap = this.estimateExactInSwap.bind(this)
+  }
+
+  owner = async (): Promise<OwnerResponse> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      owner: {},
+    })
+  }
+  route = async ({
+    denomIn,
+    denomOut,
+  }: {
+    denomIn: string
+    denomOut: string
+  }): Promise<RouteResponseForEmpty> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      route: {
+        denom_in: denomIn,
+        denom_out: denomOut,
+      },
+    })
+  }
+  routes = async ({
+    limit,
+    startAfter,
+  }: {
+    limit?: number
+    startAfter?: string[][]
+  }): Promise<ArrayOfRouteResponseForEmpty> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      routes: {
+        limit,
+        start_after: startAfter,
+      },
+    })
+  }
+  estimateExactInSwap = async ({
+    coinIn,
+    denomOut,
+  }: {
+    coinIn: Coin
+    denomOut: string
+  }): Promise<EstimateExactInSwapResponse> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      estimate_exact_in_swap: {
+        coin_in: coinIn,
+        denom_out: denomOut,
+      },
+    })
+  }
+}
+export interface MarsSwapperAstroportInterface extends MarsSwapperAstroportReadOnlyInterface {
+  contractAddress: string
+  sender: string
+  updateOwner: (
+    ownerUpdate: OwnerUpdate,
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
+  setRoute: (
+    {
+      denomIn,
+      denomOut,
+      route,
+    }: {
+      denomIn: string
+      denomOut: string
+      route: AstroportRoute
+    },
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
+  swapExactIn: (
+    {
+      coinIn,
+      denomOut,
+      slippage,
+    }: {
+      coinIn: Coin
+      denomOut: string
+      slippage: Decimal
+    },
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
+  transferResult: (
+    {
+      denomIn,
+      denomOut,
+      recipient,
+    }: {
+      denomIn: string
+      denomOut: string
+      recipient: Addr
+    },
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
+}
+export class MarsSwapperAstroportClient
+  extends MarsSwapperAstroportQueryClient
+  implements MarsSwapperAstroportInterface
+{
+  client: SigningCosmWasmClient
+  sender: string
+  contractAddress: string
+
+  constructor(client: SigningCosmWasmClient, sender: string, contractAddress: string) {
+    super(client, contractAddress)
+    this.client = client
+    this.sender = sender
+    this.contractAddress = contractAddress
+    this.updateOwner = this.updateOwner.bind(this)
+    this.setRoute = this.setRoute.bind(this)
+    this.swapExactIn = this.swapExactIn.bind(this)
+    this.transferResult = this.transferResult.bind(this)
+  }
+
+  updateOwner = async (
+    ownerUpdate: OwnerUpdate,
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        update_owner: ownerUpdate,
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
+  setRoute = async (
+    {
+      denomIn,
+      denomOut,
+      route,
+    }: {
+      denomIn: string
+      denomOut: string
+      route: AstroportRoute
+    },
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        set_route: {
+          denom_in: denomIn,
+          denom_out: denomOut,
+          route,
+        },
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
+  swapExactIn = async (
+    {
+      coinIn,
+      denomOut,
+      slippage,
+    }: {
+      coinIn: Coin
+      denomOut: string
+      slippage: Decimal
+    },
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        swap_exact_in: {
+          coin_in: coinIn,
+          denom_out: denomOut,
+          slippage,
+        },
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
+  transferResult = async (
+    {
+      denomIn,
+      denomOut,
+      recipient,
+    }: {
+      denomIn: string
+      denomOut: string
+      recipient: Addr
+    },
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        transfer_result: {
+          denom_in: denomIn,
+          denom_out: denomOut,
+          recipient,
+        },
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
+}
diff --git a/src/types/generated/mars-swapper-astroport/MarsSwapperAstroport.react-query.ts b/src/types/generated/mars-swapper-astroport/MarsSwapperAstroport.react-query.ts
new file mode 100644
index 00000000..4dac3fa4
--- /dev/null
+++ b/src/types/generated/mars-swapper-astroport/MarsSwapperAstroport.react-query.ts
@@ -0,0 +1,245 @@
+// @ts-nocheck
+/**
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
+ * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
+ */
+
+import { UseQueryOptions, useQuery, useMutation, UseMutationOptions } from '@tanstack/react-query'
+import { ExecuteResult } from '@cosmjs/cosmwasm-stargate'
+import { StdFee } from '@cosmjs/amino'
+import {
+  InstantiateMsg,
+  ExecuteMsg,
+  OwnerUpdate,
+  SwapOperation,
+  AssetInfo,
+  Addr,
+  Uint128,
+  Decimal,
+  AstroportRoute,
+  Coin,
+  QueryMsg,
+  EstimateExactInSwapResponse,
+  OwnerResponse,
+  RouteResponseForEmpty,
+  Empty,
+  ArrayOfRouteResponseForEmpty,
+} from './MarsSwapperAstroport.types'
+import {
+  MarsSwapperAstroportQueryClient,
+  MarsSwapperAstroportClient,
+} from './MarsSwapperAstroport.client'
+export const marsSwapperAstroportQueryKeys = {
+  contract: [
+    {
+      contract: 'marsSwapperAstroport',
+    },
+  ] as const,
+  address: (contractAddress: string | undefined) =>
+    [{ ...marsSwapperAstroportQueryKeys.contract[0], address: contractAddress }] as const,
+  owner: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [
+      { ...marsSwapperAstroportQueryKeys.address(contractAddress)[0], method: 'owner', args },
+    ] as const,
+  route: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [
+      { ...marsSwapperAstroportQueryKeys.address(contractAddress)[0], method: 'route', args },
+    ] as const,
+  routes: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [
+      { ...marsSwapperAstroportQueryKeys.address(contractAddress)[0], method: 'routes', args },
+    ] as const,
+  estimateExactInSwap: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [
+      {
+        ...marsSwapperAstroportQueryKeys.address(contractAddress)[0],
+        method: 'estimate_exact_in_swap',
+        args,
+      },
+    ] as const,
+}
+export interface MarsSwapperAstroportReactQuery<TResponse, TData = TResponse> {
+  client: MarsSwapperAstroportQueryClient | undefined
+  options?: Omit<
+    UseQueryOptions<TResponse, Error, TData>,
+    "'queryKey' | 'queryFn' | 'initialData'"
+  > & {
+    initialData?: undefined
+  }
+}
+export interface MarsSwapperAstroportEstimateExactInSwapQuery<TData>
+  extends MarsSwapperAstroportReactQuery<EstimateExactInSwapResponse, TData> {
+  args: {
+    coinIn: Coin
+    denomOut: string
+  }
+}
+export function useMarsSwapperAstroportEstimateExactInSwapQuery<
+  TData = EstimateExactInSwapResponse,
+>({ client, args, options }: MarsSwapperAstroportEstimateExactInSwapQuery<TData>) {
+  return useQuery<EstimateExactInSwapResponse, Error, TData>(
+    marsSwapperAstroportQueryKeys.estimateExactInSwap(client?.contractAddress, args),
+    () =>
+      client
+        ? client.estimateExactInSwap({
+            coinIn: args.coinIn,
+            denomOut: args.denomOut,
+          })
+        : Promise.reject(new Error('Invalid client')),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsSwapperAstroportRoutesQuery<TData>
+  extends MarsSwapperAstroportReactQuery<ArrayOfRouteResponseForEmpty, TData> {
+  args: {
+    limit?: number
+    startAfter?: string[][]
+  }
+}
+export function useMarsSwapperAstroportRoutesQuery<TData = ArrayOfRouteResponseForEmpty>({
+  client,
+  args,
+  options,
+}: MarsSwapperAstroportRoutesQuery<TData>) {
+  return useQuery<ArrayOfRouteResponseForEmpty, Error, TData>(
+    marsSwapperAstroportQueryKeys.routes(client?.contractAddress, args),
+    () =>
+      client
+        ? client.routes({
+            limit: args.limit,
+            startAfter: args.startAfter,
+          })
+        : Promise.reject(new Error('Invalid client')),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsSwapperAstroportRouteQuery<TData>
+  extends MarsSwapperAstroportReactQuery<RouteResponseForEmpty, TData> {
+  args: {
+    denomIn: string
+    denomOut: string
+  }
+}
+export function useMarsSwapperAstroportRouteQuery<TData = RouteResponseForEmpty>({
+  client,
+  args,
+  options,
+}: MarsSwapperAstroportRouteQuery<TData>) {
+  return useQuery<RouteResponseForEmpty, Error, TData>(
+    marsSwapperAstroportQueryKeys.route(client?.contractAddress, args),
+    () =>
+      client
+        ? client.route({
+            denomIn: args.denomIn,
+            denomOut: args.denomOut,
+          })
+        : Promise.reject(new Error('Invalid client')),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsSwapperAstroportOwnerQuery<TData>
+  extends MarsSwapperAstroportReactQuery<OwnerResponse, TData> {}
+export function useMarsSwapperAstroportOwnerQuery<TData = OwnerResponse>({
+  client,
+  options,
+}: MarsSwapperAstroportOwnerQuery<TData>) {
+  return useQuery<OwnerResponse, Error, TData>(
+    marsSwapperAstroportQueryKeys.owner(client?.contractAddress),
+    () => (client ? client.owner() : Promise.reject(new Error('Invalid client'))),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsSwapperAstroportTransferResultMutation {
+  client: MarsSwapperAstroportClient
+  msg: {
+    denomIn: string
+    denomOut: string
+    recipient: Addr
+  }
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsSwapperAstroportTransferResultMutation(
+  options?: Omit<
+    UseMutationOptions<ExecuteResult, Error, MarsSwapperAstroportTransferResultMutation>,
+    'mutationFn'
+  >,
+) {
+  return useMutation<ExecuteResult, Error, MarsSwapperAstroportTransferResultMutation>(
+    ({ client, msg, args: { fee, memo, funds } = {} }) =>
+      client.transferResult(msg, fee, memo, funds),
+    options,
+  )
+}
+export interface MarsSwapperAstroportSwapExactInMutation {
+  client: MarsSwapperAstroportClient
+  msg: {
+    coinIn: Coin
+    denomOut: string
+    slippage: Decimal
+  }
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsSwapperAstroportSwapExactInMutation(
+  options?: Omit<
+    UseMutationOptions<ExecuteResult, Error, MarsSwapperAstroportSwapExactInMutation>,
+    'mutationFn'
+  >,
+) {
+  return useMutation<ExecuteResult, Error, MarsSwapperAstroportSwapExactInMutation>(
+    ({ client, msg, args: { fee, memo, funds } = {} }) => client.swapExactIn(msg, fee, memo, funds),
+    options,
+  )
+}
+export interface MarsSwapperAstroportSetRouteMutation {
+  client: MarsSwapperAstroportClient
+  msg: {
+    denomIn: string
+    denomOut: string
+    route: AstroportRoute
+  }
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsSwapperAstroportSetRouteMutation(
+  options?: Omit<
+    UseMutationOptions<ExecuteResult, Error, MarsSwapperAstroportSetRouteMutation>,
+    'mutationFn'
+  >,
+) {
+  return useMutation<ExecuteResult, Error, MarsSwapperAstroportSetRouteMutation>(
+    ({ client, msg, args: { fee, memo, funds } = {} }) => client.setRoute(msg, fee, memo, funds),
+    options,
+  )
+}
+export interface MarsSwapperAstroportUpdateOwnerMutation {
+  client: MarsSwapperAstroportClient
+  msg: OwnerUpdate
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsSwapperAstroportUpdateOwnerMutation(
+  options?: Omit<
+    UseMutationOptions<ExecuteResult, Error, MarsSwapperAstroportUpdateOwnerMutation>,
+    'mutationFn'
+  >,
+) {
+  return useMutation<ExecuteResult, Error, MarsSwapperAstroportUpdateOwnerMutation>(
+    ({ client, msg, args: { fee, memo, funds } = {} }) => client.updateOwner(msg, fee, memo, funds),
+    options,
+  )
+}
diff --git a/src/types/generated/mars-swapper-astroport/MarsSwapperAstroport.types.ts b/src/types/generated/mars-swapper-astroport/MarsSwapperAstroport.types.ts
new file mode 100644
index 00000000..bebbe1ef
--- /dev/null
+++ b/src/types/generated/mars-swapper-astroport/MarsSwapperAstroport.types.ts
@@ -0,0 +1,129 @@
+// @ts-nocheck
+/**
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
+ * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
+ */
+
+export interface InstantiateMsg {
+  owner: string
+}
+export type ExecuteMsg =
+  | {
+      update_owner: OwnerUpdate
+    }
+  | {
+      set_route: {
+        denom_in: string
+        denom_out: string
+        route: AstroportRoute
+      }
+    }
+  | {
+      swap_exact_in: {
+        coin_in: Coin
+        denom_out: string
+        slippage: Decimal
+      }
+    }
+  | {
+      transfer_result: {
+        denom_in: string
+        denom_out: string
+        recipient: Addr
+      }
+    }
+export type OwnerUpdate =
+  | {
+      propose_new_owner: {
+        proposed: string
+      }
+    }
+  | 'clear_proposed'
+  | 'accept_proposed'
+  | 'abolish_owner_role'
+  | {
+      set_emergency_owner: {
+        emergency_owner: string
+      }
+    }
+  | 'clear_emergency_owner'
+export type SwapOperation =
+  | {
+      native_swap: {
+        ask_denom: string
+        offer_denom: string
+      }
+    }
+  | {
+      astro_swap: {
+        ask_asset_info: AssetInfo
+        offer_asset_info: AssetInfo
+      }
+    }
+export type AssetInfo =
+  | {
+      token: {
+        contract_addr: Addr
+      }
+    }
+  | {
+      native_token: {
+        denom: string
+      }
+    }
+export type Addr = string
+export type Uint128 = string
+export type Decimal = string
+export interface AstroportRoute {
+  factory: string
+  operations: SwapOperation[]
+  oracle: string
+  router: string
+}
+export interface Coin {
+  amount: Uint128
+  denom: string
+  [k: string]: unknown
+}
+export type QueryMsg =
+  | {
+      owner: {}
+    }
+  | {
+      route: {
+        denom_in: string
+        denom_out: string
+      }
+    }
+  | {
+      routes: {
+        limit?: number | null
+        start_after?: [string, string] | null
+      }
+    }
+  | {
+      estimate_exact_in_swap: {
+        coin_in: Coin
+        denom_out: string
+      }
+    }
+export interface EstimateExactInSwapResponse {
+  amount: Uint128
+}
+export interface OwnerResponse {
+  abolished: boolean
+  emergency_owner?: string | null
+  initialized: boolean
+  owner?: string | null
+  proposed?: string | null
+}
+export interface RouteResponseForEmpty {
+  denom_in: string
+  denom_out: string
+  route: Empty
+}
+export interface Empty {
+  [k: string]: unknown
+}
+export type ArrayOfRouteResponseForEmpty = RouteResponseForEmpty[]
diff --git a/src/types/generated/mars-swapper-astroport/bundle.ts b/src/types/generated/mars-swapper-astroport/bundle.ts
new file mode 100644
index 00000000..864cc953
--- /dev/null
+++ b/src/types/generated/mars-swapper-astroport/bundle.ts
@@ -0,0 +1,13 @@
+// @ts-nocheck
+/**
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
+ * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
+ */
+
+import * as _39 from './MarsSwapperAstroport.types'
+import * as _40 from './MarsSwapperAstroport.client'
+import * as _41 from './MarsSwapperAstroport.react-query'
+export namespace contracts {
+  export const MarsSwapperAstroport = { ..._39, ..._40, ..._41 }
+}
diff --git a/src/types/generated/mars-swapper-base/MarsSwapperBase.client.ts b/src/types/generated/mars-swapper-base/MarsSwapperBase.client.ts
new file mode 100644
index 00000000..c7ee45e3
--- /dev/null
+++ b/src/types/generated/mars-swapper-base/MarsSwapperBase.client.ts
@@ -0,0 +1,286 @@
+// @ts-nocheck
+/**
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
+ * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
+ */
+
+import { CosmWasmClient, SigningCosmWasmClient, ExecuteResult } from '@cosmjs/cosmwasm-stargate'
+import { StdFee } from '@cosmjs/amino'
+import {
+  InstantiateMsg,
+  ExecuteMsg,
+  OwnerUpdate,
+  Uint128,
+  Decimal,
+  Addr,
+  Empty,
+  Coin,
+  QueryMsg,
+  EstimateExactInSwapResponse,
+  OwnerResponse,
+  RouteResponseForEmpty,
+  ArrayOfRouteResponseForEmpty,
+} from './MarsSwapperBase.types'
+export interface MarsSwapperBaseReadOnlyInterface {
+  contractAddress: string
+  owner: () => Promise<OwnerResponse>
+  route: ({
+    denomIn,
+    denomOut,
+  }: {
+    denomIn: string
+    denomOut: string
+  }) => Promise<RouteResponseForEmpty>
+  routes: ({
+    limit,
+    startAfter,
+  }: {
+    limit?: number
+    startAfter?: string[][]
+  }) => Promise<ArrayOfRouteResponseForEmpty>
+  estimateExactInSwap: ({
+    coinIn,
+    denomOut,
+  }: {
+    coinIn: Coin
+    denomOut: string
+  }) => Promise<EstimateExactInSwapResponse>
+}
+export class MarsSwapperBaseQueryClient implements MarsSwapperBaseReadOnlyInterface {
+  client: CosmWasmClient
+  contractAddress: string
+
+  constructor(client: CosmWasmClient, contractAddress: string) {
+    this.client = client
+    this.contractAddress = contractAddress
+    this.owner = this.owner.bind(this)
+    this.route = this.route.bind(this)
+    this.routes = this.routes.bind(this)
+    this.estimateExactInSwap = this.estimateExactInSwap.bind(this)
+  }
+
+  owner = async (): Promise<OwnerResponse> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      owner: {},
+    })
+  }
+  route = async ({
+    denomIn,
+    denomOut,
+  }: {
+    denomIn: string
+    denomOut: string
+  }): Promise<RouteResponseForEmpty> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      route: {
+        denom_in: denomIn,
+        denom_out: denomOut,
+      },
+    })
+  }
+  routes = async ({
+    limit,
+    startAfter,
+  }: {
+    limit?: number
+    startAfter?: string[][]
+  }): Promise<ArrayOfRouteResponseForEmpty> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      routes: {
+        limit,
+        start_after: startAfter,
+      },
+    })
+  }
+  estimateExactInSwap = async ({
+    coinIn,
+    denomOut,
+  }: {
+    coinIn: Coin
+    denomOut: string
+  }): Promise<EstimateExactInSwapResponse> => {
+    return this.client.queryContractSmart(this.contractAddress, {
+      estimate_exact_in_swap: {
+        coin_in: coinIn,
+        denom_out: denomOut,
+      },
+    })
+  }
+}
+export interface MarsSwapperBaseInterface extends MarsSwapperBaseReadOnlyInterface {
+  contractAddress: string
+  sender: string
+  updateOwner: (
+    ownerUpdate: OwnerUpdate,
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
+  setRoute: (
+    {
+      denomIn,
+      denomOut,
+      route,
+    }: {
+      denomIn: string
+      denomOut: string
+      route: Empty
+    },
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
+  swapExactIn: (
+    {
+      coinIn,
+      denomOut,
+      slippage,
+    }: {
+      coinIn: Coin
+      denomOut: string
+      slippage: Decimal
+    },
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
+  transferResult: (
+    {
+      denomIn,
+      denomOut,
+      recipient,
+    }: {
+      denomIn: string
+      denomOut: string
+      recipient: Addr
+    },
+    fee?: number | StdFee | 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ) => Promise<ExecuteResult>
+}
+export class MarsSwapperBaseClient
+  extends MarsSwapperBaseQueryClient
+  implements MarsSwapperBaseInterface
+{
+  client: SigningCosmWasmClient
+  sender: string
+  contractAddress: string
+
+  constructor(client: SigningCosmWasmClient, sender: string, contractAddress: string) {
+    super(client, contractAddress)
+    this.client = client
+    this.sender = sender
+    this.contractAddress = contractAddress
+    this.updateOwner = this.updateOwner.bind(this)
+    this.setRoute = this.setRoute.bind(this)
+    this.swapExactIn = this.swapExactIn.bind(this)
+    this.transferResult = this.transferResult.bind(this)
+  }
+
+  updateOwner = async (
+    ownerUpdate: OwnerUpdate,
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        update_owner: ownerUpdate,
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
+  setRoute = async (
+    {
+      denomIn,
+      denomOut,
+      route,
+    }: {
+      denomIn: string
+      denomOut: string
+      route: Empty
+    },
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        set_route: {
+          denom_in: denomIn,
+          denom_out: denomOut,
+          route,
+        },
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
+  swapExactIn = async (
+    {
+      coinIn,
+      denomOut,
+      slippage,
+    }: {
+      coinIn: Coin
+      denomOut: string
+      slippage: Decimal
+    },
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        swap_exact_in: {
+          coin_in: coinIn,
+          denom_out: denomOut,
+          slippage,
+        },
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
+  transferResult = async (
+    {
+      denomIn,
+      denomOut,
+      recipient,
+    }: {
+      denomIn: string
+      denomOut: string
+      recipient: Addr
+    },
+    fee: number | StdFee | 'auto' = 'auto',
+    memo?: string,
+    _funds?: Coin[],
+  ): Promise<ExecuteResult> => {
+    return await this.client.execute(
+      this.sender,
+      this.contractAddress,
+      {
+        transfer_result: {
+          denom_in: denomIn,
+          denom_out: denomOut,
+          recipient,
+        },
+      },
+      fee,
+      memo,
+      _funds,
+    )
+  }
+}
diff --git a/src/types/generated/mars-swapper-base/MarsSwapperBase.react-query.ts b/src/types/generated/mars-swapper-base/MarsSwapperBase.react-query.ts
new file mode 100644
index 00000000..c4b67aa0
--- /dev/null
+++ b/src/types/generated/mars-swapper-base/MarsSwapperBase.react-query.ts
@@ -0,0 +1,235 @@
+// @ts-nocheck
+/**
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
+ * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
+ */
+
+import { UseQueryOptions, useQuery, useMutation, UseMutationOptions } from '@tanstack/react-query'
+import { ExecuteResult } from '@cosmjs/cosmwasm-stargate'
+import { StdFee } from '@cosmjs/amino'
+import {
+  InstantiateMsg,
+  ExecuteMsg,
+  OwnerUpdate,
+  Uint128,
+  Decimal,
+  Addr,
+  Empty,
+  Coin,
+  QueryMsg,
+  EstimateExactInSwapResponse,
+  OwnerResponse,
+  RouteResponseForEmpty,
+  ArrayOfRouteResponseForEmpty,
+} from './MarsSwapperBase.types'
+import { MarsSwapperBaseQueryClient, MarsSwapperBaseClient } from './MarsSwapperBase.client'
+export const marsSwapperBaseQueryKeys = {
+  contract: [
+    {
+      contract: 'marsSwapperBase',
+    },
+  ] as const,
+  address: (contractAddress: string | undefined) =>
+    [{ ...marsSwapperBaseQueryKeys.contract[0], address: contractAddress }] as const,
+  owner: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [{ ...marsSwapperBaseQueryKeys.address(contractAddress)[0], method: 'owner', args }] as const,
+  route: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [{ ...marsSwapperBaseQueryKeys.address(contractAddress)[0], method: 'route', args }] as const,
+  routes: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [{ ...marsSwapperBaseQueryKeys.address(contractAddress)[0], method: 'routes', args }] as const,
+  estimateExactInSwap: (contractAddress: string | undefined, args?: Record<string, unknown>) =>
+    [
+      {
+        ...marsSwapperBaseQueryKeys.address(contractAddress)[0],
+        method: 'estimate_exact_in_swap',
+        args,
+      },
+    ] as const,
+}
+export interface MarsSwapperBaseReactQuery<TResponse, TData = TResponse> {
+  client: MarsSwapperBaseQueryClient | undefined
+  options?: Omit<
+    UseQueryOptions<TResponse, Error, TData>,
+    "'queryKey' | 'queryFn' | 'initialData'"
+  > & {
+    initialData?: undefined
+  }
+}
+export interface MarsSwapperBaseEstimateExactInSwapQuery<TData>
+  extends MarsSwapperBaseReactQuery<EstimateExactInSwapResponse, TData> {
+  args: {
+    coinIn: Coin
+    denomOut: string
+  }
+}
+export function useMarsSwapperBaseEstimateExactInSwapQuery<TData = EstimateExactInSwapResponse>({
+  client,
+  args,
+  options,
+}: MarsSwapperBaseEstimateExactInSwapQuery<TData>) {
+  return useQuery<EstimateExactInSwapResponse, Error, TData>(
+    marsSwapperBaseQueryKeys.estimateExactInSwap(client?.contractAddress, args),
+    () =>
+      client
+        ? client.estimateExactInSwap({
+            coinIn: args.coinIn,
+            denomOut: args.denomOut,
+          })
+        : Promise.reject(new Error('Invalid client')),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsSwapperBaseRoutesQuery<TData>
+  extends MarsSwapperBaseReactQuery<ArrayOfRouteResponseForEmpty, TData> {
+  args: {
+    limit?: number
+    startAfter?: string[][]
+  }
+}
+export function useMarsSwapperBaseRoutesQuery<TData = ArrayOfRouteResponseForEmpty>({
+  client,
+  args,
+  options,
+}: MarsSwapperBaseRoutesQuery<TData>) {
+  return useQuery<ArrayOfRouteResponseForEmpty, Error, TData>(
+    marsSwapperBaseQueryKeys.routes(client?.contractAddress, args),
+    () =>
+      client
+        ? client.routes({
+            limit: args.limit,
+            startAfter: args.startAfter,
+          })
+        : Promise.reject(new Error('Invalid client')),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsSwapperBaseRouteQuery<TData>
+  extends MarsSwapperBaseReactQuery<RouteResponseForEmpty, TData> {
+  args: {
+    denomIn: string
+    denomOut: string
+  }
+}
+export function useMarsSwapperBaseRouteQuery<TData = RouteResponseForEmpty>({
+  client,
+  args,
+  options,
+}: MarsSwapperBaseRouteQuery<TData>) {
+  return useQuery<RouteResponseForEmpty, Error, TData>(
+    marsSwapperBaseQueryKeys.route(client?.contractAddress, args),
+    () =>
+      client
+        ? client.route({
+            denomIn: args.denomIn,
+            denomOut: args.denomOut,
+          })
+        : Promise.reject(new Error('Invalid client')),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsSwapperBaseOwnerQuery<TData>
+  extends MarsSwapperBaseReactQuery<OwnerResponse, TData> {}
+export function useMarsSwapperBaseOwnerQuery<TData = OwnerResponse>({
+  client,
+  options,
+}: MarsSwapperBaseOwnerQuery<TData>) {
+  return useQuery<OwnerResponse, Error, TData>(
+    marsSwapperBaseQueryKeys.owner(client?.contractAddress),
+    () => (client ? client.owner() : Promise.reject(new Error('Invalid client'))),
+    { ...options, enabled: !!client && (options?.enabled != undefined ? options.enabled : true) },
+  )
+}
+export interface MarsSwapperBaseTransferResultMutation {
+  client: MarsSwapperBaseClient
+  msg: {
+    denomIn: string
+    denomOut: string
+    recipient: Addr
+  }
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsSwapperBaseTransferResultMutation(
+  options?: Omit<
+    UseMutationOptions<ExecuteResult, Error, MarsSwapperBaseTransferResultMutation>,
+    'mutationFn'
+  >,
+) {
+  return useMutation<ExecuteResult, Error, MarsSwapperBaseTransferResultMutation>(
+    ({ client, msg, args: { fee, memo, funds } = {} }) =>
+      client.transferResult(msg, fee, memo, funds),
+    options,
+  )
+}
+export interface MarsSwapperBaseSwapExactInMutation {
+  client: MarsSwapperBaseClient
+  msg: {
+    coinIn: Coin
+    denomOut: string
+    slippage: Decimal
+  }
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsSwapperBaseSwapExactInMutation(
+  options?: Omit<
+    UseMutationOptions<ExecuteResult, Error, MarsSwapperBaseSwapExactInMutation>,
+    'mutationFn'
+  >,
+) {
+  return useMutation<ExecuteResult, Error, MarsSwapperBaseSwapExactInMutation>(
+    ({ client, msg, args: { fee, memo, funds } = {} }) => client.swapExactIn(msg, fee, memo, funds),
+    options,
+  )
+}
+export interface MarsSwapperBaseSetRouteMutation {
+  client: MarsSwapperBaseClient
+  msg: {
+    denomIn: string
+    denomOut: string
+    route: Empty
+  }
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsSwapperBaseSetRouteMutation(
+  options?: Omit<
+    UseMutationOptions<ExecuteResult, Error, MarsSwapperBaseSetRouteMutation>,
+    'mutationFn'
+  >,
+) {
+  return useMutation<ExecuteResult, Error, MarsSwapperBaseSetRouteMutation>(
+    ({ client, msg, args: { fee, memo, funds } = {} }) => client.setRoute(msg, fee, memo, funds),
+    options,
+  )
+}
+export interface MarsSwapperBaseUpdateOwnerMutation {
+  client: MarsSwapperBaseClient
+  msg: OwnerUpdate
+  args?: {
+    fee?: number | StdFee | 'auto'
+    memo?: string
+    funds?: Coin[]
+  }
+}
+export function useMarsSwapperBaseUpdateOwnerMutation(
+  options?: Omit<
+    UseMutationOptions<ExecuteResult, Error, MarsSwapperBaseUpdateOwnerMutation>,
+    'mutationFn'
+  >,
+) {
+  return useMutation<ExecuteResult, Error, MarsSwapperBaseUpdateOwnerMutation>(
+    ({ client, msg, args: { fee, memo, funds } = {} }) => client.updateOwner(msg, fee, memo, funds),
+    options,
+  )
+}
diff --git a/src/types/generated/mars-swapper-base/MarsSwapperBase.types.ts b/src/types/generated/mars-swapper-base/MarsSwapperBase.types.ts
new file mode 100644
index 00000000..9878cd46
--- /dev/null
+++ b/src/types/generated/mars-swapper-base/MarsSwapperBase.types.ts
@@ -0,0 +1,99 @@
+// @ts-nocheck
+/**
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
+ * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
+ */
+
+export interface InstantiateMsg {
+  owner: string
+}
+export type ExecuteMsg =
+  | {
+      update_owner: OwnerUpdate
+    }
+  | {
+      set_route: {
+        denom_in: string
+        denom_out: string
+        route: Empty
+      }
+    }
+  | {
+      swap_exact_in: {
+        coin_in: Coin
+        denom_out: string
+        slippage: Decimal
+      }
+    }
+  | {
+      transfer_result: {
+        denom_in: string
+        denom_out: string
+        recipient: Addr
+      }
+    }
+export type OwnerUpdate =
+  | {
+      propose_new_owner: {
+        proposed: string
+      }
+    }
+  | 'clear_proposed'
+  | 'accept_proposed'
+  | 'abolish_owner_role'
+  | {
+      set_emergency_owner: {
+        emergency_owner: string
+      }
+    }
+  | 'clear_emergency_owner'
+export type Uint128 = string
+export type Decimal = string
+export type Addr = string
+export interface Empty {
+  [k: string]: unknown
+}
+export interface Coin {
+  amount: Uint128
+  denom: string
+  [k: string]: unknown
+}
+export type QueryMsg =
+  | {
+      owner: {}
+    }
+  | {
+      route: {
+        denom_in: string
+        denom_out: string
+      }
+    }
+  | {
+      routes: {
+        limit?: number | null
+        start_after?: [string, string] | null
+      }
+    }
+  | {
+      estimate_exact_in_swap: {
+        coin_in: Coin
+        denom_out: string
+      }
+    }
+export interface EstimateExactInSwapResponse {
+  amount: Uint128
+}
+export interface OwnerResponse {
+  abolished: boolean
+  emergency_owner?: string | null
+  initialized: boolean
+  owner?: string | null
+  proposed?: string | null
+}
+export interface RouteResponseForEmpty {
+  denom_in: string
+  denom_out: string
+  route: Empty
+}
+export type ArrayOfRouteResponseForEmpty = RouteResponseForEmpty[]
diff --git a/src/types/generated/mars-swapper-base/bundle.ts b/src/types/generated/mars-swapper-base/bundle.ts
new file mode 100644
index 00000000..d1974148
--- /dev/null
+++ b/src/types/generated/mars-swapper-base/bundle.ts
@@ -0,0 +1,13 @@
+// @ts-nocheck
+/**
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
+ * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
+ */
+
+import * as _42 from './MarsSwapperBase.types'
+import * as _43 from './MarsSwapperBase.client'
+import * as _44 from './MarsSwapperBase.react-query'
+export namespace contracts {
+  export const MarsSwapperBase = { ..._42, ..._43, ..._44 }
+}
diff --git a/src/types/generated/mars-swapper-osmosis/MarsSwapperOsmosis.client.ts b/src/types/generated/mars-swapper-osmosis/MarsSwapperOsmosis.client.ts
index 42a2e06e..7f924263 100644
--- a/src/types/generated/mars-swapper-osmosis/MarsSwapperOsmosis.client.ts
+++ b/src/types/generated/mars-swapper-osmosis/MarsSwapperOsmosis.client.ts
@@ -1,6 +1,6 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.30.1.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
diff --git a/src/types/generated/mars-swapper-osmosis/MarsSwapperOsmosis.react-query.ts b/src/types/generated/mars-swapper-osmosis/MarsSwapperOsmosis.react-query.ts
index 08701f35..87e8310c 100644
--- a/src/types/generated/mars-swapper-osmosis/MarsSwapperOsmosis.react-query.ts
+++ b/src/types/generated/mars-swapper-osmosis/MarsSwapperOsmosis.react-query.ts
@@ -1,6 +1,6 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.30.1.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
diff --git a/src/types/generated/mars-swapper-osmosis/MarsSwapperOsmosis.types.ts b/src/types/generated/mars-swapper-osmosis/MarsSwapperOsmosis.types.ts
index 0046c3fb..ce80683b 100644
--- a/src/types/generated/mars-swapper-osmosis/MarsSwapperOsmosis.types.ts
+++ b/src/types/generated/mars-swapper-osmosis/MarsSwapperOsmosis.types.ts
@@ -1,6 +1,6 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.30.1.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
@@ -55,7 +55,6 @@ export type Addr = string
 export interface SwapAmountInRoute {
   pool_id: number
   token_out_denom: string
-  [k: string]: unknown
 }
 export interface Coin {
   amount: Uint128
diff --git a/src/types/generated/mars-swapper-osmosis/bundle.ts b/src/types/generated/mars-swapper-osmosis/bundle.ts
index 66a5acd8..1ed4a719 100644
--- a/src/types/generated/mars-swapper-osmosis/bundle.ts
+++ b/src/types/generated/mars-swapper-osmosis/bundle.ts
@@ -1,13 +1,13 @@
 // @ts-nocheck
 /**
- * This file was automatically generated by @cosmwasm/ts-codegen@0.30.1.
+ * This file was automatically generated by @cosmwasm/ts-codegen@0.35.3.
  * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
  * and run the @cosmwasm/ts-codegen generate command to regenerate this file.
  */
 
-import * as _21 from './MarsSwapperOsmosis.types'
-import * as _22 from './MarsSwapperOsmosis.client'
-import * as _23 from './MarsSwapperOsmosis.react-query'
+import * as _45 from './MarsSwapperOsmosis.types'
+import * as _46 from './MarsSwapperOsmosis.client'
+import * as _47 from './MarsSwapperOsmosis.react-query'
 export namespace contracts {
-  export const MarsSwapperOsmosis = { ..._21, ..._22, ..._23 }
+  export const MarsSwapperOsmosis = { ..._45, ..._46, ..._47 }
 }
diff --git a/src/types/interfaces/account.d.ts b/src/types/interfaces/account.d.ts
index e585be2f..d801fd68 100644
--- a/src/types/interfaces/account.d.ts
+++ b/src/types/interfaces/account.d.ts
@@ -1,13 +1,17 @@
-interface Account extends AccountChange {
+type PositionType = 'deposit' | 'borrow' | 'lend' | 'vault' | 'perp'
+type TableType = 'balances' | 'perps'
+
+interface Account {
   id: string
   deposits: BNCoin[]
   debts: BNCoin[]
   lends: BNCoin[]
   vaults: DepositedVault[]
+  perps: PerpPosition[]
   kind: AccountKind
 }
 
-interface AccountChange {
+interface AccountChange extends Account {
   deposits?: BNCoin[]
   debts?: BNCoin[]
   lends?: BNCoin[]
@@ -20,7 +24,14 @@ interface AccountBalanceRow {
   denom: string
   size: number
   symbol: string
-  type: 'deposits' | 'borrowing' | 'lending' | 'vault'
+  type: PositionType
+  value: string
+  amountChange: BigNumber
+}
+
+interface AccountPerpRow extends PerpsPosition {
+  amount: BigNumber
+  symbol: string
   value: string
   amountChange: BigNumber
 }
diff --git a/src/types/interfaces/asset.d.ts b/src/types/interfaces/asset.d.ts
index 580e3b8b..e829447d 100644
--- a/src/types/interfaces/asset.d.ts
+++ b/src/types/interfaces/asset.d.ts
@@ -1,72 +1,30 @@
-interface Asset {
-  color: string
-  name: string
+interface Asset extends AssetMetaData {
   denom: string
-  symbol:
-    | 'AKT'
-    | 'ATOM'
-    | 'AXL'
-    | 'DYDX'
-    | 'INJ'
-    | 'MARS'
-    | 'OSMO'
-    | 'stATOM'
-    | 'stOSMO'
-    | 'TIA'
-    | 'USDC.axl'
-    | 'USDC'
-    | 'USDT'
-    | 'WBTC.axl'
-    | 'WETH.axl'
-    | 'OSMO-USDC.n'
-    | 'OSMO-ATOM'
-    | 'OSMO-USDC.axl'
-    | 'OSMO-WETH.axl'
-    | 'OSMO-WBTC.axl'
-    | 'stATOM-ATOM'
-    | '$'
-  id:
-    | 'AKT'
-    | 'ATOM'
-    | 'AXL'
-    | 'DYDX'
-    | 'INJ'
-    | 'axlUSDC'
-    | 'axlWBTC'
-    | 'axlWETH'
-    | 'MARS'
-    | 'OSMO'
-    | 'stATOM'
-    | 'stOSMO'
-    | 'TIA'
-    | 'USD'
-    | 'USDC'
-    | 'USDT'
-    | 'OSMO-USDC.n'
-    | 'gamm/pool/12'
-    | 'gamm/pool/1'
-    | 'gamm/pool/678'
-    | 'gamm/pool/704'
-    | 'gamm/pool/712'
-    | 'gamm/pool/803'
-  prefix?: string
-  contract_addr?: string
-  logo: string
-  decimals: number
-  hasOraclePrice: boolean
   poolId?: number
-  isEnabled: boolean
-  isMarket: boolean
-  isDisplayCurrency?: boolean
-  isStable?: boolean
-  isFavorite?: boolean
+  isPerpsEnabled?: boolean
+}
+
+interface AssetMetaData {
+  color: string
+  decimals: number
+  forceFetchPrice?: boolean
+  hasOraclePrice: boolean
+  id: string
   isAutoLendEnabled?: boolean
   isBorrowEnabled?: boolean
-  pythPriceFeedId?: string
-  pythHistoryFeedId?: string
-  forceFetchPrice?: boolean
-  testnetDenom?: string
+  isDisplayCurrency?: boolean
+  isEnabled: boolean
+  isFavorite?: boolean
+  isMarket: boolean
+  isStable?: boolean
   isStaking?: boolean
+  logo: string
+  name: string
+  prefix?: string
+  pythFeedName?: string
+  pythPriceFeedId?: string
+  symbol: string
+  testnetDenom?: string
 }
 
 interface AssetPair {
@@ -101,7 +59,7 @@ interface BorrowMarketTableData extends MarketTableData {
 }
 
 interface LendingMarketTableData extends MarketTableData {
-  accountLentAmount?: string
+  accountLentAmount?: BigNumber
   accountLentValue?: BigNumber
   borrowEnabled: boolean
   cap: DepositCap
diff --git a/src/types/interfaces/chain.d.ts b/src/types/interfaces/chain.d.ts
new file mode 100644
index 00000000..2ceaa596
--- /dev/null
+++ b/src/types/interfaces/chain.d.ts
@@ -0,0 +1,59 @@
+interface ChainConfig {
+  assets: Asset[]
+  bech32Config: import('@keplr-wallet/types').Bech32Config
+  contracts: {
+    redBank: string
+    incentives: string
+    oracle: string
+    swapper: string
+    params: string
+    creditManager: string
+    accountNft: string
+    perps: string
+    pyth: string
+  }
+  defaultCurrency: {
+    coinDenom: string
+    coinMinimalDenom: string
+    coinDecimals: number
+    coinGeckoId: string
+    gasPriceStep: {
+      low: number
+      average: number
+      high: number
+    }
+  }
+  endpoints: {
+    rest: string
+    rpc: string
+    swap: string
+    explorer: string
+    pools: string
+    routes: string
+    aprs: {
+      vaults: string
+      stride: string
+    }
+  }
+  explorerName: string
+  features: ('ibc-transfer' | 'ibc-go')[]
+  gasPrice: string
+  id: import('types/enums/wallet').ChainInfoID
+  name: string
+  network: 'mainnet' | 'testnet'
+  vaults: VaultMetaData[]
+  hls: boolean
+  perps: boolean
+  farm: boolean
+}
+
+interface ContractClients {
+  accountNft: import('types/generated/mars-account-nft/MarsAccountNft.client').MarsAccountNftQueryClient
+  creditManager: import('types/generated/mars-credit-manager/MarsCreditManager.client').MarsCreditManagerQueryClient
+  incentives: import('types/generated/mars-incentives/MarsIncentives.client').MarsIncentivesQueryClient
+  oracle: import('types/generated/mars-oracle-osmosis/MarsOracleOsmosis.client').MarsOracleOsmosisQueryClient
+  params: import('types/generated/mars-params/MarsParams.client').MarsParamsQueryClient
+  perps: import('types/generated/mars-perps/MarsPerps.client').MarsPerpsQueryClient
+  redBank: import('types/generated/mars-red-bank/MarsRedBank.client').MarsRedBankQueryClient
+  swapper: import('types/generated/mars-swapper-osmosis/MarsSwapperOsmosis.client').MarsSwapperOsmosisQueryClient
+}
diff --git a/src/types/interfaces/components/Button.d.ts b/src/types/interfaces/components/Button.d.ts
index a9c27b0a..45bc2ea1 100644
--- a/src/types/interfaces/components/Button.d.ts
+++ b/src/types/interfaces/components/Button.d.ts
@@ -10,6 +10,7 @@ interface ButtonProps {
   text?: string | ReactNode
   variant?: 'solid' | 'transparent' | 'round' | 'rounded'
   onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void
+  onMouseOver?: (e: React.MouseEvent<HTMLButtonElement>) => void
   leftIcon?: ReactElement
   rightIcon?: ReactElement
   iconClassName?: string
diff --git a/src/types/interfaces/components/Modals/AssetSelect.d.ts b/src/types/interfaces/components/Modals/AssetSelect.d.ts
index e9715164..d1d66aed 100644
--- a/src/types/interfaces/components/Modals/AssetSelect.d.ts
+++ b/src/types/interfaces/components/Modals/AssetSelect.d.ts
@@ -2,4 +2,5 @@ interface AssetTableRow {
   balance?: string
   asset: BorrowAsset | Asset
   market?: Market
+  value?: BigNumber
 }
diff --git a/src/types/interfaces/components/Trade/TradingChart.d.ts b/src/types/interfaces/components/Trade/TradingChart.d.ts
new file mode 100644
index 00000000..84d8b0fd
--- /dev/null
+++ b/src/types/interfaces/components/Trade/TradingChart.d.ts
@@ -0,0 +1,34 @@
+interface PythBarQueryData {
+  s: string
+  t: number[]
+  o: number[]
+  h: number[]
+  l: number[]
+  c: number[]
+  v: number[]
+}
+
+interface TheGraphBarQueryData {
+  close: string
+  high: string
+  low: string
+  open: string
+  timestamp: string
+  volume: string
+}
+
+interface Bar {
+  time: number
+  open: number
+  high: number
+  low: number
+  close: number
+}
+
+interface StreamData {
+  id: string
+  p: number
+  t: number
+  f: string
+  s: number
+}
diff --git a/src/types/interfaces/perps.d.ts b/src/types/interfaces/perps.d.ts
index 6eb541e0..fa315ff0 100644
--- a/src/types/interfaces/perps.d.ts
+++ b/src/types/interfaces/perps.d.ts
@@ -1 +1,23 @@
-type OrderDirection = 'long' | 'short' | 'buy' | 'sell'
+type TradeDirection = 'long' | 'short'
+
+// TODO: 📈Remove this type when healthcomputer is implemented
+type PositionsWithoutPerps = Omit<
+  import('types/generated/mars-credit-manager/MarsCreditManager.types').Positions,
+  'perps'
+>
+
+interface PerpsPosition {
+  denom: string
+  baseDenom: string
+  tradeDirection: TradeDirection
+  amount: BigNumber
+  closingFee: BNCoin
+  pnl: BNCoin
+  entryPrice: BigNumber
+}
+
+interface PerpPositionRow extends PerpsPosition {
+  asset: Asset
+  liquidationPrice: BigNumber
+  leverage: number
+}
diff --git a/src/types/interfaces/route.d.ts b/src/types/interfaces/route.d.ts
index cbd0f1c5..59fff097 100644
--- a/src/types/interfaces/route.d.ts
+++ b/src/types/interfaces/route.d.ts
@@ -11,3 +11,79 @@ type Page =
   | 'hls-staking'
   | 'governance'
   | 'execute'
+
+type OsmosisRouteResponse = {
+  amount_in: {
+    denom: string
+    amount: string
+  }
+  amount_out: string
+  route: OsmosisRoute[]
+  effective_fee: string
+  price_impact: string
+}
+
+type OsmosisRoute = {
+  pools: OsmosisRoutePool[]
+  'has-cw-pool': boolean
+  out_amount: string
+  in_amount: string
+}
+
+type OsmosisRoutePool = {
+  id: number
+  type: number
+  balances: []
+  spread_factor: string
+  token_out_denom: string
+  taker_fee: string
+}
+
+type SwapRouteInfo = {
+  priceImpact: BigNumber
+  fee: BigNumber
+  route: OsmosisSwap | AstroportSwap
+}
+
+type OsmosisSwap = {
+  osmo: {
+    swaps: {
+      pool_id: string
+      to: string
+    }[]
+  }
+}
+
+type AstroportSwap = {
+  astro: {
+    swaps: {
+      from: string
+      to: string
+    }[]
+  }
+}
+
+type AstroportRouteResponse = {
+  id: string
+  swaps: AstroportRoute[]
+  denom_in: string
+  decimals_in: number
+  price_in: number
+  value_in: string
+  amount_in: string
+  denom_out: string
+  decimals_out: number
+  price_out: number
+  value_out: string
+  amount_out: string
+  price_difference: number
+  price_impact: number
+}
+
+type AstroportRoute = {
+  contract_addr: string
+  from: string
+  to: string
+  type: string
+  illiquid: boolean
+}
diff --git a/src/types/interfaces/store/broadcast.d.ts b/src/types/interfaces/store/broadcast.d.ts
index 05a833e2..2cf42358 100644
--- a/src/types/interfaces/store/broadcast.d.ts
+++ b/src/types/interfaces/store/broadcast.d.ts
@@ -1,6 +1,3 @@
-const BNCoin = import('types/classes/BNCoin').BNCoin
-const ActionCoin = import('types/generated').ActionCoin
-
 interface BroadcastResult {
   result?: import('@delphi-labs/shuttle-react').BroadcastResult
   error?: string
@@ -73,6 +70,8 @@ interface HandleResponseProps {
     | 'swap'
     | 'oracle'
     | 'hls-staking'
+    | 'open-perp'
+    | 'close-perp'
   lend?: boolean
   accountId?: string
   changes?: {
@@ -117,8 +116,13 @@ interface BroadcastSlice {
     kind: import('types/generated/mars-rover-health-types/MarsRoverHealthTypes.types').AccountKind
   }) => Promise<boolean>
   execute: (contract: string, msg: ExecuteMsg, funds: Coin[]) => Promise<BroadcastResult>
-  executeMsg: (options: { messages: MsgExecuteContract[] }) => Promise<BroadcastResult>
+  executeMsg: (options: {
+    messages: MsgExecuteContract[]
+    isPythUpdate?: boolean
+  }) => Promise<BroadcastResult>
   lend: (options: { accountId: string; coin: BNCoin; isMax?: boolean }) => Promise<boolean>
+  closePerpPosition: (options: { accountId: string; denom: string }) => Promise<boolean>
+  openPerpPosition: (options: { accountId: string; coin: BNCoin }) => Promise<boolean>
   reclaim: (options: { accountId: string; coin: BNCoin; isMax?: boolean }) => Promise<boolean>
   repay: (options: {
     accountId: string
@@ -144,7 +148,8 @@ interface BroadcastSlice {
     vault: DepositedVault
     amount: string
   }) => Promise<boolean>
-  updateOracle: (pricesData: string[]) => Promise<boolean>
+  updateOracle: () => Promise<boolean>
+  getPythVaas: () => Promise<import('@delphi-labs/shuttle-react').MsgExecuteContract>
   withdrawFromVaults: (options: {
     accountId: string
     vaults: DepositedVault[]
diff --git a/src/types/interfaces/store/common.d.ts b/src/types/interfaces/store/common.d.ts
index 151c0da7..93d61291 100644
--- a/src/types/interfaces/store/common.d.ts
+++ b/src/types/interfaces/store/common.d.ts
@@ -1,12 +1,11 @@
 interface CommonSlice {
-  accounts: Account[] | null
   address?: string
+  chainConfig: ChainConfig
   userDomain?: {
     domain: string
     domain_full: string
   }
   balances: Coin[]
-  hlsAccounts: Account[] | null
   client?: WalletClient
   isOpen: boolean
   selectedAccount: string | null
diff --git a/src/types/interfaces/store/currency.d.ts b/src/types/interfaces/store/currency.d.ts
deleted file mode 100644
index cdd34ba5..00000000
--- a/src/types/interfaces/store/currency.d.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-interface CurrencySlice {
-  baseCurrency: Asset
-}
diff --git a/src/types/interfaces/store/settings.d.ts b/src/types/interfaces/store/settings.d.ts
index 4ea1bb9f..7e638ca0 100644
--- a/src/types/interfaces/store/settings.d.ts
+++ b/src/types/interfaces/store/settings.d.ts
@@ -4,8 +4,10 @@ interface Settings {
   reduceMotion: boolean
   tradingPairSimple: TradingPair
   tradingPairAdvanced: TradingPair
-  lendAssets: boolean
+  perpsAsset: string
+  enableAutoLendGlobal: boolean
   slippage: number
   tutorial: boolean
   migrationBanner: boolean
+  updateOracle: boolean
 }
diff --git a/src/types/interfaces/swap.d.ts b/src/types/interfaces/swap.d.ts
new file mode 100644
index 00000000..0ac53726
--- /dev/null
+++ b/src/types/interfaces/swap.d.ts
@@ -0,0 +1,29 @@
+export interface AstroportSwapRouteResponse {
+  amount_in: string
+  amount_out: string
+  decimals_in: number
+  decimals_out: number
+  denom_in: string
+  denom_out: string
+  id: string
+  price_difference: number
+  price_impact: number
+  price_in: number
+  price_out: number
+  swaps: Swap[]
+  value_in: string
+  value_out: string
+}
+
+export interface AstroportSwapResponse {
+  contract_addr: string
+  from: string
+  illiquid: boolean
+  to: string
+  type: SwapPoolType
+}
+
+export enum AstroportSwapPoolType {
+  XYK = 'xyk',
+  PCL = 'pcl',
+}
diff --git a/src/utils/accounts.ts b/src/utils/accounts.ts
index d0d07f24..e3df2167 100644
--- a/src/utils/accounts.ts
+++ b/src/utils/accounts.ts
@@ -3,32 +3,33 @@ import BigNumber from 'bignumber.js'
 import { BN_ZERO } from 'constants/math'
 import { ORACLE_DENOM } from 'constants/oracle'
 import { BNCoin } from 'types/classes/BNCoin'
-import {
-  Positions,
-  VaultPosition,
-} from 'types/generated/mars-credit-manager/MarsCreditManager.types'
+import { VaultPosition } from 'types/generated/mars-credit-manager/MarsCreditManager.types'
 import { byDenom } from 'utils/array'
-import { getAssetByDenom } from 'utils/assets'
 import { BN } from 'utils/helpers'
 import { convertApyToApr } from 'utils/parsers'
 
 export const calculateAccountBalanceValue = (
   account: Account | AccountChange,
   prices: BNCoin[],
+  assets: Asset[],
 ): BigNumber => {
-  const depositsValue = calculateAccountValue('deposits', account, prices)
-  const lendsValue = calculateAccountValue('lends', account, prices)
-  const debtsValue = calculateAccountValue('debts', account, prices)
-  const vaultsValue = calculateAccountValue('vaults', account, prices)
+  const depositsValue = calculateAccountValue('deposits', account, prices, assets)
+  const lendsValue = calculateAccountValue('lends', account, prices, assets)
+  const debtsValue = calculateAccountValue('debts', account, prices, assets)
+  const vaultsValue = calculateAccountValue('vaults', account, prices, assets)
 
   return depositsValue.plus(lendsValue).plus(vaultsValue).minus(debtsValue)
 }
 
-export const getAccountPositionValues = (account: Account | AccountChange, prices: BNCoin[]) => {
-  const deposits = calculateAccountValue('deposits', account, prices)
-  const lends = calculateAccountValue('lends', account, prices)
-  const debts = calculateAccountValue('debts', account, prices)
-  const vaults = calculateAccountValue('vaults', account, prices)
+export const getAccountPositionValues = (
+  account: Account | AccountChange,
+  prices: BNCoin[],
+  assets: Asset[],
+) => {
+  const deposits = calculateAccountValue('deposits', account, prices, assets)
+  const lends = calculateAccountValue('lends', account, prices, assets)
+  const debts = calculateAccountValue('debts', account, prices, assets)
+  const vaults = calculateAccountValue('vaults', account, prices, assets)
   return [deposits, lends, debts, vaults]
 }
 
@@ -36,6 +37,7 @@ export const calculateAccountValue = (
   type: 'deposits' | 'lends' | 'debts' | 'vaults',
   account: Account | AccountChange,
   prices: BNCoin[],
+  assets: Asset[],
 ): BigNumber => {
   if (!account[type] || !prices) return BN_ZERO
 
@@ -51,14 +53,16 @@ export const calculateAccountValue = (
     )
   }
 
-  return account[type]?.reduce((acc, position) => {
-    const asset = getAssetByDenom(position.denom)
-    if (!asset) return acc
-    const price = prices.find((price) => price.denom === position.denom)?.amount ?? 0
-    const amount = BN(position.amount).shiftedBy(-asset.decimals)
-    const positionValue = amount.multipliedBy(price)
-    return acc.plus(positionValue)
-  }, BN_ZERO)
+  return (
+    account[type]?.reduce((acc, position) => {
+      const asset = assets.find(byDenom(position.denom))
+      if (!asset) return acc
+      const price = prices.find((price) => price.denom === position.denom)?.amount ?? 0
+      const amount = BN(position.amount).shiftedBy(-asset.decimals)
+      const positionValue = amount.multipliedBy(price)
+      return acc.plus(positionValue)
+    }, BN_ZERO) ?? BN_ZERO
+  )
 }
 
 export const calculateAccountApr = (
@@ -67,12 +71,13 @@ export const calculateAccountApr = (
   lendingAssetsData: LendingMarketTableData[],
   prices: BNCoin[],
   hlsStrategies: HLSStrategy[],
+  assets: Asset[],
   isHls?: boolean,
 ): BigNumber => {
-  const depositValue = calculateAccountValue('deposits', account, prices)
-  const lendsValue = calculateAccountValue('lends', account, prices)
-  const vaultsValue = calculateAccountValue('vaults', account, prices)
-  const debtsValue = calculateAccountValue('debts', account, prices)
+  const depositValue = calculateAccountValue('deposits', account, prices, assets)
+  const lendsValue = calculateAccountValue('lends', account, prices, assets)
+  const vaultsValue = calculateAccountValue('vaults', account, prices, assets)
+  const debtsValue = calculateAccountValue('debts', account, prices, assets)
   const totalValue = depositValue.plus(lendsValue).plus(vaultsValue)
   const totalNetValue = totalValue.minus(debtsValue)
 
@@ -86,7 +91,7 @@ export const calculateAccountApr = (
 
   if (isHls) {
     deposits?.forEach((deposit) => {
-      const asset = getAssetByDenom(deposit.denom)
+      const asset = assets.find(byDenom(deposit.denom))
       if (!asset) return BN_ZERO
       const price = prices.find(byDenom(deposit.denom))?.amount ?? 0
       const amount = BN(deposit.amount).shiftedBy(-asset.decimals)
@@ -103,7 +108,7 @@ export const calculateAccountApr = (
   }
 
   lends?.forEach((lend) => {
-    const asset = getAssetByDenom(lend.denom)
+    const asset = assets.find(byDenom(lend.denom))
     if (!asset) return BN_ZERO
     const price = prices.find(byDenom(lend.denom))?.amount ?? 0
     const amount = BN(lend.amount).shiftedBy(-asset.decimals)
@@ -126,7 +131,7 @@ export const calculateAccountApr = (
   })
 
   debts?.forEach((debt) => {
-    const asset = getAssetByDenom(debt.denom)
+    const asset = assets.find(byDenom(debt.denom))
     if (!asset) return BN_ZERO
     const price = prices.find(byDenom(debt.denom))?.amount ?? 0
     const amount = BN(debt.amount).shiftedBy(-asset.decimals)
@@ -151,8 +156,8 @@ export const calculateAccountApr = (
   return totalInterestValue.dividedBy(totalNetValue).times(100)
 }
 
-export function calculateAccountLeverage(account: Account, prices: BNCoin[]) {
-  const [deposits, lends, debts, vaults] = getAccountPositionValues(account, prices)
+export function calculateAccountLeverage(account: Account, prices: BNCoin[], assets: Asset[]) {
+  const [deposits, lends, debts, vaults] = getAccountPositionValues(account, prices, assets)
   const netValue = deposits.plus(lends).plus(vaults).minus(debts)
   return debts.dividedBy(netValue).plus(1)
 }
@@ -165,7 +170,8 @@ export function accumulateAmounts(denom: string, coins: BNCoin[]): BigNumber {
   return coins.reduce((acc, coin) => acc.plus(getAmount(denom, [coin.toCoin()])), BN_ZERO)
 }
 
-export function convertAccountToPositions(account: Account): Positions {
+// TODO: 📈 Add correct type mapping
+export function convertAccountToPositions(account: Account): PositionsWithoutPerps {
   return {
     account_id: account.id,
     debts: account.debts.map((debt) => ({
@@ -236,6 +242,8 @@ export function cloneAccount(account: Account): Account {
         unlocked: vault.values.unlocked,
       },
     })),
+    // TODO: 📈Add correct type mapping
+    perps: account.perps,
   }
 }
 
@@ -292,9 +300,10 @@ export function getAccountSummaryStats(
   borrowAssets: BorrowMarketTableData[],
   lendingAssets: LendingMarketTableData[],
   hlsStrategies: HLSStrategy[],
+  assets: Asset[],
   isHls?: boolean,
 ) {
-  const [deposits, lends, debts, vaults] = getAccountPositionValues(account, prices)
+  const [deposits, lends, debts, vaults] = getAccountPositionValues(account, prices, assets)
   const positionValue = deposits.plus(lends).plus(vaults)
   const apr = calculateAccountApr(
     account,
@@ -302,9 +311,10 @@ export function getAccountSummaryStats(
     lendingAssets,
     prices,
     hlsStrategies,
+    assets,
     isHls,
   )
-  const leverage = calculateAccountLeverage(account, prices)
+  const leverage = calculateAccountLeverage(account, prices, assets)
 
   return {
     positionValue: BNCoin.fromDenomAndBigNumber(ORACLE_DENOM, positionValue),
@@ -323,3 +333,8 @@ export function isAccountEmpty(account: Account) {
     account.deposits.length === 0
   )
 }
+
+export function getAccountNetValue(account: Account, prices: BNCoin[], assets: Asset[]) {
+  const [deposits, lends, debts, vaults] = getAccountPositionValues(account, prices, assets)
+  return deposits.plus(lends).plus(vaults).minus(debts)
+}
diff --git a/src/utils/actions.ts b/src/utils/actions.ts
index f3f392ed..12ae9704 100644
--- a/src/utils/actions.ts
+++ b/src/utils/actions.ts
@@ -10,6 +10,7 @@ export function getHlsStakingChangeLevActions(
   borrowDenom: string,
   slippage: number,
   prices: BNCoin[],
+  assets: Asset[],
 ): Action[] {
   let actions: Action[] = []
 
@@ -17,8 +18,9 @@ export function getHlsStakingChangeLevActions(
     const debtValue = getCoinValue(
       BNCoin.fromDenomAndBigNumber(borrowDenom, previousAmount.minus(currentAmount)),
       prices,
+      assets,
     )
-    const collateralAmount = getCoinAmount(collateralDenom, debtValue, prices)
+    const collateralAmount = getCoinAmount(collateralDenom, debtValue, prices, assets)
 
     actions = [
       {
diff --git a/src/utils/assets.ts b/src/utils/assets.ts
index e02c025d..7313c25a 100644
--- a/src/utils/assets.ts
+++ b/src/utils/assets.ts
@@ -1,57 +1,12 @@
-import { ASSETS } from 'constants/assets'
 import { BN_ZERO } from 'constants/math'
 import { BNCoin } from 'types/classes/BNCoin'
 import { byDenom } from 'utils/array'
 import { demagnify } from 'utils/formatters'
 
-export function getAssetByDenom(denom: string): Asset | undefined {
-  return ASSETS.find((asset) => asset.denom === denom)
-}
-
-export function getAssetBySymbol(symbol: string) {
-  return ASSETS.find((asset) => asset.symbol === symbol)
-}
-
-export function getEnabledMarketAssets(): Asset[] {
-  return ASSETS.filter((asset) => asset.isEnabled && asset.isMarket)
-}
-
-export function getAssetsMustHavePriceInfo(): Asset[] {
-  return ASSETS.filter((asset) => (asset.isEnabled && asset.isMarket) || asset.forceFetchPrice)
-}
-
-export function getPythAssets(): Asset[] {
-  return ASSETS.filter((asset) => !!asset.pythPriceFeedId)
-}
-
-export function getBaseAsset() {
-  return ASSETS.find((asset) => asset.denom === 'uosmo')!
-}
-
-export function getDisplayCurrencies() {
-  return ASSETS.filter((asset) => asset.isDisplayCurrency)
-}
-
-export function getAllAssets(): Asset[] {
-  return ASSETS
-}
-
 export function findCoinByDenom(denom: string, coins: BigNumberCoin[]) {
   return coins.find((coin) => coin.denom === denom)
 }
 
-export function getLendEnabledAssets() {
-  return ASSETS.filter((asset) => asset.isAutoLendEnabled)
-}
-
-export function getBorrowEnabledAssets() {
-  return ASSETS.filter((asset) => asset.isBorrowEnabled)
-}
-
-export function getStakingAssets() {
-  return ASSETS.filter((asset) => asset.isStaking)
-}
-
 function isAssetPair(assetPair: Asset | AssetPair): assetPair is AssetPair {
   return (<AssetPair>assetPair).buy !== undefined
 }
@@ -90,3 +45,14 @@ export function sortAssetsOrPairs(
     return bMarketValue - aMarketValue
   })
 }
+
+export function getAllAssetsWithPythId(chains: { [key: string]: ChainConfig }) {
+  return Object.entries(chains)
+    .map(([_, chainConfig]) => chainConfig.assets)
+    .flatMap((assets) => assets)
+    .filter(
+      (item, index, array) =>
+        index === array.findIndex((foundItem) => foundItem['denom'] === item['denom']),
+    )
+    .filter((asset) => asset.pythPriceFeedId)
+}
diff --git a/src/utils/checkAutoLendEnabled.ts b/src/utils/checkAutoLendEnabled.ts
index 9001bd7b..eaa3d47d 100644
--- a/src/utils/checkAutoLendEnabled.ts
+++ b/src/utils/checkAutoLendEnabled.ts
@@ -1,7 +1,9 @@
 import { LocalStorageKeys } from 'constants/localStorageKeys'
 
-export default function checkAutoLendEnabled(accountId: string) {
-  const storageItem = localStorage.getItem(LocalStorageKeys.AUTO_LEND_ENABLED_ACCOUNT_IDS)
+export default function checkAutoLendEnabled(accountId: string, chainId: string) {
+  const storageItem = localStorage.getItem(
+    `${chainId}/${LocalStorageKeys.AUTO_LEND_ENABLED_ACCOUNT_IDS}`,
+  )
   const autoLendEnabledAccountIds: string[] = storageItem ? JSON.parse(storageItem) : []
 
   return autoLendEnabledAccountIds.includes(accountId)
diff --git a/src/utils/checkPythUpdateEnabled.ts b/src/utils/checkPythUpdateEnabled.ts
new file mode 100644
index 00000000..64d5b33b
--- /dev/null
+++ b/src/utils/checkPythUpdateEnabled.ts
@@ -0,0 +1,5 @@
+import { LocalStorageKeys } from 'constants/localStorageKeys'
+
+export default function checkPythUpdateEnabled() {
+  return localStorage.getItem(LocalStorageKeys.UPDATE_ORACLE) === 'true'
+}
diff --git a/src/utils/constants.ts b/src/utils/constants.ts
index 937895be..1bab6b48 100644
--- a/src/utils/constants.ts
+++ b/src/utils/constants.ts
@@ -20,6 +20,5 @@ export const DEFAULT_PORTFOLIO_STATS = [
   { title: null, sub: 'Account Leverage' },
 ]
 
-export const ENABLE_HLS = true
-export const ENABLE_PERPS = false
 export const ENABLE_AUTO_REPAY = true
+export const STANDARD_SWAP_FEE = 0.002
diff --git a/src/utils/formatters.ts b/src/utils/formatters.ts
index 2b6728e4..6c733a11 100644
--- a/src/utils/formatters.ts
+++ b/src/utils/formatters.ts
@@ -1,12 +1,10 @@
 import BigNumber from 'bignumber.js'
 import moment from 'moment'
 
-import { ASSETS } from 'constants/assets'
 import { BN_ZERO } from 'constants/math'
 import { ORACLE_DENOM } from 'constants/oracle'
 import { BNCoin } from 'types/classes/BNCoin'
 import { byDenom } from 'utils/array'
-import { getAllAssets } from 'utils/assets'
 import { BN } from 'utils/helpers'
 
 export function truncate(text = '', [h, t]: [number, number] = [6, 6]): string {
@@ -154,8 +152,8 @@ export function formatPercent(percent: number | string, minDecimals?: number) {
   })
 }
 
-export function formatAmountWithSymbol(coin: Coin) {
-  const asset = ASSETS.find((asset) => asset.denom === coin.denom)
+export function formatAmountWithSymbol(coin: Coin, assets: Asset[]) {
+  const asset = assets.find((asset) => asset.denom === coin.denom)
 
   return formatValue(coin.amount, {
     decimals: asset?.decimals,
@@ -188,8 +186,8 @@ export function demagnify(amount: number | string | BigNumber, asset: Asset | Ps
   return _amount.isZero() ? 0 : _amount.shiftedBy(-1 * asset.decimals).toNumber()
 }
 
-export function getCoinValue(coin: BNCoin, prices: BNCoin[]) {
-  const asset = getAllAssets().find(byDenom(coin.denom))
+export function getCoinValue(coin: BNCoin, prices: BNCoin[], assets: Asset[]) {
+  const asset = assets.find(byDenom(coin.denom))
   const coinPrice = prices.find(byDenom(coin.denom))
 
   if (!coinPrice || !asset) return BN_ZERO
@@ -198,8 +196,8 @@ export function getCoinValue(coin: BNCoin, prices: BNCoin[]) {
   return coin.amount.shiftedBy(decimals).multipliedBy(coinPrice.amount)
 }
 
-export function getCoinAmount(denom: string, value: BigNumber, prices: BNCoin[]) {
-  const asset = getAllAssets().find(byDenom(denom))
+export function getCoinAmount(denom: string, value: BigNumber, prices: BNCoin[], assets: Asset[]) {
+  const asset = assets.find(byDenom(denom))
   const coinPrice = prices.find(byDenom(denom))
 
   if (!coinPrice || !asset) return BN_ZERO
diff --git a/src/utils/getCurrentChainId.ts b/src/utils/getCurrentChainId.ts
new file mode 100644
index 00000000..2350c12a
--- /dev/null
+++ b/src/utils/getCurrentChainId.ts
@@ -0,0 +1,52 @@
+import chains from 'configs/chains'
+import { LocalStorageKeys } from 'constants/localStorageKeys'
+import { NETWORK } from 'types/enums/network'
+import { ChainInfoID } from 'types/enums/wallet'
+
+export const getCurrentChainId = () => {
+  const currentNetwork = process.env.NEXT_PUBLIC_NETWORK ?? NETWORK.TESTNET
+  const defaultChainId =
+    currentNetwork === NETWORK.MAINNET
+      ? chains[ChainInfoID.Osmosis1].id
+      : chains[ChainInfoID.OsmosisDevnet].id
+  let chainId = defaultChainId
+
+  if (window) {
+    const subdomain = window.location.hostname.split('.')[0]
+
+    switch (subdomain) {
+      case 'osmosis':
+        if (currentNetwork === NETWORK.MAINNET) chainId = ChainInfoID.Osmosis1
+        break
+
+      case 'testnet-osmosis':
+        if (currentNetwork === NETWORK.TESTNET) chainId = ChainInfoID.OsmosisDevnet
+        break
+
+      case 'testnet-neutron':
+        if (currentNetwork === NETWORK.TESTNET) chainId = ChainInfoID.Pion1
+        break
+    }
+
+    if (chainId !== defaultChainId) return chainId
+  }
+
+  const localStorageChainId = localStorage.getItem(LocalStorageKeys.CURRENT_CHAIN_ID) as ChainInfoID
+  if (localStorageChainId !== null) {
+    switch (localStorageChainId) {
+      case ChainInfoID.Osmosis1:
+        if (currentNetwork === NETWORK.MAINNET) chainId = ChainInfoID.Osmosis1
+        break
+
+      case ChainInfoID.OsmosisDevnet:
+        if (currentNetwork === NETWORK.TESTNET) chainId = ChainInfoID.OsmosisDevnet
+        break
+
+      case ChainInfoID.Pion1:
+        if (currentNetwork === NETWORK.TESTNET) chainId = ChainInfoID.Pion1
+        break
+    }
+  }
+
+  return chainId
+}
diff --git a/src/utils/helpers.ts b/src/utils/helpers.ts
index 3caa56f8..d70aea59 100644
--- a/src/utils/helpers.ts
+++ b/src/utils/helpers.ts
@@ -49,11 +49,11 @@ export function mergeBNCoinArrays(array1: BNCoin[], array2: BNCoin[]) {
   return merged
 }
 
-export function getValueFromBNCoins(coins: BNCoin[], prices: BNCoin[]): BigNumber {
+export function getValueFromBNCoins(coins: BNCoin[], prices: BNCoin[], assets: Asset[]): BigNumber {
   let totalValue = BN_ZERO
 
   coins.forEach((coin) => {
-    totalValue = totalValue.plus(getCoinValue(coin, prices))
+    totalValue = totalValue.plus(getCoinValue(coin, prices, assets))
   })
 
   return totalValue
diff --git a/src/utils/messages.ts b/src/utils/messages.ts
index ddd3e9ad..14d5f87d 100644
--- a/src/utils/messages.ts
+++ b/src/utils/messages.ts
@@ -12,27 +12,38 @@ export function getDepositCapMessage(
   denom: string,
   amount: BigNumber,
   action: 'deposit' | 'borrow',
+  assets: Asset[],
 ) {
-  return `You cannot ${action} more than ${formatAmountWithSymbol({
-    denom,
-    amount: amount.toString(),
-  })} due to the deposit cap on this asset being reached in the protocol.`
+  return `You cannot ${action} more than ${formatAmountWithSymbol(
+    {
+      denom,
+      amount: amount.toString(),
+    },
+    assets,
+  )} due to the deposit cap on this asset being reached in the protocol.`
 }
 
-export function getLiquidityMessage(denom: string, amount: BigNumber) {
-  return `You cannot borrow more than ${formatAmountWithSymbol({
-    denom,
-    amount: amount.toString(),
-  })} due to the available market liquidity.`
+export function getLiquidityMessage(denom: string, amount: BigNumber, assets: Asset[]) {
+  return `You cannot borrow more than ${formatAmountWithSymbol(
+    {
+      denom,
+      amount: amount.toString(),
+    },
+    assets,
+  )} due to the available market liquidity.`
 }
 
 export function getHealthFactorMessage(
   denom: string,
   amount: BigNumber,
   action: 'borrow' | 'withdraw',
+  assets: Asset[],
 ) {
-  return `You cannot ${action} more than ${formatAmountWithSymbol({
-    denom,
-    amount: amount.toString(),
-  })}, as it will likely result in a health factor lower than 1.`
+  return `You cannot ${action} more than ${formatAmountWithSymbol(
+    {
+      denom,
+      amount: amount.toString(),
+    },
+    assets,
+  )}, as it will likely result in a health factor lower than 1.`
 }
diff --git a/src/utils/resolvers.ts b/src/utils/resolvers.ts
index 856b3c5a..43b179c7 100644
--- a/src/utils/resolvers.ts
+++ b/src/utils/resolvers.ts
@@ -1,3 +1,6 @@
+import { BN_ZERO } from 'constants/math'
+import { BNCoin } from 'types/classes/BNCoin'
+import { PnL, Positions } from 'types/generated/mars-credit-manager/MarsCreditManager.types'
 import {
   AssetParamsBaseForAddr as AssetParams,
   AssetParamsBaseForAddr,
@@ -73,3 +76,32 @@ export function resolveHLSStrategies(
   })
   return HLSStakingStrategies
 }
+
+export function resolvePerpsPositions(perpPositions: Positions['perps']): PerpsPosition[] {
+  if (!perpPositions) return []
+  return perpPositions.map((position) => {
+    return {
+      denom: position.denom,
+      baseDenom: position.base_denom,
+      amount: BN(position.size as any).abs(),
+      tradeDirection: BN(position.size as any).isNegative() ? 'short' : 'long',
+      closingFee: BNCoin.fromCoin(position.pnl.coins.closing_fee),
+      pnl: getPnlCoin(position.pnl.coins.pnl, position.base_denom),
+      entryPrice: BN(position.entry_price),
+    }
+  })
+}
+
+function getPnlCoin(pnl: PnL, denom: string): BNCoin {
+  let amount = BN_ZERO
+
+  if (pnl === 'break_even') return BNCoin.fromDenomAndBigNumber(denom, amount)
+
+  if ('loss' in (pnl as any)) {
+    amount = BN((pnl as any).loss.amount).times(-1)
+  } else if ('profit' in (pnl as { profit: Coin })) {
+    amount = BN((pnl as any).profit.amount)
+  }
+
+  return BNCoin.fromDenomAndBigNumber(denom, amount)
+}
diff --git a/src/utils/route.ts b/src/utils/route.ts
index c8697554..aae1b19e 100644
--- a/src/utils/route.ts
+++ b/src/utils/route.ts
@@ -1,3 +1,5 @@
+import { SearchParams } from 'types/enums/searchParams'
+
 export function getRoute(
   page: Page,
   searchParams: URLSearchParams,
@@ -19,8 +21,8 @@ export function getRoute(
   )
 
   if (accountId) {
-    url.searchParams.delete('accountId')
-    url.searchParams.append('accountId', accountId)
+    url.searchParams.delete(SearchParams.ACCOUNT_ID)
+    url.searchParams.append(SearchParams.ACCOUNT_ID, accountId)
   }
 
   return url.pathname + url.search
@@ -53,3 +55,11 @@ export function getPage(pathname: string): Page {
 
   return 'trade' as Page
 }
+
+export function getSearchParamsObject(searchParams: URLSearchParams) {
+  const params: { [key: string]: string } = {}
+
+  Array.from(searchParams?.entries() || []).forEach(([key, value]) => (params[key] = value))
+
+  return params
+}
diff --git a/src/utils/tokens.ts b/src/utils/tokens.ts
index 4277b932..f6795ee3 100644
--- a/src/utils/tokens.ts
+++ b/src/utils/tokens.ts
@@ -1,7 +1,6 @@
 import BigNumber from 'bignumber.js'
 
 import { BNCoin } from 'types/classes/BNCoin'
-import { getBaseAsset } from 'utils/assets'
 import { BN } from 'utils/helpers'
 
 export const getTokenSymbol = (denom: string, marketAssets: Asset[]) =>
@@ -13,9 +12,6 @@ export const getTokenDecimals = (denom: string, marketAssets: Asset[]) =>
 export const getTokenIcon = (denom: string, marketAssets: Asset[]) =>
   marketAssets.find((asset) => asset.denom.toLowerCase() === denom.toLowerCase())?.logo || ''
 
-export const getTokenInfo = (denom: string, marketAssets: Asset[]) =>
-  marketAssets.find((asset) => asset.denom.toLowerCase() === denom.toLowerCase()) || getBaseAsset()
-
 export function getTokenPrice(denom: string, prices: BNCoin[]): BigNumber {
   const price = prices.find((price) => price.denom === denom)?.amount || '0'
   return BN(price)
diff --git a/src/utils/vaults.ts b/src/utils/vaults.ts
index 23c38d7c..d71faa3f 100644
--- a/src/utils/vaults.ts
+++ b/src/utils/vaults.ts
@@ -1,25 +1,12 @@
-import { ASSETS } from 'constants/assets'
-import { ENV } from 'constants/env'
 import { BN_ZERO } from 'constants/math'
-import { TESTNET_VAULTS_META_DATA, VAULTS_META_DATA } from 'constants/vaults'
 import { BNCoin } from 'types/classes/BNCoin'
-import { NETWORK } from 'types/enums/network'
 import { Action, Uint128 } from 'types/generated/mars-credit-manager/MarsCreditManager.types'
-import { getAssetByDenom } from 'utils/assets'
+import { byDenom } from 'utils/array'
 import { VAULT_DEPOSIT_BUFFER } from 'utils/constants'
 import { getCoinAmount, getCoinValue } from 'utils/formatters'
 import { getValueFromBNCoins, mergeBNCoinArrays } from 'utils/helpers'
 import { getTokenPrice } from 'utils/tokens'
 
-export function getVaultsMetaData() {
-  return ENV.NETWORK === NETWORK.TESTNET ? TESTNET_VAULTS_META_DATA : VAULTS_META_DATA
-}
-
-export function getVaultMetaData(address: string) {
-  const vaults = ENV.NETWORK === NETWORK.TESTNET ? TESTNET_VAULTS_META_DATA : VAULTS_META_DATA
-  return vaults.find((vault) => vault.address === address)
-}
-
 export function getVaultDepositCoinsAndValue(
   vault: Vault,
   deposits: BNCoin[],
@@ -27,19 +14,20 @@ export function getVaultDepositCoinsAndValue(
   reclaims: BNCoin[],
   prices: BNCoin[],
   slippage: number,
+  assets: Asset[],
 ) {
   const depositsAndReclaims = mergeBNCoinArrays(deposits, reclaims)
   const borrowingsAndDepositsAndReclaims = mergeBNCoinArrays(borrowings, depositsAndReclaims)
 
   // The slippage is to account for rounding errors. Otherwise, it might happen we try to deposit more value
   // into the vaults than there are funds available.
-  const totalValue = getValueFromBNCoins(borrowingsAndDepositsAndReclaims, prices).times(
+  const totalValue = getValueFromBNCoins(borrowingsAndDepositsAndReclaims, prices, assets).times(
     1 - slippage,
   )
   const halfValue = totalValue.dividedBy(2)
 
-  const primaryAsset = getAssetByDenom(vault.denoms.primary) ?? ASSETS[0]
-  const secondaryAsset = getAssetByDenom(vault.denoms.secondary) ?? ASSETS[0]
+  const primaryAsset = assets.find(byDenom(vault.denoms.primary)) ?? assets[0]
+  const secondaryAsset = assets.find(byDenom(vault.denoms.secondary)) ?? assets[0]
 
   // The buffer is needed as sometimes the pools are a bit skew, or because of other inaccuracies in the messages
   const primaryDepositAmount = halfValue
@@ -73,12 +61,13 @@ export function getVaultSwapActions(
   reclaims: BNCoin[],
   borrowings: BNCoin[],
   prices: BNCoin[],
+  assets: Asset[],
   slippage: number,
 ): Action[] {
   const swapActions: Action[] = []
   const coins = [...deposits, ...borrowings, ...reclaims]
 
-  const value = getValueFromBNCoins(coins, prices)
+  const value = getValueFromBNCoins(coins, prices, assets)
 
   let primaryLeftoverValue = value.dividedBy(2)
   let secondaryLeftoverValue = value.dividedBy(2)
@@ -101,38 +90,44 @@ export function getVaultSwapActions(
   )
 
   primaryCoins.forEach((bnCoin) => {
-    let value = getCoinValue(bnCoin, prices)
+    let value = getCoinValue(bnCoin, prices, assets)
     if (value.isLessThanOrEqualTo(primaryLeftoverValue)) {
       primaryLeftoverValue = primaryLeftoverValue.minus(value)
     } else {
       value = value.minus(primaryLeftoverValue)
       primaryLeftoverValue = primaryLeftoverValue.minus(primaryLeftoverValue)
       otherCoins.push(
-        BNCoin.fromDenomAndBigNumber(bnCoin.denom, getCoinAmount(bnCoin.denom, value, prices)),
+        BNCoin.fromDenomAndBigNumber(
+          bnCoin.denom,
+          getCoinAmount(bnCoin.denom, value, prices, assets),
+        ),
       )
     }
   })
 
   secondaryCoins.forEach((bnCoin) => {
-    let value = getCoinValue(bnCoin, prices)
+    let value = getCoinValue(bnCoin, prices, assets)
     if (value.isLessThanOrEqualTo(secondaryLeftoverValue)) {
       secondaryLeftoverValue = secondaryLeftoverValue.minus(value)
     } else {
       value = value.minus(secondaryLeftoverValue)
       secondaryLeftoverValue = secondaryLeftoverValue.minus(secondaryLeftoverValue)
       otherCoins.push(
-        BNCoin.fromDenomAndBigNumber(bnCoin.denom, getCoinAmount(bnCoin.denom, value, prices)),
+        BNCoin.fromDenomAndBigNumber(
+          bnCoin.denom,
+          getCoinAmount(bnCoin.denom, value, prices, assets),
+        ),
       )
     }
   })
 
   otherCoins.forEach((bnCoin) => {
-    let value = getCoinValue(bnCoin, prices)
+    let value = getCoinValue(bnCoin, prices, assets)
     let amount = bnCoin.amount
 
     if (primaryLeftoverValue.isGreaterThan(0)) {
       const swapValue = value.isLessThan(primaryLeftoverValue) ? value : primaryLeftoverValue
-      const swapAmount = getCoinAmount(bnCoin.denom, swapValue, prices)
+      const swapAmount = getCoinAmount(bnCoin.denom, swapValue, prices, assets)
 
       value = value.minus(swapValue)
       amount = amount.minus(swapAmount)
diff --git a/tailwind.config.js b/tailwind.config.js
index 58e0561f..b9c690ff 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -399,6 +399,16 @@ module.exports = {
         '.gradient-slider-4': {
           background: 'linear-gradient(to right, #961293, #B3419B)',
         },
+        '.gradient-slider-pink': {
+          background:
+            'linear-gradient(270deg, rgba(255, 97, 141, 0.89) 0%, rgba(66, 58, 70, 0.05) 100%)',
+        },
+        '.gradient-slider-green': {
+          background: 'linear-gradient(270deg, #61FF71E2 0%, #423A460D 100%)',
+        },
+        '.gradient-slider-red': {
+          background: 'linear-gradient(270deg, #F04438E2 0%, #423A460D 100%)',
+        },
         '.gradient-tooltip': {
           background:
             'linear-gradient(77.47deg, rgba(20, 24, 57, 0.9) 11.58%, rgba(34, 16, 57, 0.9) 93.89%)',
diff --git a/tsconfig.json b/tsconfig.json
index 637575af..8eb17bb4 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,6 +1,6 @@
 {
   "compilerOptions": {
-    "target": "es5",
+    "target": "ES2020",
     "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
     "skipLibCheck": true,
diff --git a/validate-env.js b/validate-env.js
index f888e8ba..67b9136a 100644
--- a/validate-env.js
+++ b/validate-env.js
@@ -1,47 +1,5 @@
 require('dotenv').config({ path: './.env.local' })
 
-if (!process.env.NEXT_PUBLIC_ACCOUNT_NFT) {
-  throw 'NEXT_PUBLIC_ACCOUNT_NFT is not defined'
-}
-if (!process.env.NEXT_PUBLIC_CREDIT_MANAGER) {
-  throw 'NEXT_PUBLIC_CREDIT_MANAGER is not defined'
-}
-if (!process.env.NEXT_PUBLIC_INCENTIVES) {
-  throw 'NEXT_PUBLIC_INCENTIVES is not defined'
-}
-if (!process.env.NEXT_PUBLIC_ORACLE) {
-  throw 'NEXT_PUBLIC_ORACLE is not defined'
-}
-if (!process.env.NEXT_PUBLIC_RED_BANK) {
-  throw 'NEXT_PUBLIC_RED_BANK is not defined'
-}
-if (!process.env.NEXT_PUBLIC_SWAPPER) {
-  throw 'NEXT_PUBLIC_SWAPPER is not defined'
-}
-if (!process.env.NEXT_PUBLIC_CHAIN_ID) {
-  throw 'NEXT_PUBLIC_CHAIN_ID is not defined'
-}
-if (!process.env.NEXT_PUBLIC_NETWORK) {
-  throw 'NEXT_PUBLIC_NETWORK is not defined'
-}
-if (!process.env.NEXT_PUBLIC_GQL) {
-  throw 'NEXT_PUBLIC_GQL is not defined'
-}
-if (!process.env.NEXT_PUBLIC_REST) {
-  throw 'NEXT_PUBLIC_REST is not defined'
-}
-if (!process.env.NEXT_PUBLIC_VAULT_APR) {
-  throw 'NEXT_PUBLIC_VAULT_APR is not defined'
-}
-if (!process.env.NEXT_PUBLIC_PARAMS) {
-  throw 'NEXT_PUBLIC_PARAMS is not defined'
-}
-if (!process.env.NEXT_PUBLIC_CANDLES_ENDPOINT_PYTH) {
-  throw 'NEXT_PUBLIC_CANDLES_ENDPOINT_PYTH is not defined'
-}
-if (!process.env.NEXT_PUBLIC_CANDLES_ENDPOINT_THE_GRAPH) {
-  throw 'NEXT_PUBLIC_CANDLES_ENDPOINT_THE_GRAPH is not defined'
-}
 if (!process.env.CHARTING_LIBRARY_USERNAME) {
   throw 'CHARTING_LIBRARY_USERNAME is not defined'
 }
@@ -51,17 +9,8 @@ if (!process.env.CHARTING_LIBRARY_ACCESS_TOKEN) {
 if (!process.env.CHARTING_LIBRARY_REPOSITORY) {
   throw 'CHARTING_LIBRARY_REPOSITORY is not defined'
 }
-if (!process.env.NEXT_PUBLIC_PYTH_ENDPOINT) {
-  throw 'NEXT_PUBLIC_PYTH_ENDPOINT is not defined'
-}
-if (!process.env.NEXT_PUBLIC_MAINNET_REST) {
-  throw 'NEXT_PUBLIC_MAINNET_REST is not defined'
-}
-if (!process.env.NEXT_PUBLIC_RPC) {
-  throw 'NEXT_PUBLIC_RPC is not defined'
-}
-if (!process.env.NEXT_PUBLIC_STRIDE_APRS) {
-  throw 'NEXT_PUBLIC_STRIDE_APRS is not defined'
+if (!process.env.NEXT_PUBLIC_WALLET_CONNECT_ID) {
+  throw 'NEXT_PUBLIC_WALLET_CONNECT_ID is not defined'
 }
 
 console.log('✅ Required env variables set')
diff --git a/yarn.lock b/yarn.lock
index 9ed35b1d..b9d84469 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -7,11 +7,6 @@
   resolved "https://registry.npmjs.org/@aashutoshrathi/word-wrap/-/word-wrap-1.2.6.tgz"
   integrity sha512-1Yjs2SvM8TflER/OD3cOjhWWOZb58A2t7wpE2S9XfBYTiIl+XFhQG2bjy4Pu1I+EAlCNUzRDYDdFwFYUKvXcIA==
 
-"@adobe/css-tools@^4.0.1":
-  version "4.3.2"
-  resolved "https://registry.yarnpkg.com/@adobe/css-tools/-/css-tools-4.3.2.tgz#a6abc715fb6884851fca9dad37fc34739a04fd11"
-  integrity sha512-DA5a1C0gD/pLOvhv33YMrbf2FK3oUzwNl9oOJqE4XVjuEtt6XIakRcsd7eLiOSPkp1kTRQGICTA8cKra/vFbjw==
-
 "@alloc/quick-lru@^5.2.0":
   version "5.2.0"
   resolved "https://registry.npmjs.org/@alloc/quick-lru/-/quick-lru-5.2.0.tgz"
@@ -44,7 +39,7 @@
     tslib "^2.3.0"
     zen-observable-ts "^1.2.5"
 
-"@babel/code-frame@^7.0.0", "@babel/code-frame@^7.10.4", "@babel/code-frame@^7.12.13", "@babel/code-frame@^7.21.4":
+"@babel/code-frame@^7.0.0", "@babel/code-frame@^7.21.4":
   version "7.21.4"
   resolved "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.21.4.tgz"
   integrity sha512-LYvhNKfwWSPpocw8GI7gpK2nq3HSDuEPC/uSYaALSJu9xjsalaaYFOq0Pwt5KmVqwEbZlDu81aLXwBOmD/Fv9g==
@@ -71,7 +66,7 @@
   resolved "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.23.2.tgz"
   integrity sha512-0S9TQMmDHlqAZ2ITT95irXKfxN9bncq8ZCoJhun3nHL/lLUxd2NKBJYoNGWH7S0hz6fRQwWlAWn/ILM0C70KZQ==
 
-"@babel/core@^7.11.6", "@babel/core@^7.12.3", "@babel/core@^7.21.3":
+"@babel/core@^7.21.3":
   version "7.21.8"
   resolved "https://registry.npmjs.org/@babel/core/-/core-7.21.8.tgz"
   integrity sha512-YeM22Sondbo523Sz0+CirSPnbj9bG3P0CdHcBZdqUuaeOaYEFbOLoGU7lebvGP6P5J/WE9wOn7u7C4J9HvS1xQ==
@@ -92,7 +87,7 @@
     json5 "^2.2.2"
     semver "^6.3.0"
 
-"@babel/generator@^7.21.5", "@babel/generator@^7.7.2":
+"@babel/generator@^7.21.5":
   version "7.21.5"
   resolved "https://registry.npmjs.org/@babel/generator/-/generator-7.21.5.tgz"
   integrity sha512-SrKK/sRv8GesIW1bDagf9cCG38IOMYZusoe1dfg0D8aiUe3Amvoj1QtjTPAWcfrZFvIwlleLb0gxzQidL9w14w==
@@ -387,16 +382,16 @@
     chalk "^2.4.2"
     js-tokens "^4.0.0"
 
-"@babel/parser@^7.1.0", "@babel/parser@^7.14.7", "@babel/parser@^7.21.8":
-  version "7.21.8"
-  resolved "https://registry.npmjs.org/@babel/parser/-/parser-7.21.8.tgz"
-  integrity sha512-6zavDGdzG3gUqAdWvlLFfk+36RilI+Pwyuuh7HItyeScCWP3k6i8vKclAQ0bM/0y/Kz/xiwvxhMv9MgTJP5gmA==
-
 "@babel/parser@^7.20.7":
   version "7.21.2"
   resolved "https://registry.npmjs.org/@babel/parser/-/parser-7.21.2.tgz"
   integrity sha512-URpaIJQwEkEC2T9Kn+Ai6Xe/02iNaVCuT/PtoRz3GPVJVDpPd7mLo+VddTbhCRU9TXqW5mSrQfXZyi8kDKOVpQ==
 
+"@babel/parser@^7.21.8":
+  version "7.21.8"
+  resolved "https://registry.npmjs.org/@babel/parser/-/parser-7.21.8.tgz"
+  integrity sha512-6zavDGdzG3gUqAdWvlLFfk+36RilI+Pwyuuh7HItyeScCWP3k6i8vKclAQ0bM/0y/Kz/xiwvxhMv9MgTJP5gmA==
+
 "@babel/parser@^7.22.15", "@babel/parser@^7.23.0":
   version "7.23.0"
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.23.0.tgz#da950e622420bf96ca0d0f2909cdddac3acd8719"
@@ -554,14 +549,7 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.8.0"
 
-"@babel/plugin-syntax-bigint@^7.8.3":
-  version "7.8.3"
-  resolved "https://registry.npmjs.org/@babel/plugin-syntax-bigint/-/plugin-syntax-bigint-7.8.3.tgz"
-  integrity sha512-wnTnFlG+YxQm3vDxpGE57Pj0srRU4sHE/mDkt1qv2YJJSeUAec2ma4WLUnUPeKjyrfntVwe/N6dCXpU+zL3Npg==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.8.0"
-
-"@babel/plugin-syntax-class-properties@^7.12.13", "@babel/plugin-syntax-class-properties@^7.8.3":
+"@babel/plugin-syntax-class-properties@^7.12.13":
   version "7.12.13"
   resolved "https://registry.npmjs.org/@babel/plugin-syntax-class-properties/-/plugin-syntax-class-properties-7.12.13.tgz"
   integrity sha512-fm4idjKla0YahUNgFNLCB0qySdsoPiZP3iQE3rky0mBUtMZ23yDJ9SJdg6dXTSDnulOVqiF3Hgr9nbXvXTQZYA==
@@ -596,13 +584,6 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.19.0"
 
-"@babel/plugin-syntax-import-meta@^7.8.3":
-  version "7.10.4"
-  resolved "https://registry.npmjs.org/@babel/plugin-syntax-import-meta/-/plugin-syntax-import-meta-7.10.4.tgz"
-  integrity sha512-Yqfm+XDx0+Prh3VSeEQCPU81yC+JWZ2pDPFSS4ZdpfZhp4MkFMaDC1UqseovEKwSUpnIL7+vK+Clp7bfh0iD7g==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.10.4"
-
 "@babel/plugin-syntax-json-strings@^7.8.3":
   version "7.8.3"
   resolved "https://registry.npmjs.org/@babel/plugin-syntax-json-strings/-/plugin-syntax-json-strings-7.8.3.tgz"
@@ -617,14 +598,14 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.18.6"
 
-"@babel/plugin-syntax-jsx@^7.21.4", "@babel/plugin-syntax-jsx@^7.7.2":
+"@babel/plugin-syntax-jsx@^7.21.4":
   version "7.21.4"
   resolved "https://registry.npmjs.org/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.21.4.tgz"
   integrity sha512-5hewiLct5OKyh6PLKEYaFclcqtIgCb6bmELouxjF6up5q3Sov7rOayW4RwhbaBL0dit8rA80GNfY+UuDp2mBbQ==
   dependencies:
     "@babel/helper-plugin-utils" "^7.20.2"
 
-"@babel/plugin-syntax-logical-assignment-operators@^7.10.4", "@babel/plugin-syntax-logical-assignment-operators@^7.8.3":
+"@babel/plugin-syntax-logical-assignment-operators@^7.10.4":
   version "7.10.4"
   resolved "https://registry.npmjs.org/@babel/plugin-syntax-logical-assignment-operators/-/plugin-syntax-logical-assignment-operators-7.10.4.tgz"
   integrity sha512-d8waShlpFDinQ5MtvGU9xDAOzKH47+FFoney2baFIoMr952hKOLp1HR7VszoZvOsV/4+RRszNY7D17ba0te0ig==
@@ -638,7 +619,7 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.8.0"
 
-"@babel/plugin-syntax-numeric-separator@^7.10.4", "@babel/plugin-syntax-numeric-separator@^7.8.3":
+"@babel/plugin-syntax-numeric-separator@^7.10.4":
   version "7.10.4"
   resolved "https://registry.npmjs.org/@babel/plugin-syntax-numeric-separator/-/plugin-syntax-numeric-separator-7.10.4.tgz"
   integrity sha512-9H6YdfkcK/uOnY/K7/aA2xpzaAgkQn37yzWUMRK7OaPOqOpGS1+n0H5hxT9AUw9EsSjPW8SVyMJwYRtWs3X3ug==
@@ -673,7 +654,7 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.14.5"
 
-"@babel/plugin-syntax-top-level-await@^7.14.5", "@babel/plugin-syntax-top-level-await@^7.8.3":
+"@babel/plugin-syntax-top-level-await@^7.14.5":
   version "7.14.5"
   resolved "https://registry.npmjs.org/@babel/plugin-syntax-top-level-await/-/plugin-syntax-top-level-await-7.14.5.tgz"
   integrity sha512-hx++upLv5U1rgYfwe1xBQUhRmU41NEvpUvrp8jkrSCdvGSnM5/qdRMtylJ6PG5OFkBaHkbTAKTnd3/YyESRHFw==
@@ -687,13 +668,6 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.19.0"
 
-"@babel/plugin-syntax-typescript@^7.7.2":
-  version "7.21.4"
-  resolved "https://registry.npmjs.org/@babel/plugin-syntax-typescript/-/plugin-syntax-typescript-7.21.4.tgz"
-  integrity sha512-xz0D39NvhQn4t4RNsHmDnnsaQizIlUkdtYvLs8La1BlfjQ6JEwxkJGeqJMW2tAXx+q6H+WFuUTXNdYVpEya0YA==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.20.2"
-
 "@babel/plugin-transform-arrow-functions@^7.20.7":
   version "7.20.7"
   resolved "https://registry.npmjs.org/@babel/plugin-transform-arrow-functions/-/plugin-transform-arrow-functions-7.20.7.tgz"
@@ -1129,14 +1103,14 @@
   dependencies:
     regenerator-runtime "^0.13.11"
 
-"@babel/runtime@^7.1.2", "@babel/runtime@^7.12.5", "@babel/runtime@^7.20.7", "@babel/runtime@^7.8.4", "@babel/runtime@^7.9.2":
+"@babel/runtime@^7.1.2", "@babel/runtime@^7.20.7", "@babel/runtime@^7.8.4":
   version "7.21.5"
   resolved "https://registry.npmjs.org/@babel/runtime/-/runtime-7.21.5.tgz"
   integrity sha512-8jI69toZqqcsnqGGqwGS4Qb1VwLOEp4hz+CXPywcvjs60u3B4Pom/U/7rm4W8tMOYEB+E9wgD0mW1l3r8qlI9Q==
   dependencies:
     regenerator-runtime "^0.13.11"
 
-"@babel/template@^7.18.10", "@babel/template@^7.20.7", "@babel/template@^7.3.3":
+"@babel/template@^7.18.10", "@babel/template@^7.20.7":
   version "7.20.7"
   resolved "https://registry.npmjs.org/@babel/template/-/template-7.20.7.tgz"
   integrity sha512-8SegXApWe6VoNw0r9JHpSteLKTpTiLZ4rMlGIm9JQ18KiCtyQiAMEazujAHrUS5flrcqYZa75ukev3P6QmUwUw==
@@ -1170,7 +1144,7 @@
     debug "^4.1.0"
     globals "^11.1.0"
 
-"@babel/types@^7.0.0", "@babel/types@^7.18.6", "@babel/types@^7.18.9", "@babel/types@^7.20.0", "@babel/types@^7.20.2", "@babel/types@^7.20.5", "@babel/types@^7.20.7", "@babel/types@^7.21.0", "@babel/types@^7.21.2", "@babel/types@^7.21.3", "@babel/types@^7.21.4", "@babel/types@^7.21.5", "@babel/types@^7.22.15", "@babel/types@^7.22.5", "@babel/types@^7.23.0", "@babel/types@^7.3.0", "@babel/types@^7.3.3", "@babel/types@^7.4.4":
+"@babel/types@^7.18.6", "@babel/types@^7.18.9", "@babel/types@^7.20.0", "@babel/types@^7.20.2", "@babel/types@^7.20.5", "@babel/types@^7.20.7", "@babel/types@^7.21.0", "@babel/types@^7.21.2", "@babel/types@^7.21.3", "@babel/types@^7.21.4", "@babel/types@^7.21.5", "@babel/types@^7.22.15", "@babel/types@^7.22.5", "@babel/types@^7.23.0", "@babel/types@^7.4.4":
   version "7.23.0"
   resolved "https://registry.npmjs.org/@babel/types/-/types-7.23.0.tgz"
   integrity sha512-0oIyUfKoI3mSqMvsxBdclDwxXKXAUA8v/apZbc+iSyARYou1o8ZGDxbUYyLFoW2arqS2jDGqJuZvv1d/io1axg==
@@ -1179,11 +1153,6 @@
     "@babel/helper-validator-identifier" "^7.22.20"
     to-fast-properties "^2.0.0"
 
-"@bcoe/v8-coverage@^0.2.3":
-  version "0.2.3"
-  resolved "https://registry.npmjs.org/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz"
-  integrity sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==
-
 "@confio/ics23@^0.6.8":
   version "0.6.8"
   resolved "https://registry.npmjs.org/@confio/ics23/-/ics23-0.6.8.tgz"
@@ -1222,6 +1191,16 @@
     "@cosmjs/math" "^0.31.1"
     "@cosmjs/utils" "^0.31.1"
 
+"@cosmjs/amino@^0.32.2":
+  version "0.32.2"
+  resolved "https://registry.yarnpkg.com/@cosmjs/amino/-/amino-0.32.2.tgz#ba3cf255e4e6b1ba67461f1ef7b0b8ad3f895da7"
+  integrity sha512-lcK5RCVm4OfdAooxKcF2+NwaDVVpghOq6o/A40c2mHXDUzUoRZ33VAHjVJ9Me6vOFxshrw/XEFn1f4KObntjYA==
+  dependencies:
+    "@cosmjs/crypto" "^0.32.2"
+    "@cosmjs/encoding" "^0.32.2"
+    "@cosmjs/math" "^0.32.2"
+    "@cosmjs/utils" "^0.32.2"
+
 "@cosmjs/cosmwasm-stargate@^0.29.3":
   version "0.29.5"
   resolved "https://registry.yarnpkg.com/@cosmjs/cosmwasm-stargate/-/cosmwasm-stargate-0.29.5.tgz#3f257da682658833e0f4eb9e8ff758e4d927663a"
@@ -1239,7 +1218,7 @@
     long "^4.0.0"
     pako "^2.0.2"
 
-"@cosmjs/cosmwasm-stargate@^0.31.0", "@cosmjs/cosmwasm-stargate@^0.31.1":
+"@cosmjs/cosmwasm-stargate@^0.31.0":
   version "0.31.1"
   resolved "https://registry.npmjs.org/@cosmjs/cosmwasm-stargate/-/cosmwasm-stargate-0.31.1.tgz"
   integrity sha512-5hwv4oztFnpqnFaXhYxZc93na3qdxylT2kqms4pLzD8CWMEQmrwhdM4KpZimrsyZK55WiMQtTPsdSh7M8KLOow==
@@ -1256,6 +1235,22 @@
     long "^4.0.0"
     pako "^2.0.2"
 
+"@cosmjs/cosmwasm-stargate@^0.32.2":
+  version "0.32.2"
+  resolved "https://registry.yarnpkg.com/@cosmjs/cosmwasm-stargate/-/cosmwasm-stargate-0.32.2.tgz#32aca8b4c2043cd1bc91cf4d0225b268c166e421"
+  integrity sha512-OwJHzIx2CoJS6AULxOpNR6m+CI0GXxy8z9svHA1ZawzNM3ZGlL0GvHdhmF0WkpX4E7UdrYlJSLpKcgg5Fo6i7Q==
+  dependencies:
+    "@cosmjs/amino" "^0.32.2"
+    "@cosmjs/crypto" "^0.32.2"
+    "@cosmjs/encoding" "^0.32.2"
+    "@cosmjs/math" "^0.32.2"
+    "@cosmjs/proto-signing" "^0.32.2"
+    "@cosmjs/stargate" "^0.32.2"
+    "@cosmjs/tendermint-rpc" "^0.32.2"
+    "@cosmjs/utils" "^0.32.2"
+    cosmjs-types "^0.9.0"
+    pako "^2.0.2"
+
 "@cosmjs/crypto@^0.29.5":
   version "0.29.5"
   resolved "https://registry.yarnpkg.com/@cosmjs/crypto/-/crypto-0.29.5.tgz#ab99fc382b93d8a8db075780cf07487a0f9519fd"
@@ -1295,6 +1290,19 @@
     elliptic "^6.5.4"
     libsodium-wrappers-sumo "^0.7.11"
 
+"@cosmjs/crypto@^0.32.2":
+  version "0.32.2"
+  resolved "https://registry.yarnpkg.com/@cosmjs/crypto/-/crypto-0.32.2.tgz#8ed255d3d1c1c4d916a1586f8cbc33eaab82f511"
+  integrity sha512-RuxrYKzhrPF9g6NmU7VEq++Hn1vZJjqqJpZ9Tmw9lOYOV8BUsv+j/0BE86kmWi7xVJ7EwxiuxYsKuM8IR18CIA==
+  dependencies:
+    "@cosmjs/encoding" "^0.32.2"
+    "@cosmjs/math" "^0.32.2"
+    "@cosmjs/utils" "^0.32.2"
+    "@noble/hashes" "^1"
+    bn.js "^5.2.0"
+    elliptic "^6.5.4"
+    libsodium-wrappers-sumo "^0.7.11"
+
 "@cosmjs/encoding@^0.29.5":
   version "0.29.5"
   resolved "https://registry.yarnpkg.com/@cosmjs/encoding/-/encoding-0.29.5.tgz#009a4b1c596cdfd326f30ccfa79f5e56daa264f2"
@@ -1322,6 +1330,15 @@
     bech32 "^1.1.4"
     readonly-date "^1.0.0"
 
+"@cosmjs/encoding@^0.32.2":
+  version "0.32.2"
+  resolved "https://registry.yarnpkg.com/@cosmjs/encoding/-/encoding-0.32.2.tgz#8c5c64481a85cd570740c34dccce69d024a29805"
+  integrity sha512-WX7m1wLpA9V/zH0zRcz4EmgZdAv1F44g4dbXOgNj1eXZw1PIGR12p58OEkLN51Ha3S4DKRtCv5CkhK1KHEvQtg==
+  dependencies:
+    base64-js "^1.3.0"
+    bech32 "^1.1.4"
+    readonly-date "^1.0.0"
+
 "@cosmjs/json-rpc@^0.29.5":
   version "0.29.5"
   resolved "https://registry.yarnpkg.com/@cosmjs/json-rpc/-/json-rpc-0.29.5.tgz#5e483a9bd98a6270f935adf0dfd8a1e7eb777fe4"
@@ -1346,6 +1363,14 @@
     "@cosmjs/stream" "^0.31.1"
     xstream "^11.14.0"
 
+"@cosmjs/json-rpc@^0.32.2":
+  version "0.32.2"
+  resolved "https://registry.yarnpkg.com/@cosmjs/json-rpc/-/json-rpc-0.32.2.tgz#f87fab0d6975ed1d1c7daafcf6f1f81e5e296912"
+  integrity sha512-lan2lOgmz4yVE/HR8eCOSiII/1OudIulk8836koyIDCsPEpt6eKBuctnAD168vABGArKccLAo7Mr2gy9nrKrOQ==
+  dependencies:
+    "@cosmjs/stream" "^0.32.2"
+    xstream "^11.14.0"
+
 "@cosmjs/math@^0.29.5":
   version "0.29.5"
   resolved "https://registry.yarnpkg.com/@cosmjs/math/-/math-0.29.5.tgz#722c96e080d6c2b62215ce9f4c70da7625b241b6"
@@ -1367,6 +1392,13 @@
   dependencies:
     bn.js "^5.2.0"
 
+"@cosmjs/math@^0.32.2":
+  version "0.32.2"
+  resolved "https://registry.yarnpkg.com/@cosmjs/math/-/math-0.32.2.tgz#4522312769197e132679e4960862bcec0eed4cb8"
+  integrity sha512-b8+ruAAY8aKtVKWSft2IvtCVCUH1LigIlf9ALIiY8n9jtM4kMASiaRbQ/27etnSAInV88IaezKK9rQZrtxTjcw==
+  dependencies:
+    bn.js "^5.2.0"
+
 "@cosmjs/proto-signing@^0.29.5":
   version "0.29.5"
   resolved "https://registry.yarnpkg.com/@cosmjs/proto-signing/-/proto-signing-0.29.5.tgz#af3b62a46c2c2f1d2327d678b13b7262db1fe87c"
@@ -1406,6 +1438,18 @@
     cosmjs-types "^0.8.0"
     long "^4.0.0"
 
+"@cosmjs/proto-signing@^0.32.2":
+  version "0.32.2"
+  resolved "https://registry.yarnpkg.com/@cosmjs/proto-signing/-/proto-signing-0.32.2.tgz#26ed2675978ce24078981f4c15a06c5d6b808f44"
+  integrity sha512-UV4WwkE3W3G3s7wwU9rizNcUEz2g0W8jQZS5J6/3fiN0mRPwtPKQ6EinPN9ASqcAJ7/VQH4/9EPOw7d6XQGnqw==
+  dependencies:
+    "@cosmjs/amino" "^0.32.2"
+    "@cosmjs/crypto" "^0.32.2"
+    "@cosmjs/encoding" "^0.32.2"
+    "@cosmjs/math" "^0.32.2"
+    "@cosmjs/utils" "^0.32.2"
+    cosmjs-types "^0.9.0"
+
 "@cosmjs/socket@^0.29.5":
   version "0.29.5"
   resolved "https://registry.yarnpkg.com/@cosmjs/socket/-/socket-0.29.5.tgz#a48df6b4c45dc6a6ef8e47232725dd4aa556ac2d"
@@ -1436,6 +1480,16 @@
     ws "^7"
     xstream "^11.14.0"
 
+"@cosmjs/socket@^0.32.2":
+  version "0.32.2"
+  resolved "https://registry.yarnpkg.com/@cosmjs/socket/-/socket-0.32.2.tgz#a66be3863d03bf2d8df0433af476df010ff10e8c"
+  integrity sha512-Qc8jaw4uSBJm09UwPgkqe3g9TBFx4ZR9HkXpwT6Z9I+6kbLerXPR0Gy3NSJFSUgxIfTpO8O1yqoWAyf0Ay17Mw==
+  dependencies:
+    "@cosmjs/stream" "^0.32.2"
+    isomorphic-ws "^4.0.1"
+    ws "^7"
+    xstream "^11.14.0"
+
 "@cosmjs/stargate@^0.29.5":
   version "0.29.5"
   resolved "https://registry.yarnpkg.com/@cosmjs/stargate/-/stargate-0.29.5.tgz#d597af1c85a3c2af7b5bdbec34d5d40692cc09e4"
@@ -1490,6 +1544,22 @@
     protobufjs "~6.11.3"
     xstream "^11.14.0"
 
+"@cosmjs/stargate@^0.32.2":
+  version "0.32.2"
+  resolved "https://registry.yarnpkg.com/@cosmjs/stargate/-/stargate-0.32.2.tgz#73718c5c6a3ae138682ee9987333d911eca22a13"
+  integrity sha512-AsJa29fT7Jd4xt9Ai+HMqhyj7UQu7fyYKdXj/8+/9PD74xe6lZSYhQPcitUmMLJ1ckKPgXSk5Dd2LbsQT0IhZg==
+  dependencies:
+    "@confio/ics23" "^0.6.8"
+    "@cosmjs/amino" "^0.32.2"
+    "@cosmjs/encoding" "^0.32.2"
+    "@cosmjs/math" "^0.32.2"
+    "@cosmjs/proto-signing" "^0.32.2"
+    "@cosmjs/stream" "^0.32.2"
+    "@cosmjs/tendermint-rpc" "^0.32.2"
+    "@cosmjs/utils" "^0.32.2"
+    cosmjs-types "^0.9.0"
+    xstream "^11.14.0"
+
 "@cosmjs/stream@^0.29.5":
   version "0.29.5"
   resolved "https://registry.yarnpkg.com/@cosmjs/stream/-/stream-0.29.5.tgz#350981cac496d04939b92ee793b9b19f44bc1d4e"
@@ -1511,6 +1581,13 @@
   dependencies:
     xstream "^11.14.0"
 
+"@cosmjs/stream@^0.32.2":
+  version "0.32.2"
+  resolved "https://registry.yarnpkg.com/@cosmjs/stream/-/stream-0.32.2.tgz#b1e8f977d25313d659f1aa89ad21614b5391cd93"
+  integrity sha512-gpCufLfHAD8Zp1ZKge7AHbDf4RA0TZp66wZY6JaQR5bSiEF2Drjtp4mwXZPGejtaUMnaAgff3LrUzPJfKYdQwg==
+  dependencies:
+    xstream "^11.14.0"
+
 "@cosmjs/tendermint-rpc@^0.29.5":
   version "0.29.5"
   resolved "https://registry.yarnpkg.com/@cosmjs/tendermint-rpc/-/tendermint-rpc-0.29.5.tgz#f205c10464212bdf843f91bb2e4a093b618cb5c2"
@@ -1559,6 +1636,22 @@
     readonly-date "^1.0.0"
     xstream "^11.14.0"
 
+"@cosmjs/tendermint-rpc@^0.32.2":
+  version "0.32.2"
+  resolved "https://registry.yarnpkg.com/@cosmjs/tendermint-rpc/-/tendermint-rpc-0.32.2.tgz#c5607b8d472e5bf9fd58d5453db7194f500ccc62"
+  integrity sha512-DXyJHDmcAfCix4H/7/dKR0UMdshP01KxJOXHdHxBCbLIpck94BsWD3B2ZTXwfA6sv98so9wOzhp7qGQa5malxg==
+  dependencies:
+    "@cosmjs/crypto" "^0.32.2"
+    "@cosmjs/encoding" "^0.32.2"
+    "@cosmjs/json-rpc" "^0.32.2"
+    "@cosmjs/math" "^0.32.2"
+    "@cosmjs/socket" "^0.32.2"
+    "@cosmjs/stream" "^0.32.2"
+    "@cosmjs/utils" "^0.32.2"
+    axios "^1.6.0"
+    readonly-date "^1.0.0"
+    xstream "^11.14.0"
+
 "@cosmjs/utils@^0.29.5":
   version "0.29.5"
   resolved "https://registry.yarnpkg.com/@cosmjs/utils/-/utils-0.29.5.tgz#3fed1b3528ae8c5f1eb5d29b68755bebfd3294ee"
@@ -1574,6 +1667,11 @@
   resolved "https://registry.npmjs.org/@cosmjs/utils/-/utils-0.31.1.tgz"
   integrity sha512-n4Se1wu4GnKwztQHNFfJvUeWcpvx3o8cWhSbNs9JQShEuB3nv3R5lqFBtDCgHZF/emFQAP+ZjF8bTfCs9UBGhA==
 
+"@cosmjs/utils@^0.32.2":
+  version "0.32.2"
+  resolved "https://registry.yarnpkg.com/@cosmjs/utils/-/utils-0.32.2.tgz#324304aa85bfa6f10561cc17781d824d02130897"
+  integrity sha512-Gg5t+eR7vPJMAmhkFt6CZrzPd0EKpAslWwk5rFVYZpJsM8JG5KT9XQ99hgNM3Ov6ScNoIWbXkpX27F6A9cXR4Q==
+
 "@delphi-labs/shuttle-react@^3.10.0":
   version "3.10.0"
   resolved "https://registry.yarnpkg.com/@delphi-labs/shuttle-react/-/shuttle-react-3.10.0.tgz#1f4a81cfa4039f2fe548b6671919d0d66893af85"
@@ -1608,10 +1706,10 @@
     tslib "^2.6.0"
     tsup "^7.1.0"
 
-"@emnapi/runtime@^0.44.0":
-  version "0.44.0"
-  resolved "https://registry.yarnpkg.com/@emnapi/runtime/-/runtime-0.44.0.tgz#1ef702f846cfcd559d28eb7673919087ba5b63e3"
-  integrity sha512-ZX/etZEZw8DR7zAB1eVQT40lNo0jeqpb6dCgOvctB6FIQ5PoXfMuNY8+ayQfu8tNQbAB8gQWSSJupR8NxeiZXw==
+"@emnapi/runtime@^0.45.0":
+  version "0.45.0"
+  resolved "https://registry.yarnpkg.com/@emnapi/runtime/-/runtime-0.45.0.tgz#e754de04c683263f34fd0c7f32adfe718bbe4ddd"
+  integrity sha512-Txumi3td7J4A/xTTwlssKieHKTGl3j4A1tglBx72auZ49YK7ePY6XZricgIg9mnZT4xPfA+UPCUdnhRuEFDL+w==
   dependencies:
     tslib "^2.4.0"
 
@@ -1737,10 +1835,10 @@
   resolved "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.6.2.tgz"
   integrity sha512-pPTNuaAG3QMH+buKyBIGJs3g/S5y0caxw0ygM3YyE6yJFySwiGGSzA+mM3KJ8QQvzeLh3blwgSonkFjgQdxzMw==
 
-"@eslint/eslintrc@^2.1.3":
-  version "2.1.3"
-  resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-2.1.3.tgz#797470a75fe0fbd5a53350ee715e85e87baff22d"
-  integrity sha512-yZzuIG+jnVu6hNSzFEN07e8BxF3uAzYtQb6uDkaYZLo6oYZDCq454c5kB8zxnzfCYyP4MIuyBn10L0DqwujTmA==
+"@eslint/eslintrc@^2.1.4":
+  version "2.1.4"
+  resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-2.1.4.tgz#388a269f0f25c1b6adc317b5a2c55714894c70ad"
+  integrity sha512-269Z39MS6wVJtsoUl10L60WdkhJVdPG24Q4eZTH3nnF6lpvSShEK3wQjDX9JRWAUPvPh7COouPpU9IrqaZFvtQ==
   dependencies:
     ajv "^6.12.4"
     debug "^4.3.2"
@@ -1752,10 +1850,10 @@
     minimatch "^3.1.2"
     strip-json-comments "^3.1.1"
 
-"@eslint/js@8.54.0":
-  version "8.54.0"
-  resolved "https://registry.yarnpkg.com/@eslint/js/-/js-8.54.0.tgz#4fab9a2ff7860082c304f750e94acd644cf984cf"
-  integrity sha512-ut5V+D+fOoWPgGGNj83GGjnntO39xDy6DWxO0wb7Jp3DcMX0TfIqdzHF85VTQkerdyGmuuMD9AKAo5KiNlf/AQ==
+"@eslint/js@8.56.0":
+  version "8.56.0"
+  resolved "https://registry.yarnpkg.com/@eslint/js/-/js-8.56.0.tgz#ef20350fec605a7f7035a01764731b2de0f3782b"
+  integrity sha512-gMsVel9D7f2HLkBma9VbtzZRehRogVRfbr++f06nL2vnCGCNlzOD+/MUov/F4p8myyAHspEhVobgjpX64q5m6A==
 
 "@ethereumjs/common@^2.6.4":
   version "2.6.5"
@@ -2153,118 +2251,118 @@
   resolved "https://registry.yarnpkg.com/@humanwhocodes/object-schema/-/object-schema-2.0.1.tgz#e5211452df060fa8522b55c7b3c0c4d1981cb044"
   integrity sha512-dvuCeX5fC9dXgJn9t+X5atfmgQAzUOWqS1254Gh0m6i8wKd10ebXkfNKiRK+1GWi/yTvvLDHpoxLr0xxxeslWw==
 
-"@img/sharp-darwin-arm64@0.33.0":
-  version "0.33.0"
-  resolved "https://registry.yarnpkg.com/@img/sharp-darwin-arm64/-/sharp-darwin-arm64-0.33.0.tgz#b3e4ed1887f53faca5e95e3fd9f25181432353ed"
-  integrity sha512-070tEheekI1LJWTGPC9WlQEa5UoKTXzzlORBHMX4TbfUxMiL336YHR8vBEUNsjse0RJCX8dZ4ZXwT595aEF1ug==
+"@img/sharp-darwin-arm64@0.33.2":
+  version "0.33.2"
+  resolved "https://registry.yarnpkg.com/@img/sharp-darwin-arm64/-/sharp-darwin-arm64-0.33.2.tgz#0a52a82c2169112794dac2c71bfba9e90f7c5bd1"
+  integrity sha512-itHBs1rPmsmGF9p4qRe++CzCgd+kFYktnsoR1sbIAfsRMrJZau0Tt1AH9KVnufc2/tU02Gf6Ibujx+15qRE03w==
   optionalDependencies:
-    "@img/sharp-libvips-darwin-arm64" "1.0.0"
+    "@img/sharp-libvips-darwin-arm64" "1.0.1"
 
-"@img/sharp-darwin-x64@0.33.0":
-  version "0.33.0"
-  resolved "https://registry.yarnpkg.com/@img/sharp-darwin-x64/-/sharp-darwin-x64-0.33.0.tgz#277714bff6e6d468162146019933a416467f3082"
-  integrity sha512-pu/nvn152F3qbPeUkr+4e9zVvEhD3jhwzF473veQfMPkOYo9aoWXSfdZH/E6F+nYC3qvFjbxbvdDbUtEbghLqw==
+"@img/sharp-darwin-x64@0.33.2":
+  version "0.33.2"
+  resolved "https://registry.yarnpkg.com/@img/sharp-darwin-x64/-/sharp-darwin-x64-0.33.2.tgz#982e26bb9d38a81f75915c4032539aed621d1c21"
+  integrity sha512-/rK/69Rrp9x5kaWBjVN07KixZanRr+W1OiyKdXcbjQD6KbW+obaTeBBtLUAtbBsnlTTmWthw99xqoOS7SsySDg==
   optionalDependencies:
-    "@img/sharp-libvips-darwin-x64" "1.0.0"
+    "@img/sharp-libvips-darwin-x64" "1.0.1"
 
-"@img/sharp-libvips-darwin-arm64@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@img/sharp-libvips-darwin-arm64/-/sharp-libvips-darwin-arm64-1.0.0.tgz#8baf27b01dabba524e885c30287e1916ab978de7"
-  integrity sha512-VzYd6OwnUR81sInf3alj1wiokY50DjsHz5bvfnsFpxs5tqQxESoHtJO6xyksDs3RIkyhMWq2FufXo6GNSU9BMw==
+"@img/sharp-libvips-darwin-arm64@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@img/sharp-libvips-darwin-arm64/-/sharp-libvips-darwin-arm64-1.0.1.tgz#81e83ffc2c497b3100e2f253766490f8fad479cd"
+  integrity sha512-kQyrSNd6lmBV7O0BUiyu/OEw9yeNGFbQhbxswS1i6rMDwBBSX+e+rPzu3S+MwAiGU3HdLze3PanQ4Xkfemgzcw==
 
-"@img/sharp-libvips-darwin-x64@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@img/sharp-libvips-darwin-x64/-/sharp-libvips-darwin-x64-1.0.0.tgz#509113f649d3ea0e99b76d41437fc0049d8ba2f9"
-  integrity sha512-dD9OznTlHD6aovRswaPNEy8dKtSAmNo4++tO7uuR4o5VxbVAOoEQ1uSmN4iFAdQneTHws1lkTZeiXPrcCkh6IA==
+"@img/sharp-libvips-darwin-x64@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@img/sharp-libvips-darwin-x64/-/sharp-libvips-darwin-x64-1.0.1.tgz#fc1fcd9d78a178819eefe2c1a1662067a83ab1d6"
+  integrity sha512-eVU/JYLPVjhhrd8Tk6gosl5pVlvsqiFlt50wotCvdkFGf+mDNBJxMh+bvav+Wt3EBnNZWq8Sp2I7XfSjm8siog==
 
-"@img/sharp-libvips-linux-arm64@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@img/sharp-libvips-linux-arm64/-/sharp-libvips-linux-arm64-1.0.0.tgz#9e131cc95f9f8aa36da9addee89efead21ad9993"
-  integrity sha512-xTYThiqEZEZc0PRU90yVtM3KE7lw1bKdnDQ9kCTHWbqWyHOe4NpPOtMGy27YnN51q0J5dqRrvicfPbALIOeAZA==
+"@img/sharp-libvips-linux-arm64@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@img/sharp-libvips-linux-arm64/-/sharp-libvips-linux-arm64-1.0.1.tgz#26eb8c556a9b0db95f343fc444abc3effb67ebcf"
+  integrity sha512-bnGG+MJjdX70mAQcSLxgeJco11G+MxTz+ebxlz8Y3dxyeb3Nkl7LgLI0mXupoO+u1wRNx/iRj5yHtzA4sde1yA==
 
-"@img/sharp-libvips-linux-arm@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@img/sharp-libvips-linux-arm/-/sharp-libvips-linux-arm-1.0.0.tgz#a529f68a28ab1d219907071c41ace029121d1c4f"
-  integrity sha512-VwgD2eEikDJUk09Mn9Dzi1OW2OJFRQK+XlBTkUNmAWPrtj8Ly0yq05DFgu1VCMx2/DqCGQVi5A1dM9hTmxf3uw==
+"@img/sharp-libvips-linux-arm@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@img/sharp-libvips-linux-arm/-/sharp-libvips-linux-arm-1.0.1.tgz#2a377b959ff7dd6528deee486c25461296a4fa8b"
+  integrity sha512-FtdMvR4R99FTsD53IA3LxYGghQ82t3yt0ZQ93WMZ2xV3dqrb0E8zq4VHaTOuLEAuA83oDawHV3fd+BsAPadHIQ==
 
-"@img/sharp-libvips-linux-s390x@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@img/sharp-libvips-linux-s390x/-/sharp-libvips-linux-s390x-1.0.0.tgz#c26aaa9ee58b47ff901bb5f93f29c4ab3f03caf7"
-  integrity sha512-o9E46WWBC6JsBlwU4QyU9578G77HBDT1NInd+aERfxeOPbk0qBZHgoDsQmA2v9TbqJRWzoBPx1aLOhprBMgPjw==
+"@img/sharp-libvips-linux-s390x@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@img/sharp-libvips-linux-s390x/-/sharp-libvips-linux-s390x-1.0.1.tgz#af28ac9ba929204467ecdf843330d791e9421e10"
+  integrity sha512-3+rzfAR1YpMOeA2zZNp+aYEzGNWK4zF3+sdMxuCS3ey9HhDbJ66w6hDSHDMoap32DueFwhhs3vwooAB2MaK4XQ==
 
-"@img/sharp-libvips-linux-x64@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@img/sharp-libvips-linux-x64/-/sharp-libvips-linux-x64-1.0.0.tgz#7a04795fbf2668b9dd7c74bf8326cb779131d809"
-  integrity sha512-naldaJy4hSVhWBgEjfdBY85CAa4UO+W1nx6a1sWStHZ7EUfNiuBTTN2KUYT5dH1+p/xij1t2QSXfCiFJoC5S/Q==
+"@img/sharp-libvips-linux-x64@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@img/sharp-libvips-linux-x64/-/sharp-libvips-linux-x64-1.0.1.tgz#4273d182aa51912e655e1214ea47983d7c1f7f8d"
+  integrity sha512-3NR1mxFsaSgMMzz1bAnnKbSAI+lHXVTqAHgc1bgzjHuXjo4hlscpUxc0vFSAPKI3yuzdzcZOkq7nDPrP2F8Jgw==
 
-"@img/sharp-libvips-linuxmusl-arm64@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@img/sharp-libvips-linuxmusl-arm64/-/sharp-libvips-linuxmusl-arm64-1.0.0.tgz#600e7322faa5ce124d3ae2cbf63808ea47678591"
-  integrity sha512-OdorplCyvmSAPsoJLldtLh3nLxRrkAAAOHsGWGDYfN0kh730gifK+UZb3dWORRa6EusNqCTjfXV4GxvgJ/nPDQ==
+"@img/sharp-libvips-linuxmusl-arm64@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@img/sharp-libvips-linuxmusl-arm64/-/sharp-libvips-linuxmusl-arm64-1.0.1.tgz#d150c92151cea2e8d120ad168b9c358d09c77ce8"
+  integrity sha512-5aBRcjHDG/T6jwC3Edl3lP8nl9U2Yo8+oTl5drd1dh9Z1EBfzUKAJFUDTDisDjUwc7N4AjnPGfCA3jl3hY8uDg==
 
-"@img/sharp-libvips-linuxmusl-x64@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@img/sharp-libvips-linuxmusl-x64/-/sharp-libvips-linuxmusl-x64-1.0.0.tgz#af33a04e75f192c5396c6a41df8b7b7bf15a8006"
-  integrity sha512-FW8iK6rJrg+X2jKD0Ajhjv6y74lToIBEvkZhl42nZt563FfxkCYacrXZtd+q/sRQDypQLzY5WdLkVTbJoPyqNg==
+"@img/sharp-libvips-linuxmusl-x64@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@img/sharp-libvips-linuxmusl-x64/-/sharp-libvips-linuxmusl-x64-1.0.1.tgz#e297c1a4252c670d93b0f9e51fca40a7a5b6acfd"
+  integrity sha512-dcT7inI9DBFK6ovfeWRe3hG30h51cBAP5JXlZfx6pzc/Mnf9HFCQDLtYf4MCBjxaaTfjCCjkBxcy3XzOAo5txw==
 
-"@img/sharp-linux-arm64@0.33.0":
-  version "0.33.0"
-  resolved "https://registry.yarnpkg.com/@img/sharp-linux-arm64/-/sharp-linux-arm64-0.33.0.tgz#d9a361c1d5344754f6038cc9d74e1dd4d217f52f"
-  integrity sha512-dcomVSrtgF70SyOr8RCOCQ8XGVThXwe71A1d8MGA+mXEVRJ/J6/TrCbBEJh9ddcEIIsrnrkolaEvYSHqVhswQw==
+"@img/sharp-linux-arm64@0.33.2":
+  version "0.33.2"
+  resolved "https://registry.yarnpkg.com/@img/sharp-linux-arm64/-/sharp-linux-arm64-0.33.2.tgz#af3409f801a9bee1d11d0c7e971dcd6180f80022"
+  integrity sha512-pz0NNo882vVfqJ0yNInuG9YH71smP4gRSdeL09ukC2YLE6ZyZePAlWKEHgAzJGTiOh8Qkaov6mMIMlEhmLdKew==
   optionalDependencies:
-    "@img/sharp-libvips-linux-arm64" "1.0.0"
+    "@img/sharp-libvips-linux-arm64" "1.0.1"
 
-"@img/sharp-linux-arm@0.33.0":
-  version "0.33.0"
-  resolved "https://registry.yarnpkg.com/@img/sharp-linux-arm/-/sharp-linux-arm-0.33.0.tgz#e0f804033d99ce2af73c78d47eeb118e28b4af41"
-  integrity sha512-4horD3wMFd5a0ddbDY8/dXU9CaOgHjEHALAddXgafoR5oWq5s8X61PDgsSeh4Qupsdo6ycfPPSSNBrfVQnwwrg==
+"@img/sharp-linux-arm@0.33.2":
+  version "0.33.2"
+  resolved "https://registry.yarnpkg.com/@img/sharp-linux-arm/-/sharp-linux-arm-0.33.2.tgz#181f7466e6ac074042a38bfb679eb82505e17083"
+  integrity sha512-Fndk/4Zq3vAc4G/qyfXASbS3HBZbKrlnKZLEJzPLrXoJuipFNNwTes71+Ki1hwYW5lch26niRYoZFAtZVf3EGA==
   optionalDependencies:
-    "@img/sharp-libvips-linux-arm" "1.0.0"
+    "@img/sharp-libvips-linux-arm" "1.0.1"
 
-"@img/sharp-linux-s390x@0.33.0":
-  version "0.33.0"
-  resolved "https://registry.yarnpkg.com/@img/sharp-linux-s390x/-/sharp-linux-s390x-0.33.0.tgz#4b6d49f87364c60ae015825746f365385f1c3b54"
-  integrity sha512-TiVJbx38J2rNVfA309ffSOB+3/7wOsZYQEOlKqOUdWD/nqkjNGrX+YQGz7nzcf5oy2lC+d37+w183iNXRZNngQ==
+"@img/sharp-linux-s390x@0.33.2":
+  version "0.33.2"
+  resolved "https://registry.yarnpkg.com/@img/sharp-linux-s390x/-/sharp-linux-s390x-0.33.2.tgz#9c171f49211f96fba84410b3e237b301286fa00f"
+  integrity sha512-MBoInDXDppMfhSzbMmOQtGfloVAflS2rP1qPcUIiITMi36Mm5YR7r0ASND99razjQUpHTzjrU1flO76hKvP5RA==
   optionalDependencies:
-    "@img/sharp-libvips-linux-s390x" "1.0.0"
+    "@img/sharp-libvips-linux-s390x" "1.0.1"
 
-"@img/sharp-linux-x64@0.33.0":
-  version "0.33.0"
-  resolved "https://registry.yarnpkg.com/@img/sharp-linux-x64/-/sharp-linux-x64-0.33.0.tgz#a4fb262f143f468aec974aad6e53d1859a75ec90"
-  integrity sha512-PaZM4Zi7/Ek71WgTdvR+KzTZpBqrQOFcPe7/8ZoPRlTYYRe43k6TWsf4GVH6XKRLMYeSp8J89RfAhBrSP4itNA==
+"@img/sharp-linux-x64@0.33.2":
+  version "0.33.2"
+  resolved "https://registry.yarnpkg.com/@img/sharp-linux-x64/-/sharp-linux-x64-0.33.2.tgz#b956dfc092adc58c2bf0fae2077e6f01a8b2d5d7"
+  integrity sha512-xUT82H5IbXewKkeF5aiooajoO1tQV4PnKfS/OZtb5DDdxS/FCI/uXTVZ35GQ97RZXsycojz/AJ0asoz6p2/H/A==
   optionalDependencies:
-    "@img/sharp-libvips-linux-x64" "1.0.0"
+    "@img/sharp-libvips-linux-x64" "1.0.1"
 
-"@img/sharp-linuxmusl-arm64@0.33.0":
-  version "0.33.0"
-  resolved "https://registry.yarnpkg.com/@img/sharp-linuxmusl-arm64/-/sharp-linuxmusl-arm64-0.33.0.tgz#423a9e5e3ec1e6476dbdfd78dda91c6f062bfd67"
-  integrity sha512-1QLbbN0zt+32eVrg7bb1lwtvEaZwlhEsY1OrijroMkwAqlHqFj6R33Y47s2XUv7P6Ie1PwCxK/uFnNqMnkd5kg==
+"@img/sharp-linuxmusl-arm64@0.33.2":
+  version "0.33.2"
+  resolved "https://registry.yarnpkg.com/@img/sharp-linuxmusl-arm64/-/sharp-linuxmusl-arm64-0.33.2.tgz#10e0ec5a79d1234c6a71df44c9f3b0bef0bc0f15"
+  integrity sha512-F+0z8JCu/UnMzg8IYW1TMeiViIWBVg7IWP6nE0p5S5EPQxlLd76c8jYemG21X99UzFwgkRo5yz2DS+zbrnxZeA==
   optionalDependencies:
-    "@img/sharp-libvips-linuxmusl-arm64" "1.0.0"
+    "@img/sharp-libvips-linuxmusl-arm64" "1.0.1"
 
-"@img/sharp-linuxmusl-x64@0.33.0":
-  version "0.33.0"
-  resolved "https://registry.yarnpkg.com/@img/sharp-linuxmusl-x64/-/sharp-linuxmusl-x64-0.33.0.tgz#9d0beac9a71cd7d3bc41eef63521e60edc3820f5"
-  integrity sha512-CecqgB/CnkvCWFhmfN9ZhPGMLXaEBXl4o7WtA6U3Ztrlh/s7FUKX4vNxpMSYLIrWuuzjiaYdfU3+Tdqh1xaHfw==
+"@img/sharp-linuxmusl-x64@0.33.2":
+  version "0.33.2"
+  resolved "https://registry.yarnpkg.com/@img/sharp-linuxmusl-x64/-/sharp-linuxmusl-x64-0.33.2.tgz#29e0030c24aa27c38201b1fc84e3d172899fcbe0"
+  integrity sha512-+ZLE3SQmSL+Fn1gmSaM8uFusW5Y3J9VOf+wMGNnTtJUMUxFhv+P4UPaYEYT8tqnyYVaOVGgMN/zsOxn9pSsO2A==
   optionalDependencies:
-    "@img/sharp-libvips-linuxmusl-x64" "1.0.0"
+    "@img/sharp-libvips-linuxmusl-x64" "1.0.1"
 
-"@img/sharp-wasm32@0.33.0":
-  version "0.33.0"
-  resolved "https://registry.yarnpkg.com/@img/sharp-wasm32/-/sharp-wasm32-0.33.0.tgz#5b085509f04256c43f201552fce5144fe0bd66b9"
-  integrity sha512-Hn4js32gUX9qkISlemZBUPuMs0k/xNJebUNl/L6djnU07B/HAA2KaxRVb3HvbU5fL242hLOcp0+tR+M8dvJUFw==
+"@img/sharp-wasm32@0.33.2":
+  version "0.33.2"
+  resolved "https://registry.yarnpkg.com/@img/sharp-wasm32/-/sharp-wasm32-0.33.2.tgz#38d7c740a22de83a60ad1e6bcfce17462b0d4230"
+  integrity sha512-fLbTaESVKuQcpm8ffgBD7jLb/CQLcATju/jxtTXR1XCLwbOQt+OL5zPHSDMmp2JZIeq82e18yE0Vv7zh6+6BfQ==
   dependencies:
-    "@emnapi/runtime" "^0.44.0"
+    "@emnapi/runtime" "^0.45.0"
 
-"@img/sharp-win32-ia32@0.33.0":
-  version "0.33.0"
-  resolved "https://registry.yarnpkg.com/@img/sharp-win32-ia32/-/sharp-win32-ia32-0.33.0.tgz#a89bc502a70e5547cbff9451d06f9962425e7b39"
-  integrity sha512-5HfcsCZi3l5nPRF2q3bllMVMDXBqEWI3Q8KQONfzl0TferFE5lnsIG0A1YrntMAGqvkzdW6y1Ci1A2uTvxhfzg==
+"@img/sharp-win32-ia32@0.33.2":
+  version "0.33.2"
+  resolved "https://registry.yarnpkg.com/@img/sharp-win32-ia32/-/sharp-win32-ia32-0.33.2.tgz#09456314e223f68e5417c283b45c399635c16202"
+  integrity sha512-okBpql96hIGuZ4lN3+nsAjGeggxKm7hIRu9zyec0lnfB8E7Z6p95BuRZzDDXZOl2e8UmR4RhYt631i7mfmKU8g==
 
-"@img/sharp-win32-x64@0.33.0":
-  version "0.33.0"
-  resolved "https://registry.yarnpkg.com/@img/sharp-win32-x64/-/sharp-win32-x64-0.33.0.tgz#bfae1b82608a0d420e4b0b836ddb7dd58eaffa8e"
-  integrity sha512-i3DtP/2ce1yKFj4OzOnOYltOEL/+dp4dc4dJXJBv6god1AFTcmkaA99H/7SwOmkCOBQkbVvA3lCGm3/5nDtf9Q==
+"@img/sharp-win32-x64@0.33.2":
+  version "0.33.2"
+  resolved "https://registry.yarnpkg.com/@img/sharp-win32-x64/-/sharp-win32-x64-0.33.2.tgz#148e96dfd6e68747da41a311b9ee4559bb1b1471"
+  integrity sha512-E4magOks77DK47FwHUIGH0RYWSgRBfGdK56kIHSVeB9uIS4pPFr4N2kIVsXdQQo4LzOsENKV5KAhRlRL7eMAdg==
 
 "@improbable-eng/grpc-web@^0.14.1":
   version "0.14.1"
@@ -2447,214 +2545,6 @@
     snakecase-keys "^5.1.2"
     store2 "^2.12.0"
 
-"@istanbuljs/load-nyc-config@^1.0.0":
-  version "1.1.0"
-  resolved "https://registry.npmjs.org/@istanbuljs/load-nyc-config/-/load-nyc-config-1.1.0.tgz"
-  integrity sha512-VjeHSlIzpv/NyD3N0YuHfXOPDIixcA1q2ZV98wsMqcYlPmv2n3Yb2lYP9XMElnaFVXg5A7YLTeLu6V84uQDjmQ==
-  dependencies:
-    camelcase "^5.3.1"
-    find-up "^4.1.0"
-    get-package-type "^0.1.0"
-    js-yaml "^3.13.1"
-    resolve-from "^5.0.0"
-
-"@istanbuljs/schema@^0.1.2":
-  version "0.1.3"
-  resolved "https://registry.npmjs.org/@istanbuljs/schema/-/schema-0.1.3.tgz"
-  integrity sha512-ZXRY4jNvVgSVQ8DL3LTcakaAtXwTVUxE81hslsyD2AtoXW/wVob10HkOJ1X/pAlcI7D+2YoZKg5do8G/w6RYgA==
-
-"@jest/console@^29.7.0":
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/@jest/console/-/console-29.7.0.tgz"
-  integrity sha512-5Ni4CU7XHQi32IJ398EEP4RrB8eV09sXP2ROqD4bksHrnTree52PsxvX8tpL8LvTZ3pFzXyPbNQReSN41CAhOg==
-  dependencies:
-    "@jest/types" "^29.6.3"
-    "@types/node" "*"
-    chalk "^4.0.0"
-    jest-message-util "^29.7.0"
-    jest-util "^29.7.0"
-    slash "^3.0.0"
-
-"@jest/core@^29.7.0":
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/@jest/core/-/core-29.7.0.tgz"
-  integrity sha512-n7aeXWKMnGtDA48y8TLWJPJmLmmZ642Ceo78cYWEpiD7FzDgmNDV/GCVRorPABdXLJZ/9wzzgZAlHjXjxDHGsg==
-  dependencies:
-    "@jest/console" "^29.7.0"
-    "@jest/reporters" "^29.7.0"
-    "@jest/test-result" "^29.7.0"
-    "@jest/transform" "^29.7.0"
-    "@jest/types" "^29.6.3"
-    "@types/node" "*"
-    ansi-escapes "^4.2.1"
-    chalk "^4.0.0"
-    ci-info "^3.2.0"
-    exit "^0.1.2"
-    graceful-fs "^4.2.9"
-    jest-changed-files "^29.7.0"
-    jest-config "^29.7.0"
-    jest-haste-map "^29.7.0"
-    jest-message-util "^29.7.0"
-    jest-regex-util "^29.6.3"
-    jest-resolve "^29.7.0"
-    jest-resolve-dependencies "^29.7.0"
-    jest-runner "^29.7.0"
-    jest-runtime "^29.7.0"
-    jest-snapshot "^29.7.0"
-    jest-util "^29.7.0"
-    jest-validate "^29.7.0"
-    jest-watcher "^29.7.0"
-    micromatch "^4.0.4"
-    pretty-format "^29.7.0"
-    slash "^3.0.0"
-    strip-ansi "^6.0.0"
-
-"@jest/environment@^29.7.0":
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/@jest/environment/-/environment-29.7.0.tgz"
-  integrity sha512-aQIfHDq33ExsN4jP1NWGXhxgQ/wixs60gDiKO+XVMd8Mn0NWPWgc34ZQDTb2jKaUWQ7MuwoitXAsN2XVXNMpAw==
-  dependencies:
-    "@jest/fake-timers" "^29.7.0"
-    "@jest/types" "^29.6.3"
-    "@types/node" "*"
-    jest-mock "^29.7.0"
-
-"@jest/expect-utils@^29.7.0":
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/@jest/expect-utils/-/expect-utils-29.7.0.tgz"
-  integrity sha512-GlsNBWiFQFCVi9QVSx7f5AgMeLxe9YCCs5PuP2O2LdjDAA8Jh9eX7lA1Jq/xdXw3Wb3hyvlFNfZIfcRetSzYcA==
-  dependencies:
-    jest-get-type "^29.6.3"
-
-"@jest/expect@^29.7.0":
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/@jest/expect/-/expect-29.7.0.tgz"
-  integrity sha512-8uMeAMycttpva3P1lBHB8VciS9V0XAr3GymPpipdyQXbBcuhkLQOSe8E/p92RyAdToS6ZD1tFkX+CkhoECE0dQ==
-  dependencies:
-    expect "^29.7.0"
-    jest-snapshot "^29.7.0"
-
-"@jest/fake-timers@^29.7.0":
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/@jest/fake-timers/-/fake-timers-29.7.0.tgz"
-  integrity sha512-q4DH1Ha4TTFPdxLsqDXK1d3+ioSL7yL5oCMJZgDYm6i+6CygW5E5xVr/D1HdsGxjt1ZWSfUAs9OxSB/BNelWrQ==
-  dependencies:
-    "@jest/types" "^29.6.3"
-    "@sinonjs/fake-timers" "^10.0.2"
-    "@types/node" "*"
-    jest-message-util "^29.7.0"
-    jest-mock "^29.7.0"
-    jest-util "^29.7.0"
-
-"@jest/globals@^29.7.0":
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/@jest/globals/-/globals-29.7.0.tgz"
-  integrity sha512-mpiz3dutLbkW2MNFubUGUEVLkTGiqW6yLVTA+JbP6fI6J5iL9Y0Nlg8k95pcF8ctKwCS7WVxteBs29hhfAotzQ==
-  dependencies:
-    "@jest/environment" "^29.7.0"
-    "@jest/expect" "^29.7.0"
-    "@jest/types" "^29.6.3"
-    jest-mock "^29.7.0"
-
-"@jest/reporters@^29.7.0":
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/@jest/reporters/-/reporters-29.7.0.tgz"
-  integrity sha512-DApq0KJbJOEzAFYjHADNNxAE3KbhxQB1y5Kplb5Waqw6zVbuWatSnMjE5gs8FUgEPmNsnZA3NCWl9NG0ia04Pg==
-  dependencies:
-    "@bcoe/v8-coverage" "^0.2.3"
-    "@jest/console" "^29.7.0"
-    "@jest/test-result" "^29.7.0"
-    "@jest/transform" "^29.7.0"
-    "@jest/types" "^29.6.3"
-    "@jridgewell/trace-mapping" "^0.3.18"
-    "@types/node" "*"
-    chalk "^4.0.0"
-    collect-v8-coverage "^1.0.0"
-    exit "^0.1.2"
-    glob "^7.1.3"
-    graceful-fs "^4.2.9"
-    istanbul-lib-coverage "^3.0.0"
-    istanbul-lib-instrument "^6.0.0"
-    istanbul-lib-report "^3.0.0"
-    istanbul-lib-source-maps "^4.0.0"
-    istanbul-reports "^3.1.3"
-    jest-message-util "^29.7.0"
-    jest-util "^29.7.0"
-    jest-worker "^29.7.0"
-    slash "^3.0.0"
-    string-length "^4.0.1"
-    strip-ansi "^6.0.0"
-    v8-to-istanbul "^9.0.1"
-
-"@jest/schemas@^29.6.3":
-  version "29.6.3"
-  resolved "https://registry.npmjs.org/@jest/schemas/-/schemas-29.6.3.tgz"
-  integrity sha512-mo5j5X+jIZmJQveBKeS/clAueipV7KgiX1vMgCxam1RNYiqE1w62n0/tJJnHtjW8ZHcQco5gY85jA3mi0L+nSA==
-  dependencies:
-    "@sinclair/typebox" "^0.27.8"
-
-"@jest/source-map@^29.6.3":
-  version "29.6.3"
-  resolved "https://registry.npmjs.org/@jest/source-map/-/source-map-29.6.3.tgz"
-  integrity sha512-MHjT95QuipcPrpLM+8JMSzFx6eHp5Bm+4XeFDJlwsvVBjmKNiIAvasGK2fxz2WbGRlnvqehFbh07MMa7n3YJnw==
-  dependencies:
-    "@jridgewell/trace-mapping" "^0.3.18"
-    callsites "^3.0.0"
-    graceful-fs "^4.2.9"
-
-"@jest/test-result@^29.7.0":
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/@jest/test-result/-/test-result-29.7.0.tgz"
-  integrity sha512-Fdx+tv6x1zlkJPcWXmMDAG2HBnaR9XPSd5aDWQVsfrZmLVT3lU1cwyxLgRmXR9yrq4NBoEm9BMsfgFzTQAbJYA==
-  dependencies:
-    "@jest/console" "^29.7.0"
-    "@jest/types" "^29.6.3"
-    "@types/istanbul-lib-coverage" "^2.0.0"
-    collect-v8-coverage "^1.0.0"
-
-"@jest/test-sequencer@^29.7.0":
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/@jest/test-sequencer/-/test-sequencer-29.7.0.tgz"
-  integrity sha512-GQwJ5WZVrKnOJuiYiAF52UNUJXgTZx1NHjFSEB0qEMmSZKAkdMoIzw/Cj6x6NF4AvV23AUqDpFzQkN/eYCYTxw==
-  dependencies:
-    "@jest/test-result" "^29.7.0"
-    graceful-fs "^4.2.9"
-    jest-haste-map "^29.7.0"
-    slash "^3.0.0"
-
-"@jest/transform@^29.7.0":
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/@jest/transform/-/transform-29.7.0.tgz"
-  integrity sha512-ok/BTPFzFKVMwO5eOHRrvnBVHdRy9IrsrW1GpMaQ9MCnilNLXQKmAX8s1YXDFaai9xJpac2ySzV0YeRRECr2Vw==
-  dependencies:
-    "@babel/core" "^7.11.6"
-    "@jest/types" "^29.6.3"
-    "@jridgewell/trace-mapping" "^0.3.18"
-    babel-plugin-istanbul "^6.1.1"
-    chalk "^4.0.0"
-    convert-source-map "^2.0.0"
-    fast-json-stable-stringify "^2.1.0"
-    graceful-fs "^4.2.9"
-    jest-haste-map "^29.7.0"
-    jest-regex-util "^29.6.3"
-    jest-util "^29.7.0"
-    micromatch "^4.0.4"
-    pirates "^4.0.4"
-    slash "^3.0.0"
-    write-file-atomic "^4.0.2"
-
-"@jest/types@^29.6.3":
-  version "29.6.3"
-  resolved "https://registry.npmjs.org/@jest/types/-/types-29.6.3.tgz"
-  integrity sha512-u3UPsIilWKOM3F9CXtrG8LEJmNxwoCQC/XVj4IKYXvvpx7QIi/Kg1LI5uDmDpKlac62NUtX7eLjRh+jVZcLOzw==
-  dependencies:
-    "@jest/schemas" "^29.6.3"
-    "@types/istanbul-lib-coverage" "^2.0.0"
-    "@types/istanbul-reports" "^3.0.0"
-    "@types/node" "*"
-    "@types/yargs" "^17.0.8"
-    chalk "^4.0.0"
-
 "@jridgewell/gen-mapping@^0.1.0":
   version "0.1.1"
   resolved "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.1.1.tgz"
@@ -2687,14 +2577,6 @@
   resolved "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.14.tgz"
   integrity sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw==
 
-"@jridgewell/trace-mapping@^0.3.12", "@jridgewell/trace-mapping@^0.3.18":
-  version "0.3.18"
-  resolved "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.18.tgz"
-  integrity sha512-w+niJYzMHdd7USdiH2U6869nqhD2nbfZXND5Yp93qIbEmnDNk7PD48o+YchRVpzMU7M6jVCbenTR7PA1FLQ9pA==
-  dependencies:
-    "@jridgewell/resolve-uri" "3.1.0"
-    "@jridgewell/sourcemap-codec" "1.4.14"
-
 "@jridgewell/trace-mapping@^0.3.17", "@jridgewell/trace-mapping@^0.3.9":
   version "0.3.17"
   resolved "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.17.tgz"
@@ -3041,10 +2923,10 @@
     "@react-spring/shared" "~9.7.3"
     "@react-spring/types" "~9.7.3"
 
-"@remix-run/router@1.10.0":
-  version "1.10.0"
-  resolved "https://registry.yarnpkg.com/@remix-run/router/-/router-1.10.0.tgz#e2170dc2049b06e65bbe883adad0e8ddf8291278"
-  integrity sha512-Lm+fYpMfZoEucJ7cMxgt4dYt8jLfbpwRCzAjm9UgSLOkmlqo9gupxt6YX3DY0Fk155NT9l17d/ydi+964uS9Lw==
+"@remix-run/router@1.14.2":
+  version "1.14.2"
+  resolved "https://registry.yarnpkg.com/@remix-run/router/-/router-1.14.2.tgz#4d58f59908d9197ba3179310077f25c88e49ed17"
+  integrity sha512-ACXpdMM9hmKZww21yEqWwiLws/UPLhNKvimN8RrYSqPSvB3ov7sLvAcfvaxePeLvccTQKGdkDIhLYApZVDFuKg==
 
 "@rollup/plugin-commonjs@24.0.0":
   version "24.0.0"
@@ -3094,25 +2976,45 @@
     "@noble/hashes" "~1.3.0"
     "@scure/base" "~1.1.0"
 
-"@sentry-internal/tracing@7.84.0":
-  version "7.84.0"
-  resolved "https://registry.yarnpkg.com/@sentry-internal/tracing/-/tracing-7.84.0.tgz#430da253ee5b075be4ef57f20ea842c0208bc6b0"
-  integrity sha512-y9bGYA0OM6PEREfd+nk4UURZy29tpIw+7vQwpxWfEVs2fqq0/5TBFX/tKFb8AKUI9lVM8v0bcF0bNSCnuPQZHQ==
+"@sentry-internal/feedback@7.94.1":
+  version "7.94.1"
+  resolved "https://registry.yarnpkg.com/@sentry-internal/feedback/-/feedback-7.94.1.tgz#332212255568b1b18c08814bb7f8d37187e1e6c0"
+  integrity sha512-NlJn/TEX1MOPfY4bb6FU0Equ6YuaewZ+lIAqYt3HuEoYI7nYApeRGaPuVLkkezN0cmI7oU/+pJ7v83PtYXCFZw==
   dependencies:
-    "@sentry/core" "7.84.0"
-    "@sentry/types" "7.84.0"
-    "@sentry/utils" "7.84.0"
+    "@sentry/core" "7.94.1"
+    "@sentry/types" "7.94.1"
+    "@sentry/utils" "7.94.1"
 
-"@sentry/browser@7.84.0":
-  version "7.84.0"
-  resolved "https://registry.yarnpkg.com/@sentry/browser/-/browser-7.84.0.tgz#7c82470f0afbb6178f26127894e40e9ce2b1e6d6"
-  integrity sha512-X50TlTKY9WzAnHsYc4FYrCWgm+CdVo0h02ggmodVBUpRLUBjj+cs5Q1plov/v/XeorSwmorNEMUu/n+XZNSsrA==
+"@sentry-internal/replay-canvas@7.94.1":
+  version "7.94.1"
+  resolved "https://registry.yarnpkg.com/@sentry-internal/replay-canvas/-/replay-canvas-7.94.1.tgz#fdf9743c3051d468ae7c42ecf534beb803204154"
+  integrity sha512-kCFxdIJTbo2z8wnAQ3IqNVI8y2lSOtaSSZeBgeqiertro8Pe/DS8AXUnhXnAQkluM2i2koA+AgUo6/4bUeZXuQ==
   dependencies:
-    "@sentry-internal/tracing" "7.84.0"
-    "@sentry/core" "7.84.0"
-    "@sentry/replay" "7.84.0"
-    "@sentry/types" "7.84.0"
-    "@sentry/utils" "7.84.0"
+    "@sentry/core" "7.94.1"
+    "@sentry/replay" "7.94.1"
+    "@sentry/types" "7.94.1"
+
+"@sentry-internal/tracing@7.94.1":
+  version "7.94.1"
+  resolved "https://registry.yarnpkg.com/@sentry-internal/tracing/-/tracing-7.94.1.tgz#27909da03c1541a83002cab655814ec208242b9e"
+  integrity sha512-znxCdrz7tPXm9Bwoe46PW72Zr0Iv7bXT6+b2LNg5fxWiCQVBbQFrMuVvtXEmHxeRRJVEgTh/4TdulB7wrtQIUQ==
+  dependencies:
+    "@sentry/core" "7.94.1"
+    "@sentry/types" "7.94.1"
+    "@sentry/utils" "7.94.1"
+
+"@sentry/browser@7.94.1":
+  version "7.94.1"
+  resolved "https://registry.yarnpkg.com/@sentry/browser/-/browser-7.94.1.tgz#d9a4a1c00138bf799e8559fd1df3eff2fa12155b"
+  integrity sha512-IUR8B/AEPEzLijZ4Uo5qJsgmIBnCudBqAWd3zAiuk3TWYYOQUEvleddFxffN3n6pFhGx3ArksB+AIQBruttLGA==
+  dependencies:
+    "@sentry-internal/feedback" "7.94.1"
+    "@sentry-internal/replay-canvas" "7.94.1"
+    "@sentry-internal/tracing" "7.94.1"
+    "@sentry/core" "7.94.1"
+    "@sentry/replay" "7.94.1"
+    "@sentry/types" "7.94.1"
+    "@sentry/utils" "7.94.1"
 
 "@sentry/cli@^1.77.1":
   version "1.77.1"
@@ -3126,95 +3028,95 @@
     proxy-from-env "^1.1.0"
     which "^2.0.2"
 
-"@sentry/core@7.84.0":
-  version "7.84.0"
-  resolved "https://registry.yarnpkg.com/@sentry/core/-/core-7.84.0.tgz#01d33fc452044ffd8ea57b20f60304b9cfa2b9e1"
-  integrity sha512-tbuwunbBx2kSex15IHCqHDnrMfIlqPc6w/76fwkGqokz3oh9GSEGlLICwmBWL8AypWimUg13IDtFpD0TJTriWA==
+"@sentry/core@7.94.1":
+  version "7.94.1"
+  resolved "https://registry.yarnpkg.com/@sentry/core/-/core-7.94.1.tgz#3696cd78b2196ac27fda5bcfb2338f46241a3ff8"
+  integrity sha512-4sjiMnkbGpv9O98YHVZe7fHNwwdYl+zLoCOoEOadtrJ1EYYvnK/MSixN2HJF7g/0s22xd4xY958QyNIRVR+Iiw==
   dependencies:
-    "@sentry/types" "7.84.0"
-    "@sentry/utils" "7.84.0"
+    "@sentry/types" "7.94.1"
+    "@sentry/utils" "7.94.1"
 
-"@sentry/integrations@7.84.0":
-  version "7.84.0"
-  resolved "https://registry.yarnpkg.com/@sentry/integrations/-/integrations-7.84.0.tgz#3b016903e08f0dade74bbc152ea5605e231e39cd"
-  integrity sha512-aUu95BhnHSf/W/F4BvsFnf4x+piHiah5a180YTMqWcHMkJr7MnCWNIad9RJuHlcINSfyHtUr5+Z4Bajzqg60lw==
+"@sentry/integrations@7.94.1":
+  version "7.94.1"
+  resolved "https://registry.yarnpkg.com/@sentry/integrations/-/integrations-7.94.1.tgz#b2ce0f09adf599161fa16dbde9f2a2e9c3a2d593"
+  integrity sha512-Fw7OxLlGkrVAVO9WtBJezrb5IxxItCTuefv2IfKku+A5EhHtH1AhXYjQynmt0TLLYIUlyBWiatpOngBzS2wSxw==
   dependencies:
-    "@sentry/core" "7.84.0"
-    "@sentry/types" "7.84.0"
-    "@sentry/utils" "7.84.0"
+    "@sentry/core" "7.94.1"
+    "@sentry/types" "7.94.1"
+    "@sentry/utils" "7.94.1"
     localforage "^1.8.1"
 
-"@sentry/nextjs@^7.84.0":
-  version "7.84.0"
-  resolved "https://registry.yarnpkg.com/@sentry/nextjs/-/nextjs-7.84.0.tgz#f6ff11049c1934c378863a80d69ff8777fd8f853"
-  integrity sha512-MjOGR3AZDVYfBQX2jZaxBMl7JaDSbu6uoiycdT+cMCYq722aB9Wv8vUzsCTzzV4/JmCjJFbfSis7S2Vkw7/9FA==
+"@sentry/nextjs@^7.94.1":
+  version "7.94.1"
+  resolved "https://registry.yarnpkg.com/@sentry/nextjs/-/nextjs-7.94.1.tgz#ba617d43c5649372e9e846f406c69b0da96ddb6d"
+  integrity sha512-OOQP/UW82NHnICsUxiVe3tAVfDdvzipxw8F2tZEpqR5Dq6CQ5EGNHMfuGln6wIQFpIdTuLgNwZBRFttHEJ4y8w==
   dependencies:
     "@rollup/plugin-commonjs" "24.0.0"
-    "@sentry/core" "7.84.0"
-    "@sentry/integrations" "7.84.0"
-    "@sentry/node" "7.84.0"
-    "@sentry/react" "7.84.0"
-    "@sentry/types" "7.84.0"
-    "@sentry/utils" "7.84.0"
-    "@sentry/vercel-edge" "7.84.0"
+    "@sentry/core" "7.94.1"
+    "@sentry/integrations" "7.94.1"
+    "@sentry/node" "7.94.1"
+    "@sentry/react" "7.94.1"
+    "@sentry/types" "7.94.1"
+    "@sentry/utils" "7.94.1"
+    "@sentry/vercel-edge" "7.94.1"
     "@sentry/webpack-plugin" "1.21.0"
     chalk "3.0.0"
     resolve "1.22.8"
     rollup "2.78.0"
     stacktrace-parser "^0.1.10"
 
-"@sentry/node@7.84.0":
-  version "7.84.0"
-  resolved "https://registry.yarnpkg.com/@sentry/node/-/node-7.84.0.tgz#c06167106796b2b83c0a9b52fa56f8ca820034ca"
-  integrity sha512-Xm3fIXT3TZOQi+6uQBavI8iOehD3PkY7v0y3hog0d4lQTH88vQK9BBsI+jZEq81Em+RG/u7vZNiFo6YMTnWF7Q==
+"@sentry/node@7.94.1":
+  version "7.94.1"
+  resolved "https://registry.yarnpkg.com/@sentry/node/-/node-7.94.1.tgz#3e123e546330d89e71004f9f5cad1f9ba7581598"
+  integrity sha512-30nyrfVbY1vNoWg5ptGW+soykU532VvKLuXiKty3SKEXjp5bv23JrCcVtuwp9KrW4josHOJbxZUqeNni85YplQ==
   dependencies:
-    "@sentry-internal/tracing" "7.84.0"
-    "@sentry/core" "7.84.0"
-    "@sentry/types" "7.84.0"
-    "@sentry/utils" "7.84.0"
-    https-proxy-agent "^5.0.0"
+    "@sentry-internal/tracing" "7.94.1"
+    "@sentry/core" "7.94.1"
+    "@sentry/types" "7.94.1"
+    "@sentry/utils" "7.94.1"
 
-"@sentry/react@7.84.0":
-  version "7.84.0"
-  resolved "https://registry.yarnpkg.com/@sentry/react/-/react-7.84.0.tgz#2cb3192f7fb67b7696e8ece08d67229b193ddaa4"
-  integrity sha512-VQZrEHwPKCYTSbRYXD2ohXcQg99G1Hgs8eevRUuRpdChmA2e3z/RvT00NlaSNNZrS86wPyKpAK6kickB/eSYrw==
+"@sentry/react@7.94.1":
+  version "7.94.1"
+  resolved "https://registry.yarnpkg.com/@sentry/react/-/react-7.94.1.tgz#e828cbd158dccabb7ac9b70795011525771e1865"
+  integrity sha512-7uzmsssy4Y/syIxVDrSWBWoukSsqR+/BqUO98A78NCWZsG9gxDXvD+l7D/o1u6TVkZo6i1z0NNybb1CtB73hug==
   dependencies:
-    "@sentry/browser" "7.84.0"
-    "@sentry/types" "7.84.0"
-    "@sentry/utils" "7.84.0"
+    "@sentry/browser" "7.94.1"
+    "@sentry/core" "7.94.1"
+    "@sentry/types" "7.94.1"
+    "@sentry/utils" "7.94.1"
     hoist-non-react-statics "^3.3.2"
 
-"@sentry/replay@7.84.0":
-  version "7.84.0"
-  resolved "https://registry.yarnpkg.com/@sentry/replay/-/replay-7.84.0.tgz#7e17876d9a1802ee33800e2b2cbda4e026c0a2af"
-  integrity sha512-c4PxT0ZpvkR9zXNfmAk3ojkm6eZ9+NlDze09RFBOCNo69QwIN90hnvbjXFC1+vRIJsfgo78Zr0ya/Wzb3Rog7Q==
+"@sentry/replay@7.94.1":
+  version "7.94.1"
+  resolved "https://registry.yarnpkg.com/@sentry/replay/-/replay-7.94.1.tgz#cba88d4de453c90aa21db3fd3cb7e66e0ecad0a1"
+  integrity sha512-4wf3CZ1LR2Neh9IiZD0rY8AORS5Dc5HlKfMug026f8KM2aeoDyneM2JFBnPT/ulRnbD2gNciV+kdZiRd5K5jiw==
   dependencies:
-    "@sentry-internal/tracing" "7.84.0"
-    "@sentry/core" "7.84.0"
-    "@sentry/types" "7.84.0"
-    "@sentry/utils" "7.84.0"
+    "@sentry-internal/tracing" "7.94.1"
+    "@sentry/core" "7.94.1"
+    "@sentry/types" "7.94.1"
+    "@sentry/utils" "7.94.1"
 
-"@sentry/types@7.84.0":
-  version "7.84.0"
-  resolved "https://registry.yarnpkg.com/@sentry/types/-/types-7.84.0.tgz#e8db86c36c61659c3b2558f0aa8b6a073a756117"
-  integrity sha512-VqGLIF3JOUrk7yIXjLXJvAORkZL1e3dDX0Q1okRehwyt/5CRE+mdUTeJZkBo9P9mBwgMyvtwklzOGGrzjb4eMA==
+"@sentry/types@7.94.1":
+  version "7.94.1"
+  resolved "https://registry.yarnpkg.com/@sentry/types/-/types-7.94.1.tgz#97b653a6e73078fc82a2c9d2129e22c7ae1ee248"
+  integrity sha512-A7CdEXFSgGyWv2BT2p9cAvJfb+dypvOtsY8ZvZvdPLUa7kqCV7ndhURUqKjvMBzsL2GParHn3ehDTl2eVc7pvA==
 
-"@sentry/utils@7.84.0":
-  version "7.84.0"
-  resolved "https://registry.yarnpkg.com/@sentry/utils/-/utils-7.84.0.tgz#32861d922fa31e86dd2863a1d9dfc5a369e98952"
-  integrity sha512-qdUVuxnRBvaf05AU+28R+xYtZmi/Ymf8os3Njq9g4XuA+QEkZLbzmIpRK5W9Ja7vUtjOeg29Xgg43A8znde9LQ==
+"@sentry/utils@7.94.1":
+  version "7.94.1"
+  resolved "https://registry.yarnpkg.com/@sentry/utils/-/utils-7.94.1.tgz#1164934cf6e2277fb404744b27de38a04310895d"
+  integrity sha512-gQ2EaMpUU1gGH3S+iqpog9gkXbCo8tlhGYA9a5FUtEtER3D3OAlp8dGFwClwzWDAwzjdLT1+X55zmEptU1cP/A==
   dependencies:
-    "@sentry/types" "7.84.0"
+    "@sentry/types" "7.94.1"
 
-"@sentry/vercel-edge@7.84.0":
-  version "7.84.0"
-  resolved "https://registry.yarnpkg.com/@sentry/vercel-edge/-/vercel-edge-7.84.0.tgz#8e8d13ae0d0ca2334daba97d688b4e12c1ca905f"
-  integrity sha512-vabN7aUYdTFTbufoPBnp8DdD3PaaWmlSuGnFQWmAl8AXaR+tB/3wQPfNqcVDdVoyoe8MADHtmU4KHJdMJYgzhg==
+"@sentry/vercel-edge@7.94.1":
+  version "7.94.1"
+  resolved "https://registry.yarnpkg.com/@sentry/vercel-edge/-/vercel-edge-7.94.1.tgz#7876d00770411bf07d3ba0c84badbd32adf79d25"
+  integrity sha512-W+ICIbDuky/Oj0IB17PtBBBj89XGS9a/tiH0Ldoy9peem3Ug4ucgfPxkdjF28hhmY1dA8rDp+aGRCv51/Ydcbg==
   dependencies:
-    "@sentry-internal/tracing" "7.84.0"
-    "@sentry/core" "7.84.0"
-    "@sentry/types" "7.84.0"
-    "@sentry/utils" "7.84.0"
+    "@sentry-internal/tracing" "7.94.1"
+    "@sentry/core" "7.94.1"
+    "@sentry/types" "7.94.1"
+    "@sentry/utils" "7.94.1"
 
 "@sentry/webpack-plugin@1.21.0":
   version "1.21.0"
@@ -3224,25 +3126,6 @@
     "@sentry/cli" "^1.77.1"
     webpack-sources "^2.0.0 || ^3.0.0"
 
-"@sinclair/typebox@^0.27.8":
-  version "0.27.8"
-  resolved "https://registry.npmjs.org/@sinclair/typebox/-/typebox-0.27.8.tgz"
-  integrity sha512-+Fj43pSMwJs4KRrH/938Uf+uAELIgVBmQzg/q1YG10djyfA3TnrU8N8XzqCh/okZdszqBQTZf96idMfE5lnwTA==
-
-"@sinonjs/commons@^2.0.0":
-  version "2.0.0"
-  resolved "https://registry.npmjs.org/@sinonjs/commons/-/commons-2.0.0.tgz"
-  integrity sha512-uLa0j859mMrg2slwQYdO/AkrOfmH+X6LTVmNTS9CqexuE2IvVORIkSpJLqePAbEnKJ77aMmCwr1NUZ57120Xcg==
-  dependencies:
-    type-detect "4.0.8"
-
-"@sinonjs/fake-timers@^10.0.2":
-  version "10.0.2"
-  resolved "https://registry.npmjs.org/@sinonjs/fake-timers/-/fake-timers-10.0.2.tgz"
-  integrity sha512-SwUDyjWnah1AaNl7kxsa7cfLhlTYoiyhDAIgyh+El30YvXs/o7OLXpYH88Zdhyx9JExKrmHDJ+10bwIcY80Jmw==
-  dependencies:
-    "@sinonjs/commons" "^2.0.0"
-
 "@splinetool/react-spline@^2.2.6":
   version "2.2.6"
   resolved "https://registry.npmjs.org/@splinetool/react-spline/-/react-spline-2.2.6.tgz"
@@ -3533,44 +3416,6 @@
     long "^4.0.0"
     protobufjs "~6.11.2"
 
-"@testing-library/dom@^9.0.0":
-  version "9.2.0"
-  resolved "https://registry.npmjs.org/@testing-library/dom/-/dom-9.2.0.tgz"
-  integrity sha512-xTEnpUKiV/bMyEsE5bT4oYA0x0Z/colMtxzUY8bKyPXBNLn/e0V4ZjBZkEhms0xE4pv9QsPfSRu9AWS4y5wGvA==
-  dependencies:
-    "@babel/code-frame" "^7.10.4"
-    "@babel/runtime" "^7.12.5"
-    "@types/aria-query" "^5.0.1"
-    aria-query "^5.0.0"
-    chalk "^4.1.0"
-    dom-accessibility-api "^0.5.9"
-    lz-string "^1.5.0"
-    pretty-format "^27.0.2"
-
-"@testing-library/jest-dom@^5.17.0":
-  version "5.17.0"
-  resolved "https://registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-5.17.0.tgz"
-  integrity sha512-ynmNeT7asXyH3aSVv4vvX4Rb+0qjOhdNHnO/3vuZNqPmhDpV/+rCSGwQ7bLcmU2cJ4dvoheIO85LQj0IbJHEtg==
-  dependencies:
-    "@adobe/css-tools" "^4.0.1"
-    "@babel/runtime" "^7.9.2"
-    "@types/testing-library__jest-dom" "^5.9.1"
-    aria-query "^5.0.0"
-    chalk "^3.0.0"
-    css.escape "^1.5.1"
-    dom-accessibility-api "^0.5.6"
-    lodash "^4.17.15"
-    redent "^3.0.0"
-
-"@testing-library/react@^14.0.0":
-  version "14.0.0"
-  resolved "https://registry.npmjs.org/@testing-library/react/-/react-14.0.0.tgz"
-  integrity sha512-S04gSNJbYE30TlIMLTzv6QCTzt9AqIF5y6s6SzVFILNcNvbV/jU96GeiTPillGQo+Ny64M/5PV7klNYYgv5Dfg==
-  dependencies:
-    "@babel/runtime" "^7.12.5"
-    "@testing-library/dom" "^9.0.0"
-    "@types/react-dom" "^18.0.0"
-
 "@tippyjs/react@^4.2.6":
   version "4.2.6"
   resolved "https://registry.npmjs.org/@tippyjs/react/-/react-4.2.6.tgz"
@@ -3578,54 +3423,11 @@
   dependencies:
     tippy.js "^6.3.1"
 
-"@tootallnate/once@2":
-  version "2.0.0"
-  resolved "https://registry.npmjs.org/@tootallnate/once/-/once-2.0.0.tgz"
-  integrity sha512-XCuKFP5PS55gnMVu3dty8KPatLqUoy/ZYzDzAGCQ8JNFCkLXzmI7vNHCR+XpbZaMWQK/vQubr7PkYq8g470J/A==
-
 "@trysound/sax@0.2.0":
   version "0.2.0"
   resolved "https://registry.npmjs.org/@trysound/sax/-/sax-0.2.0.tgz"
   integrity sha512-L7z9BgrNEcYyUYtF+HaEfiS5ebkh9jXqbszz7pC0hRBPaatV0XjSD3+eHrpqFemQfgwiFF0QPIarnIihIDn7OA==
 
-"@types/aria-query@^5.0.1":
-  version "5.0.1"
-  resolved "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.1.tgz"
-  integrity sha512-XTIieEY+gvJ39ChLcB4If5zHtPxt3Syj5rgZR+e1ctpmK8NjPf0zFqsz4JpLJT0xla9GFDKjy8Cpu331nrmE1Q==
-
-"@types/babel__core@^7.1.14":
-  version "7.20.0"
-  resolved "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.0.tgz"
-  integrity sha512-+n8dL/9GWblDO0iU6eZAwEIJVr5DWigtle+Q6HLOrh/pdbXOhOtqzq8VPPE2zvNJzSKY4vH/z3iT3tn0A3ypiQ==
-  dependencies:
-    "@babel/parser" "^7.20.7"
-    "@babel/types" "^7.20.7"
-    "@types/babel__generator" "*"
-    "@types/babel__template" "*"
-    "@types/babel__traverse" "*"
-
-"@types/babel__generator@*":
-  version "7.6.4"
-  resolved "https://registry.npmjs.org/@types/babel__generator/-/babel__generator-7.6.4.tgz"
-  integrity sha512-tFkciB9j2K755yrTALxD44McOrk+gfpIpvC3sxHjRawj6PfnQxrse4Clq5y/Rq+G3mrBurMax/lG8Qn2t9mSsg==
-  dependencies:
-    "@babel/types" "^7.0.0"
-
-"@types/babel__template@*":
-  version "7.4.1"
-  resolved "https://registry.npmjs.org/@types/babel__template/-/babel__template-7.4.1.tgz"
-  integrity sha512-azBFKemX6kMg5Io+/rdGT0dkGreboUVR0Cdm3fz9QJWpaQGJRQXl7C+6hOTCZcMll7KFyEQpgbYI2lHdsS4U7g==
-  dependencies:
-    "@babel/parser" "^7.1.0"
-    "@babel/types" "^7.0.0"
-
-"@types/babel__traverse@*", "@types/babel__traverse@^7.0.6":
-  version "7.18.5"
-  resolved "https://registry.npmjs.org/@types/babel__traverse/-/babel__traverse-7.18.5.tgz"
-  integrity sha512-enCvTL8m/EHS/zIvJno9nE+ndYPh1/oNFzRYRmtUqJICG2VnCSBzMLW5VN2KCQU91f23tsNKR8v7VJJQMatl7Q==
-  dependencies:
-    "@babel/types" "^7.3.0"
-
 "@types/bn.js@5.1.1", "@types/bn.js@^5.1.0":
   version "5.1.1"
   resolved "https://registry.npmjs.org/@types/bn.js/-/bn.js-5.1.1.tgz"
@@ -3701,49 +3503,6 @@
   resolved "https://registry.npmjs.org/@types/estree/-/estree-1.0.0.tgz"
   integrity sha512-WulqXMDUTYAXCjZnk6JtIHPigp55cVtDgDrO2gHRwhyJto21+1zbVCtOYB2L1F9w4qCQ0rOGWBnBe0FNTiEJIQ==
 
-"@types/graceful-fs@^4.1.3":
-  version "4.1.6"
-  resolved "https://registry.npmjs.org/@types/graceful-fs/-/graceful-fs-4.1.6.tgz"
-  integrity sha512-Sig0SNORX9fdW+bQuTEovKj3uHcUL6LQKbCrrqb1X7J6/ReAbhCXRAhc+SMejhLELFj2QcyuxmUooZ4bt5ReSw==
-  dependencies:
-    "@types/node" "*"
-
-"@types/istanbul-lib-coverage@*", "@types/istanbul-lib-coverage@^2.0.0", "@types/istanbul-lib-coverage@^2.0.1":
-  version "2.0.4"
-  resolved "https://registry.npmjs.org/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.4.tgz"
-  integrity sha512-z/QT1XN4K4KYuslS23k62yDIDLwLFkzxOuMplDtObz0+y7VqJCaO2o+SPwHCvLFZh7xazvvoor2tA/hPz9ee7g==
-
-"@types/istanbul-lib-report@*":
-  version "3.0.0"
-  resolved "https://registry.npmjs.org/@types/istanbul-lib-report/-/istanbul-lib-report-3.0.0.tgz"
-  integrity sha512-plGgXAPfVKFoYfa9NpYDAkseG+g6Jr294RqeqcqDixSbU34MZVJRi/P+7Y8GDpzkEwLaGZZOpKIEmeVZNtKsrg==
-  dependencies:
-    "@types/istanbul-lib-coverage" "*"
-
-"@types/istanbul-reports@^3.0.0":
-  version "3.0.1"
-  resolved "https://registry.npmjs.org/@types/istanbul-reports/-/istanbul-reports-3.0.1.tgz"
-  integrity sha512-c3mAZEuK0lvBp8tmuL74XRKn1+y2dcwOUpH7x4WrF6gk1GIgiluDRgMYQtw2OFcBvAJWlt6ASU3tSqxp0Uu0Aw==
-  dependencies:
-    "@types/istanbul-lib-report" "*"
-
-"@types/jest@*":
-  version "29.5.5"
-  resolved "https://registry.npmjs.org/@types/jest/-/jest-29.5.5.tgz"
-  integrity sha512-ebylz2hnsWR9mYvmBFbXJXr+33UPc4+ZdxyDXh5w0FlPBTfCVN3wPL+kuOiQt3xvrK419v7XWeAs+AeOksafXg==
-  dependencies:
-    expect "^29.0.0"
-    pretty-format "^29.0.0"
-
-"@types/jsdom@^20.0.0":
-  version "20.0.1"
-  resolved "https://registry.npmjs.org/@types/jsdom/-/jsdom-20.0.1.tgz"
-  integrity sha512-d0r18sZPmMQr1eG35u12FZfhIXNrnsPU/g5wvRKCUf/tOGilKKwYMYGqh33BNR6ba+2gkHw1EUiHoN3mn7E5IQ==
-  dependencies:
-    "@types/node" "*"
-    "@types/tough-cookie" "*"
-    parse5 "^7.0.0"
-
 "@types/json5@^0.0.29":
   version "0.0.29"
   resolved "https://registry.npmjs.org/@types/json5/-/json5-0.0.29.tgz"
@@ -3780,12 +3539,12 @@
   resolved "https://registry.npmjs.org/@types/long/-/long-4.0.2.tgz"
   integrity sha512-MqTGEo5bj5t157U6fA/BiDynNkn0YknVdh48CMPkTSpFTVmvao5UQmm7uEF6xBEo7qIMAlY/JSleYaE6VOdpaA==
 
-"@types/node@*", "@types/node@>=13.7.0", "@types/node@^20.8.6":
-  version "20.8.6"
-  resolved "https://registry.npmjs.org/@types/node/-/node-20.8.6.tgz"
-  integrity sha512-eWO4K2Ji70QzKUqRy6oyJWUeB7+g2cRagT3T/nxYibYcT4y2BDL8lqolRXjTHmkZCdJfIPaY73KbJAZmcryxTQ==
+"@types/node@*", "@types/node@>=13.7.0", "@types/node@^20.10.6":
+  version "20.10.6"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-20.10.6.tgz#a3ec84c22965802bf763da55b2394424f22bfbb5"
+  integrity sha512-Vac8H+NlRNNlAmDfGUP7b5h/KA+AtWIzuXy0E6OyP8f1tCLYAtPvKRRDJjAPqhpCb0t6U2j7/xqAuLEebW2kiw==
   dependencies:
-    undici-types "~5.25.1"
+    undici-types "~5.26.4"
 
 "@types/node@10.12.18":
   version "10.12.18"
@@ -3804,7 +3563,7 @@
   resolved "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz"
   integrity sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==
 
-"@types/react-dom@18.2.15", "@types/react-dom@^18.0.0":
+"@types/react-dom@18.2.15":
   version "18.2.15"
   resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-18.2.15.tgz#921af67f9ee023ac37ea84b1bc0cc40b898ea522"
   integrity sha512-HWMdW+7r7MR5+PZqJF6YFNSCtjz1T0dsvo/f1BV6HkV+6erD/nA7wd9NM00KVG83zf2nJ7uATPO9ttdIPvi3gg==
@@ -3839,35 +3598,6 @@
   dependencies:
     "@types/node" "*"
 
-"@types/stack-utils@^2.0.0":
-  version "2.0.1"
-  resolved "https://registry.npmjs.org/@types/stack-utils/-/stack-utils-2.0.1.tgz"
-  integrity sha512-Hl219/BT5fLAaz6NDkSuhzasy49dwQS/DSdu4MdggFB8zcXv7vflBI3xp7FEmkmdDkBUI2bPUNeMttp2knYdxw==
-
-"@types/testing-library__jest-dom@^5.9.1":
-  version "5.14.9"
-  resolved "https://registry.npmjs.org/@types/testing-library__jest-dom/-/testing-library__jest-dom-5.14.9.tgz"
-  integrity sha512-FSYhIjFlfOpGSRyVoMBMuS3ws5ehFQODymf3vlI7U1K8c7PHwWwFY7VREfmsuzHSOnoKs/9/Y983ayOs7eRzqw==
-  dependencies:
-    "@types/jest" "*"
-
-"@types/tough-cookie@*":
-  version "4.0.2"
-  resolved "https://registry.npmjs.org/@types/tough-cookie/-/tough-cookie-4.0.2.tgz"
-  integrity sha512-Q5vtl1W5ue16D+nIaW8JWebSSraJVlK+EthKn7e7UcD4KWsaSJ8BqGPXNaPghgtcn/fhvrN17Tv8ksUsQpiplw==
-
-"@types/yargs-parser@*":
-  version "21.0.0"
-  resolved "https://registry.npmjs.org/@types/yargs-parser/-/yargs-parser-21.0.0.tgz"
-  integrity sha512-iO9ZQHkZxHn4mSakYV0vFHAVDyEOIJQrV2uZ06HxEPcx+mt8swXoZHIbaaJ2crJYFfErySgktuTZ3BeLz+XmFA==
-
-"@types/yargs@^17.0.8":
-  version "17.0.24"
-  resolved "https://registry.npmjs.org/@types/yargs/-/yargs-17.0.24.tgz"
-  integrity sha512-6i0aC7jV6QzQB8ne1joVZ0eSFIstHsCrobmOtghM11yGlH0j43FKL2UhWdELkyps0zuf7qVTUVCCR+tgSlyLLw==
-  dependencies:
-    "@types/yargs-parser" "*"
-
 "@typescript-eslint/parser@^5.4.2 || ^6.0.0":
   version "6.3.0"
   resolved "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-6.3.0.tgz"
@@ -4142,39 +3872,16 @@
   dependencies:
     tslib "^2.3.0"
 
-abab@^2.0.6:
-  version "2.0.6"
-  resolved "https://registry.npmjs.org/abab/-/abab-2.0.6.tgz"
-  integrity sha512-j2afSsaIENvHZN2B8GOpF566vZ5WVk5opAiMTvWgaQT8DkbOqsTfvNAvHoRGU2zzP8cPoqys+xHTRDWW8L+/BA==
-
-acorn-globals@^7.0.0:
-  version "7.0.1"
-  resolved "https://registry.npmjs.org/acorn-globals/-/acorn-globals-7.0.1.tgz"
-  integrity sha512-umOSDSDrfHbTNPuNpC2NSnnA3LUrqpevPb4T9jRx4MagXNS0rs+gwiTcAvqCRmsD6utzsrzNt+ebm00SNWiC3Q==
-  dependencies:
-    acorn "^8.1.0"
-    acorn-walk "^8.0.2"
-
 acorn-jsx@^5.3.2:
   version "5.3.2"
   resolved "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz"
   integrity sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==
 
-acorn-walk@^8.0.2:
-  version "8.2.0"
-  resolved "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.2.0.tgz"
-  integrity sha512-k+iyHEuPgSw6SbuDpGQM+06HQUa04DZ3o+F6CSzXMvvI5KMvnaEqXe+YVe555R9nn6GPt404fos4wcgpw12SDA==
-
 acorn@7.1.1:
   version "7.1.1"
   resolved "https://registry.npmjs.org/acorn/-/acorn-7.1.1.tgz"
   integrity sha512-add7dgA5ppRPxCFJoAGfMDi7PIBXq1RtGo7BhbLaxwrXPOmw8gq48Y9ozT01hUKy9byMjlR20EJhu5zlkErEkg==
 
-acorn@^8.1.0, acorn@^8.8.1:
-  version "8.8.2"
-  resolved "https://registry.npmjs.org/acorn/-/acorn-8.8.2.tgz"
-  integrity sha512-xjIYgE8HBrkpd/sJqOGNspf8uHG+NOHGOw6a/Urj8taM2EXfdNAH2oFcPeIFfsv3+kz/mJrS5VuMqbNLjCa2vw==
-
 acorn@^8.9.0:
   version "8.10.0"
   resolved "https://registry.npmjs.org/acorn/-/acorn-8.10.0.tgz"
@@ -4202,13 +3909,6 @@ ajv@^6.12.4:
     json-schema-traverse "^0.4.1"
     uri-js "^4.2.2"
 
-ansi-escapes@^4.2.1:
-  version "4.3.2"
-  resolved "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-4.3.2.tgz"
-  integrity sha512-gKXj5ALrKWQLsYG9jlTRmR/xKluxHV+Z9QEwNIgCfM1/uwPMCuzVVnh5mwTd+OuBZcwSIMbqssNWRm1lE51QaQ==
-  dependencies:
-    type-fest "^0.21.3"
-
 ansi-escapes@^6.2.0:
   version "6.2.0"
   resolved "https://registry.yarnpkg.com/ansi-escapes/-/ansi-escapes-6.2.0.tgz#8a13ce75286f417f1963487d86ba9f90dccf9947"
@@ -4240,11 +3940,6 @@ ansi-styles@^4.0.0, ansi-styles@^4.1.0:
   dependencies:
     color-convert "^2.0.1"
 
-ansi-styles@^5.0.0:
-  version "5.2.0"
-  resolved "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz"
-  integrity sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==
-
 ansi-styles@^6.0.0, ansi-styles@^6.2.1:
   version "6.2.1"
   resolved "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.1.tgz"
@@ -4255,7 +3950,7 @@ any-promise@^1.0.0:
   resolved "https://registry.npmjs.org/any-promise/-/any-promise-1.3.0.tgz"
   integrity sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==
 
-anymatch@^3.0.3, anymatch@~3.1.2:
+anymatch@~3.1.2:
   version "3.1.3"
   resolved "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz"
   integrity sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==
@@ -4268,19 +3963,12 @@ arg@^5.0.2:
   resolved "https://registry.npmjs.org/arg/-/arg-5.0.2.tgz"
   integrity sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==
 
-argparse@^1.0.7:
-  version "1.0.10"
-  resolved "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz"
-  integrity sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==
-  dependencies:
-    sprintf-js "~1.0.2"
-
 argparse@^2.0.1:
   version "2.0.1"
   resolved "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz"
   integrity sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==
 
-aria-query@^5.0.0, aria-query@^5.1.3:
+aria-query@^5.1.3:
   version "5.1.3"
   resolved "https://registry.npmjs.org/aria-query/-/aria-query-5.1.3.tgz"
   integrity sha512-R5iJ5lkuHybztUfuOAznmboyjWq8O6sqNqtK7CLOqdydi54VNbORp49mb14KbWgG1QD3JFO9hJdZ+y4KutfdOQ==
@@ -4425,6 +4113,15 @@ axios@^0.27.2:
     follow-redirects "^1.14.9"
     form-data "^4.0.0"
 
+axios@^1.6.0:
+  version "1.6.5"
+  resolved "https://registry.yarnpkg.com/axios/-/axios-1.6.5.tgz#2c090da14aeeab3770ad30c3a1461bc970fb0cd8"
+  integrity sha512-Ii012v05KEVuUoFWmMW/UQv9aRIc3ZwkWDcM+h5Il8izZCtRVpDUfwpoFf7eOtajT3QiGR4yDUx7lPqHJULgbg==
+  dependencies:
+    follow-redirects "^1.15.4"
+    form-data "^4.0.0"
+    proxy-from-env "^1.1.0"
+
 axobject-query@^3.1.1:
   version "3.1.1"
   resolved "https://registry.npmjs.org/axobject-query/-/axobject-query-3.1.1.tgz"
@@ -4432,40 +4129,6 @@ axobject-query@^3.1.1:
   dependencies:
     deep-equal "^2.0.5"
 
-babel-jest@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/babel-jest/-/babel-jest-29.7.0.tgz"
-  integrity sha512-BrvGY3xZSwEcCzKvKsCi2GgHqDqsYkOP4/by5xCgIwGXQxIEh+8ew3gmrE1y7XRR6LHZIj6yLYnUi/mm2KXKBg==
-  dependencies:
-    "@jest/transform" "^29.7.0"
-    "@types/babel__core" "^7.1.14"
-    babel-plugin-istanbul "^6.1.1"
-    babel-preset-jest "^29.6.3"
-    chalk "^4.0.0"
-    graceful-fs "^4.2.9"
-    slash "^3.0.0"
-
-babel-plugin-istanbul@^6.1.1:
-  version "6.1.1"
-  resolved "https://registry.npmjs.org/babel-plugin-istanbul/-/babel-plugin-istanbul-6.1.1.tgz"
-  integrity sha512-Y1IQok9821cC9onCx5otgFfRm7Lm+I+wwxOx738M/WLPZ9Q42m4IG5W0FNX8WLL2gYMZo3JkuXIH2DOpWM+qwA==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.0.0"
-    "@istanbuljs/load-nyc-config" "^1.0.0"
-    "@istanbuljs/schema" "^0.1.2"
-    istanbul-lib-instrument "^5.0.4"
-    test-exclude "^6.0.0"
-
-babel-plugin-jest-hoist@^29.6.3:
-  version "29.6.3"
-  resolved "https://registry.npmjs.org/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-29.6.3.tgz"
-  integrity sha512-ESAc/RJvGTFEzRwOTT4+lNDk/GNHMkKbNzsvT0qKRfDyyYTskxB5rnU2njIDYVxXCBHHEI1c0YwHob3WaYujOg==
-  dependencies:
-    "@babel/template" "^7.3.3"
-    "@babel/types" "^7.3.3"
-    "@types/babel__core" "^7.1.14"
-    "@types/babel__traverse" "^7.0.6"
-
 babel-plugin-polyfill-corejs2@^0.3.3:
   version "0.3.3"
   resolved "https://registry.npmjs.org/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.3.3.tgz"
@@ -4490,32 +4153,6 @@ babel-plugin-polyfill-regenerator@^0.4.1:
   dependencies:
     "@babel/helper-define-polyfill-provider" "^0.3.3"
 
-babel-preset-current-node-syntax@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.npmjs.org/babel-preset-current-node-syntax/-/babel-preset-current-node-syntax-1.0.1.tgz"
-  integrity sha512-M7LQ0bxarkxQoN+vz5aJPsLBn77n8QgTFmo8WK0/44auK2xlCXrYcUxHFxgU7qW5Yzw/CjmLRK2uJzaCd7LvqQ==
-  dependencies:
-    "@babel/plugin-syntax-async-generators" "^7.8.4"
-    "@babel/plugin-syntax-bigint" "^7.8.3"
-    "@babel/plugin-syntax-class-properties" "^7.8.3"
-    "@babel/plugin-syntax-import-meta" "^7.8.3"
-    "@babel/plugin-syntax-json-strings" "^7.8.3"
-    "@babel/plugin-syntax-logical-assignment-operators" "^7.8.3"
-    "@babel/plugin-syntax-nullish-coalescing-operator" "^7.8.3"
-    "@babel/plugin-syntax-numeric-separator" "^7.8.3"
-    "@babel/plugin-syntax-object-rest-spread" "^7.8.3"
-    "@babel/plugin-syntax-optional-catch-binding" "^7.8.3"
-    "@babel/plugin-syntax-optional-chaining" "^7.8.3"
-    "@babel/plugin-syntax-top-level-await" "^7.8.3"
-
-babel-preset-jest@^29.6.3:
-  version "29.6.3"
-  resolved "https://registry.npmjs.org/babel-preset-jest/-/babel-preset-jest-29.6.3.tgz"
-  integrity sha512-0B3bhxR6snWXJZtR/RliHTDPRgn1sNHOR0yVtq/IiQFyuOVjFS+wuio/R4gSNkyYmKmJB4wGZv2NZanmKmTnNA==
-  dependencies:
-    babel-plugin-jest-hoist "^29.6.3"
-    babel-preset-current-node-syntax "^1.0.0"
-
 balanced-match@^1.0.0:
   version "1.0.2"
   resolved "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz"
@@ -4687,18 +4324,6 @@ bs58check@<3.0.0, bs58check@^2.1.1, bs58check@^2.1.2:
     create-hash "^1.1.0"
     safe-buffer "^5.1.2"
 
-bser@2.1.1:
-  version "2.1.1"
-  resolved "https://registry.npmjs.org/bser/-/bser-2.1.1.tgz"
-  integrity sha512-gQxTNE/GAfIIrmHLUE3oJyp5FO6HRBfhjnw4/wMmA63ZGDJnWBmgY/lyQBpnDUkGmAhbSe39tx2d/iTOAfglwQ==
-  dependencies:
-    node-int64 "^0.4.0"
-
-buffer-from@^1.0.0:
-  version "1.1.2"
-  resolved "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.2.tgz"
-  integrity sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ==
-
 buffer-xor@^1.0.3:
   version "1.0.3"
   resolved "https://registry.npmjs.org/buffer-xor/-/buffer-xor-1.0.3.tgz"
@@ -4749,11 +4374,6 @@ camelcase-css@^2.0.1:
   resolved "https://registry.npmjs.org/camelcase-css/-/camelcase-css-2.0.1.tgz"
   integrity sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==
 
-camelcase@^5.3.1:
-  version "5.3.1"
-  resolved "https://registry.npmjs.org/camelcase/-/camelcase-5.3.1.tgz"
-  integrity sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==
-
 camelcase@^6.2.0:
   version "6.3.0"
   resolved "https://registry.npmjs.org/camelcase/-/camelcase-6.3.0.tgz"
@@ -4764,7 +4384,7 @@ caniuse-lite@^1.0.30001406, caniuse-lite@^1.0.30001538, caniuse-lite@^1.0.300015
   resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001549.tgz"
   integrity sha512-qRp48dPYSCYaP+KurZLhDYdVE+yEyht/3NlmcJgVQ2VMGt6JL36ndQ/7rgspdZsJuxDPFIo/OzBT2+GmIJ53BA==
 
-chalk@3.0.0, chalk@^3.0.0:
+chalk@3.0.0:
   version "3.0.0"
   resolved "https://registry.npmjs.org/chalk/-/chalk-3.0.0.tgz"
   integrity sha512-4D3B6Wf41KOYRFdszmDqMCGq5VV/uMAB273JILmO+3jAlh8X4qDtdtgCR3fxtbLEMzSx22QdhnDcJvu2u1fVwg==
@@ -4786,7 +4406,7 @@ chalk@^2.0.0, chalk@^2.4.1, chalk@^2.4.2:
     escape-string-regexp "^1.0.5"
     supports-color "^5.3.0"
 
-chalk@^4.0.0, chalk@^4.1.0:
+chalk@^4.0.0:
   version "4.1.2"
   resolved "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz"
   integrity sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==
@@ -4794,11 +4414,6 @@ chalk@^4.0.0, chalk@^4.1.0:
     ansi-styles "^4.1.0"
     supports-color "^7.1.0"
 
-char-regex@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.npmjs.org/char-regex/-/char-regex-1.0.2.tgz"
-  integrity sha512-kWWXztvZ5SBQV+eRgKFeh8q5sLuZY2+8WUIzlxWVTg+oGwY14qylx1KbKzHd8P6ZYkAg0xyIDU9JMHhyJMZ1jw==
-
 chokidar@^3.5.1, chokidar@^3.5.3:
   version "3.5.3"
   resolved "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz"
@@ -4814,11 +4429,6 @@ chokidar@^3.5.1, chokidar@^3.5.3:
   optionalDependencies:
     fsevents "~2.3.2"
 
-ci-info@^3.2.0:
-  version "3.8.0"
-  resolved "https://registry.npmjs.org/ci-info/-/ci-info-3.8.0.tgz"
-  integrity sha512-eXTggHWSooYhq49F2opQhuHWgzucfF2YgODK4e1566GQs5BIfP30B0oenwBJHfWxAs2fyPB1s7Mg949zLf61Yw==
-
 cipher-base@^1.0.0, cipher-base@^1.0.1, cipher-base@^1.0.3:
   version "1.0.4"
   resolved "https://registry.npmjs.org/cipher-base/-/cipher-base-1.0.4.tgz"
@@ -4827,11 +4437,6 @@ cipher-base@^1.0.0, cipher-base@^1.0.1, cipher-base@^1.0.3:
     inherits "^2.0.1"
     safe-buffer "^5.0.1"
 
-cjs-module-lexer@^1.0.0:
-  version "1.2.2"
-  resolved "https://registry.npmjs.org/cjs-module-lexer/-/cjs-module-lexer-1.2.2.tgz"
-  integrity sha512-cOU9usZw8/dXIXKtwa8pM0OTJQuJkxMN6w30csNRUerHfeQ5R6U3kkU/FtJeIf3M202OHfY2U8ccInBG7/xogA==
-
 classnames@^2.3.2:
   version "2.3.2"
   resolved "https://registry.npmjs.org/classnames/-/classnames-2.3.2.tgz"
@@ -4866,15 +4471,6 @@ cliui@^7.0.2:
     strip-ansi "^6.0.0"
     wrap-ansi "^7.0.0"
 
-cliui@^8.0.1:
-  version "8.0.1"
-  resolved "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz"
-  integrity sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==
-  dependencies:
-    string-width "^4.2.0"
-    strip-ansi "^6.0.1"
-    wrap-ansi "^7.0.0"
-
 clsx@^1.1.1:
   version "1.2.1"
   resolved "https://registry.npmjs.org/clsx/-/clsx-1.2.1.tgz"
@@ -4885,16 +4481,6 @@ clsx@^2.0.0:
   resolved "https://registry.yarnpkg.com/clsx/-/clsx-2.0.0.tgz#12658f3fd98fafe62075595a5c30e43d18f3d00b"
   integrity sha512-rQ1+kcj+ttHG0MKVGBUXwayCCF1oh39BF5COIpRzuCEv8Mwjv0XucrI2ExNTOn9IlLifGClWQcU9BrZORvtw6Q==
 
-co@^4.6.0:
-  version "4.6.0"
-  resolved "https://registry.npmjs.org/co/-/co-4.6.0.tgz"
-  integrity sha512-QVb0dM5HvG+uaxitm8wONl7jltx8dqhfU33DcqtOZcLSVIKSDDLDi7+0LbAKiyI8hD9u42m2YxXSkMGWThaecQ==
-
-collect-v8-coverage@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.npmjs.org/collect-v8-coverage/-/collect-v8-coverage-1.0.1.tgz"
-  integrity sha512-iBPtljfCNcTKNAto0KEtDfZ3qzjJvqE3aTGZsbhjSBlorqpXJlaWWtPO35D+ZImoC3KWejX64o+yPGxhWSTzfg==
-
 color-convert@^1.9.0:
   version "1.9.3"
   resolved "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz"
@@ -4972,16 +4558,11 @@ concat-map@0.0.1:
   resolved "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz"
   integrity sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==
 
-convert-source-map@^1.6.0, convert-source-map@^1.7.0:
+convert-source-map@^1.7.0:
   version "1.9.0"
   resolved "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.9.0.tgz"
   integrity sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==
 
-convert-source-map@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz"
-  integrity sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==
-
 copy-to-clipboard@^3.3.1:
   version "3.3.3"
   resolved "https://registry.npmjs.org/copy-to-clipboard/-/copy-to-clipboard-3.3.3.tgz"
@@ -5048,6 +4629,11 @@ cosmjs-types@^0.8.0:
     long "^4.0.0"
     protobufjs "~6.11.2"
 
+cosmjs-types@^0.9.0:
+  version "0.9.0"
+  resolved "https://registry.yarnpkg.com/cosmjs-types/-/cosmjs-types-0.9.0.tgz#c3bc482d28c7dfa25d1445093fdb2d9da1f6cfcc"
+  integrity sha512-MN/yUe6mkJwHnCFfsNPeCfXVhyxHYW6c/xDUzrSbBycYzw++XvWDMJArXp2pLdgD6FQ8DW79vkPjeNKVrXaHeQ==
+
 crc-32@^1.2.0:
   version "1.2.2"
   resolved "https://registry.npmjs.org/crc-32/-/crc-32-1.2.2.tgz"
@@ -5076,19 +4662,6 @@ create-hmac@^1.1.4, create-hmac@^1.1.7:
     safe-buffer "^5.0.1"
     sha.js "^2.4.8"
 
-create-jest@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/create-jest/-/create-jest-29.7.0.tgz"
-  integrity sha512-Adz2bdH0Vq3F53KEMJOoftQFutWCukm6J24wbPWRO4k1kMY7gS7ds/uoJkNuV8wDCtWWnuwGcJwpWcih+zEW1Q==
-  dependencies:
-    "@jest/types" "^29.6.3"
-    chalk "^4.0.0"
-    exit "^0.1.2"
-    graceful-fs "^4.2.9"
-    jest-config "^29.7.0"
-    jest-util "^29.7.0"
-    prompts "^2.0.1"
-
 cross-spawn@^7.0.2, cross-spawn@^7.0.3:
   version "7.0.3"
   resolved "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz"
@@ -5135,11 +4708,6 @@ css-what@^6.1.0:
   resolved "https://registry.npmjs.org/css-what/-/css-what-6.1.0.tgz"
   integrity sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==
 
-css.escape@^1.5.1:
-  version "1.5.1"
-  resolved "https://registry.npmjs.org/css.escape/-/css.escape-1.5.1.tgz"
-  integrity sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==
-
 cssesc@^3.0.0:
   version "3.0.0"
   resolved "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz"
@@ -5152,23 +4720,6 @@ csso@^5.0.5:
   dependencies:
     css-tree "~2.2.0"
 
-cssom@^0.5.0:
-  version "0.5.0"
-  resolved "https://registry.npmjs.org/cssom/-/cssom-0.5.0.tgz"
-  integrity sha512-iKuQcq+NdHqlAcwUY0o/HL69XQrUaQdMjmStJ8JFmUaiiQErlhrmuigkg/CU4E2J0IyUKUrMAgl36TvN67MqTw==
-
-cssom@~0.3.6:
-  version "0.3.8"
-  resolved "https://registry.npmjs.org/cssom/-/cssom-0.3.8.tgz"
-  integrity sha512-b0tGHbfegbhPJpxpiBPU2sCkigAqtM9O121le6bbOlgyV+NyGyCmVfJ6QW9eRjz8CpNfWEOYBIMIGRYkLwsIYg==
-
-cssstyle@^2.3.0:
-  version "2.3.0"
-  resolved "https://registry.npmjs.org/cssstyle/-/cssstyle-2.3.0.tgz"
-  integrity sha512-AZL67abkUzIuvcHqk7c09cezpGNcxUxU4Ioi/05xHk4DQeTkWmGYftIE6ctU6AEt+Gn4n1lDStOtj7FKycP71A==
-  dependencies:
-    cssom "~0.3.6"
-
 csstype@^3.0.2:
   version "3.1.1"
   resolved "https://registry.npmjs.org/csstype/-/csstype-3.1.1.tgz"
@@ -5250,15 +4801,6 @@ damerau-levenshtein@^1.0.8:
   resolved "https://registry.npmjs.org/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz"
   integrity sha512-sdQSFB7+llfUcQHUQO3+B8ERRj0Oa4w9POWMI/puGtuf7gFywGmkaLCElnudfTiKZV+NvHqL0ifzdrI8Ro7ESA==
 
-data-urls@^3.0.2:
-  version "3.0.2"
-  resolved "https://registry.npmjs.org/data-urls/-/data-urls-3.0.2.tgz"
-  integrity sha512-Jy/tj3ldjZJo63sVAvg6LHt2mHvl4V6AgRAmNDtLdm7faqtsx+aJG42rsyCo9JCoRVKwPFzKlIPx3DIibwSIaQ==
-  dependencies:
-    abab "^2.0.6"
-    whatwg-mimetype "^3.0.0"
-    whatwg-url "^11.0.0"
-
 debounce-promise@^3.1.2:
   version "3.1.2"
   resolved "https://registry.npmjs.org/debounce-promise/-/debounce-promise-3.1.2.tgz"
@@ -5283,21 +4825,11 @@ decimal.js-light@^2.4.1:
   resolved "https://registry.npmjs.org/decimal.js-light/-/decimal.js-light-2.5.1.tgz"
   integrity sha512-qIMFpTMZmny+MMIitAB6D7iVPEorVw6YQRWkvarTkT4tBeSLLiHzcwj6q0MmYSFCiVpiqPJTJEYIrpcPzVEIvg==
 
-decimal.js@^10.4.2:
-  version "10.4.3"
-  resolved "https://registry.npmjs.org/decimal.js/-/decimal.js-10.4.3.tgz"
-  integrity sha512-VBBaLc1MgL5XpzgIP7ny5Z6Nx3UrRkIViUkPUdtl9aya5amy3De1gsUUSB1g3+3sExYNjCAsAznmukyxCb1GRA==
-
 decode-uri-component@^0.2.2:
   version "0.2.2"
   resolved "https://registry.npmjs.org/decode-uri-component/-/decode-uri-component-0.2.2.tgz"
   integrity sha512-FqUYQ+8o158GyGTrMFJms9qh3CqTKvAqgqsTnkLI8sKu0028orqBhxNMFkFen0zGyg6epACD32pjVk58ngIErQ==
 
-dedent@^1.0.0:
-  version "1.5.1"
-  resolved "https://registry.npmjs.org/dedent/-/dedent-1.5.1.tgz"
-  integrity sha512-+LxW+KLWxu3HW3M2w2ympwtqPrqYRzU8fqi6Fhd18fBALe15blJPI/I4+UHveMVG6lJqB4JNd4UG0S5cnVHwIg==
-
 deep-equal@^2.0.5:
   version "2.2.0"
   resolved "https://registry.npmjs.org/deep-equal/-/deep-equal-2.2.0.tgz"
@@ -5321,12 +4853,12 @@ deep-equal@^2.0.5:
     which-collection "^1.0.1"
     which-typed-array "^1.1.9"
 
-deep-is@^0.1.3, deep-is@~0.1.3:
+deep-is@^0.1.3:
   version "0.1.4"
   resolved "https://registry.npmjs.org/deep-is/-/deep-is-0.1.4.tgz"
   integrity sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==
 
-deepmerge@^4.2.2, deepmerge@^4.3.1:
+deepmerge@^4.3.1:
   version "4.3.1"
   resolved "https://registry.npmjs.org/deepmerge/-/deepmerge-4.3.1.tgz"
   integrity sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==
@@ -5382,21 +4914,11 @@ detect-libc@^2.0.2:
   resolved "https://registry.yarnpkg.com/detect-libc/-/detect-libc-2.0.2.tgz#8ccf2ba9315350e1241b88d0ac3b0e1fbd99605d"
   integrity sha512-UX6sGumvvqSaXgdKGUsgZWqcUyIXZ/vZTrlRT/iobiKhGL0zL4d3osHj3uqllWJK+i+sixDS/3COVEOFbupFyw==
 
-detect-newline@^3.0.0:
-  version "3.1.0"
-  resolved "https://registry.npmjs.org/detect-newline/-/detect-newline-3.1.0.tgz"
-  integrity sha512-TLz+x/vEXm/Y7P7wn1EJFNLxYpUD4TgMosxY6fAVJUnJMbupHBOncxyWUG9OpTaH9EBD7uFI5LfEgmMOc54DsA==
-
 didyoumean@^1.2.2:
   version "1.2.2"
   resolved "https://registry.npmjs.org/didyoumean/-/didyoumean-1.2.2.tgz"
   integrity sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==
 
-diff-sequences@^29.6.3:
-  version "29.6.3"
-  resolved "https://registry.npmjs.org/diff-sequences/-/diff-sequences-29.6.3.tgz"
-  integrity sha512-EjePK1srD3P08o2j4f0ExnylqRs5B9tJjcp9t1krH2qRi8CCdsYfwe9JgSLurFBWwq4uOlipzfk5fHNvwFKr8Q==
-
 dir-glob@^3.0.1:
   version "3.0.1"
   resolved "https://registry.npmjs.org/dir-glob/-/dir-glob-3.0.1.tgz"
@@ -5423,11 +4945,6 @@ doctrine@^3.0.0:
   dependencies:
     esutils "^2.0.2"
 
-dom-accessibility-api@^0.5.6, dom-accessibility-api@^0.5.9:
-  version "0.5.16"
-  resolved "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.5.16.tgz"
-  integrity sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==
-
 dom-helpers@^3.4.0:
   version "3.4.0"
   resolved "https://registry.npmjs.org/dom-helpers/-/dom-helpers-3.4.0.tgz"
@@ -5449,13 +4966,6 @@ domelementtype@^2.3.0:
   resolved "https://registry.npmjs.org/domelementtype/-/domelementtype-2.3.0.tgz"
   integrity sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==
 
-domexception@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.npmjs.org/domexception/-/domexception-4.0.0.tgz"
-  integrity sha512-A2is4PLG+eeSfoTMA95/s4pvAoSo2mKtiM5jlHkAVewmiO8ISFTFKZjH7UAM1Atli/OT/7JHOrJRJiMKUZKYBw==
-  dependencies:
-    webidl-conversions "^7.0.0"
-
 domhandler@^5.0.1, domhandler@^5.0.2:
   version "5.0.3"
   resolved "https://registry.npmjs.org/domhandler/-/domhandler-5.0.3.tgz"
@@ -5549,11 +5059,6 @@ elliptic@6.5.4, elliptic@^6.4.0, elliptic@^6.4.1, elliptic@^6.5.2, elliptic@^6.5
     minimalistic-assert "^1.0.1"
     minimalistic-crypto-utils "^1.0.1"
 
-emittery@^0.13.1:
-  version "0.13.1"
-  resolved "https://registry.npmjs.org/emittery/-/emittery-0.13.1.tgz"
-  integrity sha512-DeWwawk6r5yR9jFgnDKYt4sLS0LmHJJi3ZOnb5/JdbYwj3nW+FxQnHIjhBKz8YLC7oRNPVM9NQ47I3CVx34eqQ==
-
 emoji-regex@^10.3.0:
   version "10.3.0"
   resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-10.3.0.tgz#76998b9268409eb3dae3de989254d456e70cfe23"
@@ -5783,28 +5288,11 @@ escape-string-regexp@^1.0.5:
   resolved "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz"
   integrity sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==
 
-escape-string-regexp@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-2.0.0.tgz"
-  integrity sha512-UpzcLCXolUWcNu5HtVMHYdXJjArjsF9C0aNnquZYY4uW/Vu0miy5YoWvbV345HauVvcAUnpRuhMMcqTcGOY2+w==
-
 escape-string-regexp@^4.0.0:
   version "4.0.0"
   resolved "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz"
   integrity sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==
 
-escodegen@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.npmjs.org/escodegen/-/escodegen-2.0.0.tgz"
-  integrity sha512-mmHKys/C8BFUGI+MAWNcSYoORYLMdPzjrknd2Vc+bUsjN5bXcr8EhrNB+UTqfL1y3I9c4fw2ihgtMPQLBRiQxw==
-  dependencies:
-    esprima "^4.0.1"
-    estraverse "^5.2.0"
-    esutils "^2.0.2"
-    optionator "^0.8.1"
-  optionalDependencies:
-    source-map "~0.6.1"
-
 eslint-config-next@^14.0.4:
   version "14.0.4"
   resolved "https://registry.yarnpkg.com/eslint-config-next/-/eslint-config-next-14.0.4.tgz#7cd2c0a3b310203d41cf0dbf9d31f9b0a6235b4a"
@@ -5934,15 +5422,15 @@ eslint-visitor-keys@^3.3.0, eslint-visitor-keys@^3.4.1, eslint-visitor-keys@^3.4
   resolved "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz"
   integrity sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==
 
-eslint@^8.54.0:
-  version "8.54.0"
-  resolved "https://registry.yarnpkg.com/eslint/-/eslint-8.54.0.tgz#588e0dd4388af91a2e8fa37ea64924074c783537"
-  integrity sha512-NY0DfAkM8BIZDVl6PgSa1ttZbx3xHgJzSNJKYcQglem6CppHyMhRIQkBVSSMaSRnLhig3jsDbEzOjwCVt4AmmA==
+eslint@^8.56.0:
+  version "8.56.0"
+  resolved "https://registry.yarnpkg.com/eslint/-/eslint-8.56.0.tgz#4957ce8da409dc0809f99ab07a1b94832ab74b15"
+  integrity sha512-Go19xM6T9puCOWntie1/P997aXxFsOi37JIHRWI514Hc6ZnaHGKY9xFhrU65RT6CcBEzZoGG1e6Nq+DT04ZtZQ==
   dependencies:
     "@eslint-community/eslint-utils" "^4.2.0"
     "@eslint-community/regexpp" "^4.6.1"
-    "@eslint/eslintrc" "^2.1.3"
-    "@eslint/js" "8.54.0"
+    "@eslint/eslintrc" "^2.1.4"
+    "@eslint/js" "8.56.0"
     "@humanwhocodes/config-array" "^0.11.13"
     "@humanwhocodes/module-importer" "^1.0.1"
     "@nodelib/fs.walk" "^1.2.8"
@@ -5987,11 +5475,6 @@ espree@^9.6.0, espree@^9.6.1:
     acorn-jsx "^5.3.2"
     eslint-visitor-keys "^3.4.1"
 
-esprima@^4.0.0, esprima@^4.0.1:
-  version "4.0.1"
-  resolved "https://registry.npmjs.org/esprima/-/esprima-4.0.1.tgz"
-  integrity sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==
-
 esquery@^1.4.2:
   version "1.5.0"
   resolved "https://registry.npmjs.org/esquery/-/esquery-1.5.0.tgz"
@@ -6209,22 +5692,6 @@ execa@^5.0.0:
     signal-exit "^3.0.3"
     strip-final-newline "^2.0.0"
 
-exit@^0.1.2:
-  version "0.1.2"
-  resolved "https://registry.npmjs.org/exit/-/exit-0.1.2.tgz"
-  integrity sha512-Zk/eNKV2zbjpKzrsQ+n1G6poVbErQxJ0LBOJXaKZ1EViLzH+hrLu9cdXI4zw9dBQJslwBEpbQ2P1oS7nDxs6jQ==
-
-expect@^29.0.0, expect@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/expect/-/expect-29.7.0.tgz"
-  integrity sha512-2Zks0hf1VLFYI1kbh0I5jP3KHHyCHpkfyHBzsSXRFgl/Bg9mWYfMW8oD+PdMPlEwy5HNsR9JutYy6pMeOh61nw==
-  dependencies:
-    "@jest/expect-utils" "^29.7.0"
-    jest-get-type "^29.6.3"
-    jest-matcher-utils "^29.7.0"
-    jest-message-util "^29.7.0"
-    jest-util "^29.7.0"
-
 fast-deep-equal@^3.1.1, fast-deep-equal@^3.1.3:
   version "3.1.3"
   resolved "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz"
@@ -6246,12 +5713,12 @@ fast-glob@^3.2.11, fast-glob@^3.2.12, fast-glob@^3.2.9:
     merge2 "^1.3.0"
     micromatch "^4.0.4"
 
-fast-json-stable-stringify@^2.0.0, fast-json-stable-stringify@^2.1.0:
+fast-json-stable-stringify@^2.0.0:
   version "2.1.0"
   resolved "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz"
   integrity sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==
 
-fast-levenshtein@^2.0.6, fast-levenshtein@~2.0.6:
+fast-levenshtein@^2.0.6:
   version "2.0.6"
   resolved "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz"
   integrity sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==
@@ -6268,13 +5735,6 @@ fastq@^1.6.0:
   dependencies:
     reusify "^1.0.4"
 
-fb-watchman@^2.0.0:
-  version "2.0.2"
-  resolved "https://registry.npmjs.org/fb-watchman/-/fb-watchman-2.0.2.tgz"
-  integrity sha512-p5161BqbuCaSnB8jIbzQHOlpgsPmK5rJVDfDKO91Axs5NC1uu3HRQm6wt9cd9/+GtQQIO53JdGXXoyDpTAsgYA==
-  dependencies:
-    bser "2.1.1"
-
 file-entry-cache@^6.0.1:
   version "6.0.1"
   resolved "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-6.0.1.tgz"
@@ -6299,14 +5759,6 @@ filter-obj@^1.1.0:
   resolved "https://registry.npmjs.org/filter-obj/-/filter-obj-1.1.0.tgz"
   integrity sha512-8rXg1ZnX7xzy2NGDVkBVaAy+lSlPNwad13BtgSlLuxfIslyt5Vg64U7tFcCt4WS1R0hvtnQybT/IyCkGZ3DpXQ==
 
-find-up@^4.0.0, find-up@^4.1.0:
-  version "4.1.0"
-  resolved "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz"
-  integrity sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==
-  dependencies:
-    locate-path "^5.0.0"
-    path-exists "^4.0.0"
-
 find-up@^5.0.0:
   version "5.0.0"
   resolved "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz"
@@ -6328,10 +5780,10 @@ flatted@^3.1.0:
   resolved "https://registry.npmjs.org/flatted/-/flatted-3.2.7.tgz"
   integrity sha512-5nqDSxl8nn5BSNxyR3n4I6eDmbolI6WT+QqR547RwxQapgjQBmtktdP+HTBb/a/zLsbzERTONyUB5pefh5TtjQ==
 
-follow-redirects@^1.14.0, follow-redirects@^1.14.9:
-  version "1.15.2"
-  resolved "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.2.tgz"
-  integrity sha512-VQLG33o04KaQ8uYi2tVNbdrWp1QWxNNea+nmIB4EVM28v0hmP17z7aG1+wAkNzVq4KeXTq3221ye5qTJP91JwA==
+follow-redirects@^1.14.0, follow-redirects@^1.14.9, follow-redirects@^1.15.4:
+  version "1.15.4"
+  resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.15.4.tgz#cdc7d308bf6493126b17ea2191ea0ccf3e535adf"
+  integrity sha512-Cr4D/5wlrb0z9dgERpUL3LrmPKVDsETIJhaCMeDfuFYcqa5bldGV6wBsAN6X/vxlXQtFBMrXdXxdL8CbDTGniw==
 
 for-each@^0.3.3:
   version "0.3.3"
@@ -6359,7 +5811,7 @@ fs.realpath@^1.0.0:
   resolved "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz"
   integrity sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==
 
-fsevents@^2.3.2, fsevents@~2.3.2:
+fsevents@~2.3.2:
   version "2.3.2"
   resolved "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz"
   integrity sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==
@@ -6433,11 +5885,6 @@ get-intrinsic@^1.2.1:
     has-proto "^1.0.1"
     has-symbols "^1.0.3"
 
-get-package-type@^0.1.0:
-  version "0.1.0"
-  resolved "https://registry.npmjs.org/get-package-type/-/get-package-type-0.1.0.tgz"
-  integrity sha512-pjzuKtY64GYfWizNAJ0fr9VqttZkNiK2iS430LtIHzjBEr6bX8Am2zm4sW4Ro5wjWW5cAlRL1qAMTcXbjNAO2Q==
-
 get-stream@^6.0.0:
   version "6.0.1"
   resolved "https://registry.npmjs.org/get-stream/-/get-stream-6.0.1.tgz"
@@ -6504,7 +5951,7 @@ glob@7.1.7:
     once "^1.3.0"
     path-is-absolute "^1.0.0"
 
-glob@^7.0.0, glob@^7.0.5, glob@^7.1.3, glob@^7.1.4:
+glob@^7.0.0, glob@^7.0.5, glob@^7.1.3:
   version "7.2.3"
   resolved "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz"
   integrity sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==
@@ -6591,7 +6038,7 @@ gopd@^1.0.1:
   dependencies:
     get-intrinsic "^1.1.3"
 
-graceful-fs@^4.1.2, graceful-fs@^4.2.4, graceful-fs@^4.2.9:
+graceful-fs@^4.1.2, graceful-fs@^4.2.4:
   version "4.2.11"
   resolved "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz"
   integrity sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==
@@ -6704,33 +6151,12 @@ hoist-non-react-statics@^3.3.2:
   dependencies:
     react-is "^16.7.0"
 
-html-encoding-sniffer@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-3.0.0.tgz"
-  integrity sha512-oWv4T4yJ52iKrufjnyZPkrN0CH3QnrUqdB6In1g5Fe1mia8GmF36gnfNySxoZtxD5+NmYw1EElVXiBk93UeskA==
-  dependencies:
-    whatwg-encoding "^2.0.0"
-
-html-escaper@^2.0.0:
-  version "2.0.2"
-  resolved "https://registry.npmjs.org/html-escaper/-/html-escaper-2.0.2.tgz"
-  integrity sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg==
-
-http-proxy-agent@^5.0.0:
-  version "5.0.0"
-  resolved "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-5.0.0.tgz"
-  integrity sha512-n2hY8YdoRE1i7r6M0w9DIw5GgZN0G25P8zLCRQ8rjXtTU3vsNFBI/vWK/UIeE6g5MUUz6avwAPXmL6Fy9D/90w==
-  dependencies:
-    "@tootallnate/once" "2"
-    agent-base "6"
-    debug "4"
-
 http-status-codes@^2.2.0:
   version "2.2.0"
   resolved "https://registry.npmjs.org/http-status-codes/-/http-status-codes-2.2.0.tgz"
   integrity sha512-feERVo9iWxvnejp3SEfm/+oNG517npqL2/PIA8ORjyOZjGC7TwCRQsZylciLS64i6pJ0wRYz3rkXLRwbtFa8Ng==
 
-https-proxy-agent@^5.0.0, https-proxy-agent@^5.0.1:
+https-proxy-agent@^5.0.0:
   version "5.0.1"
   resolved "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-5.0.1.tgz"
   integrity sha512-dFcAjpTQFgoLMzC2VwU+C/CbS7uRL0lWmxDITmqm7C+7F0Odmj6s9l6alZc6AELXhrnggM2CeWSXHGOdX2YtwA==
@@ -6763,13 +6189,6 @@ ibc-domains-sdk@^1.1.0:
     buffer "^6.0.3"
     web3-utils "^1.8.0"
 
-iconv-lite@0.6.3:
-  version "0.6.3"
-  resolved "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz"
-  integrity sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==
-  dependencies:
-    safer-buffer ">= 2.1.2 < 3.0.0"
-
 identity-obj-proxy@^3.0.0:
   version "3.0.0"
   resolved "https://registry.npmjs.org/identity-obj-proxy/-/identity-obj-proxy-3.0.0.tgz"
@@ -6800,24 +6219,11 @@ import-fresh@^3.2.1:
     parent-module "^1.0.0"
     resolve-from "^4.0.0"
 
-import-local@^3.0.2:
-  version "3.1.0"
-  resolved "https://registry.npmjs.org/import-local/-/import-local-3.1.0.tgz"
-  integrity sha512-ASB07uLtnDs1o6EHjKpX34BKYDSqnFerfTOJL2HvMqF70LnxpjkzDB8J44oT9pu4AMPkQwf8jl6szgvNd2tRIg==
-  dependencies:
-    pkg-dir "^4.2.0"
-    resolve-cwd "^3.0.0"
-
 imurmurhash@^0.1.4:
   version "0.1.4"
   resolved "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz"
   integrity sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==
 
-indent-string@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.npmjs.org/indent-string/-/indent-string-4.0.0.tgz"
-  integrity sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==
-
 inflight@^1.0.4:
   version "1.0.6"
   resolved "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz"
@@ -6966,11 +6372,6 @@ is-fullwidth-code-point@^5.0.0:
   dependencies:
     get-east-asian-width "^1.0.0"
 
-is-generator-fn@^2.0.0:
-  version "2.1.0"
-  resolved "https://registry.npmjs.org/is-generator-fn/-/is-generator-fn-2.1.0.tgz"
-  integrity sha512-cTIB4yPYL/Grw0EaSzASzg6bBy9gqCofvWN8okThAYIxKJZC+udlRAmGbM0XLeniEJSs8uEgHPGuHSe1XsOLSQ==
-
 is-generator-function@^1.0.10:
   version "1.0.10"
   resolved "https://registry.npmjs.org/is-generator-function/-/is-generator-function-1.0.10.tgz"
@@ -7017,11 +6418,6 @@ is-path-inside@^3.0.3:
   resolved "https://registry.npmjs.org/is-path-inside/-/is-path-inside-3.0.3.tgz"
   integrity sha512-Fd4gABb+ycGAmKou8eMftCupSir5lRxqf4aD/vd0cD2qc4HL07OjCeuHMr8Ro4CoMaeCKDB0/ECBOVWjTwUvPQ==
 
-is-potential-custom-element-name@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.npmjs.org/is-potential-custom-element-name/-/is-potential-custom-element-name-1.0.1.tgz"
-  integrity sha512-bCYeRA2rVibKZd+s2625gGnGF/t7DSqDs4dP7CrLA1m7jKWz6pps0LpYLJN8Q64HtmPKJ1hrN3nzPNKFEKOUiQ==
-
 is-reference@1.2.1:
   version "1.2.1"
   resolved "https://registry.npmjs.org/is-reference/-/is-reference-1.2.1.tgz"
@@ -7143,59 +6539,6 @@ isomorphic-ws@^4.0.1:
   resolved "https://registry.npmjs.org/isomorphic-ws/-/isomorphic-ws-4.0.1.tgz"
   integrity sha512-BhBvN2MBpWTaSHdWRb/bwdZJ1WaehQ2L1KngkCkfLUGF0mAWAT1sQUQacEmQ0jXkFw/czDXPNQSL5u2/Krsz1w==
 
-istanbul-lib-coverage@^3.0.0, istanbul-lib-coverage@^3.2.0:
-  version "3.2.0"
-  resolved "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-3.2.0.tgz"
-  integrity sha512-eOeJ5BHCmHYvQK7xt9GkdHuzuCGS1Y6g9Gvnx3Ym33fz/HpLRYxiS0wHNr+m/MBC8B647Xt608vCDEvhl9c6Mw==
-
-istanbul-lib-instrument@^5.0.4:
-  version "5.2.1"
-  resolved "https://registry.npmjs.org/istanbul-lib-instrument/-/istanbul-lib-instrument-5.2.1.tgz"
-  integrity sha512-pzqtp31nLv/XFOzXGuvhCb8qhjmTVo5vjVk19XE4CRlSWz0KoeJ3bw9XsA7nOp9YBf4qHjwBxkDzKcME/J29Yg==
-  dependencies:
-    "@babel/core" "^7.12.3"
-    "@babel/parser" "^7.14.7"
-    "@istanbuljs/schema" "^0.1.2"
-    istanbul-lib-coverage "^3.2.0"
-    semver "^6.3.0"
-
-istanbul-lib-instrument@^6.0.0:
-  version "6.0.0"
-  resolved "https://registry.npmjs.org/istanbul-lib-instrument/-/istanbul-lib-instrument-6.0.0.tgz"
-  integrity sha512-x58orMzEVfzPUKqlbLd1hXCnySCxKdDKa6Rjg97CwuLLRI4g3FHTdnExu1OqffVFay6zeMW+T6/DowFLndWnIw==
-  dependencies:
-    "@babel/core" "^7.12.3"
-    "@babel/parser" "^7.14.7"
-    "@istanbuljs/schema" "^0.1.2"
-    istanbul-lib-coverage "^3.2.0"
-    semver "^7.5.4"
-
-istanbul-lib-report@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.npmjs.org/istanbul-lib-report/-/istanbul-lib-report-3.0.0.tgz"
-  integrity sha512-wcdi+uAKzfiGT2abPpKZ0hSU1rGQjUQnLvtY5MpQ7QCTahD3VODhcu4wcfY1YtkGaDD5yuydOLINXsfbus9ROw==
-  dependencies:
-    istanbul-lib-coverage "^3.0.0"
-    make-dir "^3.0.0"
-    supports-color "^7.1.0"
-
-istanbul-lib-source-maps@^4.0.0:
-  version "4.0.1"
-  resolved "https://registry.npmjs.org/istanbul-lib-source-maps/-/istanbul-lib-source-maps-4.0.1.tgz"
-  integrity sha512-n3s8EwkdFIJCG3BPKBYvskgXGoy88ARzvegkitk60NxRdwltLOTaH7CUiMRXvwYorl0Q712iEjcWB+fK/MrWVw==
-  dependencies:
-    debug "^4.1.1"
-    istanbul-lib-coverage "^3.0.0"
-    source-map "^0.6.1"
-
-istanbul-reports@^3.1.3:
-  version "3.1.5"
-  resolved "https://registry.npmjs.org/istanbul-reports/-/istanbul-reports-3.1.5.tgz"
-  integrity sha512-nUsEMa9pBt/NOHqbcbeJEgqIlY/K7rVWUX6Lql2orY5e9roQOthbR3vtY4zzf2orPELg80fnxxk9zUyPlgwD1w==
-  dependencies:
-    html-escaper "^2.0.0"
-    istanbul-lib-report "^3.0.0"
-
 iterator.prototype@^1.1.2:
   version "1.1.2"
   resolved "https://registry.npmjs.org/iterator.prototype/-/iterator.prototype-1.1.2.tgz"
@@ -7207,378 +6550,6 @@ iterator.prototype@^1.1.2:
     reflect.getprototypeof "^1.0.4"
     set-function-name "^2.0.1"
 
-jest-changed-files@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-changed-files/-/jest-changed-files-29.7.0.tgz"
-  integrity sha512-fEArFiwf1BpQ+4bXSprcDc3/x4HSzL4al2tozwVpDFpsxALjLYdyiIK4e5Vz66GQJIbXJ82+35PtysofptNX2w==
-  dependencies:
-    execa "^5.0.0"
-    jest-util "^29.7.0"
-    p-limit "^3.1.0"
-
-jest-circus@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-circus/-/jest-circus-29.7.0.tgz"
-  integrity sha512-3E1nCMgipcTkCocFwM90XXQab9bS+GMsjdpmPrlelaxwD93Ad8iVEjX/vvHPdLPnFf+L40u+5+iutRdA1N9myw==
-  dependencies:
-    "@jest/environment" "^29.7.0"
-    "@jest/expect" "^29.7.0"
-    "@jest/test-result" "^29.7.0"
-    "@jest/types" "^29.6.3"
-    "@types/node" "*"
-    chalk "^4.0.0"
-    co "^4.6.0"
-    dedent "^1.0.0"
-    is-generator-fn "^2.0.0"
-    jest-each "^29.7.0"
-    jest-matcher-utils "^29.7.0"
-    jest-message-util "^29.7.0"
-    jest-runtime "^29.7.0"
-    jest-snapshot "^29.7.0"
-    jest-util "^29.7.0"
-    p-limit "^3.1.0"
-    pretty-format "^29.7.0"
-    pure-rand "^6.0.0"
-    slash "^3.0.0"
-    stack-utils "^2.0.3"
-
-jest-cli@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-cli/-/jest-cli-29.7.0.tgz"
-  integrity sha512-OVVobw2IubN/GSYsxETi+gOe7Ka59EFMR/twOU3Jb2GnKKeMGJB5SGUUrEz3SFVmJASUdZUzy83sLNNQ2gZslg==
-  dependencies:
-    "@jest/core" "^29.7.0"
-    "@jest/test-result" "^29.7.0"
-    "@jest/types" "^29.6.3"
-    chalk "^4.0.0"
-    create-jest "^29.7.0"
-    exit "^0.1.2"
-    import-local "^3.0.2"
-    jest-config "^29.7.0"
-    jest-util "^29.7.0"
-    jest-validate "^29.7.0"
-    yargs "^17.3.1"
-
-jest-config@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-config/-/jest-config-29.7.0.tgz"
-  integrity sha512-uXbpfeQ7R6TZBqI3/TxCU4q4ttk3u0PJeC+E0zbfSoSjq6bJ7buBPxzQPL0ifrkY4DNu4JUdk0ImlBUYi840eQ==
-  dependencies:
-    "@babel/core" "^7.11.6"
-    "@jest/test-sequencer" "^29.7.0"
-    "@jest/types" "^29.6.3"
-    babel-jest "^29.7.0"
-    chalk "^4.0.0"
-    ci-info "^3.2.0"
-    deepmerge "^4.2.2"
-    glob "^7.1.3"
-    graceful-fs "^4.2.9"
-    jest-circus "^29.7.0"
-    jest-environment-node "^29.7.0"
-    jest-get-type "^29.6.3"
-    jest-regex-util "^29.6.3"
-    jest-resolve "^29.7.0"
-    jest-runner "^29.7.0"
-    jest-util "^29.7.0"
-    jest-validate "^29.7.0"
-    micromatch "^4.0.4"
-    parse-json "^5.2.0"
-    pretty-format "^29.7.0"
-    slash "^3.0.0"
-    strip-json-comments "^3.1.1"
-
-jest-diff@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-diff/-/jest-diff-29.7.0.tgz"
-  integrity sha512-LMIgiIrhigmPrs03JHpxUh2yISK3vLFPkAodPeo0+BuF7wA2FoQbkEg1u8gBYBThncu7e1oEDUfIXVuTqLRUjw==
-  dependencies:
-    chalk "^4.0.0"
-    diff-sequences "^29.6.3"
-    jest-get-type "^29.6.3"
-    pretty-format "^29.7.0"
-
-jest-docblock@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-docblock/-/jest-docblock-29.7.0.tgz"
-  integrity sha512-q617Auw3A612guyaFgsbFeYpNP5t2aoUNLwBUbc/0kD1R4t9ixDbyFTHd1nok4epoVFpr7PmeWHrhvuV3XaJ4g==
-  dependencies:
-    detect-newline "^3.0.0"
-
-jest-each@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-each/-/jest-each-29.7.0.tgz"
-  integrity sha512-gns+Er14+ZrEoC5fhOfYCY1LOHHr0TI+rQUHZS8Ttw2l7gl+80eHc/gFf2Ktkw0+SIACDTeWvpFcv3B04VembQ==
-  dependencies:
-    "@jest/types" "^29.6.3"
-    chalk "^4.0.0"
-    jest-get-type "^29.6.3"
-    jest-util "^29.7.0"
-    pretty-format "^29.7.0"
-
-jest-environment-jsdom@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-environment-jsdom/-/jest-environment-jsdom-29.7.0.tgz"
-  integrity sha512-k9iQbsf9OyOfdzWH8HDmrRT0gSIcX+FLNW7IQq94tFX0gynPwqDTW0Ho6iMVNjGz/nb+l/vW3dWM2bbLLpkbXA==
-  dependencies:
-    "@jest/environment" "^29.7.0"
-    "@jest/fake-timers" "^29.7.0"
-    "@jest/types" "^29.6.3"
-    "@types/jsdom" "^20.0.0"
-    "@types/node" "*"
-    jest-mock "^29.7.0"
-    jest-util "^29.7.0"
-    jsdom "^20.0.0"
-
-jest-environment-node@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-environment-node/-/jest-environment-node-29.7.0.tgz"
-  integrity sha512-DOSwCRqXirTOyheM+4d5YZOrWcdu0LNZ87ewUoywbcb2XR4wKgqiG8vNeYwhjFMbEkfju7wx2GYH0P2gevGvFw==
-  dependencies:
-    "@jest/environment" "^29.7.0"
-    "@jest/fake-timers" "^29.7.0"
-    "@jest/types" "^29.6.3"
-    "@types/node" "*"
-    jest-mock "^29.7.0"
-    jest-util "^29.7.0"
-
-jest-get-type@^29.6.3:
-  version "29.6.3"
-  resolved "https://registry.npmjs.org/jest-get-type/-/jest-get-type-29.6.3.tgz"
-  integrity sha512-zrteXnqYxfQh7l5FHyL38jL39di8H8rHoecLH3JNxH3BwOrBsNeabdap5e0I23lD4HHI8W5VFBZqG4Eaq5LNcw==
-
-jest-haste-map@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-haste-map/-/jest-haste-map-29.7.0.tgz"
-  integrity sha512-fP8u2pyfqx0K1rGn1R9pyE0/KTn+G7PxktWidOBTqFPLYX0b9ksaMFkhK5vrS3DVun09pckLdlx90QthlW7AmA==
-  dependencies:
-    "@jest/types" "^29.6.3"
-    "@types/graceful-fs" "^4.1.3"
-    "@types/node" "*"
-    anymatch "^3.0.3"
-    fb-watchman "^2.0.0"
-    graceful-fs "^4.2.9"
-    jest-regex-util "^29.6.3"
-    jest-util "^29.7.0"
-    jest-worker "^29.7.0"
-    micromatch "^4.0.4"
-    walker "^1.0.8"
-  optionalDependencies:
-    fsevents "^2.3.2"
-
-jest-leak-detector@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-leak-detector/-/jest-leak-detector-29.7.0.tgz"
-  integrity sha512-kYA8IJcSYtST2BY9I+SMC32nDpBT3J2NvWJx8+JCuCdl/CR1I4EKUJROiP8XtCcxqgTTBGJNdbB1A8XRKbTetw==
-  dependencies:
-    jest-get-type "^29.6.3"
-    pretty-format "^29.7.0"
-
-jest-matcher-utils@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-29.7.0.tgz"
-  integrity sha512-sBkD+Xi9DtcChsI3L3u0+N0opgPYnCRPtGcQYrgXmR+hmt/fYfWAL0xRXYU8eWOdfuLgBe0YCW3AFtnRLagq/g==
-  dependencies:
-    chalk "^4.0.0"
-    jest-diff "^29.7.0"
-    jest-get-type "^29.6.3"
-    pretty-format "^29.7.0"
-
-jest-message-util@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-message-util/-/jest-message-util-29.7.0.tgz"
-  integrity sha512-GBEV4GRADeP+qtB2+6u61stea8mGcOT4mCtrYISZwfu9/ISHFJ/5zOMXYbpBE9RsS5+Gb63DW4FgmnKJ79Kf6w==
-  dependencies:
-    "@babel/code-frame" "^7.12.13"
-    "@jest/types" "^29.6.3"
-    "@types/stack-utils" "^2.0.0"
-    chalk "^4.0.0"
-    graceful-fs "^4.2.9"
-    micromatch "^4.0.4"
-    pretty-format "^29.7.0"
-    slash "^3.0.0"
-    stack-utils "^2.0.3"
-
-jest-mock@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-mock/-/jest-mock-29.7.0.tgz"
-  integrity sha512-ITOMZn+UkYS4ZFh83xYAOzWStloNzJFO2s8DWrE4lhtGD+AorgnbkiKERe4wQVBydIGPx059g6riW5Btp6Llnw==
-  dependencies:
-    "@jest/types" "^29.6.3"
-    "@types/node" "*"
-    jest-util "^29.7.0"
-
-jest-pnp-resolver@^1.2.2:
-  version "1.2.3"
-  resolved "https://registry.npmjs.org/jest-pnp-resolver/-/jest-pnp-resolver-1.2.3.tgz"
-  integrity sha512-+3NpwQEnRoIBtx4fyhblQDPgJI0H1IEIkX7ShLUjPGA7TtUTvI1oiKi3SR4oBR0hQhQR80l4WAe5RrXBwWMA8w==
-
-jest-regex-util@^29.6.3:
-  version "29.6.3"
-  resolved "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-29.6.3.tgz"
-  integrity sha512-KJJBsRCyyLNWCNBOvZyRDnAIfUiRJ8v+hOBQYGn8gDyF3UegwiP4gwRR3/SDa42g1YbVycTidUF3rKjyLFDWbg==
-
-jest-resolve-dependencies@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-resolve-dependencies/-/jest-resolve-dependencies-29.7.0.tgz"
-  integrity sha512-un0zD/6qxJ+S0et7WxeI3H5XSe9lTBBR7bOHCHXkKR6luG5mwDDlIzVQ0V5cZCuoTgEdcdwzTghYkTWfubi+nA==
-  dependencies:
-    jest-regex-util "^29.6.3"
-    jest-snapshot "^29.7.0"
-
-jest-resolve@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-resolve/-/jest-resolve-29.7.0.tgz"
-  integrity sha512-IOVhZSrg+UvVAshDSDtHyFCCBUl/Q3AAJv8iZ6ZjnZ74xzvwuzLXid9IIIPgTnY62SJjfuupMKZsZQRsCvxEgA==
-  dependencies:
-    chalk "^4.0.0"
-    graceful-fs "^4.2.9"
-    jest-haste-map "^29.7.0"
-    jest-pnp-resolver "^1.2.2"
-    jest-util "^29.7.0"
-    jest-validate "^29.7.0"
-    resolve "^1.20.0"
-    resolve.exports "^2.0.0"
-    slash "^3.0.0"
-
-jest-runner@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-runner/-/jest-runner-29.7.0.tgz"
-  integrity sha512-fsc4N6cPCAahybGBfTRcq5wFR6fpLznMg47sY5aDpsoejOcVYFb07AHuSnR0liMcPTgBsA3ZJL6kFOjPdoNipQ==
-  dependencies:
-    "@jest/console" "^29.7.0"
-    "@jest/environment" "^29.7.0"
-    "@jest/test-result" "^29.7.0"
-    "@jest/transform" "^29.7.0"
-    "@jest/types" "^29.6.3"
-    "@types/node" "*"
-    chalk "^4.0.0"
-    emittery "^0.13.1"
-    graceful-fs "^4.2.9"
-    jest-docblock "^29.7.0"
-    jest-environment-node "^29.7.0"
-    jest-haste-map "^29.7.0"
-    jest-leak-detector "^29.7.0"
-    jest-message-util "^29.7.0"
-    jest-resolve "^29.7.0"
-    jest-runtime "^29.7.0"
-    jest-util "^29.7.0"
-    jest-watcher "^29.7.0"
-    jest-worker "^29.7.0"
-    p-limit "^3.1.0"
-    source-map-support "0.5.13"
-
-jest-runtime@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-runtime/-/jest-runtime-29.7.0.tgz"
-  integrity sha512-gUnLjgwdGqW7B4LvOIkbKs9WGbn+QLqRQQ9juC6HndeDiezIwhDP+mhMwHWCEcfQ5RUXa6OPnFF8BJh5xegwwQ==
-  dependencies:
-    "@jest/environment" "^29.7.0"
-    "@jest/fake-timers" "^29.7.0"
-    "@jest/globals" "^29.7.0"
-    "@jest/source-map" "^29.6.3"
-    "@jest/test-result" "^29.7.0"
-    "@jest/transform" "^29.7.0"
-    "@jest/types" "^29.6.3"
-    "@types/node" "*"
-    chalk "^4.0.0"
-    cjs-module-lexer "^1.0.0"
-    collect-v8-coverage "^1.0.0"
-    glob "^7.1.3"
-    graceful-fs "^4.2.9"
-    jest-haste-map "^29.7.0"
-    jest-message-util "^29.7.0"
-    jest-mock "^29.7.0"
-    jest-regex-util "^29.6.3"
-    jest-resolve "^29.7.0"
-    jest-snapshot "^29.7.0"
-    jest-util "^29.7.0"
-    slash "^3.0.0"
-    strip-bom "^4.0.0"
-
-jest-snapshot@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-snapshot/-/jest-snapshot-29.7.0.tgz"
-  integrity sha512-Rm0BMWtxBcioHr1/OX5YCP8Uov4riHvKPknOGs804Zg9JGZgmIBkbtlxJC/7Z4msKYVbIJtfU+tKb8xlYNfdkw==
-  dependencies:
-    "@babel/core" "^7.11.6"
-    "@babel/generator" "^7.7.2"
-    "@babel/plugin-syntax-jsx" "^7.7.2"
-    "@babel/plugin-syntax-typescript" "^7.7.2"
-    "@babel/types" "^7.3.3"
-    "@jest/expect-utils" "^29.7.0"
-    "@jest/transform" "^29.7.0"
-    "@jest/types" "^29.6.3"
-    babel-preset-current-node-syntax "^1.0.0"
-    chalk "^4.0.0"
-    expect "^29.7.0"
-    graceful-fs "^4.2.9"
-    jest-diff "^29.7.0"
-    jest-get-type "^29.6.3"
-    jest-matcher-utils "^29.7.0"
-    jest-message-util "^29.7.0"
-    jest-util "^29.7.0"
-    natural-compare "^1.4.0"
-    pretty-format "^29.7.0"
-    semver "^7.5.3"
-
-jest-util@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-util/-/jest-util-29.7.0.tgz"
-  integrity sha512-z6EbKajIpqGKU56y5KBUgy1dt1ihhQJgWzUlZHArA/+X2ad7Cb5iF+AK1EWVL/Bo7Rz9uurpqw6SiBCefUbCGA==
-  dependencies:
-    "@jest/types" "^29.6.3"
-    "@types/node" "*"
-    chalk "^4.0.0"
-    ci-info "^3.2.0"
-    graceful-fs "^4.2.9"
-    picomatch "^2.2.3"
-
-jest-validate@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-validate/-/jest-validate-29.7.0.tgz"
-  integrity sha512-ZB7wHqaRGVw/9hST/OuFUReG7M8vKeq0/J2egIGLdvjHCmYqGARhzXmtgi+gVeZ5uXFF219aOc3Ls2yLg27tkw==
-  dependencies:
-    "@jest/types" "^29.6.3"
-    camelcase "^6.2.0"
-    chalk "^4.0.0"
-    jest-get-type "^29.6.3"
-    leven "^3.1.0"
-    pretty-format "^29.7.0"
-
-jest-watcher@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-watcher/-/jest-watcher-29.7.0.tgz"
-  integrity sha512-49Fg7WXkU3Vl2h6LbLtMQ/HyB6rXSIX7SqvBLQmssRBGN9I0PNvPmAmCWSOY6SOvrjhI/F7/bGAv9RtnsPA03g==
-  dependencies:
-    "@jest/test-result" "^29.7.0"
-    "@jest/types" "^29.6.3"
-    "@types/node" "*"
-    ansi-escapes "^4.2.1"
-    chalk "^4.0.0"
-    emittery "^0.13.1"
-    jest-util "^29.7.0"
-    string-length "^4.0.1"
-
-jest-worker@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest-worker/-/jest-worker-29.7.0.tgz"
-  integrity sha512-eIz2msL/EzL9UFTFFx7jBTkeZfku0yUAyZZZmJ93H2TYEiroIx2PQjEXcwYtYl8zXCxb+PAmA2hLIt/6ZEkPHw==
-  dependencies:
-    "@types/node" "*"
-    jest-util "^29.7.0"
-    merge-stream "^2.0.0"
-    supports-color "^8.0.0"
-
-jest@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/jest/-/jest-29.7.0.tgz"
-  integrity sha512-NIy3oAFp9shda19hy4HK0HRTWKtPJmGdnvywu01nOqNC2vZg+Z+fvJDxpMQA88eb2I9EcafcdjYgsDthnYTvGw==
-  dependencies:
-    "@jest/core" "^29.7.0"
-    "@jest/types" "^29.6.3"
-    import-local "^3.0.2"
-    jest-cli "^29.7.0"
-
 jiti@^1.18.2:
   version "1.18.2"
   resolved "https://registry.npmjs.org/jiti/-/jiti-1.18.2.tgz"
@@ -7599,14 +6570,6 @@ js-sha3@0.8.0, js-sha3@^0.8.0:
   resolved "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz"
   integrity sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==
 
-js-yaml@^3.13.1:
-  version "3.14.1"
-  resolved "https://registry.npmjs.org/js-yaml/-/js-yaml-3.14.1.tgz"
-  integrity sha512-okMH7OXXJ7YrN9Ok3/SXrnu4iX9yOk+25nqX4imS2npuvTYDmo/QEZoqwZkYaIDk3jVvBOTOIEgEhaLOynBS9g==
-  dependencies:
-    argparse "^1.0.7"
-    esprima "^4.0.0"
-
 js-yaml@^4.1.0:
   version "4.1.0"
   resolved "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz"
@@ -7619,38 +6582,6 @@ jscrypto@^1.0.3:
   resolved "https://registry.npmjs.org/jscrypto/-/jscrypto-1.0.3.tgz"
   integrity sha512-lryZl0flhodv4SZHOqyb1bx5sKcJxj0VBo0Kzb4QMAg3L021IC9uGpl0RCZa+9KJwlRGSK2C80ITcwbe19OKLQ==
 
-jsdom@^20.0.0:
-  version "20.0.3"
-  resolved "https://registry.npmjs.org/jsdom/-/jsdom-20.0.3.tgz"
-  integrity sha512-SYhBvTh89tTfCD/CRdSOm13mOBa42iTaTyfyEWBdKcGdPxPtLFBXuHR8XHb33YNYaP+lLbmSvBTsnoesCNJEsQ==
-  dependencies:
-    abab "^2.0.6"
-    acorn "^8.8.1"
-    acorn-globals "^7.0.0"
-    cssom "^0.5.0"
-    cssstyle "^2.3.0"
-    data-urls "^3.0.2"
-    decimal.js "^10.4.2"
-    domexception "^4.0.0"
-    escodegen "^2.0.0"
-    form-data "^4.0.0"
-    html-encoding-sniffer "^3.0.0"
-    http-proxy-agent "^5.0.0"
-    https-proxy-agent "^5.0.1"
-    is-potential-custom-element-name "^1.0.1"
-    nwsapi "^2.2.2"
-    parse5 "^7.1.1"
-    saxes "^6.0.0"
-    symbol-tree "^3.2.4"
-    tough-cookie "^4.1.2"
-    w3c-xmlserializer "^4.0.0"
-    webidl-conversions "^7.0.0"
-    whatwg-encoding "^2.0.0"
-    whatwg-mimetype "^3.0.0"
-    whatwg-url "^11.0.0"
-    ws "^8.11.0"
-    xml-name-validator "^4.0.0"
-
 jsesc@^2.5.1:
   version "2.5.2"
   resolved "https://registry.npmjs.org/jsesc/-/jsesc-2.5.2.tgz"
@@ -7724,11 +6655,6 @@ keyvaluestorage-interface@^1.0.0:
   resolved "https://registry.npmjs.org/keyvaluestorage-interface/-/keyvaluestorage-interface-1.0.0.tgz"
   integrity sha512-8t6Q3TclQ4uZynJY9IGr2+SsIGwK9JHcO6ootkHCGA0CrQCRy+VkouYNO2xicET6b9al7QKzpebNow+gkpCL8g==
 
-kleur@^3.0.3:
-  version "3.0.3"
-  resolved "https://registry.npmjs.org/kleur/-/kleur-3.0.3.tgz"
-  integrity sha512-eTIzlVOSUR+JxdDFepEYcBMtZ9Qqdef+rnzWdRZuMbOywu5tO2w2N7rqjoANZ5k9vywhL6Br1VRjUIgTQx4E8w==
-
 language-subtag-registry@~0.3.2:
   version "0.3.22"
   resolved "https://registry.npmjs.org/language-subtag-registry/-/language-subtag-registry-0.3.22.tgz"
@@ -7741,11 +6667,6 @@ language-tags@=1.0.5:
   dependencies:
     language-subtag-registry "~0.3.2"
 
-leven@^3.1.0:
-  version "3.1.0"
-  resolved "https://registry.npmjs.org/leven/-/leven-3.1.0.tgz"
-  integrity sha512-qsda+H8jTaUaN/x5vzW2rzc+8Rw4TAQ/4KjB46IwK5VH+IlVeeeje/EoZRpiXvIqjFgK84QffqPztGI3VBLG1A==
-
 levn@^0.4.1:
   version "0.4.1"
   resolved "https://registry.npmjs.org/levn/-/levn-0.4.1.tgz"
@@ -7754,14 +6675,6 @@ levn@^0.4.1:
     prelude-ls "^1.2.1"
     type-check "~0.4.0"
 
-levn@~0.3.0:
-  version "0.3.0"
-  resolved "https://registry.npmjs.org/levn/-/levn-0.3.0.tgz"
-  integrity sha512-0OO4y2iOHix2W6ujICbKIaEQXvFQHue65vUG3pb5EUomzPI90z9hsA1VsO/dbIIpC53J8gxM9Q4Oho0jrCM/yA==
-  dependencies:
-    prelude-ls "~1.1.2"
-    type-check "~0.3.2"
-
 libsodium-sumo@^0.7.11:
   version "0.7.11"
   resolved "https://registry.npmjs.org/libsodium-sumo/-/libsodium-sumo-0.7.11.tgz"
@@ -7855,13 +6768,6 @@ localforage@^1.8.1:
   dependencies:
     lie "3.1.1"
 
-locate-path@^5.0.0:
-  version "5.0.0"
-  resolved "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz"
-  integrity sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==
-  dependencies:
-    p-locate "^4.1.0"
-
 locate-path@^6.0.0:
   version "6.0.0"
   resolved "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz"
@@ -7899,7 +6805,7 @@ lodash.values@^4.3.0:
   resolved "https://registry.npmjs.org/lodash.values/-/lodash.values-4.3.0.tgz"
   integrity sha512-r0RwvdCv8id9TUblb/O7rYPwVy6lerCbcawrfdo9iC/1t1wsNMJknO79WNBgwkH0hIeJ08jmvvESbFpNb4jH0Q==
 
-lodash@^4.17.15, lodash@^4.17.19, lodash@^4.17.21:
+lodash@^4.17.19, lodash@^4.17.21:
   version "4.17.21"
   resolved "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz"
   integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==
@@ -7953,11 +6859,6 @@ lru-cache@^6.0.0:
   dependencies:
     yallist "^4.0.0"
 
-lz-string@^1.5.0:
-  version "1.5.0"
-  resolved "https://registry.npmjs.org/lz-string/-/lz-string-1.5.0.tgz"
-  integrity sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==
-
 magic-string@^0.27.0:
   version "0.27.0"
   resolved "https://registry.npmjs.org/magic-string/-/magic-string-0.27.0.tgz"
@@ -7965,20 +6866,6 @@ magic-string@^0.27.0:
   dependencies:
     "@jridgewell/sourcemap-codec" "^1.4.13"
 
-make-dir@^3.0.0:
-  version "3.1.0"
-  resolved "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz"
-  integrity sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==
-  dependencies:
-    semver "^6.0.0"
-
-makeerror@1.0.12:
-  version "1.0.12"
-  resolved "https://registry.npmjs.org/makeerror/-/makeerror-1.0.12.tgz"
-  integrity sha512-JmqCvUhmt43madlpFzG4BQzG2Z3m6tvQDNKdClZnO3VbIudJYmxsT0FNJMeiB2+JTSlTQTSbU8QdesVmwJcmLg==
-  dependencies:
-    tmpl "1.0.5"
-
 map-obj@^4.1.0:
   version "4.3.0"
   resolved "https://registry.npmjs.org/map-obj/-/map-obj-4.3.0.tgz"
@@ -8048,11 +6935,6 @@ mimic-fn@^4.0.0:
   resolved "https://registry.npmjs.org/mimic-fn/-/mimic-fn-4.0.0.tgz"
   integrity sha512-vqiC06CuhBTUdZH+RYl8sFrL096vA45Ok5ISO6sE/Mr1jRbGH4Csnhi8f3wKVl7x8mO4Au7Ir9D3Oyv1VYMFJw==
 
-min-indent@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.npmjs.org/min-indent/-/min-indent-1.0.1.tgz"
-  integrity sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==
-
 minimalistic-assert@^1.0.0, minimalistic-assert@^1.0.1:
   version "1.0.1"
   resolved "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz"
@@ -8206,11 +7088,6 @@ node-gyp-build@^4.2.0:
   resolved "https://registry.npmjs.org/node-gyp-build/-/node-gyp-build-4.6.0.tgz"
   integrity sha512-NTZVKn9IylLwUzaKjkas1e4u2DLNcV4rdYagA4PWdPwW87Bi7z+BznyKSRwS/761tV/lzCGXplWsiaMjLqP2zQ==
 
-node-int64@^0.4.0:
-  version "0.4.0"
-  resolved "https://registry.npmjs.org/node-int64/-/node-int64-0.4.0.tgz"
-  integrity sha512-O5lz91xSOeoXP6DulyHfllpq+Eg00MWitZIbtPfoSEvqIHdl5gfcY6hYzDWnj0qD5tz52PI08u9qUvSVeUBeHw==
-
 node-releases@^2.0.13:
   version "2.0.13"
   resolved "https://registry.npmjs.org/node-releases/-/node-releases-2.0.13.tgz"
@@ -8263,11 +7140,6 @@ number-to-bn@1.7.0:
     bn.js "4.11.6"
     strip-hex-prefix "1.0.0"
 
-nwsapi@^2.2.2:
-  version "2.2.4"
-  resolved "https://registry.npmjs.org/nwsapi/-/nwsapi-2.2.4.tgz"
-  integrity sha512-NHj4rzRo0tQdijE9ZqAx6kYDcoRwYwSYzCA8MY3JzfxlrvEU0jhnhJT9BhqhJs7I/dKcrDm6TyulaRqZPIhN5g==
-
 object-assign@^4.0.1, object-assign@^4.1.1:
   version "4.1.1"
   resolved "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz"
@@ -8399,18 +7271,6 @@ optimism@^0.16.1:
     "@wry/context" "^0.7.0"
     "@wry/trie" "^0.3.0"
 
-optionator@^0.8.1:
-  version "0.8.3"
-  resolved "https://registry.npmjs.org/optionator/-/optionator-0.8.3.tgz"
-  integrity sha512-+IW9pACdk3XWmmTXG8m3upGUJst5XRGzxMRjXzAuJ1XnIFNvfhjjIuYkDvysnPQ7qzqVzLt78BCruntqRhWQbA==
-  dependencies:
-    deep-is "~0.1.3"
-    fast-levenshtein "~2.0.6"
-    levn "~0.3.0"
-    prelude-ls "~1.1.2"
-    type-check "~0.3.2"
-    word-wrap "~1.2.3"
-
 optionator@^0.9.3:
   version "0.9.3"
   resolved "https://registry.npmjs.org/optionator/-/optionator-0.9.3.tgz"
@@ -8423,27 +7283,13 @@ optionator@^0.9.3:
     prelude-ls "^1.2.1"
     type-check "^0.4.0"
 
-p-limit@^2.2.0:
-  version "2.3.0"
-  resolved "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz"
-  integrity sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==
-  dependencies:
-    p-try "^2.0.0"
-
-p-limit@^3.0.2, p-limit@^3.1.0:
+p-limit@^3.0.2:
   version "3.1.0"
   resolved "https://registry.npmjs.org/p-limit/-/p-limit-3.1.0.tgz"
   integrity sha512-TYOanM3wGwNGsZN2cVTYPArw454xnXj5qmWF1bEoAc4+cU/ol7GVh7odevjp1FNHduHc3KZMcFduxU5Xc6uJRQ==
   dependencies:
     yocto-queue "^0.1.0"
 
-p-locate@^4.1.0:
-  version "4.1.0"
-  resolved "https://registry.npmjs.org/p-locate/-/p-locate-4.1.0.tgz"
-  integrity sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==
-  dependencies:
-    p-limit "^2.2.0"
-
 p-locate@^5.0.0:
   version "5.0.0"
   resolved "https://registry.npmjs.org/p-locate/-/p-locate-5.0.0.tgz"
@@ -8451,11 +7297,6 @@ p-locate@^5.0.0:
   dependencies:
     p-limit "^3.0.2"
 
-p-try@^2.0.0:
-  version "2.2.0"
-  resolved "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz"
-  integrity sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==
-
 pako@^2.0.2:
   version "2.1.0"
   resolved "https://registry.npmjs.org/pako/-/pako-2.1.0.tgz"
@@ -8468,7 +7309,7 @@ parent-module@^1.0.0:
   dependencies:
     callsites "^3.0.0"
 
-parse-json@^5.0.0, parse-json@^5.2.0:
+parse-json@^5.0.0:
   version "5.2.0"
   resolved "https://registry.npmjs.org/parse-json/-/parse-json-5.2.0.tgz"
   integrity sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==
@@ -8478,13 +7319,6 @@ parse-json@^5.0.0, parse-json@^5.2.0:
     json-parse-even-better-errors "^2.3.0"
     lines-and-columns "^1.1.6"
 
-parse5@^7.0.0, parse5@^7.1.1:
-  version "7.1.2"
-  resolved "https://registry.npmjs.org/parse5/-/parse5-7.1.2.tgz"
-  integrity sha512-Czj1WaSVpaoj0wbhMzLmWD69anp2WH7FXMB9n1Sy8/ZFF9jolSQVMu1Ij5WIyGmcBmhk7EOndpO4mIpihVqAXw==
-  dependencies:
-    entities "^4.4.0"
-
 path-exists@^4.0.0:
   version "4.0.0"
   resolved "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz"
@@ -8531,7 +7365,7 @@ picocolors@^1.0.0:
   resolved "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz"
   integrity sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==
 
-picomatch@^2.0.4, picomatch@^2.2.1, picomatch@^2.2.3, picomatch@^2.3.1:
+picomatch@^2.0.4, picomatch@^2.2.1, picomatch@^2.3.1:
   version "2.3.1"
   resolved "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz"
   integrity sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==
@@ -8576,18 +7410,11 @@ pino@7.11.0:
     sonic-boom "^2.2.1"
     thread-stream "^0.15.1"
 
-pirates@^4.0.1, pirates@^4.0.4:
+pirates@^4.0.1:
   version "4.0.5"
   resolved "https://registry.npmjs.org/pirates/-/pirates-4.0.5.tgz"
   integrity sha512-8V9+HQPupnaXMA23c5hvl69zXvTwTzyAYasnkb0Tts4XvO4CliqONMOnvlq26rkhLC3nWDFBJf73LU1e1VZLaQ==
 
-pkg-dir@^4.2.0:
-  version "4.2.0"
-  resolved "https://registry.npmjs.org/pkg-dir/-/pkg-dir-4.2.0.tgz"
-  integrity sha512-HRDzbaKjC+AOWVXxAU/x54COGeIv9eb+6CkDSQoNTt4XyWoIJvuPsXizxu/Fr23EiekbtZwmh1IcIG/l/a10GQ==
-  dependencies:
-    find-up "^4.0.0"
-
 postcss-import@^15.1.0:
   version "15.1.0"
   resolved "https://registry.npmjs.org/postcss-import/-/postcss-import-15.1.0.tgz"
@@ -8646,38 +7473,15 @@ prelude-ls@^1.2.1:
   resolved "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz"
   integrity sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==
 
-prelude-ls@~1.1.2:
-  version "1.1.2"
-  resolved "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.1.2.tgz"
-  integrity sha512-ESF23V4SKG6lVSGZgYNpbsiaAkdab6ZgOxe52p7+Kid3W3u3bxR4Vfd/o21dmN7jSt0IwgZ4v5MUd26FEtXE9w==
-
 prettier-plugin-tailwindcss@^0.5.6:
   version "0.5.6"
   resolved "https://registry.yarnpkg.com/prettier-plugin-tailwindcss/-/prettier-plugin-tailwindcss-0.5.6.tgz#8e511857a49bf127f078985f52b04a70e8e92285"
   integrity sha512-2Xgb+GQlkPAUCFi3sV+NOYcSI5XgduvDBL2Zt/hwJudeKXkyvRS65c38SB0yb9UB40+1rL83I6m0RtlOQ8eHdg==
 
-prettier@^3.0.3:
-  version "3.0.3"
-  resolved "https://registry.npmjs.org/prettier/-/prettier-3.0.3.tgz"
-  integrity sha512-L/4pUDMxcNa8R/EthV08Zt42WBO4h1rarVtK0K+QJG0X187OLo7l699jWw0GKuwzkPQ//jMFA/8Xm6Fh3J/DAg==
-
-pretty-format@^27.0.2:
-  version "27.5.1"
-  resolved "https://registry.npmjs.org/pretty-format/-/pretty-format-27.5.1.tgz"
-  integrity sha512-Qb1gy5OrP5+zDf2Bvnzdl3jsTf1qXVMazbvCoKhtKqVs4/YK4ozX4gKQJJVyNe+cajNPn0KoC0MC3FUmaHWEmQ==
-  dependencies:
-    ansi-regex "^5.0.1"
-    ansi-styles "^5.0.0"
-    react-is "^17.0.1"
-
-pretty-format@^29.0.0, pretty-format@^29.7.0:
-  version "29.7.0"
-  resolved "https://registry.npmjs.org/pretty-format/-/pretty-format-29.7.0.tgz"
-  integrity sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==
-  dependencies:
-    "@jest/schemas" "^29.6.3"
-    ansi-styles "^5.0.0"
-    react-is "^18.0.0"
+prettier@^3.2.4:
+  version "3.2.4"
+  resolved "https://registry.yarnpkg.com/prettier/-/prettier-3.2.4.tgz#4723cadeac2ce7c9227de758e5ff9b14e075f283"
+  integrity sha512-FWu1oLHKCrtpO1ypU6J0SbK2d9Ckwysq6bHj/uaCP26DxrPpppCLQRGVuqAxSTvhF00AcvDRyYrLNW7ocBhFFQ==
 
 process-nextick-args@~2.0.0:
   version "2.0.1"
@@ -8694,14 +7498,6 @@ progress@^2.0.3:
   resolved "https://registry.npmjs.org/progress/-/progress-2.0.3.tgz"
   integrity sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==
 
-prompts@^2.0.1:
-  version "2.4.2"
-  resolved "https://registry.npmjs.org/prompts/-/prompts-2.4.2.tgz"
-  integrity sha512-NxNv/kLguCA7p3jE8oL2aEBsrJWgAakBpgmgK6lpPWV+WuOmY6r2/zbAVnP+T8bQlA0nzHXSJSJW0Hq7ylaD2Q==
-  dependencies:
-    kleur "^3.0.3"
-    sisteransi "^1.0.5"
-
 prop-types@^15.6.2, prop-types@^15.7.2, prop-types@^15.8.1:
   version "15.8.1"
   resolved "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz"
@@ -8753,21 +7549,11 @@ proxy-from-env@^1.1.0:
   resolved "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz"
   integrity sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==
 
-psl@^1.1.33:
-  version "1.9.0"
-  resolved "https://registry.npmjs.org/psl/-/psl-1.9.0.tgz"
-  integrity sha512-E/ZsdU4HLs/68gYzgGTkMicWTLPdAftJLfJFlLUAAKZGkStNU72sZjT66SnMDVOfOWY/YAoiD7Jxa9iHvngcag==
-
-punycode@^2.1.0, punycode@^2.1.1:
+punycode@^2.1.0:
   version "2.3.0"
   resolved "https://registry.npmjs.org/punycode/-/punycode-2.3.0.tgz"
   integrity sha512-rRV+zQD8tVFys26lAGR9WUuS4iUAngJScM+ZRSKtvl5tKeZ2t5bvdNFdNHBW9FWR4guGHlgmsZ1G7BSm2wTbuA==
 
-pure-rand@^6.0.0:
-  version "6.0.2"
-  resolved "https://registry.npmjs.org/pure-rand/-/pure-rand-6.0.2.tgz"
-  integrity sha512-6Yg0ekpKICSjPswYOuC5sku/TSWaRYlA0qsXqJgM/d/4pLPHPuTxK7Nbf7jFKzAeedUhR8C7K9Uv63FBsSo8xQ==
-
 qr.js@0.0.0:
   version "0.0.0"
   resolved "https://registry.npmjs.org/qr.js/-/qr.js-0.0.0.tgz"
@@ -8783,11 +7569,6 @@ query-string@7.1.3:
     split-on-first "^1.0.0"
     strict-uri-encode "^2.0.0"
 
-querystringify@^2.1.1:
-  version "2.2.0"
-  resolved "https://registry.npmjs.org/querystringify/-/querystringify-2.2.0.tgz"
-  integrity sha512-FIqgj2EUvTa7R50u0rGsyTftzjYmv/a3hO345bZNrqabNqjtgiDMgmo4mkUjd+nzU5oF3dClKqFIPUKybUyqoQ==
-
 queue-microtask@^1.2.2:
   version "1.2.3"
   resolved "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz"
@@ -8847,16 +7628,6 @@ react-is@^16.10.2, react-is@^16.13.1, react-is@^16.7.0:
   resolved "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz"
   integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
 
-react-is@^17.0.1:
-  version "17.0.2"
-  resolved "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz"
-  integrity sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==
-
-react-is@^18.0.0:
-  version "18.2.0"
-  resolved "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz"
-  integrity sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==
-
 react-lifecycles-compat@^3.0.4:
   version "3.0.4"
   resolved "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz"
@@ -8875,20 +7646,20 @@ react-qr-code@^2.0.12:
     prop-types "^15.8.1"
     qr.js "0.0.0"
 
-react-router-dom@^6.17.0:
-  version "6.17.0"
-  resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-6.17.0.tgz#ea73f89186546c1cf72b10fcb7356d874321b2ad"
-  integrity sha512-qWHkkbXQX+6li0COUUPKAUkxjNNqPJuiBd27dVwQGDNsuFBdMbrS6UZ0CLYc4CsbdLYTckn4oB4tGDuPZpPhaQ==
+react-router-dom@^6.21.3:
+  version "6.21.3"
+  resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-6.21.3.tgz#ef3a7956a3699c7b82c21fcb3dbc63c313ed8c5d"
+  integrity sha512-kNzubk7n4YHSrErzjLK72j0B5i969GsuCGazRl3G6j1zqZBLjuSlYBdVdkDOgzGdPIffUOc9nmgiadTEVoq91g==
   dependencies:
-    "@remix-run/router" "1.10.0"
-    react-router "6.17.0"
+    "@remix-run/router" "1.14.2"
+    react-router "6.21.3"
 
-react-router@6.17.0:
-  version "6.17.0"
-  resolved "https://registry.yarnpkg.com/react-router/-/react-router-6.17.0.tgz#7b680c4cefbc425b57537eb9c73bedecbdc67c1e"
-  integrity sha512-YJR3OTJzi3zhqeJYADHANCGPUu9J+6fT5GLv82UWRGSxu6oJYCKVmxUcaBQuGm9udpWmPsvpme/CdHumqgsoaA==
+react-router@6.21.3:
+  version "6.21.3"
+  resolved "https://registry.yarnpkg.com/react-router/-/react-router-6.21.3.tgz#8086cea922c2bfebbb49c6594967418f1f167d70"
+  integrity sha512-a0H638ZXULv1OdkmiK6s6itNhoy33ywxmUFT/xtSoVyf9VnC7n7+VT4LjVzdIHSaF5TIh9ylUgxMXksHTgGrKg==
   dependencies:
-    "@remix-run/router" "1.10.0"
+    "@remix-run/router" "1.14.2"
 
 react-smooth@^2.0.5:
   version "2.0.5"
@@ -9034,14 +7805,6 @@ rechoir@^0.6.2:
   dependencies:
     resolve "^1.1.6"
 
-redent@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.npmjs.org/redent/-/redent-3.0.0.tgz"
-  integrity sha512-6tDA8g98We0zd0GvVeMT9arEOnTw9qM03L9cJXaCjrip1OO764RDBLBfrB4cwzNGDj5OA5ioymC9GkizgWJDUg==
-  dependencies:
-    indent-string "^4.0.0"
-    strip-indent "^3.0.0"
-
 reflect.getprototypeof@^1.0.4:
   version "1.0.4"
   resolved "https://registry.npmjs.org/reflect.getprototypeof/-/reflect.getprototypeof-1.0.4.tgz"
@@ -9120,18 +7883,6 @@ require-directory@^2.1.1:
   resolved "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz"
   integrity sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==
 
-requires-port@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz"
-  integrity sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ==
-
-resolve-cwd@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.npmjs.org/resolve-cwd/-/resolve-cwd-3.0.0.tgz"
-  integrity sha512-OrZaX2Mb+rJCpH/6CpSqt9xFVpN++x01XnN2ie9g6P5/3xelLAkXWVADpdz1IHD/KFfEXyE6V0U01OQ3UO2rEg==
-  dependencies:
-    resolve-from "^5.0.0"
-
 resolve-from@^4.0.0:
   version "4.0.0"
   resolved "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz"
@@ -9142,12 +7893,7 @@ resolve-from@^5.0.0:
   resolved "https://registry.npmjs.org/resolve-from/-/resolve-from-5.0.0.tgz"
   integrity sha512-qYg9KP24dD5qka9J47d0aVky0N+b4fTU89LN9iDnjB5waksiC49rvMB0PrUJQGoTmH50XPiqOvAjDfaijGxYZw==
 
-resolve.exports@^2.0.0:
-  version "2.0.2"
-  resolved "https://registry.npmjs.org/resolve.exports/-/resolve.exports-2.0.2.tgz"
-  integrity sha512-X2UW6Nw3n/aMgDVy+0rSqgHlv39WZAlZrXCdnbyEiKm17DSqHX4MmQMaST3FbeWR5FTuRcUwYAziZajji0Y7mg==
-
-resolve@1.22.8, resolve@^1.1.6, resolve@^1.1.7, resolve@^1.14.2, resolve@^1.20.0, resolve@^1.22.2, resolve@^1.22.4:
+resolve@1.22.8, resolve@^1.1.6, resolve@^1.1.7, resolve@^1.14.2, resolve@^1.22.2, resolve@^1.22.4:
   version "1.22.8"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.22.8.tgz#b6c87a9f2aa06dfab52e3d70ac8cde321fa5a48d"
   integrity sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==
@@ -9277,18 +8023,6 @@ safe-stable-stringify@^2.1.0:
   resolved "https://registry.npmjs.org/safe-stable-stringify/-/safe-stable-stringify-2.4.3.tgz"
   integrity sha512-e2bDA2WJT0wxseVd4lsDP4+3ONX6HpMXQa1ZhFQ7SU+GjvORCmShbCMltrtIDfkYhVHrOcPtj+KhmDBdPdZD1g==
 
-"safer-buffer@>= 2.1.2 < 3.0.0":
-  version "2.1.2"
-  resolved "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz"
-  integrity sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==
-
-saxes@^6.0.0:
-  version "6.0.0"
-  resolved "https://registry.npmjs.org/saxes/-/saxes-6.0.0.tgz"
-  integrity sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==
-  dependencies:
-    xmlchars "^2.2.0"
-
 scheduler@^0.23.0:
   version "0.23.0"
   resolved "https://registry.npmjs.org/scheduler/-/scheduler-0.23.0.tgz"
@@ -9338,12 +8072,12 @@ semver-compare@^1.0.0:
   resolved "https://registry.npmjs.org/semver-compare/-/semver-compare-1.0.0.tgz"
   integrity sha512-YM3/ITh2MJ5MtzaM429anh+x2jiLVjqILF4m4oyQB18W7Ggea7BfqdH/wGMK7dDiMghv/6WG7znWMwUDzJiXow==
 
-semver@^6.0.0, semver@^6.1.1, semver@^6.1.2, semver@^6.3.0, semver@^6.3.1:
+semver@^6.1.1, semver@^6.1.2, semver@^6.3.0, semver@^6.3.1:
   version "6.3.1"
   resolved "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz"
   integrity sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==
 
-semver@^7.5.3, semver@^7.5.4:
+semver@^7.5.4:
   version "7.5.4"
   resolved "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz"
   integrity sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==
@@ -9377,34 +8111,34 @@ shallowequal@^1.1.0:
   resolved "https://registry.npmjs.org/shallowequal/-/shallowequal-1.1.0.tgz"
   integrity sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==
 
-sharp@^0.33.0:
-  version "0.33.0"
-  resolved "https://registry.yarnpkg.com/sharp/-/sharp-0.33.0.tgz#95f77cda3684522e210ab55a167dad6cb5fbfe4f"
-  integrity sha512-99DZKudjm/Rmz+M0/26t4DKpXyywAOJaayGS9boEn7FvgtG0RYBi46uPE2c+obcJRtA3AZa0QwJot63gJQ1F0Q==
+sharp@^0.33.2:
+  version "0.33.2"
+  resolved "https://registry.yarnpkg.com/sharp/-/sharp-0.33.2.tgz#fcd52f2c70effa8a02160b1bfd989a3de55f2dfb"
+  integrity sha512-WlYOPyyPDiiM07j/UO+E720ju6gtNtHjEGg5vovUk1Lgxyjm2LFO+37Nt/UI3MMh2l6hxTWQWi7qk3cXJTutcQ==
   dependencies:
     color "^4.2.3"
     detect-libc "^2.0.2"
     semver "^7.5.4"
   optionalDependencies:
-    "@img/sharp-darwin-arm64" "0.33.0"
-    "@img/sharp-darwin-x64" "0.33.0"
-    "@img/sharp-libvips-darwin-arm64" "1.0.0"
-    "@img/sharp-libvips-darwin-x64" "1.0.0"
-    "@img/sharp-libvips-linux-arm" "1.0.0"
-    "@img/sharp-libvips-linux-arm64" "1.0.0"
-    "@img/sharp-libvips-linux-s390x" "1.0.0"
-    "@img/sharp-libvips-linux-x64" "1.0.0"
-    "@img/sharp-libvips-linuxmusl-arm64" "1.0.0"
-    "@img/sharp-libvips-linuxmusl-x64" "1.0.0"
-    "@img/sharp-linux-arm" "0.33.0"
-    "@img/sharp-linux-arm64" "0.33.0"
-    "@img/sharp-linux-s390x" "0.33.0"
-    "@img/sharp-linux-x64" "0.33.0"
-    "@img/sharp-linuxmusl-arm64" "0.33.0"
-    "@img/sharp-linuxmusl-x64" "0.33.0"
-    "@img/sharp-wasm32" "0.33.0"
-    "@img/sharp-win32-ia32" "0.33.0"
-    "@img/sharp-win32-x64" "0.33.0"
+    "@img/sharp-darwin-arm64" "0.33.2"
+    "@img/sharp-darwin-x64" "0.33.2"
+    "@img/sharp-libvips-darwin-arm64" "1.0.1"
+    "@img/sharp-libvips-darwin-x64" "1.0.1"
+    "@img/sharp-libvips-linux-arm" "1.0.1"
+    "@img/sharp-libvips-linux-arm64" "1.0.1"
+    "@img/sharp-libvips-linux-s390x" "1.0.1"
+    "@img/sharp-libvips-linux-x64" "1.0.1"
+    "@img/sharp-libvips-linuxmusl-arm64" "1.0.1"
+    "@img/sharp-libvips-linuxmusl-x64" "1.0.1"
+    "@img/sharp-linux-arm" "0.33.2"
+    "@img/sharp-linux-arm64" "0.33.2"
+    "@img/sharp-linux-s390x" "0.33.2"
+    "@img/sharp-linux-x64" "0.33.2"
+    "@img/sharp-linuxmusl-arm64" "0.33.2"
+    "@img/sharp-linuxmusl-x64" "0.33.2"
+    "@img/sharp-wasm32" "0.33.2"
+    "@img/sharp-win32-ia32" "0.33.2"
+    "@img/sharp-win32-x64" "0.33.2"
 
 shebang-command@^2.0.0:
   version "2.0.0"
@@ -9444,7 +8178,7 @@ side-channel@^1.0.4:
     get-intrinsic "^1.0.2"
     object-inspect "^1.9.0"
 
-signal-exit@^3.0.2, signal-exit@^3.0.3, signal-exit@^3.0.7:
+signal-exit@^3.0.2, signal-exit@^3.0.3:
   version "3.0.7"
   resolved "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.7.tgz"
   integrity sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==
@@ -9461,11 +8195,6 @@ simple-swizzle@^0.2.2:
   dependencies:
     is-arrayish "^0.3.1"
 
-sisteransi@^1.0.5:
-  version "1.0.5"
-  resolved "https://registry.npmjs.org/sisteransi/-/sisteransi-1.0.5.tgz"
-  integrity sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg==
-
 slash@^3.0.0:
   version "3.0.0"
   resolved "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz"
@@ -9521,14 +8250,6 @@ source-map-js@^1.0.1, source-map-js@^1.0.2:
   resolved "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz"
   integrity sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==
 
-source-map-support@0.5.13:
-  version "0.5.13"
-  resolved "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.13.tgz"
-  integrity sha512-SHSKFHadjVA5oR4PPqhtAVdcBWwRYVd6g6cAXnIbRiIwc2EhPrTuKUBdSLvlEKyIP3GCf89fltvcZiP9MMFA1w==
-  dependencies:
-    buffer-from "^1.0.0"
-    source-map "^0.6.0"
-
 source-map@0.8.0-beta.0:
   version "0.8.0-beta.0"
   resolved "https://registry.npmjs.org/source-map/-/source-map-0.8.0-beta.0.tgz"
@@ -9536,11 +8257,6 @@ source-map@0.8.0-beta.0:
   dependencies:
     whatwg-url "^7.0.0"
 
-source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.1:
-  version "0.6.1"
-  resolved "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz"
-  integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==
-
 split-on-first@^1.0.0:
   version "1.1.0"
   resolved "https://registry.npmjs.org/split-on-first/-/split-on-first-1.1.0.tgz"
@@ -9551,18 +8267,6 @@ split2@^4.0.0:
   resolved "https://registry.npmjs.org/split2/-/split2-4.2.0.tgz"
   integrity sha512-UcjcJOWknrNkF6PLX83qcHM6KHgVKNkV62Y8a5uYDVv9ydGQVwAHMKqHdJje1VTWpljG0WYpCDhrCdAOYH4TWg==
 
-sprintf-js@~1.0.2:
-  version "1.0.3"
-  resolved "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz"
-  integrity sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==
-
-stack-utils@^2.0.3:
-  version "2.0.6"
-  resolved "https://registry.npmjs.org/stack-utils/-/stack-utils-2.0.6.tgz"
-  integrity sha512-XlkWvfIm6RmsWtNJx+uqtKLS8eqFbxUg0ZzLXqY0caEy9l7hruX8IpiDnjsLavoBgqCCR71TqWO8MaXYheJ3RQ==
-  dependencies:
-    escape-string-regexp "^2.0.0"
-
 stacktrace-parser@^0.1.10:
   version "0.1.10"
   resolved "https://registry.npmjs.org/stacktrace-parser/-/stacktrace-parser-0.1.10.tgz"
@@ -9602,15 +8306,7 @@ string-argv@0.3.2:
   resolved "https://registry.npmjs.org/string-argv/-/string-argv-0.3.2.tgz"
   integrity sha512-aqD2Q0144Z+/RqG52NeHEkZauTAUWJO8c6yTftGJKO3Tja5tUgIfmIl6kExvhtxSDP7fXB6DvzkfMpCd/F3G+Q==
 
-string-length@^4.0.1:
-  version "4.0.2"
-  resolved "https://registry.npmjs.org/string-length/-/string-length-4.0.2.tgz"
-  integrity sha512-+l6rNN5fYHNhZZy41RXsYptCjA2Igmq4EG7kZAYFQI1E1VTXarr6ZPXBg6eq7Y6eK4FEhY6AJlyuFIb/v/S0VQ==
-  dependencies:
-    char-regex "^1.0.2"
-    strip-ansi "^6.0.0"
-
-string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3:
+string-width@^4.1.0, string-width@^4.2.0:
   version "4.2.3"
   resolved "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz"
   integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
@@ -9725,11 +8421,6 @@ strip-bom@^3.0.0:
   resolved "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz"
   integrity sha512-vavAMRXOgBVNF6nyEEmL3DBK19iRpDcoIwW+swQ+CbGiu7lju6t+JklA1MHweoWtadgt4ISVUsXLyDq34ddcwA==
 
-strip-bom@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.npmjs.org/strip-bom/-/strip-bom-4.0.0.tgz"
-  integrity sha512-3xurFv5tEgii33Zi8Jtp55wEIILR9eh34FAW00PZf+JnSsTmV/ioewSgQl97JHvgjoRGwPShsWm+IdrxB35d0w==
-
 strip-final-newline@^2.0.0:
   version "2.0.0"
   resolved "https://registry.npmjs.org/strip-final-newline/-/strip-final-newline-2.0.0.tgz"
@@ -9747,13 +8438,6 @@ strip-hex-prefix@1.0.0:
   dependencies:
     is-hex-prefixed "1.0.0"
 
-strip-indent@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.npmjs.org/strip-indent/-/strip-indent-3.0.0.tgz"
-  integrity sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==
-  dependencies:
-    min-indent "^1.0.0"
-
 strip-json-comments@^3.1.1:
   version "3.1.1"
   resolved "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz"
@@ -9806,13 +8490,6 @@ supports-color@^7.1.0:
   dependencies:
     has-flag "^4.0.0"
 
-supports-color@^8.0.0:
-  version "8.1.1"
-  resolved "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz"
-  integrity sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==
-  dependencies:
-    has-flag "^4.0.0"
-
 supports-preserve-symlinks-flag@^1.0.0:
   version "1.0.0"
   resolved "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz"
@@ -9853,11 +8530,6 @@ symbol-observable@^4.0.0:
   resolved "https://registry.npmjs.org/symbol-observable/-/symbol-observable-4.0.0.tgz"
   integrity sha512-b19dMThMV4HVFynSAM1++gBHAbk2Tc/osgLIBZMKsyqh34jb2e8Os7T6ZW/Bt3pJFdBTd2JwAnAAEQV7rSNvcQ==
 
-symbol-tree@^3.2.4:
-  version "3.2.4"
-  resolved "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz"
-  integrity sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==
-
 synckit@^0.8.4:
   version "0.8.5"
   resolved "https://registry.npmjs.org/synckit/-/synckit-0.8.5.tgz"
@@ -9904,15 +8576,6 @@ tapable@^2.2.0:
   resolved "https://registry.npmjs.org/tapable/-/tapable-2.2.1.tgz"
   integrity sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ==
 
-test-exclude@^6.0.0:
-  version "6.0.0"
-  resolved "https://registry.npmjs.org/test-exclude/-/test-exclude-6.0.0.tgz"
-  integrity sha512-cAGWPIyOHU6zlmg88jwm7VRyXnMN7iV68OGAbYDk/Mh/xC/pzVPlQtY6ngoIH/5/tciuhGfvESU8GrHrcxD56w==
-  dependencies:
-    "@istanbuljs/schema" "^0.1.2"
-    glob "^7.1.4"
-    minimatch "^3.0.4"
-
 text-table@^0.2.0:
   version "0.2.0"
   resolved "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz"
@@ -9978,11 +8641,6 @@ tippy.js@^6.3.1:
   dependencies:
     "@popperjs/core" "^2.9.0"
 
-tmpl@1.0.5:
-  version "1.0.5"
-  resolved "https://registry.npmjs.org/tmpl/-/tmpl-1.0.5.tgz"
-  integrity sha512-3f0uOEAQwIqGuWW2MVzYg8fV/QNnc/IpuJNG837rLuczAaLVHslWHZQj4IGiEl5Hs3kkbhwL9Ab7Hrsmuj+Smw==
-
 to-fast-properties@^2.0.0:
   version "2.0.0"
   resolved "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz"
@@ -10000,16 +8658,6 @@ toggle-selection@^1.0.6:
   resolved "https://registry.npmjs.org/toggle-selection/-/toggle-selection-1.0.6.tgz"
   integrity sha512-BiZS+C1OS8g/q2RRbJmy59xpyghNBqrr6k5L/uKBGRsTfxmu3ffiRnd8mlGPUVayg8pvfi5urfnu8TU7DVOkLQ==
 
-tough-cookie@^4.1.2:
-  version "4.1.3"
-  resolved "https://registry.npmjs.org/tough-cookie/-/tough-cookie-4.1.3.tgz"
-  integrity sha512-aX/y5pVRkfRnfmuX+OdbSdXvPe6ieKX/G2s7e98f4poJHnqH3281gDPm/metm6E/WRamfx7WC4HUqkWHfQHprw==
-  dependencies:
-    psl "^1.1.33"
-    punycode "^2.1.1"
-    universalify "^0.2.0"
-    url-parse "^1.5.3"
-
 tr46@^1.0.1:
   version "1.0.1"
   resolved "https://registry.npmjs.org/tr46/-/tr46-1.0.1.tgz"
@@ -10017,13 +8665,6 @@ tr46@^1.0.1:
   dependencies:
     punycode "^2.1.0"
 
-tr46@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.npmjs.org/tr46/-/tr46-3.0.0.tgz"
-  integrity sha512-l7FvfAHlcmulp8kr+flpQZmVwtu7nfRV7NZujtN0OqES8EL4O4e0qqzL0DC5gAvx/ZC/9lk6rhcUwYvkBnBnYA==
-  dependencies:
-    punycode "^2.1.1"
-
 tr46@~0.0.3:
   version "0.0.3"
   resolved "https://registry.npmjs.org/tr46/-/tr46-0.0.3.tgz"
@@ -10108,28 +8749,11 @@ type-check@^0.4.0, type-check@~0.4.0:
   dependencies:
     prelude-ls "^1.2.1"
 
-type-check@~0.3.2:
-  version "0.3.2"
-  resolved "https://registry.npmjs.org/type-check/-/type-check-0.3.2.tgz"
-  integrity sha512-ZCmOJdvOWDBYJlzAoFkC+Q0+bUyEOS1ltgp1MGU03fqHG+dbi9tBFU2Rd9QKiDZFAYrhPh2JUf7rZRIuHRKtOg==
-  dependencies:
-    prelude-ls "~1.1.2"
-
-type-detect@4.0.8:
-  version "4.0.8"
-  resolved "https://registry.npmjs.org/type-detect/-/type-detect-4.0.8.tgz"
-  integrity sha512-0fr/mIH1dlO+x7TlcMy+bIDqKPsw/70tVyeHW787goQjhmqaZe10uwLujubK9q9Lg6Fiho1KUKDYz0Z7k7g5/g==
-
 type-fest@^0.20.2:
   version "0.20.2"
   resolved "https://registry.npmjs.org/type-fest/-/type-fest-0.20.2.tgz"
   integrity sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==
 
-type-fest@^0.21.3:
-  version "0.21.3"
-  resolved "https://registry.npmjs.org/type-fest/-/type-fest-0.21.3.tgz"
-  integrity sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==
-
 type-fest@^0.7.1:
   version "0.7.1"
   resolved "https://registry.npmjs.org/type-fest/-/type-fest-0.7.1.tgz"
@@ -10216,10 +8840,10 @@ unbox-primitive@^1.0.2:
     has-symbols "^1.0.3"
     which-boxed-primitive "^1.0.2"
 
-undici-types@~5.25.1:
-  version "5.25.3"
-  resolved "https://registry.npmjs.org/undici-types/-/undici-types-5.25.3.tgz"
-  integrity sha512-Ga1jfYwRn7+cP9v8auvEXN1rX3sWqlayd4HP7OKk4mZWylEmu3KzXDUGrQUN6Ol7qo1gPvB2e5gX6udnyEPgdA==
+undici-types@~5.26.4:
+  version "5.26.5"
+  resolved "https://registry.yarnpkg.com/undici-types/-/undici-types-5.26.5.tgz#bcd539893d00b56e964fd2657a4866b221a65617"
+  integrity sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==
 
 unicode-canonical-property-names-ecmascript@^2.0.0:
   version "2.0.0"
@@ -10244,11 +8868,6 @@ unicode-property-aliases-ecmascript@^2.0.0:
   resolved "https://registry.npmjs.org/unicode-property-aliases-ecmascript/-/unicode-property-aliases-ecmascript-2.1.0.tgz"
   integrity sha512-6t3foTQI9qne+OZoVQB/8x8rk2k1eVy1gRXhV3oFQ5T6R1dqQ1xtin3XqSlx3+ATBkliTaR/hHyJBm+LVPNM8w==
 
-universalify@^0.2.0:
-  version "0.2.0"
-  resolved "https://registry.npmjs.org/universalify/-/universalify-0.2.0.tgz"
-  integrity sha512-CJ1QgKmNg3CwvAv/kOFmtnEN05f0D/cn9QntgNOQlQF9dgvVTHj3t+8JPdjqawCHk7V/KA+fbUqzZ9XWhcqPUg==
-
 untildify@^4.0.0:
   version "4.0.0"
   resolved "https://registry.npmjs.org/untildify/-/untildify-4.0.0.tgz"
@@ -10269,14 +8888,6 @@ uri-js@^4.2.2:
   dependencies:
     punycode "^2.1.0"
 
-url-parse@^1.5.3:
-  version "1.5.10"
-  resolved "https://registry.npmjs.org/url-parse/-/url-parse-1.5.10.tgz"
-  integrity sha512-WypcfiRhfeUP9vvF0j6rw0J3hrWrw6iZv3+22h6iRMJ/8z1Tj6XfLP4DsUix5MhMPnXpiHDoKyoZ/bdCkwBCiQ==
-  dependencies:
-    querystringify "^2.1.1"
-    requires-port "^1.0.0"
-
 use-local-storage-state@^18.3.3:
   version "18.3.3"
   resolved "https://registry.npmjs.org/use-local-storage-state/-/use-local-storage-state-18.3.3.tgz"
@@ -10302,15 +8913,6 @@ utility-types@^3.10.0:
   resolved "https://registry.npmjs.org/utility-types/-/utility-types-3.10.0.tgz"
   integrity sha512-O11mqxmi7wMKCo6HKFt5AhO4BwY3VV68YU07tgxfz8zJTIxr4BpsezN49Ffwy9j3ZpwwJp4fkRwjRzq3uWE6Rg==
 
-v8-to-istanbul@^9.0.1:
-  version "9.1.0"
-  resolved "https://registry.npmjs.org/v8-to-istanbul/-/v8-to-istanbul-9.1.0.tgz"
-  integrity sha512-6z3GW9x8G1gd+JIIgQQQxXuiJtCXeAjp6RaPEPLv62mH3iPHPxV6W3robxtCzNErRo6ZwTmzWhsbNvjyEBKzKA==
-  dependencies:
-    "@jridgewell/trace-mapping" "^0.3.12"
-    "@types/istanbul-lib-coverage" "^2.0.1"
-    convert-source-map "^1.6.0"
-
 victory-vendor@^36.6.8:
   version "36.6.8"
   resolved "https://registry.npmjs.org/victory-vendor/-/victory-vendor-36.6.8.tgz"
@@ -10331,20 +8933,6 @@ victory-vendor@^36.6.8:
     d3-time "^3.0.0"
     d3-timer "^3.0.1"
 
-w3c-xmlserializer@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-4.0.0.tgz"
-  integrity sha512-d+BFHzbiCx6zGfz0HyQ6Rg69w9k19nviJspaj4yNscGjrHu94sVP+aRm75yEbCh+r2/yR+7q6hux9LVtbuTGBw==
-  dependencies:
-    xml-name-validator "^4.0.0"
-
-walker@^1.0.8:
-  version "1.0.8"
-  resolved "https://registry.npmjs.org/walker/-/walker-1.0.8.tgz"
-  integrity sha512-ts/8E8l5b7kY0vlWLewOkDXMmPdLcVV4GmOQLyxuSswIJsweeFZtAsMF7k1Nszz+TYBQrlYRmzOnr398y1JemQ==
-  dependencies:
-    makeerror "1.0.12"
-
 watchpack@2.4.0:
   version "2.4.0"
   resolved "https://registry.npmjs.org/watchpack/-/watchpack-2.4.0.tgz"
@@ -10377,36 +8965,11 @@ webidl-conversions@^4.0.2:
   resolved "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-4.0.2.tgz"
   integrity sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg==
 
-webidl-conversions@^7.0.0:
-  version "7.0.0"
-  resolved "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-7.0.0.tgz"
-  integrity sha512-VwddBukDzu71offAQR975unBIGqfKZpM+8ZX6ySk8nYhVoo5CYaZyzt3YBvYtRtO+aoGlqxPg/B87NGVZ/fu6g==
-
 "webpack-sources@^2.0.0 || ^3.0.0":
   version "3.2.3"
   resolved "https://registry.npmjs.org/webpack-sources/-/webpack-sources-3.2.3.tgz"
   integrity sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w==
 
-whatwg-encoding@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-2.0.0.tgz"
-  integrity sha512-p41ogyeMUrw3jWclHWTQg1k05DSVXPLcVxRTYsXUk+ZooOCZLcoYgPZ/HL/D/N+uQPOtcp1me1WhBEaX02mhWg==
-  dependencies:
-    iconv-lite "0.6.3"
-
-whatwg-mimetype@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-3.0.0.tgz"
-  integrity sha512-nt+N2dzIutVRxARx1nghPKGv1xHikU7HKdfafKkLNLindmPU/ch3U31NOCGGA/dmPcmb1VlofO0vnKAcsm0o/Q==
-
-whatwg-url@^11.0.0:
-  version "11.0.0"
-  resolved "https://registry.npmjs.org/whatwg-url/-/whatwg-url-11.0.0.tgz"
-  integrity sha512-RKT8HExMpoYx4igMiVMY83lN6UeITKJlBQ+vR/8ZJ8OCdSiN3RwCq+9gH0+Xzj0+5IrM6i4j/6LuvzbZIQgEcQ==
-  dependencies:
-    tr46 "^3.0.0"
-    webidl-conversions "^7.0.0"
-
 whatwg-url@^5.0.0:
   version "5.0.0"
   resolved "https://registry.npmjs.org/whatwg-url/-/whatwg-url-5.0.0.tgz"
@@ -10500,11 +9063,6 @@ wif@^2.0.6:
   dependencies:
     bs58check "<3.0.0"
 
-word-wrap@~1.2.3:
-  version "1.2.4"
-  resolved "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.4.tgz"
-  integrity sha512-2V81OA4ugVo5pRo46hAoD2ivUJx8jXmWXfUkY4KFNw0hEptvN0QfH3K4nHiwzGeKl5rFKedV48QVoqYavy4YpA==
-
 wrap-ansi@^7.0.0:
   version "7.0.0"
   resolved "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz"
@@ -10528,14 +9086,6 @@ wrappy@1:
   resolved "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz"
   integrity sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==
 
-write-file-atomic@^4.0.2:
-  version "4.0.2"
-  resolved "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-4.0.2.tgz"
-  integrity sha512-7KxauUdBmSdWnmpaGFg+ppNjKF8uNLry8LyzjauQDOVONfFLNKrKvQOxZ/VuTIcS/gge/YNahf5RIIQWTSarlg==
-  dependencies:
-    imurmurhash "^0.1.4"
-    signal-exit "^3.0.7"
-
 ws@7.4.6:
   version "7.4.6"
   resolved "https://registry.npmjs.org/ws/-/ws-7.4.6.tgz"
@@ -10546,21 +9096,6 @@ ws@^7, ws@^7.5.1:
   resolved "https://registry.npmjs.org/ws/-/ws-7.5.9.tgz"
   integrity sha512-F+P9Jil7UiSKSkppIiD94dN07AwvFixvLIj1Og1Rl9GGMuNipJnV9JzjD6XuqmAeiswGvUmNLjr5cFuXwNS77Q==
 
-ws@^8.11.0:
-  version "8.13.0"
-  resolved "https://registry.npmjs.org/ws/-/ws-8.13.0.tgz"
-  integrity sha512-x9vcZYTrFPC7aSIbj7sRCYo7L/Xb8Iy+pW0ng0wt2vCJv7M9HOMy0UoN3rr+IFC7hb7vXoqS+P9ktyLLLhO+LA==
-
-xml-name-validator@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-4.0.0.tgz"
-  integrity sha512-ICP2e+jsHvAj2E2lIHxa5tjXRlKDJo4IdvPvCXbXQGdzSfmSpNVyIKMvoZHjDY9DP0zV17iI85o90vRFXNccRw==
-
-xmlchars@^2.2.0:
-  version "2.2.0"
-  resolved "https://registry.npmjs.org/xmlchars/-/xmlchars-2.2.0.tgz"
-  integrity sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==
-
 xstream@^11.14.0:
   version "11.14.0"
   resolved "https://registry.npmjs.org/xstream/-/xstream-11.14.0.tgz"
@@ -10599,11 +9134,6 @@ yargs-parser@^20.2.2:
   resolved "https://registry.npmjs.org/yargs-parser/-/yargs-parser-20.2.9.tgz"
   integrity sha512-y11nGElTIV+CT3Zv9t7VKl+Q3hTQoT9a1Qzezhhl6Rp21gJ/IVTW7Z3y9EWXhuUBC2Shnf+DX0antecpAwSP8w==
 
-yargs-parser@^21.1.1:
-  version "21.1.1"
-  resolved "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz"
-  integrity sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==
-
 yargs@^16.1.0:
   version "16.2.0"
   resolved "https://registry.npmjs.org/yargs/-/yargs-16.2.0.tgz"
@@ -10617,19 +9147,6 @@ yargs@^16.1.0:
     y18n "^5.0.5"
     yargs-parser "^20.2.2"
 
-yargs@^17.3.1:
-  version "17.7.2"
-  resolved "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz"
-  integrity sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==
-  dependencies:
-    cliui "^8.0.1"
-    escalade "^3.1.1"
-    get-caller-file "^2.0.5"
-    require-directory "^2.1.1"
-    string-width "^4.2.3"
-    y18n "^5.0.5"
-    yargs-parser "^21.1.1"
-
 yocto-queue@^0.1.0:
   version "0.1.0"
   resolved "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz"
@@ -10647,9 +9164,9 @@ zen-observable@0.8.15:
   resolved "https://registry.npmjs.org/zen-observable/-/zen-observable-0.8.15.tgz"
   integrity sha512-PQ2PC7R9rslx84ndNBZB/Dkv8V8fZEpk83RLgXtYd0fwUgEjseMn1Dgajh2x6S8QbZAFa9p2qVCEuYZNgve0dQ==
 
-zustand@^4.3.8, zustand@^4.4.6:
-  version "4.4.6"
-  resolved "https://registry.yarnpkg.com/zustand/-/zustand-4.4.6.tgz#03c78e3e2686c47095c93714c0c600b72a6512bd"
-  integrity sha512-Rb16eW55gqL4W2XZpJh0fnrATxYEG3Apl2gfHTyDSE965x/zxslTikpNch0JgNjJA9zK6gEFW8Fl6d1rTZaqgg==
+zustand@^4.3.8, zustand@^4.4.7:
+  version "4.4.7"
+  resolved "https://registry.yarnpkg.com/zustand/-/zustand-4.4.7.tgz#355406be6b11ab335f59a66d2cf9815e8f24038c"
+  integrity sha512-QFJWJMdlETcI69paJwhSMJz7PPWjVP8Sjhclxmxmxv/RYI7ZOvR5BHX+ktH0we9gTWQMxcne8q1OY8xxz604gw==
   dependencies:
     use-sync-external-store "1.2.0"