fix(solid-router): use Solid.useTransition (#5801)

Author: birkskyum

packages/solid-router/src/Transitioner.tsx

@@ -19,7 +19,7 @@ export function Transitioner() {
     return null
   }
 
-  const [isTransitioning, setIsTransitioning] = Solid.createSignal(false)
+  const [isSolidTransitioning, startSolidTransition] = Solid.useTransition()
 
   // Track pending state changes
   const hasPendingMatches = useRouterState({
@@ -29,20 +29,15 @@ export function Transitioner() {
   const previousIsLoading = usePrevious(isLoading)
 
   const isAnyPending = () =>
-    isLoading() || isTransitioning() || hasPendingMatches()
+    isLoading() || isSolidTransitioning() || hasPendingMatches()
   const previousIsAnyPending = usePrevious(isAnyPending)
 
   const isPagePending = () => isLoading() || hasPendingMatches()
   const previousIsPagePending = usePrevious(isPagePending)
 
   router.startTransition = (fn: () => void | Promise<void>) => {
-    setIsTransitioning(true)
-    Solid.startTransition(async () => {
-      try {
-        await fn()
-      } finally {
-        setIsTransitioning(false)
-      }
+    Solid.startTransition(() => {
+      startSolidTransition(fn)
     })
   }
 

packages/solid-router/tests/store-updates-during-navigation.test.tsx

@@ -137,7 +137,7 @@ describe("Store doesn't update *too many* times during navigation", () => {
     // that needs to be done during a navigation.
     // Any change that increases this number should be investigated.
     // Note: Solid has different update counts than React due to different reactivity
-    expect(updates).toBe(13)
+    expect(updates).toBe(10)
   })
 
   test('redirection in preload', async () => {
@@ -173,7 +173,7 @@ describe("Store doesn't update *too many* times during navigation", () => {
     // that needs to be done during a navigation.
     // Any change that increases this number should be investigated.
     // Note: Solid has different update counts than React due to different reactivity
-    expect(updates).toBe(12)
+    expect(updates).toBe(9)
   })
 
   test('nothing', async () => {
@@ -200,7 +200,7 @@ describe("Store doesn't update *too many* times during navigation", () => {
     // This number should be as small as possible to minimize the amount of work
     // that needs to be done during a navigation.
     // Any change that increases this number should be investigated.
-    expect(updates).toBe(8)
+    expect(updates).toBe(7)
   })
 
   test('hover preload, then navigate, w/ async loaders', async () => {