stemedb/applications/DASHBOARD_SEPARATION_SUMMARY.md

Dashboard Separation Summary

Date: 2026-02-08 Status: ✅ Complete

What Was Done

Successfully separated Aphoria Dashboard from StemeDB Dashboard into two independent applications.

Changes Made

1. Created Aphoria Dashboard (Port 18189)

New Directory: applications/aphoria-dashboard/

Structure:

aphoria-dashboard/
├── package.json (port 18189, name "aphoria-dashboard")
├── .env.local (proxy mode)
├── .gitignore
├── README.md
├── next.config.ts
├── tsconfig.json
├── postcss.config.mjs
├── components.json
└── src/
    ├── app/
    │   ├── layout.tsx (Aphoria branding)
    │   ├── page.tsx (redirect to /scans)
    │   ├── globals.css
    │   ├── scans/page.tsx
    │   ├── claims/page.tsx
    │   └── corpus/page.tsx
    ├── components/
    │   ├── scans/ (12 files)
    │   ├── claims/ (7 files)
    │   ├── corpus/ (8 files)
    │   ├── layout/
    │   │   ├── sidebar.tsx (Aphoria-specific, 3 routes)
    │   │   ├── header.tsx
    │   │   └── theme-toggle.tsx
    │   ├── shared/ (3 files)
    │   └── ui/ (8 files)
    └── lib/
        ├── api/ (client, types, index)
        ├── auth/ (api-key)
        ├── utils.ts
        ├── format.ts
        ├── types.ts
        └── constants.ts

Routes:

• / → redirects to /scans
• /scans → ScansPanel
• /claims → ClaimsPanel
• /corpus → CorpusPanel

Branding:

• Icon: Shield (Lucide)
• Title: "Aphoria Dashboard"
• Footer: "Aphoria Dashboard v0.1.0"

2. Updated StemeDB Dashboard (Port 18188)

Removed:

• src/app/scans/, src/app/claims/, src/app/corpus/ (3 route directories)
• src/components/scans/, src/components/claims/, src/components/corpus/ (27 component files)

Updated:

• src/components/layout/sidebar.tsx:
  • Removed imports: Scan, Library, FileCheck
  • Removed 3 navigation items (Corpus, Scans, Claims)
  • Now has 6 routes (Skeptic Query, Layered View, Sources, Quarantine, Circuit Breakers, Audit Trail)

Added:

• README.md - Documentation for StemeDB Dashboard

Remaining Routes:

• /skeptic → Skeptic Query
• /layered → Layered View
• /sources → Sources
• /quarantine → Quarantine
• /circuit → Circuit Breakers
• /audit → Audit Trail

3. Documentation

Created:

• applications/aphoria-dashboard/README.md - Aphoria Dashboard docs
• applications/stemedb-dashboard/README.md - StemeDB Dashboard docs
• applications/DASHBOARD_SYNC.md - Shared code sync guide
• applications/DASHBOARD_SEPARATION_SUMMARY.md - This file

Updated:

• CLAUDE.md - Port scheme table (added ports 18188 and 18189)

Port Scheme

Port	Service	Dashboard
18180	Backend API	Both dashboards proxy to this
18188	StemeDB Dashboard	Database admin
18189	Aphoria Dashboard	Code quality

Shared Code

Both dashboards share infrastructure:

• UI Components: src/components/ui/ (8 files)
• Shared Components: src/components/shared/ (3 files)
• Layout Components: header.tsx, theme-toggle.tsx (NOT sidebar.tsx)
• Library Code: src/lib/ (API client, types, utils)
• Configuration: globals.css, components.json

See applications/DASHBOARD_SYNC.md for sync procedures.

Dependencies

Both dashboards have identical dependencies:

• Next.js 16.1.6
• React 19.2.3
• TailwindCSS 4
• shadcn/ui components
• lucide-react icons

Testing Status

✅ Completed

• Directory structure created
• Files copied and organized
• Routes created for Aphoria Dashboard
• Routes removed from StemeDB Dashboard
• Sidebars updated with correct navigation
• Documentation created
• Port scheme documented
• Dependencies installed for Aphoria Dashboard

⚠️ Pending (requires Node.js >=20.9.0)

• Build verification (npm run build)
• Runtime testing with all three services
• E2E verification of API proxying
• UI/UX verification

Note: Current Node.js version is 20.8.1, but Next.js 16 requires >=20.9.0. The dev servers should work, but production builds may fail until Node is updated.

Next Steps

To complete testing:

1. Update Node.js (if needed):

   nvm install 20.9.0
   nvm use 20.9.0
   

2. Build Both Dashboards:

   cd applications/stemedb-dashboard && npm run build
   cd ../aphoria-dashboard && npm run build
   

3. Choose Access Method:

   Option A: Direct Ports (Recommended for dev)

   # Terminal 1: Backend API
   cargo run --bin stemedb-api  # port 18180
   
   # Terminal 2: StemeDB Dashboard
   cd applications/stemedb-dashboard && npm run dev  # port 18188
   
   # Terminal 3: Aphoria Dashboard
   cd applications/aphoria-dashboard && npm run dev  # port 18189
   
   # Access:
   # http://localhost:18188 (StemeDB)
   # http://localhost:18189 (Aphoria)
   

   Option B: Nginx Subdomain Routing (Recommended for shared)

   # Setup nginx once
   ./setup-nginx-subdomain.sh
   
   # Then start services (same as above)
   
   # Access:
   # http://stemedb.local (StemeDB)
   # http://aphoria.local (Aphoria)
   

   Option C: Interactive Setup Helper

   ./setup-dashboards.sh
   

   See applications/NGINX_SETUP_GUIDE.md for full details.

4. Verify Functionality:

   • StemeDB Dashboard: Test all 6 routes
   • Aphoria Dashboard: Test all 3 routes
   • Verify removed routes return 404 in StemeDB Dashboard
   • Verify API calls work in both dashboards

Success Criteria

• Aphoria Dashboard has its own directory
• StemeDB Dashboard has Aphoria features removed
• Both dashboards have independent navigation
• Port scheme is documented
• Sync procedures are documented
• Both dashboards build successfully (pending Node.js update)
• Both dashboards run concurrently (pending testing)
• API proxying works in both (pending testing)

Rollback Plan

If issues arise:

# This work was done in a single session
# To rollback, use git:
git checkout HEAD -- applications/stemedb-dashboard/
git clean -fd applications/aphoria-dashboard/

Notes

• Architecture Decision: Used "Copy with Documentation" approach (Option D from plan)
• Code Drift: Acceptable with documented sync procedures
• Future Enhancement: Consider monorepo packages if syncing becomes frequent (>1x/week)
• API Client: Kept full client in both dashboards (has both StemeDB + Aphoria methods)
• Build System: No workspace needed, dashboards are fully independent