diff --git a/.gitignore b/.gitignore index 37099d4..ce94ee3 100644 --- a/.gitignore +++ b/.gitignore @@ -5,4 +5,7 @@ node_modules .env .wrangler -.dev.vars \ No newline at end of file +.dev.vars + +# Package lock files (project uses pnpm) +package-lock.json \ No newline at end of file diff --git a/.react-router/types/+future.ts b/.react-router/types/+future.ts new file mode 100644 index 0000000..8ed2f6a --- /dev/null +++ b/.react-router/types/+future.ts @@ -0,0 +1,9 @@ +// Generated by React Router + +import "react-router"; + +declare module "react-router" { + interface Future { + unstable_middleware: false + } +} \ No newline at end of file diff --git a/.react-router/types/+register.ts b/.react-router/types/+register.ts deleted file mode 100644 index 71ff798..0000000 --- a/.react-router/types/+register.ts +++ /dev/null @@ -1,13 +0,0 @@ -import "react-router"; - -declare module "react-router" { - interface Register { - params: Params; - } -} - -type Params = { - "/": {}; - "/": {}; - "/smithery": {}; -}; \ No newline at end of file diff --git a/.react-router/types/+routes.ts b/.react-router/types/+routes.ts new file mode 100644 index 0000000..5fbca71 --- /dev/null +++ b/.react-router/types/+routes.ts @@ -0,0 +1,50 @@ +// Generated by React Router + +import "react-router" + +declare module "react-router" { + interface Register { + pages: Pages + routeFiles: RouteFiles + } +} + +type Pages = { + "/": { + params: {}; + }; + "/docs": { + params: {}; + }; + "/docs/:path": { + params: { + "path": string; + }; + }; + "/smithery": { + params: {}; + }; +}; + +type RouteFiles = { + "root.tsx": { + id: "root"; + page: "/" | "/docs" | "/docs/:path" | "/smithery"; + }; + "routes/home.tsx": { + id: "routes/home"; + page: "/"; + }; + "routes/docs._index.tsx": { + id: "routes/docs._index"; + page: "/docs"; + }; + "routes/docs.$path.tsx": { + id: "routes/docs.$path"; + page: "/docs/:path"; + }; + "routes/smithery.ts": { + id: "routes/smithery"; + page: "/smithery"; + }; +}; \ No newline at end of file diff --git a/.react-router/types/+virtual.d.ts b/.react-router/types/+server-build.d.ts similarity index 88% rename from .react-router/types/+virtual.d.ts rename to .react-router/types/+server-build.d.ts index 512fadf..b4b4237 100644 --- a/.react-router/types/+virtual.d.ts +++ b/.react-router/types/+server-build.d.ts @@ -1,3 +1,5 @@ +// Generated by React Router + declare module "virtual:react-router/server-build" { import { ServerBuild } from "react-router"; export const assets: ServerBuild["assets"]; @@ -8,6 +10,7 @@ declare module "virtual:react-router/server-build" { export const isSpaMode: ServerBuild["isSpaMode"]; export const prerender: ServerBuild["prerender"]; export const publicPath: ServerBuild["publicPath"]; + export const routeDiscovery: ServerBuild["routeDiscovery"]; export const routes: ServerBuild["routes"]; export const ssr: ServerBuild["ssr"]; export const unstable_getCriticalCss: ServerBuild["unstable_getCriticalCss"]; diff --git a/.react-router/types/app/+types/root.ts b/.react-router/types/app/+types/root.ts index d79f252..e445113 100644 --- a/.react-router/types/app/+types/root.ts +++ b/.react-router/types/app/+types/root.ts @@ -1,42 +1,59 @@ -// React Router generated types for route: -// root.tsx - -import type * as T from "react-router/route-module" - +// Generated by React Router +import type { GetInfo, GetAnnotations } from "react-router/internal"; type Module = typeof import("../root.js") -export type Info = { - parents: [], - id: "root" - file: "root.tsx" - path: "" - params: {} & { [key: string]: string | undefined } +type Info = GetInfo<{ + file: "root.tsx", module: Module - loaderData: T.CreateLoaderData - actionData: T.CreateActionData -} +}> + +type Matches = [{ + id: "root"; + module: typeof import("../root.js"); +}]; + +type Annotations = GetAnnotations; export namespace Route { - export type LinkDescriptors = T.LinkDescriptors - export type LinksFunction = () => LinkDescriptors - - export type MetaArgs = T.CreateMetaArgs - export type MetaDescriptors = T.MetaDescriptors - export type MetaFunction = (args: MetaArgs) => MetaDescriptors - - export type HeadersArgs = T.HeadersArgs - export type HeadersFunction = (args: HeadersArgs) => Headers | HeadersInit - - export type unstable_MiddlewareFunction = T.CreateServerMiddlewareFunction - export type unstable_ClientMiddlewareFunction = T.CreateClientMiddlewareFunction - export type LoaderArgs = T.CreateServerLoaderArgs - export type ClientLoaderArgs = T.CreateClientLoaderArgs - export type ActionArgs = T.CreateServerActionArgs - export type ClientActionArgs = T.CreateClientActionArgs - - export type HydrateFallbackProps = T.CreateHydrateFallbackProps - export type ComponentProps = T.CreateComponentProps - export type ErrorBoundaryProps = T.CreateErrorBoundaryProps + // links + export type LinkDescriptors = Annotations["LinkDescriptors"]; + export type LinksFunction = Annotations["LinksFunction"]; + + // meta + export type MetaArgs = Annotations["MetaArgs"]; + export type MetaDescriptors = Annotations["MetaDescriptors"]; + export type MetaFunction = Annotations["MetaFunction"]; + + // headers + export type HeadersArgs = Annotations["HeadersArgs"]; + export type HeadersFunction = Annotations["HeadersFunction"]; + + // unstable_middleware + export type unstable_MiddlewareFunction = Annotations["unstable_MiddlewareFunction"]; + + // unstable_clientMiddleware + export type unstable_ClientMiddlewareFunction = Annotations["unstable_ClientMiddlewareFunction"]; + + // loader + export type LoaderArgs = Annotations["LoaderArgs"]; + + // clientLoader + export type ClientLoaderArgs = Annotations["ClientLoaderArgs"]; + + // action + export type ActionArgs = Annotations["ActionArgs"]; + + // clientAction + export type ClientActionArgs = Annotations["ClientActionArgs"]; + + // HydrateFallback + export type HydrateFallbackProps = Annotations["HydrateFallbackProps"]; + + // Component + export type ComponentProps = Annotations["ComponentProps"]; + + // ErrorBoundary + export type ErrorBoundaryProps = Annotations["ErrorBoundaryProps"]; } \ No newline at end of file diff --git a/.react-router/types/app/routes/+types/docs.$path.ts b/.react-router/types/app/routes/+types/docs.$path.ts new file mode 100644 index 0000000..d553339 --- /dev/null +++ b/.react-router/types/app/routes/+types/docs.$path.ts @@ -0,0 +1,62 @@ +// Generated by React Router + +import type { GetInfo, GetAnnotations } from "react-router/internal"; + +type Module = typeof import("../docs.$path.js") + +type Info = GetInfo<{ + file: "routes/docs.$path.tsx", + module: Module +}> + +type Matches = [{ + id: "root"; + module: typeof import("../../root.js"); +}, { + id: "routes/docs.$path"; + module: typeof import("../docs.$path.js"); +}]; + +type Annotations = GetAnnotations; + +export namespace Route { + // links + export type LinkDescriptors = Annotations["LinkDescriptors"]; + export type LinksFunction = Annotations["LinksFunction"]; + + // meta + export type MetaArgs = Annotations["MetaArgs"]; + export type MetaDescriptors = Annotations["MetaDescriptors"]; + export type MetaFunction = Annotations["MetaFunction"]; + + // headers + export type HeadersArgs = Annotations["HeadersArgs"]; + export type HeadersFunction = Annotations["HeadersFunction"]; + + // unstable_middleware + export type unstable_MiddlewareFunction = Annotations["unstable_MiddlewareFunction"]; + + // unstable_clientMiddleware + export type unstable_ClientMiddlewareFunction = Annotations["unstable_ClientMiddlewareFunction"]; + + // loader + export type LoaderArgs = Annotations["LoaderArgs"]; + + // clientLoader + export type ClientLoaderArgs = Annotations["ClientLoaderArgs"]; + + // action + export type ActionArgs = Annotations["ActionArgs"]; + + // clientAction + export type ClientActionArgs = Annotations["ClientActionArgs"]; + + // HydrateFallback + export type HydrateFallbackProps = Annotations["HydrateFallbackProps"]; + + // Component + export type ComponentProps = Annotations["ComponentProps"]; + + // ErrorBoundary + export type ErrorBoundaryProps = Annotations["ErrorBoundaryProps"]; +} \ No newline at end of file diff --git a/.react-router/types/app/routes/+types/docs._index.ts b/.react-router/types/app/routes/+types/docs._index.ts new file mode 100644 index 0000000..3561799 --- /dev/null +++ b/.react-router/types/app/routes/+types/docs._index.ts @@ -0,0 +1,62 @@ +// Generated by React Router + +import type { GetInfo, GetAnnotations } from "react-router/internal"; + +type Module = typeof import("../docs._index.js") + +type Info = GetInfo<{ + file: "routes/docs._index.tsx", + module: Module +}> + +type Matches = [{ + id: "root"; + module: typeof import("../../root.js"); +}, { + id: "routes/docs._index"; + module: typeof import("../docs._index.js"); +}]; + +type Annotations = GetAnnotations; + +export namespace Route { + // links + export type LinkDescriptors = Annotations["LinkDescriptors"]; + export type LinksFunction = Annotations["LinksFunction"]; + + // meta + export type MetaArgs = Annotations["MetaArgs"]; + export type MetaDescriptors = Annotations["MetaDescriptors"]; + export type MetaFunction = Annotations["MetaFunction"]; + + // headers + export type HeadersArgs = Annotations["HeadersArgs"]; + export type HeadersFunction = Annotations["HeadersFunction"]; + + // unstable_middleware + export type unstable_MiddlewareFunction = Annotations["unstable_MiddlewareFunction"]; + + // unstable_clientMiddleware + export type unstable_ClientMiddlewareFunction = Annotations["unstable_ClientMiddlewareFunction"]; + + // loader + export type LoaderArgs = Annotations["LoaderArgs"]; + + // clientLoader + export type ClientLoaderArgs = Annotations["ClientLoaderArgs"]; + + // action + export type ActionArgs = Annotations["ActionArgs"]; + + // clientAction + export type ClientActionArgs = Annotations["ClientActionArgs"]; + + // HydrateFallback + export type HydrateFallbackProps = Annotations["HydrateFallbackProps"]; + + // Component + export type ComponentProps = Annotations["ComponentProps"]; + + // ErrorBoundary + export type ErrorBoundaryProps = Annotations["ErrorBoundaryProps"]; +} \ No newline at end of file diff --git a/.react-router/types/app/routes/+types/home.ts b/.react-router/types/app/routes/+types/home.ts index 3d5facf..cf23cdb 100644 --- a/.react-router/types/app/routes/+types/home.ts +++ b/.react-router/types/app/routes/+types/home.ts @@ -1,42 +1,62 @@ -// React Router generated types for route: -// routes/home.tsx +// Generated by React Router -import type * as T from "react-router/route-module" - -import type { Info as Parent0 } from "../../+types/root.js" +import type { GetInfo, GetAnnotations } from "react-router/internal"; type Module = typeof import("../home.js") -export type Info = { - parents: [Parent0], - id: "routes/home" - file: "routes/home.tsx" - path: "/" - params: {} & { [key: string]: string | undefined } +type Info = GetInfo<{ + file: "routes/home.tsx", module: Module - loaderData: T.CreateLoaderData - actionData: T.CreateActionData -} +}> + +type Matches = [{ + id: "root"; + module: typeof import("../../root.js"); +}, { + id: "routes/home"; + module: typeof import("../home.js"); +}]; + +type Annotations = GetAnnotations; export namespace Route { - export type LinkDescriptors = T.LinkDescriptors - export type LinksFunction = () => LinkDescriptors - - export type MetaArgs = T.CreateMetaArgs - export type MetaDescriptors = T.MetaDescriptors - export type MetaFunction = (args: MetaArgs) => MetaDescriptors - - export type HeadersArgs = T.HeadersArgs - export type HeadersFunction = (args: HeadersArgs) => Headers | HeadersInit - - export type unstable_MiddlewareFunction = T.CreateServerMiddlewareFunction - export type unstable_ClientMiddlewareFunction = T.CreateClientMiddlewareFunction - export type LoaderArgs = T.CreateServerLoaderArgs - export type ClientLoaderArgs = T.CreateClientLoaderArgs - export type ActionArgs = T.CreateServerActionArgs - export type ClientActionArgs = T.CreateClientActionArgs - - export type HydrateFallbackProps = T.CreateHydrateFallbackProps - export type ComponentProps = T.CreateComponentProps - export type ErrorBoundaryProps = T.CreateErrorBoundaryProps + // links + export type LinkDescriptors = Annotations["LinkDescriptors"]; + export type LinksFunction = Annotations["LinksFunction"]; + + // meta + export type MetaArgs = Annotations["MetaArgs"]; + export type MetaDescriptors = Annotations["MetaDescriptors"]; + export type MetaFunction = Annotations["MetaFunction"]; + + // headers + export type HeadersArgs = Annotations["HeadersArgs"]; + export type HeadersFunction = Annotations["HeadersFunction"]; + + // unstable_middleware + export type unstable_MiddlewareFunction = Annotations["unstable_MiddlewareFunction"]; + + // unstable_clientMiddleware + export type unstable_ClientMiddlewareFunction = Annotations["unstable_ClientMiddlewareFunction"]; + + // loader + export type LoaderArgs = Annotations["LoaderArgs"]; + + // clientLoader + export type ClientLoaderArgs = Annotations["ClientLoaderArgs"]; + + // action + export type ActionArgs = Annotations["ActionArgs"]; + + // clientAction + export type ClientActionArgs = Annotations["ClientActionArgs"]; + + // HydrateFallback + export type HydrateFallbackProps = Annotations["HydrateFallbackProps"]; + + // Component + export type ComponentProps = Annotations["ComponentProps"]; + + // ErrorBoundary + export type ErrorBoundaryProps = Annotations["ErrorBoundaryProps"]; } \ No newline at end of file diff --git a/.react-router/types/app/routes/+types/smithery.ts b/.react-router/types/app/routes/+types/smithery.ts index 0b147bd..f7cfa74 100644 --- a/.react-router/types/app/routes/+types/smithery.ts +++ b/.react-router/types/app/routes/+types/smithery.ts @@ -1,42 +1,62 @@ -// React Router generated types for route: -// routes/smithery.ts +// Generated by React Router -import type * as T from "react-router/route-module" - -import type { Info as Parent0 } from "../../+types/root.js" +import type { GetInfo, GetAnnotations } from "react-router/internal"; type Module = typeof import("../smithery.js") -export type Info = { - parents: [Parent0], - id: "routes/smithery" - file: "routes/smithery.ts" - path: "smithery" - params: {} & { [key: string]: string | undefined } +type Info = GetInfo<{ + file: "routes/smithery.ts", module: Module - loaderData: T.CreateLoaderData - actionData: T.CreateActionData -} +}> + +type Matches = [{ + id: "root"; + module: typeof import("../../root.js"); +}, { + id: "routes/smithery"; + module: typeof import("../smithery.js"); +}]; + +type Annotations = GetAnnotations; export namespace Route { - export type LinkDescriptors = T.LinkDescriptors - export type LinksFunction = () => LinkDescriptors - - export type MetaArgs = T.CreateMetaArgs - export type MetaDescriptors = T.MetaDescriptors - export type MetaFunction = (args: MetaArgs) => MetaDescriptors - - export type HeadersArgs = T.HeadersArgs - export type HeadersFunction = (args: HeadersArgs) => Headers | HeadersInit - - export type unstable_MiddlewareFunction = T.CreateServerMiddlewareFunction - export type unstable_ClientMiddlewareFunction = T.CreateClientMiddlewareFunction - export type LoaderArgs = T.CreateServerLoaderArgs - export type ClientLoaderArgs = T.CreateClientLoaderArgs - export type ActionArgs = T.CreateServerActionArgs - export type ClientActionArgs = T.CreateClientActionArgs - - export type HydrateFallbackProps = T.CreateHydrateFallbackProps - export type ComponentProps = T.CreateComponentProps - export type ErrorBoundaryProps = T.CreateErrorBoundaryProps + // links + export type LinkDescriptors = Annotations["LinkDescriptors"]; + export type LinksFunction = Annotations["LinksFunction"]; + + // meta + export type MetaArgs = Annotations["MetaArgs"]; + export type MetaDescriptors = Annotations["MetaDescriptors"]; + export type MetaFunction = Annotations["MetaFunction"]; + + // headers + export type HeadersArgs = Annotations["HeadersArgs"]; + export type HeadersFunction = Annotations["HeadersFunction"]; + + // unstable_middleware + export type unstable_MiddlewareFunction = Annotations["unstable_MiddlewareFunction"]; + + // unstable_clientMiddleware + export type unstable_ClientMiddlewareFunction = Annotations["unstable_ClientMiddlewareFunction"]; + + // loader + export type LoaderArgs = Annotations["LoaderArgs"]; + + // clientLoader + export type ClientLoaderArgs = Annotations["ClientLoaderArgs"]; + + // action + export type ActionArgs = Annotations["ActionArgs"]; + + // clientAction + export type ClientActionArgs = Annotations["ClientActionArgs"]; + + // HydrateFallback + export type HydrateFallbackProps = Annotations["HydrateFallbackProps"]; + + // Component + export type ComponentProps = Annotations["ComponentProps"]; + + // ErrorBoundary + export type ErrorBoundaryProps = Annotations["ErrorBoundaryProps"]; } \ No newline at end of file diff --git a/app/components/docs-layout.tsx b/app/components/docs-layout.tsx new file mode 100644 index 0000000..010cf5c --- /dev/null +++ b/app/components/docs-layout.tsx @@ -0,0 +1,61 @@ +import { Link } from "@heroui/link"; +import { Navbar } from "~/components/navbar"; +import { ReactNode } from "react"; +import { getNavigation } from "~/lib/docs-config"; + +interface DocsLayoutProps { + children: ReactNode; + title?: string; +} + +export const DocsLayout = ({ children, title }: DocsLayoutProps) => { + const navigationSections = getNavigation(); + + return ( +
+ +
+ {/* Sidebar */} + + + {/* Main content */} +
+
+ {title && ( +
+

+ {title} +

+
+ )} + {children} +
+
+
+
+ ); +}; \ No newline at end of file diff --git a/app/components/mcpc-mention-input.tsx b/app/components/mcpc-mention-input.tsx index b746554..f742398 100644 --- a/app/components/mcpc-mention-input.tsx +++ b/app/components/mcpc-mention-input.tsx @@ -123,7 +123,7 @@ export const McpcMentionInput: React.FC = ({ }} ref={mentionRef} trigger=">" - suggestions={servers.map((server) => ({ + suggestions={(servers || []).map((server) => ({ ...server, id: server.qualifiedName, }))} diff --git a/app/components/tiptap-renderer.tsx b/app/components/tiptap-renderer.tsx new file mode 100644 index 0000000..9f1e15a --- /dev/null +++ b/app/components/tiptap-renderer.tsx @@ -0,0 +1,53 @@ +import { useEditor, EditorContent } from '@tiptap/react'; +import StarterKit from '@tiptap/starter-kit'; +import Typography from '@tiptap/extension-typography'; +import { useEffect } from 'react'; + +interface TiptapRendererProps { + content: string; + className?: string; +} + +export const TiptapRenderer = ({ content, className = "" }: TiptapRendererProps) => { + const editor = useEditor({ + extensions: [ + StarterKit, + Typography, + ], + content: '', + editable: false, + editorProps: { + attributes: { + class: `prose prose-gray dark:prose-invert max-w-none ${className}`, + }, + }, + }); + + useEffect(() => { + if (editor && content) { + // Parse markdown-style content for basic display + // This is a simple implementation - for full markdown support, + // you'd need a markdown parser like markdown-it + const htmlContent = content + .replace(/^# (.*$)/gim, '

$1

') + .replace(/^## (.*$)/gim, '

$1

') + .replace(/^### (.*$)/gim, '

$1

') + .replace(/\*\*(.*?)\*\*/gim, '$1') + .replace(/\*(.*?)\*/gim, '$1') + .replace(/`(.*?)`/gim, '$1') + .replace(/\n/gim, '
'); + + editor.commands.setContent(htmlContent); + } + }, [editor, content]); + + if (!editor) { + return ( +
+
Loading content...
+
+ ); + } + + return ; +}; \ No newline at end of file diff --git a/app/config/site.ts b/app/config/site.ts index b1861fa..6086c4c 100644 --- a/app/config/site.ts +++ b/app/config/site.ts @@ -2,17 +2,29 @@ export type SiteConfig = typeof siteConfig; export const siteConfig = { name: "MCP Compose", - description: "MCP Compose", + description: "Create your agentic MCP server with a single prompt. Powered by the composition of thousands of MCPs.", navItems: [ { label: "Home", href: "/", }, + { + label: "Documentation", + href: "/docs", + }, ], navMenuItems: [ { - label: "Profile", - href: "/profile", + label: "Home", + href: "/", + }, + { + label: "Documentation", + href: "/docs", + }, + { + label: "GitHub", + href: "https://github.com/mcpc-tech/mcpc", }, ], links: { diff --git a/app/lib/docs-config.ts b/app/lib/docs-config.ts new file mode 100644 index 0000000..e05e99b --- /dev/null +++ b/app/lib/docs-config.ts @@ -0,0 +1,96 @@ +interface RouteConfig { + path: string; + title: string; + description: string; + file: string; +} + +interface NavigationSection { + section: string; + items: Array<{ + path: string; + title: string; + }>; +} + +interface DocsConfig { + routes: RouteConfig[]; + navigation: NavigationSection[]; +} + +// Static configuration instead of reading from YAML file +const DOCS_CONFIG: DocsConfig = { + routes: [ + { + path: "/", + title: "Overview", + description: "Learn how to create agentic MCP servers with MCPC", + file: "/docs/index.mdx" + }, + { + path: "/installation", + title: "Installation", + description: "Install and set up MCPC in your project", + file: "/docs/installation.mdx" + }, + { + path: "/quick-start", + title: "Quick Start", + description: "Get started with MCPC in minutes", + file: "/docs/quick-start.mdx" + }, + { + path: "/api/core", + title: "Core API", + description: "Core MCPC API reference", + file: "/docs/api/core.mdx" + }, + { + path: "/api/configuration", + title: "Configuration", + description: "Configuration options and settings", + file: "/docs/api/configuration.mdx" + }, + { + path: "/examples/basic", + title: "Basic Examples", + description: "Basic usage patterns and examples", + file: "/docs/examples/basic.mdx" + } + ], + navigation: [ + { + section: "Getting Started", + items: [ + { path: "/", title: "Overview" }, + { path: "/installation", title: "Installation" }, + { path: "/quick-start", title: "Quick Start" } + ] + }, + { + section: "API Reference", + items: [ + { path: "/api/core", title: "Core API" }, + { path: "/api/configuration", title: "Configuration" } + ] + }, + { + section: "Examples", + items: [ + { path: "/examples/basic", title: "Basic Examples" } + ] + } + ] +}; + +export function getDocsConfig(): DocsConfig { + return DOCS_CONFIG; +} + +export function getRouteByPath(routePath: string): RouteConfig | undefined { + return DOCS_CONFIG.routes.find(route => route.path === routePath); +} + +export function getNavigation(): NavigationSection[] { + return DOCS_CONFIG.navigation; +} \ No newline at end of file diff --git a/app/lib/use-mdx-content.ts b/app/lib/use-mdx-content.ts new file mode 100644 index 0000000..ba6700c --- /dev/null +++ b/app/lib/use-mdx-content.ts @@ -0,0 +1,28 @@ +import { useEffect, useState } from "react"; + +export const useMdxContent = (path: string) => { + const [content, setContent] = useState(""); + const [loading, setLoading] = useState(true); + const [error, setError] = useState(null); + + useEffect(() => { + fetch(path) + .then((response) => { + if (!response.ok) { + throw new Error(`Failed to load ${path}`); + } + return response.text(); + }) + .then((text) => { + setContent(text); + setLoading(false); + }) + .catch((error) => { + console.error("Error loading MDX content:", error); + setError(error.message); + setLoading(false); + }); + }, [path]); + + return { content, loading, error }; +}; \ No newline at end of file diff --git a/app/root.tsx b/app/root.tsx index 36dbd91..1b4d6b8 100644 --- a/app/root.tsx +++ b/app/root.tsx @@ -1,10 +1,18 @@ import { Links, Meta, Outlet, Scripts, ScrollRestoration } from "react-router"; import type { LinksFunction } from "react-router"; +import { HeroUIProvider } from "@heroui/react"; import "./tailwind.css"; import React from "react"; -export const links: LinksFunction = () => []; +export const links: LinksFunction = () => [ + { + rel: "stylesheet", + href: "https://cdn.jsdelivr.net/npm/katex@0.16.22/dist/katex.min.css", + integrity: "sha384-5TPbERKFCq9kJZeKLNgTi+4sYd8lnzAv7jj0Pk0Xh1bYPPjO8DgtJ6ZcfLO6qBNb", + crossOrigin: "anonymous" + } +]; export function Layout({ children }: { children: React.ReactNode }) { return ( @@ -16,7 +24,9 @@ export function Layout({ children }: { children: React.ReactNode }) { - {children} + + {children} + diff --git a/app/routes/docs.$path.tsx b/app/routes/docs.$path.tsx new file mode 100644 index 0000000..2f7780d --- /dev/null +++ b/app/routes/docs.$path.tsx @@ -0,0 +1,54 @@ +import { type RouteConfig, redirect } from "react-router"; +import type { Route } from "./+types/docs.$path"; +import { DocsLayout } from "~/components/docs-layout"; +import { TiptapRenderer } from "~/components/tiptap-renderer"; +import { useMdxContent } from "~/lib/use-mdx-content"; +import { getRouteByPath } from "~/lib/docs-config"; + +export async function loader({ params }: Route.LoaderArgs) { + const path = params.path === undefined ? "/" : `/${params.path}`; + + const route = getRouteByPath(path); + + if (!route) { + throw redirect("/docs"); + } + + return { route }; +} + +export function meta({ data }: Route.MetaArgs) { + if (!data?.route) { + return [{ title: "Documentation - MCPC" }]; + } + + const { route } = data; + return [ + { title: `${route.title} - MCPC Documentation` }, + { + name: "description", + content: route.description, + }, + ]; +} + +export default function DocsPage({ loaderData }: Route.ComponentProps) { + const { route } = loaderData; + const { content, loading, error } = useMdxContent(route.file); + + return ( + + {loading ? ( +
+
Loading documentation...
+
+ ) : error ? ( +
+
Error loading documentation: {error}
+
+ ) : ( + + )} + + ); +} \ No newline at end of file diff --git a/app/routes/docs._index.tsx b/app/routes/docs._index.tsx new file mode 100644 index 0000000..216269f --- /dev/null +++ b/app/routes/docs._index.tsx @@ -0,0 +1,52 @@ +import { type RouteConfig, redirect } from "react-router"; +import type { Route } from "./+types/docs._index"; +import { DocsLayout } from "~/components/docs-layout"; +import { TiptapRenderer } from "~/components/tiptap-renderer"; +import { useMdxContent } from "~/lib/use-mdx-content"; +import { getRouteByPath } from "~/lib/docs-config"; + +export async function loader({ params }: Route.LoaderArgs) { + const route = getRouteByPath("/"); + + if (!route) { + throw redirect("/docs"); + } + + return { route }; +} + +export function meta({ data }: Route.MetaArgs) { + if (!data?.route) { + return [{ title: "Documentation - MCPC" }]; + } + + const { route } = data; + return [ + { title: `${route.title} - MCPC Documentation` }, + { + name: "description", + content: route.description, + }, + ]; +} + +export default function DocsIndexPage({ loaderData }: Route.ComponentProps) { + const { route } = loaderData; + const { content, loading, error } = useMdxContent(route.file); + + return ( + + {loading ? ( +
+
Loading documentation...
+
+ ) : error ? ( +
+
Error loading documentation: {error}
+
+ ) : ( + + )} + + ); +} \ No newline at end of file diff --git a/app/routes/home.tsx b/app/routes/home.tsx index 995b1bc..6c24bc4 100644 --- a/app/routes/home.tsx +++ b/app/routes/home.tsx @@ -223,11 +223,43 @@ export default function Index() { Create Your Agentic MCP Server - {" "} - with a Single Prompt. + + with a Single Prompt.
Powered by the composition of thousands of MCPs, Try it out below.
+ + {/* Get Started Section */} +
+ + + +
+