Files
f7cloud_mobile/docs/app-map
..

Карта приложений (forbion.f7cloud.ru)

Рабочая карта UI каждого приложения на боевом forbion — источник, по которому фич-роли сверяют и строят нативный мобильный клиент. Составляется наблюдением живого сервера (аккаунт cloude), строго read-only — ничего не создавать/не менять/не удалять, почту не отправлять (см. mail/073).

‼️ ТОЛЬКО МОБИЛЬНАЯ ВЕРСИЯ САЙТА. Карта строится по мобильной вёрстке forbion (узкий вьюпорт ~390–420px: браузер в device-режиме, реальный телефон или эмулятор), НЕ по десктопной — они принципиально разные, наш клиент повторяет мобильную. Признак мобильной версии: снизу плавающая панель + шторка приложений по «трём полоскам» (как в _mobile-*.css), а не десктопный сайдбар. Десктопный layout в карте недопустим.

Источники кода (стили + кнопки окон)

На боевом forbion приложения стоят скомпилированными — читаемого src/ там нет (кроме f7mail). Поэтому «в коде найти стили и кнопки» = три локальных источника (прод-SSH для этого не нужен):

  1. Стили + карта элементов окна — тема forbion, локально: /root/claude/design-reference/forbion-theme/ (мобильные css/pages/pages-mobile/_mobile-*.css и css/pages/app-<app>/). Селекторы в этих CSS перечисляют каждую кнопку/элемент окна (тема их адресует для стилизации) — это и есть стили + список элементов по окнам.

  2. Читаемые компоненты (реальные кнопки/меню/обработчики) — апстрим-исходник под ТОЧНУЮ версию, установленную на forbion:

    Приложение Репозиторий / источник Версия на forbion
    files nextcloud/server → apps/files/src 2.4.0 (или тема+web)
    mail локально design-reference/forbion-apps/f7mail/src (форк F7) + nextcloud/mail f7mail 0.2.3 / mail 5.7.15
    calendar nextcloud/calendar v6.4.0
    contacts nextcloud/contacts v8.3.10
    deck nextcloud/deck v1.16.4
    notes nextcloud/notes v5.0.0
    notifications nextcloud/notifications 5.0.0-dev.0 (ближайший тег/master)
    tasks nextcloud/tasks v0.17.1
    talk (conf) форк F7 vendor/talk-android + nextcloud/spreed v22.0.12

    Рецепт (свой app+версия): git clone --depth 1 --branch <тег> --filter=blob:none \ https://github.com/nextcloud/<repo>.git, читать src/ (*.vue).

  3. Иконки/шаблоны/скомпилированный css всех приложений — локально /root/claude/design-reference/forbion-apps/<app>/ (снято с forbion read-only).

Связка: тема (мобильные стили + селекторы окна) ↔ апстрим src (какая кнопка что делает) ↔ живой мобильный web (как это выглядит) → полная карта.

Где что лежит

Одна карта на приложение: docs/app-map/<module>.md. Владелец карты = фич-роль модуля. Коммитит в свой файл автором b-mob-<x>, обычным ритуалом (git pull --rebase → правка).

Файл Роль Приложение
shell.md b-dev-mobile Оболочка: нижняя панель, шторка приложений, бургер
files.md b-mob-files Файлы
mail.md b-mob-mail Почта (вход cloude@forbion.ru)
talk.md b-mob-conf Конференции
tasks.md b-mob-tasks Задачи
notes.md b-mob-notes Заметки
notifications.md b-mob-notify Уведомления (лента)
deck.md b-mob-deck Карточки
calendar.md b-mob-calendar Календарь
contacts.md b-mob-contacts Контакты

Формат (единый для всех)

Карта — это дерево переходов: экран → его кнопки/пункты → куда каждая ведёт → экран с кнопками, и так вглубь. Для каждого экрана:

# Карта: <Приложение>

## Вход
Как попадаем: нижняя панель / шторка / пункт меню — что именно нажать.

## Экран: <Название экрана>
**Шапка:** <кнопка → действие/экран>, <кнопка → …>
**Тело:** что показывается (список/сетка/форма/пусто-состояние).
**Действия:**
- «<Кнопка/пункт>» → <что делает: открывает экран X / диалог Y / выполняет действие Z>
  - (если ведёт в подэкран — раскрыть его тем же блоком: Шапка/Тело/Действия)
- «<⋯ / long-press / контекстное меню>» → пункты: «A» → …, «B» → …
- «<+ / FAB / создать>» → форма «<Название>»: поля <перечислить>, кнопки <Сохранить/Отмена>

## Экран: <Следующий>

Правила:

  • Пиши ЧТО видит пользователь и КУДА ведёт — без реализации/CSS-классов.
  • Каждую кнопку/иконку — отдельной строкой с назначением. Если назначение неочевидно — пометь (?) и опиши гипотезу.
  • Модалки/шиты/выпадающие меню — тоже экраны, раскрывай их.
  • Отмечай, где мобильная веб-версия отличается от того, что уже есть в нативном клиенте (расхождение: …) — это сразу твой бэклог на добивку.
  • Пустые состояния и состояния ошибки — фиксируй (это отдельные экраны в дизайне).

Готовую карту используем как чек-лист: сверка вёрстки и функционала нативного экрана идёт по этому дереву.

Diff-списки и метрика ≤2% (программа 1:1, mail/081, mail/083)

После карты — по каждому приложению docs/app-map/<app>.diff.md: список расхождений веб↔натив. Функционал и дизайн считаем РАЗДЕЛЬНО, каждая ≥98%.

Каждый пункт: [Ф|Д] (функционал/дизайн) · [open|done|n-a] (n-a = осознанно мобильно-неприменимо, в знаменатель не входит, но остаётся в финальном списке).

На экран:

  • Ff = 1 open-Ф / всего-Ф (Ф = все действия/функции окна в вебе),
  • Fd = 1 open-Д / всего-Д (Д по элементам: композиция, порядок, размеры/отступы, цвет, типографика, иконки).

По приложению Ff_app/Fd_app = среднее по экранам (до 0.1%). Цель: обе ≥98%. Итерации сверки повторяем до порога; в конце — Ff% / Fd% + остаточный список (open + n-a с обоснованием).

Шапку diff начинайте счётчиком, например:

# Diff: <Приложение> — итерация N (ГГГГ-ММ-ДД)
Ff: 96.4% (5 open Ф / 138) · Fd: 98.1% (3 open Д / 160) · n-a: 4

Медиа-просмотрщики (нативно, mail/083)

Открытие медиа — нативным слоем (зона b-mob-files): Coil (изображения/gif/svg), Media3/ExoPlayer (видео/аудио, стрим по WebDAV через media3-datasource-okhttp + Basic-auth), PdfRenderer (PDF), Collabora (офис — есть). Роутинг по типу в FilesViewModel.openItem.

Всплывающее меню — обязательно поимённо (mail/087)

В каждом приложении всплывающее меню СВОЁ (контекстное «⋯»/overflow, «+»/FAB, long-press, выпадающие селекторы). Раскрывай КАЖДОЕ отдельным блоком с полным списком пунктов по порядку; в diff — построчная сверка веб↔натив (состав/порядок/иконка/подменю). Не «меню совпало» общей строкой — именно тут прячутся пропущенные действия.