diff --git a/src/components/ComponentUsage.astro b/src/components/ComponentUsage.astro
index f933b22d039a939..fb4cf15c63c7b33 100644
--- a/src/components/ComponentUsage.astro
+++ b/src/components/ComponentUsage.astro
@@ -1,6 +1,8 @@
---
import { z } from "astro:schema";
import { getComponentsUsage } from "~/util/components";
+import { slug } from "github-slugger";
+
import Details from "./Details.astro";
type Props = z.infer;
@@ -20,21 +22,69 @@ const usage = await getComponentsUsage(component);
{usage.pages.size} pages.
+ Pages
+
+ {
+ [...usage.pages]
+ .filter((path) => path.startsWith("src/content/docs/"))
+ .sort()
+ .map((path) => {
+ const slugified =
+ "/" +
+ path
+ .replace("src/content/docs/", "")
+ .replace(".mdx", "")
+ .split("/")
+ .map((segment) => slug(segment))
+ .join("/") +
+ "/";
+
+ return (
+ -
+
+ {slugified}
+
+
+ -
+
+ Source
+
+
+
+ );
+ })
+ }
+
+ Partials
{
- [...usage.pages].map((path) => (
- -
-
- {path}
-
-
- ))
+ [...usage.pages]
+ .filter((path) => path.startsWith("src/content/partials/"))
+ .sort()
+ .map((path) => {
+ return (
+ -
+
+ {path}
+
+
+ );
+ })
}