Add docs toggle

package.json

@@ -3,7 +3,8 @@
 	"version": "0.0.1",
 	"private": true,
 	"scripts": {
-		"dev": "npx ai-digest && vite dev",
+		"dev": "vite dev",
+		"aidev": "npx ai-digest && vite dev",
 		"build": "vite build",
 		"preview": "vite preview",
 		"test": "npm run test:integration && npm run test:unit",

src/lib/systemPrompt.ts

@@ -1,6 +1,6 @@
 import docs from './docs.json?raw';
 
-export function getSystemPrompt(): string {
+export function getSystemPromptWithDocs(): string {
   const parsedDocs = JSON.parse(docs);
   const docsContent = parsedDocs.blocks
     .map((block: any) => `${block.breadcrumbs.join(' > ')}\n${block.content}`)
@@ -17,4 +17,14 @@ Here's the latest SvelteKit documentation for your reference:
 ${docsContent}
 
 Use this documentation to inform your responses and ensure accuracy.`;
+}
+
+export function getSystemPromptWithoutDocs(): string {
+  return `You are an AI assistant specializing in Svelte 4 and SvelteKit. You have extensive knowledge of both technologies and can provide expert advice, code examples, and best practices. Your responses should be tailored to the latest versions of Svelte 4 and SvelteKit.
+
+When answering questions or providing guidance, always consider the context of Svelte 4 and SvelteKit. If you're unsure about a specific detail, it's okay to say so.
+
+Use Markdown format in your responses when writing code, including language-specific code blocks like \`\`\`svelte
+
+Provide accurate and helpful information based on your knowledge of Svelte 4 and SvelteKit best practices and features.`;
 }

src/routes/+page.server.ts

@@ -3,25 +3,31 @@ import Anthropic from '@anthropic-ai/sdk';
 import { fail } from '@sveltejs/kit';
 import type { Actions } from './$types';
 import type { TextBlock } from '@anthropic-ai/sdk/resources/messages.mjs';
-import { getSystemPrompt } from '$lib/systemPrompt';
+import { getSystemPromptWithDocs, getSystemPromptWithoutDocs } from '$lib/systemPrompt';
 import { building } from '$app/environment';
 
 const anthropic = new Anthropic({
 	apiKey: building ? '' : env.ANTHROPIC_API_KEY,
 });
 
-const systemPrompt = getSystemPrompt();
-
 export const actions: Actions = {
 	default: async ({ request }) => {
-        //return fail(503, {  error: 'debug', chatHistory: null, });
 		try {
 			const data = await request.formData();
 			const userMessage = data.get('message') as string;
 			const chatHistory = JSON.parse(data.get('chat_history') as string || '[]');
+			const includeDocs = data.get('include_docs') !== null;
 
 			chatHistory.push({ role: 'user', content: userMessage });
 
+			const systemPrompt = includeDocs ? getSystemPromptWithDocs() : getSystemPromptWithoutDocs();
+
+			if(includeDocs) {
+				console.log('Using system prompt with docs');
+			} else {
+				console.log('Using system prompt without docs');
+			}
+
 			const response = await anthropic.messages.create({
 				model: 'claude-3-5-sonnet-20240620', // 'claude-3-haiku-20240307',
 				max_tokens: 4096,

src/routes/+page.svelte

@@ -102,6 +102,12 @@
 				{sending ? 'Sending...' : 'Send'}
 			</button>
 		</div>
+		<div class="checkbox-container">
+			<label>
+				<input type="checkbox" name="include_docs" checked />
+				Include full SvelteKit documentation (adds ~80k tokens, increases cost by ~$0.2 USD/message)
+			</label>
+		</div>
 		<button type="button" on:click={handleClearChat} class="clear-button">Clear Chat</button>
 	</form>
 
@@ -176,7 +182,7 @@
 		margin-bottom: 10px;
 	}
 
-	input {
+	input[type="text"] {
 		flex-grow: 1;
 		padding: 12px;
 		font-size: 16px;
@@ -212,9 +218,25 @@
 	.clear-button {
 		background-color: #ff3b30;
 		align-self: center;
+		margin-top: 10px;
 	}
 
 	.clear-button:hover {
 		background-color: #d63029;
 	}
+
+	.checkbox-container {
+		margin-bottom: 10px;
+	}
+
+	.checkbox-container label {
+		display: flex;
+		align-items: center;
+		font-size: 14px;
+		color: #666;
+	}
+
+	.checkbox-container input[type="checkbox"] {
+		margin-right: 8px;
+	}
 </style>

src/routes/+page.ts

@@ -19,4 +19,4 @@ export const load: PageLoad = async () => {
 	return {
 		messages,
 	};
-};
+};