# Phosphat Report v2

A Remix application for managing phosphat operations reports with authentication and dashboard.

- 📖 [Remix docs](https://remix.run/docs)

## Development

Run the dev server:

```sh
npm run dev
```

## Deployment

First, build your app for production:

```sh
npm run build
```

Then run the app in production mode:

```sh
npm start
```

Now you'll need to pick a host to deploy it to.

### DIY

If you're familiar with deploying Node applications, the built-in Remix app server is production-ready.

Make sure to deploy the output of `npm run build`

- `build/server`
- `build/client`

## Styling

This template comes with [Tailwind CSS](https://tailwindcss.com/) already configured for a simple default starting experience. You can use whatever css framework you prefer. See the [Vite docs on css](https://vitejs.dev/guide/features.html#css) for more information.

## Quick Start

1. Install dependencies:
```bash
npm install
```

2. Set up the database:
```bash
npx prisma generate
npx prisma db push
npx prisma db seed
```

3. Start the development server:
```bash
npm run dev
```

4. Open your browser to `http://localhost:5173`

## Default Login

After seeding, you can login with:
- **Username:** admin
- **Password:** password123
- **Auth Level:** 3 (Super Admin - Full access)

## Authentication Levels

- **Level 1:** User access (basic functionality)
- **Level 2:** Admin access (can view dashboard, reports, equipment, management pages)
- **Level 3:** Super Admin access (full system access including admin panel)

## Features

- ✅ User authentication (sign up/sign in)
- ✅ Role-based access control
- ✅ Dashboard with statistics
- ✅ Responsive design with Tailwind CSS
- ✅ SQLite database with Prisma ORM
- ✅ Session management
- ✅ Password hashing with bcrypt
- ✅ Email functionality with SMTP configuration
- ✅ Mail settings management (Auth Level 3 only)

## Database Schema

The application includes models for:
- Employees (users with auth levels)
- Reports (main data entity)
- Areas (Petra, Jarash, Rum)
- DredgerLocations (with classes s, d, sp)
- ReclamationLocations (Eastern/Western Shoreline)
- Foreman
- Equipment
- MailSettings (SMTP configuration)

## Email Functionality

The application includes email functionality using Nodemailer:

### Mail Settings (Auth Level 3 Required)
- Configure SMTP settings via `/mail-settings` route
- Test email connection
- Secure password storage

### Using the Mail Utility

```typescript
import { sendNotificationEmail, sendReportEmail } from "~/utils/mail.server";

// Send a simple notification
const result = await sendNotificationEmail(
  "user@example.com",
  "Report Generated",
  "Your report has been generated successfully."
);

// Send HTML email
const htmlResult = await sendNotificationEmail(
  ["user1@example.com", "user2@example.com"],
  "Weekly Report",
  "<h1>Weekly Report</h1><p>Please find the report attached.</p>",
  true // isHtml
);

// Send report with attachments
const reportResult = await sendReportEmail(
  "manager@example.com",
  "Daily Operations Report",
  reportData,
  [
    {
      filename: "report.pdf",
      content: pdfBuffer,
      contentType: "application/pdf"
    }
  ]
);
```

### Available Mail Functions
- `sendEmail(options)` - Core email sending function
- `sendNotificationEmail(to, subject, message, isHtml)` - Simple notifications
- `sendReportEmail(to, subject, reportData, attachments)` - Reports with attachments
- `testEmailConnection()` - Test SMTP configuration

## Development

The app uses:
- **Remix** - Full-stack web framework
- **Prisma** - Database ORM
- **SQLite** - Database
- **Tailwind CSS** - Styling
- **TypeScript** - Type safety