Site Details: exact template rebuild + xterm.js logs + fileContents tree
User-requested rebuild + browser-verified:
1. **Full template port** (templates/akutell/Site Details.html + sitedetails.js):
- All 6 tabs match template structure verbatim (Übersicht, WordPress,
PHP / ini, Datei-Manager, Cronjobs, Logs).
- Tab bar uses clu-dtabs glass button group instead of generic seg.
- Site hero (favicon + domain + server/wp/php/ssl meta) + Besuchen +
WP-Admin buttons in topbar.
2. **Filemanager tab** (template's clu-fm grid):
- File tree rendered recursively from PHP-mirrored sitedetails.js
'tree' array. Folder rows show clu-chev rotation on .open, nested
children indent via clu-tree-children border-left + margin-left.
- 7 baked file contents from sitedetails.js fileContents object
(wp-config.php, .htaccess, robots.txt, index.php, functions.php,
style.css, php.ini) — click any leaf in tree, editor loads it.
- clu-gutter dynamic line-numbers + clu-code-area textarea +
Verwerfen/Speichern action row.
3. **Logs tab with xterm.js**:
- resources/js/app.js imports @xterm/xterm + @xterm/addon-fit,
exposes window.XTerm + window.XTermFit globally.
- resources/css/app.css imports xterm.css.
- Sites show component pushes inline init script with logData baked
in (4 log types × ~8 entries each). xterm renders with ANSI
truecolor escapes per level (INFO blue / WARN yellow / ERROR red /
OK green / DEBUG purple), keeps dark gradient host with custom
scrollbar.
- 4-tab seg (access / error / php / wp) switches log type via
setLog() Livewire action; xterm re-init on livewire:navigated.
- Live folgen checkbox wired (Volt logFollow state).
4. **Cronjobs tab**:
- Real $site->crons table with name/expression-pill/command/last-run/
status + run/more actions + Cronjob-anlegen primary button.
5. **WordPress + PHP tabs**:
- Full forms with all 6 wp-config fields + 5 toggles + Datenbank +
Security Keys cards.
- php.ini with 8 fields + 4 toggles + OPcache stats + 16 extension
pills.
6. **CSS additions**: clu-dtabs/dtab, clu-pane, clu-site-hero, clu-fm,
clu-tree*, clu-chev, clu-editor*, clu-gutter, clu-code-area,
clu-xterm-host (dark gradient + custom scrollbar), clu-set-grid,
clu-switch-line, clu-section-head.
7. SiteDetailsTest assertions updated to match new template wording
(PHP / ini, Datei-Manager, Cronjobs, Schnellaktionen). 36 Pest tests
green.
8. Browser-verified: chart loads, xterm renders logs in correct color,
files tab tree expands + editor loads wp-config.php, 0 console errors.
Boban Blaskovic
4d4e2cbc33