Update some assets deps and react-router v6 -> v7

assets/js/dashboard.tsx

@@ -2,7 +2,7 @@ import React, { ReactNode } from 'react'
 import { createRoot } from 'react-dom/client'
 import 'url-search-params-polyfill'
 
-import { RouterProvider } from 'react-router-dom'
+import { RouterProvider } from 'react-router'
 import { createAppRouter } from './dashboard/router'
 import ErrorBoundary from './dashboard/error/error-boundary'
 import * as api from './dashboard/api'

assets/js/dashboard/error/something-went-wrong.tsx

@@ -1,6 +1,6 @@
 import React, { ReactNode } from 'react'
 import RocketIcon from '../stats/modals/rocket-icon'
-import { useInRouterContext } from 'react-router-dom'
+import { useInRouterContext } from 'react-router'
 import { PlausibleSite } from '../site-context'
 import { getRouterBasepath, rootRoute } from '../router'
 import { AppNavigationLink } from '../navigation/use-app-navigate'

assets/js/dashboard/filtering/filter-editor-context.test.tsx

@@ -1,6 +1,6 @@
 import React, { ReactNode } from 'react'
 import { act, renderHook } from '@testing-library/react'
-import { useNavigate } from 'react-router-dom'
+import { useNavigate } from 'react-router'
 import { TestContextProviders } from '../../../test-utils/app-context-providers'
 import { useDashboardStateContext } from '../dashboard-state-context'
 import { Filter } from '../dashboard-state'

assets/js/dashboard/filtering/filter-editor-context.tsx

@@ -1,18 +1,15 @@
 import React, {
   createContext,
   ReactNode,
+  startTransition,
   useCallback,
   useContext,
   useEffect,
   useMemo,
   useRef,
   useState
 } from 'react'
-import {
-  NavigationType,
-  useLocation,
-  useNavigationType
-} from 'react-router-dom'
+import { NavigationType, useLocation, useNavigationType } from 'react-router'
 import { useDashboardStateContext } from '../dashboard-state-context'
 import { useAppNavigate } from '../navigation/use-app-navigate'
 import { Filter, FilterClauseLabels } from '../dashboard-state'
@@ -182,10 +179,14 @@ export const FilterEditorContextProvider = ({
         mergedKey: filter[1],
         mergedLabels: labels
       })
-      setEditing({
-        ...current,
-        draft: null,
-        hasPushedHistoryEntry: true
+      // react-router applies the URL change in a transition, so the draft must
+      // be cleared in one too, or the filter disappears between the two commits
+      startTransition(() => {
+        setEditing({
+          ...current,
+          draft: null,
+          hasPushedHistoryEntry: true
+        })
       })
     },
     [setEditing, dashboardState.filters, navigateToFilters]

assets/js/dashboard/nav-menu/dashboard-options-menu.tsx

@@ -12,7 +12,7 @@ import { IntervalPicker } from '../stats/graph/interval-picker'
 import { AppNavigationLink } from '../navigation/use-app-navigate'
 import { Notice } from '../components/notice'
 import { isModifierPressed, isTyping, Keybind } from '../keybinding'
-import { useMatch } from 'react-router-dom'
+import { useMatch } from 'react-router'
 import { rootRoute } from '../router'
 import { CsvExport, ExportStatus } from '../stats/csv-export/csv-export'
 import { MenuSeparator } from './nav-menu-components'

assets/js/dashboard/nav-menu/query-periods/dashboard-dates.test.tsx

@@ -3,7 +3,7 @@ import { render, screen } from '@testing-library/react'
 import userEvent from '@testing-library/user-event'
 import { TestContextProviders } from '../../../../test-utils/app-context-providers'
 import { stringifySearch } from '../../util/url-search-params'
-import { useNavigate } from 'react-router-dom'
+import { useNavigate } from 'react-router'
 import { getRouterBasepath } from '../../router'
 import { DashboardPeriodPicker } from './dashboard-period-picker'
 import { mockAnimationsApi, mockResizeObserver } from 'jsdom-testing-mocks'

assets/js/dashboard/nav-menu/query-periods/dashboard-period-menu.tsx

@@ -22,7 +22,7 @@ import {
   isComparisonForbidden,
   isComparisonEnabled
 } from '../../dashboard-time-periods'
-import { useMatch } from 'react-router-dom'
+import { useMatch } from 'react-router'
 import { rootRoute } from '../../router'
 import { Popover, Transition } from '@headlessui/react'
 import {

assets/js/dashboard/nav-menu/query-periods/move-period-arrows.tsx

@@ -9,7 +9,7 @@ import { useSiteContext } from '../../site-context'
 import { NavigateKeybind } from '../../keybinding'
 import { AppNavigationLink } from '../../navigation/use-app-navigate'
 import { DashboardPeriod } from '../../dashboard-time-periods'
-import { useMatch } from 'react-router-dom'
+import { useMatch } from 'react-router'
 import { rootRoute } from '../../router'
 import { isDateRangeCalendarOpen } from './date-range-calendar'
 

assets/js/dashboard/navigation/use-app-navigate.tsx

@@ -7,7 +7,7 @@ import {
   Params,
   NavigateOptions,
   LinkProps
-} from 'react-router-dom'
+} from 'react-router'
 import { parseSearch, stringifySearch } from '../util/url-search-params'
 import { useSegmentsContext } from '../filtering/segments-context'
 import { getSearchToSetSegmentFilter } from '../filtering/segments'

assets/js/dashboard/navigation/use-definite-location-state.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useMemo, useState } from 'react'
-import { useLocation } from 'react-router-dom'
+import { useLocation } from 'react-router'
 import { useAppNavigate } from './use-app-navigate'
 
 /**

assets/js/dashboard/router.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import { createBrowserRouter, Outlet, useRouteError } from 'react-router-dom'
+import { createBrowserRouter, Outlet, useRouteError } from 'react-router'
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 
 import { PlausibleSite, useSiteContext } from './site-context'
@@ -261,11 +261,7 @@ export function createAppRouter(site: PlausibleSite) {
       }
     ],
     {
-      basename: basepath,
-      future: {
-        // @ts-expect-error valid according to docs (https://reactrouter.com/en/main/routers/create-browser-router#optsfuture)
-        v7_prependBasename: true
-      }
+      basename: basepath
     }
   )
 

assets/js/dashboard/site-switcher.tsx

@@ -17,7 +17,7 @@ import { useQuery } from '@tanstack/react-query'
 import { Role, useUserContext } from './user-context'
 import { PlausibleSite, useSiteContext } from './site-context'
 import { MenuSeparator } from './nav-menu/nav-menu-components'
-import { useMatch } from 'react-router-dom'
+import { useMatch } from 'react-router'
 import { rootRoute } from './router'
 import { get } from './api'
 import { ErrorPanel } from './components/error-panel'

assets/js/dashboard/stats/modals/props.tsx

@@ -1,5 +1,5 @@
 import React, { useCallback } from 'react'
-import { useParams } from 'react-router-dom'
+import { useParams } from 'react-router'
 
 import Modal from './modal'
 import {

assets/js/dashboard/verification/portal.test.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import { act, render, screen } from '@testing-library/react'
-import { useLocation } from 'react-router-dom'
+import { useLocation } from 'react-router'
 import { TestContextProviders } from '../../../test-utils/app-context-providers'
 import {
   VERIFICATION_FINISHED_EVENT,