OPEN CODE - AI Terminal Assistant

Локальный AI-терминал для разработки в стиле CLI/IDE с поддержкой русского и английского языков.

Возможности

Интерфейс

• IDE-style layout - три панели: Explorer (файлы), Chat (диалог), Output (код)
• Catppuccin Mocha - темная цветовая схема
• RU/EN - переключение языка интерфейса
• Адаптивный дизайн - фиксированные заголовки, прокручиваемый контент

Чат с AI

• Реальное время - WebSocket streaming ответов
• Блоки кода - сворачиваемые, с подсветкой синтаксиса
• Timeline - временная шкала сообщений
• Копирование - кнопка копирования для кода

Работа с файлами

• Прикрепление файлов - drag and drop или кнопка
• Прикрепление папок - рекурсивное чтение
• Предпросмотр - список прикрепленных файлов
• Контекст - файлы включаются в запрос к AI

Команды

• Командная палитра - нажмите / для открытия
• Быстрые команды - /help, /clear, /attach, /folder, /select, /lang
• Режимы - Chat, Code, Terminal, Debug (Tab для переключения)
• История - стрелки для навигации

Инструменты

• Select Element - выбор элемента на странице для анализа
• Context Window - индикатор использования токенов

Горячие клавиши

Клавиша	Действие
/	Открыть командную палитру
Tab	Сменить режим (Chat, Code, Terminal, Debug)
Up / Down	История команд / навигация в палитре
Enter	Отправить сообщение / выбрать команду
Esc	Закрыть палитру / отменить выбор элемента

Технологии

• Next.js 16 - App Router, Turbopack
• TypeScript - строгая типизация
• Tailwind CSS 4 - стилизация
• shadcn/ui - UI компоненты
• Prisma + SQLite - база данных
• Socket.io - WebSocket (порт 3003)
• z-ai-web-dev-sdk - AI интеграция

Цветовая схема (Catppuccin Mocha)

Base:      #1e1e2e  (фон)
Text:      #cdd6f4  (текст)
Blue:      #89b4fa  (акцент)
Green:     #a6e3a1  (успех)
Yellow:    #f9e2af  (предупреждение)
Red:       #f38ba8  (ошибка)
Lavender:  #b4befe  (фиолетовый)
Mauve:     #cba6f7  (розовый)

Запуск

# Установка зависимостей
bun install

# Настройка окружения
cp .env.example .env

# Запуск базы данных
bun run db:push

# Запуск WebSocket сервиса
cd mini-services/chat-service && bun run dev &

# Запуск dev сервера
bun run dev

Скрипты

Скрипт	Описание
bun run dev	Запуск dev сервера с Turbopack
bun run build	Production сборка
bun run lint	Проверка ESLint
bun run db:push	Применить схему Prisma к БД
bun run db:studio	Открыть Prisma Studio

Структура проекта

• src/app/
  • page.tsx - Главная страница
  • layout.tsx - Layout
  • api/ - API routes
• src/components/
  • terminal/ - Компоненты терминала
    • CLITerminal.tsx
    • ChatMessage.tsx
    • CodeBlock.tsx
    • ContextIndicator.tsx
    • CommandPalette.tsx
    • ErrorBoundary.tsx
    • constants.ts
    • types.ts
    • utils.ts
  • ui/ - shadcn/ui компоненты
• src/hooks/
  • useAIChat.ts - AI чат хук
• src/lib/
  • db.ts - Prisma клиент
  • terminal-utils.ts - Утилиты
• mini-services/chat-service/
  • index.ts - WebSocket сервис (порт 3003)
• prisma/
  • schema.prisma - Схема БД

API Endpoints

Endpoint	Method	Описание
/api/conversations	GET	Список диалогов
/api/conversations	POST	Создать диалог
/api/conversations/[id]	GET	Получить диалог
/api/conversations/[id]	DELETE	Удалить диалог
/api/messages	GET	Сообщения диалога
/api/messages	POST	Создать сообщение
/api/projects	GET	Список проектов
/api/projects	POST	Создать проект
/api/files	GET	Файлы проекта
/api/files	POST	Добавить файл
/api/commands	GET	История команд
/api/commands	POST	Выполнить команду

Команды

Команда	Описание
/help	Показать справку
/clear	Очистить чат
/attach	Добавить файлы
/folder	Добавить папку
/select	Выбор элемента
/lang	Сменить язык
/mode <type>	Сменить режим

Конфигурация

Контекстное окно

Настраивается в src/components/terminal/constants.ts:

export const CONTEXT_CONFIG = {
  maxTokens: 128000,      // GPT-4o context window
  reservedTokens: 4000,   // Reserved for response
  warningThreshold: 0.8,  // 80% warning
  criticalThreshold: 0.95 // 95% critical
};

Валидация файлов

export const FILE_VALIDATION = {
  maxFileSize: 5 * 1024 * 1024,      // 5MB для файлов
  maxFolderFileSize: 100 * 1024,     // 100KB для файлов из папок
  allowedExtensions: ['.ts', '.tsx', '.js', '.jsx', '.json', '.md', '.txt', '.css', '.html']
};

Переменные окружения

См. .env.example:

# Database Configuration
DATABASE_URL="file:./db/dev.db"

Правила разработки

Обязательные технологии

• Next.js 16 + TypeScript - не меняются
• App Router - роутинг через src/app/
• Prisma + SQLite - база данных

Код-стайл

• ESLint + строгая типизация TypeScript
• shadcn/ui компоненты вместо кастомных
• 'use client' / 'use server' для разделения
• React.memo для оптимизации рендеров

WebSocket

• Backend: Socket.io на порту 3003
• Frontend: io("/?XTransformPort=3003")

AI SDK

• z-ai-web-dev-sdk ТОЛЬКО на backend
• Никогда не использовать на client side

---

Built with: Next.js 16 + TypeScript + Tailwind CSS