fix: ai search

Cloud-Code-AI · Dec 11, 2024 · 4d832b9 · 4d832b9
1 parent 3da0321
commit 4d832b9
Show file tree

Hide file tree

Showing 3 changed files with 198 additions and 177 deletions.
diff --git a/docs/public/context/en_docs.txt b/docs/public/context/en_docs.txt
@@ -474,6 +474,55 @@ Code example:
     },
 }
 -------------
+[Document: docs/guides/analytics.json]
+Title: Analytics Integration
+Learn how to add analytics tracking to your documentation
+AkiraDocs supports Google Analytics 4 (GA4) out of the box. This guide will help you set up analytics tracking for your documentation.
+Setting up Google Analytics
+1. Create a Google Analytics 4 property in your [Google Analytics account](https://analytics.google.com/)
+2. Get your Measurement ID (starts with "G-")
+3. Add the ID to your `akiradocs.config.json`:
+Code example:
+{
+"analytics": {
+"google": {
+"measurementId": "G-XXXXXXXXXX",
+"enabled": true
+},
+"debug": false
+}
+}
+What's Tracked Automatically
+Page views
+Navigation between pages
+Time on page
+User language preferences
+Device and browser information
+Custom Event Tracking
+You can track custom events using the `useAnalytics` hook:
+Code example:
+import { useAnalytics } from '@/hooks/useAnalytics'
+function MyComponent() {
+    const { track } = useAnalytics()
+    const handleClick = () => {
+        track('doc_rating', {
+            rating: 5,
+            page: 'getting-started',
+            helpful: true
+        })
+    }
+    return <button onClick={handleClick}>This was helpful</button>
+}
+Debug Mode
+Enable debug mode to see analytics events in the console during development:
+Code example:
+{
+"analytics": {
+"debug": true
+}
+}
+This provides a complete analytics integration that's easy for users to set up and extend as needed.
+-------------
 [Document: docs/getting-started/requirements.json]
 Title: System Requirements
 Before installing AkiraDocs, ensure your environment meets the following requirements.
@@ -582,54 +631,98 @@ Code example:
 ✓ Docusaurus
 ✓ ReadTheDocs
 -------------
-[Document: docs/guides/analytics.json]
-Title: Analytics Integration
-Learn how to add analytics tracking to your documentation
-AkiraDocs supports Google Analytics 4 (GA4) out of the box. This guide will help you set up analytics tracking for your documentation.
-Setting up Google Analytics
-1. Create a Google Analytics 4 property in your [Google Analytics account](https://analytics.google.com/)
-2. Get your Measurement ID (starts with "G-")
-3. Add the ID to your `akiradocs.config.json`:
+[Document: docs/editor/overview.json]
+Title: Editor Overview
+AkiraDocs features a modern, Notion-like editor that combines the simplicity of block-based editing with the power of Markdown.
+Editor Interface
+Main Components
+<strong>Toolbar</strong>: Quick access to formatting options and block types
+<strong>Content Area</strong>: Block-based editing space
+<strong>Sidebar</strong>: Navigation and document structure
+<strong>Command Palette</strong>: Quick commands (Ctrl/Cmd + P)
+Block Structure
+Each content element is a block that can be:
+Dragged and dropped to reorganize
+Converted between different types
+Duplicated or deleted
+Nested within other blocks
+Getting Started
+Creating Content
+1. Click the '+' button or press '/' to add a new block
+2. Choose block type from the popup menu
+3. Start typing or add content
+Basic Operations
 Code example:
-{
-"analytics": {
-"google": {
-"measurementId": "G-XXXXXXXXXX",
-"enabled": true
-},
-"debug": false
-}
-}
-What's Tracked Automatically
-Page views
-Navigation between pages
-Time on page
-User language preferences
-Device and browser information
-Custom Event Tracking
-You can track custom events using the `useAnalytics` hook:
+/ → Open block menu
+⌘/Ctrl + P → Command palette
+⌘/Ctrl + / → Show keyboard shortcuts
+↑↓ → Navigate between blocks
+Block Types
+Text Blocks
+Paragraphs
+Headings (H1-H6)
+Lists (Bulleted, Numbered)
+Quotes
+Callouts
+Rich Media
+Images
+Videos
+Embeds
+Files
+Code blocks
+Special Blocks
+Tables (Coming Soon)
+Dividers
+Custom components (Coming Soon)
+-------------
+[Document: docs/editor/features.json]
+Title: Editor Features
+Detailed overview of AkiraDocs editor capabilities and features.
+Block System
+Text Formatting
+<strong>Basic Formatting</strong>
+Bold, italic, underline
+Strikethrough
+Highlight
+Code inline
+<strong>Advanced Formatting</strong>
+Custom colors
+Multiple fonts
+Text alignment
+Indentation
+Content Blocks
+Rich Text
 Code example:
-import { useAnalytics } from '@/hooks/useAnalytics'
-function MyComponent() {
-    const { track } = useAnalytics()
-    const handleClick = () => {
-        track('doc_rating', {
-            rating: 5,
-            page: 'getting-started',
-            helpful: true
-        })
-    }
-    return <button onClick={handleClick}>This was helpful</button>
-}
-Debug Mode
-Enable debug mode to see analytics events in the console during development:
+# Heading 1
+## Heading 2
+> Blockquote
+- Bullet list
+1. Numbered list
+Code Blocks
 Code example:
-{
-"analytics": {
-"debug": true
-}
-}
-This provides a complete analytics integration that's easy for users to set up and extend as needed.
+// Syntax highlighting
+console.log('Hello World');
+Media Blocks
+Image upload and embedding
+Video embedding
+File attachments
+Interactive embeds
+AI Features
+Content Enhancement
+Grammar and style suggestions
+Content optimization
+SEO recommendations
+Translation assistance
+Smart Formatting
+Auto-formatting
+Smart lists
+Table formatting
+Code block language detection
+Collaboration Features
+Version Control
+Git integration
+Change history
+Rollback capabilities
 -------------
 [Document: docs/contributing/how-to-contribute.json]
 Title: Contributing to AkiraDocs
@@ -724,99 +817,6 @@ Instances of abusive, harassing, or otherwise unacceptable behavior may be repor
 Attribution
 This Code of Conduct is adapted from the [Contributor Covenant](https://www.contributor-covenant.org), version 2.0, available at https://www.contributor-covenant.org/version/2/0/code_of_conduct.html.
 -------------
-[Document: docs/editor/overview.json]
-Title: Editor Overview
-AkiraDocs features a modern, Notion-like editor that combines the simplicity of block-based editing with the power of Markdown.
-Editor Interface
-Main Components
-<strong>Toolbar</strong>: Quick access to formatting options and block types
-<strong>Content Area</strong>: Block-based editing space
-<strong>Sidebar</strong>: Navigation and document structure
-<strong>Command Palette</strong>: Quick commands (Ctrl/Cmd + P)
-Block Structure
-Each content element is a block that can be:
-Dragged and dropped to reorganize
-Converted between different types
-Duplicated or deleted
-Nested within other blocks
-Getting Started
-Creating Content
-1. Click the '+' button or press '/' to add a new block
-2. Choose block type from the popup menu
-3. Start typing or add content
-Basic Operations
-Code example:
-/ → Open block menu
-⌘/Ctrl + P → Command palette
-⌘/Ctrl + / → Show keyboard shortcuts
-↑↓ → Navigate between blocks
-Block Types
-Text Blocks
-Paragraphs
-Headings (H1-H6)
-Lists (Bulleted, Numbered)
-Quotes
-Callouts
-Rich Media
-Images
-Videos
-Embeds
-Files
-Code blocks
-Special Blocks
-Tables (Coming Soon)
-Dividers
-Custom components (Coming Soon)
--------------
-[Document: docs/editor/features.json]
-Title: Editor Features
-Detailed overview of AkiraDocs editor capabilities and features.
-Block System
-Text Formatting
-<strong>Basic Formatting</strong>
-Bold, italic, underline
-Strikethrough
-Highlight
-Code inline
-<strong>Advanced Formatting</strong>
-Custom colors
-Multiple fonts
-Text alignment
-Indentation
-Content Blocks
-Rich Text
-Code example:
-# Heading 1
-## Heading 2
-> Blockquote
-- Bullet list
-1. Numbered list
-Code Blocks
-Code example:
-// Syntax highlighting
-console.log('Hello World');
-Media Blocks
-Image upload and embedding
-Video embedding
-File attachments
-Interactive embeds
-AI Features
-Content Enhancement
-Grammar and style suggestions
-Content optimization
-SEO recommendations
-Translation assistance
-Smart Formatting
-Auto-formatting
-Smart lists
-Table formatting
-Code block language detection
-Collaboration Features
-Version Control
-Git integration
-Change history
-Rollback capabilities
--------------
 [Document: docs/content-management/creating-pages.json]
 Title: Creating and Organizing Pages
 Learn how to create, structure, and organize your documentation pages in AkiraDocs. You can create markdown pages or just use the editor UI. Note in _contents folder, you will only see markdown content created by you. If you use Editor UI, the content will be saved in the compiled folder and will be automatically translated to other languages.

diff --git a/docs/src/app/aiSearch/page.tsx b/docs/src/app/aiSearch/page.tsx
@@ -72,7 +72,8 @@ export default function Home() {
     setSources([]) // Reset sources
 
     try {
-      // Updated fetch path to use absolute URL
+      const startEngineTime = performance.now();
+
       const contextResponse = await fetch('/context/en_docs.txt');
       if (!contextResponse.ok) {
         throw new Error(`Failed to fetch context: ${contextResponse.status}`);
@@ -85,47 +86,59 @@ export default function Home() {
         "Llama-3.2-1B-Instruct-q4f16_1-MLC",
         { 
           initProgressCallback: (progress: any) => console.log(progress) 
+        },
+        {
+          context_window_size: 100000,
         }
       );
+
+      const engineLoadTime = performance.now() - startEngineTime;
+      console.log(`Engine initialization took: ${engineLoadTime.toFixed(2)}ms`);
 
       // Prepare messages for the chat with context
       const messages = [
         { 
-          role: "system", 
-          content: `You are a technical documentation assistant specialized in providing accurate, concise answers based on the official documentation. 
-          Your responses should be:
-          1. Direct and to the point
-          2. Based strictly on the provided documentation context
-          3. Include relevant code examples when available
-          4. Written in a technical but clear style
-
-          Documentation context: ${docsContext}`
+            role: "system", 
+            content: `You are a technical documentation assistant specialized in providing accurate, concise answers based on the official documentation. 
+            Your responses should be:
+            1. Direct and to the point
+            2. Based strictly on the provided documentation context
+            3. Include relevant code examples when available
+            4. Written in a technical but clear style
+    
+            Documentation context: ${docsContext}`
         },
         { 
-          role: "user", 
-          content: `Answer the following question using only the provided documentation context. 
-          Question: ${query}
-
-          Requirements for your response:
-          1. If the answer isn't clearly supported by the documentation, say "I don't have enough information to answer this question accurately."
-          2. Don't make assumptions or provide information not found in the documentation
-          3. If relevant, include short code snippets to illustrate your answer.
-          4. Only answer questions related to the Documentaion Context.
-          5. Try to be concise and to the point.
-          
-          After your answer, if you used any sources from the documentation, list them in this format:
-          -------------
-          Sources:
-          - <title> (<path>)` 
+            role: "user", 
+            content: `Answer the following question using only the provided documentation context. 
+            Question: ${query}
+            Requirements for your response:
+            1. If the answer isn't clearly supported by the documentation and you cant find relevant information in the documentation, say \"I don't have enough information to answer this question accurately.\"
+            2. Strictly adhere to the documentation context; do not make assumptions or provide additional commentary.
+            3. Include short code snippets if relevant.
+            4. Only answer questions related to the Documentation Context.
+            5. Be concise and to the point.
+            After your answer, if you used any sources from the documentation, list them in this format:
+            -------------
+            Sources:
+             - <title> (<path>)
+             Example: 
+             Sources:
+              - Welcome to Akira Docs (articles/welcome.json)`
         }
-      ];
+    ];
+
 
       console.log(messages)
 
+      const startChatTime = performance.now();
       // Get response from MLC chatbot
       const reply = await engine.chat.completions.create({ messages: messages as ChatCompletionMessageParam[] });
-      const aiContent = reply.choices[0].message.content || '';
+      const chatCompletionTime = performance.now() - startChatTime;
+      console.log(`Chat completion took: ${chatCompletionTime.toFixed(2)}ms`);
 
+      const aiContent = reply.choices[0].message.content || '';
+      console.log("Response aiContent", aiContent)
       // Extract sources and clean response
       const { cleanResponse, sources } = extractSources(aiContent);