Skip to content

PEER_LEARNING_ANDROID.md

Latest commit

 

History

History
289 lines (235 loc) · 9.07 KB

PEER_LEARNING_ANDROID.md

File metadata and controls

289 lines (235 loc) · 9.07 KB
Raw

Peer Learning Feature - Android Implementation

Overview

The peer learning feature enables students from the same school and class to collaborate in study rooms with real-time chat and collaborative whiteboard.

What Was Implemented

✅ Core Components

1. EncryptionManager (Simple AES)

  • Location: app/data/local/EncryptionManager.kt
  • Features:
    • AES-256-CBC encryption for messages
    • Session-based encryption keys
    • Simple IV:ciphertext format
  • Note: Uses simple AES instead of Signal Protocol for MVP

2. SupabaseRealtimeManager

  • Location: app/data/realtime/SupabaseRealtimeManager.kt
  • Features:
    • Real-time message broadcasting
    • Presence tracking (who's online)
    • Whiteboard operation sync
    • Session management
  • Configuration:
    • Supabase URL: https://pbgqfxexmgytuhvnvuxl.supabase.co
    • ⚠️ ACTION REQUIRED: Replace placeholder anon key with actual key from Supabase Dashboard

3. PeerRepository

  • Location: app/data/repository/PeerRepository.kt
  • Features:
    • Session CRUD operations
    • Participant management
    • Availability management
    • Block/Report functionality

📱 UI Screens

1. PeerLobbyScreen

  • Location: app/ui/screens/peer/PeerLobbyScreen.kt
  • Features:
    • Browse available study rooms
    • Search by topic
    • Filter by subject (Mathematics, Physics, Chemistry, Biology)
    • Create new room with dialog
    • Join existing rooms
    • Real-time participant count
    • Room status indicators (WAITING, ACTIVE, CLOSED)

2. StudyRoomScreen

  • Location: app/ui/screens/peer/StudyRoomScreen.kt
  • Features:
    • Real-time encrypted chat
    • Participant list with roles (HOST/PARTICIPANT)
    • Message bubbles (sent/received)
    • Whiteboard toggle
    • Leave session confirmation
    • Participant bottom sheet

3. WhiteboardScreen

  • Location: app/ui/screens/peer/WhiteboardScreen.kt
  • Features:
    • Canvas-based drawing
    • Tools: Draw, Erase, Text (placeholder)
    • Color palette (Black, Red, Blue, Green, Yellow, Magenta)
    • Stroke width control
    • Clear all functionality
    • Real-time collaborative sync (ready for integration)

🔧 Navigation

Updated NavGraph.kt with:

  • Routes.PeerLobby → PeerLobbyScreen
  • Routes.StudyRoom → StudyRoomScreen (with sessionId parameter)

Setup Instructions

1. Add Supabase Credentials to local.properties

Important: Credentials are stored in app/local.properties which is gitignored for security.

  1. Go to Supabase Dashboard
  2. Select your project: pbgqfxexmgytuhvnvuxl
  3. Navigate to: Settings → API
  4. Copy the anon (public) key
  5. Edit app/local.properties and replace: 
    supabase.anon.key=YOUR_ACTUAL_ANON_KEY_HERE

The URL is already set to: https://pbgqfxexmgytuhvnvuxl.supabase.co

How it works:

  • Credentials are loaded from local.properties at build time
  • Injected into BuildConfig.SUPABASE_URL and BuildConfig.SUPABASE_ANON_KEY
  • SupabaseRealtimeManager reads from BuildConfig
  • ✅ Never committed to git
  • ✅ Safe for team development

2. Sync Gradle

The following dependencies were added to app/build.gradle.kts:

// Supabase Realtime
implementation("io.github.jan-tennert.supabase:realtime-kt:2.0.4")
implementation("io.ktor:ktor-client-okhttp:2.3.7")
implementation("org.jetbrains.kotlinx:kotlinx-serialization-json:1.6.0")

Run: File → Sync Project with Gradle Files

3. Test the Feature

  1. From Dashboard, tap the "Peer Learning" button
  2. Create a new study room or join an existing one
  3. Send messages to test chat
  4. Toggle whiteboard to draw collaboratively

Architecture

┌─────────────────┐
│  PeerLobbyScreen│
│   (List Rooms)  │
└────────┬────────┘
         │
         ├─ PeerLobbyViewModel
         ├─ PeerRepository
         └─ PrepVerseApi
         
┌─────────────────┐
│ StudyRoomScreen │
│  (Chat + Board) │
└────────┬────────┘
         │
         ├─ StudyRoomViewModel
         ├─ PeerRepository
         ├─ EncryptionManager (AES)
         ├─ SupabaseRealtimeManager
         └─ PrepVerseApi

┌─────────────────┐
│WhiteboardScreen │
│  (Canvas Draw)  │
└────────┬────────┘
         │
         └─ Canvas API

Data Flow

Creating a Session:

  1. User fills create dialog
  2. PeerLobbyViewModel.createSession() calls PeerRepository
  3. API creates session in Supabase
  4. User navigates to StudyRoomScreen

Joining & Messaging:

  1. User taps "Join" on session card
  2. PeerRepository.joinSession() adds user as participant
  3. StudyRoomViewModel initializes:
    • Generates session encryption key
    • Joins Supabase Realtime channel
    • Loads existing messages
  4. When user sends message:
    • Encrypt with AES for each participant
    • Send to API (POST /api/v1/peer/messages)
    • Broadcast via Supabase Realtime
  5. Other users receive via realtimeManager.messageFlow
  6. Decrypt and display in chat

Whiteboard:

  1. User toggles whiteboard
  2. Drawing operations captured on Canvas
  3. Operations sent to StudyRoomViewModel
  4. TODO: Sync to API and broadcast via Realtime

Security Features

✅ Implemented:

  • School & Class Matching: Only students from same school/class can see each other
  • AES Encryption: Messages encrypted with session key
  • Block/Report: Users can block or report inappropriate behavior

⚠️ Not Yet Implemented:

  • Voice calling (WebRTC)
  • End-to-end encryption with Signal Protocol
  • Whiteboard operation persistence to server

Known Limitations

  1. Supabase Anon Key: Using placeholder - needs actual key
  2. User Context: Currently uses placeholder user IDs - needs integration with AuthRepository
  3. Whiteboard Sync: Drawing works locally, but server sync needs implementation
  4. Voice Chat: Skipped for MVP as requested
  5. Encryption: Using simple AES instead of Signal Protocol

Next Steps

Immediate (Required):

  1. ✅ Get and add Supabase anon key
  2. ✅ Sync Gradle dependencies
  3. ✅ Test basic session creation/joining
  4. ✅ Integrate current user from AuthRepository

Future Enhancements:

  1. Add WebRTC for voice calling
  2. Persist whiteboard state to server
  3. Add typing indicators
  4. Add message read receipts
  5. Add session history
  6. Upgrade to Signal Protocol encryption
  7. Add file sharing
  8. Add screen sharing

Backend Integration

The backend already has all necessary endpoints implemented:

  • ✅ POST /api/v1/peer/sessions - Create session
  • ✅ GET /api/v1/peer/sessions - List sessions
  • ✅ POST /api/v1/peer/sessions/{id}/join - Join session
  • ✅ POST /api/v1/peer/sessions/{id}/leave - Leave session
  • ✅ GET /api/v1/peer/sessions/{id}/participants - Get participants
  • ✅ POST /api/v1/peer/messages - Send message
  • ✅ GET /api/v1/peer/messages/{sessionId} - Get messages
  • ✅ POST /api/v1/peer/whiteboard/sync - Sync whiteboard
  • ✅ GET /api/v1/peer/whiteboard/{sessionId} - Get whiteboard state

Troubleshooting

Build Errors:

  • Run: Build → Clean Project then Build → Rebuild Project
  • Ensure Kotlin version is 1.9.20+

Supabase Connection:

  • Verify anon key is correct
  • Check internet permission in AndroidManifest.xml
  • Test with: adb logcat | grep Supabase

Messages Not Appearing:

  • Check encryption key is stored for session
  • Verify Supabase Realtime channel is joined
  • Look for decryption errors in logs

Testing Checklist

  • Open peer lobby from dashboard
  • Create a new study room
  • Join the created room
  • Send a message
  • Verify message appears in chat
  • Open whiteboard view
  • Draw on canvas
  • Toggle back to chat
  • Leave the session
  • Join an existing room
  • Send messages between multiple users

Files Created/Modified

Created:

  • app/data/realtime/SupabaseRealtimeManager.kt
  • app/ui/screens/peer/PeerLobbyScreen.kt
  • app/ui/screens/peer/PeerLobbyViewModel.kt
  • app/ui/screens/peer/StudyRoomScreen.kt
  • app/ui/screens/peer/StudyRoomViewModel.kt
  • app/ui/screens/peer/WhiteboardScreen.kt

Modified:

  • app/data/local/EncryptionManager.kt - Replaced Signal Protocol with AES
  • app/ui/navigation/NavGraph.kt - Added peer routes
  • app/build.gradle.kts - Added Supabase dependencies

Performance Considerations

  • Message Loading: Currently loads last 100 messages
  • Realtime Connection: One connection per session
  • Canvas Rendering: Redraws all operations on each frame
  • Memory: Session keys stored in-memory (cleared on leave)

Support

For issues or questions:

  1. Check backend logs: tail -f backend/logs/app.log
  2. Check Android logs: adb logcat | grep PrepVerse
  3. Verify Supabase dashboard for session/message data
  4. Test API endpoints with Postman/curl

Status: ✅ Core implementation complete. Ready for testing after Supabase anon key is added.