# WFDASH - Business CRM

A modern business CRM built with Next.js 16, shadcn/ui, Tailwind CSS 4, and PocketBase.

## Tech Stack

- **Frontend**: Next.js 16 (App Router), React 19, TypeScript
- **UI**: shadcn/ui, Tailwind CSS 4, Lucide Icons
- **Backend**: PocketBase (database, auth, file storage, realtime)
- **Notifications**: Sonner

## Getting Started

### Prerequisites

- Node.js 18+
- PocketBase server running at `http://127.0.0.1:8090`

### Installation

```bash
npm install
```

### PocketBase Setup

1. Start PocketBase:
```bash
./pocketbase serve
```

2. Create an admin account in the PocketBase admin UI

3. Set environment variables:
```bash
export PB_ADMIN_EMAIL=admin@example.com
export PB_ADMIN_PASSWORD=your_password
```

4. Run the setup script to create collections:
```bash
npm run setup
```

### Environment Variables

Create `.env.local`:
```
NEXT_PUBLIC_POCKETBASE_URL=http://127.0.0.1:8090
```

### Development

```bash
npm run dev
```

## Features

- **Customers**: Full CRUD with search, pagination, CSV export
- **Companies**: Full CRUD with detail pages
- **Suppliers**: Full CRUD with tag support
- **Quotes**: Line items with auto-calculations, status workflow
- **Orders**: PO generation, supplier grouping
- **Dashboard**: Real-time stats, recent activity
- **Auth**: Login, register, password reset
- **Dark/Light Mode**: Theme switching
- **Mobile Responsive**: Collapsible sidebar, card views on mobile

## Collections

- `customers` - Customer database
- `companies` - Company database
- `suppliers` - Supplier network
- `quotes` - Quotes with line items
- `orders` - Orders with PO generation

## Project Structure

```
src/
├── app/
│   ├── (auth)/          # Auth pages (login, register)
│   └── (app)/           # Protected app pages
│       ├── dashboard/   # Dashboard
│       ├── customers/   # Customer management
│       ├── companies/   # Company management
│       ├── suppliers/   # Supplier management
│       ├── quotes/      # Quote management
│       └── orders/      # Order management
├── components/
│   ├── ui/              # shadcn/ui components
│   ├── sidebar.tsx      # Navigation sidebar
│   ├── auth-provider.tsx # Auth context
│   ├── theme-provider.tsx # Theme context
│   └── ...              # Form and table components
└── lib/
    ├── pocketbase.ts    # PocketBase client
    ├── pb-helpers.ts    # Helper functions
    ├── types.ts         # TypeScript types
    └── utils.ts         # Utility functions
```