cameleer/cameleer-saas
2
0
Fork 0
Code Issues 22 Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Phase 9 — Frontend React Shell #35

Merged
hsiegeln merged 11 commits from feat/phase-9-frontend-react-shell into main 2026-04-04 22:12:53 +02:00
Conversation 0 Commits 11 Files Changed 32 +4642
claude commented 2026-04-04 22:07:24 +02:00
Owner
Copy Link

Summary

  • React 19 SPA in ui/ directory for managing tenants, environments, apps, and deployments
  • Shared Logto OIDC session with cameleer3-server observability dashboard (same localStorage keys)
  • RBAC on all actions: OWNER/ADMIN/DEVELOPER/VIEWER role-based visibility
  • @cameleer/design-system v0.1.31 — AppShell, Sidebar, DataTable, Badge, LogViewer, etc.
  • Vite 8 + React Router 7 + Zustand + TanStack React Query
  • Spring Boot SPA controller for client-side routing
  • Multi-stage Dockerfile with frontend build
  • CI pipeline updated with frontend build step

Pages

Page Route Description
Dashboard / Tenant overview, KPI strip, quick actions
Environments /environments List + create environments
Environment Detail /environments/:id App list, new app upload, delete env
App Detail /environments/:eid/apps/:aid Deploy/stop/restart, logs, agent status, routing
License /license Tier, features, limits, expiry
Login /login Logto OIDC redirect

Files (20 source files)

ui/src/
├── main.tsx, router.tsx, vite-env.d.ts
├── auth/ (auth-store, LoginPage, CallbackPage, ProtectedRoute)
├── api/ (client with Bearer auth + 401 handling, React Query hooks)
├── hooks/ (usePermissions — RBAC)
├── components/ (RequirePermission, Layout, EnvironmentTree, DeploymentStatusBadge)
├── pages/ (Dashboard, Environments, EnvironmentDetail, AppDetail, License)
└── types/ (api.ts — TS types matching backend DTOs)

Plus: SpaController.java, Dockerfile frontend stage, CI pipeline, HOWTO.md

Test plan

  • cd ui && npm run dev starts Vite dev server on :5173
  • cd ui && npx tsc --noEmit passes with 0 errors
  • mvn compile succeeds with SpaController
  • Login redirects to Logto, callback stores tokens
  • Dashboard loads with tenant data
  • Environment CRUD works (ADMIN+ only for create/delete)
  • App upload + deploy triggers async pipeline
  • RBAC: VIEWER cannot see deploy button
  • "View Dashboard" link navigates to /dashboard
  • npm run build outputs to src/main/resources/static/

Closes #31

## Summary - React 19 SPA in `ui/` directory for managing tenants, environments, apps, and deployments - Shared Logto OIDC session with cameleer3-server observability dashboard (same localStorage keys) - RBAC on all actions: OWNER/ADMIN/DEVELOPER/VIEWER role-based visibility - @cameleer/design-system v0.1.31 — AppShell, Sidebar, DataTable, Badge, LogViewer, etc. - Vite 8 + React Router 7 + Zustand + TanStack React Query - Spring Boot SPA controller for client-side routing - Multi-stage Dockerfile with frontend build - CI pipeline updated with frontend build step ## Pages | Page | Route | Description | |------|-------|-------------| | Dashboard | `/` | Tenant overview, KPI strip, quick actions | | Environments | `/environments` | List + create environments | | Environment Detail | `/environments/:id` | App list, new app upload, delete env | | App Detail | `/environments/:eid/apps/:aid` | Deploy/stop/restart, logs, agent status, routing | | License | `/license` | Tier, features, limits, expiry | | Login | `/login` | Logto OIDC redirect | ## Files (20 source files) ``` ui/src/ ├── main.tsx, router.tsx, vite-env.d.ts ├── auth/ (auth-store, LoginPage, CallbackPage, ProtectedRoute) ├── api/ (client with Bearer auth + 401 handling, React Query hooks) ├── hooks/ (usePermissions — RBAC) ├── components/ (RequirePermission, Layout, EnvironmentTree, DeploymentStatusBadge) ├── pages/ (Dashboard, Environments, EnvironmentDetail, AppDetail, License) └── types/ (api.ts — TS types matching backend DTOs) ``` Plus: `SpaController.java`, Dockerfile frontend stage, CI pipeline, HOWTO.md ## Test plan - [ ] `cd ui && npm run dev` starts Vite dev server on :5173 - [ ] `cd ui && npx tsc --noEmit` passes with 0 errors - [ ] `mvn compile` succeeds with SpaController - [ ] Login redirects to Logto, callback stores tokens - [ ] Dashboard loads with tenant data - [ ] Environment CRUD works (ADMIN+ only for create/delete) - [ ] App upload + deploy triggers async pipeline - [ ] RBAC: VIEWER cannot see deploy button - [ ] "View Dashboard" link navigates to /dashboard - [ ] `npm run build` outputs to src/main/resources/static/ Closes #31
claude added 10 commits 2026-04-04 22:07:24 +02:00
feat: scaffold React SPA with Vite, design system, and TypeScript types 146dbccc6e 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
feat: add auth store, login, callback, and protected route e33818cc74 
Adds Zustand auth store with JWT parsing (sub, roles, organization_id),
Logto OIDC login page, authorization code callback handler, and
ProtectedRoute guard. Also adds vite-env.d.ts for import.meta.env types.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
feat: add API client with auth middleware and React Query hooks d572926010 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
feat: add RBAC hooks and permission-gated components e725669aef 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
feat: add sidebar layout, environment tree, and router 91a4235223 
Wires up AppShell + Sidebar compound component, a per-environment
SidebarTree that lazy-fetches apps, React Router nested routes, and
provider-wrapped main.tsx with ThemeProvider/ToastProvider/BreadcrumbProvider.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
feat: add dashboard page with tenant overview and KPI stats 02019e9347 
Replaces placeholder DashboardPage with a full implementation: tenant
name + tier badge, KPI strip (environments, total apps, running, stopped),
environment list with per-env app counts, and a recent deployments
placeholder. Uses EnvApps helper component to fetch per-environment app
data without violating hook rules.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
feat: add environments list and environment detail pages 5eac48ad72 
Implements EnvironmentsPage with DataTable, create modal, and row navigation,
and EnvironmentDetailPage with app list, inline rename, new app form with JAR
upload, and delete confirmation — all gated by RBAC permissions.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
feat: add app detail page with deploy, logs, and status fe786790e1 
Full AppDetailPage with tabbed layout (Overview / Deployments / Logs),
current deployment status with auto-poll, action bar (deploy/stop/restart/re-upload/delete),
agent status card, routing card with edit modal, deployment history table,
and container log viewer with stream filter.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
feat: add license page with tier features and limits f6d3627abc 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
feat: add SPA controller, Traefik route, CI frontend build, and HOWTO update
Some checks failed
CI / build (push) Successful in 49s
Details
CI / docker (push) Failing after 38s
Details
CI / build (pull_request) Successful in 1m2s
Details
CI / docker (pull_request) Has been skipped
Details
4c8c8efbe5 
- SpaController catch-all forwards non-API routes to index.html
- Traefik SPA route at priority=1 catches all unmatched paths
- CI pipeline builds frontend before Maven
- Dockerfile adds multi-stage frontend build
- HOWTO.md documents frontend development workflow

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
claude added the platformphase-9 labels 2026-04-04 22:07:34 +02:00
claude added 1 commit 2026-04-04 22:10:54 +02:00
fix: correct Dockerfile frontend build output path
All checks were successful
CI / build (push) Successful in 1m10s
Details
CI / build (pull_request) Successful in 1m9s
Details
CI / docker (pull_request) Has been skipped
Details
CI / docker (push) Successful in 23s
Details
e325c4d2c0 
Vite's outDir is '../src/main/resources/static' (relative to ui/),
which resolves to /src/main/resources/static/ in the Docker build.
The COPY was looking at /ui/dist/ which doesn't exist.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
hsiegeln merged commit 050ff61e7a into main 2026-04-04 22:12:53 +02:00
Sign in to join this conversation.
Reviewers
No Reviewers
Labels
Clear labels
auth
Identity, authentication, OIDC, RBAC
 billing
Billing, metering, and Stripe integration
 day-1
Required for initial launch
 epic
Top-level epic grouping related issues
 future
Planned for future release
 infra
Infrastructure, GitOps, K8s orchestration
 licensing
License module and feature gating
 networking
Network isolation, VPN, tenant separation
 observability
Observability integration (cameleer3-server)
 ops
Platform operations and self-monitoring
 phase-1
Phase 1: Foundation + Auth
 phase-2
Phase 2: Tenants + Licensing
 phase-3
Phase 3: Runtime Orchestration + Environments
 phase-4
Phase 4: Observability Pipeline + Inbound Routing
 phase-5
Phase 5: K8s Operational Layer
 phase-6
Phase 6: Billing + Metering
 phase-7
Phase 7: Billing + Metering
 phase-8
Phase 8: Security Hardening + Self-Monitoring
 phase-9
Phase 9: Frontend (React Shell)
 platform
SaaS management platform
 runtime
Camel application runtime
 secrets
Secrets management and vault integration
 security
Security, compliance, SOC 2, audit
 task
Implementation task within a phase
No Label phase-9 platform
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
claude
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: cameleer/cameleer-saas#35
Delete Branch "feat/phase-9-frontend-react-shell"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?