From a3fcae01127121ce5d86b465c8ea90930e71695b Mon Sep 17 00:00:00 2001 From: Wildan Nursahidan <> Date: Sat, 17 May 2025 19:35:31 +0700 Subject: [PATCH] docu version 1.8.5 --- CHANGELOG.md | 28 + app/blog/page.tsx | 31 +- app/changelog/page.tsx | 33 +- app/docs/[[...slug]]/page.tsx | 14 +- app/playground/page.tsx | 17 +- components/Sponsor.tsx | 37 + components/changelog/floating-version.tsx | 2 +- components/changelog/version-entry.tsx | 22 +- components/changelog/version-toc.tsx | 103 +- components/docs-breadcrumb.tsx | 2 +- components/docs-menu.tsx | 45 +- components/edit-on-github.tsx | 20 +- components/footer.tsx | 35 +- components/leftbar.tsx | 46 +- components/navbar.tsx | 4 +- components/sublink.tsx | 98 +- components/toc.tsx | 18 +- docu.json | 5 +- package-lock.json | 448 +- package.json | 8 +- pnpm-lock.yaml | 6199 --------------------- styles/globals.css | 43 +- tailwind.config.ts | 3 +- 23 files changed, 866 insertions(+), 6395 deletions(-) create mode 100644 components/Sponsor.tsx delete mode 100644 pnpm-lock.yaml diff --git a/CHANGELOG.md b/CHANGELOG.md index 0cac9ce..3b71425 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,31 @@ +## [1.8.5] - 2025-05-10 + +> Add sponsor card on single docs page + +### Added + +- Expandables Leftbar +- sponsor badges or ads +- boolean show/hide `edit on github` +- with the same code run anywhere (bun or nodejs) +- add fronmatter (metadata) to playground editor + +### Improved + +- adjusment docu.json +- adjustment navbar, footer and components + +### Fixed + +- bun compability rename .js to common js +- cli manage packageManager on package.json +- inconsistent design moved to better UI/UX +- error handle render footer.social + +### Removed + +- remove confused and verbose cli on installer + ## [1.8.0] - 2025-03-01 > Now looks more modern and clean which is a big change in layout and design diff --git a/app/blog/page.tsx b/app/blog/page.tsx index 780cd39..567db7c 100644 --- a/app/blog/page.tsx +++ b/app/blog/page.tsx @@ -4,6 +4,8 @@ import { formatDate2, stringToDate } from "@/lib/utils"; import { getMetadata } from "@/app/layout"; import Image from "next/image"; import Link from "next/link"; +import { AuroraText } from "@/components/ui/aurora"; +import { ShineBorder } from "@/components/ui/shine-border"; import docuConfig from "@/docu.json"; export const metadata = getMetadata({ @@ -16,16 +18,17 @@ export default async function BlogIndexPage() { (a, b) => stringToDate(b.date).getTime() - stringToDate(a.date).getTime() ); return ( -
-
-

- Blog Posts +
+
+ # Stay Informed, Stay Ahead +

+ Blog Posts

-

- Discover the latest updates, tutorials, and insights on {meta.title}. +

+ Explore updates, tips, and deep dives from the {meta.title}.

-
-
+
+
{blogs.map((blog) => ( ))} @@ -45,9 +48,8 @@ function BlogCard({ return ( -

{title}

-

{description}

-
+
+

{title}

+

{description}

+
+

Published on {formatDate2(date)}

diff --git a/app/changelog/page.tsx b/app/changelog/page.tsx index 397a039..0caacf0 100644 --- a/app/changelog/page.tsx +++ b/app/changelog/page.tsx @@ -2,42 +2,23 @@ import { Suspense } from "react"; import { getChangelogEntries } from "@/lib/changelog"; import { VersionEntry } from "@/components/changelog/version-entry"; import { VersionToc } from "@/components/changelog/version-toc"; -import { getMetadata } from "@/app/layout"; -import docuConfig from "@/docu.json"; import { FloatingVersionToc } from "@/components/changelog/floating-version"; -export const metadata = getMetadata({ - title: "Changelog", - description: "Latest updates and improvements to DocuBook", - image: "release-note.png", -}); - export default async function ChangelogPage() { const entries = await getChangelogEntries(); - const { meta } = docuConfig; - return ( -
-
-
-

Changelog

-

- Latest updates and improvements to {meta.title} -

-
-
-
-
- }> + return ( +
+ }> ({ version, date }))} /> -
+
-
-
+
+
{entries.map((entry, index) => (
-
-
{/* Floating TOC for smaller screens */} {entries.length > 0 && ( {title}

{description}

{res.content}
-
+
+ {docuConfig.repository?.editLink && } {date && ( -

+

Published on {formatDate2(date)} -

+

)} - {/* */} -
+
diff --git a/app/playground/page.tsx b/app/playground/page.tsx index f2f7a7a..2247a7d 100644 --- a/app/playground/page.tsx +++ b/app/playground/page.tsx @@ -187,23 +187,24 @@ export default function PlaygroundPage() { } }; - const insertAtCursor = (textArea: HTMLTextAreaElement, text: string) => { + const insertAtCursor = (textArea: HTMLTextAreaElement, text: string) => { const start = textArea.selectionStart; const end = textArea.selectionEnd; const before = markdown.substring(0, start); const after = markdown.substring(end); - // Menambahkan satu baris kosong sebelum dan sesudah komponen - const newText = `${before}${text}\n${after}`; + const needsLeadingNewline = before && !before.endsWith('\n\n') ? '\n\n' : ''; + const needsTrailingNewline = after && !after.startsWith('\n\n') ? '\n\n' : ''; + + const newText = `${before}${needsLeadingNewline}${text}${needsTrailingNewline}${after}`; setMarkdown(newText); requestAnimationFrame(() => { - textArea.focus(); - const newPosition = start + text.length + 1; - textArea.setSelectionRange(newPosition, newPosition); + textArea.focus(); + const newPosition = before.length + needsLeadingNewline.length + text.length + 1; + textArea.setSelectionRange(newPosition, newPosition); }); - }; - + }; if (isMobile) { return ; diff --git a/components/Sponsor.tsx b/components/Sponsor.tsx new file mode 100644 index 0000000..c1c5b31 --- /dev/null +++ b/components/Sponsor.tsx @@ -0,0 +1,37 @@ +import docuConfig from "@/docu.json"; +import Image from "next/image"; +import Link from "next/link"; + +export function Sponsor() { + const sponsor = docuConfig.sponsor; + const item = sponsor?.item; + + if (!item) return null; + + return ( +
+

{sponsor.title || "Sponsor"}

+ +
+ {item.title} +
+
+

{item.title}

+

{item.description}

+
+ +
+ ); +} + +export default Sponsor; diff --git a/components/changelog/floating-version.tsx b/components/changelog/floating-version.tsx index e2eb109..4175564 100644 --- a/components/changelog/floating-version.tsx +++ b/components/changelog/floating-version.tsx @@ -51,7 +51,7 @@ export function FloatingVersionToc({ versions }: FloatingVersionTocProps) { }; return ( -
+
- + {description && (

{description}

)} @@ -69,8 +69,8 @@ export function VersionEntry({
{Object.entries(changes).map(([type, items]) => ( items && items.length > 0 && ( - items && items.length > 5) && (
); -} \ No newline at end of file +} diff --git a/components/changelog/version-toc.tsx b/components/changelog/version-toc.tsx index 0600f90..c32d2ca 100644 --- a/components/changelog/version-toc.tsx +++ b/components/changelog/version-toc.tsx @@ -2,8 +2,9 @@ import { useEffect, useState } from "react"; import { cn, formatDate2 } from "@/lib/utils"; -import { History } from "lucide-react"; +import { History, PanelLeftOpen, PanelLeftClose } from "lucide-react"; import { ScrollArea } from "@/components/ui/scroll-area"; +import { Button } from "@/components/ui/button"; interface VersionTocProps { versions: Array<{ @@ -14,33 +15,30 @@ interface VersionTocProps { export function VersionToc({ versions }: VersionTocProps) { const [activeId, setActiveId] = useState(null); + const [collapsed, setCollapsed] = useState(false); useEffect(() => { - // Handle initial hash const hash = window.location.hash.slice(1); if (hash) { setActiveId(hash); } - // Set up intersection observer const observer = new IntersectionObserver( (entries) => { entries.forEach((entry) => { if (entry.isIntersecting) { const id = entry.target.id; setActiveId(id); - // Use pushState instead of replaceState to maintain history - window.history.pushState(null, '', `#${id}`); + window.history.pushState(null, "", `#${id}`); } }); }, { threshold: 0.2, - rootMargin: '-20% 0px -60% 0px' + rootMargin: "-20% 0px -60% 0px", } ); - // Observe version elements versions.forEach(({ version }) => { const element = document.getElementById(`v${version}`); if (element) observer.observe(element); @@ -50,41 +48,64 @@ export function VersionToc({ versions }: VersionTocProps) { }, [versions]); return ( -