diff --git a/package.json b/package.json index 3affc9d2..791c4a2b 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,7 @@ "workspaces": [ "apps/*", "!apps/raycast-extension", + "!tools/test/chatapp", "packages/*" ], "dependencies": { diff --git a/packages/tools/src/vercel/middleware.ts b/packages/tools/src/vercel/middleware.ts index 37f48994..586105a8 100644 --- a/packages/tools/src/vercel/middleware.ts +++ b/packages/tools/src/vercel/middleware.ts @@ -106,7 +106,7 @@ const addSystemPrompt = async ( const memories = `${profileData}\n${searchResultsMemories}`.trim() if (memories) { logger.debug("Memory content preview", { - content: memories.substring(0, 200), + content: memories, fullLength: memories.length, }) } diff --git a/packages/tools/test/chatapp/.gitignore b/packages/tools/test/chatapp/.gitignore new file mode 100644 index 00000000..5ef6a520 --- /dev/null +++ b/packages/tools/test/chatapp/.gitignore @@ -0,0 +1,41 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +# dependencies +/node_modules +/.pnp +.pnp.* +.yarn/* +!.yarn/patches +!.yarn/plugins +!.yarn/releases +!.yarn/versions + +# testing +/coverage + +# next.js +/.next/ +/out/ + +# production +/build + +# misc +.DS_Store +*.pem + +# debug +npm-debug.log* +yarn-debug.log* +yarn-error.log* +.pnpm-debug.log* + +# env files (can opt-in for committing if needed) +.env* + +# vercel +.vercel + +# typescript +*.tsbuildinfo +next-env.d.ts diff --git a/packages/tools/test/chatapp/README.md b/packages/tools/test/chatapp/README.md new file mode 100644 index 00000000..f72d8b45 --- /dev/null +++ b/packages/tools/test/chatapp/README.md @@ -0,0 +1,77 @@ +# Chat App - Test Application + +This is a basic Next.js chat application created for testing the Supermemory packages and tools. It demonstrates how to integrate Supermemory with a simple chat interface. + +## Features + +- **Real-time Chat Interface**: Clean, modern chat UI with message bubbles +- **Supermemory Integration**: Uses Supermemory tools for enhanced AI conversations +- **Responsive Design**: Works on desktop and mobile devices +- **Dark Mode Support**: Automatic theme switching based on system preferences +- **Loading States**: Visual feedback during AI processing +- **Error Handling**: Graceful error handling for API failures + +## Tech Stack + +- **Next.js 16**: React framework with App Router +- **React 19**: Latest React with concurrent features +- **TypeScript**: Full type safety +- **Tailwind CSS**: Utility-first styling +- **AI SDK**: OpenAI integration for chat functionality +- **Supermemory**: Memory management and retrieval + +## Getting Started + +1. **Install Dependencies**: + ```bash + npm install + ``` + +2. **Set up Environment Variables**: + Create a `.env.local` file with your API keys: + ```env + OPENAI_API_KEY=your_openai_api_key_here + SUPERMEMORY_API_KEY=your_supermemory_api_key_here + ``` + +3. **Run the Development Server**: + ```bash + npm run dev + ``` + +4. **Open in Browser**: + Navigate to [http://localhost:3000](http://localhost:3000) + +## Usage + +- Type a message in the input field and press Enter or click Send +- The AI will respond using Supermemory for context-aware conversations +- Messages are displayed in a chat bubble format +- Loading indicator shows when the AI is processing + +## Testing Supermemory Features + +This app is specifically designed to test: +- Memory storage and retrieval +- Context-aware conversations +- Package integration +- API functionality +- UI/UX patterns + +## Development + +This is a test application and should not be used in production. It's designed for: +- Testing Supermemory package functionality +- Demonstrating integration patterns +- UI/UX experimentation +- Development and debugging + +## File Structure + +``` +app/ +├── api/chat/route.ts # API endpoint for chat functionality +├── globals.css # Global styles and Tailwind imports +├── layout.tsx # Root layout with fonts and metadata +└── page.tsx # Main chat interface component +``` diff --git a/packages/tools/test/chatapp/app/api/chat/route.ts b/packages/tools/test/chatapp/app/api/chat/route.ts new file mode 100644 index 00000000..7fddcbec --- /dev/null +++ b/packages/tools/test/chatapp/app/api/chat/route.ts @@ -0,0 +1,23 @@ +import { generateText, type ModelMessage } from "ai" +import { openai } from "@ai-sdk/openai" +import { withSupermemory } from "../../../../../src/vercel" + +const model = withSupermemory(openai("gpt-4"), "user-123", { + mode: "full", + addMemory: "always", + conversationId: "chat-session", + verbose: true, +}) + + +export async function POST(req: Request) { + const { messages }: { messages: ModelMessage[] } = await req.json() + + const { response } = await generateText({ + model, + system: "You are a helpful assistant.", + messages, + }) + + return Response.json({ messages: response.messages }) +} \ No newline at end of file diff --git a/packages/tools/test/chatapp/app/favicon.ico b/packages/tools/test/chatapp/app/favicon.ico new file mode 100644 index 00000000..718d6fea Binary files /dev/null and b/packages/tools/test/chatapp/app/favicon.ico differ diff --git a/packages/tools/test/chatapp/app/globals.css b/packages/tools/test/chatapp/app/globals.css new file mode 100644 index 00000000..a2dc41ec --- /dev/null +++ b/packages/tools/test/chatapp/app/globals.css @@ -0,0 +1,26 @@ +@import "tailwindcss"; + +:root { + --background: #ffffff; + --foreground: #171717; +} + +@theme inline { + --color-background: var(--background); + --color-foreground: var(--foreground); + --font-sans: var(--font-geist-sans); + --font-mono: var(--font-geist-mono); +} + +@media (prefers-color-scheme: dark) { + :root { + --background: #0a0a0a; + --foreground: #ededed; + } +} + +body { + background: var(--background); + color: var(--foreground); + font-family: Arial, Helvetica, sans-serif; +} diff --git a/packages/tools/test/chatapp/app/layout.tsx b/packages/tools/test/chatapp/app/layout.tsx new file mode 100644 index 00000000..f7fa87eb --- /dev/null +++ b/packages/tools/test/chatapp/app/layout.tsx @@ -0,0 +1,34 @@ +import type { Metadata } from "next"; +import { Geist, Geist_Mono } from "next/font/google"; +import "./globals.css"; + +const geistSans = Geist({ + variable: "--font-geist-sans", + subsets: ["latin"], +}); + +const geistMono = Geist_Mono({ + variable: "--font-geist-mono", + subsets: ["latin"], +}); + +export const metadata: Metadata = { + title: "Create Next App", + description: "Generated by create next app", +}; + +export default function RootLayout({ + children, +}: Readonly<{ + children: React.ReactNode; +}>) { + return ( + + + {children} + + + ); +} diff --git a/packages/tools/test/chatapp/app/page.tsx b/packages/tools/test/chatapp/app/page.tsx new file mode 100644 index 00000000..6eea7cfc --- /dev/null +++ b/packages/tools/test/chatapp/app/page.tsx @@ -0,0 +1,129 @@ +"use client" + +import type { ModelMessage } from "ai" +import { useState } from "react" + +export default function Page() { + const [input, setInput] = useState("") + const [messages, setMessages] = useState([]) + const [isLoading, setIsLoading] = useState(false) + + const handleSendMessage = async () => { + if (!input.trim() || isLoading) return + + const userMessage = { role: "user" as const, content: input } + setMessages((currentMessages) => [...currentMessages, userMessage]) + setInput("") + setIsLoading(true) + + try { + const response = await fetch("/api/chat", { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify({ + messages: [...messages, userMessage], + }), + }) + + const { messages: newMessages } = await response.json() + setMessages((currentMessages) => [...currentMessages, ...newMessages]) + } catch (error) { + console.error("Error sending message:", error) + } finally { + setIsLoading(false) + } + } + + return ( +
+
+ {/* Header */} +
+

Chat App

+

+ Chat with AI using Supermemory +

+
+ + {/* Messages Container */} +
+ {messages.length === 0 && ( +
+ Start a conversation by typing a message below +
+ )} + {messages.map((message, index) => ( +
+
+
+ {message.role} +
+
+ {typeof message.content === "string" + ? message.content + : message.content + .filter((part) => part.type === "text") + .map((part, partIndex) => ( +
+ {part.text} +
+ ))} +
+
+
+ ))} + {isLoading && ( +
+
+
+
+ + AI is thinking... + +
+
+
+ )} +
+ + {/* Input Container */} +
+ setInput(event.target.value)} + onKeyDown={(event) => { + if (event.key === "Enter" && !event.shiftKey) { + event.preventDefault() + handleSendMessage() + } + }} + placeholder="Type your message here..." + disabled={isLoading} + className="flex-1 px-4 py-2 border border-gray-300 dark:border-gray-600 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent bg-background text-foreground placeholder:text-muted-foreground disabled:opacity-50 disabled:cursor-not-allowed" + /> + +
+
+
+ ) +} diff --git a/packages/tools/test/chatapp/eslint.config.mjs b/packages/tools/test/chatapp/eslint.config.mjs new file mode 100644 index 00000000..05e726d1 --- /dev/null +++ b/packages/tools/test/chatapp/eslint.config.mjs @@ -0,0 +1,18 @@ +import { defineConfig, globalIgnores } from "eslint/config"; +import nextVitals from "eslint-config-next/core-web-vitals"; +import nextTs from "eslint-config-next/typescript"; + +const eslintConfig = defineConfig([ + ...nextVitals, + ...nextTs, + // Override default ignores of eslint-config-next. + globalIgnores([ + // Default ignores of eslint-config-next: + ".next/**", + "out/**", + "build/**", + "next-env.d.ts", + ]), +]); + +export default eslintConfig; diff --git a/packages/tools/test/chatapp/next.config.ts b/packages/tools/test/chatapp/next.config.ts new file mode 100644 index 00000000..e9ffa308 --- /dev/null +++ b/packages/tools/test/chatapp/next.config.ts @@ -0,0 +1,7 @@ +import type { NextConfig } from "next"; + +const nextConfig: NextConfig = { + /* config options here */ +}; + +export default nextConfig; diff --git a/packages/tools/test/chatapp/package.json b/packages/tools/test/chatapp/package.json new file mode 100644 index 00000000..746ca050 --- /dev/null +++ b/packages/tools/test/chatapp/package.json @@ -0,0 +1,30 @@ +{ + "name": "chatapp", + "version": "0.1.0", + "private": true, + "scripts": { + "dev": "next dev", + "build": "next build", + "start": "next start", + "lint": "eslint" + }, + "dependencies": { + "react": "19.2.0", + "react-dom": "19.2.0", + "next": "16.0.0", + "ai": "^4.0.0", + "@ai-sdk/openai": "^1.0.0", + "supermemory": "^1.0.0", + "@supermemory/tools": "workspace:*" + }, + "devDependencies": { + "typescript": "^5", + "@types/node": "^20", + "@types/react": "^19", + "@types/react-dom": "^19", + "@tailwindcss/postcss": "^4", + "tailwindcss": "^4", + "eslint": "^9", + "eslint-config-next": "16.0.0" + } +} diff --git a/packages/tools/test/chatapp/postcss.config.mjs b/packages/tools/test/chatapp/postcss.config.mjs new file mode 100644 index 00000000..61e36849 --- /dev/null +++ b/packages/tools/test/chatapp/postcss.config.mjs @@ -0,0 +1,7 @@ +const config = { + plugins: { + "@tailwindcss/postcss": {}, + }, +}; + +export default config; diff --git a/packages/tools/test/chatapp/public/file.svg b/packages/tools/test/chatapp/public/file.svg new file mode 100644 index 00000000..004145cd --- /dev/null +++ b/packages/tools/test/chatapp/public/file.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/tools/test/chatapp/public/globe.svg b/packages/tools/test/chatapp/public/globe.svg new file mode 100644 index 00000000..567f17b0 --- /dev/null +++ b/packages/tools/test/chatapp/public/globe.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/tools/test/chatapp/public/next.svg b/packages/tools/test/chatapp/public/next.svg new file mode 100644 index 00000000..5174b28c --- /dev/null +++ b/packages/tools/test/chatapp/public/next.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/tools/test/chatapp/public/vercel.svg b/packages/tools/test/chatapp/public/vercel.svg new file mode 100644 index 00000000..77053960 --- /dev/null +++ b/packages/tools/test/chatapp/public/vercel.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/tools/test/chatapp/public/window.svg b/packages/tools/test/chatapp/public/window.svg new file mode 100644 index 00000000..b2b2a44f --- /dev/null +++ b/packages/tools/test/chatapp/public/window.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/tools/test/chatapp/tsconfig.json b/packages/tools/test/chatapp/tsconfig.json new file mode 100644 index 00000000..3a13f90a --- /dev/null +++ b/packages/tools/test/chatapp/tsconfig.json @@ -0,0 +1,34 @@ +{ + "compilerOptions": { + "target": "ES2017", + "lib": ["dom", "dom.iterable", "esnext"], + "allowJs": true, + "skipLibCheck": true, + "strict": true, + "noEmit": true, + "esModuleInterop": true, + "module": "esnext", + "moduleResolution": "bundler", + "resolveJsonModule": true, + "isolatedModules": true, + "jsx": "react-jsx", + "incremental": true, + "plugins": [ + { + "name": "next" + } + ], + "paths": { + "@/*": ["./*"] + } + }, + "include": [ + "next-env.d.ts", + "**/*.ts", + "**/*.tsx", + ".next/types/**/*.ts", + ".next/dev/types/**/*.ts", + "**/*.mts" + ], + "exclude": ["node_modules"] +}