Manufacturing Management System

A modern manufacturing management system for tracking product production, inventory management, and customer orders. Built with Next.js 14, Supabase, and shadcn/ui with a clean white and orange color scheme.

Features

• 🔐 Authentication - Secure email/password authentication with Supabase Auth
• 📊 Dashboard - Real-time metrics for active orders, pending requests, and low stock alerts
• 👥 Customer Management - Add, edit, and manage customer information
• 📦 Inventory Management - Track items with quantity adjustments and low stock alerts
• 🏭 Product Management - Create products with bill of materials (item requirements)
• 🔄 Manufacturing Workflow - Complete order lifecycle from request → start → complete/cancel
• 📉 Inventory Deduction - Automatic inventory management when manufacturing starts/cancels

Color Scheme

• Primary: Orange (#FF6B35)
• Background: White (#FFFFFF)
• Status Badges:
  • Requested: Light orange
  • In Progress: Solid orange
  • Completed: Green
  • Cancelled: Gray

Tech Stack

• Frontend: Next.js 14 (App Router, TypeScript)
• Backend/Database: Supabase (PostgreSQL, Auth, Real-time)
• UI Components: shadcn/ui (Tailwind CSS based)
• State Management: React Server Components + Server Actions
• Authentication: Supabase Auth (email/password)

Setup Instructions

1. Install Dependencies

npm install

2. Create Supabase Project

1. Go to supabase.com and create a new project
2. Wait for the project to be ready (~2 minutes)
3. Go to Settings > API and copy:
   • Project URL
   • anon/public key

3. Configure Environment Variables

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

NEXT_PUBLIC_SUPABASE_URL=your_supabase_url_here
NEXT_PUBLIC_SUPABASE_ANON_KEY=your_supabase_anon_key_here

4. Set Up Database

1. Go to your Supabase project dashboard
2. Click on SQL Editor in the left sidebar
3. Create a new query
4. Copy the contents of supabase/schema.sql and paste it
5. Click Run to execute the SQL

This will create:

• All required tables (customers, items, products, product_items, manufacturing_orders, inventory_transactions)
• Custom types (order_status, transaction_type)
• Functions and triggers
• Row Level Security (RLS) policies

5. Run the Development Server

npm run dev

Open http://localhost:3000 in your browser.

6. Create Your First Account

1. Navigate to /signup
2. Enter your email, name, and password
3. Check your email for verification (if email confirmation is enabled in Supabase)
4. Log in and start using the application

Project Structure

src/
├── app/
│   ├── (dashboard)/          # Protected dashboard routes
│   │   ├── dashboard/        # Main dashboard
│   │   ├── customers/        # Customer management
│   │   ├── items/            # Inventory management
│   │   ├── products/         # Product management
│   │   └── manufacturing/    # Manufacturing orders
│   ├── login/                # Login page
│   └── signup/               # Signup page
├── components/
│   ├── ui/                   # shadcn/ui components
│   ├── dashboard/            # Dashboard components
│   ├── customers/            # Customer components
│   ├── items/                # Item components
│   ├── products/             # Product components
│   └── manufacturing/        # Manufacturing components
├── lib/
│   ├── supabase/             # Supabase client configuration
│   ├── contexts/             # React contexts (Auth)
│   ├── actions/              # Server actions
│   └── utils.ts              # Utility functions
└── types/
    └── database.types.ts     # TypeScript types

Manufacturing Workflow

┌─────────────┐     ┌──────────────┐     ┌───────────────┐
│  REQUESTED  │ ──> │ IN_PROGRESS  │ ──> │   COMPLETED   │
└─────────────┘     └──────────────┘     └───────────────┘
       │                    │
       │                    │
       v                    v
┌─────────────────────────────────────┐
│            CANCELLED                │
└─────────────────────────────────────┘

1. Create Order - Select customer, product, and quantity
2. Start Manufacturing - Inventory is automatically deducted
3. Complete - Mark order as finished
4. Cancel - If in_progress, inventory is restored

Available Scripts

npm run dev      # Start development server
npm run build    # Build for production
npm run start    # Start production server
npm run lint     # Run ESLint

License

MIT