Add 35 tests covering the complete WiFi Setup wizard flow:
- Device scanning and discovery
- BLE device connection
- WiFi network scanning and selection
- Password entry with visibility toggle
- WiFi provisioning via ESP32
- Success state and navigation
All tests pass. Existing implementation was verified to be
fully functional; this commit adds missing test coverage.
- Set up Tailwind CSS configuration for styling
- Create Button component with variants (primary, secondary, outline, ghost, danger)
- Create Input component with label, error, and helper text support
- Create Card component with composable subcomponents (Header, Title, Description, Content, Footer)
- Create LoadingSpinner component with size and fullscreen options
- Create ErrorMessage component with retry and dismiss actions
- Add comprehensive test suite using Jest and React Testing Library
- Configure ESLint and Jest for quality assurance
All components follow consistent design patterns from mobile app
and include proper TypeScript types and accessibility features.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Implement Next.js middleware for route protection
- Create Zustand auth store for web (similar to mobile)
- Add comprehensive tests for middleware and auth store
- Protect authenticated routes (/dashboard, /profile)
- Redirect unauthenticated users to /login
- Redirect authenticated users from auth routes to /dashboard
- Handle session expiration with 401 callback
- Set access token cookie for middleware
- All tests passing (105 tests total)
- Add ReconnectConfig and ReconnectState types for configurable reconnect behavior
- Implement auto-reconnect in BLEManager with exponential backoff (default: 3 attempts, 1.5x multiplier)
- Add connection monitoring via device.onDisconnected() for unexpected disconnections
- Update BLEContext with reconnectingDevices state and reconnect actions
- Create ConnectionStatusIndicator component for visual connection feedback
- Enhance device settings screen with reconnect UI and manual reconnect capability
- Add comprehensive tests for reconnect logic and UI component
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Implement comprehensive redirect logic in the Root Layout that:
- Redirects unauthenticated users to login screen
- Checks if authenticated users need to complete onboarding (firstName)
- Prevents redirect loops by only redirecting on initial mount
- Protects tabs from unauthorized access (redirects to login on logout)
- Lets auth screens handle their own navigation via NavigationController
Add comprehensive test suite with 8 tests covering:
- Initial redirect scenarios (authenticated/unauthenticated)
- Onboarding flow (missing firstName)
- Logout protection
- Loading states
Update jest.config.js to support expo-status-bar, expo-splash-screen,
react-native-reanimated, and react-native-worklets transforms.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Replace simple icon-based signal display with WiFiSignalIndicator bars
- Add human-readable signal strength labels (Excellent, Good, Fair, Weak)
- Display dBm values in parentheses for technical reference
- Add comprehensive tests for signal strength UI integration
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Add SetupProgressIndicator component that shows users their current
position in the 4-step onboarding journey: Name → Beneficiary →
Equipment → Connect. The indicator displays:
- Visual progress bar with percentage fill
- Step circles with icons showing completed/current/pending status
- Current step label with "Step X of 4" text
Integrate the indicator into all four auth screens:
- enter-name.tsx (Step 1)
- add-loved-one.tsx (Step 2)
- purchase.tsx (Step 3)
- activate.tsx (Step 4)
Also add @expo/vector-icons mock to jest.setup.js for testing.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Implemented comprehensive bulk operations for BLE sensor management to improve
efficiency when working with multiple sensors simultaneously.
Features Added:
- bulkDisconnect: Disconnect multiple sensors at once
- bulkReboot: Reboot multiple sensors sequentially
- bulkSetWiFi: Configure WiFi for multiple sensors with progress tracking
Implementation Details:
- Added BulkOperationResult and BulkWiFiResult types to track operation outcomes
- Implemented bulk operations in both RealBLEManager and MockBLEManager
- Exposed bulk operations through BLEContext for easy UI integration
- Sequential processing ensures reliable operation completion
- Progress callbacks for real-time UI updates during bulk operations
Testing:
- Added comprehensive test suite with 14 test cases
- Tests cover success scenarios, error handling, and edge cases
- All tests passing with appropriate timeout configurations
- Verified both individual and sequential bulk operations
Technical Notes:
- Bulk operations maintain device connection state consistency
- Error handling allows graceful continuation despite individual failures
- MockBLEManager includes realistic delays for testing
- Integration with existing BLE service architecture preserved
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Implemented pull-to-refresh functionality across all main screens:
- Home screen: Added RefreshControl to beneficiaries FlatList
- Separated isLoading (initial load) from isRefreshing (pull-to-refresh)
- Only show full screen spinner on initial load, not during refresh
- Pass isRefresh flag to loadBeneficiaries to control loading state
- Chat screen: Added RefreshControl to messages FlatList
- Reset conversation to initial welcome message on refresh
- Stop TTS and voice input during refresh to prevent conflicts
- Clear state cleanly before resetting messages
- Profile screen: Added RefreshControl to ScrollView
- Reload avatar from cloud/cache on refresh
- Graceful error handling if avatar load fails
- Dashboard screen: Enhanced visual feedback on refresh
- Show ActivityIndicator in refresh button when refreshing
- Disable refresh button during refresh to prevent rapid-fire
- Reset isRefreshing state on WebView load completion
Added comprehensive tests (23 test cases) covering:
- RefreshControl integration on all screens
- Loading state differentiation (isLoading vs isRefreshing)
- Error handling during refresh
- User experience (platform colors, visual feedback)
- Integration verification for all implementations
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Implemented comprehensive analytics system for tracking sensor setup process
including scan events, setup steps, and completion metrics.
Features:
- Analytics service with event tracking for sensor setup
- Metrics calculation (success rate, duration, common errors)
- Integration in add-sensor and setup-wifi screens
- Tracks: scan start/complete, setup start/complete, individual steps,
retries, skips, and cancellations
- Comprehensive test coverage
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Improved error handling in the attachDeviceToBeneficiary method with:
- Structured ApiResponse return type with detailed error codes
- User-friendly error messages for different failure scenarios:
- DEPLOYMENT_NOT_FOUND: Beneficiary has no deployment configured
- UNAUTHORIZED: Missing or expired authentication credentials
- NOT_FOUND: Sensor or deployment not found (404)
- SERVER_ERROR: Legacy API server error (500)
- SERVICE_UNAVAILABLE: Service temporarily unavailable (503+)
- LEGACY_API_ERROR: Error from Legacy API response body
- NETWORK_ERROR: Network connectivity issues
- EXCEPTION: Unexpected errors
- Enhanced error messages in setup-wifi.tsx to display API error details
- Fixed navigator.onLine check to work in test environment
- Added comprehensive test suite with 11 test cases covering all error scenarios
All tests passing (11/11).
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Fix saveWiFiPassword to use encrypted passwords map instead of decrypted
- Fix getWiFiPassword to decrypt from encrypted storage
- Fix test expectations for migration and encryption functions
- Remove unused error variables to fix linting warnings
- All 27 tests now passing with proper encryption/decryption flow
The WiFi credentials cache feature was already implemented but had bugs
where encrypted and decrypted password maps were being mixed. This commit
ensures proper encryption is maintained throughout the storage lifecycle.
- Create permissions helper module with comprehensive error handling
- Update BLEManager to use new permission system
- Add permission state tracking in BLEContext
- Improve add-sensor screen with permission error banner
- Add "Open Settings" button for permission issues
- Handle Android 12+ and older permission models
- Provide user-friendly error messages for all states
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Add ONLINE_THRESHOLD_MS constant for magic number (30 min threshold)
- Add AbortController to cancel requests when screen loses focus
- Register BLE cleanup callback for logout in BLEContext
- Add 'Unknown User' fallback for displayName in all locations
- Add null safety guard in handleBeneficiaryPress
- Add bustImageCache() at API layer to ensure avatars always have cache-busting timestamps
- Remove redundant bustImageCache() calls from UI components (already handled at API level)
- Add key prop to Image components using avatar URL to force re-render on avatar change
- Add expo-image-manipulator mock to jest.setup.js
This ensures that when users upload new avatars, React Native's Image component
displays the updated image immediately instead of showing cached old versions.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Removed all console.log, console.error, console.warn, console.info, and console.debug statements from the main source code to clean up production output.
Changes:
- Removed 400+ console statements from TypeScript/TSX files
- Cleaned BLE services (BLEManager.ts, MockBLEManager.ts)
- Cleaned API services, contexts, hooks, and components
- Cleaned WiFi setup and sensor management screens
- Preserved console statements in test files (*.test.ts, __tests__/)
- TypeScript compilation verified successfully
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Implemented request tracking and cancellation to prevent stale API
responses from overwriting current beneficiary data.
Changes:
- Added loadingBeneficiaryIdRef to track which beneficiary is being loaded
- Added AbortController to cancel in-flight requests
- Validate beneficiary ID before applying state updates
- Cleanup on component unmount to prevent memory leaks
This fixes the issue where rapidly switching between beneficiaries
would show wrong data if slower requests completed after faster ones.
🤖 Generated with Claude Code (https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Implemented proper BLE cleanup mechanism on user logout:
**Root Cause:**
- BLE cleanup callback was being set but reference could become stale
- No explicit cleanup call in profile logout handler
- Callback stability issues due to re-renders
**Changes:**
1. app/_layout.tsx:
- Use useRef pattern to maintain stable callback reference
- Set callback once with ref that always points to current cleanupBLE
- Cleanup callback on unmount to prevent memory leaks
2. app/(tabs)/profile/index.tsx:
- Add explicit cleanupBLE() call in logout handler
- Import useBLE hook to access cleanup function
- Ensure cleanup happens before logout completes
3. services/api.ts:
- Update setOnLogoutBLECleanupCallback signature to accept null
- Allows proper cleanup of callback on unmount
4. jest.setup.js:
- Add AsyncStorage mock to prevent test failures
5. Tests:
- Add comprehensive BLE cleanup tests
- Test callback pattern and stability
- Test logout flow with BLE cleanup
- Test error handling during cleanup
**Result:**
BLE connections now properly disconnect when user logs out,
preventing stale connections and potential resource leaks.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Implement proper cleanup of BLE scanning operations when users navigate
away from the add-sensor screen to prevent resource waste and potential
issues.
Changes:
- Add useFocusEffect hook to stop BLE scan when screen loses focus
- Remove unused imports (Device, WPDevice, connectDevice, etc.)
- Add comprehensive tests for BLE cleanup behavior
- Add tests for screen unmount/blur scenarios
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Implemented a reusable useDebounce hook to prevent rapid-fire clicks
on refresh buttons throughout the application.
Changes:
- Created hooks/useDebounce.ts with configurable delay and leading/trailing edge options
- Added comprehensive unit tests in hooks/__tests__/useDebounce.test.ts
- Applied debouncing to dashboard WebView refresh button (app/(tabs)/dashboard.tsx)
- Applied debouncing to beneficiary detail pull-to-refresh (app/(tabs)/beneficiaries/[id]/index.tsx)
- Applied debouncing to equipment screen refresh (app/(tabs)/beneficiaries/[id]/equipment.tsx)
- Applied debouncing to all error retry buttons (components/ui/ErrorMessage.tsx)
- Fixed jest.setup.js to properly mock React Native modules
- Added implementation documentation in docs/DEBOUNCE_IMPLEMENTATION.md
Technical details:
- Default 1-second debounce delay
- Leading edge execution (immediate first call, then debounce)
- Type-safe with TypeScript generics
- Automatic cleanup on component unmount
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Added error state with retry functionality to equipment.tsx
- Display error message when sensor loading fails
- Provide "Try Again" button to retry loading
- Clear error on successful retry
- Added error state with retry functionality to subscription.tsx
- Display error message when beneficiary loading fails
- Provide "Try Again" button with icon to retry loading
- Show offline icon and proper error layout
- Added comprehensive tests for error handling
- ErrorMessage component tests for inline errors
- FullScreenError component tests
- Equipment screen error state tests
- Subscription screen error state tests
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Implemented cache-busting mechanism to prevent stale avatar images
after upload. React Native Image component caches images by URI,
causing old avatars to persist even after successful upload.
Changes:
- Added bustImageCache() utility function in utils/imageUtils.ts
- Appends timestamp query parameter (?t=timestamp) to avatar URLs
- Skips cache-busting for local file://, data: URIs and placeholders
- Applied bustImageCache() to all avatar Image components:
- Beneficiary detail screen (header, edit modal, lightbox)
- Beneficiary list cards on dashboard
- Ensured loadBeneficiary() is called after avatar upload completes
- Added comprehensive unit tests for cache-busting logic
Backend already generates unique URLs with timestamps when uploading
to MinIO, but this ensures frontend always requests fresh images.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Create wifiPasswordStore service for encrypted password storage
- Replace AsyncStorage with SecureStore for WiFi credentials
- Add automatic migration from AsyncStorage to SecureStore
- Integrate WiFi password cleanup into logout process
- Add comprehensive test suite for password storage operations
- Update setup-wifi screen to use secure storage
Security improvements:
- WiFi passwords now stored encrypted via expo-secure-store
- Passwords automatically cleared on user logout
- Seamless migration for existing users
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Implement comprehensive BLE cleanup functionality that properly
disconnects all devices and releases resources when user logs out.
Changes:
- Add cleanup() method to BLEManager and MockBLEManager
- Update IBLEManager interface to include cleanup
- Add cleanupBLE() to BLEContext to disconnect all devices
- Implement callback mechanism in api.ts for BLE cleanup on logout
- Wire up BLE cleanup in app layout to trigger on logout
- Add unit tests for BLE cleanup functionality
This ensures no BLE connections remain active after logout,
preventing resource leaks and potential connection issues.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Add build number/timestamp display on login screen
- Improve error message when beneficiary has no deployment (user-friendly text instead of crash)
- Fix verify-otp screen layout for Android (smaller spacing, icon sizes)
- Add KeyboardAvoidingView to setup-wifi screen
- Save WiFi passwords per SSID (auto-fill on reconnect)
- Suppress BLE "operation cancelled" noise in logs
- Add build-info generation script (npm run build-info)
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
BLE Fix:
- Check if sensor is already connected to target WiFi before sending credentials
- Handle W|fail when sensor uses saved credentials instead of new password
- Return success if sensor is connected to target network even after W|fail
Build Version Indicator:
- Add visible version badge on Dashboard screen (v2.1.0 • 2026-01-27 17:05)
- Green text on dark background in bottom-right corner
- Helps verify which build is running on device
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- setWiFi() now throws detailed errors instead of returning false
- Shows specific error messages: "WiFi credentials rejected", timeout etc.
- Added logging throughout BLE WiFi configuration flow
- Fixed WiFi network deduplication (keeps strongest signal)
- Ignore "Operation cancelled" error (normal cleanup behavior)
- BatchSetupProgress shows actual error in hint field
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Add getLocationDisplay() helper to convert location ID (e.g., 'bedroom')
to human-readable format with icon (e.g., '🛏️ Bedroom') using ROOM_LOCATIONS.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Replace free-text Location input with modal Picker selector
- Use ROOM_LOCATIONS constants for predefined room options
- Show icon and label for each location option
- Highlight currently selected location in picker
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
When customName is NULL, originalName should be shown.
Now uses beneficiary.displayName from server instead of
local computation (customName || name).
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Add displayName field to Beneficiary type (computed: customName || name)
- Populate displayName in getAllBeneficiaries and getWellNuoBeneficiary API calls
- Update detail page header to use beneficiary.displayName
- Update MockDashboard to use displayName
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Add displayName (customName || name) to BeneficiaryCard component
- Update header and MockDashboard to show customName when set
- Add custom name editing for non-custodian users (guardian/caretaker)
- Backend PATCH endpoint now supports customName updates via user_access table
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Update WellNuoLite submodule with Julia AI race condition fix
- Add ultravoxService for voice call handling
- Update voice.tsx with improved call flow
- Update equipment tracking in beneficiary details
- Clean up old data files
- Add react-native-base64 type definitions
- Add debug tools
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Add updateDeviceMetadata and attachDeviceToDeployment API methods
- Device Settings: editable location/description fields with save
- Equipment screen: location placeholder and quick navigation to settings
- Add Sensor: multi-select with checkboxes, select all/deselect all
- Setup WiFi: batch processing of multiple sensors sequentially
- BatchSetupProgress: animated progress bar, step indicators, auto-scroll
- SetupResultsScreen: success/failed/skipped summary with retry options
- Error handling: modal with Retry/Skip/Cancel All buttons
- Documentation: SENSORS_SYSTEM.md with full BLE protocol and flows
Implemented via Ralphy CLI autonomous agent in ~43 minutes.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Added TouchableOpacity wrapper around the location text in the equipment
list so users can tap on a sensor's location to go directly to its
Device Settings screen.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Added handleRetryFromResults function to retry setup for a single sensor
- Added Retry button next to each failed/skipped sensor in the results list
- When clicked, resets sensor state and returns to batch setup phase
- Added new styles: resultItemWithAction, resultItemLeft, retryItemButton
TASK-6.2: Add results screen after batch setup
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Add sensor index badge (1/5, 2/5...) on each card
- Add elapsed time display for processing sensors
- Add auto-scroll to current active sensor
- Add animated progress bar with success/error segments
- Add stats row showing success/error/skipped counts
- Improve visual feedback during batch WiFi setup
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- add-sensor.tsx now passes devices array with mac address via JSON
- setup-wifi.tsx parses devices from navigation params
- Support batch mode display (shows count and device names)
- Disconnect all devices when navigating back
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Display "No location set" in italic style when sensor has no location configured.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Features:
- Device metadata display (name, MAC, location, description)
- Edit device name and description
- Update WiFi credentials (reconnect flow)
- Remove device from beneficiary
- Device history and diagnostics
UI:
- Clean settings form with validation
- Delete confirmation dialog
- Success/error feedback
- Navigation back to equipment list on changes
Route: /(tabs)/beneficiaries/[id]/device-settings/[deviceId]
Sensor onboarding screens:
- add-sensor.tsx: BLE scanning + device selection
- setup-wifi.tsx: WiFi credentials + ESP32 provisioning
Flow:
1. Scan for nearby sensors via BLE
2. Select device from list
3. Enter WiFi credentials (SSID + password)
4. Send config over BLE using ESP IDF provisioning protocol
5. Verify connection and activate in backend
ESP Provisioning:
- services/espProvisioning.ts: ESP32 BLE provisioning implementation
- Protocol: custom-data exchange via BLE characteristics
- Security: WiFi password encrypted over BLE
- Timeout handling: 30s for provisioning, 60s for activation
User experience:
- Clear step-by-step wizard UI
- Loading states for BLE operations
- Success/error feedback
- Navigation to equipment screen on success
Core BLE system:
- BLEManager: Real BLE device scanning and connection (iOS/Android)
- MockBLEManager: Simulator-safe mock for development
- BLEContext: React context for BLE state management
- BLEProvider: Added to app/_layout.tsx
Bluetooth permissions:
- iOS: NSBluetoothAlwaysUsageDescription, NSBluetoothPeripheralUsageDescription
- Android: BLUETOOTH, BLUETOOTH_ADMIN, BLUETOOTH_CONNECT, BLUETOOTH_SCAN, ACCESS_FINE_LOCATION
Dependencies:
- react-native-ble-plx@3.5.0
- expo-device@8.0.10
- react-native-base64@0.2.2
Simulator support:
- Auto-detects iOS simulator via expo-device
- Falls back to MockBLEManager with fake devices
- No crashes or permission errors in development
Implemented three-tier sensor status (online/warning/offline) with visual indicators and BLE scanning for nearby devices.
Features:
- WPSensor type with status field (online/warning/offline)
- Automatic status calculation based on lastSeen time:
• Online: < 5 minutes (fresh data)
• Warning: 5 min - 1 hour (potential issue)
• Offline: > 1 hour (definitely problem)
- Dual sensor display: Connected (API) + Available Nearby (BLE)
- BLE scanning button for discovering nearby WP sensors
- Action Sheet for offline sensors with Reconnect/Remove options
- Updated summary card: Total/Online/Warning/Offline counts
- Visual status indicators: colored dots and labels
- Graceful error handling for API unavailability
Files changed:
- types/index.ts: Added WPSensor interface with status and source fields
- services/api.ts: Updated getDevicesForBeneficiary with status calculation
- equipment.tsx: Complete UI overhaul with BLE scanning and two-tier sensor list
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- BeneficiaryMenu: Navigate with ?edit=true param to open edit modal
- Beneficiary index: Auto-open edit modal when edit=true in URL
- Add loading indicator on Save button during edit save
- Add "Uploading..." overlay on avatar during image upload
