fix(router): Remove barrel exports from router.tsx

.changesets/10464.md

@@ -0,0 +1,15 @@
+- fix(router): Remove barrel exports from router.tsx (#10464) by @Tobbe
+
+We were using both `index.ts` and `router.tsx` as barrel export files. We
+should move away from barrel exports at some point, and we definitely don't
+need two files doing it in the same package. Everything that was exported from
+`router.tsx` is already exported by other files (except `Router` itself). So I
+updated the code to import from there directly instead.
+
+This is a breaking change for anyone who does
+`import ... from '@redwoodjs/router/dist/router'` in their project. Which
+hopefully isn't very many.
+ - The quick fix is to find the original export and pull from there instead
+ - The real fix is to talk to us on the core team and see if we can provide an
+   official way of solving it instead of relying on internal implementation
+   details 🙂 

packages/router/src/__tests__/analyzeRoutes.test.tsx

@@ -1,6 +1,7 @@
 import React, { isValidElement } from 'react'
 
-import { Route, Router } from '../router'
+import { Route } from '../Route'
+import { Router } from '../router'
 import { Private, PrivateSet, Set } from '../Set'
 import { analyzeRoutes } from '../util'
 

packages/router/src/__tests__/redirect.test.tsx

@@ -3,7 +3,8 @@ import React from 'react'
 import { act, render, waitFor } from '@testing-library/react'
 
 import { navigate } from '../history'
-import { Route, Router } from '../router'
+import { Route } from '../Route'
+import { Router } from '../router'
 
 const RedirectedRoutes = () => {
   const SimplePage = () => <h1>FindMeSimple</h1>

packages/router/src/__tests__/route-announcer.test.tsx

@@ -5,8 +5,10 @@ import '@testing-library/jest-dom/jest-globals'
 
 import { getAnnouncement } from '../a11yUtils'
 import { navigate } from '../history'
+import { namedRoutes as routes } from '../namedRoutes'
+import { Route } from '../Route'
 import RouteAnnouncement from '../route-announcement'
-import { Router, Route, routes } from '../router'
+import { Router } from '../router'
 
 // SETUP
 const HomePage = () => <h1>Home Page</h1>
@@ -51,7 +53,6 @@ const EmptyH1Page = () => (
 
 beforeEach(() => {
   window.history.pushState({}, '', '/')
-  // @ts-expect-error - No type gen here for routes like there is in a real app
   Object.keys(routes).forEach((key) => delete routes[key])
 })
 

packages/router/src/__tests__/route-focus.test.tsx

@@ -2,8 +2,10 @@ import { render, waitFor } from '@testing-library/react'
 import '@testing-library/jest-dom/jest-globals'
 
 import { getFocus } from '../a11yUtils'
+import { namedRoutes as routes } from '../namedRoutes'
+import { Route } from '../Route'
 import RouteFocus from '../route-focus'
-import { Router, Route, routes } from '../router'
+import { Router } from '../router'
 
 // SETUP
 const RouteFocusPage = () => (

packages/router/src/__tests__/route-validators.test.tsx

@@ -1,5 +1,5 @@
+import { Route } from '../Route'
 import { isValidRoute } from '../route-validators'
-import { Route } from '../router'
 
 describe('isValidRoute', () => {
   it('throws if Route does not have a path', () => {
@@ -38,7 +38,7 @@ describe('isValidRoute', () => {
     )
   })
 
-  it('throws if notFoundPage doesnt have page prop', () => {
+  it("throws if notFoundPage doesn't have page prop", () => {
     // @ts-expect-error Its ok mate, we're checking the validator
     const RouteToCheck = <Route notfound name="bazinga" />
 
@@ -47,7 +47,7 @@ describe('isValidRoute', () => {
     )
   })
 
-  it('does not throws if notFoundPage doesnt have a path', () => {
+  it("does not throws if notFoundPage doesn't have a path", () => {
     // @ts-expect-error Its ok mate, we're checking the validator
     const RouteToCheck = <Route name="bazinga" notfound page={() => <></>} />
 

packages/router/src/__tests__/routeScrollReset.test.tsx

@@ -4,7 +4,9 @@ import '@testing-library/jest-dom/jest-globals'
 import { act, cleanup, render, screen } from '@testing-library/react'
 
 import { navigate } from '../history'
-import { Route, Router, routes } from '../router'
+import { namedRoutes as routes } from '../namedRoutes'
+import { Route } from '../Route'
+import { Router } from '../router'
 
 describe('Router scroll reset', () => {
   const Page1 = () => <div>Page 1</div>

packages/router/src/__tests__/set.test.tsx

@@ -5,7 +5,8 @@ import { act, render, waitFor } from '@testing-library/react'
 import '@testing-library/jest-dom/jest-globals'
 
 import { navigate } from '../history'
-import { Route, Router } from '../router'
+import { Route } from '../Route'
+import { Router } from '../router'
 import { Set } from '../Set'
 
 // SETUP

packages/router/src/__tests__/useRoutePaths.test.tsx

@@ -5,7 +5,8 @@ import { render } from '@testing-library/react'
 import { act } from 'react-dom/test-utils'
 
 import { navigate } from '../history'
-import { Route, Router } from '../router'
+import { Route } from '../Route'
+import { Router } from '../router'
 import { Set } from '../Set'
 import { useRoutePaths, useRoutePath } from '../useRoutePaths'
 

packages/router/src/index.ts

@@ -12,7 +12,8 @@ export {
   PageLoadingContextProvider,
 } from './PageLoadingContext'
 export { useParams, ParamsProvider, ParamsContext } from './params'
-export { Router, Route } from './router'
+export { Router } from './router'
+export { Route } from './Route'
 export { namedRoutes as routes } from './namedRoutes'
 
 export * from './Set'

packages/router/src/router.tsx

@@ -6,13 +6,9 @@ import { AuthenticatedRoute } from './AuthenticatedRoute'
 import { LocationProvider, useLocation } from './location'
 import { namedRoutes } from './namedRoutes'
 import { normalizePage } from './page'
-import type { PageType } from './page'
 import { PageLoadingContextProvider } from './PageLoadingContext'
 import { ParamsProvider } from './params'
 import { Redirect } from './redirect'
-import { Route } from './Route'
-import type { RouteProps } from './Route'
-import { isValidRoute } from './route-validators'
 import type { RouterContextProviderProps } from './router-context'
 import { RouterContextProvider } from './router-context'
 import { SplashPage } from './splash-page'
@@ -32,7 +28,7 @@ export interface RouterProps
   children: ReactNode
 }
 
-const Router: React.FC<RouterProps> = ({
+export const Router: React.FC<RouterProps> = ({
   useAuth,
   paramTypes,
   pageLoadingDelay,
@@ -261,17 +257,3 @@ const WrappedPage = memo(({ routeLoaderElement, sets }: WrappedPageProps) => {
     return wrapped
   }, routeLoaderElement)
 })
-
-export {
-  Router,
-  // TODO: Remove this export in the next major version
-  Route,
-  // TODO: Remove this export in the next major version
-  namedRoutes as routes,
-  // TODO: Remove this export in the next major version
-  isValidRoute as isRoute,
-  // TODO: Remove this export in the next major version
-  PageType,
-  // TODO: Remove this export in the next major version
-  RouteProps,
-}

packages/testing/src/web/MockRouter.tsx

@@ -5,8 +5,8 @@ import type React from 'react'
 // for jest and Storybook. Not doing so would cause an infinite loop.
 // See: ./packages/testing/config/jest/web/jest-preset.js
 // @ts-ignore
+import { isValidRoute } from '@redwoodjs/router/dist/route-validators'
 import type { RouterProps } from '@redwoodjs/router/dist/router'
-import { isRoute } from '@redwoodjs/router/dist/router'
 import { flattenAll, replaceParams } from '@redwoodjs/router/dist/util'
 // @ts-ignore
 export * from '@redwoodjs/router/dist/index'
@@ -23,7 +23,7 @@ export const Router: React.FC<RouterProps> = ({ children }) => {
   const flatChildArray = flattenAll(children)
 
   flatChildArray.forEach((child) => {
-    if (isRoute(child)) {
+    if (isValidRoute(child)) {
       const { name, path } = child.props
 
       if (name && path) {