Как в react-router-dom lazy компоненте показать fallback элемент?

Question

[Александр Антонов]

Приветствую, вопрос мой такой, давичи вычитал в доке react-router-dom что компоненты можно лениво грузить не только так

import { lazy, Suspense } from 'react'
import Fallback from '~templates/Fallback.tsx'

const LazyComponent = lazy(() => import('./.../LazyComponent'))

const router = createBrowserRouter([
  {
    path: '/',
    element: (
      <Suspense fallback={<Fallback />}>
        <LazyComponent />
      </Suspense>
    )
  }
])

Но и так

const router = createBrowserRouter([
  {
    path: '/',
    lazy: async () => {
      const Component = await import('./.../LazyComponent')
      return { Component: Component.default }
    }
  }
])

Подход довольно так интересный и позволяет реэкспортить группу lazy компонентов (если нужно грузить не по одному компоненту а пачку за раз), но у меня сразу возник закономерный вопрос, как показывать Fallback элемент пока загружается новый бандл, Suspense явно тут нигде не засунешь, вот и думаю как его пристроить, есть у кого идеи? пока что пытаюсь за костылить с помощью loader