fix(guide): handle external links in sidebar tabs (#11559)

apps/guide/src/app/layout.tsx

@@ -1,4 +1,5 @@
 import { Analytics } from '@vercel/analytics/react';
+import type { Item } from 'fumadocs-core/page-tree';
 import { DocsLayout } from 'fumadocs-ui/layouts/docs';
 import { RootProvider } from 'fumadocs-ui/provider/next';
 import { GeistMono } from 'geist/font/mono';
@@ -60,14 +61,22 @@ export default async function RootLayout({ children }: PropsWithChildren) {
 						sidebar={{
 							tabs: {
 								transform(option, node) {
+									// fumadocs links a folder's tab to its first page, which in some cases is an external link
+									// that would send the tab off-site instead of into the guide section
+									const landingPage = node.children.find(
+										(child): child is Item => child.type === 'page' && !child.external,
+									);
+									const url = landingPage?.url ?? option.url;
+
 									const meta = source.getNodeMeta(node);
-									if (!meta || !node.icon) return option;
+									if (!meta || !node.icon) return { ...option, url };
 
 									// category selection color based on path src/styles/base.css
 									const color = `var(--${meta.path.split('/')[0]}-color, var(--color-fd-foreground))`;
 
 									return {
 										...option,
+										url,
 										icon: (
 											<div
 												className="size-full rounded-lg text-(--tab-color) max-md:border max-md:bg-(--tab-color)/10 max-md:p-1.5 [&_svg]:size-full"