📁 Codebase Guide

Line-by-line code analysis, directory structure, and component breakdown.

Complete Directory Structure

spendwise-native/ │ ├── app/ # Expo Router screens (file-based routing) │ ├── (auth)/ # Auth route group │ │ ├── _layout.tsx # Auth stack navigator │ │ └── login.tsx # Login/Register screen (240 lines) │ │ │ ├── (tabs)/ # Main tab route group │ │ ├── _layout.tsx # Tab navigator with 7 tabs │ │ ├── index.tsx # Dashboard (256 lines) │ │ ├── transactions.tsx # Transaction CRUD (281 lines) │ │ ├── insights.tsx # AI financial insights (405 lines) │ │ ├── reports.tsx # Charts & analytics (417 lines) │ │ ├── budget.tsx # Budget management (278 lines) │ │ ├── goals.tsx # Savings goals (297 lines) │ │ └── settings.tsx # App settings (239 lines) │ │ │ └── _layout.tsx # Root layout with AppProvider │ ├── lib/ # Service modules │ ├── firebase.ts # Firebase config & initialization │ ├── auth.ts # Authentication helpers │ ├── database.ts # Realtime Database CRUD │ ├── ai.ts # Groq AI integration (256 lines) │ └── notifications.ts # Expo Notifications (199 lines) │ ├── context/ │ └── AppContext.tsx # Global state management (278 lines) │ ├── types/ │ └── index.ts # TypeScript interfaces │ ├── constants/ │ └── app.ts # Categories, currencies, colors │ ├── assets/ │ └── images/ # App icons & splash │ ├── icon.png │ ├── adaptive-icon.png │ └── splash-icon.png │ ├── docs/ # GitHub Pages site │ ├── index.html # Landing page │ ├── docs/ # Documentation pages │ └── screenshots/ # App screenshots │ ├── .github/workflows/ │ ├── build-android.yml # EAS Build workflow │ └── pages.yml # GitHub Pages deploy │ ├── app.json # Expo configuration ├── eas.json # EAS Build profiles ├── package.json # Dependencies ├── tsconfig.json # TypeScript config └── .env # Environment variables (gitignored)

Screen Components

Detailed breakdown of each screen component.

app/(tabs)/index.tsx Dashboard

Main dashboard showing financial overview with balance cards and weekly spending chart.

✓ Balance summary (income, expenses, savings)
✓ Weekly spending line chart (react-native-chart-kit)
✓ Recent transactions list (last 5)
✓ Floating Action Button for quick add

app/(tabs)/transactions.tsx Transactions

Full transaction list with filtering, add/edit modal, and swipe-to-delete.

✓ Filter by type (All/Income/Expense)
✓ Transaction cards with category icons
✓ Add/Edit modal with form validation
✓ Delete confirmation

app/(tabs)/insights.tsx AI Insights

AI-powered financial analysis using Groq's LLaMA 3.3 70B model.

✓ Financial Health Score (0-100 with gauge)
✓ AI-generated insights cards (success/warning/tip/info)
✓ Personalized recommendations list
✓ Pull-to-refresh for new analysis
✓ Loading states and error handling

app/(tabs)/reports.tsx Reports

Visual analytics with pie charts and bar graphs.

✓ Time range selector (Week/Month/Year)
✓ Summary cards (transactions, income, expenses, savings)
✓ Pie chart for spending by category
✓ Bar chart for daily spending trends

app/(tabs)/budget.tsx Budget

Budget management with progress tracking.

✓ Budget cards with progress bars
✓ Color-coded status (green/yellow/red)
✓ Add/Edit budget modal
✓ Period selection (daily/weekly/monthly/yearly)

app/(tabs)/goals.tsx Goals

Savings goals tracking with quick-add functionality.

✓ Goal cards with visual progress
✓ Quick "Add Funds" button
✓ Deadline tracking
✓ Priority badges (Low/Medium/High)

app/(tabs)/settings.tsx Settings

App configuration and user preferences.

✓ User info display
✓ App statistics (transaction count, etc.)
✓ Notification toggles (daily reminders, budget alerts, weekly insights)
✓ Test notification button
✓ Currency selection
✓ Dark mode toggle
✓ Logout functionality

Service Modules

lib/ai.ts Groq AI

Integration with Groq's LLaMA 3.3 70B model for financial insights.

                    // Key exports
                    export async function getFinancialInsights(
                    transactions: Transaction[],
                    budgets: Budget[],
                    goals: Goal[],
                    currency: Currency
                    ): Promise<AIInsightResponse>

                    export function getQuickTip(): string
                

lib/database.ts Firebase Realtime DB

CRUD operations and real-time subscriptions.

                    // Key exports
                    export async function saveTransaction(userId: string, transaction: Transaction)
                    export async function saveBudget(userId: string, budget: Budget)
                    export async function saveGoal(userId: string, goal: Goal)
                    export async function saveSettings(userId: string, settings: Settings)

                    export function subscribeToTransactions(userId: string, callback: Function)
                    export function subscribeToBudgets(userId: string, callback: Function)
                    export function subscribeToGoals(userId: string, callback: Function)
                    export function subscribeToSettings(userId: string, callback: Function)
                

lib/notifications.ts Expo Notifications

Push notification system for alerts and reminders.

                    // Key exports
                    export async function requestNotificationPermission(): Promise<boolean>
                    export async function sendNotification(title: string, body: string, data?: object)
                    export async function sendBudgetAlert(category: string, percentage: number)
                    export async function scheduleDailyReminder(hour: number, minute: number)
                    export async function scheduleWeeklySummary()
                    export async function cancelAllNotifications()
                

Type Definitions

types/index.ts TypeScript

All TypeScript interfaces used throughout the app.

                    export interface Transaction {
                    id: string;
                    type: 'income' | 'expense';
                    amount: number;
                    category: string;
                    date: number;
                    note: string;
                    paymentMethod: string;
                    }

                    export interface Budget {
                    id: string;
                    category: string;
                    limit: number;
                    period: 'daily' | 'weekly' | 'monthly' | 'yearly';
                    }

                    export interface Goal {
                    id: string;
                    name: string;
                    targetAmount: number;
                    currentAmount: number;
                    deadline: number;
                    priority: 'low' | 'medium' | 'high';
                    }

                    export interface Currency {
                    code: string;
                    symbol: string;
                    name: string;
                    }

                    export interface AIInsight {
                    title: string;
                    message: string;
                    type: 'success' | 'warning' | 'tip' | 'info';
                    icon: string;
                    }

                    export interface AIInsightResponse {
                    healthScore: number;
                    insights: AIInsight[];
                    recommendations: string[];
                    summary: string;
                    }
                

Key Dependencies

Package	Version	Purpose
expo	~52.0.0	Core framework
react-native	0.76.5	UI framework
expo-router	~4.0.0	File-based routing
firebase	^11.0.2	Backend services
react-native-chart-kit	^6.12.0	Charts & graphs
expo-notifications	~0.29.0	Push notifications
@expo/vector-icons	^14.0.0	Icon library