Supabase Integration

Relevant source files

The following files were used as context for generating this wiki page:

• supabase/setup-instructions.md
• scripts/setup-supabase-complete.js
• FIXES-APLICADOS.md
• REPORTE_CHAT_MODULE.md
• TEST_REPORT.md
• README.md
• DEPLOY-NETLIFY.md

The Supabase integration serves as the primary Backend-as-a-Service (BaaS) for the ELMEC Mobile App v2. It provides a comprehensive suite of cloud services including a PostgreSQL database, authentication, real-time data synchronization, and object storage. This integration enables an "offline-first" functionality while maintaining robust data consistency across platforms via central cloud management.

Sources: README.md:27-31, README.md:46-51

Architecture and Core Components

The integration is architected around several core modules that handle different aspects of the application's data and security needs. The system uses a centralized service layer (SupabaseService) to interact with the backend, ensuring a clear separation of concerns.

System Architecture Overview

The following diagram illustrates the high-level relationship between the mobile frontend and Supabase services:

Core Service Modules

Component	Description	Key Features
Auth	User identity management	JWT tokens, persistence, role-based access
Database	Relational data storage	PostgreSQL, RLS policies, custom indexes
Realtime	Live data updates	Postgres Changes, Presence tracking
Storage	Binary file management	Public/Private buckets for request attachments

Sources: README.md:27-51, TEST_REPORT.md:104-124

Authentication and Security

Authentication is handled via Supabase Auth, utilizing JWT tokens and refresh tokens for persistent sessions. Security is strictly enforced at the database level through Row Level Security (RLS) policies.

Row Level Security (RLS)

RLS policies ensure that users can only access data relevant to their role (Admin, Agent, or Customer). For example, customers can only view their own requests, while agents can view requests assigned to them.

Environment Configuration

The integration requires specific environment variables to be configured in a .env file or within the hosting provider (e.g., Netlify).

Variable	Description
EXPO_PUBLIC_SUPABASE_URL	The unique project URL from Supabase dashboard
EXPO_PUBLIC_SUPABASE_ANON_KEY	Public anonymous key for client-side requests
SUPABASE_SERVICE_ROLE_KEY	Sensitive key used only in administrative scripts

Sources: supabase/setup-instructions.md:21-27, scripts/setup-supabase-complete.js:18-19

Real-time Data Sync (Chat System)

The Chat module extensively utilizes Supabase Realtime via postgres_changes subscriptions. This allows the application to respond immediately to new messages or status updates without manual polling.

Real-time Subscription Flow

The ChatContext manages subscriptions to specific chat rooms to handle message inserts, updates, and user presence (typing indicators).

Presence Tracking

The system implements "Typing Indicators" using the Supabase Presence feature, tracking user activity timestamps and statuses within a channel.
Sources: REPORTE_CHAT_MODULE.md:261-268

Storage Integration

Supabase Storage is used to manage attachments for service requests. A dedicated bucket named request-files is utilized for this purpose.

File Upload Workflow

Files selected via the expo-document-picker or expo-image-picker are converted to base64 or blobs and uploaded to the storage bucket.

1. Validation: Check file size (5MB limit) and type.
2. Upload: Use supabase.storage.from('request-files').upload().
3. Linkage: Retrieve the public URL and save it in the archivos array of the requests table.

Sources: TEST_REPORT.md:104-124, RESUMEN_CONFIGURACION.md:20-25

Database Schema

The integration supports several primary tables, each governed by specific constraints and relationships.

Table	Purpose	Key Relationships
users	Stores profile data	Extended from Auth.users
requests	Service request tracking	Linked to users (customer/agent)
chat_rooms	Messaging containers	Links users and requests
messages	Individual chat entries	FK to chat_rooms and users
notifications	In-app alert system	FK to users

Sources: supabase/setup-instructions.md:65-72, REPORTE_CHAT_MODULE.md:462-480

Implementation Example: Message Schema

-- Partial schema for the messages table
ALTER TABLE messages
  ADD COLUMN IF NOT EXISTS reply_to UUID REFERENCES messages(id),
  ADD COLUMN IF NOT EXISTS file_name TEXT,
  ADD COLUMN IF NOT EXISTS file_size INTEGER,
  ADD COLUMN IF NOT EXISTS edited_at TIMESTAMP,
  ADD COLUMN IF NOT EXISTS read_by JSONB DEFAULT '{}'::jsonb;

Sources: INSTRUCCIONES_CHAT_SQL.md:36-60

Setup and Migration

The project includes automated scripts to facilitate the setup of the Supabase environment. The setup-supabase-complete.js script automates the creation of demo users and verifies table availability.

1. Connection Test: Validates project URL and keys.
2. Migrations: Executes SQL files from supabase/migrations/ to create the schema.
3. Seed Data: Creates administrative and demo accounts (Admin, Agent, Customer).
4. Validation: Performs health checks on all tables.

Sources: scripts/setup-supabase-complete.js:46-235

Conclusion

The Supabase integration provides a robust, scalable backend infrastructure for ELMEC v2. By leveraging RLS for security, Realtime for communication, and Storage for asset management, the system achieves a high degree of responsiveness and reliability. The architecture is designed to be extensible, allowing for future enhancements like push notifications and advanced analytics.

Sources: VALIDACION-COMPLETA.md:235-245