change type to NavigateFunction

app/src/molecules/CardButton/__tests__/CardButton.test.tsx

@@ -7,12 +7,12 @@ import { COLORS } from '@opentrons/components'
 import { renderWithProviders } from '../../../__testing-utils__'
 import { i18n } from '../../../i18n'
 import { CardButton } from '..'
-import type * as ReactRouterDom from 'react-router-dom'
+import type { NavigateFunction } from 'react-router-dom'
 
 const mockNavigate = vi.fn()
 
 vi.mock('react-router-dom', async importOriginal => {
-  const reactRouterDom = await importOriginal<typeof ReactRouterDom>()
+  const reactRouterDom = await importOriginal<NavigateFunction>()
   return {
     ...reactRouterDom,
     useNavigate: () => mockNavigate,

app/src/organisms/Devices/ProtocolRun/ProtocolRunHeader.tsx

@@ -228,7 +228,7 @@ export function ProtocolRunHeader({
 
   React.useEffect(() => {
     if (protocolData != null && !isRobotViewable) {
-      navigate(`/devices`)
+      navigate('/devices')
     }
   }, [protocolData, isRobotViewable, navigate])
 

app/src/organisms/Devices/ProtocolRun/__tests__/ProtocolRunHeader.test.tsx

@@ -98,7 +98,7 @@ import {
 } from '../../../ErrorRecoveryFlows'
 
 import type { UseQueryResult } from 'react-query'
-import type * as ReactRouterDom from 'react-router-dom'
+import type { NavigateFunction } from 'react-router-dom'
 import type { Mock } from 'vitest'
 import type * as OpentronsSharedData from '@opentrons/shared-data'
 import type * as OpentronsComponents from '@opentrons/components'
@@ -107,7 +107,7 @@ import type * as OpentronsApiClient from '@opentrons/api-client'
 const mockNavigate = vi.fn()
 
 vi.mock('react-router-dom', async importOriginal => {
-  const reactRouterDom = await importOriginal<typeof ReactRouterDom>()
+  const reactRouterDom = await importOriginal<NavigateFunction>()
   return {
     ...reactRouterDom,
     useNavigate: () => mockNavigate,

app/src/organisms/Devices/RobotSettings/AdvancedTab/AdvancedTabSlideouts/RenameRobotSlideout.tsx

@@ -139,7 +139,7 @@ export function RenameRobotSlideout({
       // data.name != null && navigate(`/devices/${data.name}/robot-settings`)
       // TODO 6/9/2022 kj this is a temporary fix to avoid the issue
       // https://github.com/Opentrons/opentrons/issues/10709
-      data.name != null && navigate(`/devices`)
+      data.name != null && navigate('/devices')
       dispatch(removeRobot(previousRobotName))
     },
     onError: (error: Error) => {

app/src/organisms/ModuleCard/__tests__/ModuleCard.test.tsx

@@ -37,7 +37,7 @@ import { FirmwareUpdateFailedModal } from '../FirmwareUpdateFailedModal'
 import { ErrorInfo } from '../ErrorInfo'
 import { ModuleCard } from '..'
 
-import type * as ReactRouterDom from 'react-router-dom'
+import type { NavigateFunction } from 'react-router-dom'
 import type {
   HeaterShakerModule,
   MagneticModule,
@@ -59,7 +59,7 @@ vi.mock('../../../organisms/ToasterOven')
 vi.mock('../../../organisms/Devices/hooks')
 vi.mock('../../../resources/devices/hooks/useIsEstopNotDisengaged')
 vi.mock('react-router-dom', async importOriginal => {
-  const actual = await importOriginal<typeof ReactRouterDom>()
+  const actual = await importOriginal<NavigateFunction>()
   return {
     ...actual,
     useNavigate: () => vi.fn(),

app/src/organisms/OnDeviceDisplay/RunningProtocol/ConfirmCancelRunModal.tsx

@@ -77,7 +77,7 @@ export function ConfirmCancelRunModal({
         if (protocolId != null) {
           navigate(`/protocols/${protocolId}`)
         } else {
-          navigate(`/protocols`)
+          navigate('/protocols')
         }
       }
     }

app/src/organisms/ProtocolSetupModulesAndDeck/index.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react'
 import { createPortal } from 'react-dom'
 import { useTranslation } from 'react-i18next'
-
+import { useNavigate } from 'react-router-dom'
 import {
   COLORS,
   DIRECTION_COLUMN,
@@ -14,6 +14,7 @@ import {
   FLEX_ROBOT_TYPE,
   getDeckDefFromRobotType,
 } from '@opentrons/shared-data'
+import { RUN_STATUS_STOPPED } from '@opentrons/api-client'
 
 import { getTopPortalEl } from '../../App/portal'
 import { FloatingActionButton } from '../../atoms/buttons'
@@ -22,6 +23,7 @@ import { ChildNavigation } from '../../organisms/ChildNavigation'
 import { useAttachedModules } from '../../organisms/Devices/hooks'
 import { getProtocolModulesInfo } from '../../organisms/Devices/ProtocolRun/utils/getProtocolModulesInfo'
 import { useMostRecentCompletedAnalysis } from '../../organisms/LabwarePositionCheck/useMostRecentCompletedAnalysis'
+import { useRunStatus } from '../RunTimeControl/hooks'
 import {
   getAttachedProtocolModuleMatches,
   getUnmatchedModulesForProtocol,
@@ -34,9 +36,6 @@ import { useNotifyDeckConfigurationQuery } from '../../resources/deck_configurat
 
 import type { CutoutId, CutoutFixtureId } from '@opentrons/shared-data'
 import type { SetupScreens } from '../../pages/ProtocolSetup'
-import { useRunStatus } from '../RunTimeControl/hooks'
-import { RUN_STATUS_STOPPED } from '@opentrons/api-client'
-import { useNavigate } from 'react-router-dom'
 
 const ATTACHED_MODULE_POLL_MS = 5000
 const DECK_CONFIG_POLL_MS = 5000

app/src/organisms/ProtocolSetupParameters/__tests__/AnalysisFailedModal.test.tsx

@@ -5,14 +5,14 @@ import { fireEvent, screen } from '@testing-library/react'
 import { renderWithProviders } from '../../../__testing-utils__'
 import { i18n } from '../../../i18n'
 import { AnalysisFailedModal } from '../AnalysisFailedModal'
-import type * as ReactRouterDom from 'react-router-dom'
+import type { NavigateFunction } from 'react-router-dom'
 
 const mockNavigate = vi.fn()
 const PROTOCOL_ID = 'mockId'
 const mockSetShowAnalysisFailedModal = vi.fn()
 
 vi.mock('react-router-dom', async importOriginal => {
-  const reactRouterDom = await importOriginal<typeof ReactRouterDom>()
+  const reactRouterDom = await importOriginal<NavigateFunction>()
   return {
     ...reactRouterDom,
     useNavigate: () => mockNavigate,

app/src/organisms/ProtocolSetupParameters/__tests__/ProtocolSetupParameters.test.tsx

@@ -20,7 +20,7 @@ import { useToaster } from '../../ToasterOven'
 import { useFeatureFlag } from '../../../redux/config'
 import { ProtocolSetupParameters } from '..'
 
-import type * as ReactRouterDom from 'react-router-dom'
+import type { NavigateFunction } from 'react-router-dom'
 import type { HostConfig } from '@opentrons/api-client'
 import type { CompletedProtocolAnalysis } from '@opentrons/shared-data'
 
@@ -34,7 +34,7 @@ vi.mock('../../ToasterOven')
 vi.mock('@opentrons/react-api-client')
 vi.mock('../../LabwarePositionCheck/useMostRecentCompletedAnalysis')
 vi.mock('react-router-dom', async importOriginal => {
-  const reactRouterDom = await importOriginal<typeof ReactRouterDom>()
+  const reactRouterDom = await importOriginal<NavigateFunction>()
   return {
     ...reactRouterDom,
     useNavigate: () => mockNavigate,

app/src/organisms/QuickTransferFlow/__tests__/SummaryAndSettings.test.tsx

@@ -12,12 +12,12 @@ import { i18n } from '../../../i18n'
 import { SummaryAndSettings } from '../SummaryAndSettings'
 import { NameQuickTransfer } from '../NameQuickTransfer'
 import { Overview } from '../Overview'
-import type * as ReactRouterDom from 'react-router-dom'
+import type { NavigateFunction } from 'react-router-dom'
 
 const mockNavigate = vi.fn()
 
 vi.mock('react-router-dom', async importOriginal => {
-  const reactRouterDom = await importOriginal<typeof ReactRouterDom>()
+  const reactRouterDom = await importOriginal<NavigateFunction>()
   return {
     ...reactRouterDom,
     useNavigate: () => mockNavigate,

app/src/pages/ConnectViaEthernet/__tests__/DisplayConnectionStatus.test.tsx

@@ -6,12 +6,12 @@ import { renderWithProviders } from '../../../__testing-utils__'
 import { i18n } from '../../../i18n'
 import { DisplayConnectionStatus } from '../../../pages/ConnectViaEthernet/DisplayConnectionStatus'
 
-import type * as ReactRouterDom from 'react-router-dom'
+import type { NavigateFunction } from 'react-router-dom'
 
 const mockFunc = vi.fn()
 const mockNavigate = vi.fn()
 vi.mock('react-router-dom', async importOriginal => {
-  const actual = await importOriginal<typeof ReactRouterDom>()
+  const actual = await importOriginal<NavigateFunction>()
   return {
     ...actual,
     useNavigate: () => mockNavigate,

app/src/pages/ConnectViaEthernet/__tests__/TitleHeader.test.tsx

@@ -5,11 +5,11 @@ import { fireEvent, screen } from '@testing-library/react'
 import { renderWithProviders } from '../../../__testing-utils__'
 import { TitleHeader } from '../../../pages/ConnectViaEthernet/TitleHeader'
 
-import type * as ReactRouterDom from 'react-router-dom'
+import type { NavigateFunction } from 'react-router-dom'
 
 const mockNavigate = vi.fn()
 vi.mock('react-router-dom', async importOriginal => {
-  const actual = await importOriginal<typeof ReactRouterDom>()
+  const actual = await importOriginal<NavigateFunction>()
   return {
     ...actual,
     useNavigate: () => mockNavigate,

app/src/pages/ConnectViaUSB/_tests__/ConnectedViaUSB.test.tsx

@@ -11,12 +11,12 @@ import { ConnectViaUSB } from '../../../pages/ConnectViaUSB'
 
 import type { UseQueryResult } from 'react-query'
 import type { ActiveConnections } from '@opentrons/api-client'
-import type * as ReactRouterDom from 'react-router-dom'
+import type { NavigateFunction } from 'react-router-dom'
 
 const mockNavigate = vi.fn()
 
 vi.mock('react-router-dom', async importOriginal => {
-  const actual = await importOriginal<typeof ReactRouterDom>()
+  const actual = await importOriginal<NavigateFunction>()
   return {
     ...actual,
     useNavigate: () => mockNavigate,

app/src/pages/DeckConfiguration/__tests__/DeckConfiguration.test.tsx

@@ -20,12 +20,12 @@ import {
 import type { UseQueryResult } from 'react-query'
 import type { DeckConfiguration } from '@opentrons/shared-data'
 import type * as Components from '@opentrons/components'
-import type * as ReactRouterDom from 'react-router-dom'
+import type { NavigateFunction } from 'react-router-dom'
 
 const mockUpdateDeckConfiguration = vi.fn()
 const mockGoBack = vi.fn()
 vi.mock('react-router-dom', async importOriginal => {
-  const actual = await importOriginal<typeof ReactRouterDom>()
+  const actual = await importOriginal<NavigateFunction>()
   return {
     ...actual,
     useNavigate: () => mockGoBack,

app/src/pages/EmergencyStop/__tests__/EmergencyStop.test.tsx

@@ -7,7 +7,7 @@ import { renderWithProviders } from '../../../__testing-utils__'
 
 import { i18n } from '../../../i18n'
 import { EmergencyStop } from '..'
-import type * as ReactRouterDom from 'react-router-dom'
+import type { NavigateFunction } from 'react-router-dom'
 
 vi.mock('@opentrons/react-api-client')
 
@@ -21,7 +21,7 @@ const mockDisconnectedEstop = {
 } as any
 const mockNavigate = vi.fn()
 vi.mock('react-router-dom', async importOriginal => {
-  const actual = await importOriginal<typeof ReactRouterDom>()
+  const actual = await importOriginal<NavigateFunction>()
   return {
     ...actual,
     useNavigate: () => mockNavigate,

app/src/pages/InstrumentsDashboard/__tests__/InstrumentsDashboard.test.tsx

@@ -12,7 +12,6 @@ import { InstrumentsDashboard } from '..'
 import { formatTimeWithUtcLabel } from '../../../resources/runs'
 import { InstrumentDetail } from '../../../pages/InstrumentDetail'
 import type * as ReactApiClient from '@opentrons/react-api-client'
-import type * as ReactRouterDom from 'react-router-dom'
 
 const mockGripperData = {
   instrumentModel: 'gripperV1',

app/src/pages/NameRobot/__tests__/NameRobot.test.tsx

@@ -19,7 +19,7 @@ import {
 } from '../../../redux/discovery/__fixtures__'
 
 import { NameRobot } from '..'
-import type * as ReactRouterDom from 'react-router-dom'
+import type { NavigateFunction } from 'react-router-dom'
 
 vi.mock('../../../redux/discovery/selectors')
 vi.mock('../../../redux/config')
@@ -29,7 +29,7 @@ vi.mock('../../../organisms/RobotSettingsDashboard/NetworkSettings/hooks')
 const mockNavigate = vi.fn()
 
 vi.mock('react-router-dom', async importOriginal => {
-  const actual = await importOriginal<typeof ReactRouterDom>()
+  const actual = await importOriginal<NavigateFunction>()
   return {
     ...actual,
     useNavigate: () => mockNavigate,

app/src/pages/NetworkSetupMenu/__tests__/NetworkSetupMenu.test.tsx

@@ -6,12 +6,12 @@ import { renderWithProviders } from '../../../__testing-utils__'
 
 import { i18n } from '../../../i18n'
 import { NetworkSetupMenu } from '..'
-import type * as ReactRouterDom from 'react-router-dom'
+import type { NavigateFunction } from 'react-router-dom'
 
 const mockNavigate = vi.fn()
 
 vi.mock('react-router-dom', async importOriginal => {
-  const actual = await importOriginal<typeof ReactRouterDom>()
+  const actual = await importOriginal<NavigateFunction>()
   return {
     ...actual,
     useNavigate: () => mockNavigate,

app/src/pages/ProtocolDashboard/__tests__/PinnedProtocol.test.tsx

@@ -12,12 +12,12 @@ import { PinnedProtocol } from '../PinnedProtocol'
 
 import type { Chip } from '@opentrons/components'
 import type { ProtocolResource } from '@opentrons/shared-data'
-import type * as ReactRouterDom from 'react-router-dom'
+import type { NavigateFunction } from 'react-router-dom'
 
 const mockNavigate = vi.fn()
 
 vi.mock('react-router-dom', async importOriginal => {
-  const actual = await importOriginal<typeof ReactRouterDom>()
+  const actual = await importOriginal<NavigateFunction>()
   return {
     ...actual,
     useNavigate: () => mockNavigate,

app/src/pages/ProtocolDashboard/__tests__/ProtocolCard.test.tsx

@@ -14,7 +14,7 @@ import { i18n } from '../../../i18n'
 import { useFeatureFlag } from '../../../redux/config'
 import { ProtocolCard } from '../ProtocolCard'
 
-import type * as ReactRouterDom from 'react-router-dom'
+import type { NavigateFunction } from 'react-router-dom'
 import type { UseQueryResult } from 'react-query'
 import type {
   CompletedProtocolAnalysis,
@@ -24,7 +24,7 @@ import type {
 const mockNavigate = vi.fn()
 
 vi.mock('react-router-dom', async importOriginal => {
-  const actual = await importOriginal<typeof ReactRouterDom>()
+  const actual = await importOriginal<NavigateFunction>()
   return {
     ...actual,
     useNavigate: () => mockNavigate,

app/src/pages/ProtocolSetup/__tests__/ProtocolSetup.test.tsx

@@ -60,7 +60,7 @@ import { useNotifyDeckConfigurationQuery } from '../../../resources/deck_configu
 
 import type { UseQueryResult } from 'react-query'
 import type * as SharedData from '@opentrons/shared-data'
-import type * as ReactRouterDom from 'react-router-dom'
+import type { NavigateFunction } from 'react-router-dom'
 // Mock IntersectionObserver
 class IntersectionObserver {
   observe = vi.fn()
@@ -85,7 +85,7 @@ vi.mock('@opentrons/shared-data', async importOriginal => {
 })
 
 vi.mock('react-router-dom', async importOriginal => {
-  const reactRouterDom = await importOriginal<typeof ReactRouterDom>()
+  const reactRouterDom = await importOriginal<NavigateFunction>()
   return {
     ...reactRouterDom,
     useNavigate: () => mockNavigate,

app/src/pages/QuickTransferDashboard/__tests__/DeleteTransferConfirmationModal.test.tsx

@@ -11,7 +11,7 @@ import { i18n } from '../../../i18n'
 import { useToaster } from '../../../organisms/ToasterOven'
 import { DeleteTransferConfirmationModal } from '../DeleteTransferConfirmationModal'
 
-import type * as ReactRouterDom from 'react-router-dom'
+import type { NavigateFunction } from 'react-router-dom'
 import type { HostConfig } from '@opentrons/api-client'
 
 const mockNavigate = vi.fn()
@@ -20,7 +20,7 @@ vi.mock('@opentrons/api-client')
 vi.mock('@opentrons/react-api-client')
 vi.mock('../../../organisms/ToasterOven')
 vi.mock('react-router-dom', async importOriginal => {
-  const reactRouterDom = await importOriginal<typeof ReactRouterDom>()
+  const reactRouterDom = await importOriginal<NavigateFunction>()
   return {
     ...reactRouterDom,
     useNavigate: () => mockNavigate,

app/src/pages/QuickTransferDashboard/__tests__/PinnedTransfer.test.tsx

@@ -8,12 +8,12 @@ import { i18n } from '../../../i18n'
 import { PinnedTransfer } from '../PinnedTransfer'
 
 import type { ProtocolResource } from '@opentrons/shared-data'
-import type * as ReactRouterDom from 'react-router-dom'
+import type { NavigateFunction } from 'react-router-dom'
 
 const mockNavigate = vi.fn()
 
 vi.mock('react-router-dom', async importOriginal => {
-  const actual = await importOriginal<typeof ReactRouterDom>()
+  const actual = await importOriginal<NavigateFunction>()
   return {
     ...actual,
     useNavigate: () => mockNavigate,

app/src/pages/QuickTransferDashboard/__tests__/QuickTransferCard.test.tsx

@@ -11,7 +11,7 @@ import { renderWithProviders } from '../../../__testing-utils__'
 import { i18n } from '../../../i18n'
 import { QuickTransferCard } from '../QuickTransferCard'
 import { LongPressModal } from '../LongPressModal'
-import type * as ReactRouterDom from 'react-router-dom'
+import type { NavigateFunction } from 'react-router-dom'
 import type { UseQueryResult } from 'react-query'
 import type {
   CompletedProtocolAnalysis,
@@ -21,7 +21,7 @@ import type {
 const mockNavigate = vi.fn()
 
 vi.mock('react-router-dom', async importOriginal => {
-  const actual = await importOriginal<typeof ReactRouterDom>()
+  const actual = await importOriginal<NavigateFunction>()
   return {
     ...actual,
     useNavigate: () => mockNavigate,

app/src/pages/RobotDashboard/__tests__/RobotDashboard.test.tsx

@@ -19,12 +19,12 @@ import { RobotDashboard } from '..'
 import { useNotifyAllRunsQuery } from '../../../resources/runs'
 
 import type { ProtocolResource } from '@opentrons/shared-data'
-import type * as ReactRouterDom from 'react-router-dom'
+import type { NavigateFunction } from 'react-router-dom'
 
 const mockNavigate = vi.fn()
 
 vi.mock('react-router-dom', async importOriginal => {
-  const actual = await importOriginal<typeof ReactRouterDom>()
+  const actual = await importOriginal<NavigateFunction>()
   return {
     ...actual,
     useNavigate: () => mockNavigate,