add cardano course and include sources in ai chat

Author: smutyala1at

apps/docs/.env.example

@@ -1,13 +1,2 @@
-# Mimir RAG backend configuration
-MIMIR_BASE_URL=http://localhost:3000
-MIMIR_API_KEY=your-api-key-here
-
-# SEO Verification Codes (Optional - Add when ready)
-# Get these from respective webmaster tools:
-# Google Search Console: https://search.google.com/search-console
-# Bing Webmaster Tools: https://www.bing.com/webmasters
-# Yandex Webmaster: https://webmaster.yandex.com
-
-NEXT_PUBLIC_GOOGLE_SITE_VERIFICATION=
-NEXT_PUBLIC_BING_SITE_VERIFICATION=
-NEXT_PUBLIC_YANDEX_SITE_VERIFICATION=
+BACKEND_BASE_URL=http://localhost:3000/v1
+API_KEY=your-api-key-here

apps/docs/app/api/chat/route.ts

@@ -0,0 +1,51 @@
+export const runtime = 'edge';
+
+const apiKey = process.env.API_KEY;
+const backendUrl = process.env.BACKEND_BASE_URL;
+
+export async function POST(req: Request) {
+  try {
+    const body = await req.json();
+
+    const response = await fetch(`${backendUrl}/chat/completions`, {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+        'Authorization': `Bearer ${apiKey}`,
+      },
+      body: JSON.stringify({
+        ...body,
+        stream: true,
+      }),
+    });
+
+    if (!response.ok) {
+      return new Response(
+        JSON.stringify({
+          error: `Backend error: ${response.status} ${response.statusText}`
+        }),
+        {
+          status: response.status,
+          headers: { 'Content-Type': 'application/json' }
+        }
+      );
+    }
+
+    return new Response(response.body, {
+      headers: {
+        'Content-Type': 'text/event-stream',
+        'Cache-Control': 'no-cache',
+        'Connection': 'keep-alive',
+      },
+    });
+  } catch (error) {
+    console.error('API route error:', error);
+    return new Response(
+      JSON.stringify({ error: 'Internal server error' }),
+      {
+        status: 500,
+        headers: { 'Content-Type': 'application/json' }
+      }
+    );
+  }
+}

apps/docs/app/api/chat/routes.ts

@@ -65,15 +65,15 @@ export const metadata: Metadata = {
     type: 'website',
     locale: 'en_US',
     url: 'https://meshjs.dev',
-    siteName: 'Mesh - Cardano TypeScript SDK',
-    title: 'Mesh - Open-Source TypeScript SDK for Cardano Blockchain Development',
-    description: 'Ship UTXO dApps faster with Mesh. The open-source TypeScript SDK for Cardano blockchain development with React components, wallet integrations, and transaction builders. Trusted by 1M+ downloads.',
+    siteName: 'Mesh SDK',
+    title: 'Mesh - TypeScript SDK for Cardano Blockchain',
+    description: 'Open-source TypeScript SDK for Cardano. Build dApps faster with React components, wallet integrations & transaction builders. 1M+ downloads.',
     images: [
       {
-        url: '/home/hero.png',
-        width: 1200,
-        height: 630,
-        alt: 'Mesh - TypeScript SDK for Cardano - Build dApps faster',
+        url: 'https://meshjs.dev/logo-mesh/mesh.png',
+        width: 1000,
+        height: 500,
+        alt: 'Mesh SDK - Build Cardano dApps faster',
         type: 'image/png',
       },
     ],
@@ -82,9 +82,9 @@ export const metadata: Metadata = {
     card: 'summary_large_image',
     site: '@meshsdk',
     creator: '@meshsdk',
-    title: 'Mesh - Open-Source TypeScript SDK for Cardano',
-    description: 'Ship UTXO dApps faster with Mesh. Less than 60kB, production-ready, with 1M+ downloads. Build Cardano blockchain applications with TypeScript.',
-    images: ['/home/hero.png'],
+    title: 'Mesh - TypeScript SDK for Cardano Blockchain',
+    description: 'Open-source TypeScript SDK for Cardano. Build dApps faster with React components & transaction builders. 1M+ downloads.',
+    images: ['https://meshjs.dev/logo-mesh/mesh.png'],
   },
   icons: {
     icon: '/favicon.ico',

apps/docs/app/layout.tsx

@@ -213,22 +213,30 @@ const roleName: Record<string, string> = {
 
 function Message({
   message,
+  isStreaming,
   ...props
-}: { message: UIMessage } & ComponentProps<'div'>) {
+}: { message: UIMessage; isStreaming?: boolean } & ComponentProps<'div'>) {
   let markdown = '';
-  let links: z.infer<typeof ProvideLinksToolSchema>['links'] = [];
+  let sources: Array<{ url: string; title?: string; sourceId: string }> = [];
 
   for (const part of message.parts ?? []) {
     if (part.type === 'text') {
       markdown += part.text;
       continue;
     }
 
-    if (part.type === 'tool-provideLinks' && part.input) {
-      links = (part.input as z.infer<typeof ProvideLinksToolSchema>).links;
+    if (part.type === 'source-url') {
+      sources.push({
+        url: part.url,
+        title: part.title,
+        sourceId: part.sourceId
+      });
     }
   }
 
+  // Only show sources if message is not currently streaming (i.e., completed)
+  const showSources = !isStreaming;
+
   return (
     <div {...props}>
       <p
@@ -244,29 +252,34 @@ function Message({
       <div className="prose text-sm">
         <Markdown text={markdown} />
       </div>
-      {links && links.length > 0 ? (
+      {showSources && sources.length > 0 && (
         <div className="mt-2 flex flex-row flex-wrap items-center gap-1">
-          {links.map((item, i) => (
+          {sources.map((source, i) => (
             <Link
-              key={i}
-              href={item.url}
+              key={source.sourceId || i}
+              href={source.url}
               className="block text-xs rounded-lg border p-3 hover:bg-fd-accent hover:text-fd-accent-foreground"
             >
-              <p className="font-medium">{item.title}</p>
-              <p className="text-fd-muted-foreground">Reference {item.label}</p>
+              <p className="font-medium">{source.title || 'Source'}</p>
+              <p className="text-fd-muted-foreground">Reference {i + 1}</p>
             </Link>
           ))}
         </div>
-      ) : null}
+      )}
     </div>
   );
 }
 
 export function AISearch(props: DialogProps) {
+  const apiUrl = '/api/chat';
+
   const chat = useChat({
     id: 'search',
     transport: new DefaultChatTransport({
-      api: '/api/chat',
+      api: apiUrl,
+      body: {
+        stream: true,
+      },
     }),
     messages: getInitialChatHistory()
   });
@@ -321,8 +334,12 @@ export function AISearch(props: DialogProps) {
               }}
             >
               <div className="flex flex-col gap-4 p-3">
-                {messages.map((item) => (
-                  <Message key={item.id} message={item} />
+                {messages.map((item, index) => (
+                  <Message
+                    key={item.id}
+                    message={item}
+                    isStreaming={index === messages.length - 1 && (chat.status === 'streaming' || chat.status === 'submitted')}
+                  />
                 ))}
               </div>
             </List>
@@ -348,10 +365,15 @@ export function AISearch(props: DialogProps) {
 
 
 export function MobileAISearch(props: DialogProps) {
+  const apiUrl = '/api/chat';
+
   const chat = useChat({
     id: 'search',
     transport: new DefaultChatTransport({
-      api: '/api/chat',
+      api: apiUrl,
+      body: {
+        stream: true,
+      },
     }),
     messages: getInitialChatHistory()
   });
@@ -407,8 +429,12 @@ export function MobileAISearch(props: DialogProps) {
                 className='max-h-[calc(100dvh-240px)]'
               >
                 <div className="flex flex-col gap-4 p-3">
-                  {messages.map((item) => (
-                    <Message key={item.id} message={item} />
+                  {messages.map((item, index) => (
+                    <Message
+                      key={item.id}
+                      message={item}
+                      isStreaming={index === messages.length - 1 && (chat.status === 'streaming' || chat.status === 'submitted')}
+                    />
                   ))}
                 </div>
               </List>

apps/docs/components/ai/search.tsx

@@ -4,6 +4,7 @@ import {linksApi} from "@/data/links-api";
 import {metaGuides} from "@/data/links-guides";
 import {metaSolutions} from  "@/data/links-solutions";
 import {metaResources} from  "@/data/links-resources";
+import {metaCourse} from  "@/data/links-course";
 import {linksAbout} from  "@/data/links-about";
 
 export default function Footer() {
@@ -70,6 +71,15 @@ export default function Footer() {
             }
           </div>
 
+          <div className='flex flex-col gap-3 [&>a]:hover:underline' key={metaCourse.link}>
+            <Link href={metaCourse.link} className='font-bold'>{metaCourse.title.toUpperCase()}</Link>
+            {
+              "items" in metaCourse && metaCourse.items.map((item) => (
+                <Link href={item.link} key={item.link}>{item.title}</Link>
+              ))
+            }
+          </div>
+
           {/* About Mesh */}
           <div className='flex flex-col gap-3 [&>a]:hover:underline'>
             <div className='font-bold'>ABOUT MESH</div>

apps/docs/components/ui/Footer.tsx

@@ -25,7 +25,7 @@ In this page, you will find the APIs to create transactions for minting and burn
 
 ## Minting with One Signature
 
-In this section, we will see how to mint native assets with a `MeshTxBuilder`. For minting assets with a smart contract visit [this documentation](https://meshjs.dev/apis/txbuilder/smart-contracts#minting-assets-with-plutus-script).
+In this section, we will see how to mint native assets with a `MeshTxBuilder`. For minting assets with a smart contract visit [this documentation](/apis/txbuilder/smart-contracts#minting-assets-with-plutus-script).
 
 Firstly, we need to define the `forgingScript` with `ForgeScript`. We use the first wallet address as the "minting address" (you can use other addresses).
 

apps/docs/content/docs/apis/txbuilder/minting.mdx

@@ -13,13 +13,21 @@ import {
 } from "@/components/ui/card";
 
 <div className="grid md:grid-cols-2 gap-6 items-stretch">
-  {linksGuides.map((card) => (
-    <Link key={card.title} href={card.link} className="no-underline">
-      <Card className="h-full text-center hover:border-primary/50 transition-colors px-4 py-8">
-        <CardTitle className="font-heading">{card.title}</CardTitle>
-        <CardDescription>{card.desc}</CardDescription>
-      </Card>
-    </Link>
-  ))}
+  {linksGuides.map((card) => {
+    const Icon = card.icon;
+    return (
+      <Link key={card.title} href={card.link} className="no-underline">
+        <Card className="h-full text-center hover:border-primary/50 transition-colors px-4 py-8">
+          {Icon && (
+            <div className="flex justify-center mb-4">
+              <Icon className="w-12 h-12 text-primary" />
+            </div>
+          )}
+          <CardTitle className="font-heading">{card.title}</CardTitle>
+          <CardDescription>{card.desc}</CardDescription>
+        </Card>
+      </Link>
+    );
+  })}
 </div>
 

apps/docs/content/docs/guides/index.mdx

@@ -1,4 +1,4 @@
 {
   "title": "Documentation",
-  "pages": ["./apis/wallets", "./apis/txbuilder", "./apis/txparser", "providers", "./apis/utilities", "react", "svelte", "smart-contracts", "aiken", "hydra", "midnight", "yaci", "guides"]
+  "pages": ["./apis/wallets", "./apis/txbuilder", "./apis/txparser", "providers", "./apis/utilities", "react", "svelte", "smart-contracts", "aiken", "hydra", "midnight", "yaci", "resources"]
 }

apps/docs/content/docs/meta.json

@@ -1,6 +1,6 @@
 ---
 title: "Hydra Provider (beta)"
-desceription: "Layer 2 scaling solution for Cardano that increases transaction throughput and ensures cost efficiency while maintaining security."
+description: "Layer 2 scaling solution for Cardano that increases transaction throughput and ensures cost efficiency while maintaining security."
 ---
 
 import Link from "fumadocs-core/link";