fix: fix useSanitizedLocation hook

The hook broke when it was moved from namada-interface to
packages/hooks. There were two versions of react-router-dom present,
and the interface and the package were being built with different
versions, which caused the Location context objects to not be equal,
ultimately causing useLocation to fail.

This commit aligns the version of react-router-dom in the extension
with the version in the interface, which ensures only one copy is
installed by `yarn install`.

apps/extension/package.json

@@ -39,7 +39,7 @@
     "framer-motion": "6.2.4",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "react-router-dom": "6",
+    "react-router-dom": "^6.0.0",
     "styled-components": "^5.3.5",
     "typescript": "^4.8.2",
     "uuid": "^9.0.0",

apps/namada-interface/src/App/Staking/Staking.tsx

@@ -18,7 +18,7 @@ import {
 import { NewBondingPosition } from "./NewBondingPosition";
 import { UnbondPosition } from "./UnbondPosition";
 import { Account } from "slices/accounts";
-import { useLocation } from "react-router-dom";
+import { useSanitizedLocation } from "@anoma/hooks";
 
 const initialTitle = "Staking";
 
@@ -96,7 +96,7 @@ export enum ModalOnRequestCloseType {
 export const Staking = (props: Props): JSX.Element => {
   const [breadcrumb, setBreadcrumb] = useState([initialTitle]);
   const [modalState, setModalState] = useState(ModalState.None);
-  const location = useLocation();
+  const location = useSanitizedLocation();
   const navigate = useNavigate();
 
   const {

apps/namada-interface/src/App/StakingAndGovernance/StakingAndGovernance.tsx

@@ -12,6 +12,7 @@ import {
   StakingAndGovernanceSubRoute,
   locationToStakingAndGovernanceSubRoute,
 } from "App/types";
+import { useSanitizedLocation } from "@anoma/hooks";
 
 import {
   fetchValidators,
@@ -22,15 +23,14 @@ import {
 } from "slices/StakingAndGovernance";
 import { SettingsState } from "slices/settings";
 import { AccountsState } from "slices/accounts";
-import { useLocation } from "react-router-dom";
 
 export type { ChangeInStakingPosition };
 // This is just rendering the actual Staking/Governance/PGF screens
 // mostly the purpose of this is to define the default behavior when
 // the user clicks the top level Staking & Governance menu
 //
 export const StakingAndGovernance = (): JSX.Element => {
-  const location = useLocation();
+  const location = useSanitizedLocation();
   const navigate = useNavigate();
   const dispatch = useAppDispatch();
   const stakingAndGovernance = useAppSelector(

apps/namada-interface/src/App/TopNavigation/topNavigation.tsx

@@ -1,7 +1,6 @@
 import React, { useState, useContext } from "react";
 import { ThemeContext } from "styled-components";
 import {
-  useLocation,
   useNavigate,
   NavigateFunction,
   Location,
@@ -18,6 +17,7 @@ import {
   Toggle,
   Select,
 } from "@anoma/components";
+import { useSanitizedLocation } from "@anoma/hooks";
 
 import { useAppDispatch, useAppSelector } from "store";
 import { AppStore } from "store/store";
@@ -214,7 +214,7 @@ function TopNavigation(props: TopNavigationProps): JSX.Element {
   const navigate = useNavigate();
   const themeContext = useContext(ThemeContext);
   const [showMenu, setShowMenu] = useState(false);
-  const location = useLocation();
+  const location = useSanitizedLocation();
   const topLevelRoute = locationToTopLevelRoute(location);
   const stakingAndGovernanceSubRoute =
     locationToStakingAndGovernanceSubRoute(location);

yarn.lock

@@ -9692,7 +9692,7 @@ hey-listen@^1.0.8:
   resolved "https://registry.yarnpkg.com/hey-listen/-/hey-listen-1.0.8.tgz#8e59561ff724908de1aa924ed6ecc84a56a9aa68"
   integrity sha512-COpmrF2NOg4TBWUJ5UVyaCU2A88wEMkUPK4hNqyCkqHbxT92BbvfjoSozkAIIm6XhicGlJHhFdullInrdhwU8Q==
 
-history@^5.2.0, history@^5.3.0:
+history@^5.3.0:
   version "5.3.0"
   resolved "https://registry.yarnpkg.com/history/-/history-5.3.0.tgz#1548abaa245ba47992f063a0783db91ef201c73b"
   integrity sha512-ZqaKwjjrAYUYfLG+htGaIIZ4nioX2L70ZUMIFysS3xvBsSG4x/n1V6TXV3N8ZYNuFGlDirFg32T7B6WOUPDYcQ==
@@ -14816,14 +14816,6 @@ react-refresh@^0.11.0:
   resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.11.0.tgz#77198b944733f0f1f1a90e791de4541f9f074046"
   integrity sha512-F27qZr8uUqwhWZboondsPx8tnC3Ct3SxZA3V5WyEvujRyyNv0VYPhoBg1gZ8/MV5tubQp76Trw8lTv9hzRBa+A==
 
-react-router-dom@6:
-  version "6.2.2"
-  resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-6.2.2.tgz#f1a2c88365593c76b9612ae80154a13fcb72e442"
-  integrity sha512-AtYEsAST7bDD4dLSQHDnk/qxWLJdad5t1HFa1qJyUrCeGgEuCSw0VB/27ARbF9Fi/W5598ujvJOm3ujUCVzuYQ==
-  dependencies:
-    history "^5.2.0"
-    react-router "6.2.2"
-
 react-router-dom@^6.0.0:
   version "6.8.2"
   resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-6.8.2.tgz#a6654a3400be9aafd504d7125573568921b78b57"
@@ -14832,13 +14824,6 @@ react-router-dom@^6.0.0:
     "@remix-run/router" "1.3.3"
     react-router "6.8.2"
 
-react-router@6.2.2:
-  version "6.2.2"
-  resolved "https://registry.yarnpkg.com/react-router/-/react-router-6.2.2.tgz#495e683a0c04461eeb3d705fe445d6cf42f0c249"
-  integrity sha512-/MbxyLzd7Q7amp4gDOGaYvXwhEojkJD5BtExkuKmj39VEE0m3l/zipf6h2WIB2jyAO0lI6NGETh4RDcktRm4AQ==
-  dependencies:
-    history "^5.2.0"
-
 react-router@6.8.2:
   version "6.8.2"
   resolved "https://registry.yarnpkg.com/react-router/-/react-router-6.8.2.tgz#98f83582a73f316a3287118b440f0cee30ed6f33"