feat: Match withRouter props signature for route components (#230)

BREAKING CHANGE: Route components no longer receive spread-out match.
4Catalyzer · Jan 11, 2019 · 7304e90 · 7304e90
1 parent ff30f47
commit 7304e90
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 11 deletions.
diff --git a/src/createElements.js b/src/createElements.js
@@ -5,7 +5,7 @@ import { isResolved } from './ResolverUtils';
 
 export default function createElements(routeMatches, Components, matchData) {
   return routeMatches.map((match, i) => {
-    const { route } = match;
+    const { router, route } = match;
 
     const Component = Components[i];
     const data = matchData[i];
@@ -20,7 +20,7 @@ export default function createElements(routeMatches, Components, matchData) {
       return route.render({
         match,
         Component: isComponentResolved ? Component : null,
-        props: areDataResolved ? { ...match, data } : null,
+        props: areDataResolved ? { match, router, data } : null,
         data: areDataResolved ? data : null,
       });
     }
@@ -42,6 +42,6 @@ export default function createElements(routeMatches, Components, matchData) {
       return null;
     }
 
-    return <Component {...match} data={data} />;
+    return <Component match={match} router={router} data={data} />;
   });
 }
diff --git a/src/utils/resolveRenderArgs.js b/src/utils/resolveRenderArgs.js
@@ -37,7 +37,6 @@ export default async function* resolveRenderArgs({
   const augmentedMatch = {
     ...match,
     routes,
-    match, // For symmetry with withRouter.
     router, // Convenience access for route components.
     context: matchContext,
   };

diff --git a/test/render.test.js b/test/render.test.js
@@ -26,8 +26,8 @@ describe('render', () => {
             },
             {
               path: 'baz/:qux',
-              Component: ({ params }) => (
-                <div className="baz">{params.qux}</div>
+              Component: ({ match }) => (
+                <div className="baz">{match.params.qux}</div>
               ),
             },
           ],
@@ -95,8 +95,8 @@ describe('render', () => {
                   },
                   {
                     path: 'qux/:quux',
-                    Component: ({ params }) => (
-                      <div className="qux">{params.quux}</div>
+                    Component: ({ match }) => (
+                      <div className="qux">{match.params.quux}</div>
                     ),
                   },
                 ],

diff --git a/test/server/getFarceResult.test.js b/test/server/getFarceResult.test.js
@@ -27,7 +27,9 @@ describe('getFarceResult', () => {
           },
           {
             path: 'baz/:qux',
-            Component: ({ params }) => <div className="baz">{params.qux}</div>,
+            Component: ({ match }) => (
+              <div className="baz">{match.params.qux}</div>
+            ),
           },
         ],
       },
@@ -72,8 +74,8 @@ describe('getFarceResult', () => {
                 },
                 {
                   path: 'qux/:quux',
-                  Component: ({ params }) => (
-                    <div className="qux">{params.quux}</div>
+                  Component: ({ match }) => (
+                    <div className="qux">{match.params.quux}</div>
                   ),
                 },
               ],