coopcloud_code/home
0
0
Fork 0
Code Issues 2 Pull requests Projects Releases Packages Wiki Activity Actions

v1.3 — Rebuild admin dashboard in Dioxus + dioxus-bootstrap-css #9

New issue
Closed
opened 2026-03-23 12:54:08 +00:00 by mik-tf · 2 comments
mik-tf commented 2026-03-23 12:54:08 +00:00
Member
Copy link

v1.3 — Admin Dashboard in Dioxus

The admin dashboard currently uses Axum + Tera + Bootstrap CDN (server-side HTML). This is the old pattern we migrated away from in the main marketplace.

Rebuild it in Dioxus 0.7 + dioxus-bootstrap-css to match the marketplace SPA stack.

Why

  • Consistency: same stack across all web interfaces
  • Type safety: compile-time checked components vs string HTML
  • Component reuse: share common components with marketplace frontend
  • No Bootstrap JS dependency: Dioxus signals handle all interactivity
  • Same developer experience across all frontends

Scope

Rewrite projectmycelium_marketplace_admin from Tera templates to Dioxus:

Keep

  • RPC proxy to backend (POST /rpc)
  • Independent JWT auth (admin-only)
  • All 10 dashboard tabs
  • All existing functionality

Replace

  • 12 Tera HTML templates → Dioxus components
  • Bootstrap CDN → dioxus-bootstrap-css
  • Server-side rendering → Client-side WASM
  • admin.css + admin.js → Dioxus signals + dioxus-bootstrap-css

Dashboard tabs (10)

  1. Overview — stats cards, registration funnel, recent users
  2. Users — search, table, detail modal
  3. Products — table with type filter, CRUD
  4. Orders — table with status filter
  5. Nodes — table with health indicators
  6. Services — table with booking counts
  7. Apps — table with deployment health
  8. Messaging — conversation viewer
  9. Audit — paginated event log with severity filter
  10. Settings — system info, RPC health check

Stack

  • Dioxus 0.7 (web)
  • dioxus-bootstrap-css 0.2
  • dioxus-router
  • gloo-net (RPC calls via /rpc proxy)

Rules

  • Use dioxus-bootstrap-css components for ALL UI (Navbar, Dropdown, Card, Table, Modal, Alert, Badge, etc.)
  • Never hand-roll toggle/dropdown/modal logic — the crate handles state
  • If a crate component is missing, fix upstream at github.com/mik-tf/dioxus-bootstrap-css

Acceptance criteria

  • All 10 tabs functional in Dioxus SPA
  • Auth flow works (login → JWT → localStorage)
  • RPC proxy forwards to backend
  • WASM bundle < 150KB gzip
  • Cargo check passes for wasm32 target
  • Tera templates removed
  • Pushed to projectmycelium_marketplace_admin repo
# v1.3 — Admin Dashboard in Dioxus The admin dashboard currently uses Axum + Tera + Bootstrap CDN (server-side HTML). This is the old pattern we migrated away from in the main marketplace. Rebuild it in Dioxus 0.7 + dioxus-bootstrap-css to match the marketplace SPA stack. ## Why - Consistency: same stack across all web interfaces - Type safety: compile-time checked components vs string HTML - Component reuse: share common components with marketplace frontend - No Bootstrap JS dependency: Dioxus signals handle all interactivity - Same developer experience across all frontends ## Scope Rewrite `projectmycelium_marketplace_admin` from Tera templates to Dioxus: ### Keep - RPC proxy to backend (`POST /rpc`) - Independent JWT auth (admin-only) - All 10 dashboard tabs - All existing functionality ### Replace - 12 Tera HTML templates → Dioxus components - Bootstrap CDN → dioxus-bootstrap-css - Server-side rendering → Client-side WASM - `admin.css` + `admin.js` → Dioxus signals + dioxus-bootstrap-css ### Dashboard tabs (10) 1. Overview — stats cards, registration funnel, recent users 2. Users — search, table, detail modal 3. Products — table with type filter, CRUD 4. Orders — table with status filter 5. Nodes — table with health indicators 6. Services — table with booking counts 7. Apps — table with deployment health 8. Messaging — conversation viewer 9. Audit — paginated event log with severity filter 10. Settings — system info, RPC health check ### Stack - Dioxus 0.7 (web) - dioxus-bootstrap-css 0.2 - dioxus-router - gloo-net (RPC calls via /rpc proxy) ## Rules - Use dioxus-bootstrap-css components for ALL UI (Navbar, Dropdown, Card, Table, Modal, Alert, Badge, etc.) - Never hand-roll toggle/dropdown/modal logic — the crate handles state - If a crate component is missing, fix upstream at github.com/mik-tf/dioxus-bootstrap-css ## Acceptance criteria - [ ] All 10 tabs functional in Dioxus SPA - [ ] Auth flow works (login → JWT → localStorage) - [ ] RPC proxy forwards to backend - [ ] WASM bundle < 150KB gzip - [ ] Cargo check passes for wasm32 target - [ ] Tera templates removed - [ ] Pushed to projectmycelium_marketplace_admin repo
mik-tf commented 2026-03-23 13:13:29 +00:00
Author
Member
Copy link

Status: In progress

Admin dashboard Dioxus rebuild is running — rewriting 12 Tera templates to Dioxus + dioxus-bootstrap-css components.

What is being done now

  • Replacing src/templates/*.html (12 Tera files) with Dioxus components
  • Replacing src/static/css/admin.css + src/static/js/admin.js with dioxus-bootstrap-css
  • Keeping Axum proxy server for /rpc forwarding and WASM serving
  • Using crate components (Navbar, Dropdown, Card, Table, Modal, etc.) — not hand-rolled

What is left after this issue

Task Status
Admin Dioxus rebuild In progress
Push to projectmycelium_marketplace_admin repo Pending
Deploy to TFGrid infrastructure Not started
DNS records for projectmycelium.org subdomains Not started (Cloudflare ready, both zones active)
Smoke tests against live deployment Not started
First Forgejo release on deploy repo (v1.0.0) Not started
Archive old monorepo Not started

Infrastructure readiness

  • Cloudflare: projectmycelium.org and zdfz.live both active with unified API key
  • TFGrid: devnet mnemonic available
  • Forge: all 5 repos populated
  • Deploy: release pipeline ready (make release TAG=x.y.z)
## Status: In progress Admin dashboard Dioxus rebuild is running — rewriting 12 Tera templates to Dioxus + dioxus-bootstrap-css components. ### What is being done now - Replacing `src/templates/*.html` (12 Tera files) with Dioxus components - Replacing `src/static/css/admin.css` + `src/static/js/admin.js` with dioxus-bootstrap-css - Keeping Axum proxy server for `/rpc` forwarding and WASM serving - Using crate components (Navbar, Dropdown, Card, Table, Modal, etc.) — not hand-rolled ### What is left after this issue | Task | Status | |------|--------| | Admin Dioxus rebuild | In progress | | Push to `projectmycelium_marketplace_admin` repo | Pending | | Deploy to TFGrid infrastructure | Not started | | DNS records for projectmycelium.org subdomains | Not started (Cloudflare ready, both zones active) | | Smoke tests against live deployment | Not started | | First Forgejo release on deploy repo (v1.0.0) | Not started | | Archive old monorepo | Not started | ### Infrastructure readiness - Cloudflare: `projectmycelium.org` and `zdfz.live` both active with unified API key - TFGrid: devnet mnemonic available - Forge: all 5 repos populated - Deploy: release pipeline ready (`make release TAG=x.y.z`)
mik-tf commented 2026-03-23 13:14:54 +00:00
Author
Member
Copy link

v1.3 Complete

Commit: 790460e on projectmycelium_marketplace_admin

What was done

  • Rebuilt admin from Tera SSR → Dioxus 0.7 + dioxus-bootstrap-css
  • 28 Rust source files (2,643 lines)
  • 11 pages + login, 3 shared components, 2 layout components
  • All UI via crate components (Card, Table, Modal, Dropdown, Nav, etc.)
  • Dark/light mode via ThemeProvider + ThemeToggle
  • JWT auth with localStorage + Argon2
  • Axum proxy binary for /rpc and WASM serving
  • Deleted all 12 Tera templates + CSS/JS

All web interfaces now on Dioxus

Interface Stack Status
Marketplace SPA Dioxus + dioxus-bootstrap-css Done
Admin Dashboard Dioxus + dioxus-bootstrap-css Done
Backend SSR Axum + Tera (thin SEO routes only) Done
Marketing Astro + Tailwind Done
## v1.3 Complete Commit: `790460e` on `projectmycelium_marketplace_admin` ### What was done - Rebuilt admin from Tera SSR → Dioxus 0.7 + dioxus-bootstrap-css - 28 Rust source files (2,643 lines) - 11 pages + login, 3 shared components, 2 layout components - All UI via crate components (Card, Table, Modal, Dropdown, Nav, etc.) - Dark/light mode via ThemeProvider + ThemeToggle - JWT auth with localStorage + Argon2 - Axum proxy binary for /rpc and WASM serving - Deleted all 12 Tera templates + CSS/JS ### All web interfaces now on Dioxus | Interface | Stack | Status | |-----------|-------|--------| | Marketplace SPA | Dioxus + dioxus-bootstrap-css | Done | | Admin Dashboard | Dioxus + dioxus-bootstrap-css | Done | | Backend SSR | Axum + Tera (thin SEO routes only) | Done | | Marketing | Astro + Tailwind | Done |
Sign in to join this conversation.
No Branch/Tag specified
Branches Tags
main
No results found.
Labels
Clear labels   
meeting-notes

Meeting notes and follow-ups

  
meeting-sensitive

Sensitive meeting; no shared archive or AI processing

  
meeting-transcript

Raw meeting transcript; AI drafts the report

No labels
meeting-notes
meeting-sensitive
meeting-transcript
Milestone
Clear milestone
No items
No milestone
Projects
Clear projects
No items
No project
Assignees
Clear assignees
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
coopcloud_code/home#9
No description provided.