fix issues

packages/ui/.papi/descriptors/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.1.0-autogenerated.8448668932732983882",
+  "version": "0.1.0-autogenerated.16048031132384038004",
   "name": "@polkadot-api/descriptors",
   "files": [
     "dist"

packages/ui/package.json

@@ -18,7 +18,6 @@
     "@reactive-dot/core": "^0.26.2",
     "@reactive-dot/react": "^0.26.2",
     "@tanstack/react-query": "^5.61.0",
-    "@types/react-router-dom": "^5.3.3",
     "@walletconnect/web3wallet": "^1.16.1",
     "dayjs": "^1.11.13",
     "dot-connect": "^0.13.2",
@@ -30,7 +29,7 @@
     "react": "18.3.1",
     "react-dom": "18.3.1",
     "react-icons": "^5.3.0",
-    "react-router-dom": "^6.28.0",
+    "react-router": "^7.0.2",
     "reactflow": "^11.11.4",
     "typescript": "5.7.2",
     "vite": "^5.4.11"

packages/ui/src/components/ConnectCreateOrWatch.tsx

@@ -1,6 +1,6 @@
 import { styled } from '@mui/material'
 // import { useAccounts } from '../contexts/AccountsContext'
-import { createSearchParams, useNavigate, useSearchParams } from 'react-router-dom'
+import { createSearchParams, useNavigate, useSearchParams } from 'react-router'
 import { Button } from './library'
 import { WATCH_ACCOUNT_ANCHOR } from '../pages/Settings/Settings'
 import { useWatchedAddresses } from '../contexts/WatchedAddressesContext'

packages/ui/src/components/Drawer/DrawerMenu.tsx

@@ -9,7 +9,7 @@ import NetworkSelection from '../select/NetworkSelection'
 import MultiProxySelection from '../select/MultiProxySelection'
 import { ROUTES } from '../../pages/routes'
 import { Button, NavLink } from '../library'
-import { createSearchParams, useSearchParams } from 'react-router-dom'
+import { createSearchParams, useSearchParams } from 'react-router'
 
 interface DrawerMenuProps {
   handleDrawerClose: () => void

packages/ui/src/components/ErrorFallback/ErrorFallback.tsx

@@ -1,4 +1,4 @@
-import { useNavigate, useRouteError } from 'react-router-dom'
+import { useNavigate, useRouteError } from 'react-router'
 import { Alert, AlertTitle, Grid } from '@mui/material'
 import { theme } from '../../styles/theme'
 import { styled, ThemeProvider as MuiThemeProvider } from '@mui/material/styles'

packages/ui/src/components/Header/Header.tsx

@@ -11,7 +11,7 @@ import { isEmptyArray } from '../../utils/arrayUtils'
 import NetworkSelection from '../select/NetworkSelection'
 import multixLogo from '../../logos/multix-logo.svg'
 import useWalletConnectEventsManager from '../../hooks/useWalletConnectEventsManager'
-import { Link, createSearchParams, useSearchParams } from 'react-router-dom'
+import { Link, createSearchParams, useSearchParams } from 'react-router'
 import { useSwitchAddress } from '../../hooks/useSwitchAddress'
 import { ConnectionDialog } from 'dot-connect/react.js'
 

packages/ui/src/components/layout/Main.tsx

@@ -2,7 +2,7 @@ import React from 'react'
 import { Box } from '@mui/material'
 import Header from '../Header/Header'
 import Container from '@mui/material/Container'
-import { Outlet } from 'react-router-dom'
+import { Outlet } from 'react-router'
 import MobileMenu from '../Drawer/Drawer'
 import { styled } from '@mui/material/styles'
 

packages/ui/src/components/library/Link.tsx

@@ -1,5 +1,5 @@
 import { css, styled } from '@mui/material/styles'
-import { Link as RouterLinkDom, LinkProps, NavLink as RouterNavLink } from 'react-router-dom'
+import { Link as RouterLinkDom, LinkProps, NavLink as RouterNavLink } from 'react-router'
 
 const BaseLinkStyles = css`
   color: #3a3b3b;

packages/ui/src/contexts/MultiProxyContext.tsx

@@ -11,7 +11,7 @@ import { useWatchedAddresses } from './WatchedAddressesContext'
 import { useAccountId } from '../hooks/useAccountId'
 import { useQueryPure } from '../hooks/useQueryPure'
 import { getMultiProxyAddress } from '../utils/getMultiProxyAddress'
-import { useSearchParams } from 'react-router-dom'
+import { useSearchParams } from 'react-router'
 
 interface MultisigContextProps {
   children: React.ReactNode | React.ReactNode[]

packages/ui/src/contexts/NetworkContext.tsx

@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect, useState } from 'react'
-import { useSearchParams } from 'react-router-dom'
+import { useSearchParams } from 'react-router'
 import { NetworkInfo, SupportedNetworks, networkList } from '../constants'
 
 const LOCALSTORAGE_SELECTED_NETWORK = 'multix.selectedNetwork'

packages/ui/src/hooks/useDisplayError.tsx

@@ -9,7 +9,7 @@ import { Button, Link } from '../components/library'
 import { Center } from '../components/layout/Center'
 import { useWatchedAddresses } from '../contexts/WatchedAddressesContext'
 import { useMultiProxy } from '../contexts/MultiProxyContext'
-import { useSearchParams } from 'react-router-dom'
+import { useSearchParams } from 'react-router'
 import { useNetwork } from '../contexts/NetworkContext'
 
 export const useDisplayError = () => {

packages/ui/src/hooks/useSwitchAddress.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useMemo } from 'react'
-import { useSearchParams } from 'react-router-dom'
+import { useSearchParams } from 'react-router'
 import { useMultiProxy } from '../contexts/MultiProxyContext'
 
 export const useSwitchAddress = () => {

packages/ui/src/index.tsx

@@ -3,7 +3,7 @@ import '@fontsource/jost/400.css'
 import '@fontsource/jost/500.css'
 import '@fontsource/jost/700.css'
 import { createRoot } from 'react-dom/client'
-import { RouterProvider } from 'react-router-dom'
+import { RouterProvider } from 'react-router/dom'
 import { router } from './pages/routes'
 import { StrictMode } from 'react'
 
@@ -12,11 +12,6 @@ const root = createRoot(container!)
 
 root.render(
   <StrictMode>
-    <RouterProvider
-      router={router}
-      future={{
-        v7_startTransition: true
-      }}
-    />
+    <RouterProvider router={router} />
   </StrictMode>
 )

packages/ui/src/pages/Creation/index.tsx

@@ -9,7 +9,7 @@ import ThresholdSelection from './ThresholdSelection'
 import NameSelection from './NameSelection'
 import Summary from './Summary'
 import { useSigningCallback } from '../../hooks/useSigningCallback'
-import { createSearchParams, useNavigate, useSearchParams } from 'react-router-dom'
+import { createSearchParams, useNavigate, useSearchParams } from 'react-router'
 import { useAccountNames } from '../../contexts/AccountNamesContext'
 import { useCheckBalance } from '../../hooks/useCheckBalance'
 import { useMultisigProposalNeededFunds } from '../../hooks/useMultisigProposalNeededFunds'

packages/ui/src/pages/Home/HeaderView.tsx

@@ -5,7 +5,7 @@ import { styled } from '@mui/material/styles'
 import { useMultiProxy } from '../../contexts/MultiProxyContext'
 import { Balance, ButtonWithIcon } from '../../components/library'
 import { HiOutlineArrowLongRight } from 'react-icons/hi2'
-import { createSearchParams, useNavigate, useSearchParams } from 'react-router-dom'
+import { createSearchParams, useNavigate, useSearchParams } from 'react-router'
 import { useMemo } from 'react'
 
 const HeaderView = () => {

packages/ui/src/pages/Home/Home.tsx

@@ -1,7 +1,7 @@
 import { PropsWithChildren, useCallback, useEffect, useState } from 'react'
 import { Box, Grid } from '@mui/material'
 import { useMultiProxy } from '../../contexts/MultiProxyContext'
-import { useSearchParams } from 'react-router-dom'
+import { useSearchParams } from 'react-router'
 import SuccessCreation from '../../components/SuccessCreation'
 import NewMulisigAlert from '../../components/NewMulisigAlert'
 import { styled } from '@mui/material/styles'

packages/ui/src/pages/Settings/Settings.tsx

@@ -6,7 +6,7 @@ import { WalletConnectActiveSessions } from '../../components/WalletConnect/Wall
 import { HiOutlineChevronDown as ExpandMoreIcon, HiOutlineEye } from 'react-icons/hi2'
 import { theme } from '../../styles/theme'
 import { useCallback, useEffect, useState } from 'react'
-import { useLocation } from 'react-router-dom'
+import { useLocation } from 'react-router'
 import WalletConnectSVG from '../../logos/walletConnectSVG.svg?react'
 
 const ACCORDION_WATCHED_ACCOUNTS = 'panel-watched-accounts'

packages/ui/src/pages/routes.tsx

@@ -1,4 +1,4 @@
-import { createBrowserRouter } from 'react-router-dom'
+import { createBrowserRouter } from 'react-router'
 import { About, Creation, Home, Overview, Settings } from './index'
 import React from 'react'
 import App from '../App'
@@ -44,22 +44,11 @@ export const ROUTES: Route[] = [
   }
 ]
 
-export const router = createBrowserRouter(
-  [
-    {
-      path: '/',
-      element: <App />,
-      errorElement: <ErrorFallback />,
-      children: ROUTES
-    }
-  ],
+export const router = createBrowserRouter([
   {
-    future: {
-      v7_relativeSplatPath: true,
-      v7_fetcherPersist: true,
-      v7_normalizeFormMethod: true,
-      v7_partialHydration: true,
-      v7_skipActionErrorRevalidation: true
-    }
+    path: '/',
+    element: <App />,
+    errorElement: <ErrorFallback />,
+    children: ROUTES
   }
-)
+])

yarn.lock

@@ -4167,13 +4167,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@remix-run/router@npm:1.21.0":
-  version: 1.21.0
-  resolution: "@remix-run/router@npm:1.21.0"
-  checksum: 570792211c083a1c7146613b79cbb8e0d1e14f34e974052e060e7f9dcad38c800d80fe0a18bf42811bc278ab12c0e8fd62cfce649e905046c4e55bd5a09eafdc
-  languageName: node
-  linkType: hard
-
 "@repeaterjs/repeater@npm:3.0.4":
   version: 3.0.4
   resolution: "@repeaterjs/repeater@npm:3.0.4"
@@ -4794,6 +4787,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/cookie@npm:^0.6.0":
+  version: 0.6.0
+  resolution: "@types/cookie@npm:0.6.0"
+  checksum: 5b326bd0188120fb32c0be086b141b1481fec9941b76ad537f9110e10d61ee2636beac145463319c71e4be67a17e85b81ca9e13ceb6e3bb63b93d16824d6c149
+  languageName: node
+  linkType: hard
+
 "@types/d3-array@npm:*":
   version: 3.2.1
   resolution: "@types/d3-array@npm:3.2.1"
@@ -5080,13 +5080,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/history@npm:^4.7.11":
-  version: 4.7.11
-  resolution: "@types/history@npm:4.7.11"
-  checksum: 3facf37c2493d1f92b2e93a22cac7ea70b06351c2ab9aaceaa3c56aa6099fb63516f6c4ec1616deb5c56b4093c026a043ea2d3373e6c0644d55710364d02c934
-  languageName: node
-  linkType: hard
-
 "@types/js-yaml@npm:^4.0.0":
   version: 4.0.9
   resolution: "@types/js-yaml@npm:4.0.9"
@@ -5133,27 +5126,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/react-router-dom@npm:^5.3.3":
-  version: 5.3.3
-  resolution: "@types/react-router-dom@npm:5.3.3"
-  dependencies:
-    "@types/history": ^4.7.11
-    "@types/react": "*"
-    "@types/react-router": "*"
-  checksum: a9231a16afb9ed5142678147eafec9d48582809295754fb60946e29fcd3757a4c7a3180fa94b45763e4c7f6e3f02379e2fcb8dd986db479dcab40eff5fc62a91
-  languageName: node
-  linkType: hard
-
-"@types/react-router@npm:*":
-  version: 5.1.20
-  resolution: "@types/react-router@npm:5.1.20"
-  dependencies:
-    "@types/history": ^4.7.11
-    "@types/react": "*"
-  checksum: 1f7eee61981d2f807fa01a34a0ef98ebc0774023832b6611a69c7f28fdff01de5a38cabf399f32e376bf8099dcb7afaf724775bea9d38870224492bea4cb5737
-  languageName: node
-  linkType: hard
-
 "@types/react-transition-group@npm:^4.4.11":
   version: 4.4.11
   resolution: "@types/react-transition-group@npm:4.4.11"
@@ -6848,6 +6820,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"cookie@npm:^1.0.1":
+  version: 1.0.2
+  resolution: "cookie@npm:1.0.2"
+  checksum: fd25fe79e8fbcfcaf6aa61cd081c55d144eeeba755206c058682257cb38c4bd6795c6620de3f064c740695bb65b7949ebb1db7a95e4636efb8357a335ad3f54b
+  languageName: node
+  linkType: hard
+
 "copy-to-clipboard@npm:^3.3.1":
   version: 3.3.3
   resolution: "copy-to-clipboard@npm:3.3.3"
@@ -10667,7 +10646,6 @@ __metadata:
     "@tanstack/react-query": ^5.61.0
     "@types/node": ^22.9.1
     "@types/react-dom": ^18.3.1
-    "@types/react-router-dom": ^5.3.3
     "@typescript-eslint/eslint-plugin": ^8.15.0
     "@typescript-eslint/parser": ^8.15.0
     "@vitejs/plugin-react": ^4.3.3
@@ -10690,7 +10668,7 @@ __metadata:
     react: 18.3.1
     react-dom: 18.3.1
     react-icons: ^5.3.0
-    react-router-dom: ^6.28.0
+    react-router: ^7.0.2
     reactflow: ^11.11.4
     ts-node: ^10.9.2
     typescript: 5.7.2
@@ -11791,27 +11769,21 @@ __metadata:
   languageName: node
   linkType: hard
 
-"react-router-dom@npm:^6.28.0":
-  version: 6.28.0
-  resolution: "react-router-dom@npm:6.28.0"
-  dependencies:
-    "@remix-run/router": 1.21.0
-    react-router: 6.28.0
-  peerDependencies:
-    react: ">=16.8"
-    react-dom: ">=16.8"
-  checksum: e2930cf83e8c843a932b008c7ce11059fd83390502a433f0e41f192e3cb80081a621d069eeda7af3cf4bf74d7f8029f0141cdce741bca3f0af82d4bbbc7f7f10
-  languageName: node
-  linkType: hard
-
-"react-router@npm:6.28.0":
-  version: 6.28.0
-  resolution: "react-router@npm:6.28.0"
+"react-router@npm:^7.0.2":
+  version: 7.0.2
+  resolution: "react-router@npm:7.0.2"
   dependencies:
-    "@remix-run/router": 1.21.0
+    "@types/cookie": ^0.6.0
+    cookie: ^1.0.1
+    set-cookie-parser: ^2.6.0
+    turbo-stream: 2.4.0
   peerDependencies:
-    react: ">=16.8"
-  checksum: b435510de78fd882bf6ca9800a73cd90cee418bd1d19efd91b8dcaebde36929bbb589e25d9f7eec24ceb84255e8d538bc1fe54e6ddb5c43c32798e2b720fa76d
+    react: ">=18"
+    react-dom: ">=18"
+  peerDependenciesMeta:
+    react-dom:
+      optional: true
+  checksum: f6c04939218a3d7f2b03b215c2299eab4dbb0dea4a16e0acfd8bf181ec69ff42d66abdba10a25cc3297c514f052a0d03bfb80431225eb763bb27e4e5b0b4a106
   languageName: node
   linkType: hard
 
@@ -12307,6 +12279,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"set-cookie-parser@npm:^2.6.0":
+  version: 2.7.1
+  resolution: "set-cookie-parser@npm:2.7.1"
+  checksum: 060c198c4c92547ac15988256f445eae523f57f2ceefeccf52d30d75dedf6bff22b9c26f756bd44e8e560d44ff4ab2130b178bd2e52ef5571bf7be3bd7632d9a
+  languageName: node
+  linkType: hard
+
 "set-function-length@npm:^1.2.1":
   version: 1.2.2
   resolution: "set-function-length@npm:1.2.2"
@@ -13261,6 +13240,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"turbo-stream@npm:2.4.0":
+  version: 2.4.0
+  resolution: "turbo-stream@npm:2.4.0"
+  checksum: e68b2569f1f16e6e9633d090c6024b2ae9f0e97bfeacb572451ca3732e120ebbb546f3bc4afc717c46cb57b5aea6104e04ef497f9912eef6a7641e809518e98a
+  languageName: node
+  linkType: hard
+
 "tweetnacl@npm:^0.14.3, tweetnacl@npm:~0.14.0":
   version: 0.14.5
   resolution: "tweetnacl@npm:0.14.5"