# Project Architecture

This project uses Expo Router and follows a route-first + feature-module structure.

## Directory Design

- `app/`: Routing layer only (Expo Router pages and layouts).
- `features/`: Business modules grouped by domain.
- `providers/`: App-level providers and bootstrap orchestration.
- `components/`: Reusable presentational components.
- `hooks/`: Shared generic hooks (cross-feature).
- `constants/`: Shared constants and theme tokens.

## Current Module Split

- `app/_layout.tsx`
  - Root navigation composition only.
  - Theme provider and route stack config.
  - No SDK side effects.

- `providers/app-bootstrap-provider.tsx`
  - Central app bootstrap orchestration.
  - Triggers feature bootstrap hooks.

- `features/im/openim-bootstrap.ts`
  - OpenIM SDK initialization and listener registration.
  - One-time initialization guard.
  - Local data directory creation and reuse.

- `features/im/hooks/use-openim-bootstrap.ts`
  - React lifecycle bridge for IM bootstrap.

## Why This Structure

- Keeps routing files focused on navigation.
- Moves SDK side effects out of render paths.
- Makes IM bootstrap testable and reusable.
- Scales better when adding `features/chat`, `features/contact`, and `features/conversation`.

## Next Suggested Refactors

1. Move IM API wrappers into `features/im/services/`.
2. Add `features/chat/hooks/use-chat-list.ts` and `features/chat/hooks/use-messages.ts`.
3. Keep `app/(tabs)` as route shells and move business UI into `features/*/screens`.