The areas table stores department/area definitions used to categorize incidents and assign them to appropriate staff members.
Table Name
areas
Schema Fields
Primary key, automatically generated
Area/department name (e.g., “mantenimiento”, “limpieza”, “cocina”)Used for both incident categorization and staff area assignments.
Automatically set when the area is created
Relationships
- incidents: One-to-many relationship (one area can have many incidents)
- profiles: Logical relationship via
profiles.area field (string match)
Common Area Types
Typical areas in a hotel incident management system:
Handles repairs, HVAC issues, plumbing, electrical problems
Handles cleaning requests, towel/linen issues, room supplies
Handles food service, room service, dietary concerns
Handles check-in/out issues, billing, general inquiries
Query Examples
Load All Areas
Fetch available areas for incident creation form:
const { data, error } = await supabase
.from("areas")
.select("id, name")
.order("name");
mobile/components/CreateIncidentForm.tsx:86
This populates the area dropdown when guests report incidents:
type Area = {
id: string;
name: string;
};
const [areas, setAreas] = useState<Area[]>([]);
Find Area by Name
Lookup area ID for staff member’s assigned area:
const { data: profile } = await supabase
.from("profiles")
.select("area")
.eq("id", userId)
.single();
const { data: areaData } = await supabase
.from("areas")
.select("id")
.eq("name", profile.area)
.single();
mobile/components/EmpleadoBuzonIncidents.tsx:199
Get Area Name from Incident
Fetch incident with related area information:
const { data, error } = await supabase
.from("incidents")
.select(`
id,
title,
description,
areas(name)
`)
.eq("id", incidentId)
.single();
console.log(data.areas.name); // "mantenimiento"
mobile/components/MyIncidentsView.tsx:108
Load Area-Filtered Incidents
Staff members see only incidents for their area:
const { data: incidents, error } = await supabase
.from("incidents")
.select(`
id,
title,
description,
priority,
status,
created_at,
areas(name),
rooms(room_code)
`)
.eq("area_id", areaId)
.eq("status", "pendiente")
.order("created_at", { ascending: false });
mobile/components/EmpleadoBuzonIncidents.tsx:207
Area Assignment Flow
Data Model
interface Area {
id: string; // UUID
name: string; // e.g., "mantenimiento"
created_at: string; // ISO timestamp
}
mobile/components/CreateIncidentForm.tsx:27
Area names are stored in lowercase but displayed with proper capitalization:
const displayName = area.name.charAt(0).toUpperCase() + area.name.slice(1);
// "mantenimiento" → "Mantenimiento"
mobile/components/CreateIncidentForm.tsx:207
Integration with Staff Profiles
Staff members are assigned to areas via the profiles.area field:
// Create staff member
await supabase.from("profiles").insert({
id: userId,
email: "staff@hotel.com",
full_name: "Staff Member",
role: "empleado",
area: "mantenimiento", // Links to areas.name
});
// Get user's area
const { data: profile } = await supabase
.from("profiles")
.select("area")
.eq("id", userId)
.single();
// Find area ID
const { data: areaData } = await supabase
.from("areas")
.select("id")
.eq("name", profile.area)
.single();
// Query incidents for that area
const { data: incidents } = await supabase
.from("incidents")
.select("*")
.eq("area_id", areaData.id);
Best Practices
- Keep area names consistent and lowercase for easier matching
- Use descriptive names that staff and guests can understand
- Create areas before adding staff members
- Avoid renaming areas once incidents are assigned
The profiles.area field stores the area name as a string, not a foreign key. Ensure area names match exactly between tables.
Incidents
Incidents categorized by area
Users
Staff members assigned to areas
