Bring-Bit

Bring-Bit is a Next.js-based AI chatbot workspace for experimenting with conversations, model configuration, prompts, and productivity-focused UI patterns. The app provides a full chat interface with conversation history, configuration panels, response metrics, markdown support, and local LLM integration through an OpenAI Chat Completions-compatible endpoint.

Key Features

• Chat workspace with conversation history, markdown messages, pins/bookmarks, multi-select, export, and regeneration.
• Model, persona, system prompt, conversation memory, and parameter controls for temperature, max tokens, top-p, and frequency penalty.
• Local Bonsai integration through Server-Sent Events (SSE) from the /chat/completions endpoint.
• Local LLM health check through the /api/llm/health route.
• IndexedDB state persistence with migration from legacy localStorage data.
• UI shell for tools, MCP servers, file uploads, prompt snippets, themes, and workspace settings.
• Dark/light mode, density mode, command palette, keyboard shortcuts, and baseline accessibility support.

Tech Stack

• Next.js 16
• React 19
• TypeScript
• Tailwind CSS v4
• Dexie / IndexedDB
• lucide-react
• react-markdown + remark-gfm

Requirements

• A Node.js version compatible with Next.js 16
• npm
• Optional local LLM that exposes an OpenAI-compatible API at /v1/chat/completions

Setup

1. Install dependencies:

   npm install

2. Copy the environment configuration:

   cp .env.example .env.local

3. Adjust the environment values if needed:

   LLM_BASE_URL=http://localhost:3002/v1
   LLM_MODEL=local-bonsai
   LLM_REQUEST_TIMEOUT_MS=45000

4. Start the development server:

   npm run dev

5. Open the app in your browser:

   http://localhost:3000
   

The root route redirects to /chat.

Local LLM Integration

Bring-Bit sends chat requests to the internal /api/chat route. This route forwards the payload to LLM_BASE_URL/chat/completions using an OpenAI-compatible format and reads the response as an SSE stream.

LLM endpoints used by the app:

• Health check: GET /health
• Chat completion: POST /v1/chat/completions

If LLM_BASE_URL uses a /v1 path, the health check is automatically resolved to /health on the same host.

Scripts

npm run dev        # Start the Next.js development server
npm run build      # Create a production build
npm run start      # Start the production server
npm run lint       # Run ESLint
npm run typecheck  # Run TypeScript checks without emitting files

Project Structure

src/
  app/                         Next.js App Router routes and API routes
  components/                  Shared UI and layout components
  features/chat/               Chat UI, adapter, stream contracts, server provider
  features/conversations/      Conversation import/export and serialization
  features/workspace/          Workspace shell, inspector, model options, default state
  lib/db/                      IndexedDB repository and localStorage migration
  lib/utils/                   Shared utility helpers
  stores/                      Application state store
  types/                       Application domain types

design-system/bring-bit/       Bring-Bit design documentation
FEATURES-SUMMARY.md            Summary of available features

Persistence Notes

Conversations, messages, settings, snippets, tools, upload metadata, themes, and UI preferences are stored in browser IndexedDB. On first load, the app attempts to migrate legacy localStorage data if it is available.

Quality Check

Before opening a pull request or deploying, run:

npm run lint
npm run typecheck
npm run build