Mudasir Traders Battery Business Management System

Portfolio project

Mudasir Traders - Battery Business Management System

A comprehensive Next.js application for managing battery business operations including sales, inventory, customer management, and AI-powered business intelligence.

🚀 Features

📊 Dashboard & Analytics

Real-time Dashboard with key business metrics

Sales Analytics with charts and trends

Revenue Tracking and financial insights

Stock Management with low-stock alerts

Customer Analytics and purchase history

💼 Business Operations

Invoice Management - Create, edit, and manage invoices

Customer Management - Track customer details and purchase history

Dealer Management - Manage suppliers and dealer relationships

Stock Management - Real-time inventory tracking

Warranty System - Battery warranty checking and management

Brand & Category Management - Organize products effectively

🤖 AI Assistant

Intelligent Business Chat - Powered by OpenRouter Step-3.5-Flash

Natural Language Queries - Ask questions about your business data

Real-time Data Analysis - AI analyzes MongoDB data for insights

Smart Recommendations - Get business insights and suggestions

Multi-language Support - English and Urdu queries supported

🔧 Advanced Features

PDF Invoice Generation - Professional invoice creation

WhatsApp Integration - Share invoices via WhatsApp

Payment Tracking - Monitor payment status and pending amounts

Google Maps Integration - Customer location tracking

Responsive Design - Works on all devices

Authentication System - Secure user access with NextAuth.js

📱 User Interface

Modern UI/UX - Built with Tailwind CSS and Headless UI

Interactive Components - Drag-and-drop, modals, and rich interactions

Data Tables - Advanced sorting, filtering, and pagination

Charts & Visualizations - Recharts for data visualization

Dark Mode Support - Toggle between light and dark themes

🛠️ Technology Stack

Frontend

Next.js 15 - React framework with App Router

React 19 - Latest React with concurrent features

TypeScript - Type-safe development

Tailwind CSS - Utility-first CSS framework

Headless UI - Unstyled, accessible components

React Icons - Comprehensive icon library

Recharts - Chart library for data visualization

React Markdown - Markdown rendering for AI responses

Backend & Database

MongoDB - NoSQL database for business data

NextAuth.js - Authentication solution

OpenAI API - AI assistant integration via OpenRouter

PDF Generation - jsPDF for invoice creation

File Upload - Cloudinary integration for images

Development Tools

ESLint - Code linting and formatting

Prettier - Code formatting

Jest - Unit testing framework

Cypress - End-to-end testing

TypeScript - Static type checking

📁 Project Structure

src/
├── app/                    # Next.js App Router pages
│   ├── api/               # API routes
│   │   ├── ai-assistant/  # AI assistant API
│   │   ├── invoices/      # Invoice management
│   │   ├── customers/     # Customer management
│   │   ├── dealers/       # Dealer management
│   │   └── stock/         # Stock management
│   ├── dashboard/         # Dashboard pages
│   └── auth/              # Authentication pages
├── components/            # Reusable React components
│   ├── AIAssistant.tsx   # AI chat interface
│   ├── FloatingAIAssistant.tsx # Floating AI widget
│   ├── warranty/          # Warranty components
│   ├── invoice/           # Invoice components
│   └── dealers/           # Dealer management components
├── actions/               # Server actions
│   └── warrantyActions.ts # Warranty search logic
└── layouts/               # Layout components

🚀 Getting Started

Prerequisites

Node.js 18+

MongoDB database

OpenRouter API key (for AI assistant)

Installation

Clone the repository

git clone <repository-url>
cd mudasirtraders

Install dependencies

npm install

Set up environment variables

cp .env.example .env.local

Configure environment variables

# Database
MONGODB_URI=mongodb://localhost:27017/mudasirtraders

# AI Assistant
OPENROUTER_API_KEY=your_openrouter_api_key

# Authentication
NEXTAUTH_SECRET=your_nextauth_secret
NEXTAUTH_URL=http://localhost:3000

# Cloudinary (for image uploads)
CLOUDINARY_CLOUD_NAME=your_cloud_name
CLOUDINARY_API_KEY=your_api_key
CLOUDINARY_API_SECRET=your_api_secret

Run the development server

npm run dev

Open your browser Navigate to http://localhost:3000

🤖 AI Assistant Setup

Getting OpenRouter API Key

Visit OpenRouter.ai

Create an account and get your API key

Add the key to your .env.local file

Supported Queries

The AI assistant can answer questions about:

Sales Data: "What are our total sales this month?"

Revenue: "How much revenue did we generate?"

Stock Levels: "Which batteries are low in stock?"

Customer Analytics: "Who are our top customers?"

Dealer Performance: "Which dealers owe us money?"

Warranty Status: "Check warranty for battery code XYZ"

📊 Database Schema

Key Collections

invoices - Sales invoices and transactions

customers - Customer information and purchase history

dealers - Supplier and dealer management

stock - Battery inventory and stock levels

brands - Battery brands and categories

warrantyHistory - Warranty records and history

🔧 Development Scripts

# Development
npm run dev              # Start development server
npm run dev:fixed        # Fixed development mode

# Building
npm run build            # Build for production
npm run start            # Start production server

# Code Quality
npm run lint             # Run ESLint
npm run format           # Format code with Prettier

# Testing
npm run test             # Run unit tests
npm run test:watch       # Run tests in watch mode

# Custom Scripts
npm run audit:dashboard  # Audit dashboard data
npm run audit:dealers    # Audit dealer data

🎯 Key Features in Detail

AI Assistant

Natural Language Processing: Understands business queries in English and Urdu

Real-time Data Analysis: Connects directly to MongoDB for live data

Smart Context: Maintains conversation context for follow-up questions

Tool Integration: Uses database tools for accurate responses

Fallback Handling: Provides raw data if AI processing fails

Warranty System

Code Search: Fast warranty code lookup across invoices and sales

Date Calculation: Accurate remaining days calculation

History Tracking: Maintains warranty history for deleted invoices

Multi-source Search: Searches across active and archived data

Invoice Management

PDF Generation: Professional invoice PDFs with company branding

WhatsApp Sharing: Direct WhatsApp integration for invoice sharing

Payment Tracking: Monitor paid, partial, and unpaid invoices

Customer History: Complete purchase history per customer

Stock Management

Real-time Updates: Live stock level tracking

Low Stock Alerts: Automatic notifications for low inventory

Brand Management: Organize by battery brands and categories

Sales Integration: Automatic stock reduction on sales

🔒 Security Features

Authentication: Secure login with NextAuth.js

Session Management: Secure session handling

API Protection: Protected API routes

Input Validation: Comprehensive input sanitization

Database Security: Safe MongoDB operations

📱 Responsive Design

Mobile First: Optimized for mobile devices

Tablet Support: Perfect tablet experience

Desktop Layout: Full-featured desktop interface

Touch Gestures: Swipe and tap interactions

Adaptive UI: Components adapt to screen size

🚀 Deployment

Vercel (Recommended)

Push to GitHub

Connect to Vercel

Configure environment variables

Deploy automatically

Manual Deployment

npm run build
npm run start

🤝 Contributing

Fork the repository

Create a feature branch

Make your changes

Add tests if applicable

Submit a pull request

📝 License

This project is proprietary software for Mudasir Traders.

🆘 Support

For support and questions:

Check the documentation

Review the code comments

Contact the development team

Built with ❤️ for Mudasir Traders Battery Business

0 likes · 6 views · Mar 4, 2026

Developed a comprehensive management system for Mudasir Traders' battery operations.