feat: Ollama Cloud chat interface with official SDK, DB-stored config, and AI settings dashboard

[Copilot]

Adds a protected /chat route with a streaming LLM chat interface backed by Ollama Cloud via the official ollama npm SDK (v0.6.3). Messages are persisted per-user in PostgreSQL via a new ChatMessage model. Ollama credentials and configuration are stored in the database (encrypted) and manageable from a dashboard settings page, with env-var fallback.

Schema

• ChatMessage model with ChatMessageRole enum (USER/ASSISTANT), indexed on (userId, createdAt), cascade-deletes with User
• OllamaConfig model for per-user DB-stored configuration: host URL, API key (AES-256-CBC encrypted), model name, system prompt, temperature
• Migrations: 20260315000000_add_chat_messages, 20260315001000_add_ollama_config

Official Ollama SDK Integration (src/lib/ollama.ts)

• Uses the official ollama npm package with full TypeScript types
• SDK client factory supporting Ollama Cloud (host=https://ollama.com, ****** auth) and local instances
• Config resolution: DB-stored config → env vars → sensible defaults
• Features: streaming chat (client.chat({ stream: true })), model listing (client.list()), model details (client.show()), connection testing

API Routes

• POST /api/chat/ollama — session-authenticated, streams Ollama responses via SDK + ReadableStream, persists both sides of the conversation. Supports think parameter for reasoning models. Iterative HTML sanitization and 4K char input cap.
• GET /api/chat/history — returns last 100 messages for the authenticated user
• DELETE /api/chat/history — clears user's chat history
• GET /api/chat/models — lists available models from configured Ollama instance via client.list()
• GET /api/chat/models/[name] — fetches detailed model info via client.show()
• GET /api/settings/ai — returns user's AI configuration (API key masked)
• PUT /api/settings/ai — updates AI configuration with encrypted API key storage
• POST /api/settings/ai/test — tests Ollama connectivity, returns available models and latency

UI

• /chat page with server-side auth gate, sidebar layout matching existing dashboard pages
• ChatInterface client component: optimistic message rendering, token-by-token streaming, model selector dropdown, stop generation button (AbortController), loading/error states, keyboard shortcuts (Enter to send, Shift+Enter for newline), link to AI Settings
• ChatMessage component with triple-backtick code block rendering
• /settings/ai page with form for host URL, API key, model, system prompt, temperature, Cloud/Local toggle, and Test Connection button with success/error feedback

Auth & Security

• /chat added to protectedPaths in middleware
• All API endpoints validate session.user.id; all DB queries scoped to userId
• API keys encrypted at rest using AES-256-CBC via existing src/lib/encryption.ts
• API keys never returned to client (masked display only)
• Iterative HTML sanitization prevents nested tag injection (<scr<script>ipt>)

Navigation

• "AI Chat" link added to app-sidebar.tsx with IconMessageChatbot
• "AI Settings" link added under Settings section with IconSettingsAutomation

Config

• OLLAMA_API_URL, OLLAMA_MODEL, and OLLAMA_API_KEY added to .env.example
• DB-stored config takes precedence over env vars, enabling per-user configuration from the dashboard
• Setup docs in docs/CHAT_SETUP.md covering Cloud API setup, all endpoints, and SDK features

Extensibility

• ChatMessage model accepts an optional organizationId for future multi-tenant scoping
• OllamaConfig model is per-user, ready for org-level config sharing
• think parameter support for reasoning models (e.g., DeepSeek R1)

Original prompt

---

This section details on the original issue you should resolve

<issue_title>Build a Cloud-based Ollama-powered Chat Interface with Full Authentication Integration</issue_title>
<issue_description>## Summary
Develop a fully integrated chat interface for the StormCom project that uses Ollama via a cloud endpoint as the backend LLM provider. The interface must leverage the existing authentication system, ensuring only authenticated users can access and use the chat functionality.

Objectives

• Create a modern, responsive chat UI within the Next.js 16 (App Router) framework, accessible only to authenticated users.
• Integrate with Ollama's cloud API (LLM backend) for real-time LLM-powered conversational responses.
• Ensure all messages and context are securely associated with authenticated sessions.
• Design for extensibility to support future multi-tenancy and fine-grained role-based access.

Requirements

1. UI/UX

• Add a new /chat protected route (App Router group) only accessible to logged-in users.
• Modern chat interface styled with shadcn-ui primitives; supports Markdown, code blocks, and loading states.
• Display user and assistant messages clearly, with session state persisted per user.
• Loading and error feedback for LLM response delays.

2. Authentication Integration

• Gate the entire chat route using the existing NextAuth middleware and session patterns.
• On the server: validate session tokens/JWT and associate chat histories with session.user.id.
• Support signed-in via email (current) and password (future); ensure session/tenant isolation.

3. Backend Integration (Ollama Cloud)

• Add secure backend API route /api/chat/ollama that:
  • Authenticating the user session on each request.
  • Accepts user message and sends it to configured Ollama cloud API.
  • Streams or returns LLM responses as appropriate.
• API keys for Ollama (and any secrets) must be set via .env.local and never exposed in frontend code.
• Add README documentation for required configuration, environment variables, and deployment steps.

4. Data Persistence

• Store chat history per user (PostgreSQL via Prisma 7):
  • Schema: User ID, message content (user/assistant), timestamps.
  • Model extensible to support organizations (multi-tenant) in future.

5. Security & Access

• Ensure only the authenticated user (or tenant org) may access their message history.
• Sanitize and validate all message inputs/outputs for safety (prevent prompt/HTML injection).

6. Dev Experience

• Include robust TypeScript typings throughout the chat, backend handler, and Prisma models.
• Ensure all new code passes npm run type-check and npm run lint (warnings OK, no errors).
• Add detailed documentation to the repository: usage instructions, config, and extending the chat.

Out of Scope

• No open anonymous usage; chat is for signed-in users only.
• No public endpoints to Ollama or chat API.
• No file uploads or image generation (text-only chat).
• Testing suite not required unless requested.

Acceptance Criteria

• Authenticated users can access /chat, send messages, and receive streaming responses from Ollama (cloud backend).
• All chat data persists securely in the database, scoped to user session.
• No sensitive credentials are leaked to client-side.
• Codebase passes build/type-check/lint workflows.
• Documentation updated for setup, environment config, and feature usage.

---

References:

• Ollama cloud API docs
• NextAuth.js Documentation
• Prisma Docs
• See /src/app/(auth) for authentication patterns.

---

Please ask in comments if further clarification is needed, or if there are specific product requirements for multi-tenancy and permissions.</issue_description>

<agent_instructions>Perform comprehensive online research and get all the latest docs, guides and best practices of Next.js 16, Ollama, Vercel, Prisma PostgreSQL and Shadcn for this implementation and start the implementation. Lastly perform browser automation testing for revalidate all the implementation properly</agent_instructions>

Comments on the Issue (you are @copilot in this section)

• Fixes Build a Cloud-based Ollama-powered Chat Interface with Full Authentication Integration #360

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
stormcomui	Ready	Preview, Comment	Mar 15, 2026 5:00pm

[syed-reza98]

@copilot

Review the whole repository codebase of https://github.com/ollama/ollama-js/tree/main and all the documentation from https://docs.ollama.com
https://docs.ollama.com/cloud#javascript
check all the relavent implementation examples based upon the current codebase. List down all the features can be integrated in the codebase from ollama, also this SaaS platform is production ready so I’m focusing on Ollama Cloud implementation. (The local implementation will be implemented later) for focus more on that. Based upon all the documentation and ollama-js repo analysis and research implement all of your findings one by one. (Note the following ollama-js repo maybe using JavaScript and our current repo codebase is all about Typescript so make all the adjustments and refactoring of ollama-js implementation in Typescript for this codebase). Lastly revalidate all the implementation by browsing automation testing and check the chat interface is functional. Additionally check if instead of the .env all the Ollama related credentials and variables can be saved in the DB and all the credentials and variables and configuration values can be saved from the dashboard then make that changes.

[syed-reza98]

@copilot Review the whole repository codebase of https://github.com/ollama/ollama-js/tree/main and all the documentation from https://docs.ollama.com
https://docs.ollama.com/cloud#javascript
check all the relavent implementation examples based upon the current codebase. List down all the features can be integrated in the codebase from ollama, also this SaaS platform is production ready so I’m focusing on Ollama Cloud implementation. (The local implementation will be implemented later) for focus more on that. Based upon all the documentation and ollama-js repo analysis and research implement all of your findings one by one. (Note the following ollama-js repo maybe using JavaScript and our current repo codebase is all about Typescript so make all the adjustments and refactoring of ollama-js implementation in Typescript for this codebase). Lastly revalidate all the implementation by browsing automation testing and check the chat interface is functional. Additionally check if instead of the .env all the Ollama related credentials and variables can be saved in the DB and all the credentials and variables and configuration values can be saved from the dashboard then make that changes.

[Copilot]

@copilot

Review the whole repository codebase of https://github.com/ollama/ollama-js/tree/main and all the documentation from https://docs.ollama.com
...

Implemented the ollama-js SDK integration with full Ollama Cloud support in commit 59b3b68. Here's what was done:

Official ollama SDK (v0.6.3)

• Installed the TypeScript SDK via npm — replaces raw fetch calls
• src/lib/ollama.ts creates SDK clients with new Ollama({ host, headers }) supporting both Cloud (https://ollama.com + ****** and local modes

DB-stored configuration (no .env required)

• New OllamaConfig Prisma model stores host, API key (AES-256-CBC encrypted), model, system prompt, temperature, and cloud mode per user
• Config resolution: DB → env vars → defaults
• API key is never returned to client (only hasApiKey: boolean)

AI Settings page (/settings/ai)

• Form to configure host URL, API key, model name, system prompt, temperature, cloud/local toggle
• "Test Connection" button that pings the Ollama instance and returns available models + latency
• Accessible from sidebar ("AI Settings") and chat header ("Settings" button)

New API endpoints

• GET/PUT /api/settings/ai — read/update AI config
• POST /api/settings/ai/test — connection test with latency
• GET /api/chat/models — list available models via client.list()
• GET /api/chat/models/[name] — model details via client.show()

Chat interface enhancements

• Model selector dropdown populated from the user's Ollama instance
• Stop generation button (AbortController)
• think parameter support for reasoning models

Ollama Cloud features that can be integrated in future

1. Embeddings (client.embed()) — for semantic search, RAG
2. Pull/Push models (client.pull() / client.push()) — model management from dashboard
3. Generate (client.generate()) — single-turn completions
4. Vision/multimodal (images parameter) — image understanding (when file uploads are added)
5. Tool calling (tools parameter) — function calling for agentic workflows
6. Structured outputs (format: { type: "object" }) — JSON schema responses
7. Custom Modelfiles (client.create()) — create custom models from dashboard
8. Copy models (client.copy()) — model aliasing
9. Running models (client.ps()) — monitor active models

All code is TypeScript, all routes are session-authenticated, build/lint/type-check pass with 0 errors.

@copilot Review the whole repository codebase of https://github.com/ollama/ollama-js/tree/main and all the documentation from https://docs.ollama.com
https://docs.ollama.com/cloud#j...

Addressed in commit 59b3b68 — same implementation as described above. The official ollama npm SDK (v0.6.3) is now used with full TypeScript types, DB-stored config replaces .env dependency, and an AI Settings page at /settings/ai allows managing all Ollama Cloud credentials from the dashboard.

[github-actions]

Automated review (GitHub Models):

This pull request implements all major objectives, requirements, and acceptance criteria from the original issue for a fully authenticated Ollama Cloud chat interface, including a protected route, secure backend integration, data persistence, per-user configuration, and documentation. Multiple files directly match feature descriptions, indicating thorough resolution.

Confidence: 0.95

Evidence:

• src/app/chat/page.tsx : Implements a protected /chat route with authenticated access and Chat UI, matching the requested feature.
• src/lib/ollama.ts : Integrates Ollama Cloud using the official SDK, with streaming, model management, and secured config as required.
• src/app/api/chat/ollama/route.ts : Backend API for chat streaming, session validation, and message persistence, fulfilling objectives 2, 3, and 4.
• prisma/migrations/20260315000000_add_chat_messages : Database schema migration for chat message storage per user, as specified.
• src/app/settings/ai/page.tsx : Implements dashboard for AI settings management, as detailed in requirements.
• docs/CHAT_SETUP.md : Documentation added for Ollama Cloud setup and chat integration, covering acceptance criteria.
• src/lib/encryption.ts : API keys are encrypted at rest, matching security requirements.
• .env.example : Environment variable configuration for Ollama Cloud credentials.
• src/app/api/chat/history/route.ts : Endpoints for fetching and deleting chat history per user, matching feature specs.

[syed-reza98]

@copilot Visit this 2 repo below:

1. https://github.com/ollama/ollama-js
2. https://github.com/ollama/ollama

Navigate all the documentation files and go through all of them properly. List down all the Ollama Cloud API related documentation and implementation using Next.js 16 with App Router, Typescript, Shadcn for this multi tenant SaaS platform. Don’t skip any documentation. Save all of your research and findings in a .md file

[Copilot]

@copilot Visit this 2 repo below:

1. https://github.com/ollama/ollama-js
2. https://github.com/ollama/ollama
   ...

Created docs/research/OLLAMA_CLOUD_API_RESEARCH.md in commit 86eba4b with exhaustive findings from both repos.

Sources reviewed:

• ollama-js/src/interfaces.ts — all 30+ TypeScript types exported by the SDK
• ollama-js/src/index.ts — full Ollama class with all methods
• ollama-js/examples/ — tools, websearch, multimodal, thinking, structured-outputs, abort, fill-in-middle
• ollama/docs/cloud.mdx — Cloud API auth, endpoints, model naming
• ollama/docs/api.md — complete REST API reference (generate, chat, embed, pull, push, create, copy, delete, show, ps, version)
• ollama/docs/capabilities/ — thinking, tool-calling, structured-outputs, vision, embeddings, web-search
• ollama/docs/modelfile.mdx — all 20+ model parameters
• ollama/docs/faq.mdx — config, proxy, local-only mode

Document covers:

1. SDK client construction (Cloud vs Local)
2. Complete TypeScript interfaces (ChatRequest, Message, Tool, Options, all response types)
3. All 15 Cloud API endpoints with SDK method mapping
4. Cloud authentication (******
5. 15 feature sections with TypeScript implementation examples targeting Next.js 16 App Router
6. Current StormCom implementation status (12 features implemented)
7. Integration roadmap with 13 future features, prioritized in 3 phases
8. Appendices: method reference table, env vars, all Modelfile parameters