CosinnChat

CosinnChat — специализированная B2B-система чатов для электронной коммерции. В отличие от универсальных Intercom или Zendesk, она построена под одну конкретную задачу: помочь продавцу ответить покупателю быстро и умно в момент, когда тот принимает решение о покупке. Чат встраивается через iframe прямо в страницу товара, оператор работает в отдельной PWA-панели, всё связано real-time через Supabase Realtime.

Проблема и контекст

В B2B и e-commerce живое общение — это часто разница между сделкой и брошенной корзиной. Универсальные чат-платформы дают текстовое поле и список тикетов, но не дают оператору контекста: что клиент смотрел, откуда пришёл, сколько провёл на сайте, какие вопросы уже задавал. В результате оператор переписывает один и тот же ответ десятками раз, забывает деталь, теряет нить. Параллельно — длительное обучение новых сотрудников, отсутствие аналитики, неудобный мобильный опыт. CosinnChat закрывает именно эти болевые точки на стыке скорости ответа, полноты контекста и продуктовой автоматизации.

Что построено

Платформа состоит из двух частей. Первая — клиентский чат на React + TypeScript, который встраивается в любой сайт через `<iframe>`. Вторая — панель операторов, доступная как обычный веб-интерфейс и как Progressive Web App, устанавливаемый прямо на рабочий стол с иконкой в Start Menu / Dock, push-уведомлениями и счётчиком непрочитанных на иконке. Обе части работают на одном Supabase-инстансе с включённым Row Level Security и multi-tenant изоляцией: одна и та же платформа обслуживает множество компаний, каждая видит только свои чаты и операторов.

Продуктовые механики

• Markdown-форматирование сообщений (заголовки, списки, таблицы, код, rich-ссылки) с XSS-санитизацией через rehype-sanitize — оператор отправляет профессиональные структурированные ответы, а не «стену текста»
• Быстрые ответы: шаблоны с категориями (Привет, Аналоги, Перекуп, Доставка), мгновенный поиск, CRUD без программиста — операторы отвечают в 3–5 раз быстрее
• Быстрые вопросы для клиентов: готовые кнопки «В наличии?», «Время доставки?», «Есть аналог?» — клиент отправляет вопрос одним кликом
• Полный профиль клиента в правом сайдбаре: браузер, ОС, разрешение, язык, часовой пояс, список посещённых страниц, источник трафика, время на сайте — всё редактируется на лету
• Файлы до 20 МБ и голосовые сообщения через MediaRecorder API, видеозвонки через Jitsi Meet
• Гибкий запрос контактов: оператор выбирает что и когда собирать (только телефон, только email, полная форма) — без раздражающих автоматических попапов
• Rich-ссылки с Markdown-карточками вместо голых URL — выше CTR
• PWA-приглашение клиенту: красивый баннер «Установите приложение» с правильной логикой показа (только для веб, не для PWA и не для iframe)

AI-ассистент

Встроенный AI на базе Anthropic Claude помогает оператору на каждом шаге: предлагает текст ответа на основе профиля клиента и истории, оценивает намерение клиента, суммирует длинный чат для пересменок, может автоматически отвечать на типовые вопросы. Промпт-инжиниринг вынесен в отдельный модуль prompts.js, что позволяет менять формулировки без правки приложения.

Архитектура

Фронтенд — React 18.3 + TypeScript 5.8, сборка через Vite 5.4, дизайн на Tailwind CSS 4.2 + shadcn/ui, маршрутизация на React Router 6 в HashRouter-режиме (чтобы работать внутри iframe и не конфликтовать с роутингом сайта-хоста). Состояние API через React Query, рендер Markdown через React Markdown 10 + rehype-sanitize. Бэкенд — самохостимый Supabase (PostgreSQL + Auth + Realtime + Storage) на собственном сервере. 30+ таблиц с RLS-политиками, 28+ React-хуков (все org-scoped через функцию `get_user_org_id()`). AI-сервер — отдельный Express.js + Anthropic SDK, с auto-close и cron-jobs. Развёртывание — Nginx с Let's Encrypt SSL, PM2 для Node-процессов, Docker Compose для Supabase.

Multi-tenant SaaS

Каждая организация имеет свой изолированный набор чатов, операторов, шаблонов, интеграций и кастомных стилей. Доступны четыре тарифных плана — Пробный (бесплатный), Стартовый, Профессиональный, Корпоративный — с разными лимитами на чаты, операторов и интеграции. Ролевая модель: platform_admin (управление платформой), owner (владелец организации), admin, operator. Готовые интеграции с WooCommerce, AmoCRM, МойСклад, Telegram, WhatsApp Business дают возможность подключить чат к существующей инфраструктуре без переписывания процессов.

Безопасность

• Row Level Security в Supabase — каждый оператор видит только чаты своей организации, изоляция через `get_user_org_id()`
• XSS-защита Markdown через `rehype-sanitize` — опасные теги и атрибуты вырезаются
• Supabase Auth с JWT, поддержка magic link и Google OAuth
• iptables на production закрывают все Supabase-порты от внешнего доступа, Nginx с rate limiting на фронте
• Кастомизация стилей через CSS-редактор в UI — не нужно лезть в код, что снижает риск ошибок

Статус и продакшен

Версия 2.1.0 (март 2026), в продакшене на maslachat.ru, маркетинг-сайт на coschat.tech. Активно используется реальными клиентами в нише e-commerce. Развёрнут на собственном сервере (Timeweb Cloud, self-hosted Supabase). Активная разработка: миграция на новый сервер coschat plus, релиз Service Worker v2.0, обновление дизайн-системы, SaaS multi-tenant трансформация — последние пункты roadmap. Roadmap зафиксирован в `b2b-chat-docs/ROADMAP.md`.

Обычные чаты — это текстовые поля. CosinnChat — это оружие продаж, встроенное прямо в страницу товара. Каждый чат — это сделка, а не диалог.