the great typeinfo unfuckening

src/components/Header.astro

@@ -1,48 +1,18 @@
 ---
 import { ThemeSelect } from "@components/hooks/ThemeSwitch";
-import { getTypeData } from "@config/io/generateTypeData";
+import type { TypeData } from "@config/io/types";
 import Nav from "@components/navigation/sidebars/nav/index.astro";
 import TOC from "@components/navigation/sidebars/TOC.astro";
-import type { TypeTOC } from "./navigation/sidebars/types";
+import type { ConfigHeading } from "@components/navigation/sidebars/types";
 import Search from "./navigation/Search.astro";
 
-const routes = await getTypeData();
-
-const url = Astro.url.pathname.split("/");
-const currentClass = url[4];
-const currentData = routes.find(
-  item => item.name === currentClass
-);
-
-const data = currentData?.data;
-const tocFunctions =
-  data?.functions?.map(item => item.name) || null;
-
-const propsKeys = data?.properties
-  ? Object.keys(data.properties)
-  : null;
-const signalKeys = data?.signals
-  ? Object.keys(data.signals)
-  : null;
-const variantKeys = data?.variants
-  ? Object.keys(data.variants)
-  : null;
-
-let sidebarData: TypeTOC | undefined = {
-  properties: propsKeys,
-  functions: tocFunctions,
-  signals: signalKeys,
-  variants: variantKeys,
-};
-
-if (!data) {
-  sidebarData = undefined;
+interface Props {
+  title?: string;
+  headings?: ConfigHeading[];
+  type?: TypeData;
 }
 
-const {
-  title = null,
-  headings = [],
-} = Astro.props;
+const { title, headings, type } = Astro.props;
 ---
 <div class="header">
   <div class="header-item header-left">
@@ -54,6 +24,6 @@ const {
   <div class="header-item header-right">
     <Search/>
     <ThemeSelect client:load />
-    <TOC title={title} headings={headings} types={sidebarData} mobile={true}/>
+    <TOC title={title} headings={headings} type={type} mobile={true}/>
   </div>
 </div>

src/components/navigation/sidebars/TOC.astro

@@ -1,15 +1,23 @@
 ---
 import TableOfContents from "./toc";
 import type { ConfigHeading, TypeTOC } from "./types.d.ts";
+import type { TypeData } from "@config/io/types";
 
 export interface Props {
   title?: string;
   headings?: ConfigHeading[];
-  types?: TypeTOC;
+  type?: TypeData;
   mobile: boolean;
 }
 
-const { title, headings, types, mobile } = Astro.props;
+const { title, headings, type, mobile } = Astro.props;
+
+const types: TypeTOC | null = type ? {
+  properties: Object.keys(type.properties ?? {}),
+  functions: (type.functions ?? []).map(f => f.name),
+  signals: Object.keys(type.signals ?? {}),
+  variants: Object.keys(type.variants ?? {}),
+} : null;
 ---
 {((headings?.length ?? 0) != 0 || types) &&
   <div id="toc" aria-mobile={mobile} class=`toc-wrapper${mobile ? "-mobile":""}`>

src/components/navigation/sidebars/nav/RootNav.astro

@@ -7,15 +7,13 @@ export interface Props {
 
 const { currentRoute, currentModule, currentClass } = Astro.props;
 
-import { getTypeData } from "@config/io/generateTypeData";
-import { groupRoutes } from "@config/io/helpers";
+import { getModulesData } from "@config/io/generateTypeData";
 import type { TreeEntry } from "./Tree.astro";
 import Tree from "./Tree.astro";
 import Link from "./Link.astro";
 import VersionSelector from "./VersionSelector.astro"
 
-const routes = await getTypeData();
-const groupedRoutes = groupRoutes(routes);
+const modules = await getModulesData();
 
 import { getCollection } from "astro:content";
 const guidePages = await getCollection("guide");
@@ -45,18 +43,16 @@ const types = {
   title: "Quickshell Types",
   link: "/docs/types",
   current: currentRoute?.startsWith("types") ?? false,
-  entries: Object.entries(groupedRoutes.types).map(
-    ([module, items]) => ({
-      title: module,
-      link: `/docs/types/${module}`,
-      current: currentModule === module,
-      entries: items.map(type => ({
-        title: type.name,
-        link: `/docs/types/${module}/${type.name}`,
-        current: currentClass === type.name,
-      })),
-    })
-  ),
+  entries: modules.map(module => ({
+    title: module.name,
+    link: `/docs/types/${module.name}`,
+    current: currentModule === module.name,
+    entries: module.types.map(type => ({
+      title: type.name,
+      link: `/docs/types/${module.name}/${type.name}`,
+      current: currentClass === type.name,
+    }))
+  }))
 };
 
 ---

src/components/type/Properties.astro

@@ -4,22 +4,20 @@ import type {
   QMLTypeLinkObject,
   QuickshellProps,
 } from "@config/io/types";
-import { Tag, Flag } from "@icons";
+import { Tag } from "@icons";
 import TypeTitle from "./TypeTitle.astro";
 
 import TypeDetails from "./TypeDetails.astro";
 
 export interface Props {
-  propsKeys: string[];
-  propsData: QuickshellProps;
+  props: QuickshellProps;
 }
 
-const { propsKeys, propsData } = Astro.props;
+const { props } = Astro.props;
 ---
 <ul class="typedata typeprops">
   {
-    propsKeys.map(item => {
-      const propData = propsData[item]
+    Object.entries(props).map(([name, propData]) => {
       let typeLink:string;
       let linkText:string;
       let genericType:string|undefined;
@@ -37,10 +35,10 @@ const { propsKeys, propsData } = Astro.props;
         genericTypeLink = getQMLTypeLink(propData.type.of)
       }
       return (
-        <li id={ item } class="typedata-root typeprop-root">
+        <li id={ name } class="typedata-root typeprop-root">
           <TypeTitle
             typekind="prop"
-            typename={item}
+            typename={name}
             typelink={typeLink}
             typelink_text={linkText}
             typename_generic={genericType}

src/components/type/Signals.astro

@@ -1,30 +1,28 @@
 ---
 import type { QuickshellSignal } from "@config/io/types";
-import { Tag, PowerCord } from "@icons";
+import { Tag } from "@icons";
 import TypeDetails from "./TypeDetails.astro";
 import TypeTitle from "./TypeTitle.astro";
 
 export interface Props {
-  signalKeys: string[];
-  signalsData: QuickshellSignal;
+  signals: QuickshellSignal;
 }
 
-const { signalKeys, signalsData } = Astro.props;
+const { signals } = Astro.props;
 ---
 <ul class="typedata typesignals">
   {
-    signalKeys.map(item => {
-      const signalData = signalsData[item];
+    Object.entries(signals).map(([name, signalData]) => {
       const paramKeys = signalData.params.length > 0 ? signalData.params.map((param,index) => `${param.name}${index !== signalData.params.length -1 ? ", ":""}`) : []
       let genericType:string|undefined;
       let genericTypeLink:string|undefined;
       return (
-        <li id={ item } class="typedata-root typesignal-root">
+        <li id={ name } class="typedata-root typesignal-root">
           <TypeTitle
             typekind="signal"
-            typename={item}
+            typename={name}
             typelink="/docs/configuration/qml-overview#-signals"
-            typelink_text={"?"}
+            typelink_text=""
             typename_generic={genericType}
             typelink_generic={genericTypeLink}
             typedata_params={paramKeys}

src/components/type/Variants.astro

@@ -1,28 +1,25 @@
 ---
 import type { QuickshellVariant } from "@config/io/types";
-import { FourDiamonds } from "../icons";
 import TypeDetails from "./TypeDetails.astro";
 import TypeTitle from "./TypeTitle.astro";
 
 export interface Props {
-  variantKeys: string[];
-  variantsData: QuickshellVariant;
+  variants: QuickshellVariant;
 }
 
-const { variantKeys, variantsData } = Astro.props;
+const { variants } = Astro.props;
 ---
 <ul class="typedata typevariants">
   {
-    variantKeys.map(item => {
-      const variantData = variantsData[item];
+    Object.entries(variants).map(([name, variantData]) => {
       const paramKeys = variantData.params && variantData.params.length > 0
         ? variantData.params.map(param => param.name)
         : [];
       return (
-        <li id={ item } class="typedata-root typevariant-root">
+        <li id={ name } class="typedata-root typevariant-root">
           <TypeTitle 
             typekind="variant"
-            typename={item}
+            typename={name}
             typelink=""
             typelink_text=""
           />

src/config/io/generateTypeData.ts

@@ -1,57 +1,41 @@
 import { promises as fs } from "node:fs";
 import path from "node:path";
 
-import type { RouteData, dirData } from "./types";
+import type { VersionsData, ModuleData } from "./types";
 
-async function readSubdir(basePath: string, subdir: string): Promise<dirData[]> {
-  const fullpath = path.join(basePath, subdir);
-  const filenames = await fs.readdir(fullpath);
+async function readModulesData(basePath: string): Promise<ModuleData[]> {
+  const moduleDirs = await fs.readdir(basePath);
 
-  const data = await Promise.all(
-    filenames.map(async filename => {
-      const filepath = path.join(fullpath, filename);
-      const content = await fs.readFile(filepath, "utf8");
-      const data = JSON.parse(content);
-      if (typeof data.module === "undefined") {
-        data.module = "index";
-        data.contains = filenames
-          .filter(filename => filename !== "index.json")
-          .map(filename => filename.replace(".json", ""));
-      }
-      const returnValue = {
-        fullpath: path.join(fullpath, filename),
-        filename: filename.replace(".json", ""),
-        category: subdir,
-        data: data,
-      };
-      return returnValue;
-    })
-  );
-  return data;
-}
+  const modules = await Promise.all(moduleDirs.map(async moduleDir => {
+    const modulePath = path.join(basePath, moduleDir);
 
-async function generateTypeData(basePath: string): Promise<RouteData[]> {
-  const subdirs = await fs.readdir(basePath, {
-    withFileTypes: true,
-  });
-  const routes: RouteData[] = [];
+    const indexPromise = async () => {
+      const indexPath = path.join(modulePath, "index.json");
+      const indexContent = await fs.readFile(indexPath, "utf8");
+      return JSON.parse(indexContent);
+    };
 
-  for (const subdir of subdirs) {
-    const data = await readSubdir(basePath, subdir.name);
-    const returnValue = data.map(entry => {
-      return {
-        type: entry.category,
-        name: entry.filename,
-        path: entry.fullpath,
-        data: entry.data,
-      };
+    const typeNames = (await fs.readdir(modulePath)).filter(name => name !== "index.json");
+    const typePromises = typeNames.map(async fileName => {
+      const typePath = path.join(modulePath, fileName);
+      const fileContent = await fs.readFile(typePath, "utf8");
+      return JSON.parse(fileContent);
     });
-    routes.push(...returnValue);
-  }
-  return routes;
+
+    const [index, ...types] = await Promise.all([indexPromise(), ...typePromises]);
+
+    return {
+      name: index.name,
+      description: index.description,
+      details: index.details,
+      types,
+    }
+  }));
+
+  return modules;
 }
 
-async function generateVersionsData(): Promise<VersionsData> {
+async function readVersionsData(): Promise<VersionsData> {
   const versionsPath = import.meta.env.VERSION_FILE_PATH;
 
   if (!versionsPath || versionsPath === "") {
@@ -63,9 +47,9 @@ async function generateVersionsData(): Promise<VersionsData> {
   const content = await fs.readFile(versionsPath, "utf8");
   const data = JSON.parse(content);
 
-  const versions = await Promise.all(data.versions.map(async d => ({
+  const versions = await Promise.all(data.versions.map(async (d: { name: string, types: any }) => ({
     name: d.name,
-    modules: await generateTypeData(d.types),
+    modules: await readModulesData(d.types),
   })))
 
   return {
@@ -78,13 +62,13 @@ let globalVersionsData: Promise<VersionsData>;
 
 export function getVersionsData(): Promise<VersionsData> {
   if (!globalVersionsData) {
-    globalVersionsData = generateVersionsData();
+    globalVersionsData = readVersionsData();
   }
 
   return globalVersionsData;
 }
 
-export async function getTypeData(): RouteData[] {
+export async function getModulesData(): Promise<ModuleData[]> {
   const versions = await getVersionsData();
-  return versions.versions.find(v => v.name == versions.default).modules;
+  return versions.versions.find(v => v.name == versions.default)!.modules;
 }

src/config/io/helpers.ts

@@ -9,9 +9,8 @@ import {
 import type {
   ConfigHeading,
   ConfigTOC,
-  GroupedRoutes,
 } from "@components/navigation/sidebars/types";
-import type { QMLTypeLinkObject, RouteData } from "./types";
+import type { QMLTypeLinkObject } from "./types";
 
 export function buildHierarchy(headings: ConfigHeading[]) {
   const toc: ConfigTOC[] = [];
@@ -43,23 +42,6 @@ export function buildHierarchy(headings: ConfigHeading[]) {
   return toc;
 }
 
-export function groupRoutes(routes: RouteData[]): GroupedRoutes {
-  const froutes = routes.filter(route => route.name !== "index");
-  return froutes.reduce<GroupedRoutes>((acc, route) => {
-    if (!acc.types) acc.types = {};
-
-    if (!acc.types[route.type]) {
-      acc.types[route.type] = [];
-    }
-
-    acc.types[route.type].push({
-      name: route.name,
-      type: route.type,
-    });
-    return acc;
-  }, { types: {} });
-}
-
 export function getQMLTypeLinkObject(unparsed: string) {
   const isLocal = unparsed.startsWith("MQS_") ? "local" : false;
   const isQT = unparsed.startsWith("MQT_") ? "qt" : false;

src/config/io/types.d.ts

@@ -61,9 +61,7 @@ export interface QuickshellVariant {
   };
 }
 
-export interface QuickshellData {
-  type: string;
-  module: string;
+export interface TypeData {
   name: string;
   description: string;
   details: string;
@@ -77,33 +75,22 @@ export interface QuickshellData {
   subtypes?: QuickshellData[];
 }
 
-export interface RouteData {
-  // priority 1: Quickshell, Quickshell.Io, etc.
-  type: string;
-  // priority 1.1: entry name (e.g. DataStreamParser)
+export interface ModuleData {
   name: string;
-  // path to json
-  path: string;
-  // data content of the route
-  data: QuickshellData;
+  description: string;
+  details: string;
+  types: TypeData[];
 }
 
 export interface VersionData {
   name: string;
-  modules: RouteData[];
+  modules: ModuleData[];
 }
 
 export interface VersionsData {
   default: string;
   versions: VersionData[];
 }
-
-export interface dirData {
-  fullpath: string;
-  filename: string;
-  category: string;
-  data: QuickshellData;
-}
 // --
 
 // helpers.ts
@@ -124,8 +111,9 @@ export type {
   QuickshellFunction,
   QuickshellSignal,
   QuickshellVariant,
-  QuickshellData,
-  RouteData,
-  dirData,
+  TypeData,
+  ModuleData,
+  VersionData,
+  VersionsData,
   QMLTypeLinkObject,
 };

src/layouts/DocsLayout.astro

@@ -9,14 +9,16 @@ import Head from "@config/Head.astro";
 import Nav from "@components/navigation/sidebars/nav/index.astro";
 import type { ConfigHeading } from "@src/components/navigation/sidebars/types";
 import Footer from "@src/components/Footer.astro";
+import type { TypeData } from "@config/io/types";
 
 interface Props {
   title: string;
   description: string;
   headings?: ConfigHeading[];
+  type?: TypeData
 }
 
-const { title, description, headings } = Astro.props;
+const { title, description, headings, type } = Astro.props;
 const url = Astro.url.pathname.split("/");
 
 const customBreadcrumbs = [
@@ -59,7 +61,7 @@ if (url[2]) {
     <CreateCopyButtons />
   </head>
   <body class="docslayout">
-    <Header title={title} headings={headings}/>
+    <Header title={title} headings={headings} type={type}/>
     <div class="docslayout-root">
       <Nav mobile={false}/>
       <div class="docslayout-inner" data-pagefind-body>

src/pages/docs/types/[module]/[type].astro

@@ -0,0 +1,86 @@
+---
+import { getQMLTypeLink } from "@config/io/helpers";
+import { processMarkdown } from "@config/io/markdown";
+import { getModulesData } from "@config/io/generateTypeData";
+import DocsLayout from "@layouts/DocsLayout.astro";
+import TOC from "@components/navigation/sidebars/TOC.astro";
+import Properties from "@components/type/Properties.astro";
+import Functions from "@components/type/Functions.astro";
+import Signals from "@components/type/Signals.astro";
+import Variants from "@components/type/Variants.astro";
+import Badge from "@components/Badge.astro";
+
+export async function getStaticPaths() {
+  const modules = await getModulesData();
+  return modules.flatMap(module => module.types.map(type => ({
+    params: { module: module.name, type: type.name },
+    props: { module, type }
+  })));
+}
+
+const { module, type } = Astro.props;
+
+const superLink = type.super ? getQMLTypeLink(type.super) : null;
+
+const details = type.details
+  ? await processMarkdown(type.details)
+  : null;
+---
+<DocsLayout title={`${module.name} - ${type.name}`} description={type.description ?? ""} type={type}>
+  <div class="docs">
+    <div class="docs-content typedocs-content">
+      <hr />
+      <section class="typedocs-title">
+      <h2 class="typedocs-title-text" data-pagefind-weight="10">
+        {type.name}:
+          {type.super?.name ? (
+            <a
+              href={superLink!}
+              data-pagefind-ignore
+            >
+            {type.super.name}
+            </a>
+          ):(
+            <span class="type-datatype" data-pagefind-ignore>{type.name}</span>
+          )
+          }
+      </h2>
+      {type.flags && (
+        <div class="type-flags" data-pagefind-ignore>{type.flags.map(flag => (
+          <Badge badgeText={flag}/>
+        ))}</div>
+      )}
+      </section>
+      <code class="type-module" data-pagefind-ignore>import {module.name}</code>
+      <section class="typedocs-data typedata">
+        <subheading class="typedocs-subheading">
+          {details ? <span class="parsedMD" set:html={details}/> : (<span class="toparse">{type.description}</span>)}
+        </subheading>
+        { Object.keys(type.properties ?? {}).length != 0 && (
+          <h2>Properties <a href="/docs/guide/qml-language#properties">[?]</a></h2>
+          <Properties props={type.properties!}/>
+        )}
+        { (type.functions?.length ?? 0) != 0 && (
+          <h2>Functions <a href="/docs/guide/qml-language#functions">[?]</a></h2>
+          <Functions
+            funcData={type.functions!}
+          />
+        )}
+        { Object.keys(type.signals ?? {}).length != 0 && (
+          <h2>Signals <a href="/docs/guide/qml-language#signals">[?]</a></h2>
+          <Signals
+            signals={type.signals!}
+          />
+        )}
+        { Object.keys(type.variants ?? {}).length != 0 && (
+          <h2>Variants</h2>
+          <Variants
+            variants={type.variants!}
+          />
+        )}
+      </section>
+    </div>
+    <TOC mobile={false} type={type} data-pagefind-ignore/>
+  </div>
+</DocsLayout>
+

src/pages/docs/types/[module]/index.astro

@@ -0,0 +1,44 @@
+---
+import DocsLayout from "@layouts/DocsLayout.astro";
+import { getModulesData } from "@config/io/generateTypeData";
+import { processMarkdown } from "@src/config/io/markdown";
+
+export async function getStaticPaths() {
+  const modules = await getModulesData();
+  return modules.map(module => ({
+    params: { module: module.name },
+    props: { module },
+  }));
+}
+
+const { module } = Astro.props;
+const details = module.details
+  ? await processMarkdown(module.details)
+  : null;
+---
+
+<DocsLayout
+  title={module.name + " Module Types"}
+  description="Quickshell Type Documentation"
+>
+  <div class="docs-content">
+    <hr />
+    <h2 class="typedocs-title">{module.name} Definitions</h2>
+    <section>
+      <span>{module.description}</span>
+      <div class="root-nav" data-pagefind-ignore>
+        {module.types.map(type => 
+          (
+          <div class="root-nav-entry">
+            <a class="root-nav-link" href={`/docs/types/${module.name}/${type.name}`}>
+              {type.name}
+            </a>
+            <span class="root-nav-desc">{type.description}</span>
+          </div>
+          )
+        )}
+      </div>
+      {details && <span class="parsedMD" set:html={details}/>}
+    </section>
+  </div>
+</DocsLayout>

src/pages/docs/types/[type]/[name].astro

@@ -1,120 +0,0 @@
----
-import { getQMLTypeLink } from "@config/io/helpers";
-import { processMarkdown } from "@config/io/markdown";
-import { getTypeData } from "@config/io/generateTypeData";
-import DocsLayout from "@layouts/DocsLayout.astro";
-import TOC from "@components/navigation/sidebars/TOC.astro";
-import Properties from "@components/type/Properties.astro";
-import Functions from "@components/type/Functions.astro";
-import Signals from "@components/type/Signals.astro";
-import Variants from "@components/type/Variants.astro";
-import Badge from "@components/Badge.astro";
-
-export async function getStaticPaths() {
-  const routes = await getTypeData();
-
-  return routes
-    .filter(route => route.name !== "index")
-    .map(route => ({
-      params: { type: route.type, name: route.name },
-      props: { route },
-    }));
-}
-
-const { route } = Astro.props;
-
-const data = route.data;
-
-const sidebarFunctions =
-  data.functions?.map(item => item.name) || null;
-
-const propsKeys = data.properties
-  ? Object.keys(data.properties).toSorted()
-  : null;
-const signalKeys = data.signals
-  ? Object.keys(data.signals).toSorted()
-  : null;
-const variantKeys = data.variants
-  ? Object.keys(data.variants).toSorted()
-  : null;
-
-const sidebarData = {
-  properties: propsKeys,
-  functions: sidebarFunctions,
-  signals: signalKeys,
-  variants: variantKeys,
-};
-
-const superLink = data.super ? getQMLTypeLink(data.super) : null;
-
-const details = data.details
-  ? await processMarkdown(data.details)
-  : null;
----
-<DocsLayout title={`${route.name} - ${route.type}`} description={data?.description ?? ""}>
-  <div class="docs">
-    <div class="docs-content typedocs-content">
-      <hr />
-      <section class="typedocs-title">
-      <h2 class="typedocs-title-text" data-pagefind-weight="10">
-        {route.name}:
-          {data.super?.name ? (
-            <a
-              href={superLink!}
-              data-pagefind-ignore
-            >
-            {data.super.name}
-            </a>
-          ):(
-            <span class="type-datatype" data-pagefind-ignore>{data.type}</span>
-          )
-          }
-      </h2>
-      {data && data.flags ? (
-        <div class="type-flags" data-pagefind-ignore>{data.flags.map(flag => (
-          <Badge badgeText={flag}/>
-        ))}</div>
-      ):null}
-      </section>
-      <code class="type-module" data-pagefind-ignore>import {data.module}</code>
-      {
-        route && data ? (
-          <section class="typedocs-data typedata">
-            <subheading class="typedocs-subheading">
-              {details ? <span class="parsedMD" set:html={details}/> : (<span class="toparse">{data.description}</span>)}
-            </subheading>
-            { data.properties && propsKeys && propsKeys.length > 0 && (
-              <h2>Properties <a href="/docs/guide/qml-language#properties">[?]</a></h2>
-              <Properties
-                propsData={data.properties}
-                propsKeys={propsKeys!}
-              />
-            )}
-            { data.functions && data.functions.length > 0 && (
-              <h2>Functions <a href="/docs/guide/qml-language#functions">[?]</a></h2>
-              <Functions
-                funcData={data.functions}
-              />
-            )}
-            { data.signals && signalKeys && signalKeys.length > 0 && (
-              <h2>Signals <a href="/docs/guide/qml-language#signals">[?]</a></h2>
-              <Signals
-                signalsData={data.signals}
-                signalKeys={signalKeys}
-              />
-            )}
-            { data.variants && variantKeys && variantKeys.length > 0 && (
-              <h2>Variants</h2>
-              <Variants
-                variantsData={data.variants}
-                variantKeys={variantKeys}
-              />
-            )}
-          </section>
-        ) : null
-      }
-    </div>
-    <TOC mobile={false} types={sidebarData} data-pagefind-ignore/>
-  </div>
-</DocsLayout>
-

src/pages/docs/types/[type]/index.astro

@@ -1,59 +0,0 @@
----
-import DocsLayout from "@layouts/DocsLayout.astro";
-import { getTypeData } from "@config/io/generateTypeData";
-import { processMarkdown } from "@src/config/io/markdown";
-
-export async function getStaticPaths() {
-  const routes = await getTypeData();
-
-  return routes
-    .filter(route => route.name === "index")
-    .map(route => {
-      const children: { [key: string]: string } = {};
-      route.data.contains?.map(childName =>
-        routes
-          .filter(route => route.name !== "index")
-          .filter(childData => childData.name === childName)
-          .map(childData => {
-            children[childName] = childData.data.description;
-          })
-      );
-      return {
-        params: { type: route.type, name: route.type },
-        props: { route, children },
-      };
-    });
-}
-const { route, children } = Astro.props;
-const details = route.data.details
-  ? await processMarkdown(route.data.details)
-  : null;
----
-
-<DocsLayout
-  title={route.type + " Module Types"}
-  description="Quickshell Type Documentation"
->
-  <div class="docs-content">
-    <hr />
-    <h2 class="typedocs-title">{route.type[0].toUpperCase() + route.type.slice(1)} Definitions</h2>
-    <section>
-      <span>{route.data.description}</span>
-      <div class="root-nav" data-pagefind-ignore>
-        {route.data.contains!.map((childName:string) => 
-          (
-          <div class="root-nav-entry">
-            <a class="root-nav-link" href={`/docs/types/${route.data.module === "index"
-            ? route.data.name
-            : route.data.module}/${childName}`}>
-            {childName}
-            </a>
-            <span class="root-nav-desc">{children[childName] || "See Configuration"}</span>
-          </div>
-          )
-        )}
-      </div>
-      {details && <span class="parsedMD" set:html={details}/>}
-    </section>
-  </div>
-</DocsLayout>

src/pages/docs/types/index.astro

@@ -1,10 +1,8 @@
 ---
 import DocsLayout from "@layouts/DocsLayout.astro";
-import { getTypeData } from "@config/io/generateTypeData";
+import { getModulesData } from "@config/io/generateTypeData";
 
-const routes = await getTypeData();
-
-const modules = [...new Set(routes.map(route => route.type))];
+const modules = await getModulesData();
 ---
 <DocsLayout title="Quickshell Module Listing" description="Quickshell Type Documentation">
   <div class="docs-content">
@@ -13,18 +11,14 @@ const modules = [...new Set(routes.map(route => route.type))];
     <section>
       <span>All modules included with Quickshell</span>
       <div class="root-nav" data-pagefind-ignore>
-        {modules.map(moduleEntry => {
-          const indexData = routes.filter(route => route.name === "index")
-          const indexSingled = indexData.filter(indexEntry => indexEntry.type === moduleEntry)[0]
-          const description = indexSingled.data.description
-          return (
+        {modules.map(module => (
           <div class="root-nav-entry">
-            <a class="root-nav-link" href={`/docs/types/${moduleEntry}`}>
-              {moduleEntry}
+            <a class="root-nav-link" href={`/docs/types/${module.name}`}>
+              {module.name}
             </a>
-            <span class="root-nav-desc">{description}</span>
+            <span class="root-nav-desc">{module.description}</span>
           </div>)
-        })}
+        )}
       </div>
     </section>
   </div>