feat: Remove redundant folder links from api sidebar

This commit is contained in:
Araozu 2024-08-26 11:29:42 -05:00
parent eee2f60c61
commit 97f10385ba
3 changed files with 66 additions and 25 deletions

View File

@ -1,14 +1,10 @@
---
import type { Hierarchy, Post } from "../../layouts/ApiLayout.astro";
import { splitAndLast } from "../utils";
const hierarchy: Hierarchy = Astro.props.hierarchy;
function splitAndLast(s: string): string {
const segments = s.split("/");
return segments[segments.length - 1]!;
}
function postComparison(a: Post, b: Post): number {
export function postComparison(a: Post, b: Post): number {
const s1 = splitAndLast(a.url);
const s2 = splitAndLast(b.url);
@ -17,19 +13,30 @@ function postComparison(a: Post, b: Post): number {
---
{
Object.entries(hierarchy.children).map(([folderName, children]) => (
<>
<div class="mt-6 px-2 py-1 uppercase font-display text-c-text-2 font-medium">
{folderName}
</div>
Object.entries(hierarchy.children).map(
([folderName, [folderPost, children]]) => (
<>
{folderPost !== null ? (
<a
class="inline-block rounded-2xl w-full hover:bg-neutral-200 dark:hover:bg-neutral-800 transition-colors px-3 py-2"
href={folderPost.url}
>
{splitAndLast(folderPost.url)}
</a>
) : (
<div class="mt-6 px-2 py-1 uppercase font-display text-c-text-2 font-medium">
{folderName}
</div>
)}
<div class="pl-2 my-1">
<ul class="border-l border-c-border-1">
<Astro.self hierarchy={children} />
</ul>
</div>
</>
))
<div class="pl-2 my-1">
<ul class="border-l border-c-border-1">
<Astro.self hierarchy={children} />
</ul>
</div>
</>
),
)
}
{
hierarchy.posts.sort(postComparison).map((p) => (

View File

@ -58,3 +58,7 @@ function trimWhitespace(input: string, count: number): string {
}
}
export function splitAndLast(s: string): string {
const segments = s.split("/");
return segments[segments.length - 1]!;
}

View File

@ -3,6 +3,7 @@ import Navbar from "../components/Navbar.astro";
import BaseLayout from "./BaseLayout.astro";
import TOC from "../components/TOC.astro";
import Sidebar from "../components/ApiLayout/Sidebar.astro";
import { splitAndLast } from "../components/utils";
const { headings } = Astro.props;
@ -21,7 +22,7 @@ const posts: Posts = await Astro.glob("../pages/api/std/**/*.{md,mdx}");
export type Hierarchy = {
posts: Array<Post>;
children: Record<string, Hierarchy>;
children: Record<string, [Post | null, Hierarchy]>;
};
function createHierarchy(posts: Posts): Hierarchy {
@ -57,13 +58,17 @@ function createHierarchy(posts: Posts): Hierarchy {
// check if folder exists, create otherwise
if (!hierarchy.children[folderName]) {
// create if doesnt exist
hierarchy.children[folderName] = {
posts: [],
children: {},
};
hierarchy.children[folderName] = [
null,
{
posts: [],
children: {},
},
];
}
currentHierarchy = hierarchy.children[folderName];
const [_, childrenHierarchy] = hierarchy.children[folderName]!;
currentHierarchy = childrenHierarchy;
}
// add the page
@ -73,7 +78,32 @@ function createHierarchy(posts: Posts): Hierarchy {
return hierarchy;
}
const hierarchy = createHierarchy(posts);
function normalizeHierarchy(h: Hierarchy): Hierarchy {
let posts = h.posts;
for (const folderName in h.children) {
// search if there is a post with the same name
// as the folder
const postIdx = h.posts.findIndex(
(post) => splitAndLast(post.url) === folderName,
);
if (postIdx !== -1) {
const post = h.posts[postIdx]!;
h.children[folderName]![0] = post;
posts.splice(postIdx, 1);
}
}
// do the same to all children
// TODO
return {
children: h.children,
posts,
};
}
const hierarchy = normalizeHierarchy(createHierarchy(posts));
---
<BaseLayout>