Skip to main content

Technical Overview

Grove is a mobile-first community platform designed to help local groups, clubs, and organizations coordinate their activities without the complexity of enterprise software. This document provides a comprehensive technical overview of the platform's design philosophy, core capabilities, and technology choices.

Platform Vision​

Guiding Principles​

1. Ship Quickly Without Sacrificing Reliability​

Grove uses managed services (Supabase, Expo) to minimize infrastructure overhead while maintaining enterprise-grade reliability:

AspectApproach
DatabaseManaged PostgreSQL with automatic backups
AuthenticationSupabase Auth with OAuth providers
StorageSupabase Storage with CDN
BuildsEAS Build for iOS and Android
UpdatesOTA updates via EAS Update

2. Keep the Data Model Simple and Extensible​

The database schema follows a community-centric design where:

  • Communities are the top-level organizing entity
  • All features are scoped to communities
  • Users can belong to multiple communities with different roles
  • New features can be added without schema redesign

3. Support Feature Flags for Optional Modules​

Not all communities need all features. Grove implements toggleable feature modules:

FeatureDefaultToggleable
EventsEnabledNo
ChatEnabledNo
FeedEnabledNo
FinanceDisabledYes
PollsDisabledYes
MeetingsDisabledYes
TasksDisabledYes

4. Treat Privacy and Trust as First-Class Requirements​

Security is built into every layer:


Core Components​

Mobile Client​

The mobile application is the primary interface for Grove users.

Key Technologies:

  • Expo SDK 54: Managed workflow for rapid development
  • React Native 0.81: Cross-platform native UI
  • Expo Router 6: File-based navigation
  • NativeWind: Tailwind CSS for React Native
  • React Query: Server state management
  • Zustand: Client state management

Backend Services​

Supabase provides a complete backend infrastructure:

Backend Capabilities:

  • PostgreSQL Database: Full SQL with RLS
  • Authentication: Email, OAuth, Magic Links
  • Real-time: WebSocket subscriptions
  • Storage: File uploads with access control
  • Edge Functions: Serverless compute

Notification Delivery​

Push notifications keep users engaged:


Application Architecture​

Layer Diagram​

Feature Module Organization​

Each major feature follows a consistent structure:

features/
├── events/
│ ├── hooks/ # useEvents, useEvent, useEventMutations
│ ├── components/ # EventCard, EventList, EventForm
│ ├── screens/ # EventListScreen, EventDetailScreen
│ └── types/ # TypeScript interfaces
├── chat/
│ ├── hooks/ # useMessages, useSendMessage
│ ├── components/ # MessageList, MessageInput
│ └── screens/ # ChatScreen
└── finance/
├── hooks/ # useTransactions, useContributions
├── components/ # TransactionCard, ContributionCard
└── screens/ # FinanceScreen, AddTransactionScreen

Data Flow Patterns​

Read Operations (Queries)​

Write Operations (Mutations)​

Real-time Subscriptions​


Authentication System​

Supported Authentication Methods​

Authentication Flow​

Session Management​

Token TypeStorageExpirationRefresh
Access TokenMemory1 hourAutomatic
Refresh TokenSecure Storage1 weekOn access token expiry

Performance Optimization​

Client-Side Strategies​

  1. Query Caching: React Query caches API responses
  2. Optimistic Updates: Immediate UI feedback for mutations
  3. Image Optimization: Compressed uploads, cached downloads
  4. List Virtualization: Only render visible items
  5. Lazy Loading: Load screens on demand

Backend Strategies​

  1. Database Indexes: Optimized for common queries
  2. Connection Pooling: Managed by Supabase
  3. Row Level Security: Efficient policy evaluation
  4. CDN for Storage: Static assets served from edge

Performance Targets​

MetricTargetCurrent
App Launch< 2s~1.5s
Screen Transition< 300ms~200ms
API Response (p95)< 500ms~300ms
Image Load< 1s~600ms

Error Handling​

Error Categories​

Error Handling Strategy​

Error TypeUser ExperienceTechnical Action
Network offlineShow offline bannerQueue for retry
Auth expiredRedirect to loginClear tokens, refresh
ValidationInline field errorsPrevent submission
Server 500Toast with retryLog to monitoring
Rate limited"Try again later"Exponential backoff

Development Workflow​

Local Development​

# Install dependencies
npm install

# Start development server
npm start

# Run on iOS simulator
npm run ios

# Run on Android emulator
npm run android

Build Pipeline​

Environment Configuration​

EnvironmentDatabaseAuth ProvidersFeatures
DevelopmentLocal/StagingTest accountsAll enabled
PreviewStagingOAuth sandboxAll enabled
ProductionProductionLive OAuthFeature flags

Monitoring and Observability​

Current Implementation​

  • Error Tracking: Sentry (planned)
  • Analytics: PostHog (planned)
  • Logs: Supabase Dashboard
  • Performance: React Native Performance Monitor

Monitoring Dashboard (Planned)​


Deployment Architecture​

Current Deployment​

Release Process​

  1. Development: Feature branches, local testing
  2. Preview: EAS Preview builds for testers
  3. Beta: TestFlight (iOS) / Internal Testing (Android)
  4. Production: Staged rollout to app stores

Future Technical Roadmap​

Phase 2 Enhancements​

  • Offline-first with local SQLite sync
  • Enhanced push notification targeting
  • In-app analytics integration
  • Performance monitoring with Sentry

Phase 3 Scale​

  • Multi-region database replication
  • Advanced caching with Redis
  • Payment integration (Stripe Connect)
  • Calendar sync (Google/Apple Calendar)

Technical Decisions Log​

DecisionChoiceRationale
Mobile FrameworkExpo/React NativeCross-platform, rapid development
BackendSupabaseManaged PostgreSQL, built-in auth
State ManagementReact Query + ZustandServer vs client state separation
StylingNativeWindFamiliar Tailwind syntax
NavigationExpo RouterFile-based, type-safe
Real-timeSupabase RealtimeIntegrated with database
PushExpo NotificationsCross-platform, EAS integration