Add "Accessing route data" section in getStaticPaths with routePattern (#12316)

Co-authored-by: Sarah Rainsberger <[email protected]>
Co-authored-by: florian-lefebvre <[email protected]>
Co-authored-by: ArmandPhilippot <[email protected]>

Author: 4 people

src/content/docs/en/reference/routing-reference.mdx

@@ -170,6 +170,41 @@ const { post } = Astro.props;
 <h1>{id}: {post.name}</h1>
 ```
 
+### `routePattern`
+
+<p>
+
+**Type:** `string` <br />
+<Since v="5.14.0" />
+</p>
+
+A property available in [`getStaticPaths()`](#getstaticpaths) options to access the current [`routePattern`](/en/reference/api-reference/#routepattern) as a string.
+
+This provides data from the [Astro render context](/en/reference/api-reference/) that would not otherwise be available within the scope of `getStaticPaths()` and can be useful to calculate the `params` and `props` for each page route.
+
+`routePattern` always reflects the original dynamic segment definition in the file path (e.g. `/[...locale]/[files]/[slug]`), unlike `params`, which are explicit values for a page (e.g. `/fr/fichiers/article-1/`).
+
+The following example shows how to localize your route segments and return an array of static paths by passing `routePattern` to a custom `getLocalizedData()` helper function. The [params](https://github.com/en/reference/routing-reference/#params) object will be set with explicit values for each route segment: `locale`, `files`, and `slug`. Then, these values will be used to generate the routes and can be used in your page template via `Astro.params`.
+
+
+```astro title="src/pages/[...locale]/[files]/[slug].astro" "routePattern" "getLocalizedData"
+---
+import { getLocalizedData } from "../../../utils/i18n";
+
+export async function getStaticPaths({ routePattern }) {
+  const response = await fetch('...');
+  const data = await response.json();
+
+  console.log(routePattern); // [...locale]/[files]/[slug]
+
+  // Call your custom helper with `routePattern` to generate the static paths
+  return data.flatMap((file) => getLocalizedData(file, routePattern));
+}
+
+const { locale, files, slug } = Astro.params;
+---
+```
+
 ### `paginate()`
 
 <p>