docs: move stuff around in load.mdx

danieljcafonso · danieljcafonso · commit 88cd9cabfe9f · 2024-05-13T19:40:19.000+01:00
diff --git a/src/routes/solid-router/reference/load-functions/load.mdx b/src/routes/solid-router/reference/load-functions/load.mdx
@@ -23,12 +23,6 @@ function loadUser({ params, location }) {
 <Route path="/users/:id" component={User} load={loadUser} />;
 ```
 
-| key      | type                                           | description                                                                                                                                                                                                                                                                                                                                                                 |
-| -------- | ---------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| params   | object                                         | The route parameters (same value as calling [`useParams()`](/solid-router/reference/primitives/use-params) inside the route component)                                                                                                                                                                                                                                      |
-| location | `{ pathname, search, hash, query, state, key}` | An object that used to get more information about the path (corresponds to [`useLocation()`](/solid-router/reference/primitives/use-location))                                                                                                                                                                                                                              |
-| intent   | `"initial", "navigate", "native", "preload"`   | Indicates why this function is being called. <ul><li>"initial" - the route is being initially shown (ie page load)</li><li>"native" - navigate originated from the browser (eg back/forward)</li><li>"navigate" - navigate originated from the router (eg call to navigate or anchor clicked)</li><li>"preload" - not navigating, just preloading (eg link hover)</li></ul> |
-
 A common pattern is to export the load function and data wrappers that correspond to a route in a dedicated `route.data.js` file.
 This imports the data functions without loading anything else.
 
@@ -51,7 +45,7 @@ The return value of the `load` function is passed to the page component as a `da
 ```js
 //pages/users/[id].jsx
 export default function User(props) {
-  return <p>{ props.data().name }</p>
+	return <p>{props.data().name}</p>;
 }
 ```
 
@@ -78,7 +72,9 @@ const User = lazy(() => import("./pages/users/[id].js"));
 
 import { cache } from "@solidjs/router";
 
-export const getUser = cache((id) => { /* do loading */ }, "users");
+export const getUser = cache((id) => {
+	/* do loading */
+}, "users");
 export const loadUser = ({ params, location }) => fetchUser(params.id);
 export default loadUser;
 ```
@@ -89,7 +85,15 @@ export default loadUser;
 import { getUser } from "./[id].data.js";
 
 export default function User(props) {
-  const user = createAsync(() => getUser(props.params.id));
-  return <p>{ user().name }</p>
+	const user = createAsync(() => getUser(props.params.id));
+	return <p>{user().name}</p>;
 }
 ```
+
+## Props
+
+| key      | type                                           | description                                                                                                                                                                                                                                                                                                                                                                 |
+| -------- | ---------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| params   | object                                         | The route parameters (same value as calling [`useParams()`](/solid-router/reference/primitives/use-params) inside the route component)                                                                                                                                                                                                                                      |
+| location | `{ pathname, search, hash, query, state, key}` | An object that used to get more information about the path (corresponds to [`useLocation()`](/solid-router/reference/primitives/use-location))                                                                                                                                                                                                                              |
+| intent   | `"initial", "navigate", "native", "preload"`   | Indicates why this function is being called. <ul><li>"initial" - the route is being initially shown (ie page load)</li><li>"native" - navigate originated from the browser (eg back/forward)</li><li>"navigate" - navigate originated from the router (eg call to navigate or anchor clicked)</li><li>"preload" - not navigating, just preloading (eg link hover)</li></ul> |
