fission-console/doc/refactor-ui-2026-05-02/plan.md

Рефакторинг UI: монолит → модули

Дата: 2026-05-02
Ветка: второмая
Файл-источник: console/ui/index.html (1651 строк, 73 функции)

---

Целевая структура

console/ui/
├── index.html          # только HTML-скелет + <script src="..."> теги
├── cron.html           # без изменений
├── css/
│   └── styles.css      # все стили (сейчас в <style> блоке index.html)
└── js/
    ├── config.js       # константы (DEFAULT_CODE, язык-шаблоны)
    ├── api.js          # authHeaders, getJSON, requestJSON
    ├── auth.js         # showLoginOverlay, hideLoginOverlay, doLogin, jwtEmail, setUserAvatar, doLogout, checkAuth
    ├── ui.js           # setText, showStatus, clearStatus, h, formatTimestamp, timestampCell
    ├── functions.js    # openCreate, closeCreate, submitCreate, openEdit, closeEdit, submitEdit, removeFn, parseMethods, parseTimeout, onLangChange
    ├── triggers.js     # httpTriggerByFn, timeTriggerByFn, toggleScheduleFields, schedulePayload, syncScheduleForFunction
    ├── modals.js       # openHelp, closeHelp, openInvoke, closeInvoke, submitInvoke
    ├── ai.js           # aiCheck, aiGenerate, aiExplain, askAssistant, toggleAssistant, showGenPrompt, llmGeneratedWarning, addLLMWarning
    ├── init.js         # initLog, pollNSStatus, formatSeconds, setInitElapsed, setInitCurrentStage, setBox, missingKeys, firstPendingStage, describeInitReason, summarizeInit, explainDelay, startTimedStatus, renderInitStages
    └── app.js          # reloadAll, главный контроллер, window.S = {}

embed.go: //go:embed index.html cron.html css js

---

Порядок загрузки в index.html (критично!)

<script src="js/config.js"></script>
<script src="js/api.js"></script>
<script src="js/ui.js"></script>
<script src="js/auth.js"></script>
<script src="js/functions.js"></script>
<script src="js/triggers.js"></script>
<script src="js/modals.js"></script>
<script src="js/ai.js"></script>
<script src="js/init.js"></script>
<script src="js/app.js"></script>

---

Шаги (пошагово, с билдом после каждого)

Шаг 1 — CSS

• Вынести <style> блок из index.html в css/styles.css
• Заменить на <link rel="stylesheet" href="css/styles.css">
• Обновить embed.go
• BUILD + DEPLOY + ПРОВЕРКА

Шаг 2 — config.js

• Вынести: объект DEFAULT_CODE (шаблоны кода по языкам)
• Самый изолированный, без зависимостей
• BUILD + DEPLOY + ПРОВЕРКА

Шаг 3 — api.js

• Вынести: authHeaders, getJSON, requestJSON
• Зависит от: ничего (только localStorage)
• BUILD + DEPLOY + ПРОВЕРКА

Шаг 4 — ui.js

• Вынести: setText, showStatus, clearStatus, h, formatTimestamp, timestampCell
• Зависит от: ничего
• BUILD + DEPLOY + ПРОВЕРКА

Шаг 5 — auth.js

• Вынести: showLoginOverlay, hideLoginOverlay, doLogin, jwtEmail, setUserAvatar, doLogout, checkAuth
• Зависит от: api.js, ui.js
• BUILD + DEPLOY + ПРОВЕРКА

Шаг 6 — triggers.js

• Вынести: httpTriggerByFn, timeTriggerByFn, toggleScheduleFields, schedulePayload, syncScheduleForFunction
• Зависит от: api.js, ui.js
• BUILD + DEPLOY + ПРОВЕРКА

Шаг 7 — modals.js

• Вынести: openHelp, closeHelp, openInvoke, closeInvoke, submitInvoke
• Зависит от: api.js, ui.js
• BUILD + DEPLOY + ПРОВЕРКА

Шаг 8 — functions.js

• Вынести: openCreate, closeCreate, submitCreate, openEdit, closeEdit, submitEdit, removeFn, parseMethods, parseTimeout, onLangChange
• Зависит от: api.js, ui.js, triggers.js, config.js
• BUILD + DEPLOY + ПРОВЕРКА

Шаг 9 — ai.js

• Вынести: aiCheck, aiGenerate, aiExplain, askAssistant, toggleAssistant, showGenPrompt, llmGeneratedWarning, addLLMWarning
• Зависит от: api.js, ui.js
• BUILD + DEPLOY + ПРОВЕРКА

Шаг 10 — init.js

• Вынести: initLog, pollNSStatus, formatSeconds, setInitElapsed, setInitCurrentStage, setBox, missingKeys, firstPendingStage, describeInitReason, summarizeInit, explainDelay, startTimedStatus, renderInitStages
• Зависит от: api.js, ui.js, auth.js
• BUILD + DEPLOY + ПРОВЕРКА

Шаг 11 — app.js

• Вынести: reloadAll, window.S = {}, DOMContentLoaded инициализация
• Зависит от: всё выше
• BUILD + DEPLOY + ПРОВЕРКА

---

Правила

1. После каждого шага index.html должен уменьшиться ровно на то что вынесли
2. Никаких дублирований — функция живёт только в одном файле
3. Глобальные переменные (window.S) остаются в app.js
4. Порядок <script> тегов строго по зависимостям
5. Старый код из index.html удалять только после проверки билда

---

Статус

• Шаг 1: CSS
• Шаг 2: config.js
• Шаг 3: api.js
• Шаг 4: ui.js
• Шаг 5: auth.js
• Шаг 6: triggers.js
• Шаг 7: modals.js
• Шаг 8: functions.js
• Шаг 9: ai.js
• Шаг 10: init.js
• Шаг 11: app.js