create-ishvexa-app 1.0.0

package/templates/smartshop-app/frontend/src/pages/ReportsPage.jsx

@@ -0,0 +1,204 @@
+import { useEffect, useState } from "react";
+import api from "../services/api";
+
+function ReportsPage() {
+  const [rows, setRows] = useState([]);
+  const [customers, setCustomers] = useState([]);
+  const [filters, setFilters] = useState({
+    date: "",
+    startDate: "",
+    endDate: "",
+    customerId: "",
+  });
+  const [fieldErrors, setFieldErrors] = useState({});
+  const [message, setMessage] = useState("");
+
+  useEffect(() => {
+    api.get("/customers").then(({ data }) => setCustomers(data)).catch(() => {});
+  }, []);
+
+  const setFilter = (key, value) => {
+    setFilters((prev) => ({ ...prev, [key]: value }));
+    setFieldErrors((prev) => ({ ...prev, [key]: "" }));
+  };
+
+  const fetchDaily = async () => {
+    setMessage("");
+    if (!filters.date) {
+      setFieldErrors({ date: "Please select a date for daily sales report." });
+      return;
+    }
+    setFieldErrors({});
+    const { data } = await api.get("/reports/daily-sales", { params: { date: filters.date } });
+    setRows(data);
+    if (!data.length) setMessage("No data found for selected daily date.");
+  };
+
+  const fetchMonthly = async () => {
+    setMessage("");
+    const errors = {};
+    if (!filters.startDate) errors.startDate = "Start date is required.";
+    if (!filters.endDate) errors.endDate = "End date is required.";
+    if (filters.startDate && filters.endDate && filters.startDate > filters.endDate) {
+      errors.endDate = "End date cannot be before start date.";
+    }
+    if (Object.keys(errors).length) {
+      setFieldErrors(errors);
+      return;
+    }
+    setFieldErrors({});
+    const { data } = await api.get("/reports/monthly-sales", {
+      params: { startDate: filters.startDate, endDate: filters.endDate },
+    });
+    setRows(data);
+    if (!data.length) setMessage("No data found for selected monthly range.");
+  };
+
+  const fetchStock = async () => {
+    setFieldErrors({});
+    setMessage("");
+    const { data } = await api.get("/reports/product-stock");
+    setRows(data);
+    if (!data.length) setMessage("No stock report data found.");
+  };
+
+  const fetchCustomerPurchases = async () => {
+    setMessage("");
+    if (!filters.customerId) {
+      setFieldErrors({ customerId: "Please select a customer from the list." });
+      return;
+    }
+    const customer = customers.find((c) => String(c.customer_id) === String(filters.customerId));
+    if (!customer) {
+      setFieldErrors({ customerId: "Selected customer is not valid." });
+      return;
+    }
+    setFieldErrors({});
+    const { data } = await api.get("/reports/customer-purchases", {
+      params: { customerName: customer.full_name },
+    });
+    setRows(data);
+    if (!data.length) setMessage("No purchases found for that customer.");
+  };
+
+  const inputClass = (key) =>
+    `w-full border bg-white p-2 text-brand-900 ${fieldErrors[key] ? "border-red-500" : "border-brand-100"}`;
+
+  return (
+    <div className="space-y-6">
+      <section className="border border-brand-100 bg-linear-to-r from-brand-900 to-brand-800 px-5 py-6 text-white shadow-sm md:px-6">
+        <h2 className="text-2xl font-bold">Reports & Analytics</h2>
+        <p className="mt-1 text-sm text-brand-100">
+          Generate daily, monthly, customer, and stock reports.
+        </p>
+      </section>
+
+      <section className="grid gap-4 border border-brand-100 bg-white p-5 shadow-sm md:grid-cols-2 lg:grid-cols-4 md:p-6">
+        <div className="space-y-2 border border-brand-100 p-3">
+          <label className="mb-1 block text-sm">Daily Date</label>
+          <input
+            type="date"
+            className={inputClass("date")}
+            value={filters.date}
+            onChange={(e) => setFilter("date", e.target.value)}
+          />
+          <button
+            onClick={fetchDaily}
+            className="mt-2 w-full border border-brand-900 bg-brand-900 p-2 text-sm font-semibold text-white"
+          >
+            Daily Sales
+          </button>
+          {fieldErrors.date && <p className="mt-2 text-sm text-red-600">{fieldErrors.date}</p>}
+        </div>
+        <div className="space-y-2 border border-brand-100 p-3">
+          <label className="mb-1 block text-sm">Start - End</label>
+          <input
+            type="date"
+            className={`mb-2 ${inputClass("startDate")}`}
+            value={filters.startDate}
+            onChange={(e) => setFilter("startDate", e.target.value)}
+          />
+          {fieldErrors.startDate && <p className="text-sm text-red-600">{fieldErrors.startDate}</p>}
+          <input
+            type="date"
+            className={inputClass("endDate")}
+            value={filters.endDate}
+            onChange={(e) => setFilter("endDate", e.target.value)}
+          />
+          {fieldErrors.endDate && <p className="text-sm text-red-600">{fieldErrors.endDate}</p>}
+          <button
+            onClick={fetchMonthly}
+            className="mt-2 w-full border border-brand-900 bg-brand-900 p-2 text-sm font-semibold text-white"
+          >
+            Monthly Sales
+          </button>
+        </div>
+        <div className="space-y-2 border border-brand-100 p-3">
+          <label className="mb-1 block text-sm">Customer</label>
+          <select
+            className={inputClass("customerId")}
+            value={filters.customerId}
+            onChange={(e) => setFilter("customerId", e.target.value)}
+          >
+            <option value="">Select customer</option>
+            {customers.map((c) => (
+              <option key={c.customer_id} value={c.customer_id}>
+                {c.full_name}
+              </option>
+            ))}
+          </select>
+          <button
+            onClick={fetchCustomerPurchases}
+            className="mt-2 w-full border border-brand-900 bg-brand-900 p-2 text-sm font-semibold text-white"
+          >
+            Customer Purchases
+          </button>
+          {fieldErrors.customerId && (
+            <p className="mt-2 text-sm text-red-600">{fieldErrors.customerId}</p>
+          )}
+        </div>
+        <div className="flex items-end border border-brand-100 p-3">
+          <button
+            onClick={fetchStock}
+            className="w-full border border-brand-900 bg-brand-900 p-2 text-sm font-semibold text-white"
+          >
+            Product Stock Report
+          </button>
+        </div>
+      </section>
+      {message && <p className="text-sm text-brand-800">{message}</p>}
+      <section className="border border-brand-100 bg-white p-5 shadow-sm md:p-6">
+        <div className="overflow-x-auto">
+          <table className="min-w-full text-sm text-brand-900">
+            <thead>
+              <tr className="bg-brand-900 text-left text-white">
+                {rows[0] &&
+                  Object.keys(rows[0]).map((key) => (
+                    <th key={key} className="px-3 py-3 font-semibold">
+                      {key}
+                    </th>
+                  ))}
+              </tr>
+            </thead>
+            <tbody>
+              {rows.map((row, idx) => (
+                <tr
+                  key={idx}
+                  className={`${idx % 2 === 0 ? "bg-white" : "bg-brand-50"} border-t border-brand-100`}
+                >
+                  {Object.values(row).map((value, i) => (
+                    <td key={i} className="px-3 py-2.5">
+                      {String(value)}
+                    </td>
+                  ))}
+                </tr>
+              ))}
+            </tbody>
+          </table>
+        </div>
+      </section>
+    </div>
+  );
+}
+
+export default ReportsPage;

package/templates/smartshop-app/frontend/src/pages/SalesPage.jsx

@@ -0,0 +1,153 @@
+import { useEffect, useState } from "react";
+import FormCard from "../components/FormCard";
+import api from "../services/api";
+
+const validateSale = (form, products) => {
+  const errors = {};
+  if (!form.customerId) errors.customerId = "Please select a customer.";
+  if (!form.productId) errors.productId = "Please select a product.";
+  if (!form.quantity || Number(form.quantity) <= 0) {
+    errors.quantity = "Quantity must be greater than 0.";
+  }
+  const selectedProduct = products.find((p) => p.product_id === Number(form.productId));
+  if (selectedProduct && Number(form.quantity) > Number(selectedProduct.quantity)) {
+    errors.quantity = "Quantity exceeds available stock.";
+  }
+  return errors;
+};
+
+function SalesPage() {
+  const [customers, setCustomers] = useState([]);
+  const [products, setProducts] = useState([]);
+  const [sales, setSales] = useState([]);
+  const [form, setForm] = useState({ customerId: "", productId: "", quantity: 1 });
+  const [fieldErrors, setFieldErrors] = useState({});
+  const [formMessage, setFormMessage] = useState("");
+
+  const load = async () => {
+    const [c, p, s] = await Promise.all([
+      api.get("/customers"),
+      api.get("/products"),
+      api.get("/sales"),
+    ]);
+    setCustomers(c.data);
+    setProducts(p.data);
+    setSales(s.data);
+  };
+
+  useEffect(() => {
+    load();
+  }, []);
+
+  const selectedProduct = products.find((p) => p.product_id === Number(form.productId));
+  const total = selectedProduct ? Number(selectedProduct.price) * Number(form.quantity || 0) : 0;
+
+  const setField = (key, value) => {
+    setForm((prev) => ({ ...prev, [key]: value }));
+    setFieldErrors((prev) => ({ ...prev, [key]: "" }));
+  };
+
+  const inputClass = (key) =>
+    `w-full border bg-white p-2.5 text-brand-900 ${fieldErrors[key] ? "border-red-500" : "border-brand-100"}`;
+
+  return (
+    <div className="grid gap-6 lg:grid-cols-3">
+      <FormCard title="Record Sale">
+        <form
+          onSubmit={async (e) => {
+            e.preventDefault();
+            setFormMessage("");
+            const errors = validateSale(form, products);
+            if (Object.keys(errors).length) {
+              setFieldErrors(errors);
+              return;
+            }
+            try {
+              await api.post("/sales", form);
+              setFormMessage("Sale recorded successfully.");
+              setForm({ customerId: "", productId: "", quantity: 1 });
+              setFieldErrors({});
+              load();
+            } catch (error) {
+              setFormMessage(error.response?.data?.message || "Unable to record sale.");
+            }
+          }}
+          className="space-y-2"
+        >
+          <select
+            value={form.customerId}
+            onChange={(e) => setField("customerId", e.target.value)}
+            className={inputClass("customerId")}
+          >
+            <option value="">Select Customer</option>
+            {customers.map((c) => (
+              <option key={c.customer_id} value={c.customer_id}>
+                {c.full_name}
+              </option>
+            ))}
+          </select>
+          {fieldErrors.customerId && <p className="text-sm text-red-600">{fieldErrors.customerId}</p>}
+          <select
+            value={form.productId}
+            onChange={(e) => setField("productId", e.target.value)}
+            className={inputClass("productId")}
+          >
+            <option value="">Select Product</option>
+            {products.map((p) => (
+              <option key={p.product_id} value={p.product_id}>
+                {p.product_name}
+              </option>
+            ))}
+          </select>
+          {fieldErrors.productId && <p className="text-sm text-red-600">{fieldErrors.productId}</p>}
+          <input
+            type="number"
+            min="1"
+            value={form.quantity}
+            onChange={(e) => setField("quantity", e.target.value)}
+            className={inputClass("quantity")}
+          />
+          {fieldErrors.quantity && <p className="text-sm text-red-600">{fieldErrors.quantity}</p>}
+          <p className="text-sm text-brand-800">Auto Total: RWF {total.toFixed(2)}</p>
+          {formMessage && <p className="text-sm text-brand-800">{formMessage}</p>}
+          <button className="w-full border border-brand-700 bg-brand-800 p-2.5 font-semibold text-white">
+            Save Sale
+          </button>
+        </form>
+      </FormCard>
+      <section className="border border-brand-100 bg-white p-5 shadow-sm lg:col-span-2 md:p-6">
+        <h2 className="mb-4 border-l-4 border-accent-500 pl-3 text-lg font-semibold text-brand-900">
+          Sales List
+        </h2>
+        <div className="overflow-auto">
+          <table className="w-full text-sm text-brand-900">
+            <thead>
+              <tr className="text-left">
+                <th>Customer</th>
+                <th>Product</th>
+                <th>Qty</th>
+                <th>Unit Price</th>
+                <th>Total</th>
+                <th>Date</th>
+              </tr>
+            </thead>
+            <tbody>
+              {sales.map((s) => (
+                <tr key={s.sale_id} className="border-t border-brand-100">
+                  <td>{s.customer_name}</td>
+                  <td>{s.product_name}</td>
+                  <td>{s.quantity}</td>
+                  <td>RWF {s.unit_price}</td>
+                  <td>RWF {s.total_price}</td>
+                  <td>{new Date(s.sale_date).toLocaleString()}</td>
+                </tr>
+              ))}
+            </tbody>
+          </table>
+        </div>
+      </section>
+    </div>
+  );
+}
+
+export default SalesPage;

package/templates/smartshop-app/frontend/src/services/api.js

@@ -0,0 +1,15 @@
+import axios from "axios";
+
+const api = axios.create({
+  baseURL: "http://localhost:5000/api",
+});
+
+api.interceptors.request.use((config) => {
+  const token = localStorage.getItem("smartshop_token");
+  if (token) {
+    config.headers.Authorization = `Bearer ${token}`;
+  }
+  return config;
+});
+
+export default api;

package/templates/smartshop-app/frontend/vite.config.js

@@ -0,0 +1,13 @@
+import { defineConfig } from "vite";
+import react, { reactCompilerPreset } from "@vitejs/plugin-react";
+import babel from "@rolldown/plugin-babel";
+import tailwindcss from "@tailwindcss/vite";
+
+// https://vite.dev/config/
+export default defineConfig({
+  plugins: [
+    react(),
+    babel({ presets: [reactCompilerPreset()] }),
+    tailwindcss(),
+  ],
+});

package/templates/srms-app/.env

@@ -0,0 +1,7 @@
+PORT=5555
+JWT_SECRET=exam_jwt_secret_change_in_production
+DB_HOST=localhost
+DB_USER=student
+DB_PASSWORD=
+DB_NAME=SRMS
+DB_PORT=3306

package/templates/srms-app/README.md

@@ -0,0 +1,82 @@
+# Sales Record Management System
+
+National Practical Exam Project
+
+## Installation
+
+```bash
+cd backend-mysql && npm install
+cd ../backend-mongodb && npm install
+cd ../frontend && npm install
+```
+
+## Database Setup (MySQL)
+
+```bash
+cd backend-mysql
+cp .env.example .env
+npm run db:init
+```
+
+## Run Development Server
+
+MySQL API (port 5555):
+
+```bash
+cd backend-mysql && npm run dev
+```
+
+MongoDB API (port 5555 — run one backend at a time):
+
+```bash
+cd backend-mongodb && npm run dev
+```
+
+Frontend (port 5173):
+
+```bash
+cd frontend && npm run dev
+```
+
+Default login: `admin` / `admin123`
+
+## Environment Variables
+
+### backend-mysql
+
+| Variable | Description |
+|----------|-------------|
+| PORT | API port (5555) |
+| JWT_SECRET | Secret for JWT tokens |
+| DB_HOST | MySQL host |
+| DB_USER | MySQL user |
+| DB_PASSWORD | MySQL password |
+| DB_NAME | Database name (SRMS) |
+| DB_PORT | MySQL port |
+
+### backend-mongodb
+
+| Variable | Description |
+|----------|-------------|
+| PORT | API port (5555) |
+| JWT_SECRET | Secret for JWT tokens |
+| MONGO_URI | MongoDB connection string |
+
+## API Endpoints
+
+- POST /api/auth/register
+- POST /api/auth/login
+- GET/POST /api/customers
+- GET/POST /api/products
+- GET/POST/PUT/DELETE /api/sales
+- GET /api/reports?period=daily|weekly|monthly&date=YYYY-MM-DD&startDate=YYYY-MM-DD&endDate=YYYY-MM-DD&month=YYYY-MM
+
+## Folder Structure
+
+```
+undefined/
+├── README.md
+├── frontend/
+├── backend-mysql/
+└── backend-mongodb/
+```

package/templates/srms-app/backend-mongodb/.env

@@ -0,0 +1,3 @@
+PORT=5555
+JWT_SECRET=exam_jwt_secret_change_in_production
+MONGO_URI=mongodb://localhost:27017/SRMS

package/templates/srms-app/backend-mongodb/.env.example

@@ -0,0 +1,3 @@
+PORT=5555
+JWT_SECRET=exam_jwt_secret_change_in_production
+MONGO_URI=mongodb://localhost:27017/SRMS

package/templates/srms-app/backend-mongodb/config/db.js

@@ -0,0 +1,29 @@
+import mongoose from "mongoose";
+import dotenv from "dotenv";
+import User from "../models/User.js";
+
+dotenv.config();
+
+const ADMIN_HASH = "$2b$10$aULsUjp9bb9lf5CZZyY.7./KhwsocVO0duyPlqu0Qnte75xHBdG5C";
+
+export const connectDatabase = async () => {
+  try {
+    await mongoose.connect(process.env.MONGO_URI || "mongodb://localhost:27017/SRMS");
+    console.log("Database Connected Successfully");
+    const count = await User.countDocuments();
+    if (count === 0) {
+      await User.create({
+        username: "admin",
+        email: "admin@exam.local",
+        password: ADMIN_HASH,
+      });
+    }
+    return true;
+  } catch (error) {
+    console.log("Database Connection Failed");
+    console.error(error.message);
+    return false;
+  }
+};
+
+export default mongoose;

package/templates/srms-app/backend-mongodb/controllers/authController.js

@@ -0,0 +1,93 @@
+import bcrypt from "bcryptjs";
+import jwt from "jsonwebtoken";
+import User from "../models/User.js";
+
+const signToken = (user) =>
+  jwt.sign(
+    { id: user._id, username: user.username },
+    process.env.JWT_SECRET || "exam_secret",
+    { expiresIn: "8h" }
+  );
+
+const normalizeEmail = (email) => String(email || "").trim().toLowerCase();
+
+export const register = async (req, res) => {
+  try {
+    const { username, email, password } = req.body;
+    if (!username || !email || !password) {
+      return res.status(400).json({ message: "Username, email and password are required." });
+    }
+    const emailNorm = normalizeEmail(email);
+    if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(emailNorm)) {
+      return res.status(400).json({ message: "Enter a valid email address." });
+    }
+    const existingUser = await User.findOne({ username: username.trim() });
+    if (existingUser) {
+      return res.status(409).json({ message: "Username already exists." });
+    }
+    const existingEmail = await User.findOne({ email: emailNorm });
+    if (existingEmail) {
+      return res.status(409).json({ message: "Email already registered." });
+    }
+    const hash = await bcrypt.hash(password, 10);
+    await User.create({ username: username.trim(), email: emailNorm, password: hash });
+    return res.status(201).json({ message: "Account created successfully." });
+  } catch {
+    return res.status(500).json({ message: "Server error during registration." });
+  }
+};
+
+export const login = async (req, res) => {
+  try {
+    const { username, password } = req.body;
+    if (!username || !password) {
+      return res.status(400).json({ message: "Username and password are required." });
+    }
+    const user = await User.findOne({ username: username.trim() });
+    if (!user) {
+      return res.status(401).json({ message: "Invalid credentials." });
+    }
+    const match = await bcrypt.compare(password, user.password);
+    if (!match) {
+      return res.status(401).json({ message: "Invalid credentials." });
+    }
+    return res.json({
+      message: "Login successful.",
+      token: signToken(user),
+      user: { id: user._id, username: user.username, email: user.email },
+    });
+  } catch {
+    return res.status(500).json({ message: "Server error during login." });
+  }
+};
+
+export const forgotPassword = async (req, res) => {
+  try {
+    const { email, newPassword, confirmPassword } = req.body;
+    if (!email) {
+      return res.status(400).json({ success: false, message: "Email is required." });
+    }
+    if (!newPassword) {
+      return res.status(400).json({ success: false, message: "New password is required." });
+    }
+    if (!confirmPassword) {
+      return res.status(400).json({ success: false, message: "Confirm password is required." });
+    }
+    if (newPassword !== confirmPassword) {
+      return res.status(400).json({
+        success: false,
+        message: "New password and confirm password must match.",
+      });
+    }
+    const emailNorm = normalizeEmail(email);
+    const user = await User.findOne({ email: emailNorm });
+    if (!user) {
+      return res.status(404).json({ success: false, message: "User not found" });
+    }
+    user.password = await bcrypt.hash(newPassword, 10);
+    await user.save();
+    return res.json({ success: true, message: "Password reset successfully" });
+  } catch {
+    return res.status(500).json({ success: false, message: "Server error." });
+  }
+};

package/templates/srms-app/backend-mongodb/controllers/customerController.js

@@ -0,0 +1,27 @@
+import Customer from "../models/Customer.js";
+
+export const create = async (req, res) => {
+  try {
+    if (req.body.customerNumber === undefined || req.body.customerNumber === "") return res.status(400).json({ message: "Customer Number is required." });
+    if (req.body.firstName === undefined || req.body.firstName === "") return res.status(400).json({ message: "First Name is required." });
+    if (req.body.lastName === undefined || req.body.lastName === "") return res.status(400).json({ message: "Last Name is required." });
+    if (req.body.telephone === undefined || req.body.telephone === "") return res.status(400).json({ message: "Telephone is required." });
+    if (req.body.address === undefined || req.body.address === "") return res.status(400).json({ message: "Address is required." });
+    await Customer.create({ customer_number: req.body.customerNumber, first_name: req.body.firstName, last_name: req.body.lastName, telephone: req.body.telephone, address: req.body.address });
+    return res.status(201).json({ message: "Customer added successfully." });
+  } catch (error) {
+    if (error.code === 11000) {
+      return res.status(409).json({ message: "Customer already exists." });
+    }
+    return res.status(500).json({ message: "Failed to add customer." });
+  }
+};
+
+export const getAll = async (_req, res) => {
+  try {
+    const rows = await Customer.find().sort({ customer_number: -1 }).lean();
+    return res.json(rows.map((r) => { const { _id, __v, ...rest } = r; return rest; }));
+  } catch {
+    return res.status(500).json({ message: "Failed to fetch customer records." });
+  }
+};

package/templates/srms-app/backend-mongodb/controllers/productController.js

@@ -0,0 +1,26 @@
+import Product from "../models/Product.js";
+
+export const create = async (req, res) => {
+  try {
+    if (req.body.productCode === undefined || req.body.productCode === "") return res.status(400).json({ message: "Product Code is required." });
+    if (req.body.productName === undefined || req.body.productName === "") return res.status(400).json({ message: "Product Name is required." });
+    if (req.body.quantitySold === undefined || req.body.quantitySold === "") return res.status(400).json({ message: "Quantity Sold is required." });
+    if (req.body.unitPrice === undefined || req.body.unitPrice === "") return res.status(400).json({ message: "Unit Price is required." });
+    await Product.create({ product_code: req.body.productCode, product_name: req.body.productName, quantity_sold: req.body.quantitySold, unit_price: req.body.unitPrice });
+    return res.status(201).json({ message: "Product added successfully." });
+  } catch (error) {
+    if (error.code === 11000) {
+      return res.status(409).json({ message: "Product already exists." });
+    }
+    return res.status(500).json({ message: "Failed to add product." });
+  }
+};
+
+export const getAll = async (_req, res) => {
+  try {
+    const rows = await Product.find().sort({ product_code: -1 }).lean();
+    return res.json(rows.map((r) => { const { _id, __v, ...rest } = r; return rest; }));
+  } catch {
+    return res.status(500).json({ message: "Failed to fetch product records." });
+  }
+};