Files

Michael Freno 4f1ff9dbb0 feat: Implement NotificationsView component for Lendair iOS

- Create NotificationsView.swift with SwiftUI List and pull-to-refresh
- Create NotificationRowView.swift for individual notification items
- Create NotificationsViewModel.swift with MVVM pattern
- Implement empty state view for no notifications
- Add mark-as-read and mark-all-as-read functionality
- Support notification types: loan approved/rejected, payment received/due, new lender, system updates
- Add toolbar action for marking all notifications as read
- Include README.md with architecture documentation and integration guide

Next: Connect tRPC notifications router for data fetching

2026-05-03 12:11:00 -04:00

2.6 KiB

Raw Blame History

Lendair iOS Notifications

Overview

SwiftUI implementation of the notifications feature for the Lendair iOS app.

Architecture

MVVM Pattern

View: NotificationsView - Main container view
ViewModel: NotificationsViewModel - Manages notification state and business logic
Service: NotificationsService - Data layer for API communication

Components

NotificationsView (`Views/NotificationsView.swift`)

Main navigation container for the notifications screen
Implements pull-to-refresh functionality
Handles empty state display
Provides "Mark All Read" action in toolbar
Integrates with navigation stack

NotificationRowView (`Views/NotificationRowView.swift`)

Individual notification list item
Displays notification icon, title, message, and timestamp
Shows read/unread indicator
Supports tap-to-mark-as-read interaction

NotificationsViewModel (`ViewModels/NotificationsViewModel.swift`)

Observable object managing notification state
Fetches notifications from service layer
Handles mark-as-read and mark-all-as-read operations
Calculates unread count for badge display
Implements refresh logic

Notification Types

The app supports the following notification types:

LOAN_APPROVED - Green checkmark icon
LOAN_REJECTED - Red X icon
PAYMENT_RECEIVED - Green down arrow icon
PAYMENT_DUE - Orange exclamation icon
NEW_LENDER - Blue person icon
SYSTEM_UPDATE - Gray info icon

Integration Points

tRPC Router (TODO)

The service layer is designed to connect to the tRPC notifications router:

// web/src/server/api/routers/notifications.ts
notifications: router({
  list: protectedQuery(...),
  markAsRead: protectedMutation(...),
  markAllAsRead: protectedMutation(...),
})

API Endpoints (TODO)

GET /api/notifications - List notifications
PATCH /api/notifications/:id/read - Mark single as read
PATCH /api/notifications/read-all - Mark all as read

Usage

// In your MainTabView or navigation stack
NavigationStack {
    NotificationsView()
}

Testing

Run the preview in Xcode to see the notification row designs:

#Preview {
    NotificationRowView(notification: sampleNotification)
}

Future Enhancements

Push Notifications: Integrate with UNUserNotificationCenter
Notification Preferences: Allow users to customize notification types
Deep Linking: Navigate to relevant screens when tapping notifications
Offline Support: Cache notifications locally with Core Data
Analytics: Track notification engagement metrics

2.6 KiB Raw Blame History