Prowbot - AI Personal Finance Analyzer

A modern personal finance app to track accounts and transactions, visualize spending, and use AI to speed up expense logging from chat and files.

Features

• Secure auth and session management with Supabase
• Dashboard with summary cards and spending charts
• Account management (create, update, delete with balance safety checks)
• Transaction management (add, edit, delete, transfer between accounts)
• Categories with budgeting support
• AI assistant for finance actions and query-style insights
• File and image parsing for transaction extraction
• Protected app routes with middleware-based redirects
• Responsive marketing landing page and auth flows

Project Structure

personal-finance-analyzer/
|- app/
|  |- (marketing)/              # Public landing page
|  |- (auth)/                   # Login, signup, reset/update password
|  |- app/(protected)/          # Authenticated finance app
|  |- actions/                  # Server actions (accounts, transactions, AI, etc.)
|  |- api/ai/                   # AI chat + file parsing API routes
|  |- auth/callback/            # Supabase auth callback route
|- components/
|  |- ui/                       # Reusable UI primitives (shadcn/radix)
|  |- home/                     # Dashboard widgets/charts/forms
|  |- auth/                     # Auth forms
|  |- ai/                       # AI chat and confirmation UI
|- hooks/                       # React Query hooks and app hooks
|- lib/                         # Shared utilities, auth context, types, Supabase clients
|- scripts/                     # Utility scripts (schema check)
|- middleware.ts                # Route protection and redirects

Libraries and Technologies

Core

• Next.js 16 (App Router)
• React 19 + TypeScript 5
• Tailwind CSS 4

Data and Auth

• Supabase (@supabase/ssr, @supabase/supabase-js)
• Middleware-based auth guards

State and Data Fetching

• TanStack Query (@tanstack/react-query)

UI and Visualization

• shadcn/ui + Radix UI primitives
• Lucide icons
• Recharts for analytics and trends
• date-fns for date utilities

AI and File Parsing

• Cloudflare AI (Gemma model) for conversational finance assistant
• mammoth for DOCX parsing
• unpdf for PDF parsing

Getting Started

1. Prerequisites

• Node.js 20+
• npm
• Supabase project
• (Optional) Cloudflare account + AI token for AI features

2. Install dependencies

npm install

3. Configure environment variables

Create a .env.local file in the project root:

NEXT_PUBLIC_SUPABASE_URL=your_supabase_url
NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY=your_supabase_publishable_or_anon_key

# Optional: used by scripts/check-schema.ts
NEXT_PUBLIC_SUPABASE_ANON_KEY=your_supabase_publishable_or_anon_key

# Optional: enable AI routes
CLOUDFLARE_ACCOUNT_ID=your_cloudflare_account_id
CLOUDFLARE_AI_API_TOKEN=your_cloudflare_ai_api_token

4. Prepare Supabase tables

Make sure your Supabase database includes the tables used by the app:

• accounts
• transactions
• categories
• ai_messages

Each table should include a user_id column and timestamps as needed by your schema.

5. Run the app locally

npm run dev

Open http://localhost:3000.

Available Scripts

• npm run dev - Start the local dev server
• npm run build - Create production build
• npm run start - Run production server
• npm run lint - Run ESLint

Auth and Routing Behavior

• Public routes include landing and auth pages
• /app and /app/* are protected
• Unauthenticated users are redirected to /login
• Authenticated users trying to access /login or /signup are redirected to /app

Notes

• AI features are optional and require Cloudflare AI credentials.
• The app uses server actions and API routes, so environment variables must be configured before startup.