AeThex-OS/5_PHASE_PLAN.md

827 lines
20 KiB
Markdown
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

# AeThex-OS: 5-Phase Execution Plan
**Start Date:** February 21, 2026
**Completion Target:** July 31, 2026 (24 weeks)
---
## 🎯 Overall Mission
Transform AeThex-OS from a **functional prototype** (95% complete) to a **production-grade platform** (100% complete) with world-class architecture, testing, and developer experience.
---
## Phase 1: STABILIZATION (6 weeks) → March 1 - April 11, 2026
### Objective
Fix critical architectural issues preventing scale. Make codebase maintainable.
### What We're Fixing
- **Monolithic os.tsx** (6,817 lines → 50+ modular files)
- **Incomplete app registry** (5 registered → 29 registered)
- **No permission system** (placeholder → full RBAC)
- **No error handling** (crashes → graceful recovery)
### Tasks & Deliverables
#### Week 1-2: Split os.tsx
```
Create structure:
client/src/os/
├── core/
│ ├── DesktopManager.tsx [NEW]
│ ├── WindowRenderer.tsx [NEW]
│ ├── Taskbar.tsx [NEW]
│ ├── StartMenu.tsx [NEW]
│ └── SystemTray.tsx [NEW]
├── boot/
│ ├── BootSequence.tsx [NEW]
│ └── LoginPrompt.tsx [NEW]
└── apps/
├── TerminalApp/ [NEW]
│ ├── index.tsx
│ ├── CommandRegistry.ts
│ └── commands/ [30 files]
├── SettingsApp/ [NEW]
└── ... (27 more apps)
```
**Deliverable:** os.tsx reduced to <500 lines (coordinator only)
#### Week 3: Complete App Registry
```typescript
// client/src/shared/app-registry.ts [COMPLETE]
export const APP_REGISTRY = {
terminal: {
id: 'terminal',
title: 'Terminal',
component: () => import('@/os/apps/TerminalApp'),
icon: Terminal,
category: 'system',
permissions: ['execute:shell'],
defaultSize: { width: 750, height: 500 },
hotkey: 'Ctrl+T',
multiInstance: true,
},
// ... ALL 29 apps registered with metadata
};
```
**Deliverable:** Type-safe app registry with all apps
#### Week 4: Permission System
```typescript
// client/src/lib/permissions.ts [NEW]
export enum Permission {
ACCESS_TERMINAL = 'access:terminal',
COMPILE_AETHEX = 'compile:aethex',
PUBLISH_APPS = 'publish:apps',
ADMIN_PANEL = 'admin:panel',
// ... 20+ permissions
}
export const ROLES = {
guest: [],
member: [Permission.ACCESS_TERMINAL, /* ... */],
architect: [/* all member */ + Permission.COMPILE_AETHEX],
admin: Object.values(Permission),
};
// Usage:
<ProtectedRoute requiredPermission={Permission.ADMIN_PANEL}>
<AdminPanel />
</ProtectedRoute>
```
**Deliverable:** Full RBAC system integrated
#### Week 5: Error Boundaries
```typescript
// client/src/components/ErrorBoundary.tsx [NEW]
export class ErrorBoundary extends Component {
componentDidCatch(error: Error) {
// Log to /api/errors
// Show BSOD-style error screen
}
}
// Wrap every app:
{windows.map(w => (
<ErrorBoundary key={w.id} component={w.title}>
{renderApp(w.component)}
</ErrorBoundary>
))}
```
**Deliverable:** Isolated error handling per app
#### Week 6: Testing Infrastructure
```bash
# Install tooling
npm install -D vitest @testing-library/react playwright
# Create structure:
e2e/
├── auth.spec.ts [NEW]
├── desktop.spec.ts [NEW]
└── smoke.spec.ts [NEW]
client/src/**/__tests__/
├── auth.test.ts [NEW]
├── windowManager.test.ts [NEW]
└── permissions.test.ts [NEW]
```
**Deliverable:** CI/CD pipeline + 10 core tests
### Success Criteria
- os.tsx < 500 lines
- All 29 apps registered
- Permission checks on all admin routes
- Zero app crashes affect others
- Tests pass on every commit
- No TODO comments in Phase 1 code
### Risk Mitigation
- **Breaking changes:** Create feature flag `USE_NEW_ARCHITECTURE`
- **Rollback plan:** Git tag before Phase 1, easy revert
- **User impact:** Zero (internal refactor only)
---
## Phase 2: STATE MANAGEMENT (4 weeks) → April 12 - May 9, 2026
### Objective
Eliminate prop drilling and localStorage chaos. Centralize state with Zustand.
### What We're Fixing
- **32+ useState calls** scattered across components
- **localStorage** used inconsistently (5 different keys)
- **Prop drilling** 5+ levels deep
- **No DevTools** for debugging state
### Tasks & Deliverables
#### Week 1: Window State (Zustand)
```typescript
// client/src/stores/useWindowStore.ts [NEW]
import create from 'zustand';
import { persist } from 'zustand/middleware';
export const useWindowStore = create(
persist(
(set) => ({
windows: [],
openApp: (appId) => set(/* ... */),
closeWindow: (id) => set(/* ... */),
minimizeWindow: (id) => set(/* ... */),
focusWindow: (id) => set(/* ... */),
}),
{ name: 'aethex-windows' }
)
);
// Replace 300+ lines of useState logic
```
**Deliverable:** Windows managed by Zustand
#### Week 2: Theme & Settings
```typescript
// client/src/stores/useThemeStore.ts [NEW]
export const useThemeStore = create(
persist(
(set) => ({
mode: 'dark',
accentColor: 'cyan',
transparency: 80,
wallpaper: 'default',
setTheme: (theme) => set(theme),
}),
{ name: 'aethex-theme' }
)
);
// Consolidate 4 localStorage keys into 1 store
```
**Deliverable:** Unified theme management
#### Week 3: Auth State
```typescript
// client/src/stores/useAuthStore.ts [NEW]
export const useAuthStore = create((set) => ({
user: null,
isAuthenticated: false,
permissions: [],
login: async (credentials) => {/* ... */},
logout: async () => {/* ... */},
hasPermission: (perm) => {/* ... */},
}));
// Replace AuthContext + React Query duplication
```
**Deliverable:** Cleaner auth state
#### Week 4: Performance Optimization
- **Code splitting:** Lazy load all apps
- **Virtual rendering:** Only render visible windows
- **Bundle analysis:** Identify big dependencies
```typescript
// Before: 2.5MB bundle, 5s load
// After: 800KB bundle, 1.5s load
```
**Deliverable:** 3x faster load time
### Success Criteria
- All state in Zustand stores
- Zero localStorage calls outside stores
- < 3 levels of prop passing
- Redux DevTools working
- Bundle < 1MB gzipped
- Lighthouse score > 90
### Risk Mitigation
- **Data loss:** Migration script for localStorage → Zustand
- **Perf regression:** Benchmark before/after
- **Breaking changes:** Feature flag rollout
---
## Phase 3: FEATURE COMPLETION (7 weeks) → May 10 - June 27, 2026
### Objective
Deliver on all marketing promises. Complete missing compiler targets.
### What We're Building
- **Verse generator** (Fortnite UEFN)
- **C# generator** (Unity)
- **Full test coverage** (80%+)
### Tasks & Deliverables
#### Week 1-3: Verse Generator
```typescript
// packages/aethex-cli/src/generators/VerseGenerator.ts [NEW]
export class VerseGenerator implements IGenerator {
generate(ast: ASTNode): string {
// Map AeThex → Verse syntax
switch (ast.type) {
case 'reality':
return `using { /Verse.org/Simulation }\n\n` +
`${ast.name} := module:\n` +
this.generateBody(ast.body);
case 'journey':
return `${ast.name}()<suspends>:void=\n` +
this.indent(this.generateBody(ast.body));
case 'notify':
return `Print("${ast.message}")`;
// ... 50+ AST node mappings
}
}
}
// Test suite:
describe('VerseGenerator', () => {
it('compiles HelloWorld', () => {
const code = `reality HelloWorld { journey start() { notify "Hello"; } }`;
const verse = compile(code, 'verse');
expect(verse).toContain('Print("Hello")');
});
// ... 20+ test cases
});
```
**Deliverable:** Full Verse compilation working
#### Week 4-6: C# Generator
```typescript
// packages/aethex-cli/src/generators/CSharpGenerator.ts [NEW]
export class CSharpGenerator implements IGenerator {
generate(ast: ASTNode): string {
// Map AeThex → C# syntax
switch (ast.type) {
case 'reality':
return `using System;\n` +
`using UnityEngine;\n\n` +
`namespace AeThex.${ast.name} {\n` +
this.indent(this.generateBody(ast.body)) +
`\n}`;
case 'journey':
return `public void ${ast.name}() {\n` +
this.indent(this.generateBody(ast.body)) +
`\n}`;
case 'notify':
return `Debug.Log("${ast.message}");`;
// ... 50+ AST node mappings
}
}
}
// Integration with Unity:
// - Generate .cs files
// - Create .asmdef assembly definition
// - Auto-import UnityEngine namespaces
```
**Deliverable:** Full C# compilation working
#### Week 7: Validation & Documentation
- **Test all 4 targets:** JS, Lua, Verse, C#
- **Create examples:** HelloWorld in each platform
- **Write docs:** Compilation guide
- **Marketing:** Update website with "4 platforms"
```bash
# Validation checklist:
aethex compile hello.aethex -t javascript ✅
aethex compile hello.aethex -t roblox ✅
aethex compile hello.aethex -t verse ✅
aethex compile hello.aethex -t unity ✅
```
**Deliverable:** All platforms shipping
### Success Criteria
- ✅ 4 working compiler targets
- ✅ 100+ test cases passing
- ✅ Example projects for each platform
- ✅ Documentation complete
- ✅ Marketing promises fulfilled
### Risk Mitigation
- **Syntax incompatibility:** Create standard library abstractions
- **Runtime differences:** Document platform limitations
- **Quality issues:** Extensive testing before release
---
## Phase 4: TESTING & QUALITY (4 weeks) → June 28 - July 25, 2026
### Objective
Production-grade reliability. 80%+ test coverage.
### What We're Building
- **Unit tests** (500+ tests)
- **Integration tests** (50+ scenarios)
- **E2E tests** (20+ user flows)
- **CI/CD pipeline** (automated quality checks)
### Tasks & Deliverables
#### Week 1: Unit Tests
```typescript
// client/src/**/__tests__/*.test.ts [NEW 500+ files]
// Example: Window management
describe('useWindowStore', () => {
it('opens app', () => {
const { openApp } = useWindowStore.getState();
openApp('terminal');
expect(useWindowStore.getState().windows).toHaveLength(1);
});
it('closes window', () => {
const { openApp, closeWindow } = useWindowStore.getState();
openApp('terminal');
const windowId = useWindowStore.getState().windows[0].id;
closeWindow(windowId);
expect(useWindowStore.getState().windows).toHaveLength(0);
});
// ... 100+ window tests
});
// Coverage targets:
// - Stores: 100%
// - Utils: 95%
// - Hooks: 90%
// - Components: 75%
```
**Deliverable:** 80%+ unit test coverage
#### Week 2: Integration Tests
```typescript
// e2e/integration/*.spec.ts [NEW 50+ files]
test('user can create and compile app', async () => {
await page.goto('/');
await page.click('[data-testid="aethex-studio"]');
await page.fill('[data-testid="code-editor"]', 'reality Hello {}');
await page.click('[data-testid="compile-btn"]');
await expect(page.locator('[data-testid="output"]')).toContainText('Compilation successful');
});
// Test critical flows:
// - Authentication
// - App creation & publishing
// - Project management
// - Marketplace transactions
// - Real-time messaging
```
**Deliverable:** All critical paths tested
#### Week 3: E2E Tests
```typescript
// e2e/*.spec.ts [NEW 20+ files]
test('new user signup → compile → publish flow', async ({ page }) => {
// 1. Signup
await page.goto('/login');
await page.click('[data-testid="signup-tab"]');
await page.fill('[data-testid="email"]', 'test@example.com');
await page.fill('[data-testid="password"]', 'SecurePass123!');
await page.click('[data-testid="signup-btn"]');
// 2. Verify logged in
await expect(page).toHaveURL('/');
await expect(page.locator('[data-testid="username"]')).toContainText('test');
// 3. Open AeThex Studio
await page.click('[data-testid="app-aethexstudio"]');
await expect(page.locator('[data-testid="studio-window"]')).toBeVisible();
// 4. Write code
await page.fill('[data-testid="code-editor"]', `
reality MyFirstApp {
journey greet() {
notify "Hello, AeThex!";
}
}
`);
// 5. Compile
await page.click('[data-testid="compile-btn"]');
await expect(page.locator('[data-testid="compile-status"]')).toContainText('Success');
// 6. Publish to store
await page.click('[data-testid="publish-btn"]');
await page.fill('[data-testid="app-name"]', 'My First App');
await page.click('[data-testid="publish-confirm"]');
// 7. Verify in store
await page.click('[data-testid="app-aethexappstore"]');
await expect(page.locator('[data-testid="my-apps"]')).toContainText('My First App');
});
// Smoke tests for:
// - Desktop OS boot
// - Mobile app launch
// - Linux ISO boot
// - Tauri desktop app
```
**Deliverable:** Full user journey coverage
#### Week 4: CI/CD Pipeline
```yaml
# .github/workflows/ci.yml [NEW]
name: CI/CD Pipeline
on: [push, pull_request]
jobs:
test:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
- uses: actions/setup-node@v3
- run: npm ci
- run: npm run test:unit
- run: npm run test:integration
- run: npx playwright test
- run: npm run lint
- run: npm run typecheck
build:
needs: test
runs-on: ubuntu-latest
steps:
- run: npm run build
- run: npm run build:mobile
- run: npm run build:desktop
deploy:
needs: build
if: github.ref == 'refs/heads/main'
runs-on: ubuntu-latest
steps:
- run: npm run deploy
```
**Deliverable:** Automated quality gates
### Success Criteria
- ✅ 80%+ overall coverage
- ✅ All critical paths tested
- ✅ E2E tests for main flows
- ✅ CI passes on every commit
- ✅ Zero flaky tests
-< 5 minute CI run time
### Risk Mitigation
- **Test maintenance:** Page Object pattern for E2E
- **Flaky tests:** Retry logic + better waits
- **Slow tests:** Parallelize + selective runs
---
## Phase 5: POLISH & PRODUCTION (4 weeks) → July 26 - August 22, 2026
### Objective
Final polish. Marketing prep. Production deployment.
### What We're Delivering
- **Performance optimizations**
- **Mobile offline support**
- **API documentation**
- **Marketing materials**
### Tasks & Deliverables
#### Week 1: Performance
- **Bundle optimization:** Tree-shaking, compression
- **Image optimization:** WebP, lazy loading
- **Caching strategy:** Service worker
- **Database indexing:** Optimize queries
```typescript
// Before:
Bundle: 2.5MB
Load: 5s
Lighthouse: 65
// After:
Bundle: 800KB
Load: 1.5s
Lighthouse: 95
```
**Deliverable:** 3x performance improvement
#### Week 2: Mobile Polish
```typescript
// Offline support
// client/src/service-worker.ts [NEW]
self.addEventListener('install', (event) => {
event.waitUntil(
caches.open('aethex-v1').then((cache) => {
return cache.addAll([
'/',
'/index.html',
'/assets/main.js',
'/assets/main.css',
]);
})
);
});
// Background sync
self.addEventListener('sync', async (event) => {
if (event.tag === 'sync-projects') {
await syncProjectsToServer();
}
});
// Push notifications
Notification.requestPermission().then((permission) => {
if (permission === 'granted') {
self.addEventListener('push', (event) => {
const data = event.data.json();
self.registration.showNotification(data.title, {
body: data.body,
icon: '/icon.png'
});
});
}
});
```
**Deliverable:** Full offline mode
#### Week 3: Documentation
```markdown
# Generate docs
docs/
├── api/ [AUTO-GENERATED from OpenAPI]
│ ├── authentication.md
│ ├── projects.md
│ └── ...
├── guides/
│ ├── quickstart.md
│ ├── compilation.md
│ └── deployment.md
└── reference/
├── cli.md
├── aethex-syntax.md
└── ...
# Tools:
- OpenAPI → Markdown (redocly)
- TypeDoc for TS code
- Storybook for components
```
**Deliverable:** Complete documentation site
#### Week 4: Production Deploy
```bash
# Deployment checklist:
✅ Database migrations applied
✅ Environment variables set
✅ SSL certificates installed
✅ CDN configured
✅ Monitoring enabled (Sentry)
✅ Analytics integrated
✅ Backup strategy verified
✅ Load testing passed (10K concurrent)
✅ Security audit passed
✅ GDPR compliance checked
# Go-live:
- Deploy to staging
- Smoke test
- Blue-green deploy to production
- Monitor for 24 hours
- Announce launch
```
**Deliverable:** Production-ready system
### Success Criteria
- Lighthouse score 95+
- Works offline
- 100% API documented
- Zero critical bugs
- 99.9% uptime SLA
- < 100ms p95 response time
### Risk Mitigation
- **Downtime:** Blue-green deployment
- **Data loss:** Automated backups every 6 hours
- **Performance regression:** Load testing before deploy
- **Security:** Penetration testing
---
## 📊 Final Deliverables (End of Phase 5)
### Code Quality
- 80%+ test coverage
- Zero TypeScript errors
- 100% ESLint passing
- Lighthouse score 95+
- 0 high-severity security issues
### Features
- 29 desktop apps fully functional
- 4 compiler targets (JS, Lua, Verse, C#)
- Mobile offline mode
- Desktop auto-updater
- Linux bootable ISO
### Architecture
- Modular codebase (<1000 lines per file)
- Zustand state management
- Full RBAC permission system
- Error boundaries everywhere
- CI/CD pipeline
### Documentation
- API reference (auto-generated)
- User guides
- Developer docs
- Video tutorials
### Production
- Deployed to production
- 99.9% uptime
- Monitoring & alerts
- Backup strategy
- Security hardened
---
## 📅 Timeline Summary
| Phase | Duration | Start | End | Key Milestone |
|-------|----------|-------|-----|---------------|
| **Phase 1: Stabilization** | 6 weeks | Feb 21 | Apr 11 | Modular architecture |
| **Phase 2: State Management** | 4 weeks | Apr 12 | May 9 | Zustand + Performance |
| **Phase 3: Feature Completion** | 7 weeks | May 10 | Jun 27 | 4 compiler targets |
| **Phase 4: Testing & Quality** | 4 weeks | Jun 28 | Jul 25 | 80% test coverage |
| **Phase 5: Polish & Production** | 4 weeks | Jul 26 | Aug 22 | Production launch |
**Total Duration:** 25 weeks (6 months)
**Target Launch Date:** **August 22, 2026**
---
## 💰 Resource Requirements
### Team
- **2 Senior Full-Stack Engineers** (all phases)
- **1 DevOps Engineer** (Phase 4-5)
- **1 QA Engineer** (Phase 4-5)
### Tools & Services
- GitHub Actions (CI/CD)
- Sentry (error tracking)
- Vercel/Railway (hosting)
- Supabase (database)
- Playwright Cloud (E2E testing)
### Budget Estimate
- **Developer time:** 4,000 hours @ $100/hr = $400,000
- **Infrastructure:** $500/month × 6 months = $3,000
- **Tools & licenses:** $5,000
- **Total:** ~$408,000
---
## 🚨 Critical Success Factors
### Must Have
1. **Team commitment** - 2 devs dedicated full-time
2. **No scope creep** - Stick to the plan
3. **Weekly reviews** - Track progress, adjust if needed
4. **Testing discipline** - Write tests as you code
5. **User feedback** - Beta test after Phase 3
### Nice to Have
- Design system refresh
- Accessibility audit
- Internationalization (i18n)
- Social features
---
## 🎯 Definition of Done
### Phase 1 Complete When:
- [ ] os.tsx < 500 lines
- [ ] All 29 apps in registry
- [ ] RBAC implemented
- [ ] Error boundaries added
- [ ] 10 tests passing
### Phase 2 Complete When:
- [ ] All state in Zustand
- [ ] Bundle < 1MB
- [ ] Lighthouse > 90
- [ ] Zero localStorage calls outside stores
### Phase 3 Complete When:
- [ ] Verse generator works
- [ ] C# generator works
- [ ] 100+ compiler tests pass
- [ ] All 4 platforms documented
### Phase 4 Complete When:
- [ ] 80%+ test coverage
- [ ] CI/CD pipeline green
- [ ] All critical paths tested
- [ ] Zero flaky tests
### Phase 5 Complete When:
- [ ] Deployed to production
- [ ] Monitoring active
- [ ] Documentation live
- [ ] Launch announcement ready
---
## 📞 Approval & Sign-Off
**Prepared by:** AI Development Team
**Date:** February 21, 2026
**Approvals Required:**
- [ ] **Tech Lead** - Technical feasibility
- [ ] **Product Owner** - Business alignment
- [ ] **Engineering Manager** - Resource allocation
- [ ] **CTO** - Strategic approval
**Next Steps After Approval:**
1. Create GitHub project board
2. Break Phase 1 into tickets
3. Assign Week 1 tasks
4. Schedule daily standups
5. Begin implementation
---
**Ready to start Phase 1?** 🚀
Just say the word and I'll begin breaking os.tsx into modules.