openclaw-backups/nextstep-features/INTEGRATION.md

Next Step - Feature Implementation Guide

Overview

This guide explains how to integrate the 5 new features into the main Next Step codebase.

Features Implemented

1. Treatment Milestone Tracker ✅

Files:

• prisma/schema.prisma - Add TreatmentPlan and TreatmentMilestone models
• src/app/(app)/treatment/page.tsx - Main treatment page
• src/app/(app)/treatment/new/page.tsx - Create treatment plan
• src/components/treatment/TreatmentProgress.tsx - Progress widget
• src/components/treatment/TreatmentPlanForm.tsx - Form component
• src/app/api/workspaces/[id]/treatment-plan/route.ts - API routes
• src/app/api/workspaces/[id]/treatment-plan/complete-cycle/route.ts - Complete cycle

Integration Steps:

1. Add models to schema.prisma
2. Run npm run db:migrate
3. Copy page files to app directory
4. Copy component files
5. Copy API routes
6. Add navigation link to treatment page

2. Enhanced Symptom Tracking ✅

Files:

• src/app/(app)/symptoms/page.tsx - Enhanced symptoms page (overwrite)
• src/components/symptoms/SymptomTrendChart.tsx - Trend visualization
• src/components/symptoms/SymptomReportGenerator.tsx - PDF export

Integration Steps:

1. Replace existing symptoms page with enhanced version
2. Add new components
3. Update SymptomQuickLog to include medication correlation
4. Add API route for PDF generation

3. Caregiver Coordination ✅

Files:

• prisma/schema.prisma - Add CareTask and HandoffNote models
• src/app/(app)/care/page.tsx - Care coordination page
• src/app/(app)/care/new-task/page.tsx - Create task
• src/app/(app)/care/new-note/page.tsx - Create handoff note
• src/app/api/workspaces/[id]/care-tasks/route.ts - Task API
• src/app/api/workspaces/[id]/handoff-notes/route.ts - Notes API

Integration Steps:

1. Add models to schema
2. Migrate database
3. Copy page and component files
4. Copy API routes
5. Add navigation link

4. Emergency Quick Access Widget ✅

Files:

• src/components/emergency/EmergencyWidget.tsx - Floating widget
• src/app/(app)/layout.tsx - Add widget to layout

Integration Steps:

1. Copy widget component
2. Import and add to main app layout
3. Ensure it appears on all pages

5. Calendar Integration ✅

Files:

• prisma/schema.prisma - Add CalendarFeed model
• src/components/calendar/CalendarIntegration.tsx - Settings component
• src/app/api/workspaces/[id]/calendar-feed/route.ts - ICS feed API
• src/app/(app)/settings/calendar/page.tsx - Settings page

Integration Steps:

1. Add model to schema
2. Migrate database
3. Copy components and API routes
4. Add to settings navigation

---

Database Schema Additions

Add these models to prisma/schema.prisma:

// ============================================
// TREATMENT MILESTONE TRACKER
// ============================================

model TreatmentPlan {
  id          String    @id @default(cuid())
  workspaceId String    @unique
  title       String
  totalCycles Int
  currentCycle Int      @default(0)
  startDate   DateTime?
  estimatedEnd DateTime?
  status      String    @default("ACTIVE")
  cycleType   String    @default("WEEKLY")
  cycleDays   Int       @default(7)
  createdAt   DateTime  @default(now())
  updatedAt   DateTime  @updatedAt
  createdById String
  
  workspace   Workspace @relation(fields: [workspaceId], references: [id], onDelete: Cascade)
  createdBy   User      @relation(fields: [createdById], references: [id])
  milestones  TreatmentMilestone[]

  @@index([workspaceId])
}

model TreatmentMilestone {
  id          String    @id @default(cuid())
  planId      String
  cycleNumber Int
  date        DateTime
  status      String    @default("UPCOMING")
  notes       String?
  sideEffects String?
  celebratedAt DateTime?
  createdAt   DateTime  @default(now())
  
  plan        TreatmentPlan @relation(fields: [planId], references: [id], onDelete: Cascade)

  @@index([planId])
  @@index([planId, cycleNumber])
}

// ============================================
// CAREGIVER COORDINATION
// ============================================

model CareTask {
  id            String    @id @default(cuid())
  workspaceId   String
  title         String
  description   String?
  assignedToId  String?
  dueAt         DateTime?
  completedAt   DateTime?
  completedById String?
  priority      String    @default("MEDIUM")
  category      String    @default("GENERAL")
  createdAt     DateTime  @default(now())
  updatedAt     DateTime  @updatedAt
  createdById   String
  
  workspace     Workspace @relation(fields: [workspaceId], references: [id], onDelete: Cascade)
  assignedTo    User?     @relation("AssignedTasks", fields: [assignedToId], references: [id])
  completedBy   User?     @relation("CompletedTasks", fields: [completedById], references: [id])
  createdBy     User      @relation(fields: [createdById], references: [id])

  @@index([workspaceId])
  @@index([workspaceId, assignedToId])
  @@index([workspaceId, completedAt])
}

model HandoffNote {
  id          String   @id @default(cuid())
  workspaceId String
  content     String
  category    String   @default("GENERAL")
  priority    String   @default("NORMAL")
  expiresAt   DateTime
  createdById String
  createdAt   DateTime @default(now())
  acknowledgedBy String[]
  
  workspace   Workspace @relation(fields: [workspaceId], references: [id], onDelete: Cascade)
  createdBy   User      @relation(fields: [createdById], references: [id])

  @@index([workspaceId])
  @@index([workspaceId, expiresAt])
}

// ============================================
// CALENDAR INTEGRATION
// ============================================

model CalendarFeed {
  id                String    @id @default(cuid())
  workspaceId       String
  token             String    @unique
  includeMeds       Boolean   @default(false)
  includeAppointments Boolean @default(true)
  daysAhead         Int       @default(90)
  createdAt         DateTime  @default(now())
  lastAccessedAt    DateTime?
  
  workspace         Workspace @relation(fields: [workspaceId], references: [id], onDelete: Cascade)

  @@index([token])
  @@index([workspaceId])
}

Run migration:

npm run db:migrate

---

Navigation Updates

Add to Today Page Dashboard

Add this section to src/app/(app)/today/page.tsx:

{/* Treatment Progress */}
<section>
  <div className="flex items-center justify-between mb-3">
    <h2 className="text-lg font-semibold text-secondary-900">Treatment Progress</h2>
    <button
      onClick={() => router.push('/treatment')}
      className="text-sm text-primary-600 font-medium flex items-center"
    >
      View all
      <ChevronRight className="w-4 h-4" />
    </button>
  </div>
  <TreatmentProgress 
    plan={treatmentPlan}
    workspaceId={currentWorkspace.id}
    compact
  />
</section>

Add to Settings Navigation

Add to src/app/(app)/settings/page.tsx:

<SettingsSection title="Integrations">
  <SettingsItem
    icon={<Calendar className="w-5 h-5" />}
    label="Calendar Integration"
    description="Sync appointments to your calendar"
    href="/settings/calendar"
  />
</SettingsSection>

---

Dexie DB Updates

Add to src/lib/sync/db.ts:

export interface LocalTreatmentPlan {
  id: string
  workspaceId: string
  title: string
  totalCycles: number
  currentCycle: number
  startDate: string | null
  estimatedEnd: string | null
  status: string
  cycleType: string
  cycleDays: number
  version: number
  syncedAt: string
}

export interface LocalTreatmentMilestone {
  id: string
  planId: string
  cycleNumber: number
  date: string
  status: string
  notes?: string
  sideEffects?: string
  celebratedAt?: string
  syncedAt: string
}

export interface LocalCareTask {
  id: string
  workspaceId: string
  title: string
  description?: string
  assignedToId?: string
  dueAt?: string
  completedAt?: string
  completedById?: string
  priority: string
  category: string
  createdAt: string
  updatedAt: string
}

export interface LocalHandoffNote {
  id: string
  workspaceId: string
  content: string
  category: string
  priority: string
  expiresAt: string
  createdAt: string
  acknowledgedBy: string[]
}

And add tables to NextStepDB:

treatmentPlans!: Table<LocalTreatmentPlan, string>
treatmentMilestones!: Table<LocalTreatmentMilestone, string>
careTasks!: Table<LocalCareTask, string>
handoffNotes!: Table<LocalHandoffNote, string>
calendarFeeds!: Table<any, string>

Update version:

this.version(3).stores({
  // ... existing tables ...
  treatmentPlans: 'id, workspaceId',
  treatmentMilestones: 'id, planId, cycleNumber',
  careTasks: 'id, workspaceId, assignedToId, completedAt',
  handoffNotes: 'id, workspaceId, expiresAt',
  calendarFeeds: 'id, workspaceId, token',
})

---

Testing Checklist

Treatment Milestone Tracker

• Create treatment plan
• View progress widget
• Complete a cycle
• See celebration modal
• Check milestone details

Enhanced Symptom Tracking

• Log symptom with details
• View trend charts
• Filter by symptom type
• Export PDF report
• Copy text summary

Caregiver Coordination

• Create care task
• Assign to caregiver
• Mark task complete
• Add handoff note
• Acknowledge note

Emergency Widget

• See floating button
• Click to open modal
• Quick dial buttons work
• Medical info displays

Calendar Integration

• Create calendar feed
• Copy feed URL
• Subscribe in calendar app
• Verify appointments sync

---

Notes

• All features maintain offline-first capability
• Follow existing patterns for auth and workspace access
• Use existing UI components and styling
• Add appropriate audit logging
• Handle VIEWER role restrictions