Design pass: make eco-app.coilysiren.me the beautiful eco-app website

coilysiren commented

2026-06-12 11:34:57 +00:00

Owner

eco-app.coilysiren.me is live (2026-06-12) serving the placeholder SPA: frontend/ (Vite + React + TypeScript, no SSR), built into the fused image by the Dockerfile node stage, served at / by eco_mcp_app.http_app with assets under /assets.

This issue tracks the real design pass - "a beautiful new eco-app website". Raw material already shipping from this same service:

/preview + /preview/<tool> cards (server status, economy, map, species, climate, crafting, fair price, government, ecoregion)
/jobs/ tracker UI
/info JSON

Direction sketch from the session that shipped the placeholder:

Landing page: hero, live server snapshot (meteor countdown, online count), CTA links (MCP install, Discord, Steam).
Per-feature pages that grow into the dashboard backlog the old eco-mcp-app repo carried (economy health, map + property overlay, milestone tracker, species profiles, ecopedia).
OpenGraph meta per route (the old eco-mcp-app#16 ask) - the SPA index.html already carries the base set.

Iteration loop: ward exec frontend-dev (HMR on :5173, proxies to ward exec http on :4000), ship = push to main (CI publishes image) + services/eco-app/scripts/rollout.sh on kai-server (auto-rollout tracked in coilyco-bridge/deploy#5).

eco-app.coilysiren.me is live (2026-06-12) serving the placeholder SPA: `frontend/` (Vite + React + TypeScript, no SSR), built into the fused image by the Dockerfile node stage, served at `/` by `eco_mcp_app.http_app` with assets under `/assets`. This issue tracks the real design pass - "a beautiful new eco-app website". Raw material already shipping from this same service: * `/preview` + `/preview/<tool>` cards (server status, economy, map, species, climate, crafting, fair price, government, ecoregion) * `/jobs/` tracker UI * `/info` JSON Direction sketch from the session that shipped the placeholder: 1. Landing page: hero, live server snapshot (meteor countdown, online count), CTA links (MCP install, Discord, Steam). 2. Per-feature pages that grow into the dashboard backlog the old eco-mcp-app repo carried (economy health, map + property overlay, milestone tracker, species profiles, ecopedia). 3. OpenGraph meta per route (the old eco-mcp-app#16 ask) - the SPA `index.html` already carries the base set. Iteration loop: `ward exec frontend-dev` (HMR on :5173, proxies to `ward exec http` on :4000), ship = push to main (CI publishes image) + `services/eco-app/scripts/rollout.sh` on kai-server (auto-rollout tracked in coilyco-bridge/deploy#5).

coilysiren referenced this issue from a commit

2026-06-12 12:16:16 +00:00

feat(frontend): live landing page + router/lint/vitest scaffolding

coilysiren commented

2026-06-12 12:16:39 +00:00

Author

Owner

Milestone 1 landed in 5491094: the placeholder is now a live landing page.

Hero with the server's own description (Eco rich-text markup stripped), live pill with online/total settlers.
Meteor banner: countdown, cycle progress bar, day counter. Clear-sky variant when hasMeteor is false.
Stat grid: players, plants, laws, culture, economy line, world size, server version.
CTAs: Discord (pulled live from the payload), Steam, server card, jobs tracker.
Polls /preview.json every 60s and degrades gracefully when the game server is unreachable - the shell and CTAs stay useful.
Scaffolding for what comes next: react-router route table, eslint (typescript-eslint + react-hooks), vitest + testing-library (10 tests), new ward verbs frontend-test / frontend-lint, and a CI frontend job gating publish.

Next directions from the issue sketch, in rough order:

Per-feature pages: economy health, map + property overlay, milestone tracker, species profiles.
OpenGraph meta per route once routes exist.
Achievements strip on the landing page (payload already carries them).

Milestone 1 landed in 5491094: the placeholder is now a live landing page. * Hero with the server's own description (Eco rich-text markup stripped), live pill with online/total settlers. * Meteor banner: countdown, cycle progress bar, day counter. Clear-sky variant when `hasMeteor` is false. * Stat grid: players, plants, laws, culture, economy line, world size, server version. * CTAs: Discord (pulled live from the payload), Steam, server card, jobs tracker. * Polls `/preview.json` every 60s and degrades gracefully when the game server is unreachable - the shell and CTAs stay useful. * Scaffolding for what comes next: react-router route table, eslint (typescript-eslint + react-hooks), vitest + testing-library (10 tests), new ward verbs `frontend-test` / `frontend-lint`, and a CI `frontend` job gating publish. Next directions from the issue sketch, in rough order: 1. Per-feature pages: economy health, map + property overlay, milestone tracker, species profiles. 2. OpenGraph meta per route once routes exist. 3. Achievements strip on the landing page (payload already carries them).

coilysiren referenced this issue from a commit

2026-06-12 12:36:10 +00:00

feat(jobs): restyle the jobs tracker onto the forest-glass visual language

coilysiren referenced this issue from a commit

2026-06-12 13:04:39 +00:00

feat(frontend): flatten the site - thin homepage directory, /server snapshot page

coilysiren commented

2026-06-12 13:05:02 +00:00

Author

Owner

Direction update from Kai mid-iteration: the site is one flat surface, not per-page spheres. Landed across two commits:

/ is now a thin directory - compact hero, then one card per surface (Server, Jobs, Server card, Community) with small live badges (meteor days, online count, settler count) that degrade silently when the game server is unreachable.
/server carries the full live snapshot the old landing page held (hero, meteor banner, stat grid, CTAs).
/jobs dropped its embedded server-status card - general server stats belong to the SPA pages now. The jobs page is jobs-only and shares the topbar/footer shape and theme.css visual language.
http_app.py grew a catch-all SPA fallback so client routes like /server survive hard refreshes (tests in tests/mcp/test_spa_fallback.py).

New per-feature pages should follow the same shape: a card on the homepage directory, a route under the shared Layout, heavy content on the subpage.

Direction update from Kai mid-iteration: the site is **one flat surface**, not per-page spheres. Landed across two commits: * `/` is now a **thin directory** - compact hero, then one card per surface (Server, Jobs, Server card, Community) with small live badges (meteor days, online count, settler count) that degrade silently when the game server is unreachable. * `/server` carries the full live snapshot the old landing page held (hero, meteor banner, stat grid, CTAs). * `/jobs` dropped its embedded server-status card - general server stats belong to the SPA pages now. The jobs page is jobs-only and shares the topbar/footer shape and theme.css visual language. * `http_app.py` grew a catch-all SPA fallback so client routes like `/server` survive hard refreshes (tests in `tests/mcp/test_spa_fallback.py`). New per-feature pages should follow the same shape: a card on the homepage directory, a route under the shared Layout, heavy content on the subpage.

coilysiren commented

2026-06-12 13:25:31 +00:00

Author

Owner

SPA-everything landed in 7b9a832: the Jinja2 + HTMX jobs dashboard is retired and /jobs is a React route under the shared Layout - no more full-page reloads crossing the jobs boundary. eco_spec_tracker is now API-only at /jobs/api (public /jobs/api/v1/* paths unchanged, /v1/meta carries the mock-data flag), the frame-ancestors CSP ships site-wide from http_app.py so the coilysiren.me iframe embed keeps working, and the vite proxy narrowed to /jobs/api. Verified live: client-side nav across / /server /jobs, real 114-player data, legacy /jobs/professions URLs land on the SPA page.

SPA-everything landed in 7b9a832: the Jinja2 + HTMX jobs dashboard is retired and /jobs is a React route under the shared Layout - no more full-page reloads crossing the jobs boundary. eco_spec_tracker is now API-only at /jobs/api (public /jobs/api/v1/* paths unchanged, /v1/meta carries the mock-data flag), the frame-ancestors CSP ships site-wide from http_app.py so the coilysiren.me iframe embed keeps working, and the vite proxy narrowed to /jobs/api. Verified live: client-side nav across / /server /jobs, real 114-player data, legacy /jobs/professions URLs land on the SPA page.

coilysiren referenced this issue

2026-06-12 13:44:19 +00:00

Crafting atlas citizen attribution: exporter rows misalign and carry numeric ids #5

coilysiren referenced this issue from a commit

2026-06-12 13:50:24 +00:00

feat(frontend): economy + crafting atlas pages, deep-linked (wave 0)

coilysiren commented

2026-06-12 13:50:35 +00:00

Author

Owner

Wave plan agreed with Kai after auditing all 12 /preview pages, and wave 0 landed in 3470eb7:

Wave 0 (done): /economy and /crafting, cross-linked, consuming /preview/*.json. Crafting carries ?q= deep links (filter state in the URL, row-click drills in). Backend sanitizer drops misaligned exporter keys and disables citizen attribution (eco-app#5).
Wave 1 (next): /map (deed polygons), /milestones (culture progress), /climate (CO2 / sea level / pollution).
Dropped from the plan: species and government pages. fair_price / explain_eco_item / list_public_eco_servers stay MCP-only.
Broken-in-prod note: get_eco_ecoregion 502s on the old eco-mcp deploy but works on current code - the consolidation rollout fixes it without further work.

Wave plan agreed with Kai after auditing all 12 /preview pages, and wave 0 landed in 3470eb7: * Wave 0 (done): /economy and /crafting, cross-linked, consuming /preview/*.json. Crafting carries ?q= deep links (filter state in the URL, row-click drills in). Backend sanitizer drops misaligned exporter keys and disables citizen attribution (eco-app#5). * Wave 1 (next): /map (deed polygons), /milestones (culture progress), /climate (CO2 / sea level / pollution). * Dropped from the plan: species and government pages. fair_price / explain_eco_item / list_public_eco_servers stay MCP-only. * Broken-in-prod note: get_eco_ecoregion 502s on the old eco-mcp deploy but works on current code - the consolidation rollout fixes it without further work.

coilysiren added the

P3

label

2026-06-17 09:24:31 +00:00

coilysiren referenced this issue

2026-07-05 01:22:36 +00:00

Trade & store logistics: SPA /trade route (product surface for the whole set) #54

coilysiren closed this issue

2026-07-06 15:52:19 +00:00