Skip to main content

Documentation Index

Fetch the complete documentation index at: https://wiki.vivla.com/llms.txt

Use this file to discover all available pages before exploring further.

​
Navegacion

La app Vivla utiliza Expo Router 6 con file-based routing y typed routes. Toda la estructura de navegacion se define a traves de la jerarquia de archivos en el directorio app/.

​
Root Layout

El punto de entrada (app/_layout.tsx) configura un Stack Navigator envuelto en multiples providers, cada uno aportando una funcionalidad clave: 
GestureHandlerRootView
  └── PostHogProvider          (analytics)
        └── QueryClientProvider  (TanStack React Query)
              └── SafeAreaProvider
                    └── OverlayProvider    (Stream Chat)
                          └── ActionSheetProvider
                                └── BottomSheetProvider
                                      └── Stack Navigator
                                      └── ProgressToastManager
El componente raiz esta envuelto con Sentry.wrap() para capturar errores automaticamente. Se llama a SplashScreen.preventAutoHideAsync() al inicio y se oculta el splash screen cuando appIsReady es true.

​
Screens del Root Stack

ScreenAnimacionDescripcion
index-Pantalla inicial (redirecciona)
loadingLOADING_FADEPantalla de carga durante inicializacion
errorFADEPantalla de error (timeout o fallo critico)
deep-link-errorFADEError de deep link (params invalidos)
(onboarding)SLIDE_RIGHTFlujo de onboarding
(auth)FADEPantallas de autenticacion
(tabs)FADETab Navigator principal
chatSLIDE_RIGHTStack de mensajeria
surveymodalEncuesta generica (presentacion modal)

​
Animation Presets

Los presets de animacion se definen en src/shared/constants/navigation.ts: 
{
  animation: 'fade',
  duration: 300,
}

​
Tab Navigator

El Tab Navigator (app/(tabs)/_layout.tsx) define 5 tabs con iconos SVG custom:

01_home

Stack Navigator: index, gallery, amenities

02_book

Material Top Tabs: book-stays, exchange-stays, rent-stays

03_inbox

Stack Navigator: index, archived, search (badge de no leidos)

04_stays

Material Top Tabs: active, past, cancelled, pending

05_profile

Stack Navigator: index

​
Property Selection Gate

Los tabs distintos de 01_home estan bloqueados si el usuario no tiene una propiedad seleccionada. El tabPress event se intercepta y se llama a e.preventDefault() cuando isPropertySelected es false.
  • 02_book: Material Top Tabs con book-stays, exchange-stays, rent-stays y un indicador de llaves disponibles (HeaderKeysIndicator) - 04_stays: Material Top Tabs con active, past, cancelled, pending y BookingToastProvider

​
Chat (app/chat/)

Stack con animacion slide_from_right:
RutaDescripcion
[channelType]/[channelId]/indexPantalla de conversacion
[channelType]/[channelId]/infoInformacion del canal
inviteModal de invitacion (animacion slide_from_bottom, presentacion modal)

​
Booking (app/booking/)

Usa Slot envuelto en BookingToastProvider:
RutaDescripcion
[id]Detalle de reserva
newNueva reserva
reviewResena de estadia (SurveyScreen slug=“stay-review”)
walletWallet de usuario

​
Property (app/property/)

RutaDescripcion
[id]Detalle de propiedad
home-reviewHome review (SurveyScreen slug=“home-review”)
arrival-reviewRevision de llegada (SurveyScreen slug=“arrival-review”)
rating-reportReporte de calificacion

​
Invite (app/invite/)

RutaDescripcion
[token]Invitacion por token
owner/[bookingId]Invitacion de propietario
onboardingOnboarding de invitacion

​
Issues (app/issues/)

Stack con BackButton fijo, que contiene Material Top Tabs:
TabDescripcion
activeIncidencias activas
pendingIncidencias pendientes
upgradeMejoras solicitadas
closedIncidencias cerradas

​
Arbol de Rutas Completo

app/
├── _layout.tsx              # Root Layout (providers + Stack)
├── index.tsx                # Redireccion inicial
├── loading.tsx              # Pantalla de carga
├── error.tsx                # Pantalla de error
├── deep-link-error.tsx      # Error de deep link
├── survey.tsx               # Ruta generica de encuestas (modal)
│
├── (onboarding)/            # Flujo de onboarding
│   └── ...
│
├── (auth)/                  # Autenticacion
│   ├── login
│   ├── reset-password
│   └── resend-password
│
├── (tabs)/                  # Tab Navigator
│   ├── _layout.tsx          # 5 tabs con iconos SVG
│   ├── 01_home/
│   │   ├── _layout.tsx      # Stack Navigator
│   │   ├── index.tsx        # Dashboard de propiedad
│   │   ├── gallery.tsx      # Galeria de fotos
│   │   └── amenities.tsx    # Lista de amenidades
│   ├── 02_book/
│   │   ├── _layout.tsx      # Material Top Tabs (o RentScreen para visitors)
│   │   ├── book-stays.tsx
│   │   ├── exchange-stays.tsx
│   │   └── rent-stays.tsx
│   ├── 03_inbox/
│   │   ├── _layout.tsx      # Stack Navigator
│   │   ├── index.tsx        # Lista de conversaciones
│   │   ├── archived.tsx     # Conversaciones archivadas
│   │   └── search.tsx       # Busqueda de mensajes
│   ├── 04_stays/
│   │   ├── _layout.tsx      # Material Top Tabs (o StayGuestScreen)
│   │   ├── active.tsx
│   │   ├── past.tsx
│   │   ├── cancelled.tsx
│   │   └── pending.tsx
│   └── 05_profile/
│       ├── _layout.tsx      # Stack Navigator
│       └── index.tsx        # Perfil de usuario
│
├── chat/
│   ├── _layout.tsx          # Stack con slide_from_right
│   ├── [channelType]/[channelId]/
│   │   ├── index.tsx
│   │   └── info.tsx
│   └── invite/              # Modal de invitacion
│
├── booking/
│   ├── _layout.tsx          # Slot + BookingToastProvider
│   ├── [id].tsx
│   ├── new.tsx
│   ├── review.tsx           # Resena de estadia (SurveyScreen)
│   └── wallet.tsx
│
├── property/
│   ├── _layout.tsx
│   ├── [id].tsx
│   ├── home-review.tsx      # Home review (SurveyScreen)
│   ├── arrival-review.tsx   # Arrival review (SurveyScreen)
│   └── rating-report.tsx
│
├── invite/
│   ├── _layout.tsx
│   ├── [token].tsx
│   ├── onboarding.tsx
│   └── owner/[bookingId].tsx
│
└── issues/
    ├── _layout.tsx          # Stack + BackButton
    └── (tabs)/
        ├── _layout.tsx      # Material Top Tabs
        ├── active.tsx
        ├── pending.tsx
        ├── upgrade.tsx
        └── closed.tsx
Las rutas publicas (que no requieren autenticacion) estan definidas en NAVIGATION_CONFIG.PUBLIC_GROUPS: (onboarding), (auth) e invite. El hook useNavigation gestiona las redirecciones segun el estado de autenticacion.