Adapted from the Echo (ExpoBase) reference structure. Source: https://docs.expobase.dev/guide/project-structure

​
🏗️ Project Structure

This page explains in detail the architecture and code organization in Echo, helping you understand where to find each element and how everything fits together.

​
📂 Overview

├── app/
│   ├── (auth)/
│   │   ├── resetPassword.tsx
│   │   ├── sign-in.tsx
│   │   ├── sign-up.tsx
│   │   └── welcome.tsx
│   ├── (protected)/
│   │   ├── (tabs)/
│   │   │   ├── _layout.tsx
│   │   │   ├── ai.tsx
│   │   │   ├── index.tsx
│   │   │   ├── notifications.tsx
│   │   │   ├── offline.tsx
│   │   │   ├── payment.tsx
│   │   │   ├── premium.tsx
│   │   │   ├── profile.tsx
│   │   │   ├── settings.tsx
│   │   │   └── tasks.tsx
│   │   ├── _layout.tsx
│   │   ├── privacy-policy.tsx
│   │   └── terms-of-service.tsx
│   ├── onboarding/
│   │   ├── _layout.tsx
│   │   └── index.tsx
│   ├── _layout.tsx
│   ├── +not-found.tsx
│   └── index.tsx
├── assets/
│   ├── fonts/
│   │   ├── InstrumentSerif-Italic.ttf
│   │   └── InstrumentSerif-Regular.ttf
│   ├── icons/
│   │   ├── adaptive_icon.png
│   │   ├── icon_base.png
│   │   ├── icon_dark.png
│   │   └── icon_light.png
│   ├── logo/
│   │   ├── revenuecat.png
│   │   └── stripe.jpeg
│   ├── splashscreen/
│   │   ├── splashscreen_dark.png
│   │   └── splashscreen_light.png
│   └── icon.png
├── components/
│   ├── ai/
│   │   ├── AIThinkingLoader.tsx
│   │   ├── AutoResizingInput.tsx
│   │   ├── ChatHeader.tsx
│   │   ├── index.ts
│   │   ├── MessageActions.tsx
│   │   ├── MessageBubble.tsx
│   │   ├── PromptLabels.tsx
│   │   ├── ThinkingAnimation.tsx
│   │   └── TypewriterText.tsx
│   ├── auth/
│   │   ├── appleProviderButton.tsx
│   │   ├── EmailLoginForm.tsx
│   │   ├── EmailLoginToggle.tsx
│   │   ├── googleProviderButton.tsx
│   │   ├── index.ts
│   │   ├── Separator.tsx
│   │   └── SocialLoginButtons.tsx
│   ├── email/
│   │   └── buttonSendEmail.tsx
│   ├── layout/
│   │   └── LayoutWrapper.tsx
│   ├── notifications/
│   │   ├── DebugInfo.tsx
│   │   ├── DeviceInfoCard.tsx
│   │   ├── index.ts
│   │   ├── NotificationCenter.tsx
│   │   ├── NotificationHeader.tsx
│   │   ├── NotificationSettings.tsx
│   │   ├── PermissionStatusCard.tsx
│   │   ├── push.tsx
│   │   └── TestButtonsSection.tsx
│   ├── onboarding/
│   │   ├── index.ts
│   │   ├── NotificationSettings.tsx
│   │   ├── OnboardingFeatureCard.tsx
│   │   ├── OnboardingNavigationButtons.tsx
│   │   ├── OnboardingProgressBar.tsx
│   │   ├── OnboardingStep1.tsx
│   │   ├── OnboardingStep2.tsx
│   │   └── OnboardingStep3.tsx
│   ├── payment/
│   │   ├── index.ts
│   │   ├── PaymentButton.tsx
│   │   ├── PaymentSheet.tsx
│   │   ├── paywall.tsx
│   │   └── stripeButtonPay.tsx
│   ├── premium/
│   │   ├── index.ts
│   │   ├── PaywallScreen.tsx
│   │   ├── PremiumGate.tsx
│   │   ├── PremiumStatus.tsx
│   │   └── RestorePurchaseButton.tsx
│   ├── profile/
│   │   ├── EditFieldModal.tsx
│   │   ├── index.ts
│   │   ├── ProfileActionsSection.tsx
│   │   ├── ProfileEditSection.tsx
│   │   ├── ProfileHeaderSection.tsx
│   │   ├── ProfileInfoSection.tsx
│   │   └── ProfileStatusSection.tsx
│   ├── settings/
│   │   ├── AssistanceSection.tsx
│   │   ├── index.ts
│   │   ├── NotificationsSection.tsx
│   │   ├── PreferencesSection.tsx
│   │   ├── ProfileSection.tsx
│   │   ├── SettingsRow.tsx
│   │   ├── SettingsSection.tsx
│   │   └── SubscriptionSection.tsx
│   ├── tasks/
│   │   ├── CreateTaskForm.tsx
│   │   ├── EditTaskModal.tsx
│   │   ├── index.ts
│   │   ├── StatusBadges.tsx
│   │   ├── TaskCard.tsx
│   │   └── TaskList.tsx
│   └── ui/
│       ├── avatar.tsx
│       ├── badge.tsx
│       ├── button.tsx
│       ├── card.tsx
│       ├── checkbox.tsx
│       ├── dialog.tsx
│       ├── dynamic-header.tsx
│       ├── header-menu.tsx
│       ├── header-title.tsx
│       ├── input.tsx
│       ├── label.tsx
│       ├── ProgressBar.tsx
│       ├── select.tsx
│       ├── sidebar.tsx
│       ├── table.tsx
│       ├── tabs.tsx
│       ├── text.tsx
│       └── toggle.tsx
├── config/
│   ├── i18n.ts
│   ├── linking.ts
│   └── supabase.ts
├── constants/
│   ├── colors.ts
│   ├── emailTemplates.ts
│   ├── navigation.ts
│   ├── notifications.ts
│   ├── onboarding.ts
│   ├── promptData.ts
│   └── quickActions.ts
├── context/
│   ├── AuthContext.tsx
│   ├── RevenuCatContext.tsx
│   ├── SidebarContext.tsx
│   ├── StripeContext.tsx
│   └── ThemeContext.tsx
├── fetch/
│   ├── profile.ts
│   └── tasks.ts
├── hooks/
│   ├── useAIChat.ts
│   ├── useCache.ts
│   ├── useColorScheme.ts
│   ├── useIconColors.ts
│   ├── useImageUpload.ts
│   ├── useNetworkStatus.ts
│   ├── useNotifications.ts
│   ├── useOnboarding.ts
│   ├── usePremiumStatus.ts
│   ├── useProfile.ts
│   ├── useSounds.ts
│   ├── useTasks.ts
│   ├── useTheme.tsx
│   └── useTranslation.ts
├── icons/
│   └── index.tsx
├── lib/
│   ├── storage/
│   │   ├── index.ts
│   │   ├── supabase.ts
│   │   └── zustand.ts
│
├── queryClient.ts
└── utils.ts
├── locales/
│   ├── en.json
│   ├── es.json
│   ├── fr.json
│   └── pt.json
├── stores/
│   ├── offlineStore.ts
│   ├── onboardingStore.ts
│   ├── profileStore.ts
│   └── README.md
├── supabase/
│   ├── functions/
│   │   ├── ai-completion/
│   │   │   └── index.ts
│   │   ├── create-payment-intent/
│   │   │   └── index.ts
│   │   ├── create-stripe-checkout/
│   │   │   └── index.ts
│   │   ├── resend-email/
│   │   │   └── index.ts
│   │   ├── send-notifications/
│   │   │   └── index.ts
│   │   └── stripe-webhooks/
│   │       └── index.ts
│
├── migrations/
│   └── 20250202000000_init_supabase.sql
│
├── templates/
│   └── invite.html
│
└── config.toml

​
📁 Main Folders Detail

​
📱 /app - Expo Router Structure

The main application structure using Expo Router file-based routing. 
app/
├── (auth)/                   # Authentication group
│   ├── resetPassword.tsx    # Password reset screen
│   ├── sign-in.tsx          # Sign in screen  
│   ├── sign-up.tsx          # Sign up screen
│   └── welcome.tsx          # Welcome screen
│
├── (protected)/             # Protected routes group
│   ├── (tabs)/              # Tab navigation
│   │   ├── _layout.tsx      # Tab layout configuration
│   │   ├── ai.tsx           # AI chat screen
│   │   ├── index.tsx        # Home screen
│   │   ├── notifications.tsx # Notifications screen
│   │   ├── offline.tsx      # Offline mode screen
│   │   ├── payment.tsx      # Payment screen
│   │   ├── premium.tsx      # Premium features screen
│   │   ├── profile.tsx      # Profile screen
│   │   ├── settings.tsx     # Settings screen
│   │   └── tasks.tsx        # Tasks screen
│   ├── _layout.tsx          # Protected layout
│   ├── privacy-policy.tsx   # Privacy policy
│   └── terms-of-service.tsx # Terms of service
│
├── onboarding/              # Onboarding flow
│   ├── _layout.tsx          # Onboarding layout
│   └── index.tsx            # Onboarding screens
│
├── _layout.tsx              # Root layout
├── +not-found.tsx           # 404 page
└── index.tsx                # App entry point
For the full breakdown of remaining folders (assets, components, config, constants, context, fetch, hooks, icons, lib, locales, stores, supabase, types, utils), see the Echo repo structure and the reference article.