Build Your Own CRM

Build me a simple CRM (Customer Relationship Management) system with the following specifications:

## Tech Stack
- React 18 with TypeScript
- Supabase for backend (auth + database)
- Tailwind CSS for styling
- React Query for data fetching

## Core Features

### 1. Contacts Management
- List all contacts with search and filter
- Contact fields: name, email, phone, company, title, status, notes, createdAt
- Add/edit/delete contacts
- Contact detail page showing all info + activity history
- Import contacts from CSV

### 2. Companies
- Company fields: name, website, industry, size, address
- Associate contacts with companies
- Company detail page showing all associated contacts

### 3. Deals / Opportunities
- Deal fields: name, value, stage, probability, expectedCloseDate, contactId, companyId
- Pipeline stages: Lead, Qualified, Proposal, Negotiation, Closed Won, Closed Lost
- Kanban board view (drag and drop between stages)
- List view with sorting and filtering

### 4. Activities
- Activity types: Call, Email, Meeting, Note, Task
- Log activities against contacts or deals
- Activity fields: type, subject, description, date, completed
- Timeline view on contact/deal pages

### 5. Dashboard
- Total contacts, companies, deals count
- Pipeline value by stage (bar chart)
- Recent activities
- Deals closing this month
- Win rate percentage

### 6. Authentication
- Supabase Auth with email/password
- Protected routes
- User profile

## Database Schema (Supabase)
```sql
-- Enable UUID extension
create extension if not exists "uuid-ossp";

-- Contacts table
create table contacts (
  id uuid default uuid_generate_v4() primary key,
  user_id uuid references auth.users not null,
  name text not null,
  email text,
  phone text,
  company_id uuid references companies,
  title text,
  status text default 'active',
  notes text,
  created_at timestamp with time zone default now()
);

-- Companies table
create table companies (
  id uuid default uuid_generate_v4() primary key,
  user_id uuid references auth.users not null,
  name text not null,
  website text,
  industry text,
  size text,
  address text,
  created_at timestamp with time zone default now()
);

-- Deals table
create table deals (
  id uuid default uuid_generate_v4() primary key,
  user_id uuid references auth.users not null,
  name text not null,
  value decimal(10,2),
  stage text default 'lead',
  probability integer default 10,
  expected_close_date date,
  contact_id uuid references contacts,
  company_id uuid references companies,
  created_at timestamp with time zone default now()
);

-- Activities table
create table activities (
  id uuid default uuid_generate_v4() primary key,
  user_id uuid references auth.users not null,
  type text not null,
  subject text not null,
  description text,
  contact_id uuid references contacts,
  deal_id uuid references deals,
  completed boolean default false,
  due_date timestamp with time zone,
  created_at timestamp with time zone default now()
);

-- Enable Row Level Security
alter table contacts enable row level security;
alter table companies enable row level security;
alter table deals enable row level security;
alter table activities enable row level security;

-- RLS Policies (user can only see their own data)
create policy "Users can view own contacts" on contacts for select using (auth.uid() = user_id);
create policy "Users can insert own contacts" on contacts for insert with check (auth.uid() = user_id);
create policy "Users can update own contacts" on contacts for update using (auth.uid() = user_id);
create policy "Users can delete own contacts" on contacts for delete using (auth.uid() = user_id);
-- (repeat for other tables)
```

## UI Requirements
- Clean, professional design
- Sidebar navigation
- Responsive (mobile-friendly)
- Loading states and error handling
- Toast notifications for actions
- Modal forms for create/edit

## File Structure
```
/src
  /components
    /ui (reusable components)
    /contacts
    /companies
    /deals
    /activities
    /dashboard
  /hooks
    useContacts.ts
    useCompanies.ts
    useDeals.ts
    useActivities.ts
  /lib
    supabase.ts
    utils.ts
  /pages (or app router)
    /dashboard
    /contacts
    /companies
    /deals
  /types
    index.ts
```

Please generate all the files needed to get this running. Start with Supabase setup, then core components.

Add email logging functionality:
- When viewing a contact, show a "Log Email" button
- Form to log sent/received emails with subject, body snippet, date
- Display emails in the activity timeline
- (Note: This logs emails manually, not automatic sync)

Add simple automation rules:
- When a deal moves to "Proposal" stage, automatically create a follow-up task for 3 days later
- When a deal is marked "Closed Won", log a celebration activity
- When a deal is inactive for 14 days, highlight it in red
- Store automation rules in a config, make it easy to add more

Add a reports page with:
- Sales by month (line chart)
- Deals by stage (pie chart)
- Average deal size
- Sales cycle length (average days from Lead to Closed)
- Top contacts by deal value
- Export reports to CSV