agent-ecosystem/landing/docs/iterations/ITERATION_02_UI_SECTIONS.md
iliya e6e89d4ebc fix(tests): improve messageId generation for legacy inbox rows
- Enhanced tests to ensure consistent messageId generation for legacy inbox rows lacking a messageId.
- Updated test descriptions for better clarity regarding the new messageId handling.
- Adjusted test expectations to align with the updated behavior of relaying legacy inbox rows with generated messageIds.
2026-03-23 16:31:37 +02:00

4.2 KiB
Raw Blame History

Итерация 02 — страницы и секции (UI) на данных из data/

Цель

Собрать UI лендинга с секциями из плана, но без “случайного” стейта в компонентах: данные/конфиги лежат в landing/data, общее состояние — в Pinia.

Правила, чтобы лендинг было легко менять

  • Порядок секций задаётся конфигом (например landing/data/sections.ts), чтобы можно было переставлять/скрывать блоки без переписывания pages/index.vue.
  • Тексты и контент: разделяем “микрокопирайт” и “контент секций”.
    • Микрокопирайт (кнопки, лейблы, короткие подписи) — через i18n (landing/locales/*).
    • Контент секций (FAQ, список фич, описания провайдеров, тексты блоков) — через локализованные контент-файлы по структуре (например landing/content/{locale}.ts или landing/content/{locale}.json).
    • В landing/data/* храним структуру и стабильные id, а не длинные строки и не “россыпь ключей”.
    • Правило простое: чтобы изменить один пункт FAQ, не нужно искать 10 ключей — открыл контент-файл нужной локали и поправил.
  • UI-атомы (components/ui/*) не знают про бизнес и не ходят в store. Они получают props и рендерят.
  • Секции (components/sections/*) отвечают за композицию: берут данные из data/*, нужные значения из store и связывают это с UI.

Шаги

  1. Layout:
    • layouts/default.vue: header/footer, контейнер, базовые отступы.
  2. Страница /:
    • Hero, Features, Providers, Screenshots, Download, Privacy, FAQ.
  3. Страница /download:
    • Платформо-специфичный блок + инструкции установки.
  4. Секция Privacy:
    • Чётко подсветить: локальное хранение ключей, опциональные ключи, отсутствие облачного хранилища.
    • Отдельный блок: “часть компонентов open-source” (без излишних обещаний).
  5. i18n покрытие:
    • Все тексты вытащены в locales, не оставляем хардкод строк.
  6. Data-driven подход:
    • Карточки фич, FAQ, провайдеры, список платформ — из landing/data/*.
  7. Навигация по секциям:
    • Якоря/scroll в рамках страницы так, чтобы это было доступно (фокус/URL, без поломки истории).

Критерии готовности

  • Компоненты секций не содержат бизнес-данных “внутри себя”.
  • Минимум логики внутри шаблонов, максимум — через computed/props и util-функции.
  • i18n покрывает весь UI без пропусков.
  • Любую секцию можно скрыть конфигом, и страница остаётся валидной.
  • Для изображений есть корректные alt/подписи, а для кнопок — понятные названия/label.

Чеклист перепроверки

  • Нет дублирования конфигов секций.
  • Секции легко переставить/скрыть, не ломая остальное.
  • Нет лишних сторонних зависимостей “на всякий случай”.
  • На мобильных нет “сломанных” отступов/переполнений (особенно в таблицах/списках).