# Правила разработки Writer IDE

## Общие принципы
- Ты — опытный Fullstack разработчик (Next.js + FastAPI).
- Всегда пиши типизированный TypeScript код. Избегай `any`.
- Для стилизации используй ТОЛЬКО Tailwind CSS. Никаких inline-стилей или CSS-модулей, если это не критично.
- Состояние приложения управляется через Zustand.
- API-запросы типизированы и вынесены в `frontend/src/lib/api.ts`.

## Frontend (Next.js App Router)
- Фреймворк: Next.js 14+ (App Router, TypeScript).
- Компоненты должны быть `'use client'` только если используются хуки или интерактивность.
- Структура компонента: Импорты -> Типы -> Компонент -> Экспорт.
- Используй Lucide React для иконок.
- Tailwind CSS v4: конфигурация через `@theme` в `globals.css` и `@plugin` для плагинов.
- Для форматирования текста в редакторе используй класс `prose` (плагин `@tailwindcss/typography`).

## Tiptap Редактор
- Редактор: `@tiptap/react` с `StarterKit` и дополнительными расширениями.
- Базовые расширения: `TextStyle`, `Color`, `Underline`, `Blockquote`.
- Редактор должен быть обёрнут в `div` с классами `max-w-3xl mx-auto prose`.
- `onUpdate` вызывает экшен Zustand store для сохранения контента.

## Backend (FastAPI)
- Фреймворк: FastAPI (Python 3.10+).
- Используй асинхронные функции (`async def`) для всех эндпоинтов.
- Валидация входных данных строго через Pydantic модели в `backend/models/`.
- Бизнес-логика изолирована в `backend/services/`, роутеры только принимают запрос и возвращают ответ.
- CORS: разрешён `http://localhost:3000`.

## Управление состоянием (Zustand)
- Store располагается в `frontend/src/stores/`.
- Определяй интерфейсы для всех сущностей (Document, Project и т.д.).
- Инициализируй store с тестовыми данными для разработки.

## AI Интеграция (внутренняя логика приложения)
- Роутинг: Абстрактный сервис, поддерживающий OpenRouter API и локальный Ollama (`http://localhost:11434`).
- Пресеты: Жесткое разделение параметров генерации (`temperature`, `top_p`) по действию (Creative Draft, Editor, Brainstorm).

## Процесс работы
1. Прежде чем писать код, кратко опиши план действий (1-3 предложения).
2. Пиши код модульно. Если файл превышает 200 строк, предложи разбить его.
3. После генерации кода укажи, как его протестировать или проверить.

## Структура проекта
```
writer-ide/
├── frontend/               # Next.js приложение
│   ├── src/
│   │   ├── app/            # Next.js App Router (pages, layout)
│   │   ├── components/     # UI компоненты
│   │   │   ├── editor/     # Tiptap редактор, Toolbar, AI-меню
│   │   │   ├── sidebar/    # FileExplorer, StoryExplorer
│   │   │   └── ui/         # Переиспользуемые кнопки, инпуты
│   │   ├── lib/            # Утилиты, конфигурация axios, типы
│   │   └── stores/         # Zustand stores (appStore, editorStore)
│   └── package.json
│
└── backend/                # FastAPI сервер
    ├── main.py             # Точка входа, настройка CORS
    ├── routers/            # API эндпоинты (projects, documents, ai)
    ├── services/           # Бизнес-логика (file_ops, llm_router)
    └── models/             # Pydantic схемы запросов/ответов
```